Add categories filter on search software info page

Signed-off-by: Fabio Teixeira <fabio1079@gmail.com> Signed-off-by: Gabriela Navarro <navarro1703@gmail.com>

Add categories filter on search software info page
Signed-off-by: Fabio Teixeira <fabio1079@gmail.com> Signed-off-by: Gabriela Navarro <navarro1703@gmail.com>
Gabriela Navarro · Luciano Prestes
1 parent 95a76f2e
Showing 5 changed files with 136 additions and 14 deletions Show diff stats
controllers/mpog_software_plugin_controller.rb
lib/mpog_software_plugin.rb
public/software-catalog.js
views/search/_catalog_filter.html.erb
views/search/software_infos.html.erb
@@ -15,18 +15,6 @@ class MpogSoftwarePluginController &lt; ApplicationController
     end
   end
-  def get_institutions
-    list = []
-
-    if request.xhr? and params[:query]
-      list = Institution.search_institution(params[:query]).map{ |institution|
-        {:value=>institution.name, :id=>institution.id}
-      }
-    end
-
-    render :json => list.to_json
-  end
-
   def hide_registration_incomplete_percentage
     response = false
@@ -151,6 +139,30 @@ class MpogSoftwarePluginController &lt; ApplicationController
     end
   end
+  def get_institutions
+    list = []
+
+    if request.xhr? and params[:query]
+      list = Institution.search_institution(params[:query]).map{ |institution|
+        {:value=>institution.name, :id=>institution.id}
+      }
+    end
+
+    render :json => list.to_json
+  end
+
+  def get_categories
+    list = []
+
+    if request.xhr? and params[:query]
+      Category.where("name ILIKE ?", "%#{params[:query]}%").collect { |c|
+        list << {:label=>c.name, :id=>c.id} if c.name != "Software"
+      }
+    end
+
+    render :json => list.to_json
+  end
+
   def get_brazil_states
     redirect_to "/" unless request.xhr?
@@ -227,7 +239,7 @@ class MpogSoftwarePluginController &lt; ApplicationController
       software_list.each do |software|
         software[:name] = Community.find(software.community_id).name
         software[:languages_list] = []
-        
+
         software.software_languages.each do |sl|
           software[:languages_list] << {}
           index =  software[:languages_list].count - 1
@@ -140,7 +140,7 @@ class MpogSoftwarePlugin &lt; Noosfero::Plugin
   end
   def js_files
-    ["spb-utils.js", "mpog-software.js", "mpog-software-validations.js", "mpog-user-validations.js", "mpog-institution-validations.js", "mpog-incomplete-registration.js", "mpog-search.js", "jquery.maskedinput.min.js"]
+    ["spb-utils.js", "mpog-software.js", "mpog-software-validations.js", "mpog-user-validations.js", "mpog-institution-validations.js", "mpog-incomplete-registration.js", "mpog-search.js", "jquery.maskedinput.min.js", "software-catalog.js"]
   end
   def add_new_organization_buttons
@@ -0,0 +1,75 @@
+(function(){
+	"use strict";
+	var AJAX_URL = {
+    get_categories:
+      url_with_subdirectory("/plugin/mpog_software/get_categories")
+  };
+
+	function create_catalog_element(html_list, value, id) {
+		var li_tag = document.createElement("li");
+		var first = html_list.length == 0;
+
+		if( first )
+			li_tag.innerHTML = value + " <span class='catalog-remove-item'>x</span>";
+		else
+			li_tag.innerHTML = ", " + value + " <span class='catalog-remove-item'>x</span>";
+
+		return li_tag;
+	}
+
+  function add_item_to_catalog(value, id) {
+  	var already_has = false;
+
+  	jQuery("#catalog-list ul li").each(function(i, li){
+  		var regex = new RegExp(value, "g");
+
+  		if( regex.test(li.innerHTML) ) {
+  			already_has = true;
+  		}
+		});
+
+  	if( !already_has ) {
+  		jQuery("#catalog-list ul").append(create_catalog_element(jQuery("#catalog-list ul li"), value, id));
+  	}
+  }
+
+  function remote_catalog_item() {
+  	jQuery(this).parent().remove();
+  }
+
+  function set_autocomplate() {
+  	jQuery("#software-catalog").autocomplete({
+      source : function(request, response){
+        jQuery.ajax({
+          type: "GET",
+          url: AJAX_URL.get_categories,
+          data: {query: request.term},
+          success: function(result){
+            response(result);
+          }
+        })
+      },
+
+      select : function (event, selected) {
+      	var value = selected.item.value;
+      	var id = selected.item.id;
+
+      	this.value = "";
+
+      	add_item_to_catalog(value, id);
+      	set_events();
+
+      	return false;
+      }
+    });
+  }
+
+	function set_events() {
+    jQuery(".catalog-remove-item").click(remote_catalog_item);
+	}
+
+	jQuery(document).ready(function(){
+		set_autocomplate();
+		set_events();
+	});
+})();
@@ -0,0 +1,33 @@
+<style type="text/css">
+	#catalog-list ul li {
+		display: inline;
+		margin-right: 5px;
+		font-size: 14px;
+	}
+
+	#catalog-list ul li span {
+		display: none;
+		cursor: pointer;
+	}
+
+	#catalog-list ul li:hover span {
+		display: inline-block;
+	}
+
+	.catalog-remove-item {
+		padding: 3px;
+		border: solid 1px #999;
+		border-radius: 3px;
+		background: #d4d4d4;
+	}
+</style>
+
+<div>
+	<div id="catalog-list">
+		<ul></ul>
+	</div>
+
+	<div id="catalog-filter">
+		<%= text_field(:software, :catalog, :id=>"software-catalog") %>
+	</div>
+</div>
 \ No newline at end of file
