[ADD] Float menu (WIP)

bzr revid: fme@openerp.com-20110919155943-fdx57kbr0q9a2ywe

addons/web/static/src/css/base.css

@@ -288,11 +288,10 @@ label.error {
     color: #fff;
 }
 /* Secondary Menu */
-.openerp .oe_toggle_secondary_menu {
+.openerp .secondary_menu .oe_toggle_secondary_menu {
     position: absolute;
     cursor: pointer;
     border-left: 1px solid #282828;
-    border-bottom: 1px solid #282828;
     width: 21px;
     height: 21px;
     left: 177px;
@@ -304,10 +303,17 @@ label.error {
     font-size: 18px;
     line-height: 14px;
 }
-.openerp .oe_toggle_secondary_menu.folded span.oe_menu_fold {
+.openerp .secondary_menu.oe_folded .oe_toggle_secondary_menu {
+    position: initial;
+    border-left: none;
+    border-bottom: 1px solid #282828;
+    width: 21px;
+    height: 21px;
+}
+.openerp .secondary_menu.oe_folded .oe_toggle_secondary_menu span.oe_menu_fold {
     display: none;
 }
-.openerp .oe_toggle_secondary_menu.unfolded span.oe_menu_unfold {
+.openerp .secondary_menu.oe_unfolded .oe_toggle_secondary_menu span.oe_menu_unfold {
     display: none;
 }
 .openerp .secondary_menu {
@@ -319,6 +325,17 @@ label.error {
     vertical-align: top;
     height: 100%;
 }
+.openerp .secondary_menu.oe_folded {
+    width: 20px;
+    min-width: 20px;
+}
+.openerp .secondary_menu.oe_folded .oe_secondary_menu.active {
+    position: absolute;
+    background: #5A5858;
+    z-index: 100;
+    border: 2px solid white;
+    border-radius: 5px;
+}
 .openerp .secondary_menu a {
     display: block;
     padding: 0 5px 2px 5px;

addons/web/static/src/js/chrome.js

@@ -779,6 +779,7 @@ openerp.web.Menu =  openerp.web.Widget.extend(/** @lends openerp.web.Menu# */{
         this.folded = false;
     },
     start: function() {
+        this.$secondary_menu.addClass(this.folded ? 'oe_folded' : 'oe_unfolded');
         this.rpc("/web/menu/load", {}, this.on_loaded);
     },
     on_loaded: function(data) {
@@ -789,6 +790,7 @@ openerp.web.Menu =  openerp.web.Widget.extend(/** @lends openerp.web.Menu# */{
         this.$secondary_menu.find('.oe_toggle_secondary_menu').click(this.on_toggle_fold);
     },
     on_toggle_fold: function() {
+        this.$secondary_menu.toggleClass('oe_folded').toggleClass('oe_unfolded');
         if (this.folded) {
             this.$secondary_menu.find('.oe_secondary_menu.active').show();
         } else {
@@ -796,12 +798,20 @@ openerp.web.Menu =  openerp.web.Widget.extend(/** @lends openerp.web.Menu# */{
         }
         this.folded = !this.folded;
     },
+    do_show_secondary: function($secondary, $menu) {
+        if (this.folded) {
+            var css = $menu.position();
+            $secondary.css(css);
+        }
+        $secondary.show();
+    },
     on_menu_click: function(ev, id) {
         id = id || 0;
-        var $menu, $parent, $secondary;
+        var $menu, $parent, $secondary, manual = false;
 
         if (id) {
             // We can manually activate a menu with it's id (for hash url mapping)
+            manual = true;
             $menu = this.$element.find('a[data-menu=' + id + ']');
             if (!$menu.length) {
                 $menu = this.$secondary_menu.find('a[data-menu=' + id + ']');
@@ -819,7 +829,6 @@ openerp.web.Menu =  openerp.web.Widget.extend(/** @lends openerp.web.Menu# */{
         }
 
         this.$secondary_menu.find('.oe_secondary_menu').hide().removeClass('active');
-        $secondary.show();
 
         if (id) {
             this.session.active_id = id;
@@ -832,6 +841,10 @@ openerp.web.Menu =  openerp.web.Widget.extend(/** @lends openerp.web.Menu# */{
         $menu.addClass('active');
         $secondary.addClass('active');
 
+        if (!(this.folded && manual)) {
+            this.do_show_secondary($secondary, $menu, manual);
+        }
+
         if (this.$secondary_menu.has($menu).length) {
             if ($menu.is('.submenu')) {
                 //this.$secondary_menu.find('.submenu').removeClass('opened').next().hide();

addons/web/static/src/xml/base.xml

@@ -38,11 +38,17 @@
         </td>
     </tr>
     <tr>
-        <td valign="top" id="oe_secondary_menu" class="secondary_menu">
-        </td>
-        <td valign="top" class="oe-application-container">
-            <div id="oe_app" class="oe-application">
-            </div>
+        <td colspan="2" valign="top" height="100%">
+            <table cellspacing="0" cellpadding="0" border="0" height="100%">
+            <tr>
+                <td valign="top" id="oe_secondary_menu" class="secondary_menu">
+                </td>
+                <td valign="top" class="oe-application-container">
+                    <div id="oe_app" class="oe-application">
+                    </div>
+                </td>
+            </tr>
+            </table>
         </td>
     </tr>
     <tr>
@@ -384,7 +390,7 @@
     </table>
 </t>
 <t t-name="Menu.secondary">
-    <div t-attf-class="oe_toggle_secondary_menu #{widget.folded ? 'folded' : 'unfolded'}">
+    <div t-attf-class="oe_toggle_secondary_menu">
         <span class="oe_menu_fold" title="Fold menu">&amp;laquo;</span>
         <span class="oe_menu_unfold" title="Unfold menu">&amp;raquo;</span>
     </div>