[ADD] Menu folding (WIP)

bzr revid: fme@openerp.com-20110919144631-b534cjz9iw598f3j

3 files changed, 45 insertions, 11 deletions

diff --git a/addons/web/static/src/css/base.css b/addons/web/static/src/css/base.css
index 2f87b0f9fa9..8ef299f9e1d 100644
--- a/addons/web/static/src/css/base.css
+++ b/addons/web/static/src/css/base.css
@@ -288,6 +288,28 @@ label.error {
     color: #fff;
 }
 /* Secondary Menu */
+.openerp .oe_toggle_secondary_menu {
+    position: absolute;
+    cursor: pointer;
+    border-left: 1px solid #282828;
+    border-bottom: 1px solid #282828;
+    width: 21px;
+    height: 21px;
+    left: 177px;
+    z-index: 10;
+    background: transparent;
+    color: white;
+    text-shadow: 0 1px 0 #333;
+    text-align: center;
+    font-size: 18px;
+    line-height: 14px;
+}
+.openerp .oe_toggle_secondary_menu.folded span.oe_menu_fold {
+    display: none;
+}
+.openerp .oe_toggle_secondary_menu.unfolded span.oe_menu_unfold {
+    display: none;
+}
 .openerp .secondary_menu {
     width: 200px;
     min-width: 200px;
diff --git a/addons/web/static/src/js/chrome.js b/addons/web/static/src/js/chrome.js
index 6815a462383..cfe4b02fb20 100644
--- a/addons/web/static/src/js/chrome.js
+++ b/addons/web/static/src/js/chrome.js
@@ -776,19 +776,25 @@ openerp.web.Menu =  openerp.web.Widget.extend(/** @lends openerp.web.Menu# */{
         this.secondary_menu_id = secondary_menu_id;
         this.$secondary_menu = $("#" + secondary_menu_id).hide();
         this.menu = false;
+        this.folded = false;
     },
     start: function() {
         this.rpc("/web/menu/load", {}, this.on_loaded);
     },
     on_loaded: function(data) {
         this.data = data;
-        this.$element.html(QWeb.render("Menu", this.data));
-        for (var i = 0; i < this.data.data.children.length; i++) {
-            var v = { menu : this.data.data.children[i] };
-            this.$secondary_menu.append(QWeb.render("Menu.secondary", v));
-        }
-
+        this.$element.html(QWeb.render("Menu", { widget : this }));
+        this.$secondary_menu.html(QWeb.render("Menu.secondary", { widget : this }));
         this.$element.add(this.$secondary_menu).find("a").click(this.on_menu_click);
+        this.$secondary_menu.find('.oe_toggle_secondary_menu').click(this.on_toggle_fold);
+    },
+    on_toggle_fold: function() {
+        if (this.folded) {
+            this.$secondary_menu.find('.oe_secondary_menu.active').show();
+        } else {
+            this.$secondary_menu.find('.oe_secondary_menu').hide();
+        }
+        this.folded = !this.folded;
     },
     on_menu_click: function(ev, id) {
         id = id || 0;
@@ -812,7 +818,7 @@ openerp.web.Menu =  openerp.web.Widget.extend(/** @lends openerp.web.Menu# */{
             $secondary = this.$secondary_menu.find('.oe_secondary_menu[data-menu-parent=' + $menu.attr('data-menu') + ']');
         }
 
-        this.$secondary_menu.find('.oe_secondary_menu').hide();
+        this.$secondary_menu.find('.oe_secondary_menu').hide().removeClass('active');
         $secondary.show();
 
         if (id) {
@@ -824,9 +830,11 @@ openerp.web.Menu =  openerp.web.Widget.extend(/** @lends openerp.web.Menu# */{
         $('.active', this.$element.add(this.$secondary_menu.show())).removeClass('active');
         $parent.addClass('active');
         $menu.addClass('active');
+        $secondary.addClass('active');
 
         if (this.$secondary_menu.has($menu).length) {
             if ($menu.is('.submenu')) {
+                //this.$secondary_menu.find('.submenu').removeClass('opened').next().hide();
                 $menu.toggleClass('opened').next().toggle();
                 return false;
             }
diff --git a/addons/web/static/src/xml/base.xml b/addons/web/static/src/xml/base.xml
index 3d02d22c235..28c0a7508ff 100644
--- a/addons/web/static/src/xml/base.xml
+++ b/addons/web/static/src/xml/base.xml
@@ -375,7 +375,7 @@
 <t t-name="Menu">
     <table align="center">
     <tr>
-        <td t-foreach="data.children" t-as="menu">
+        <td t-foreach="widget.data.data.children" t-as="menu">
             <a href="#" t-att-data-menu="menu.id">
                 <t t-esc="menu.name"/>
             </a>
@@ -384,7 +384,11 @@
     </table>
 </t>
 <t t-name="Menu.secondary">
-    <div style="display: none" class="oe_secondary_menu" t-att-data-menu-parent="menu.id">
+    <div t-attf-class="oe_toggle_secondary_menu #{widget.folded ? 'folded' : 'unfolded'}">
+        <span class="oe_menu_fold" title="Fold menu">&amp;laquo;</span>
+        <span class="oe_menu_unfold" title="Unfold menu">&amp;raquo;</span>
+    </div>
+    <div t-foreach="widget.data.data.children" t-as="menu" style="display: none" class="oe_secondary_menu" t-att-data-menu-parent="menu.id">
         <t t-foreach="menu.children" t-as="menu">
             <t t-set="classname">oe_secondary_menu_item</t>
             <t t-set="level" t-value="0"/>
@@ -394,8 +398,8 @@
 </t>
 <t t-name="Menu.secondary.children">
     <t t-set="level" t-value="level + 1"/>
-    <a href="#" t-att-class="classname + (menu.children.length ? ' submenu' : ' leaf')" t-att-data-menu="menu.children.length ? undefined : menu.id">
-        <span t-attf-style="padding-left: #{level - 1}em"> <t t-esc="menu.name"/></span>
+    <a href="#" t-att-class="classname + (menu.children.length ? ' submenu' : ' leaf') + ' oe_menu_level_#{level}'" t-att-data-menu="menu.children.length ? undefined : menu.id">
+        <span t-attf-style="padding-left: #{(level - 2) * 20}px"> <t t-esc="menu.name"/></span>
     </a>
     <div t-attf-class="oe_secondary_submenu oe_secondary_submenu_level_#{level}" t-if="menu.children.length" style="display: none">
         <t t-foreach="menu.children" t-as="menu">