autocomplete issues and preload autocomplete data.

update jquery-atwho-rails to v0.3.0 add autocomplete_source action to project for gfm autocomplete move init_autocomplete layout from head_panel to project_resource

autocomplete issues and preload autocomplete data.
update jquery-atwho-rails to v0.3.0 add autocomplete_source action to project for gfm autocomplete move init_autocomplete layout from head_panel to project_resource
ichord
1 parent ca244c35
Showing 9 changed files with 57 additions and 34 deletions Show diff stats
Gemfile
Gemfile.lock
app/assets/javascripts/gfm_auto_complete.js.coffee
app/controllers/projects_controller.rb
app/views/layouts/_head_panel.html.haml
app/views/layouts/_init_auto_complete.html.haml
app/views/layouts/project_resource.html.haml
config/routes.rb
spec/routing/project_routing_spec.rb
@@ -112,7 +112,7 @@ group :assets do
   gem 'chosen-rails',     "0.9.8"
   gem 'select2-rails'
-  gem 'jquery-atwho-rails', "0.1.7"
+  gem 'jquery-atwho-rails', "0.3.0"
   gem "jquery-rails",     "2.1.3"
   gem "jquery-ui-rails",  "2.0.2"
   gem "modernizr",        "2.6.2"
@@ -231,7 +231,7 @@ GEM
     httpauth (0.2.0)
     i18n (0.6.1)
     journey (1.0.4)
-    jquery-atwho-rails (0.1.7)
+    jquery-atwho-rails (0.3.0)
     jquery-rails (2.1.3)
       railties (>= 3.1.0, < 5.0)
       thor (~> 0.14)
@@ -531,7 +531,7 @@ DEPENDENCIES
   guard-spinach
   haml-rails
   httparty
-  jquery-atwho-rails (= 0.1.7)
+  jquery-atwho-rails (= 0.3.0)
   jquery-rails (= 2.1.3)
   jquery-turbolinks
   jquery-ui-rails (= 2.0.2)
@@ -2,37 +2,55 @@
 window.GitLab ?= {}
 GitLab.GfmAutoComplete =
+  # private_token: ''
+  dataSource: ''
   # Emoji
   Emoji:
-    data: []
+    assetBase: ''
     template: '<li data-value="${insert}">${name} <img alt="${name}" height="20" src="${image}" width="20" /></li>'
   # Team Members
   Members:
-    data: []
-    url: ''
-    params:
-      private_token: ''
     template: '<li data-value="${username}">${username} <small>${name}</small></li>'
+  Issues:
+    template: '<li data-value="${id}"><small>${id}</small> ${title} </li>'
+
   # Add GFM auto-completion to all input fields, that accept GFM input.
   setup: ->
     input = $('.js-gfm-input')
     # Emoji
-    input.atWho '(?:^|\\s):',
-      data: @Emoji.data
+    input.atwho
+      at: ':'
       tpl: @Emoji.template
+      callbacks:
+        before_save: (emojis) =>
+          $.map emojis, (em) => name: em, insert: em+ ':', image: "#{@Emoji.assetBase}/#{em}.png"
     # Team Members
-    input.atWho '@',
+    input.atwho
+      at: '@'
       tpl: @Members.template
-      callback: (query, callback) =>
-        request_params = $.extend({}, @Members.params, query: query)
-        $.getJSON(@Members.url, request_params).done (members) =>
-          new_members_data = $.map(members, (m) ->
-            username: m.username,
-            name: m.name
-          )
-          callback(new_members_data)
+      search_key: 'search'
+      callbacks:
+        before_save: (members) =>
+          $.map members, (m) => name: m.name, username: m.username, search: "#{m.username} #{m.name}"
+
+    input.atwho
+      at: '#'
+      alias: 'issues'
+      search_key: 'search'
+      tpl: @Issues.template
+      callbacks:
+        before_save: (issues) ->
+          $.map issues, (i) -> id: i.id, title: i.title, search: "#{i.id} #{i.title}"
+    input.one "focus", =>
+      $.getJSON(@dataSource).done (data) ->
+        # load members
+        input.atwho 'load', "@", data.members
+        # load issues
+        input.atwho 'load', "issues", data.issues
+        # load emojis
+        input.atwho 'load', ":", data.emojis
@@ -93,4 +93,16 @@ class ProjectsController &lt; ProjectResourceController
       format.js
     end
   end
