Implement new layout for service multi-view

refs #8565
2025-10-31 11:24:51 +01:00 · 2015-03-05 18:32:38 +01:00 · 2015-03-05 18:32:38 +01:00 · 860cc59155
commit 860cc59155
parent e2887df03e
12 changed files with 425 additions and 172 deletions
--- a/modules/monitoring/application/controllers/HostsController.php
+++ b/modules/monitoring/application/controllers/HostsController.php
@ -77,7 +77,8 @@ class Monitoring_HostsController extends Controller
                    count($this->hostList)
                ),
                'label' => $this->translate('Hosts'),
-                'url'   => Url::fromRequest()
+                'url'   => Url::fromRequest(),
+                'icon'  => 'host'
            )
        )->activate('show');
        $this->setAutorefreshInterval(15);
--- a/modules/monitoring/application/controllers/ServicesController.php
+++ b/modules/monitoring/application/controllers/ServicesController.php
@ -10,6 +10,7 @@ use Icinga\Module\Monitoring\Forms\Command\Object\ProcessCheckResultCommandForm;
 use Icinga\Module\Monitoring\Forms\Command\Object\RemoveAcknowledgementCommandForm;
 use Icinga\Module\Monitoring\Forms\Command\Object\ScheduleServiceCheckCommandForm;
 use Icinga\Module\Monitoring\Forms\Command\Object\ScheduleServiceDowntimeCommandForm;
+use Icinga\Module\Monitoring\Forms\Command\Object\DeleteDowntimeCommandForm;
 use Icinga\Module\Monitoring\Object\Host;
 use Icinga\Module\Monitoring\Object\Service;
 use Icinga\Module\Monitoring\Object\ServiceList;
@ -28,6 +29,19 @@ class Monitoring_ServicesController extends Controller
        $serviceList = new ServiceList($this->backend);
        $serviceList->setFilter(Filter::fromQueryString((string) $this->params->without('service_problem', 'service_handled')));
        $this->serviceList = $serviceList;
+        $this->view->listAllLink = Url::fromRequest()->setPath('monitoring/list/services');
+        $this->getTabs()->add(
+            'show',
+            array(
+                'title' => sprintf(
+                    $this->translate('Show summarized information for %u services'),
+                    count($this->serviceList)
+                ),
+                'label' => $this->translate('Services'),
+                'url'   => Url::fromRequest(),
+                'icon' => 'services'
+            )
+        )->activate('show');
    }

    protected function handleCommandForm(ObjectsCommandForm $form)
@ -40,7 +54,11 @@ class Monitoring_ServicesController extends Controller
            'service_problem',
            'service_handled',
            'service_acknowledged',
-            'service_in_downtime'
+            'service_in_downtime',
+            'service_is_flapping',
+            'service_notifications_enabled',
+            'service_output',
+            'service_last_ack'
        ));

        $form
