[Web UI] Option to hide Top Toolbar

src/webui/www/private/index.html

@@ -61,6 +61,7 @@
                     <li>
                         <a class="returnFalse">QBT_TR(&View)QBT_TR</a>
                         <ul>
+                        <li><a id="showTopToolbarLink"><img class="MyMenuIcon" src="theme/checked" alt="QBT_TR(&Top Toolbar)QBT_TR" width="16" height="16" onload="fixPNG(this)"/>QBT_TR(&Top Toolbar)QBT_TR</a></li>
                         <li><a id="speedInBrowserTitleBarLink"><img class="MyMenuIcon" src="theme/checked" alt="QBT_TR(S&peed in Title Bar)QBT_TR" width="16" height="16" onload="fixPNG(this)"/>QBT_TR(S&peed in Title Bar)QBT_TR</a></li>
                         </ul>
                     </li>

src/webui/www/public/css/Layout.css

@@ -108,7 +108,6 @@ body {
 	/* Fixes by Chris */
 	/*background-color: #ccc;*/
 	height: 20px;
-	margin-bottom: 5px;
 	border-bottom: 1px solid #3f3f3f;
 }
 

src/webui/www/public/css/style.css

@@ -262,6 +262,10 @@ a.propButton img {
 }
 
 /* Mocha Customization */
+#mochaToolbar {
+	margin-top: 5px;
+}
+
 #mochaToolbar .divider {
 	background-image: url(../images/skin/toolbox-divider.gif);
 	background-repeat: no-repeat;

src/webui/www/public/scripts/client.js

@@ -89,7 +89,6 @@ window.addEvent('load', function () {
         width : null,
         resizeLimit : [100, 300]
     });
-    MochaUI.Desktop.setDesktopSize();
 
     setFilter = function (f) {
         // Visually Select the right filter
@@ -129,10 +128,23 @@ window.addEvent('load', function () {
     });
     initializeWindows();
 
+    // Show Top Toolbar is enabled by default
+    if (localStorage.getItem('show_top_toolbar') == null)
+        var showTopToolbar = true;
+    else
+        var showTopToolbar = localStorage.getItem('show_top_toolbar') == "true";
+    if (!showTopToolbar) {
+        $('showTopToolbarLink').firstChild.style.opacity = '0';
+        $('mochaToolbar').addClass('invisible');
+    }
+
     var speedInTitle = localStorage.getItem('speed_in_browser_title_bar') == "true";
     if (!speedInTitle)
         $('speedInBrowserTitleBarLink').firstChild.style.opacity = '0';
 
+    // After Show Top Toolbar
+    MochaUI.Desktop.setDesktopSize();
+
     var syncMainDataLastResponseId = 0;
     var serverState = {};
 
@@ -271,6 +283,20 @@ window.addEvent('load', function () {
         updateMainData();
     };
 
+    $('showTopToolbarLink').addEvent('click', function(e) {
+        showTopToolbar = !showTopToolbar;
+        localStorage.setItem('show_top_toolbar', showTopToolbar.toString());
+        if (showTopToolbar) {
+            $('showTopToolbarLink').firstChild.style.opacity = '1';
+            $('mochaToolbar').removeClass('invisible');
+        }
+        else {
+            $('showTopToolbarLink').firstChild.style.opacity = '0';
+            $('mochaToolbar').addClass('invisible');
+        }
+        MochaUI.Desktop.setDesktopSize();
+    });
+
     $('speedInBrowserTitleBarLink').addEvent('click', function(e) {
         speedInTitle = !speedInTitle;
         localStorage.setItem('speed_in_browser_title_bar', speedInTitle.toString());