Refactor ItemsView

src/navigator/index.js

@@ -37,7 +37,6 @@ module.exports = () => {
         options.collection = collection;
       }
 
-      console.log('options', options);
       layers = new View(options);
       em && em.on('component:selected', this.componentChanged);
       this.componentChanged();
@@ -79,7 +78,6 @@ module.exports = () => {
     },
 
     render() {
-      console.log('render layers');
       return layers.render().el;
     }
   };

src/navigator/view/ItemView.js

@@ -204,13 +204,10 @@ module.exports = require('backbone').View.extend({
    * */
   startSort(e) {
     e.stopPropagation();
-
+    const sorter = this.sorter;
-    //Right or middel click
+    // Right or middel click
-    if (e.button !== 0) {
+    if (e.button !== 0) return;
-      return;
+    sorter && sorter.startSort(e.target);
-    }
-
-    this.sorter && this.sorter.startSort(e.target);
   },
 
   /**

src/navigator/view/ItemsView.js

@@ -1,7 +1,6 @@
-var Backbone = require('backbone');
+const ItemView = require('./ItemView');
-var ItemView = require('./ItemView');
 
-module.exports = Backbone.View.extend({
+module.exports = require('backbone').View.extend({
   initialize(o = {}) {
     this.opt = o;
     const config = o.config || {};
@@ -11,33 +10,33 @@ module.exports = Backbone.View.extend({
     this.ppfx = config.pStylePrefix || '';
     this.pfx = config.stylePrefix || '';
     this.parent = o.parent;
-    this.listenTo(this.collection, 'add', this.addTo);
+    const pfx = this.pfx;
-    this.listenTo(this.collection, 'reset resetNavigator', this.render);
+    const ppfx = this.ppfx;
-    this.className = this.pfx + 'items';
+    const parent = this.parent;
+    const coll = this.collection;
+    this.listenTo(coll, 'add', this.addTo);
+    this.listenTo(coll, 'reset resetNavigator', this.render);
+    this.className = `${pfx}layers`;
 
     if (config.sortable && !this.opt.sorter) {
-      var pfx = this.pfx;
+      const utils = config.em.get('Utils');
-      var utils = config.em.get('Utils');
       this.opt.sorter = new utils.Sorter({
         container: config.sortContainer || this.el,
-        containerSel: '.' + pfx + 'items',
+        containerSel: `.${this.className}`,
-        itemSel: '.' + pfx + 'item',
+        itemSel: `.${pfx}layer`,
-        ppfx: this.ppfx,
         ignoreViewChildren: 1,
         avoidSelectOnEnd: 1,
-        pfx,
+        nested: 1,
-        nested: 1
+        ppfx,
+        pfx
       });
     }
 
     this.sorter = this.opt.sorter || '';
 
     // For the sorter
-    this.$el.data('collection', this.collection);
+    this.$el.data('collection', coll);
-
+    parent && this.$el.data('model', parent);
-    if (this.parent) {
-      this.$el.data('model', this.parent);
-    }
   },
 
   /**
@@ -123,10 +122,11 @@ module.exports = Backbone.View.extend({
 
   render() {
     const frag = document.createDocumentFragment();
-    this.el.innerHTML = '';
+    const el = this.el;
+    el.innerHTML = '';
     this.collection.each(model => this.addToCollection(model, frag));
-    this.el.appendChild(frag);
+    el.appendChild(frag);
-    this.$el.attr('class', this.className);
+    el.className = this.className;
     return this;
   }
 });