v1.4.0beta release

echernyavskiy · Nov 30, 2013 · ae50635 · ae50635
1 parent de63499
commit ae50635
Show file tree

Hide file tree

Showing 36 changed files with 270 additions and 124 deletions.
diff --git a/bower.json b/bower.json
@@ -3,7 +3,7 @@
   "description" : "Make your Backbone.js apps dance with a composite application architecture!",
   "url"         : "http://marionettejs.org",
   "main"        : "./lib/backbone.marionette.js",
-  "version"     : "1.3.0",
+  "version"     : "1.4.0-beta",
 
   "keywords"     : [
     "backbone",

diff --git a/changelog.md b/changelog.md
@@ -1,3 +1,17 @@
+### v1.4.0-beta [view commit logs](https://github.com/marionettejs/backbone.marionette/compare/v1.3.0...v1.4.0beta)
+* Views
+  * adds the ability to DRY up your ```events``` and ```triggers``` hashes by cross using the ui hash from within your hash keys
+    ```coffeescript
+    ui:
+      button: '.button'
+
+    triggers:
+      'click @ui.button': 'bam'
+
+    events:
+      'click @ui.button': 'onButtonClick'
+    ```
+
 ### v1.3.0 [view commit logs](https://github.com/marionettejs/backbone.marionette/compare/v1.2.3...v1.3.0)
 * CompositeView / CollectionView
   * Massive perf boost in rendering collection and composite views by using document fragments [jsPerf](http://jsperf.com/marionette-documentfragment-collectionview/5)

diff --git a/lib/backbone.marionette.js b/lib/backbone.marionette.js
@@ -1,6 +1,6 @@
 // MarionetteJS (Backbone.Marionette)
 // ----------------------------------
-// v1.3.0
+// v1.4.0-beta
 //
 // Copyright (c)2013 Derick Bailey, Muted Solutions, LLC.
 // Distributed under MIT license
@@ -1212,6 +1212,9 @@ Marionette.View = Backbone.View.extend({
     // of this.options
     // at some point however this may be removed
     this.options = options || {};
+
+    // parses out the @ui DSL for events
+    this.events = this.normalizeUIKeys(_.result(this, 'events'));
     Backbone.View.prototype.constructor.apply(this, args);
 
     Marionette.MonitorDOMRefresh(this);
@@ -1244,6 +1247,25 @@ Marionette.View = Backbone.View.extend({
     return _.extend(target, templateHelpers);
   },
 
+  // allows for the use of the @ui. syntax within
+  // a given key for triggers and events
+  // swaps the @ui with the associated selector
+  normalizeUIKeys: function(hash) {
+    if (typeof(hash) === "undefined") {
+      return;
+    }
+
+    _.each(_.keys(hash), function(v) {
+      var split = v.split("@ui.");
+      if (split.length === 2) {
+        hash[split[0]+this.ui[split[1]]] = hash[v];
+        delete hash[v];
+      }
+    }, this);
+
+    return hash;
+  },
+
   // Configure `triggers` to forward DOM events to view
   // events. `triggers: {"click .foo": "do:foo"}`
   configureTriggers: function(){
@@ -1252,7 +1274,7 @@ Marionette.View = Backbone.View.extend({
     var triggerEvents = {};
 
     // Allow `triggers` to be configured as a function
-    var triggers = _.result(this, "triggers");
+    var triggers = this.normalizeUIKeys(_.result(this, "triggers"));
 
     // Configure the triggers, prevent default
     // action and stop propagation of DOM events

diff --git a/lib/backbone.marionette.map b/lib/backbone.marionette.map
diff --git a/lib/backbone.marionette.min.js b/lib/backbone.marionette.min.js
diff --git a/lib/core/amd/backbone.marionette.js b/lib/core/amd/backbone.marionette.js
@@ -1,6 +1,6 @@
 // MarionetteJS (Backbone.Marionette)
 // ----------------------------------
-// v1.3.0
+// v1.4.0-beta
 //
 // Copyright (c)2013 Derick Bailey, Muted Solutions, LLC.
 // Distributed under MIT license
@@ -804,6 +804,9 @@ Marionette.View = Backbone.View.extend({
     // of this.options
     // at some point however this may be removed
     this.options = options || {};
+
+    // parses out the @ui DSL for events
+    this.events = this.normalizeUIKeys(_.result(this, 'events'));
     Backbone.View.prototype.constructor.apply(this, args);
 
     Marionette.MonitorDOMRefresh(this);
@@ -836,6 +839,25 @@ Marionette.View = Backbone.View.extend({
     return _.extend(target, templateHelpers);
   },
 
+  // allows for the use of the @ui. syntax within
+  // a given key for triggers and events
+  // swaps the @ui with the associated selector
+  normalizeUIKeys: function(hash) {
+    if (typeof(hash) === "undefined") {
+      return;
+    }
+
+    _.each(_.keys(hash), function(v) {
+      var split = v.split("@ui.");
+      if (split.length === 2) {
+        hash[split[0]+this.ui[split[1]]] = hash[v];
+        delete hash[v];
+      }
+    }, this);
+
+    return hash;
+  },
+
   // Configure `triggers` to forward DOM events to view
   // events. `triggers: {"click .foo": "do:foo"}`
   configureTriggers: function(){
@@ -844,7 +866,7 @@ Marionette.View = Backbone.View.extend({
     var triggerEvents = {};
 
     // Allow `triggers` to be configured as a function
-    var triggers = _.result(this, "triggers");
+    var triggers = this.normalizeUIKeys(_.result(this, "triggers"));
 
     // Configure the triggers, prevent default
     // action and stop propagation of DOM events

diff --git a/lib/core/amd/backbone.marionette.min.js b/lib/core/amd/backbone.marionette.min.js
diff --git a/lib/core/backbone.marionette.js b/lib/core/backbone.marionette.js
@@ -768,6 +768,9 @@ Marionette.View = Backbone.View.extend({
     // of this.options
     // at some point however this may be removed
     this.options = options || {};
+
+    // parses out the @ui DSL for events
+    this.events = this.normalizeUIKeys(_.result(this, 'events'));
     Backbone.View.prototype.constructor.apply(this, args);
 
     Marionette.MonitorDOMRefresh(this);
@@ -800,6 +803,25 @@ Marionette.View = Backbone.View.extend({
     return _.extend(target, templateHelpers);
   },
 
+  // allows for the use of the @ui. syntax within
+  // a given key for triggers and events
+  // swaps the @ui with the associated selector
+  normalizeUIKeys: function(hash) {
+    if (typeof(hash) === "undefined") {
+      return;
+    }
+
+    _.each(_.keys(hash), function(v) {
+      var split = v.split("@ui.");
+      if (split.length === 2) {
+        hash[split[0]+this.ui[split[1]]] = hash[v];
+        delete hash[v];
+      }
+    }, this);
+
+    return hash;
+  },
+
   // Configure `triggers` to forward DOM events to view
   // events. `triggers: {"click .foo": "do:foo"}`
   configureTriggers: function(){
@@ -808,7 +830,7 @@ Marionette.View = Backbone.View.extend({
     var triggerEvents = {};
 
     // Allow `triggers` to be configured as a function
-    var triggers = _.result(this, "triggers");
+    var triggers = this.normalizeUIKeys(_.result(this, "triggers"));
 
     // Configure the triggers, prevent default
     // action and stop propagation of DOM events

diff --git a/lib/core/backbone.marionette.map b/lib/core/backbone.marionette.map
diff --git a/lib/core/backbone.marionette.min.js b/lib/core/backbone.marionette.min.js
diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "backbone.marionette",
   "description": "Make your Backbone.js apps dance!",
-  "version": "1.3.0",
+  "version": "1.4.0-beta",
   "homepage": "https://github.com/marionettejs/backbone.marionette",
   "main": "lib/core/amd/backbone.marionette.js",
   "keywords": [

diff --git a/reports/coverage.json b/reports/coverage.json
diff --git a/reports/coverage/index.html b/reports/coverage/index.html
@@ -183,16 +183,16 @@
     <h1>Code coverage report for <span class="entity">All files</span></h1>
     <h2>
 
-        Statements: <span class="metric">98.08% <small>(663 / 676)</small></span> &nbsp;&nbsp;&nbsp;&nbsp;
+        Statements: <span class="metric">98.1% <small>(672 / 685)</small></span> &nbsp;&nbsp;&nbsp;&nbsp;
 
 
-        Branches: <span class="metric">93.68% <small>(237 / 253)</small></span> &nbsp;&nbsp;&nbsp;&nbsp;
+        Branches: <span class="metric">93.77% <small>(241 / 257)</small></span> &nbsp;&nbsp;&nbsp;&nbsp;
 
 
-        Functions: <span class="metric">98.88% <small>(176 / 178)</small></span> &nbsp;&nbsp;&nbsp;&nbsp;
+        Functions: <span class="metric">98.89% <small>(178 / 180)</small></span> &nbsp;&nbsp;&nbsp;&nbsp;
 
 
-        Lines: <span class="metric">98.62% <small>(644 / 653)</small></span> &nbsp;&nbsp;&nbsp;&nbsp;
+        Lines: <span class="metric">98.64% <small>(653 / 662)</small></span> &nbsp;&nbsp;&nbsp;&nbsp;
 
     </h2>
     <div class="path"></div>
@@ -229,15 +229,15 @@ <h2>
 
 <tr>
 	<td class="file high" data-value="src/"><a href="src/index.html">src/</a></td>
-	<td data-value="98.06" class="pic high"><span class="cover-fill" style="width: 98px;"></span><span class="cover-empty" style="width:2px;"></span></td>
-	<td data-value="98.06" class="pct high">98.06%</td>
-	<td data-value="670" class="abs high">(657&nbsp;/&nbsp;670)</td>
-	<td data-value="93.68" class="pct high">93.68%</td>
-	<td data-value="253" class="abs high">(237&nbsp;/&nbsp;253)</td>
-	<td data-value="98.87" class="pct high">98.87%</td>
-	<td data-value="177" class="abs high">(175&nbsp;/&nbsp;177)</td>
-	<td data-value="98.61" class="pct high">98.61%</td>
-	<td data-value="647" class="abs high">(638&nbsp;/&nbsp;647)</td>
+	<td data-value="98.09" class="pic high"><span class="cover-fill" style="width: 98px;"></span><span class="cover-empty" style="width:2px;"></span></td>
+	<td data-value="98.09" class="pct high">98.09%</td>
+	<td data-value="679" class="abs high">(666&nbsp;/&nbsp;679)</td>
+	<td data-value="93.77" class="pct high">93.77%</td>
+	<td data-value="257" class="abs high">(241&nbsp;/&nbsp;257)</td>
+	<td data-value="98.88" class="pct high">98.88%</td>
+	<td data-value="179" class="abs high">(177&nbsp;/&nbsp;179)</td>
+	<td data-value="98.63" class="pct high">98.63%</td>
+	<td data-value="656" class="abs high">(647&nbsp;/&nbsp;656)</td>
 	</tr>
 
 <tr>
@@ -258,7 +258,7 @@ <h2>
 </div>
 </div>
 <div class="footer">
-    <div class="meta">Generated by <a href="http://istanbul-js.org/" target="_blank">istanbul</a> at Mon Nov 25 2013 13:56:34 GMT-0500 (EST)</div>
+    <div class="meta">Generated by <a href="http://istanbul-js.org/" target="_blank">istanbul</a> at Sat Nov 30 2013 17:25:28 GMT-0500 (EST)</div>
 </div>
 
 <script src="prettify.js"></script>

diff --git a/reports/coverage/spec/javascripts/support/index.html b/reports/coverage/spec/javascripts/support/index.html
@@ -232,7 +232,7 @@ <h2>
 </div>
 </div>
 <div class="footer">
-    <div class="meta">Generated by <a href="http://istanbul-js.org/" target="_blank">istanbul</a> at Mon Nov 25 2013 13:56:34 GMT-0500 (EST)</div>
+    <div class="meta">Generated by <a href="http://istanbul-js.org/" target="_blank">istanbul</a> at Sat Nov 30 2013 17:25:28 GMT-0500 (EST)</div>
 </div>
 
 <script src="../../../prettify.js"></script>

diff --git a/reports/coverage/spec/javascripts/support/marionette.support.js.html b/reports/coverage/spec/javascripts/support/marionette.support.js.html
@@ -207,7 +207,7 @@ <h2>
 
 </div>
 <div class="footer">
-    <div class="meta">Generated by <a href="http://istanbul-js.org/" target="_blank">istanbul</a> at Mon Nov 25 2013 13:56:34 GMT-0500 (EST)</div>
+    <div class="meta">Generated by <a href="http://istanbul-js.org/" target="_blank">istanbul</a> at Sat Nov 30 2013 17:25:28 GMT-0500 (EST)</div>
 </div>
 
 <script src="../../../prettify.js"></script>

diff --git a/reports/coverage/src/build/index.html b/reports/coverage/src/build/index.html
@@ -232,7 +232,7 @@ <h2>
 </div>
 </div>
 <div class="footer">
-    <div class="meta">Generated by <a href="http://istanbul-js.org/" target="_blank">istanbul</a> at Mon Nov 25 2013 13:56:34 GMT-0500 (EST)</div>
+    <div class="meta">Generated by <a href="http://istanbul-js.org/" target="_blank">istanbul</a> at Sat Nov 30 2013 17:25:28 GMT-0500 (EST)</div>
 </div>
 
 <script src="../../prettify.js"></script>

diff --git a/reports/coverage/src/build/marionette.core.js.html b/reports/coverage/src/build/marionette.core.js.html
@@ -312,7 +312,7 @@ <h2>
 
 </div>
 <div class="footer">
-    <div class="meta">Generated by <a href="http://istanbul-js.org/" target="_blank">istanbul</a> at Mon Nov 25 2013 13:56:34 GMT-0500 (EST)</div>
+    <div class="meta">Generated by <a href="http://istanbul-js.org/" target="_blank">istanbul</a> at Sat Nov 30 2013 17:25:28 GMT-0500 (EST)</div>
 </div>
 
 <script src="../../prettify.js"></script>

diff --git a/reports/coverage/src/index.html b/reports/coverage/src/index.html
@@ -183,16 +183,16 @@
     <h1>Code coverage report for <span class="entity">src/</span></h1>
     <h2>
 
-        Statements: <span class="metric">98.06% <small>(657 / 670)</small></span> &nbsp;&nbsp;&nbsp;&nbsp;
+        Statements: <span class="metric">98.09% <small>(666 / 679)</small></span> &nbsp;&nbsp;&nbsp;&nbsp;
 
 
-        Branches: <span class="metric">93.68% <small>(237 / 253)</small></span> &nbsp;&nbsp;&nbsp;&nbsp;
+        Branches: <span class="metric">93.77% <small>(241 / 257)</small></span> &nbsp;&nbsp;&nbsp;&nbsp;
 
 
-        Functions: <span class="metric">98.87% <small>(175 / 177)</small></span> &nbsp;&nbsp;&nbsp;&nbsp;
+        Functions: <span class="metric">98.88% <small>(177 / 179)</small></span> &nbsp;&nbsp;&nbsp;&nbsp;
 
 
-        Lines: <span class="metric">98.61% <small>(638 / 647)</small></span> &nbsp;&nbsp;&nbsp;&nbsp;
+        Lines: <span class="metric">98.63% <small>(647 / 656)</small></span> &nbsp;&nbsp;&nbsp;&nbsp;
 
     </h2>
     <div class="path"><a href="../index.html">All files</a> &#187; src/</div>
@@ -437,23 +437,23 @@ <h2>
 
 <tr>
 	<td class="file high" data-value="marionette.view.js"><a href="marionette.view.js.html">marionette.view.js</a></td>
-	<td data-value="98.59" class="pic high"><span class="cover-fill" style="width: 98px;"></span><span class="cover-empty" style="width:2px;"></span></td>
-	<td data-value="98.59" class="pct high">98.59%</td>
-	<td data-value="71" class="abs high">(70&nbsp;/&nbsp;71)</td>
-	<td data-value="92.5" class="pct high">92.5%</td>
-	<td data-value="40" class="abs high">(37&nbsp;/&nbsp;40)</td>
+	<td data-value="98.75" class="pic high"><span class="cover-fill" style="width: 98px;"></span><span class="cover-empty" style="width:2px;"></span></td>
+	<td data-value="98.75" class="pct high">98.75%</td>
+	<td data-value="80" class="abs high">(79&nbsp;/&nbsp;80)</td>
+	<td data-value="93.18" class="pct high">93.18%</td>
+	<td data-value="44" class="abs high">(41&nbsp;/&nbsp;44)</td>
 	<td data-value="100" class="pct high">100%</td>
-	<td data-value="15" class="abs high">(15&nbsp;/&nbsp;15)</td>
+	<td data-value="17" class="abs high">(17&nbsp;/&nbsp;17)</td>
 	<td data-value="100" class="pct high">100%</td>
-	<td data-value="64" class="abs high">(64&nbsp;/&nbsp;64)</td>
+	<td data-value="73" class="abs high">(73&nbsp;/&nbsp;73)</td>
 	</tr>
 
 </tbody>
 </table>
 </div>
 </div>
 <div class="footer">
-    <div class="meta">Generated by <a href="http://istanbul-js.org/" target="_blank">istanbul</a> at Mon Nov 25 2013 13:56:34 GMT-0500 (EST)</div>
+    <div class="meta">Generated by <a href="http://istanbul-js.org/" target="_blank">istanbul</a> at Sat Nov 30 2013 17:25:28 GMT-0500 (EST)</div>
 </div>
 
 <script src="../prettify.js"></script>

diff --git a/reports/coverage/src/marionette.application.js.html b/reports/coverage/src/marionette.application.js.html
@@ -516,7 +516,7 @@ <h2>
 
 </div>
 <div class="footer">
-    <div class="meta">Generated by <a href="http://istanbul-js.org/" target="_blank">istanbul</a> at Mon Nov 25 2013 13:56:34 GMT-0500 (EST)</div>
+    <div class="meta">Generated by <a href="http://istanbul-js.org/" target="_blank">istanbul</a> at Sat Nov 30 2013 17:25:28 GMT-0500 (EST)</div>
 </div>
 
 <script src="../prettify.js"></script>

diff --git a/reports/coverage/src/marionette.approuter.js.html b/reports/coverage/src/marionette.approuter.js.html
@@ -399,7 +399,7 @@ <h2>
 
 </div>
 <div class="footer">
-    <div class="meta">Generated by <a href="http://istanbul-js.org/" target="_blank">istanbul</a> at Mon Nov 25 2013 13:56:34 GMT-0500 (EST)</div>
+    <div class="meta">Generated by <a href="http://istanbul-js.org/" target="_blank">istanbul</a> at Sat Nov 30 2013 17:25:28 GMT-0500 (EST)</div>
 </div>
 
 <script src="../prettify.js"></script>

diff --git a/reports/coverage/src/marionette.bindEntityEvents.js.html b/reports/coverage/src/marionette.bindEntityEvents.js.html
@@ -348,7 +348,7 @@ <h2>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-yes">1</span>
-<span class="cline-any cline-yes">2083</span>
+<span class="cline-any cline-yes">2115</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-yes">74</span>
@@ -371,11 +371,11 @@ <h2>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-yes">1</span>
-<span class="cline-any cline-yes">1037</span>
+<span class="cline-any cline-yes">1053</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-yes">1</span>
-<span class="cline-any cline-yes">1046</span>
+<span class="cline-any cline-yes">1062</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
 <span class="cline-any cline-neutral">&nbsp;</span>
@@ -474,7 +474,7 @@ <h2>
 
 </div>
 <div class="footer">
-    <div class="meta">Generated by <a href="http://istanbul-js.org/" target="_blank">istanbul</a> at Mon Nov 25 2013 13:56:34 GMT-0500 (EST)</div>
+    <div class="meta">Generated by <a href="http://istanbul-js.org/" target="_blank">istanbul</a> at Sat Nov 30 2013 17:25:28 GMT-0500 (EST)</div>
 </div>
 
 <script src="../prettify.js"></script>

diff --git a/reports/coverage/src/marionette.callbacks.js.html b/reports/coverage/src/marionette.callbacks.js.html
@@ -339,7 +339,7 @@ <h2>
 
 </div>
 <div class="footer">
-    <div class="meta">Generated by <a href="http://istanbul-js.org/" target="_blank">istanbul</a> at Mon Nov 25 2013 13:56:34 GMT-0500 (EST)</div>
+    <div class="meta">Generated by <a href="http://istanbul-js.org/" target="_blank">istanbul</a> at Sat Nov 30 2013 17:25:28 GMT-0500 (EST)</div>
 </div>
 
 <script src="../prettify.js"></script>

diff --git a/reports/coverage/src/marionette.collectionview.js.html b/reports/coverage/src/marionette.collectionview.js.html
@@ -1122,7 +1122,7 @@ <h2>
 
 </div>
 <div class="footer">
-    <div class="meta">Generated by <a href="http://istanbul-js.org/" target="_blank">istanbul</a> at Mon Nov 25 2013 13:56:34 GMT-0500 (EST)</div>
+    <div class="meta">Generated by <a href="http://istanbul-js.org/" target="_blank">istanbul</a> at Sat Nov 30 2013 17:25:28 GMT-0500 (EST)</div>
 </div>
 
 <script src="../prettify.js"></script>