From 40c2411f2a1ce0bbd177f377828f9d6700112b06 Mon Sep 17 00:00:00 2001
From: Maxime Quandalle <maxime@quandalle.com>
Date: Tue, 26 May 2015 20:30:01 +0200
Subject: Implement a new system to handle "escape actions"

The new EscapeActions object decide what to do when the user press the
Escape key (such as closing a opened popup or inlined form).

This commit also re-introduced the sidebar current view as a sidebar
component local state.
---
 client/components/main/editor.js      | 66 +++++++++++++++++++++++++++++++++++
 client/components/main/events.js      |  8 -----
 client/components/main/rendered.js    | 40 ---------------------
 client/components/main/templates.html |  2 +-
 4 files changed, 67 insertions(+), 49 deletions(-)
 create mode 100644 client/components/main/editor.js
 delete mode 100644 client/components/main/events.js
 delete mode 100644 client/components/main/rendered.js

(limited to 'client/components/main')

diff --git a/client/components/main/editor.js b/client/components/main/editor.js
new file mode 100644
index 00000000..95a8dc5d
--- /dev/null
+++ b/client/components/main/editor.js
@@ -0,0 +1,66 @@
+var dropdownMenuIsOpened = false;
+
+Template.editor.onRendered(function() {
+  var $textarea = this.$('textarea');
+
+  $textarea.textcomplete([
+    // Emojies
+    {
+      match: /\B:([\-+\w]*)$/,
+      search: function(term, callback) {
+        callback($.map(Emoji.values, function(emoji) {
+          return emoji.indexOf(term) === 0 ? emoji : null;
+        }));
+      },
+      template: function(value) {
+        var image = '<img src="' + Emoji.baseImagePath + value + '.png"></img>';
+        return image + value;
+      },
+      replace: function(value) {
+        return ':' + value + ':';
+      },
+      index: 1
+    },
+
+    // User mentions
+    {
+      match: /\B@(\w*)$/,
+      search: function(term, callback) {
+        var currentBoard = Boards.findOne(Session.get('currentBoard'));
+        callback($.map(currentBoard.members, function(member) {
+          var username = Users.findOne(member.userId).username;
+          return username.indexOf(term) === 0 ? username : null;
+        }));
+      },
+      template: function(value) {
+        return value;
+      },
+      replace: function(username) {
+        return '@' + username + ' ';
+      },
+      index: 1
+    }
+  ]);
+
+  // Since commit d474017 jquery-textComplete automatically closes a potential
+  // opened dropdown menu when the user press Escape. This behavior conflicts
+  // with our EscapeActions system, but it's too complicated and hacky to
+  // monkey-pach textComplete to disable it -- I tried. Instead we listen to
+  // 'open' and 'hide' events, and create a ghost escapeAction when the dropdown
+  // is opened (and rely on textComplete to execute the actual action).
+  $textarea.on({
+    'textComplete:show': function() {
+      dropdownMenuIsOpened = true;
+    },
+    'textComplete:hide': function() {
+      Tracker.afterFlush(function() {
+        dropdownMenuIsOpened = false;
+      });
+    }
+  });
+});
+
+EscapeActions.register(10,
+  function() { return dropdownMenuIsOpened; },
+  function() {}
+);
diff --git a/client/components/main/events.js b/client/components/main/events.js
deleted file mode 100644
index beb90c5e..00000000
--- a/client/components/main/events.js
+++ /dev/null
@@ -1,8 +0,0 @@
-Template.editor.events({
-  // Pressing Ctrl+Enter should submit the form.
-  'keydown textarea': function(event) {
-    if (event.keyCode === 13 && (event.metaKey || event.ctrlKey)) {
-      $(event.currentTarget).parents('form:first').submit();
-    }
-  }
-});
diff --git a/client/components/main/rendered.js b/client/components/main/rendered.js
deleted file mode 100644
index 787e8225..00000000
--- a/client/components/main/rendered.js
+++ /dev/null
@@ -1,40 +0,0 @@
-Template.editor.rendered = function() {
-  this.$('textarea').textcomplete([
-    // Emojies
-    {
-      match: /\B:([\-+\w]*)$/,
-      search: function(term, callback) {
-        callback($.map(Emoji.values, function(emoji) {
-          return emoji.indexOf(term) === 0 ? emoji : null;
-        }));
-      },
-      template: function(value) {
-        var image = '<img src="' + Emoji.baseImagePath + value + '.png"></img>';
-        return image + value;
-      },
-      replace: function(value) {
-        return ':' + value + ':';
-      },
-      index: 1
-    },
-
-    // User mentions
-    {
-      match: /\B@(\w*)$/,
-      search: function(term, callback) {
-        var currentBoard = Boards.findOne(Session.get('currentBoard'));
-        callback($.map(currentBoard.members, function(member) {
-          var username = Users.findOne(member.userId).username;
-          return username.indexOf(term) === 0 ? username : null;
-        }));
-      },
-      template: function(value) {
-        return value;
-      },
-      replace: function(username) {
-        return '@' + username + ' ';
-      },
-      index: 1
-    }
-  ]);
-};
diff --git a/client/components/main/templates.html b/client/components/main/templates.html
index e9be0f93..4828663a 100644
--- a/client/components/main/templates.html
+++ b/client/components/main/templates.html
@@ -12,7 +12,7 @@
 </template>
 
 <template name="editor">
-    <textarea class="{{class}}" placeholder="{{_ 'comment-placeholder'}}" id="{{id}}" tabindex="1">{{> UI.contentBlock }}</textarea>
+    <textarea class="{{class}}" placeholder="{{_ 'comment-placeholder'}}" id="{{id}}" autofocus="{{autofocus}}">{{> UI.contentBlock}}</textarea>
 </template>
 
 <template name="viewer">{{#markdown}}{{#emoji}}{{#mentions}}{{> UI.contentBlock }}{{/mentions}}{{/emoji}}{{/markdown}}</template>
-- 
cgit v1.2.3-1-g7c22