+
+  def autocomplete_sources
+    @suggestions = {
+      emojis: Emoji.names,
+      issues: @project.issues.select([:id, :title, :description]),
+      members: @project.users.select([:username, :name]).order(:username)
+    }
+
+    respond_to do |format|
+      format.json { render :json => @suggestions }
+    end
+  end
 end
@@ -36,5 +36,3 @@
           = link_to current_user, class: "profile-pic" do
             = image_tag gravatar_icon(current_user.email, 26)
-
-= render "layouts/init_auto_complete"
 :javascript
   $(function() {
-    GitLab.GfmAutoComplete.Members.url = "#{ "/api/v3/projects/#{@project.id}/members" if @project }";
-    GitLab.GfmAutoComplete.Members.params.private_token = "#{current_user.private_token}";
-
-    GitLab.GfmAutoComplete.Emoji.data = #{raw emoji_autocomplete_source};
-    // convert the list so that the items have the right format for completion
-    GitLab.GfmAutoComplete.Emoji.data = $.map(GitLab.GfmAutoComplete.Emoji.data, function(value) {
-      return {
-        name: value,
-        insert: value+':',
-        image: '#{image_path("emoji")}/'+value+'.png'
-      }
-    });
-
+    GitLab.GfmAutoComplete.dataSource = "#{autocomplete_sources_project_path(@project)}"
+    GitLab.GfmAutoComplete.Emoji.assetBase = '#{image_path("emoji")}'
     GitLab.GfmAutoComplete.setup();
   });
@@ -3,6 +3,7 @@
   = render "layouts/head", title: @project.name_with_namespace
   %body{class: "#{app_theme} project", :'data-page' => body_data_page, :'data-project-id' => @project.id }
     = render "layouts/head_panel", title: project_title(@project)
+    = render "layouts/init_auto_complete"
     = render "layouts/flash"
     - if can?(current_user, :download_code, @project)
       = render 'shared/no_ssh'
@@ -168,6 +168,7 @@ Gitlab::Application.routes.draw do
     member do
       put :transfer
       post :fork
+      get :autocomplete_sources
     end
     resources :blob,    only: [:show], constraints: {id: /.+/}
@@ -83,6 +83,10 @@ describe ProjectsController, &quot;routing&quot; do
     get("/gitlabhq/edit").should route_to('projects#edit', id: 'gitlabhq')
   end
+  it "to #autocomplete_sources" do
+    get('/gitlabhq/autocomplete_sources').should route_to('projects#autocomplete_sources', id: "gitlabhq")
+  end
+
   it "to #show" do
     get("/gitlabhq").should route_to('projects#show', id: 'gitlabhq')
   end
	@@ -112,7 +112,7 @@ group :assets do		@@ -112,7 +112,7 @@ group :assets do
112		112
113	gem 'chosen-rails', "0.9.8"	113	gem 'chosen-rails', "0.9.8"
114	gem 'select2-rails'	114	gem 'select2-rails'
115	- gem 'jquery-atwho-rails', "0.1.7"	115	+ gem 'jquery-atwho-rails', "0.3.0"
116	gem "jquery-rails", "2.1.3"	116	gem "jquery-rails", "2.1.3"
117	gem "jquery-ui-rails", "2.0.2"	117	gem "jquery-ui-rails", "2.0.2"
118	gem "modernizr", "2.6.2"	118	gem "modernizr", "2.6.2"
	@@ -231,7 +231,7 @@ GEM		@@ -231,7 +231,7 @@ GEM
