From 18b6409557d3be08c452dc1bdaecaf96747c9adf Mon Sep 17 00:00:00 2001
From: Matthias Jentsch <matthias.jentsch@netways.de>
Date: Tue, 29 Sep 2015 19:29:43 +0200
Subject: [PATCH] Add new layout for comment view

refs #5543
---
 .../views/scripts/comment/show.phtml          |  6 +-
 .../views/scripts/comments/show.phtml         |  2 +-
 .../views/scripts/hosts/show.phtml            |  4 +-
 .../views/scripts/list/comments.phtml         | 67 ++---------------
 .../comment/comment-description.phtml         |  7 +-
 .../partials/comment/comment-detail.phtml     | 74 +++++++++++++++----
 .../partials/comment/comment-header.phtml     | 10 +--
 .../partials/comment/comments-header.phtml    | 18 ++---
 .../partials/host/objects-header.phtml        |  7 +-
 .../partials/service/objects-header.phtml     |  6 +-
 modules/monitoring/public/css/tables.less     | 18 +++++
 11 files changed, 116 insertions(+), 103 deletions(-)

diff --git a/modules/monitoring/application/views/scripts/comment/show.phtml b/modules/monitoring/application/views/scripts/comment/show.phtml
index 17e72e7c94..7dee4fcfa1 100644
--- a/modules/monitoring/application/views/scripts/comment/show.phtml
+++ b/modules/monitoring/application/views/scripts/comment/show.phtml
@@ -9,10 +9,10 @@
 </div>
 <div class="content">
 
-<h3><?= $this->translate('Comment detail information') ?></h3>
-<table class="avp">
+<h2><?= $this->translate('Comment detail information') ?></h2>
+<table class="name-value-table">
   <tbody>
-    <tr data-base-target='_next'>
+    <tr>
       <?php if ($this->comment->objecttype === 'service'): ?>
         <th> <?= $this->translate('Service') ?> </th>
         <td>
diff --git a/modules/monitoring/application/views/scripts/comments/show.phtml b/modules/monitoring/application/views/scripts/comments/show.phtml
index d1c8431eee..67e1c6be1b 100644
--- a/modules/monitoring/application/views/scripts/comments/show.phtml
+++ b/modules/monitoring/application/views/scripts/comments/show.phtml
@@ -6,7 +6,7 @@
 </div>
 
 <div class="content multi-commands">
