From 654953d9d6de614f4b10bdb4897967335fe3e2e9 Mon Sep 17 00:00:00 2001
From: Thomas Gelf <thomas@gelf.net>
Date: Mon, 3 Feb 2014 16:03:05 +0000
Subject: [PATCH] New menu, still unfinished

---
 application/layouts/scripts/body.phtml        |   2 +-
 application/layouts/scripts/parts/menu.phtml  |  64 +++++------
 .../layouts/scripts/parts/navigation.phtml    |   6 +-
 .../layouts/scripts/parts/topbar.phtml        |   2 +-
 config/menu.ini                               |  28 +++--
 config/modules/monitoring/menu.ini            | 101 ++++++++++++------
 public/css/icinga/menu.less                   |  76 +++++++++++++
 public/css/icinga/topbar.css                  |   8 ++
 8 files changed, 195 insertions(+), 92 deletions(-)
 create mode 100644 public/css/icinga/menu.less
 create mode 100644 public/css/icinga/topbar.css

diff --git a/application/layouts/scripts/body.phtml b/application/layouts/scripts/body.phtml
index 7e617712d..24dae76ea 100755
--- a/application/layouts/scripts/body.phtml
+++ b/application/layouts/scripts/body.phtml
@@ -2,7 +2,7 @@
 <div class="row">
 
   <!-- Only required for left/right tabs -->
-  <div class="col-sm-12 col-xs-12 col-md-2 col-lg-2">
+  <div class="col-sm-12 col-xs-12 col-md-2 col-lg-2" id="menu">
     <?php echo $this->render('parts/navigation.phtml') ?>
   </div>
 
diff --git a/application/layouts/scripts/parts/menu.phtml b/application/layouts/scripts/parts/menu.phtml
index 7fdd67c23..7955f3251 100644
--- a/application/layouts/scripts/parts/menu.phtml
+++ b/application/layouts/scripts/parts/menu.phtml
@@ -1,38 +1,28 @@
-<?= $this->sub ? '<ul>' : '<ul class="nav nav-stacked" role="navigation" id="icinganavigation">' ?>
-    <?php foreach ($this->items as $item): ?>
-        <?php
-        $itemClass = '';
-        if ($this->sub) {
-            $itemClass .= 'submenu ';
-        }
-        if ($this->href($this->url) === $this->href($item->getUrl())) {
-            $itemClass .= 'active ';
-        }
-        ?>
-        <li <?php if (!empty($itemClass)): ?>class="<?= $itemClass ?>"<?php endif ?>>
-            <?php if($item->getUrl()): ?>
-                <a href="<?= $this->href($item->getUrl()); ?>">
-            <?php endif; ?>
-            <?php
-            if ($icon = $item->getIcon()) {
-                echo $this->img($icon, array('height' => '16px', 'width' => '16px'));
-            }
-            ?>
-            <?php if ($iconClass = $item->getIconClass()): ?>
-            <i class="<?= $iconClass ?>"></i>
-            <?php endif ?>
-            <?= $item->getTitle();?>
-            <?php if($item->getUrl()): ?>
-                </a>
-            <?php endif; ?>
-            <?php
-            if($item->hasChildren()) {
-                echo $this->partial(
-                    'parts/menu.phtml',
-                    array('items' => $item->getChildren(), 'sub' => true, 'url' => $this->url)
-                );
-            }
-            ?>
-        </li>
-    <?php endforeach ?>
+<ul>
+<?php
+
+foreach ($this->items as $item) {
+
+    printf(
+        '  <li%s><a href="%s">%s%s</a>',
+        $this->href($this->url) === $this->href($item->getUrl()) ? ' class="active"' : '',
+        $item->getUrl() ? $this->href($item->getUrl()) : '#',
+        $item->getIcon() ? $this->img(
+            $item->getIcon(),
+            array('height' => '16px', 'width' => '16px')
+        ) . ' ' : '',
+        $item->getTitle()
+    );
+
+    if ($item->hasChildren()) {
+        echo $this->partial(
+            'parts/menu.phtml',
+            array('items' => $item->getChildren(), 'url' => $this->url)
+        );
+    }
+
+    echo "</li>\n";
+}
+
+?>
 </ul>