231	httpauth (0.2.0)	231	httpauth (0.2.0)
232	i18n (0.6.1)	232	i18n (0.6.1)
233	journey (1.0.4)	233	journey (1.0.4)
234	- jquery-atwho-rails (0.1.7)	234	+ jquery-atwho-rails (0.3.0)
235	jquery-rails (2.1.3)	235	jquery-rails (2.1.3)
236	railties (>= 3.1.0, < 5.0)	236	railties (>= 3.1.0, < 5.0)
237	thor (~> 0.14)	237	thor (~> 0.14)
	@@ -531,7 +531,7 @@ DEPENDENCIES		@@ -531,7 +531,7 @@ DEPENDENCIES
531	guard-spinach	531	guard-spinach
532	haml-rails	532	haml-rails
533	httparty	533	httparty
534	- jquery-atwho-rails (= 0.1.7)	534	+ jquery-atwho-rails (= 0.3.0)
535	jquery-rails (= 2.1.3)	535	jquery-rails (= 2.1.3)
536	jquery-turbolinks	536	jquery-turbolinks
537	jquery-ui-rails (= 2.0.2)	537	jquery-ui-rails (= 2.0.2)
	@@ -93,4 +93,16 @@ class ProjectsController < ProjectResourceController		@@ -93,4 +93,16 @@ class ProjectsController < ProjectResourceController
93	format.js	93	format.js
94	end	94	end
95	end	95	end
		96	+
		97	+ def autocomplete_sources
		98	+ @suggestions = {
		99	+ emojis: Emoji.names,
		100	+ issues: @project.issues.select([:id, :title, :description]),
		101	+ members: @project.users.select([:username, :name]).order(:username)
		102	+ }
		103	+
		104	+ respond_to do \|format\|
		105	+ format.json { render :json => @suggestions }
		106	+ end
		107	+ end
96	end	108	end
	@@ -36,5 +36,3 @@		@@ -36,5 +36,3 @@
36	= link_to current_user, class: "profile-pic" do	36	= link_to current_user, class: "profile-pic" do
37	= image_tag gravatar_icon(current_user.email, 26)	37	= image_tag gravatar_icon(current_user.email, 26)
38		38
39	-
40	-= render "layouts/init_auto_complete"
1	:javascript	1	:javascript
2	$(function() {	2	$(function() {
3	- GitLab.GfmAutoComplete.Members.url = "#{ "/api/v3/projects/#{@project.id}/members" if @project }";
4	- GitLab.GfmAutoComplete.Members.params.private_token = "#{current_user.private_token}";
5	-
6	- GitLab.GfmAutoComplete.Emoji.data = #{raw emoji_autocomplete_source};
7	- // convert the list so that the items have the right format for completion
8	- GitLab.GfmAutoComplete.Emoji.data = $.map(GitLab.GfmAutoComplete.Emoji.data, function(value) {
9	- return {
10	- name: value,
11	- insert: value+':',
12	- image: '#{image_path("emoji")}/'+value+'.png'
13	- }
14	- });
15	-	3	+ GitLab.GfmAutoComplete.dataSource = "#{autocomplete_sources_project_path(@project)}"
		4	+ GitLab.GfmAutoComplete.Emoji.assetBase = '#{image_path("emoji")}'
16	GitLab.GfmAutoComplete.setup();	5	GitLab.GfmAutoComplete.setup();
17	});	6	});
	@@ -168,6 +168,7 @@ Gitlab::Application.routes.draw do		@@ -168,6 +168,7 @@ Gitlab::Application.routes.draw do
168	member do	168	member do
169	put :transfer	169	put :transfer
170	post :fork	170	post :fork
		171	+ get :autocomplete_sources
171	end	172	end
172		173
173	resources :blob, only: [:show], constraints: {id: /.+/}	174	resources :blob, only: [:show], constraints: {id: /.+/}