[Kimchi-devel] [PATCH] [Wok 2/4] Enabled Wok tab in navbar

[sguimaraes943 at gmail.com]

From: Samuel Guimarães <sguimaraes943 at gmail.com>

Signed-off-by: Samuel Guimarães <sguimaraes943 at gmail.com>
---
 ui/config/tab-ext.xml                  |  1 +
 ui/css/bootstrap.custom.css            | 20 +++++++++++++++++---
 ui/css/src/modules/_wok-variables.scss |  6 ++++--
 ui/css/wok.css                         | 14 +++++++++-----
 ui/js/src/wok.main.js                  |  8 ++++++++
 5 files changed, 39 insertions(+), 10 deletions(-)

diff --git a/ui/config/tab-ext.xml b/ui/config/tab-ext.xml
index 0b0e2b6..91ecdf3 100644
--- a/ui/config/tab-ext.xml
+++ b/ui/config/tab-ext.xml
@@ -5,6 +5,7 @@
         <access role="admin" mode="admin"/>
         <access role="user" mode="none"/>
         <title>Settings</title>
+        <order>-1</order>
         <path>tabs/settings.html</path>
     </tab>
 </tabs-ext>
diff --git a/ui/css/bootstrap.custom.css b/ui/css/bootstrap.custom.css
index 69e5b5d..0830ca9 100644
--- a/ui/css/bootstrap.custom.css
+++ b/ui/css/bootstrap.custom.css
@@ -4564,9 +4564,9 @@ tbody.collapse.in {
   background-color: #7f1c7d !important;
 }
 
-.navbar-default .navbar-nav > .active > a.administration,
-.navbar-default .navbar-nav > .active > a.administration:hover,
-.navbar-default .navbar-nav > .active > a.administration:focus {
+.navbar-default .navbar-nav > .active > a.wok,
+.navbar-default .navbar-nav > .active > a.wok:hover,
+.navbar-default .navbar-nav > .active > a.wok:focus {
   height: 41px;
   background-color: #d9182d !important;
 }
@@ -4592,6 +4592,20 @@ tbody.collapse.in {
   background-color: #8cc63f !important;
 }
 
+.navbar-default .navbar-nav > .active > a.wokTab,
+.navbar-default .navbar-nav > .active > a.wokTab:hover,
+.navbar-default .navbar-nav > .active > a.wokTab:focus {
+  height: 41px;
+  background-color: #930c0c !important;
+}
+
+.navbar-default .navbar-nav > .active > a.wokSelected,
+.navbar-default .navbar-nav > .active > a.wokSelected:hover,
+.navbar-default .navbar-nav > .active > a.wokSelected:focus {
+  height: 41px;
+  background-color: #d9182d !important;
+}
+
 .navbar-default .navbar-nav > .hostname {
   margin: 0;
   padding: 8px 10px;
diff --git a/ui/css/src/modules/_wok-variables.scss b/ui/css/src/modules/_wok-variables.scss
index 1cd5ed2..13e5d73 100644
--- a/ui/css/src/modules/_wok-variables.scss
+++ b/ui/css/src/modules/_wok-variables.scss
@@ -69,10 +69,12 @@ $colors: (
     templates:           #00a6a0,
     storage:             #feb813,
     network:             #7f1c7d,
-    administration:      #d9182d,
+    wok:      #d9182d,
     virtualizationTab:   #59930c,
     hostTab:             #00578c,
-    virtualizationSelected: #8cc63f
+    virtualizationSelected: #8cc63f,
+    wokTab: #930c0c,
+    wokSelected: #d9182d
 );
 
 
diff --git a/ui/css/wok.css b/ui/css/wok.css
index c2fb62d..6831f72 100644
--- a/ui/css/wok.css
+++ b/ui/css/wok.css
@@ -153,10 +153,6 @@
   background-color: #8cc63f !important;
 }
 
-#administration-root-container .navbar-default.toolbar {
-  background-color: #008abf !important;
-}
-
 #tabPanel.hostSelected {
   background-color: #008abf !important;
 }
@@ -181,7 +177,7 @@
   background-color: #7f1c7d !important;
 }
 
-#tabPanel.administration {
+#tabPanel.wok {
   background-color: #d9182d !important;
 }
 
@@ -197,6 +193,14 @@
   background-color: #8cc63f !important;
 }
 
+#tabPanel.wokTab {
+  background-color: #930c0c !important;
+}
+
+#tabPanel.wokSelected {
+  background-color: #d9182d !important;
+}
+
 @media (min-width: 991px) and (max-width: 992px) {
   .host-dashboard .container {
     padding-right: 10px;
diff --git a/ui/js/src/wok.main.js b/ui/js/src/wok.main.js
index e0fbc13..1f3967d 100644
--- a/ui/js/src/wok.main.js
+++ b/ui/js/src/wok.main.js
@@ -117,12 +117,14 @@ wok.main = function() {
         return tabs;
     };
 
+    var wokConfigUrl = 'ui/config/tab-ext.xml';
     var pluginConfigUrl = 'plugins/{plugin}/ui/config/tab-ext.xml';
     var pluginI18nUrl = 'plugins/{plugin}/i18n.json';
     var DEFAULT_HASH;
     var buildTabs = function(callback) {
         var tabs = [];
         var functionalTabs = [];
+        var wokTabs = retrieveTabs(wokConfigUrl);
         wok.listPlugins(function(plugins) {
             $(plugins).each(function(i, p) {
                 var url = wok.substitute(pluginConfigUrl, {
@@ -146,6 +148,12 @@ wok.main = function() {
 
             //ordering of first level tab
             functionalTabs.sort();
+            if(wokTabs.length > 0){
+                //Adds wok to first index in list
+                functionalTabs.unshift(wokTabs[0].functionality);
+                //Adds Wok tabs to the list
+                tabs.unshift.apply(tabs, wokTabs);
+            }
 
             //sort second level tab based on their ordering number
             var orderedTabs = tabs.slice(0);
-- 
1.9.3