@ -90,17 +108,6 @@ class Monitoring_ServicesController extends Controller

    public function showAction()
    {
-        $this->getTabs()->add(
-            'show',
-            array(
-                'title' => sprintf(
-                    $this->translate('Show summarized information for %u services'),
-                    count($this->serviceList)
-                ),
-                'label' => $this->translate('Services'),
-                'url'   => Url::fromRequest()
-            )
-        )->activate('show');
        $this->setAutorefreshInterval(15);
        $checkNowForm = new CheckNowCommandForm();
        $checkNowForm
@ -109,15 +116,21 @@ class Monitoring_ServicesController extends Controller
        $this->view->checkNowForm = $checkNowForm;
        $this->serviceList->setColumns(array(
            'host_name',
+            'host_output',
            'host_state',
+            'service_output',
            'service_description',
            'service_state',
            'service_problem',
            'service_handled',
            'service_acknowledged',
-            'service_in_downtime'/*,
-            'service_passive_checks_enabled',
+            'service_in_downtime',
+            'service_is_flapping',
            'service_notifications_enabled',
+            'service_last_comment',
+            'service_last_ack'
+            /*,
+            'service_passive_checks_enabled',
            'service_event_handler_enabled',
            'service_flap_detection_enabled',
            'service_active_checks_enabled',
@ -129,22 +142,34 @@ class Monitoring_ServicesController extends Controller
        $objectsInDowntime = array();
        $downtimeFilterExpressions = array();
        $serviceStates = array(
-            Service::getStateText(Service::STATE_OK) => 0,
-            Service::getStateText(Service::STATE_WARNING) => 0,
-            Service::getStateText(Service::STATE_CRITICAL) => 0,
-            Service::getStateText(Service::STATE_UNKNOWN) => 0,
-            Service::getStateText(Service::STATE_PENDING) => 0
+            'services_' . Service::getStateText(Service::STATE_OK) => 0,
+            'services_' . Service::getStateText(Service::STATE_OK) . '_unhandled' => 0,
+            'services_' . Service::getStateText(Service::STATE_WARNING) => 0,
+            'services_' . Service::getStateText(Service::STATE_WARNING) . '_unhandled' => 0,
+            'services_' . Service::getStateText(Service::STATE_CRITICAL) => 0,
+            'services_' . Service::getStateText(Service::STATE_CRITICAL) . '_unhandled' => 0,
+            'services_' .  Service::getStateText(Service::STATE_UNKNOWN) => 0,
+            'services_' .  Service::getStateText(Service::STATE_UNKNOWN) . '_unhandled' => 0,
+            'services_' .  Service::getStateText(Service::STATE_PENDING) => 0,
+            'services_' .  Service::getStateText(Service::STATE_PENDING) . '_unhandled' => 0
        );
        $knownHostStates = array();
        $hostStates = array(
-            Host::getStateText(Host::STATE_UP) => 0,
-            Host::getStateText(Host::STATE_DOWN) => 0,
-            Host::getStateText(Host::STATE_UNREACHABLE) => 0,
-            Host::getStateText(Host::STATE_PENDING) => 0,
+            'hosts_' . Host::getStateText(Host::STATE_UP) => 0,
+            'hosts_' . Host::getStateText(Host::STATE_UP) . '_unhandled' => 0,
+            'hosts_' . Host::getStateText(Host::STATE_DOWN) => 0,
+            'hosts_' . Host::getStateText(Host::STATE_DOWN) . '_unhandled' => 0,
+            'hosts_' . Host::getStateText(Host::STATE_UNREACHABLE) => 0,
+            'hosts_' . Host::getStateText(Host::STATE_UNREACHABLE) . '_unhandled' => 0,
+            'hosts_' . Host::getStateText(Host::STATE_PENDING) => 0,
+            'hosts_' . Host::getStateText(Host::STATE_PENDING) . '_unhandled' => 0
        );
        foreach ($this->serviceList as $service) {
+            $unhandled = false;
+
            /** @var Service $service */
            if ((bool) $service->problem === true && (bool) $service->handled === false) {
+                $unhandled = true;
                $unhandledObjects[] = $service;
                $unhandledFilterExpressions[] = Filter::matchAll(
                    Filter::where('host', $service->getHost()->getName()),
@ -161,10 +186,11 @@ class Monitoring_ServicesController extends Controller
                    Filter::where('downtime_service', $service->getName())
                );
            }
-            ++$serviceStates[$service::getStateText($service->state)];
+
+            ++$serviceStates['services_' . $service::getStateText($service->state) . ($unhandled ? '_unhandled' : '')];
            if (! isset($knownHostStates[$service->getHost()->getName()])) {
                $knownHostStates[$service->getHost()->getName()] = true;
-                ++$hostStates[$service->getHost()->getStateText($service->host_state)];
+                ++$hostStates['hosts_' . $service->getHost()->getStateText($service->host_state)];
            }
        }
        if (! empty($acknowledgedObjects)) {
@ -174,15 +200,20 @@ class Monitoring_ServicesController extends Controller
                ->handleRequest();
            $this->view->removeAckForm = $removeAckForm;
        }
+        if (! empty($objectsInDowntime)) {
+            $removeDowntimeForm = new DeleteDowntimeCommandForm();
+            $removeDowntimeForm->setObjects($objectsInDowntime)
+                ->handleRequest();
+            $this->view->removeDowntimeForm = $removeDowntimeForm;
+        }
        $this->setAutorefreshInterval(15);
-        $this->view->listAllLink = Url::fromRequest()->setPath('monitoring/list/services');
        $this->view->rescheduleAllLink = Url::fromRequest()->setPath('monitoring/services/reschedule-check');
        $this->view->downtimeAllLink = Url::fromRequest()->setPath('monitoring/services/schedule-downtime');
        $this->view->processCheckResultAllLink = Url::fromRequest()->setPath(
            'monitoring/services/process-check-result'
        );
-        $this->view->hostStates = $hostStates;
-        $this->view->serviceStates = $serviceStates;
+        $this->view->hostStates = (object)$hostStates;
+        $this->view->serviceStates = (object)$serviceStates;
        $this->view->objects = $this->serviceList;
        $this->view->unhandledObjects = $unhandledObjects;
        $unhandledFilterQueryString = Filter::matchAny($unhandledFilterExpressions)->toQueryString();
@ -196,6 +227,7 @@ class Monitoring_ServicesController extends Controller
            ->setQueryString(Filter::matchAny($downtimeFilterExpressions)->toQueryString());
        $this->view->commentsLink = Url::fromRequest()
            ->setPath('monitoring/list/comments');
+        /*
        $this->view->serviceStatesPieChart = $this->createPieChart(
            $serviceStates,
            $this->translate('Service State'),
@ -206,6 +238,7 @@ class Monitoring_ServicesController extends Controller
            $this->translate('Host State'),
            array('#44bb77', '#FF5566', '#E066FF', '#77AAFF')
        );
+        */
    }

    protected function createPieChart(array $states, $title, array $colors)
--- a/modules/monitoring/application/views/scripts/partials/command/objects-command-form.phtml
+++ b/modules/monitoring/application/views/scripts/partials/command/objects-command-form.phtml
@ -1,31 +1,19 @@
 <div class="controls">
+
+   <?php if (! $this->compact): ?>
+       <?= $tabs; ?>
+   <?php endif ?>
+
  <?php if (isset($serviceStates)): ?>
+    <h1><?= sprintf($this->translate('%d Services Selected'), count($objects)) ?></h1>
    <?= $this->render('partials/service/objects-header.phtml'); ?>
  <?php else: ?>
+    <h1><?= sprintf($this->translate('%d Hosts Selected'), count($objects)) ?></h1>
    <?= $this->render('partials/host/objects-header.phtml'); ?>
  <?php endif ?>
 </div>
+
 <div class="content objects-command">
-    <table class="objectlist">
-        <thead>
-            <tr>
-                <th><?= $this->icon('host'); ?> <?= $this->translate('Host'); ?></th>
-                <th><?= $this->icon('conf'); ?> <?= $this->translate('Service'); ?></th>
-            </tr>
-        </thead>
-        <tbody>
-          <?php foreach ($form->getObjects() as $object): /** @var \Icinga\Module\Monitoring\Object\MonitoredObject $object */ ?>
-            <tr>
-              <?php if ($object->getType() === $object::TYPE_HOST): ?>
-                <td colspan="2"><?= $this->escape($object->getName()); ?></td>
-              <?php else: ?>
-                <td><?= $this->escape($object->getHost()->getName()); ?></td>
-                <td><?= $this->escape($object->getName()); ?></td>
-              <?php endif ?>
-            </tr>
-          <?php endforeach ?>
-        </tbody>
-    </table>
    <hr class="command-separator">
    <?= $form; ?>
 </div>
--- a/modules/monitoring/application/views/scripts/partials/host/objects-header.phtml
+++ b/modules/monitoring/application/views/scripts/partials/host/objects-header.phtml
@ -1,6 +1,7 @@
 <?php if (! $this->compact): ?>
    <?= $tabs; ?>
 <?php endif ?>
+
 <?php if (($hostCount = count($objects)) > 0): ?>
 <div class="hbox-item">
    <h1 tabindex="-1">
@ -15,4 +16,4 @@
    <?= sprintf('%s: %u', $this->translate(strtoupper($text)), $count); ?><br>
  <?php endforeach ?>
 </div>
-<?php endif ?>
+<?php endif ?>
--- a/modules/monitoring/application/views/scripts/partials/host/servicesummary.phtml
+++ b/modules/monitoring/application/views/scripts/partials/host/servicesummary.phtml
@ -31,6 +31,7 @@ $currentUrl = Url::fromRequest()->without('limit')->getRelativeUrl();
 <?php else: ?>
 <?= $this->translate('No services configured on this host'); ?>
 <?php endif; ?>
+
 <span class="badges">
 <?php if ($object->stats->services_ok): ?>
 <span class="state ok<?= $currentUrl === $selfUrl->with('service_state', 0)->getRelativeUrl() ? ' active' : ''; ?>">
--- a/modules/monitoring/application/views/scripts/partials/service/objects-header.phtml
+++ b/modules/monitoring/application/views/scripts/partials/service/objects-header.phtml
@ -1,34 +1,85 @@
-<?php if (! $this->compact): ?>
-    <?= $tabs; ?>
-<?php endif ?>
+<?php
+use Icinga\Module\Monitoring\Object\Service;
+use Icinga\Web\Url;
+?>
+
+<?php
+    $i = 0;
+    $hidden = array();
+    $hiddenRich = array();
+?>
 <?php if (($serviceCount = count($objects)) > 0): ?>
-<div class="hbox">
-    <div class="hbox-item" style="width: 6em;">
-        <h1 tabindex="-1">
-            <?= sprintf($this->translatePlural('Service (%u)', 'Services (%u)', $serviceCount), $serviceCount); ?>
-        </h1>
-    </div>
-    <div class="hbox-item">
-        &nbsp;<?= $serviceStatesPieChart; ?>
-    </div>
-    <div class="hbox-item" style="font-size: 14px">
-      <?php foreach (array_filter($serviceStates) as $text => $count): ?>
-        <?= sprintf('%s: %u', $this->translate(strtoupper($text)), $count); ?><br>
-      <?php endforeach ?>
-    </div>
-</div>
-<div class="hbox">
-    <div class="hbox-item" style="width: 6em;">
-        <?php $hostCount = array_sum(array_values($hostStates)); ?>
-        <strong><?= sprintf($this->translatePlural('Host (%u)', 'Hosts (%u)', $hostCount), $hostCount); ?></strong>
-    </div>
-    <div class="hbox-item">
-        &nbsp;<?= $hostStatesPieChart; ?>
-    </div>
-    <div class="hbox-item" style="font-size: 14px">
-      <?php foreach (array_filter($hostStates) as $text => $count): ?>
-        <?= sprintf('%s: %u', $this->translate(strtoupper($text)), $count); ?><br>
-      <?php endforeach ?>
-    </div>
-</div>
-<?php endif ?>
+    <p>
+    <table class="state statesummary">
+    <thead>
+    <tr>
+        <th></th>
+        <th></th>
+        <th><?= $this->icon('service'); ?> <?= $this->translate('Service'); ?></th>
+        <th><?= $this->icon('host'); ?> <?= $this->translate('Host'); ?></th>
+        <th class="collapse"><?= $this->translate('Output'); ?></th>
+    </tr>
+    </thead>
+
+    <tbody>
+    <?php foreach ($objects as $service): /** @var Service $service */ ?>
+        <?php
+        $i++;
+        if ($i > 5) {
+            $desc = $service->getHost()->getName() . ' on ' . $service->getName();
+            $hidden[] = $desc;
+            $hiddenRich[] = sprintf("<div class='color-box badge-%s'></div>%s", $service->getStateText($service->service_state) ,$desc);
+            continue;
+        }
+        ?>
+
+        <tr class="state <?= Service::getStateText($service->service_state); ?><?= $service->service_handled ? ' handled' : '' ?>">
+            <td class="state"><?= Service::getStateText($service->service_state, true); ?><br /></td>
+            <td>
+                <?php if (!$service->service_handled && $service->service_state > 0): ?>
+                    <?= $this->icon('attention-alt', $this->translate('Unhandled')) ?>
+                <?php endif ?>
+
+                <?php if ($service->service_acknowledged && !$service->service_in_downtime): ?>
+                    <?= $this->icon('ok', $this->translate('Acknowledged') . (
+                        $service->service_last_ack ? ': ' . $service->service_last_ack : ''
+                        )) ?>
+                <?php endif ?>
+
+                <?php if ($service->service_is_flapping): ?>
+                    <?= $this->icon('flapping', $this->translate('Flapping')) ?>
+                <?php endif ?>
+
+                <?php if (!$service->service_notifications_enabled): ?>
+                    <?= $this->icon('bell-off-empty', $this->translate('Notifications Disabled')) ?>
+                <?php endif ?>
+
+                <?php if ($service->service_in_downtime): ?>
+                    <?= $this->icon('plug', $this->translate('In Downtime')) ?>
+                <?php endif ?>
+
+                <?php if (isset($service->service_last_comment) && $service->service_last_comment !== null): ?>
+                    <?= $this->icon('comment', $this->translate('Last Comment: ') . $service->service_last_comment) ?>
+                <?php endif ?>
+            </td>
+            <td><?= $this->escape($service->getName()); ?></td>
+            <td><?= $this->escape($service->getHost()->getName()); ?></b></td>
+            <td><p class="pluginoutput collapse"><?= $this->escape($service->service_output) ?></p></td>
+        </tr>
+    <?php endforeach ?>
+
+    <?php if (count($hidden)): ?>
+        <tr>
+        <td>
+        <div class="selection-info" data-title-rich="<span align='left'><?= join('<br>', $hiddenRich) ?></span>"
+              title="<?= join(', ', $hidden) ?>">
+              <?= sprintf(t('%d more ...'), count($hidden)) ?>
+        </div>
+        </td>
+        </tr>
+    <?php endif ?>
+
+    </tbody>
+    </table>
+    </p>
+<?php endif ?>
--- a/modules/monitoring/application/views/scripts/partials/service/objects-tinysummary.phtml
+++ b/modules/monitoring/application/views/scripts/partials/service/objects-tinysummary.phtml
@ -0,0 +1,42 @@
+<?php
+use Icinga\Web\Url;
+?>
+
+<h1 class="tinystatesummary">
+    <?= $this->qlink(
+        sprintf($this->translate('%d Services Selected:'), count($objects)),
+        $listAllLink
+    ); ?>
+
+    <span class="badges">
+    <?php if ($serviceStates->services_ok): ?>
+        <?php $selfUrl = Url::fromPath('monitoring/list/services'); ?>
+        <span class="state ok"><b>
+                <?= $serviceStates->services_ok ?>
+            </b></span>
+    <?php endif ?>
+
+        <?php
+        foreach (
+            array(
+                2 => 'critical',
+                3 => 'unknown',
+                1 => 'warning',
+                4 => 'pending'
+            ) as $stateId => $state) {
+
+            $stateName = 'services_' . $state;
+            $unhandledStateName = $stateName . '_unhandled';
+            if ($serviceStates->$unhandledStateName) {
+                echo '<span class="state ' . $state . '"><b>' . $serviceStates->$unhandledStateName . '</b>';
+            }
+            if ($serviceStates->$stateName) {
+                echo '<span class="state ' . $state . ' handled"><b>' . $serviceStates->$stateName . '</b></span>';
+            }
+            if ($serviceStates->$unhandledStateName) {
+                echo '</span>';
+            }
+            $stateName .= '_unhandled';
+        }?>
+    </span>
+</h1>
--- a/modules/monitoring/application/views/scripts/services/show.phtml
+++ b/modules/monitoring/application/views/scripts/services/show.phtml
@ -1,47 +1,66 @@
+<?php
+use Icinga\Module\Monitoring\Forms\Command\Object\DeleteCommentCommandForm;
+use Icinga\Web\Url;
+?>
+
 <div class="controls">
+
+    <?php if (! $this->compact): ?>
+        <?= $tabs; ?>
+    <?php endif ?>
+
+    <?= $this->render('partials/service/objects-tinysummary.phtml') ?>
    <?= $this->render('partials/service/objects-header.phtml'); ?>
+
 </div>
 <div class="content">
    <?php if (($serviceCount = count($objects)) === 0): ?>
-        <?= $this->translate('No services matching the filter'); ?>
+    <?= $this->translate('No services matching the filter'); ?>
    <?php else: ?>
-        <h3><?= sprintf($this->translatePlural('%u Service', '%u Services', $serviceCount), $serviceCount); ?></h3>
-        <div><?= $this->qlink(
-            sprintf($this->translate('List all %u services'), $serviceCount),
-            $listAllLink
-        ); ?></div>
+        <?= sprintf(t('Issue commands on all %d selected services'), count($objects)) ?>
+
+    <p>
        <div>
            <?= $checkNowForm; ?>
        </div>
        <div><?= $this->qlink(
-            sprintf($this->translate('Reschedule the next check for all %u services'), $serviceCount),
-            $rescheduleAllLink,
-            null,
-            array('icon' => 'reschedule')
-        ); ?></div>
+                $this->translate('Reschedule the next check'),
+                $rescheduleAllLink,
+                null,
+                array('icon' => 'reschedule')
+            ); ?></div>
        <div><?= $this->qlink(
-            sprintf($this->translate('Schedule a downtime for all %u services'), $serviceCount),
-            $downtimeAllLink,
-            null,
-            array('icon' => 'plug')
-        ); ?></div>
+                $this->translate('Schedule a downtime'),
+                $downtimeAllLink,
+                null,
+                array('icon' => 'plug')
+            ); ?></div>
        <div><?= $this->qlink(
-            sprintf($this->translate('Submit a passive check result for all %u services'), $serviceCount),
-            $processCheckResultAllLink,
-            null,
-            array('icon' => 'reply')
-        ); ?></div>
-      <?php if (($unhandledCount = count($unhandledObjects)) > 0): ?>
-        <div>
-            <h3><?= sprintf(
-                $this->translatePlural(
-                    '%u Unhandled Service Problem',
-                    '%u Unhandled Service Problems',
-                    $unhandledCount
-                ),
-                $unhandledCount
-            ); ?></h3>
-            <div><?= $this->qlink(
+                $this->translate('Submit a passive check result'),
+                $processCheckResultAllLink,
+                null,
+                array('icon' => 'reply')
+            ); ?></div>
+    </p>
+
+    <?php if (($unhandledCount = count($unhandledObjects)) > 0): ?>
+    <div>
+        <h3>
+            <?= $this->icon('attention-alt') ?>
+                <?= $this->translatePlural(
+                        'Unhandled Problem',
+                        'Unhandled Problems',
+                        $unhandledCount
+                ) ?>
+        </h3>
+
+        <p><?= sprintf(t('There are %s unhandled problems. ' .
+                'Issue commands to the problematic services.'),
+                '<span class="badge badge-critical">' . $unhandledCount . '</span>') ?>
+
+
+            <div>
+            <?= $this->qlink(
                sprintf(
                    $this->translatePlural(
                        'Schedule a downtime for %u unhandled service problem',
@ -53,7 +72,9 @@
                $downtimeUnhandledLink,
                null,
                array('icon' => 'plug')
-            ); ?></div>
+            ); ?>
+            </div>
+
            <div><?= $this->qlink(
                sprintf(
                    $this->translatePlural(
@ -67,50 +88,101 @@
                null,
                array('icon' => 'ok')
            ); ?></div>
-        </div>
-      <?php endif ?>
-      <?php if (($acknowledgedCount = count($acknowledgedObjects)) > 0): ?>
-        <div>
-            <h2><?= sprintf(
-                $this->translatePlural(
-                    '%u Acknowledged Service Problem',
-                    '%u Acknowledged Service Problems',
-                    $acknowledgedCount
-                ),
+        </p>
+
+
+    </div>
+
+    <?php endif ?>
+    <?php if (($acknowledgedCount = count($acknowledgedObjects)) > 0): ?>
+
+    <h3> <?= $this->icon('ok', $this->translate('Acknowledgements')) ?> <?= $this->translate('Acknowledgements') ?> </h3>
+    <p>
+        <?= sprintf(
+            $this->translatePlural(
+                '%u Acknowledged Service Problem',
+                '%u Acknowledged Service Problems',
                $acknowledgedCount
-            ); ?></h2>
-            <?= $removeAckForm ?>
-        </div>
-      <?php endif ?>
-      <?php if (($inDowntimeCount = count($objectsInDowntime)) > 0): ?>
-        <h2><?= $this->qlink(
-            sprintf(
-                $this->translatePlural(
-                    'List %u service currently in downtime',
-                    'List %u services currently in downtime',
-                    $inDowntimeCount
-                ),
-                $inDowntimeCount
            ),
+            $acknowledgedCount
+        ); ?> <?= $removeAckForm ?>
+    </p>
+    <?php endif ?>
+
+
+    <?php if (($inDowntimeCount = count($objectsInDowntime)) > 0): ?>
+
+    <h3>  <?= $this->icon('plug', $this->translate('Downtimes')) ?> <?= $this->translate('Downtimes') ?>  </h3>
+    <p> <?= sprintf($this->translatePlural(
+            '%u service currently in downtime',
+            '%u services currently in downtime',
+            $inDowntimeCount
+        ), $inDowntimeCount) ?>
+
+        <div>
+        <?= $this->qlink(
+            $this->translate('List all'),
            $inDowntimeLink,
            null,
            array('icon' => 'plug')
-        ); ?></h2>
-      <?php endif ?>
-      <?php if (($commentCount = count($objects->getComments())) > 0): ?>
-        <h2><?= $this->qlink(
-            sprintf(
-                $this->translatePlural(
-                    'List %u service comment',
-                    'List %u service comments',
-                    $commentCount
-                ),
+        );?>
+        </div>
+
+        <div>
+            <?= $removeDowntimeForm ?> Delete All
+        </div>
+    </p>
+    <?php endif ?>
+
+
+<?php $commentCount = count($objects->getComments()) ?>
+<?php if ($commentCount > 0): ?>
+    <h3> <?= $this->icon('comment') ?> <?= t('Comments') ?> </h3>
+    <p><?= sprintf(
+            $this->translatePlural(
+                'There are no comments.',
+                'There are %d comments',
                $commentCount
-            ),
-            $commentsLink,
-            null,
-            array('icon' => 'comment')
-        ); ?></h2>
-      <?php endif ?>
+            ), $commentCount);
+    ?>
+    <?= $this->qlink(
+        $this->translate('List all'),
+        $commentsLink,
+        null,
+        array('icon' => 'comment')
+    ); ?></p>
+
+        <table>
+        <?php foreach ($objects as $service): ?>
+            <?php $service->fetchComments(); ?>
+
+                <?php foreach ($service->comments as $comment): ?>
+                <tr >
+                <td style="vertical-align: top;" data-base-target="_self">
+                    <?php
+                    $delCommentForm = new DeleteCommentCommandForm();
+                    $delCommentForm->populate(
+                        array('comment_id' => $comment->id, 'redirect' => html_entity_decode($this->url))
+                    );
+                    $delCommentForm->setAction(
+                        $this->url(
+                            'monitoring/service/delete-comment',
+                            array('host' => $service->getHost()->getName(), 'service' => $service->getName())
+                        )
+                    );
+                    echo $delCommentForm;
+                    ?>
+                    (<?= ucfirst($comment->type) ?>):
+                </td>
+                <td style="padding-left: .5em;">
+                    <?= nl2br($comment->comment) ?>
+                </td>
+                </tr>
+                <?php endforeach ?>
+
+            <?php endforeach ?>
+            </table>
+        <?php endif ?>
+
    <?php endif ?>
 </div>
--- a/modules/monitoring/public/css/module.less
+++ b/modules/monitoring/public/css/module.less
@ -91,15 +91,16 @@ div.contacts div.notification-periods {
  margin-top: 0.5em;
 }

-div.tinystatesummary {
+.tinystatesummary {
  .page-header();
  font-size: 1em;
  .badges {
    display: inline-block;
    margin-bottom: 4px;
    margin-left: 1em;
+    height: auto;
  }
-  .state > a {
+  .state > * {
    color: white;
    font-size: 0.8em;
    padding: 2px 5px;
@ -196,7 +197,7 @@ div.selection-info {
 .optionbox label {
  max-width: 6.5em;
  text-align: left;
-  vertical-align: middle;
+  vertgical-align: middle;
  margin-right: 0em;
 }

--- a/public/css/icinga/monitoring-colors.less
+++ b/public/css/icinga/monitoring-colors.less
@ -922,3 +922,50 @@ table.groupview {
 }

 /* End of monitoring groupsummary styles */
+
+/* compact table */
+table.statesummary {
+  text-align: left;
+  width: auto;
+  border-collapse: separate;
+
+  tbody {
+    white-space: nowrap;
+  }
+
+  td {
+    padding: 0em 0.4em 0em 0.4em;
+    line-height: 1.2em;
+  }
+
+  tr.state td.state {
+    width: auto;
+    font-weight: bold;
+  }
+
+  td .pluginoutput {
+    font-size: 0.8em;
+    line-height: 1.2em;
+    padding-left: 0;
+    margin: 0;
+  }
+
+  td.state {
+    min-width: 70px;
+    font-size: 0.7em;
+    text-align: center;
+  }
+
+  td a {
+    color: inherit;
+    text-decoration: none;
+  }
+}
+
+/* Up to 576px for 1em=16px, should fit 320px devices */
+@media screen and (max-width: 97em) {
+
+  table.statesummary .collapse {
+    display: none;
+  }
+}
--- a/public/css/icinga/widgets.less
+++ b/public/css/icinga/widgets.less
@ -203,23 +203,13 @@ li li .badge-container {
  margin-right: 0.75em;
 }

-/*
-#layout.hoveredmenu .active > .badge-container {
-  display: none;
-}
-
-#layout.hoveredmenu .hover > .badge-container {
-  //margin-right: 14.15em;
-  display: none;
-}
-*/
-
 .badge {
  position: relative;
-  top: 0.3em;
+  top: -0.15em;
  display: inline-block;
  min-width: 1em;
  padding: 3px 7px;
+  margin: 0 0.2em 0 0.2em;
  font-size: 0.8em;
  font-weight: 700;
  line-height: 1.1em;
@ -230,6 +220,11 @@ li li .badge-container {
  background-color: @colorInvalid;
 }

+#menu nav ul .badge {
+  margin-right: 0em;
+  top: 0.3em;
+}
+
 #menu nav > ul > li.active > .badge-container {
  display: none;
 }
@ -277,7 +272,7 @@ li li .badge {
  background-color: @colorPending;
 }

-.badge-pending {
+.badge-unknown {
  background-color: @colorUnknown;
 }

@ -303,3 +298,24 @@ li li .badge {

  margin: 0em 0em 0em 0.1em;
 }
+
+.tipsy .tipsy-inner {
+  // overwrite tooltip max width, we need them to grow bigger
+  max-width: 300px;
+  text-align: left;
+}
+
+.color-box {
+  position: relative;
+  top: 2px;
+  margin: 0px 3px 0px 3px;
+  display: inline-block;
+  width: 12px;
+  height: 12px;
+}
+
+.oneline {
+  overflow: hidden;
+  white-space: nowrap;
+  text-overflow: ellipsis;
+}
--- a/public/js/icinga/behavior/tooltip.js
+++ b/public/js/icinga/behavior/tooltip.js
@ -30,7 +30,7 @@
        $('svg .chart-data', el).tipsy({ gravity: 'se', html: true });
        $('.historycolorgrid a[title]', el).tipsy({ gravity: 's', offset: 2 });
        $('img.icon[title]', el).tipsy({ gravity: $.fn.tipsy.autoNS, offset: 2 });
-        $('[title]', el).tipsy({ gravity: $.fn.tipsy.autoNS, delayIn: 500 });
+        $('[title]', el).tipsy({ gravity: $.fn.tipsy.autoNS, delayIn: 500, html: true });

        // migrate or remove all orphaned tooltips
        $('.tipsy').each(function () {