-    <h3><?= $this->icon('reschedule') ?><?= $this->translate('Commands') ?></h3>
+    <h2><?= $this->translate('Commands') ?></h2>
     <?= $this->qlink(
         sprintf($this->translate('Remove %d comments'), $comments->count()),
         $removeAllLink,
diff --git a/modules/monitoring/application/views/scripts/hosts/show.phtml b/modules/monitoring/application/views/scripts/hosts/show.phtml
index 053c445201..fe336f101a 100644
--- a/modules/monitoring/application/views/scripts/hosts/show.phtml
+++ b/modules/monitoring/application/views/scripts/hosts/show.phtml
@@ -11,10 +11,10 @@
 </div>
 
 <div class="content multi-commands">
-    <h3>
+    <h2>
         <?= $this->icon('reschedule') ?>
         <?= $this->translate('Commands') ?>
-    </h3>
+    </h2>
 
     <p>
     <?= sprintf($this->translatePlural(
diff --git a/modules/monitoring/application/views/scripts/list/comments.phtml b/modules/monitoring/application/views/scripts/list/comments.phtml
index 5cd7d298b8..759e47feaa 100644
--- a/modules/monitoring/application/views/scripts/list/comments.phtml
+++ b/modules/monitoring/application/views/scripts/list/comments.phtml
@@ -13,77 +13,26 @@
 <?php endif ?>
 <div class="content">
   <table data-base-target="_next"
-         class="action comments multiselect"
+         class="action action-table comments multiselect"
          data-icinga-multiselect-url="<?= $this->href('monitoring/comments/show'); ?>"
          data-icinga-multiselect-related="<?= $this->href("monitoring/comments") ?>"
          data-icinga-multiselect-data="comment_id">
     <tbody>
     <?php foreach ($comments->peekAhead($this->compact) as $comment): ?>
       <tr class="state invalid">
-        <td class="state" style="width: 12em;">
+        <td class="comment-col">
           <?= $this->partial('partials/comment/comment-description.phtml', array('comment' => $comment)); ?>
         </td>
         <td>
-        <?php if ($comment->objecttype === 'service'): ?>
-          <?= $this->icon('service', $this->translate('Service')); ?> <?= $this->qlink(
-            $this->escape($comment->host_display_name) . ': ' . $this->escape($comment->service_display_name),
-            'monitoring/comment/show',
-            array('comment_id' => $comment->id),
-            array(
-              'title' => sprintf(
-                $this->translate('Show detailed information for this comment about service %s on host %s'),
-                $comment->service_display_name,
-                $comment->host_display_name
-              ),
-              'class' => 'rowaction'
-            )
-          ); ?>
-        <?php else: ?>
-          <?= $this->icon('host', $this->translate('Host')); ?> <?= $this->qlink(
-            $this->escape($comment->host_display_name),
-            'monitoring/comment/show',
-            array('comment_id' => $comment->id),
-            array(
-              'title' => sprintf(
-                $this->translate('Show detailed information for this comment about host %s'),
-                $comment->host_display_name
-              ),
-              'class' => 'rowaction'
-            )
-          ); ?>
-        <?php endif ?>
-          <br>
-          <?= $this->icon('comment', $this->translate('Comment')); ?> <?= isset($comment->author)
-            ? '[' . $this->escape($comment->author) . '] '
-            : '';
-          ?><?= $this->escape($comment->comment); ?>
-          <br>
-          <?= $comment->persistent
-            ? $this->translate('This comment is persistent.')
-            : $this->translate('This comment is not persistent.');
-          ?>
-          <br>
-          <?= $comment->expiration ? sprintf(
-              $this->translate('This comment expires %s.'),
-              $this->timeUntil($comment->expiration)
-          ) : $this->translate('This comment does not expire.'); ?>
-        </td>
-        <?php if (isset($delCommentForm)): // Form is unset if the current user lacks the respective permission ?>
-        <td style="width: 2em" data-base-target="_self">
-          <?php
-          $delCommentForm = clone $delCommentForm;
-          $delCommentForm->populate(
+          <?= $this->partial(
+              'partials/comment/comment-detail.phtml',
               array(
-                  'comment_id' => $comment->id,
-                  'comment_is_service' => isset($comment->service_description)
-              )
-          );
-          echo $delCommentForm;
-          ?>
+                  'comment'        => $comment,
+                  'delCommentForm' => $delCommentForm // Form is unset if the current user lacks the respective permission
+          )) ?>
         </td>
-        <?php endif ?>
       </tr>
-<?php endforeach ?>
+    <?php endforeach ?>
     </tbody>
   </table>
 <?php if (! $comments->hasResult()): ?>
diff --git a/modules/monitoring/application/views/scripts/partials/comment/comment-description.phtml b/modules/monitoring/application/views/scripts/partials/comment/comment-description.phtml
index da0ce7886d..b2ad29eadb 100644
--- a/modules/monitoring/application/views/scripts/partials/comment/comment-description.phtml
+++ b/modules/monitoring/application/views/scripts/partials/comment/comment-description.phtml
@@ -22,7 +22,6 @@ switch ($comment->type) {
         break;
 }
 ?>
-<strong><?= $this->escape($title) ?></strong>
-<br>
-<?= $this->icon($icon, $tooltip) ?>
-<?= $this->timeAgo($comment->timestamp, $this->compact) ?>
+<span style="font-size: 1.8em">
+    <?= $this->icon($icon, $tooltip); ?>
+</span>
diff --git a/modules/monitoring/application/views/scripts/partials/comment/comment-detail.phtml b/modules/monitoring/application/views/scripts/partials/comment/comment-detail.phtml
index 9d5da0648d..1b78fbcf0a 100644
--- a/modules/monitoring/application/views/scripts/partials/comment/comment-detail.phtml
+++ b/modules/monitoring/application/views/scripts/partials/comment/comment-detail.phtml
@@ -1,17 +1,59 @@
-<?php if ($comment->objecttype === 'service'): ?>
-    <?= $this->icon('service', $this->translate('Service')) ?>
-    <?= sprintf(
-        '%s: %s',
-        $comment->host_display_name,
-        $comment->service_display_name
-    ) ?>
-<?php else: ?>
-    <?= $this->icon('host', $this->translate('Host')) ?>
-    <?= $this->link()->host($comment->host_name, $comment->host_display_name) ?>
-<?php endif ?>
+<span class="comment-header">
+    <?php if ($comment->objecttype === 'service'): ?>
+        <?= $this->icon('service', $this->translate('Service')); ?> <?= $this->qlink(
+            $this->escape($comment->host_display_name) . ': ' . $this->escape($comment->service_display_name),
+            'monitoring/comment/show',
+            array('comment_id' => $comment->id),
+            array(
+               'title' => sprintf(
+                    $this->translate('Show detailed information for this comment about service %s on host %s'),
+                    $comment->service_display_name,
+                    $comment->host_display_name
+                ),
+                'class' => 'rowaction'
+            )
+        ); ?>
+    <?php else: ?>
+        <?= $this->icon('host', $this->translate('Host')); ?> <?= $this->qlink(
+            $this->escape($comment->host_display_name),
+            'monitoring/comment/show',
+            array('comment_id' => $comment->id),
+            array(
+                'title' => sprintf(
+                    $this->translate('Show detailed information for this comment about host %s'),
+                    $comment->host_display_name
+                ),
+                'class' => 'rowaction'
+            )
+        ); ?>
+     <?php endif ?>
+  <?= $this->translate('by') ?>
+  <?= $this->escape($comment->author) ?>
+
+  <?= $this->timeAgo($comment->timestamp) ?>
+
+  <span class="pull-right" data-base-target="_self">
+    <?= $comment->persistent ? $this->icon('attach', 'This comment is persistent.') : ''; ?>
+    <?= $comment->expiration ? $this->icon('clock', sprintf(
+        $this->translate('This comment expires %s.'),
+        $this->timeUntil($comment->expiration)
+    )) : '' ?>
+    <?php
+        if (isset($delCommentForm)) {
+            $delCommentForm = clone $delCommentForm;
+            $delCommentForm->populate(
+                array(
+                    'comment_id' => $comment->id,
+                    'comment_is_service' => isset($comment->service_description)
+                )
+            );
+            echo $delCommentForm;
+        }
+     ?>
+  </span>
+</span>
+
 <br>
-<?= $this->icon('comment', $this->translate('Comment')) ?>
-<?php if (isset($comment->author)): ?>
-    [<?= $this->escape($comment->author) ?>]
-<?php endif ?>
-<?= $this->escape($comment->comment) ?>
+<span class="comment-content">
+    <?= $this->escape($comment->comment) ?>
+</span>
diff --git a/modules/monitoring/application/views/scripts/partials/comment/comment-header.phtml b/modules/monitoring/application/views/scripts/partials/comment/comment-header.phtml
index c3e0fadda4..3dcb479cd1 100644
--- a/modules/monitoring/application/views/scripts/partials/comment/comment-header.phtml
+++ b/modules/monitoring/application/views/scripts/partials/comment/comment-header.phtml
@@ -1,10 +1,10 @@
-<table class="action">
-  <tr class="state invalid">
-    <td class="state" style="width: 12em;">
-        <?= $this->render('partials/comment/comment-description.phtml'); ?>
+<table>
+  <tr>
+    <td class="comment-col">
+        <?= $this->render('partials/comment/comment-description.phtml') ?>
     </td>
     <td>
-        <?= $this->render('partials/comment/comment-detail.phtml'); ?>
+        <?= $this->render('partials/comment/comment-detail.phtml') ?>
     </td>
   </tr>
 </table>
diff --git a/modules/monitoring/application/views/scripts/partials/comment/comments-header.phtml b/modules/monitoring/application/views/scripts/partials/comment/comments-header.phtml
index 6d5ba8f883..68cc1f9584 100644
--- a/modules/monitoring/application/views/scripts/partials/comment/comments-header.phtml
+++ b/modules/monitoring/application/views/scripts/partials/comment/comments-header.phtml
@@ -1,4 +1,4 @@
-<table class="action" data-base-target="_next">
+<table>
     <tbody>
     <?php
     foreach ($comments as $i => $comment):
@@ -6,14 +6,14 @@
             break;
         }
     ?>
-        <tr class="state invalid">
-            <td class="state" style="width: 12em;">
-                <?= $this->partial('partials/comment/comment-description.phtml', array('comment' => $comment)) ?>
-            </td>
-            <td>
-                <?= $this->partial('partials/comment/comment-detail.phtml', array('comment' => $comment)) ?>
-            </td>
-        </tr>
+    <tr>
+        <td class="comment-col">
+            <?= $this->partial('partials/comment/comment-description.phtml', array('comment' => $comment)) ?>
+        </td>
+        <td>
+            <?= $this->partial('partials/comment/comment-detail.phtml', array('comment' => $comment)) ?>
+        </td>
+    </tr>
     <?php endforeach ?>
     </tbody>
 </table>
diff --git a/modules/monitoring/application/views/scripts/partials/host/objects-header.phtml b/modules/monitoring/application/views/scripts/partials/host/objects-header.phtml
index bce62db6ba..0a3fdbaf67 100644
--- a/modules/monitoring/application/views/scripts/partials/host/objects-header.phtml
+++ b/modules/monitoring/application/views/scripts/partials/host/objects-header.phtml
@@ -14,8 +14,11 @@ $i = 0;
             }
             ?>
 
