From ca1fdec9005d1818148e601690b1b9ecb5b732f6 Mon Sep 17 00:00:00 2001
From: Zachary Vance <vanceza@gmail.com>
Date: Thu, 21 May 2015 18:23:46 -0700
Subject: [PATCH] Shortcut library does its own binding so you don't have to
 update it all the time.

---
 dist/flowy.js           | 40 +++++++++++++++++++++++++++++-----------
 dist/flowy.unwrapped.js | 40 +++++++++++++++++++++++++++++-----------
 src/library/shortcut.js | 32 ++++++++++++++++++++++++++++----
 src/views/app.js        |  8 +-------
 4 files changed, 87 insertions(+), 33 deletions(-)

diff --git a/dist/flowy.js b/dist/flowy.js
index 9f31450..f389129 100644
--- a/dist/flowy.js
+++ b/dist/flowy.js
@@ -95,6 +95,8 @@ var Shortcut = (function(document, _) {
         globalMousetrap: globalMousetrap,
         boundObjects: [globalObject],
         shortcuts: {},
+        onRebindCallbacks: [],
+        onNewShortcutCallbacks: [],
         registerShortcut: function(shortcut) {
             if (arguments.length > 1) {
                 shortcut = {
@@ -127,6 +129,9 @@ var Shortcut = (function(document, _) {
             if (this.shortcuts[shortcut.id]) return this.shortcuts[shortcut.id];
             this.shortcuts[shortcut.id] = shortcut;
             _.chain(this.boundObjects).where({'type':shortcut.object}).each(_.partial(this.bindShortcut, shortcut, _), this).value();
+            _.each(this.onNewShortcutCallbacks, function(callback) {
+                callback.call(this, shortcut);
+            }, this);
             return shortcut;
         },
         unregisterShortcut: function(shortcut) {
@@ -154,7 +159,11 @@ var Shortcut = (function(document, _) {
             shortcut.unbind();
             shortcut._keybinding = keybinding;
             _.each(objects, shortcut.bind, shortcut);
-            if (this.onRebindShortcut) this.onRebindShortcut(shortcut, keybinding, oldKeybinding);
+            if (this.onRebindCallbacks) {
+                _.each(this.onRebindCallbacks, function(f) {
+                    f.call(this, shortcut, keybinding, oldKeybinding);
+                });
+            }
         },
         userRebindShortcut: function(shortcut, options) {
             // Cancels on focus loss or if the user presses the escape key
@@ -203,7 +212,12 @@ var Shortcut = (function(document, _) {
         shortcutPressed: function(shortcut, object) {
             if (shortcut.action) return shortcut.action(object.element, shortcut, object.type, object.options);
         },
-        onRebindShortcut: function(shortcut, keybinding, oldKeybinding) {
+        onNewShortcut: function(f) {
+            this.onNewShortcutCallbacks.push(f);
+        },
+        onRebindShortcut: function(f) {
+            this.onRebindCallbacks.push(f);
+            // function(shortcut, keybinding, oldKeybinding)
             // NOTE: You may want to hook into this if you want to save/load user preferences
             // shortcut.id is probably what you want and not the whole shortcut
         },
@@ -250,6 +264,16 @@ var Shortcut = (function(document, _) {
                 object.mousetrap.unpause();
             });
         },
+        bindShortcutsDisplay: function(element, options) {
+            element.innerHTML = this.displayShortcuts(options);
+            var self = this;
+            this.onRebindShortcut(function() {
+                element.innerHTML = self.displayShortcuts(options);
+            });
+            this.onNewShortcut(function() {
+                element.innerHTML = self.displayShortcuts(options);
+            });
+        },
         displayShortcuts: function(options) {
             options = _.defaults({}, options, {
                 objectGrouping: "default", // Display one list, or group under headers by object type? "true" "false", or "default"
@@ -262,8 +286,8 @@ var Shortcut = (function(document, _) {
                 var multipleObjectTypes = _.chain(shortcuts).pluck('object').unique().size().value() > 1;
                 options.objectGrouping = multipleObjectTypes;
             }
-            return '<h3>Shortcuts</h3><table>' + _.map(options.shortcuts, function(shortcut) {
-                return _.template("<tr><td><%= description %></td><td><%= keybindingHtml %></td></tr>")({
+            return '<table class="shortcuts">' + _.map(options.shortcuts, function(shortcut) {
+                return _.template('<tr><td class="shortcut-description"><%= description %></td><td class="shortcut-keybinding"><%= keybindingHtml %></td></tr>')({
                     description: shortcut.description,
                     keybindingHtml: this._displayKeybinding(shortcut, options)
                 });
@@ -778,20 +802,14 @@ var AppView = Backbone.View.extend({
                 e.save();
             });
         });
-        Shortcut.onRebindShortcut = function() {
-            self.renderShortcuts();
-        };
+        Shortcut.bindShortcutsDisplay(this.$("#shortcuts")[0], {allowRebind: true});
         this.views = {}; // A list of views for each element in the collection
         this.list.fetch();
         this.render();
     },
     render: function() {
-        this.renderShortcuts();
         return this;
     },
-    renderShortcuts: function() {
-        this.$("#shortcuts").html(Shortcut.displayShortcuts({allowRebind: true}));
-    },
     addOne: function(todo) {
         this.renderTodo(todo);
     },
diff --git a/dist/flowy.unwrapped.js b/dist/flowy.unwrapped.js
index 5ba3ba0..4f3edee 100644
--- a/dist/flowy.unwrapped.js
+++ b/dist/flowy.unwrapped.js
@@ -94,6 +94,8 @@ var Shortcut = (function(document, _) {
         globalMousetrap: globalMousetrap,
         boundObjects: [globalObject],
         shortcuts: {},
+        onRebindCallbacks: [],
+        onNewShortcutCallbacks: [],
         registerShortcut: function(shortcut) {
             if (arguments.length > 1) {
                 shortcut = {
@@ -126,6 +128,9 @@ var Shortcut = (function(document, _) {
             if (this.shortcuts[shortcut.id]) return this.shortcuts[shortcut.id];
             this.shortcuts[shortcut.id] = shortcut;
             _.chain(this.boundObjects).where({'type':shortcut.object}).each(_.partial(this.bindShortcut, shortcut, _), this).value();
+            _.each(this.onNewShortcutCallbacks, function(callback) {
+                callback.call(this, shortcut);
+            }, this);
             return shortcut;
         },
         unregisterShortcut: function(shortcut) {
@@ -153,7 +158,11 @@ var Shortcut = (function(document, _) {
             shortcut.unbind();
             shortcut._keybinding = keybinding;
             _.each(objects, shortcut.bind, shortcut);
-            if (this.onRebindShortcut) this.onRebindShortcut(shortcut, keybinding, oldKeybinding);
+            if (this.onRebindCallbacks) {
+                _.each(this.onRebindCallbacks, function(f) {
+                    f.call(this, shortcut, keybinding, oldKeybinding);
+                });
+            }
         },
         userRebindShortcut: function(shortcut, options) {
             // Cancels on focus loss or if the user presses the escape key
@@ -202,7 +211,12 @@ var Shortcut = (function(document, _) {
         shortcutPressed: function(shortcut, object) {
             if (shortcut.action) return shortcut.action(object.element, shortcut, object.type, object.options);
         },
-        onRebindShortcut: function(shortcut, keybinding, oldKeybinding) {
+        onNewShortcut: function(f) {
+            this.onNewShortcutCallbacks.push(f);
+        },
+        onRebindShortcut: function(f) {
+            this.onRebindCallbacks.push(f);
+            // function(shortcut, keybinding, oldKeybinding)
             // NOTE: You may want to hook into this if you want to save/load user preferences
             // shortcut.id is probably what you want and not the whole shortcut
         },
@@ -249,6 +263,16 @@ var Shortcut = (function(document, _) {
                 object.mousetrap.unpause();
             });
         },
+        bindShortcutsDisplay: function(element, options) {
+            element.innerHTML = this.displayShortcuts(options);
+            var self = this;
+            this.onRebindShortcut(function() {
+                element.innerHTML = self.displayShortcuts(options);
+            });
+            this.onNewShortcut(function() {
+                element.innerHTML = self.displayShortcuts(options);
+            });
+        },
         displayShortcuts: function(options) {
             options = _.defaults({}, options, {
                 objectGrouping: "default", // Display one list, or group under headers by object type? "true" "false", or "default"
@@ -261,8 +285,8 @@ var Shortcut = (function(document, _) {
                 var multipleObjectTypes = _.chain(shortcuts).pluck('object').unique().size().value() > 1;
                 options.objectGrouping = multipleObjectTypes;
             }
-            return '<h3>Shortcuts</h3><table>' + _.map(options.shortcuts, function(shortcut) {
-                return _.template("<tr><td><%= description %></td><td><%= keybindingHtml %></td></tr>")({
+            return '<table class="shortcuts">' + _.map(options.shortcuts, function(shortcut) {
+                return _.template('<tr><td class="shortcut-description"><%= description %></td><td class="shortcut-keybinding"><%= keybindingHtml %></td></tr>')({
                     description: shortcut.description,
                     keybindingHtml: this._displayKeybinding(shortcut, options)
                 });
@@ -777,20 +801,14 @@ var AppView = Backbone.View.extend({
                 e.save();
             });
         });
-        Shortcut.onRebindShortcut = function() {
-            self.renderShortcuts();
-        };
+        Shortcut.bindShortcutsDisplay(this.$("#shortcuts")[0], {allowRebind: true});
         this.views = {}; // A list of views for each element in the collection
         this.list.fetch();
         this.render();
     },
     render: function() {
-        this.renderShortcuts();
         return this;
     },
-    renderShortcuts: function() {
-        this.$("#shortcuts").html(Shortcut.displayShortcuts({allowRebind: true}));
-    },
     addOne: function(todo) {
         this.renderTodo(todo);
     },
diff --git a/src/library/shortcut.js b/src/library/shortcut.js
index dfa58de..0a6f075 100644
--- a/src/library/shortcut.js
+++ b/src/library/shortcut.js
@@ -33,6 +33,8 @@ var Shortcut = (function(document, _) {
         globalMousetrap: globalMousetrap,
         boundObjects: [globalObject],
         shortcuts: {},
+        onRebindCallbacks: [],
+        onNewShortcutCallbacks: [],
         registerShortcut: function(shortcut) {
             if (arguments.length > 1) {
                 shortcut = {
@@ -65,6 +67,9 @@ var Shortcut = (function(document, _) {
             if (this.shortcuts[shortcut.id]) return this.shortcuts[shortcut.id];
             this.shortcuts[shortcut.id] = shortcut;
             _.chain(this.boundObjects).where({'type':shortcut.object}).each(_.partial(this.bindShortcut, shortcut, _), this).value();
+            _.each(this.onNewShortcutCallbacks, function(callback) {
+                callback.call(this, shortcut);
+            }, this);
             return shortcut;
         },
         unregisterShortcut: function(shortcut) {
@@ -92,7 +97,11 @@ var Shortcut = (function(document, _) {
             shortcut.unbind();
             shortcut._keybinding = keybinding;
             _.each(objects, shortcut.bind, shortcut);
-            if (this.onRebindShortcut) this.onRebindShortcut(shortcut, keybinding, oldKeybinding);
+            if (this.onRebindCallbacks) {
+                _.each(this.onRebindCallbacks, function(f) {
+                    f.call(this, shortcut, keybinding, oldKeybinding);
+                });
+            }
         },
         userRebindShortcut: function(shortcut, options) {
             // Cancels on focus loss or if the user presses the escape key
@@ -141,7 +150,12 @@ var Shortcut = (function(document, _) {
         shortcutPressed: function(shortcut, object) {
             if (shortcut.action) return shortcut.action(object.element, shortcut, object.type, object.options);
         },
-        onRebindShortcut: function(shortcut, keybinding, oldKeybinding) {
+        onNewShortcut: function(f) {
+            this.onNewShortcutCallbacks.push(f);
+        },
+        onRebindShortcut: function(f) {
+            this.onRebindCallbacks.push(f);
+            // function(shortcut, keybinding, oldKeybinding)
             // NOTE: You may want to hook into this if you want to save/load user preferences
             // shortcut.id is probably what you want and not the whole shortcut
         },
@@ -188,6 +202,16 @@ var Shortcut = (function(document, _) {
                 object.mousetrap.unpause();
             });
         },
+        bindShortcutsDisplay: function(element, options) {
+            element.innerHTML = this.displayShortcuts(options);
+            var self = this;
+            this.onRebindShortcut(function() {
+                element.innerHTML = self.displayShortcuts(options);
+            });
+            this.onNewShortcut(function() {
+                element.innerHTML = self.displayShortcuts(options);
+            });
+        },
         displayShortcuts: function(options) {
             options = _.defaults({}, options, {
                 objectGrouping: "default", // Display one list, or group under headers by object type? "true" "false", or "default"
@@ -200,8 +224,8 @@ var Shortcut = (function(document, _) {
                 var multipleObjectTypes = _.chain(shortcuts).pluck('object').unique().size().value() > 1;
                 options.objectGrouping = multipleObjectTypes;
             }
-            return '<h3>Shortcuts</h3><table>' + _.map(options.shortcuts, function(shortcut) {
-                return _.template("<tr><td><%= description %></td><td><%= keybindingHtml %></td></tr>")({
+            return '<table class="shortcuts">' + _.map(options.shortcuts, function(shortcut) {
+                return _.template('<tr><td class="shortcut-description"><%= description %></td><td class="shortcut-keybinding"><%= keybindingHtml %></td></tr>')({
                     description: shortcut.description,
                     keybindingHtml: this._displayKeybinding(shortcut, options)
                 });
diff --git a/src/views/app.js b/src/views/app.js
index 31d06dd..9639bf2 100644
--- a/src/views/app.js
+++ b/src/views/app.js
@@ -79,20 +79,14 @@ var AppView = Backbone.View.extend({
                 e.save();
             });
         });
-        Shortcut.onRebindShortcut = function() {
-            self.renderShortcuts();
-        };
+        Shortcut.bindShortcutsDisplay(this.$("#shortcuts")[0], {allowRebind: true});
         this.views = {}; // A list of views for each element in the collection
         this.list.fetch();
         this.render();
     },
     render: function() {
-        this.renderShortcuts();
         return this;
     },
-    renderShortcuts: function() {
-        this.$("#shortcuts").html(Shortcut.displayShortcuts({allowRebind: true}));
-    },
     addOne: function(todo) {
         this.renderTodo(todo);
     },
-- 
2.47.3