Extract tags autocompletion JS to file

6 files changed, 50 insertions, 46 deletions

diff --git a/app/assets/javascripts/app/pages/settings.js b/app/assets/javascripts/app/pages/settings.js
index 517d17663..3b1f8f3e0 100644
--- a/app/assets/javascripts/app/pages/settings.js
+++ b/app/assets/javascripts/app/pages/settings.js
@@ -4,6 +4,10 @@ app.pages.Settings = Backbone.View.extend({
     $(".settings-visibility").tooltip({placement: "top"});
     $(".profile-visibility-hint").tooltip({placement: "top"});
     $("[name='profile[public_details]']").bootstrapSwitch();
+
+    new Diaspora.TagsAutocomplete("#profile_tag_string", {
+      preFill: gon.preloads.tagsArray
+    });
   }
 });
 // @license-end
diff --git a/app/assets/javascripts/app/views/tag_following_list_view.js b/app/assets/javascripts/app/views/tag_following_list_view.js
index 0504ab270..d284f137c 100644
--- a/app/assets/javascripts/app/views/tag_following_list_view.js
+++ b/app/assets/javascripts/app/views/tag_following_list_view.js
@@ -1,6 +1,5 @@
 // @license magnet:?xt=urn:btih:0b31508aeb0634b347b8270c7bee4d411b5d4109&dn=agpl-3.0.txt AGPL-v3-or-Later
 
-//= require jquery.autoSuggest.custom
 app.views.TagFollowingList = app.views.Base.extend({
 
   templateName: "tag_following_list",
@@ -30,29 +29,9 @@ app.views.TagFollowingList = app.views.Base.extend({
   },
 
   setupAutoSuggest : function() {
-    this.$("input").autoSuggest("/tags", {
-      selectedItemProp: "name",
-      selectedValuesProp: "name",
-      searchObjProps: "name",
-      asHtmlID: "tags",
-      neverSubmit: true,
-      retrieveLimit: 10,
-      selectionLimit: false,
-      minChars: 2,
-      keyDelay: 200,
-      startText: "",
-      emptyText: "no_results",
+    new Diaspora.TagsAutocomplete(this.$("input"), {
       selectionAdded: _.bind(this.suggestSelection, this)
     });
-
-    this.$("input").bind('keydown', function(evt){
-      if(evt.which === Keycodes.ENTER || evt.which === Keycodes.TAB || evt.which === Keycodes.SPACE) {
-        evt.preventDefault();
-        if( $('li.as-result-item.active').length === 0 ){
-          $('li.as-result-item').first().click();
-        }
-      }
-    });
   },
 
   presenter : function() {
diff --git a/app/assets/javascripts/helpers/tags_autocomplete.js b/app/assets/javascripts/helpers/tags_autocomplete.js
new file mode 100644
index 000000000..0aefefae7
--- /dev/null
+++ b/app/assets/javascripts/helpers/tags_autocomplete.js
@@ -0,0 +1,41 @@
+// @license magnet:?xt=urn:btih:0b31508aeb0634b347b8270c7bee4d411b5d4109&dn=agpl-3.0.txt AGPL-v3-or-Later
+
+Diaspora.TagsAutocomplete = function(element, opts) {
+  this.initialize(element, opts);
+};
+
+Diaspora.TagsAutocomplete.prototype = {
+  constructor: Diaspora.TagsAutocomplete,
+
+  initialize: function(element, opts) {
+    this.options = {
+      selectedItemProp: "name",
+      selectedValuesProp: "name",
+      searchObjProps: "name",
+      asHtmlID: "tags",
+      neverSubmit: true,
+      retrieveLimit: 10,
+      selectionLimit: false,
+      minChars: 2,
+      keyDelay: 200,
+      startText: "",
+      emptyText: Diaspora.I18n.t("no_results")
+    };
+
+    $.extend(this.options, opts);
+
+    this.autocompleteInput = $(element);
+    this.autocompleteInput.autoSuggest("/tags", this.options);
+    this.autocompleteInput.bind("keydown", this.keydown);
+  },
+
+  keydown: function(evt) {
+    if (evt.which === Keycodes.ENTER || evt.which === Keycodes.TAB || evt.which === Keycodes.SPACE) {
+      evt.preventDefault();
+      if ($("li.as-result-item.active").length === 0) {
+        $("li.as-result-item").first().click();
+      }
+    }
+  }
+};
+// @license-end
diff --git a/app/assets/javascripts/main.js b/app/assets/javascripts/main.js
index 36667eb55..1d1390820 100644
--- a/app/assets/javascripts/main.js
+++ b/app/assets/javascripts/main.js
@@ -17,6 +17,7 @@
 //= require jquery-ui/mouse
 //= require jquery-ui/sortable
 //= require keycodes
+//= require jquery.autoSuggest.custom
 //= require fileuploader-custom
 //= require handlebars.runtime
 //= require posix-bracket-expressions
diff --git a/app/assets/javascripts/mobile/mobile.js b/app/assets/javascripts/mobile/mobile.js
index fad57b3f0..1cb4b5b2e 100644
--- a/app/assets/javascripts/mobile/mobile.js
+++ b/app/assets/javascripts/mobile/mobile.js
@@ -16,6 +16,7 @@
 //= require bootstrap
 //= require diaspora
 //= require helpers/i18n
+//= require helpers/tags_autocomplete
 //= require widgets/timeago
 //= require mobile/mobile_application
 //= require mobile/mobile_file_uploader
diff --git a/app/assets/javascripts/pages/users-getting-started.js b/app/assets/javascripts/pages/users-getting-started.js
index cb82e03a0..00ec09f05 100644
--- a/app/assets/javascripts/pages/users-getting-started.js
+++ b/app/assets/javascripts/pages/users-getting-started.js
@@ -49,36 +49,14 @@ Diaspora.Pages.UsersGettingStarted = function() {
       return confirmation;
     });
 
-    /* ------ */
-    var autocompleteInput = $("#follow_tags");
     var tagFollowings = new app.collections.TagFollowings();
-
-    autocompleteInput.autoSuggest("/tags", {
-      selectedItemProp: "name",
-      selectedValuesProp: "name",
-      searchObjProps: "name",
-      asHtmlID: "tags",
-      neverSubmit: true,
-      retrieveLimit: 10,
-      selectionLimit: false,
-      minChars: 2,
-      keyDelay: 200,
-      startText: "",
-      emptyText: "no_results",
+    new Diaspora.TagsAutocomplete("#follow_tags", {
+      preFill: gon.preloads.tagsArray,
       selectionAdded: function(elem){tagFollowings.create({"name":$(elem[0]).text().substring(2)})},
       selectionRemoved: function(elem){
         tagFollowings.where({"name":$(elem[0]).text().substring(2)})[0].destroy();
         elem.remove();
       }
-      });
-
-    autocompleteInput.bind('keydown', function(evt){
-      if(evt.which === Keycodes.ENTER || evt.which === Keycodes.TAB || evt.which === Keycodes.SPACE) {
-        evt.preventDefault();
-        if( $('li.as-result-item.active').length === 0 ){
-          $('li.as-result-item').first().click();
-        }
-      }
     });
   });
 };