@@ -2,6 +2,8 @@
 <%= render :partial => 'search_form', :locals => { :hint => _("Type words about the %s you're looking for") % @asset.to_s.singularize } %>
+<%= render :partial => "catalog_filter" %>
+
 <%= render :partial => 'results_header' %>
 <%= display_results(@searches, @asset) %>
	@@ -140,7 +140,7 @@ class MpogSoftwarePlugin < Noosfero::Plugin		@@ -140,7 +140,7 @@ class MpogSoftwarePlugin < Noosfero::Plugin
140	end	140	end
141		141
142	def js_files	142	def js_files
143	- ["spb-utils.js", "mpog-software.js", "mpog-software-validations.js", "mpog-user-validations.js", "mpog-institution-validations.js", "mpog-incomplete-registration.js", "mpog-search.js", "jquery.maskedinput.min.js"]	143	+ ["spb-utils.js", "mpog-software.js", "mpog-software-validations.js", "mpog-user-validations.js", "mpog-institution-validations.js", "mpog-incomplete-registration.js", "mpog-search.js", "jquery.maskedinput.min.js", "software-catalog.js"]
144	end	144	end
145		145
146	def add_new_organization_buttons	146	def add_new_organization_buttons
@@ -0,0 +1,75 @@		@@ -0,0 +1,75 @@
	1	+(function(){
	2	+ "use strict";
	3	+ var AJAX_URL = {
	4	+ get_categories:
	5	+ url_with_subdirectory("/plugin/mpog_software/get_categories")
	6	+ };
	7	+
	8	+ function create_catalog_element(html_list, value, id) {
	9	+ var li_tag = document.createElement("li");
	10	+ var first = html_list.length == 0;
	11	+
	12	+ if( first )
	13	+ li_tag.innerHTML = value + " <span class='catalog-remove-item'>x</span>";
	14	+ else
	15	+ li_tag.innerHTML = ", " + value + " <span class='catalog-remove-item'>x</span>";
	16	+
	17	+ return li_tag;
	18	+ }
	19	+
	20	+ function add_item_to_catalog(value, id) {
	21	+ var already_has = false;
	22	+
	23	+ jQuery("#catalog-list ul li").each(function(i, li){
	24	+ var regex = new RegExp(value, "g");
	25	+
	26	+ if( regex.test(li.innerHTML) ) {
	27	+ already_has = true;
	28	+ }
	29	+ });
	30	+
	31	+ if( !already_has ) {
	32	+ jQuery("#catalog-list ul").append(create_catalog_element(jQuery("#catalog-list ul li"), value, id));
	33	+ }
	34	+ }
	35	+
	36	+ function remote_catalog_item() {
	37	+ jQuery(this).parent().remove();
	38	+ }
	39	+
	40	+ function set_autocomplate() {
	41	+ jQuery("#software-catalog").autocomplete({
	42	+ source : function(request, response){
	43	+ jQuery.ajax({
	44	+ type: "GET",
	45	+ url: AJAX_URL.get_categories,
	46	+ data: {query: request.term},
	47	+ success: function(result){
	48	+ response(result);
	49	+ }
	50	+ })
	51	+ },
	52	+
	53	+ select : function (event, selected) {
	54	+ var value = selected.item.value;
	55	+ var id = selected.item.id;
	56	+
	57	+ this.value = "";
	58	+
	59	+ add_item_to_catalog(value, id);
	60	+ set_events();
	61	+
	62	+ return false;
	63	+ }
	64	+ });
	65	+ }
	66	+
	67	+ function set_events() {
	68	+ jQuery(".catalog-remove-item").click(remote_catalog_item);
	69	+ }
	70	+
	71	+ jQuery(document).ready(function(){
	72	+ set_autocomplate();
	73	+ set_events();
	74	+ });
	75	+})();
	@@ -0,0 +1,33 @@		@@ -0,0 +1,33 @@
		1	+<style type="text/css">
		2	+ #catalog-list ul li {
		3	+ display: inline;
		4	+ margin-right: 5px;
		5	+ font-size: 14px;
		6	+ }
		7	+
		8	+ #catalog-list ul li span {
		9	+ display: none;
		10	+ cursor: pointer;
		11	+ }
		12	+
		13	+ #catalog-list ul li:hover span {
		14	+ display: inline-block;
		15	+ }
		16	+
		17	+ .catalog-remove-item {
		18	+ padding: 3px;
		19	+ border: solid 1px #999;
		20	+ border-radius: 3px;
		21	+ background: #d4d4d4;
		22	+ }
		23	+</style>
		24	+
		25	+<div>
		26	+ <div id="catalog-list">
		27	+ <ul></ul>
		28	+ </div>
		29	+
		30	+ <div id="catalog-filter">
		31	+ <%= text_field(:software, :catalog, :id=>"software-catalog") %>
		32	+ </div>
		33	+</div>
0	\ No newline at end of file	34	\ No newline at end of file
	@@ -2,6 +2,8 @@		@@ -2,6 +2,8 @@
2		2
3	<%= render :partial => 'search_form', :locals => { :hint => _("Type words about the %s you're looking for") % @asset.to_s.singularize } %>	3	<%= render :partial => 'search_form', :locals => { :hint => _("Type words about the %s you're looking for") % @asset.to_s.singularize } %>
4		4
		5	+<%= render :partial => "catalog_filter" %>
		6	+
5	<%= render :partial => 'results_header' %>	7	<%= render :partial => 'results_header' %>
6		8
7	<%= display_results(@searches, @asset) %>	9	<%= display_results(@searches, @asset) %>