-            <tr class="state <?= Host::getStateText($host->host_state); ?><?= $host->host_handled ? ' handled' : '' ?>">
-                <td class="state"><?= Host::getStateText($host->host_state, true); ?><br /></td>
+            <tr>
+                <td class="state-col state-<?= Host::getStateText($host->host_state); ?><?= $host->host_handled ? ' handled' : '' ?>">
+                    <?= Host::getStateText($host->host_state, true); ?>
+                    <br />
+                </td>
                 <td>
                 <?= $this->iconImage()->host($host) ?>
                 <?= implode(' ', $this->hostFlags($host)) ?>
diff --git a/modules/monitoring/application/views/scripts/partials/service/objects-header.phtml b/modules/monitoring/application/views/scripts/partials/service/objects-header.phtml
index 907e7b3494..d75de6029d 100644
--- a/modules/monitoring/application/views/scripts/partials/service/objects-header.phtml
+++ b/modules/monitoring/application/views/scripts/partials/service/objects-header.phtml
@@ -12,8 +12,10 @@ $i = 0;
             continue;
         }
         ?>
-        <tr class="state <?= Service::getStateText($service->service_state); ?><?= $service->service_handled ? ' handled' : '' ?>">
-            <td class="state"><?= Service::getStateText($service->service_state, true); ?><br /></td>
+        <tr>
+            <td class="state-col state-<?= Service::getStateText($service->service_state); ?><?= $service->service_handled ? ' handled' : '' ?>"?>
+                <?= Service::getStateText($service->service_state, true); ?><br />
+            </td>
             <td>
             <?= $this->iconImage()->service($service) ?>
             <?= implode(' ', $this->serviceFlags($service)) ?>
diff --git a/modules/monitoring/public/css/tables.less b/modules/monitoring/public/css/tables.less
index d8ede21636..07413ae029 100644
--- a/modules/monitoring/public/css/tables.less
+++ b/modules/monitoring/public/css/tables.less
@@ -68,3 +68,21 @@
   text-align: center;
   width: 100px;
 }
+
+.comment-col {
+  padding-top: 0.5em;
+  vertical-align: top;
+  width: 3em;
+}
+
+.comment-content {
+  line-height: 1.5em;
+  padding-top: 0.4em;
+  padding-bottom: 0.7em;
+  max-width: 15em;
+  color: @text-color-light;
+}
+
+.comment-header {
+  line-height: 1.8em;
+}