diff --git a/application/layouts/scripts/parts/navigation.phtml b/application/layouts/scripts/parts/navigation.phtml
index f64fb92ed..c7e59b194 100755
--- a/application/layouts/scripts/parts/navigation.phtml
+++ b/application/layouts/scripts/parts/navigation.phtml
@@ -3,15 +3,13 @@
 $url = Icinga\Web\Url::fromRequest()->getRelativeUrl();
 $menu = Icinga\Web\Menu::fromConfig();
 
-if ($this->auth()->isAuthenticated()): 
+if ($this->auth()->isAuthenticated()) {
     echo $this->partial(
        'parts/menu.phtml',
         array(
             'items' => $menu->getChildren(),
-            'sub'   => false,
             'url'   => $url
         )
     );
-endif;
+}
 
-?>
\ No newline at end of file
diff --git a/application/layouts/scripts/parts/topbar.phtml b/application/layouts/scripts/parts/topbar.phtml
index 1a4000ff9..e2aa3209c 100755
--- a/application/layouts/scripts/parts/topbar.phtml
+++ b/application/layouts/scripts/parts/topbar.phtml
@@ -1,7 +1,7 @@
 <?php
 use Icinga\Web\Topbar;
 ?>
-<nav class="navbar navbar-default navbar-fixed-top" id="icingatopbar" role="navigation">
+<nav class="navbar-fixed-top" id="icingatopbar" role="navigation">
     <div class="navbar-header">
         <a href="<?= $this->baseUrl('/') ?>" class="navbar-brand icinga-logo">Icinga</a>
     </div>
diff --git a/config/menu.ini b/config/menu.ini
index 73f3ebe40..40ee6e4cd 100755
--- a/config/menu.ini
+++ b/config/menu.ini
@@ -1,17 +1,15 @@
-[Home]
-title       = "Home"
-url         = "/index/welcome"
-icon        = "/img/icons/down_petrol.png"
-priority    = 1
-
-[Configuration]
-title       = "Configuration"
-url         = "/config/index"
-icon_class  = "icinga-icon-configuration-petrol"
-priority    = 2
-
 [Dashboard]
 title       = "Dashboard"
-url         = "/dashboard/index"
-icon        = "/img/icons/dashboard_petrol.png"
-priority    = 3
+url         = "dashboard"
+icon        = "img/icons/dashboard.png"
+priority    = 10
+
+[System]
+icon = img/icons/configuration.png
+priority = 200
+
+[System.Configuration]
+title       = "Configuration"
+url         = "config/index"
+
+
diff --git a/config/modules/monitoring/menu.ini b/config/modules/monitoring/menu.ini
index 0ffe74dc6..6c69af7ea 100755
--- a/config/modules/monitoring/menu.ini
+++ b/config/modules/monitoring/menu.ini
@@ -1,43 +1,76 @@
-[Hosts]
-title       = "Hosts"
-url         = "/monitoring/list/hosts"
-icon_class  = "icinga-icon-host-petrol"
 
-[Services]
-title       = "Services"
-url         = "/monitoring/list/services"
-icon_class  = "icinga-icon-service-petrol"
+[Problems]
+priority = 20
+icon = "img/icons/error.png"
 
-[Downtimes]
-title       = "Downtimes"
-url         = "/monitoring/list/downtimes"
-icon_class  = "icinga-icon-down-petrol"
+[Problems.Unhandled Hosts]
+icon = "img/icons/host.png"
+priority = 50
+url = "monitoring/list/hosts?host_problem=1&host_handled=0"
 
-[Notifications]
-title       = "Notifications"
-url         = "/monitoring/list/notifications"
-icon_class  = "icinga-icon-notification-petrol"
+[Problems.Unhandled Services]
+icon = "img/icons/service.png"
+priority = 50
+url = "monitoring/list/services?service_problem=1&service_handled=0"
 
-[Comments]
-title       = "Comments"
-url         = "/monitoring/list/comments"
-icon_class  = "icinga-icon-comment-petrol"
+[Problems.Current Downtimes]
+url = "monitoring/list/downtimes?downtime_is_in_effect=1"
+icon  = "img/icons/down.png"
 
