Labels autocomplete

Dmitriy Zaporozhets
1 parent 2b921a6c
Showing 3 changed files with 45 additions and 0 deletions Show diff stats
app/assets/javascripts/main.js.coffee
app/helpers/issues_helper.rb
app/views/issues/_form.html.haml
@@ -13,6 +13,12 @@ window.errorMessage = (message) -&gt;
   ehtml.html(message)
   ehtml
+window.split = (val) ->
+  return val.split( /,\s*/ )
+
+window.extractLast = (term) ->
+  return split( term ).pop()
+
 # Disable button if text field is empty
 window.disableButtonIfEmptyField = (field_selector, button_selector) ->
   field = $(field_selector)
@@ -30,4 +30,10 @@ module IssuesHelper
       open: "open"
     }
   end
+
+  def labels_autocomplete_source
+    labels = @project.issues_labels.order('count DESC')
+    labels = labels.map{ |l| { label: l.name, value: l.name } }
+    labels.to_json
+  end
 end
@@ -55,3 +55,36 @@
           = link_to "Cancel", project_issues_path(@project), class: cancel_class
         - else
           = link_to "Cancel", project_issue_path(@project, @issue), class: cancel_class
+
+
+
+
+:javascript
+  $(function(){
+    $("#issue_label_list")
+      .bind( "keydown", function( event ) {
+        if ( event.keyCode === $.ui.keyCode.TAB &&
+          $( this ).data( "autocomplete" ).menu.active ) {
+          event.preventDefault();
+        }
+      })
+      .autocomplete({
+        minLength: 0,
+        source: function( request, response ) {
+          response( $.ui.autocomplete.filter(
+            #{raw labels_autocomplete_source}, extractLast( request.term ) ) );
+        },
+        focus: function() {
+          return false;
+        },
+        select: function(event, ui) {
+          var terms = split( this.value );
+          terms.pop();
+          terms.push( ui.item.value );
+          terms.push( "" );
+          this.value = terms.join( ", " );
+          return false;
+        }
+      });
+  });
+
	@@ -13,6 +13,12 @@ window.errorMessage = (message) ->		@@ -13,6 +13,12 @@ window.errorMessage = (message) ->
13	ehtml.html(message)	13	ehtml.html(message)
14	ehtml	14	ehtml
15		15
		16	+window.split = (val) ->
		17	+ return val.split( /,\s*/ )
		18	+
		19	+window.extractLast = (term) ->
		20	+ return split( term ).pop()
		21	+
16	# Disable button if text field is empty	22	# Disable button if text field is empty
17	window.disableButtonIfEmptyField = (field_selector, button_selector) ->	23	window.disableButtonIfEmptyField = (field_selector, button_selector) ->
18	field = $(field_selector)	24	field = $(field_selector)
	@@ -30,4 +30,10 @@ module IssuesHelper		@@ -30,4 +30,10 @@ module IssuesHelper
30	open: "open"	30	open: "open"
31	}	31	}
32	end	32	end
		33	+
		34	+ def labels_autocomplete_source
		35	+ labels = @project.issues_labels.order('count DESC')
		36	+ labels = labels.map{ \|l\| { label: l.name, value: l.name } }
		37	+ labels.to_json
		38	+ end
33	end	39	end
	@@ -55,3 +55,36 @@		@@ -55,3 +55,36 @@
55	= link_to "Cancel", project_issues_path(@project), class: cancel_class	55	= link_to "Cancel", project_issues_path(@project), class: cancel_class
56	- else	56	- else
57	= link_to "Cancel", project_issue_path(@project, @issue), class: cancel_class	57	= link_to "Cancel", project_issue_path(@project, @issue), class: cancel_class
		58	+
		59	+
		60	+
		61	+
		62	+:javascript
		63	+ $(function(){
		64	+ $("#issue_label_list")
		65	+ .bind( "keydown", function( event ) {
		66	+ if ( event.keyCode === $.ui.keyCode.TAB &&
		67	+ $( this ).data( "autocomplete" ).menu.active ) {
		68	+ event.preventDefault();
		69	+ }
		70	+ })
		71	+ .autocomplete({
		72	+ minLength: 0,
		73	+ source: function( request, response ) {
		74	+ response( $.ui.autocomplete.filter(
		75	+ #{raw labels_autocomplete_source}, extractLast( request.term ) ) );
		76	+ },
		77	+ focus: function() {
		78	+ return false;
		79	+ },
		80	+ select: function(event, ui) {
		81	+ var terms = split( this.value );
		82	+ terms.pop();
		83	+ terms.push( ui.item.value );
		84	+ terms.push( "" );
		85	+ this.value = terms.join( ", " );
		86	+ return false;
		87	+ }
		88	+ });
		89	+ });
		90	+