Merge pull request #354 from xmo-odoo/editor-xmlid

[IMP] add XID to view name in Ace editor dropdown

addons/website/static/src/css/editor.css

@@ -472,13 +472,14 @@ ul.oe_menu_editor .disclose {
   right: 0;
   z-index: 1000;
   height: 100%;
+  background: #2f3129;
+  color: white;
 }
 .oe_ace_view_editor .oe_ace_view_editor_title {
   width: 100%;
   padding-top: 0;
   padding-left: 0;
   height: 30px;
-  background: #2f3129;
 }
 .oe_ace_view_editor .oe_ace_view_editor_title .oe_view_list {
   width: 50%;
@@ -496,13 +497,16 @@ ul.oe_menu_editor .disclose {
 }
 .oe_ace_view_editor .ace_editor {
   position: absolute;
-  top: 30px;
+  top: 50px;
   right: 0;
   left: 0;
 }
 .oe_ace_view_editor .ace_editor .ace_gutter {
   cursor: ew-resize;
 }
+.oe_ace_view_editor #ace-view-id {
+  padding: 0 1em;
+}
 .oe_ace_view_editor.oe_ace_open {
   filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=97);
   opacity: 0.97;

addons/website/static/src/css/editor.sass

@@ -408,6 +408,7 @@ $highlighted_text_color: #ffffff
 /* ---- ACE EDITOR ---- {{{ */
 
 $editorbar_height: 30px
+$infobar_height: 20px
 // TODO Fix => might break with themes
 
 .oe_ace_view_editor
@@ -416,12 +417,13 @@ $editorbar_height: 30px
     right: 0
     z-index: 1000
     height: 100%
+    background: #2F3129
+    color: white
     .oe_ace_view_editor_title
         width: 100%
         padding-top: 0
         padding-left: 0
         height: $editorbar_height
-        background: #2F3129
         .oe_view_list
             width: 50%
             height: $editorbar_height
@@ -432,12 +434,14 @@ $editorbar_height: 30px
             @include editor-font
     .ace_editor
         position: absolute
-        top: $editorbar_height
+        top: $editorbar_height + $infobar_height
         right: 0
         // bottom property is set programmatically
         left: 0
         .ace_gutter
             cursor: ew-resize
+    #ace-view-id
+        padding: 0 1em
     &.oe_ace_open
         +opacity(0.97)
     &.oe_ace_closed

addons/website/static/src/js/website.ace.js

@@ -1,6 +1,7 @@
 (function () {
     'use strict';
 
+    var _t = openerp._t;
     var hash = "#advanced-view-editor";
 
     var website = openerp.website;
@@ -65,12 +66,11 @@
     website.ace.ViewOption = openerp.Widget.extend({
         template: 'website.ace_view_option',
         init: function (parent, options) {
-            var indent = "- ";
             this.view_id = options.id;
             this.view_name = options.name;
-            for (var i = 0; i<options.level; i++) {
-                this.view_name = indent + this.view_name;
-            }
+
+            var indent = _.str.repeat("- ", options.level);
+            this.view_name = _.str.sprintf("%s%s", indent, options.name);
             this._super(parent);
         },
     });
@@ -88,6 +88,7 @@
         },
         init: function (parent) {
             this.buffers = {};
+            this.views = {};
             this._super(parent);
         },
         start: function () {
@@ -162,15 +163,14 @@
             resizeEditorHeight(this.getParent().get('height'));
         },
         loadViews: function (views) {
-            var self = this;
-            var $viewList = self.$('#ace-view-list');
-            var views = this.buildViewGraph(views);
-            _.each(views, function (view) {
-                if (view.id) {
-                    new website.ace.ViewOption(self, view).appendTo($viewList);
-                    self.loadView(view.id);
-                }
-            });
+            var $viewList = this.$('#ace-view-list');
+            _(this.buildViewGraph(views)).each(function (view) {
+                if (!view.id) { return; }
+
+                this.views[view.id] = view;
+                new website.ace.ViewOption(this, view).appendTo($viewList);
+                this.loadView(view.id);
+            }.bind(this));
         },
         buildViewGraph: function (views) {
             var activeViews = _.uniq(_.filter(views, function (view) {
@@ -242,6 +242,9 @@
             var editingSession = this.buffers[viewId];
             if (editingSession) {
                 this.aceEditor.setSession(editingSession);
+                this.$('#ace-view-id').text(_.str.sprintf(
+                    _t("Template ID: %s"),
+                    this.views[viewId].xml_id));
             }
         },
         displaySelectedView: function () {

addons/website/static/src/xml/website.ace.xml

@@ -10,6 +10,7 @@
                 <button data-action="format" type="button" class="btn btn-warning">Format</button>
                 <button data-action="close" type="button" class="btn btn-info">Close</button>
             </div>
+            <div id="ace-view-id"/>
             <div id="ace-view-editor"/>
         </div>
     </t>