Merge pull request #2871 from paulfalgout/refactor/reorg-mixins

Various v3 mixin cleanup

src/behavior.js

@@ -8,6 +8,8 @@
 
 import _                  from 'underscore';
 import MarionetteObject   from './object';
+import DelegateEntityEventsMixin      from './mixins/delegate-entity-events';
+import TriggersMixin      from './mixins/triggers';
 import UIMixin            from './mixins/ui';
 import getUniqueEventName from './utils/getUniqueEventName';
 
@@ -76,23 +78,13 @@ var Behavior = MarionetteObject.extend({
 
   // Handle `modelEvents`, and `collectionEvents` configuration
   delegateEntityEvents: function() {
-    this.undelegateEntityEvents();
-
-    var modelEvents = this.getValue(this.getOption('modelEvents'));
-    this.bindEntityEvents(this.view.model, modelEvents);
-
-    var collectionEvents = this.getValue(this.getOption('collectionEvents'));
-    this.bindEntityEvents(this.view.collection, collectionEvents);
+    this._delegateEntityEvents(this.view.model, this.view.collection);
 
     return this;
   },
 
   undelegateEntityEvents: function() {
-    var modelEvents = this.getValue(this.getOption('modelEvents'));
-    this.unbindEntityEvents(this.view.model, modelEvents);
-
-    var collectionEvents = this.getValue(this.getOption('collectionEvents'));
-    this.unbindEntityEvents(this.view.collection, collectionEvents);
+    this._undelegateEntityEvents(this.view.model, this.view.collection);
 
     return this;
   },
@@ -122,15 +114,11 @@ var Behavior = MarionetteObject.extend({
     // a user to use the @ui. syntax.
     var behaviorTriggers = this.normalizeUIKeys(_.result(this, 'triggers'));
 
-    return _.reduce(behaviorTriggers, function(events, eventName, key) {
-      key = getUniqueEventName(key);
-      events[key] = this.view._buildViewTrigger(eventName);
-      return events;
-    } , {}, this);
+    return this._getViewTriggers(this.view, behaviorTriggers);
   }
 
 });
 
-_.extend(Behavior.prototype, UIMixin);
+_.extend(Behavior.prototype, DelegateEntityEventsMixin, TriggersMixin, UIMixin);
 
 export default Behavior;

src/collection-view.js

@@ -7,9 +7,6 @@ import ChildViewContainer   from 'backbone.babysitter';
 import isNodeAttached       from './utils/isNodeAttached';
 import MarionetteError      from './error';
 import ViewMixin            from './mixins/view';
-import BehaviorsMixin       from './mixins/behaviors';
-import UIMixin              from './mixins/ui';
-import CommonMixin          from './mixins/common';
 import MonitorDOMRefresh    from './dom-refresh';
 import {
   triggerMethodMany,
@@ -742,8 +739,5 @@ var CollectionView = Backbone.View.extend({
 });
 
 _.extend(CollectionView.prototype, ViewMixin);
-_.extend(CollectionView.prototype, BehaviorsMixin);
-_.extend(CollectionView.prototype, UIMixin);
-_.extend(CollectionView.prototype, CommonMixin);
 
 export default CollectionView;

src/mixins/behaviors.js

@@ -75,7 +75,7 @@ export default {
     // destroying the view.
     // This unbinds event listeners
     // that behaviors have registered for.
-    _.invoke(this._behaviors, 'destroy', args);
+    _.invoke(this._behaviors, 'destroy', ...args);
   },
 
   _bindBehaviorUIElements: function() {

src/mixins/delegate-entity-events.js

@@ -0,0 +1,25 @@
+import {
+  bindEntityEvents,
+  unbindEntityEvents
+} from '../bind-entity-events';
+
+export default {
+  // Handle `modelEvents`, and `collectionEvents` configuration
+  _delegateEntityEvents: function(model, collection) {
+    this._undelegateEntityEvents(model, collection);
+
+    var modelEvents = this.getValue(this.getOption('modelEvents'));
+    bindEntityEvents.call(this, model, modelEvents);
+
+    var collectionEvents = this.getValue(this.getOption('collectionEvents'));
+    bindEntityEvents.call(this, collection, collectionEvents);
+  },
+
+  _undelegateEntityEvents: function(model, collection) {
+    var modelEvents = this.getValue(this.getOption('modelEvents'));
+    unbindEntityEvents.call(this, model, modelEvents);
+
+    var collectionEvents = this.getValue(this.getOption('collectionEvents'));
+    unbindEntityEvents.call(this, collection, collectionEvents);
+  }
+};

src/mixins/regions.js

@@ -177,13 +177,6 @@ export default {
 
   getChildView: function(name) {
     return this.getRegion(name).currentView;
-  },
-
-  _getImmediateChildren: function() {
-    return _.chain(this.getRegions())
-      .pluck('currentView')
-      .compact()
-      .value();
   }
 
 };

src/mixins/triggers.js

@@ -0,0 +1,42 @@
+import _ from 'underscore';
+import getUniqueEventName from '../utils/getUniqueEventName';
+
+// Internal method to create an event handler for a given `triggerDef` like
+// 'click:foo'
+function buildViewTrigger(view, triggerDef) {
+  if (_.isString(triggerDef)) {
+    triggerDef = {event: triggerDef};
+  }
+
+  const eventName = triggerDef.event;
+  const shouldPreventDefault = triggerDef.preventDefault !== false;
+  const shouldStopPropagation = triggerDef.stopPropagation !== false;
+
+  return function(e) {
+    if (shouldPreventDefault) {
+      e.preventDefault();
+    }
+
+    if (shouldStopPropagation) {
+      e.stopPropagation();
+    }
+
+    view.triggerMethod(eventName, view);
+  };
+}
+
+export default {
+
+  // Configure `triggers` to forward DOM events to view
+  // events. `triggers: {"click .foo": "do:foo"}`
+  _getViewTriggers: function(view, triggers) {
+    // Configure the triggers, prevent default
+    // action and stop propagation of DOM events
+    return _.reduce(triggers, function(events, value, key) {
+      key = getUniqueEventName(key);
+      events[key] = buildViewTrigger(view, value);
+      return events;
+    }, {}, this);
+  }
+
+};

src/mixins/view.js

@@ -1,16 +1,19 @@
 // ViewMixin
 //  ---------
 
-import Backbone                 from 'backbone';
-import _                        from 'underscore';
-import getValue                 from '../utils/getValue';
-import getUniqueEventName       from '../utils/getUniqueEventName';
-import MarionetteError          from '../error';
-import Renderer                 from '../renderer';
-import View                     from '../view';
-import { triggerMethod }        from '../trigger-method';
-
-export default {
+import Backbone from 'backbone';
+import _ from 'underscore';
+import MarionetteError from '../error';
+import BehaviorsMixin from './behaviors';
+import CommonMixin from './common';
+import DelegateEntityEventsMixin from './delegate-entity-events';
+import TriggersMixin from './triggers';
+import UIMixin from './ui';
+import Renderer from '../renderer';
+import View from '../view';
+import { triggerMethod } from '../trigger-method';
+
+var ViewMixin = {
   supportsRenderLifecycle: true,
   supportsDestroyLifecycle: true,
 
@@ -43,7 +46,7 @@ export default {
     this._proxyBehaviorViewProperties();
     this._buildEventProxies();
 
-    var viewEvents = this._getEvents(eventsArg);
+    var viewEvents = this.getEvents(eventsArg);
 
     if (typeof eventsArg === 'undefined') {
       this.events = viewEvents;
@@ -53,68 +56,36 @@ export default {
       this._getBehaviorEvents(),
       viewEvents,
       this._getBehaviorTriggers(),
-      this._getTriggers()
+      this.getTriggers()
     );
 
     Backbone.View.prototype.delegateEvents.call(this, combinedEvents);
 
     return this;
   },
 
-  _getEvents: function(eventsArg) {
+  getEvents: function(eventsArg) {
     var events = this.getValue(eventsArg || this.events);
 
     return this.normalizeUIKeys(events);
   },
 
   // Configure `triggers` to forward DOM events to view
   // events. `triggers: {"click .foo": "do:foo"}`
-  _getTriggers: function() {
+  getTriggers: function() {
     if (!this.triggers) { return; }
 
     // Allow `triggers` to be configured as a function
     var triggers = this.normalizeUIKeys(_.result(this, 'triggers'));
 
     // Configure the triggers, prevent default
     // action and stop propagation of DOM events
-    return _.reduce(triggers, function(events, value, key) {
-      key = getUniqueEventName(key);
-      events[key] = this._buildViewTrigger(value);
-      return events;
-    }, {}, this);
-  },
-
-  // Internal method to create an event handler for a given `triggerDef` like
-  // 'click:foo'
-  _buildViewTrigger: function(triggerDef) {
-    if (_.isString(triggerDef)) {
-      triggerDef = {event: triggerDef};
-    }
-
-    const eventName = triggerDef.event;
-    const shouldPreventDefault = triggerDef.preventDefault !== false;
-    const shouldStopPropagation = triggerDef.stopPropagation !== false;
-
-    return function(e) {
-      if (shouldPreventDefault) {
-        e.preventDefault();
-      }
-
-      if (shouldStopPropagation) {
-        e.stopPropagation();
-      }
-
-      this.triggerMethod(eventName, this);
-    };
+    return this._getViewTriggers(this, triggers);
   },
 
   // Handle `modelEvents`, and `collectionEvents` configuration
   delegateEntityEvents: function() {
-    var modelEvents = this.getValue(this.getOption('modelEvents'));
-    this.bindEntityEvents(this.model, modelEvents);
-
-    var collectionEvents = this.getValue(this.getOption('collectionEvents'));
-    this.bindEntityEvents(this.collection, collectionEvents);
+    this._delegateEntityEvents(this.model, this.collection);
 
     // bind each behaviors model and collection events
     this._delegateBehaviorEntityEvents();
@@ -124,11 +95,7 @@ export default {
 
   // Handle unbinding `modelEvents`, and `collectionEvents` configuration
   undelegateEntityEvents: function() {
-    var modelEvents = this.getValue(this.getOption('modelEvents'));
-    this.unbindEntityEvents(this.model, modelEvents);
-
-    var collectionEvents = this.getValue(this.getOption('collectionEvents'));
-    this.unbindEntityEvents(this.collection, collectionEvents);
+    this._undelegateEntityEvents(this.model, this.collection);
 
     // unbind each behaviors model and collection events
     this._undelegateBehaviorEntityEvents();
@@ -270,3 +237,7 @@ export default {
     }
   }
 };
+
+_.extend(ViewMixin, BehaviorsMixin, CommonMixin, DelegateEntityEventsMixin, TriggersMixin,  UIMixin);
+
+export default ViewMixin;

src/view.js

@@ -5,9 +5,6 @@ import _                  from 'underscore';
 import Backbone           from 'backbone';
 import ViewMixin          from './mixins/view';
 import RegionsMixin       from './mixins/regions';
-import BehaviorsMixin     from './mixins/behaviors';
-import UIMixin            from './mixins/ui';
-import CommonMixin        from './mixins/common';
 import MonitorDOMRefresh  from './dom-refresh';
 import Renderer           from './renderer';
 
@@ -139,13 +136,16 @@ var View = Backbone.View.extend({
   // called by ViewMixin destroy
   _removeChildren: function() {
     this.removeRegions();
+  },
+
+  _getImmediateChildren: function() {
+    return _.chain(this.getRegions())
+      .pluck('currentView')
+      .compact()
+      .value();
   }
 });
 
-_.extend(View.prototype, ViewMixin);
-_.extend(View.prototype, RegionsMixin);
-_.extend(View.prototype, BehaviorsMixin);
-_.extend(View.prototype, UIMixin);
-_.extend(View.prototype, CommonMixin);
+_.extend(View.prototype, ViewMixin, RegionsMixin);
 
 export default View;