-[Servicegroups]
-title       = "Servicegroups"
-url         = "/monitoring/list/servicegroups"
-icon_class  = "icinga-icon-servicegroup-petrol"
+[Overview]
+priority = 30
+icon  = "img/icons/hostgroup.png"
 
-[Hostgroups]
-title       = "Hostgroups"
-url         = "/monitoring/list/hostgroups"
-icon_class  = "icinga-icon-hostgroup-petrol"
+[Overview.Hosts]
+title = "Hosts"
+url   = "monitoring/list/hosts"
+icon  = "img/icons/host.png"
+priority = 50
+
+[Overview.Services]
+title = "Services"
+url   = "monitoring/list/services"
+icon  = "img/icons/service.png"
+priority = 50
+
+[Overview.Servicegroups]
+title = "Servicegroups"
+url   = "monitoring/list/servicegroups"
+icon  = "img/icons/servicegroup.png"
+priority = 60
+
+[Overview.Hostgroups]
+title = "Hostgroups"
+url   = "monitoring/list/hostgroups"
+icon  = "img/icons/hostgroup.png"
+priority = 60
+
+[Overview.Downtimes]
+title = "Downtimes"
+url   = "monitoring/list/downtimes"
+icon  = "img/icons/down.png"
+priority = 70
+
+[Overview.Comments]
+title = "Comments"
+url   = "monitoring/list/comments"
+icon  = "img/icons/comment.png"
+priority = 70
 
 [History]
-title       = "History"
-url         = "/monitoring/list/eventhistory"
-icon_class  = "icinga-icon-history-petrol"
+icon  = "img/icons/history.png"
+
+[History.Notifications]
+title = "Notifications"
+url   = "monitoring/list/notifications"
+icon  = "img/icons/notification.png"
+
+[History.Events]
+title = "All Events"
+url   = "monitoring/list/eventhistory"
+icon  = "img/icons/history.png"
+
+[System.Performance]
+title = "Performance"
+url   = "monitoring/process/performance"
 
-[Performance]
-title   = "Performance"
-url     = "/monitoring/process/performance"
diff --git a/public/css/icinga/menu.less b/public/css/icinga/menu.less
new file mode 100644
index 000000000..db826c398
--- /dev/null
+++ b/public/css/icinga/menu.less
@@ -0,0 +1,76 @@
+#menu {
+  background: #999;
+}
+
+#menu a {
+  color: #121212;
+}
+
+#menu .separator {
+  background-color: #888;
+}
+
+#menu li {
+    margin-left: 0.5em;
+    margin-right: 0.5em;
+}
+
+#menu > ul > li {
+  border-bottom: 2em solid #888;
+}
+
+#menu > ul > li.active {
+  background-color: white;
+  padding-left: 0.5em;
+  margin-left: 0;
+  margin-right: 0;
+}
+
+#menu > ul > li.active > a {
+  color: #121212;
+}
+
+#menu > ul > li {
+  border-bottom: 0.12em solid #888;
+}
+
+#menu > ul > li li {
+  font-size: 0.8em;
+  padding-left: 1.875em;
+}
+
+
+/* Collapsed menu item color */
+#menu > ul > li > a {
+  color: #f5f5f5;
+}
+
+/* Sub item color */
+#menu .active ul li a {
+  color: #a6a6a6;
+}
+
+#menu ul {
+  list-style-type: none;
+  padding: 0;
+}
+
+#menu ul li a {
+  display: block;
+  line-height: 2.5em;
+  padding-left: 0.7em;
+  text-decoration: none;
+}
+
+#menu > ul > li img {
+  width: 1em;
+  height: 1em;
+  border: none;
+  margin-bottom: -0.125em;
+  margin-right: 0.5em;
+}
+
+#menu ul ul li a {
+  line-height: 1em;
+  margin-bottom: 1em;
+}
diff --git a/public/css/icinga/topbar.css b/public/css/icinga/topbar.css
new file mode 100644
index 000000000..5a8445534
--- /dev/null
+++ b/public/css/icinga/topbar.css
@@ -0,0 +1,8 @@
+#icingatopbar {
+  background-color: #555;
+  color: #d0d0d0;
+}
+
+#icingatopbar .nav a {
+  color: #d0d0d0;
+}