[IMP] make editor bar appear faster to avoid impression of slowness and reflow
authorXavier Morel <xmo@openerp.com>
Tue, 4 Feb 2014 15:36:16 +0000 (16:36 +0100)
committerXavier Morel <xmo@openerp.com>
Tue, 4 Feb 2014 15:36:16 +0000 (16:36 +0100)
bzr revid: xmo@openerp.com-20140204153616-swho76l8v3s4p1dq

addons/website/static/src/js/website.editor.js
addons/website/views/website_templates.xml

index 43b2025..dd8fd42 100644 (file)
@@ -10,6 +10,9 @@
 
         if (!is_smartphone) {
             website.ready().then(website.init_editor);
+        } else {
+            // remove padding of fake editor bar
+            document.body.style.padding = 0;
         }
 
         $(document).on('click', 'a.js_link2post', function (ev) {
             });
         },
         start: function() {
+            // remove placeholder editor bar
+            var fakebar = document.getElementById('website-top-navbar-placeholder');
+            fakebar.parentNode.removeChild(fakebar);
+
             var self = this;
             this.saving_mutex = new openerp.Mutex();
 
index c288dba..0f77d7e 100644 (file)
 </template>
 
 <template id="editor_head" inherit_id="website.layout" name="Editor" groups="base.group_website_publisher">
+    <xpath expr="//body" position="attributes">
+        <attribute name="style">padding-top: 51px;</attribute>
+    </xpath>
+    <xpath expr="//body/*[1]" position="before">
+        <div id="website-top-navbar-placeholder" class="navbar navbar-inverse navbar-fixed-top hidden-xs">
+            <div class="navbar-header">
+                <form class="navbar-form navbar-left">
+                    <button type="button" class="btn btn-primary">Edit</button>
+                </form>
+            </div>
+            <div class="collapse navbar-collapse navbar-edit-collapse">
+                <ul class="nav navbar-nav navbar-right">
+                    <li><a href="#" onclick="return false;"><i class="fa fa-mobile" title="Mobile preview"/></a></li>
+                    <li class="divider-vertical"/>
+                    <li><a href="#" onclick="return false;"><span title="Promote page on the web">Promote</span></a></li>
+                    <li class="dropdown">
+                        <a href="#" onclick="return false;">Content <span class="caret"/></a>
+                    </li>
+                    <li class="dropdown">
+                        <a href="#" onclick="return false;">Customize <span class="caret"/></a>
+                    </li>
+                    <li class="dropdown">
+                        <a href="#" onclick="return false;">Help <span class="caret"/></a>
+                    </li>
+                </ul>
+            </div>
+        </div>
+    </xpath>
     <xpath expr='//t[@name="layout_head"]' position="before">
         <link rel='stylesheet' href='/website/static/src/css/snippets.css'/>
         <link rel='stylesheet' href='/website/static/src/css/editor.css'/>