Finish autocomplete

app/models/person.rb

@@ -160,7 +160,7 @@ class Person < ActiveRecord::Base
   end
 
   def as_json(opts={})
-   {:id => self.guid, :label => 'giraffes', :name => self.name, :avatar => self.profile.image_url(:thumb_small)}
+   {:id => self.guid, :name => self.name, :avatar => self.profile.image_url(:thumb_small), :url => "/people/#{self.id}"}
   end
 
   protected

app/views/publics/hcard.html.haml

@@ -1,50 +0,0 @@
-#content
-  %h1= @person.name
-  #content_inner
-    #i.entity_profile.vcard.author
-      %h2 User profile
-
-      %dl.entity_nickname
-        %dt Nickname
-        %dd
-          %a.nickname.url.uid{:href=>@person.url, :rel=>'me'}= @person.name
-
-      %dl.entity_given_name
-        %dt First name
-        %dd
-          %span.given_name= @person.profile.first_name
-
-      %dl.entity_family_name
-        %dt Family name
-        %dd
-          %span.family_name= @person.profile.last_name
-
-      %dl.entity_fn
-        %dt Full name
-        %dd
-          %span.fn= @person.name
-
-      %dl.entity_url
-        %dt URL
-        %dd
-          %a#pod_location.url{:href=>@person.url, :rel=>'me'}= @person.url
-
-      %dl.entity_photo
-        %dt Photo
-        %dd
-          %img.photo.avatar{:src=>image_or_default(@person), :width=>'300px', :height=>'300px'}
-
-      %dl.entity_photo_medium
-        %dt Photo
-        %dd
-          %img.photo.avatar{:src=>image_or_default(@person, :thumb_medium), :width=>'100px', :height=>'100px'}
-      
-      %dl.entity_photo_small
-        %dt Photo
-        %dd
-          %img.photo.avatar{:src=>image_or_default(@person, :thumb_small), :width=>'50px', :height=>'50px'}
-      
-      %dl.entity_searchable
-        %dt Searchable
-        %dd
-          %span.searchable= @person.profile.searchable

config/assets.yml

@@ -11,11 +11,11 @@ javascripts:
     - public/javascripts/vendor/jquery.hotkeys.js
     - public/javascripts/vendor/jquery.autoresize.min.js
     - public/javascripts/vendor/jquery.infinitescroll.min.js
-    - public/javascripts/vendor/jquery.autocomplete.js
     - public/javascripts/vendor/facebox.js
     - public/javascripts/vendor/timeago.js
     - public/javascripts/vendor/fileuploader.js
     - public/javascripts/vendor/Mustache.js
+    - public/javascripts/jquery.autocomplete-custom.js
     - public/javascripts/diaspora.js
     - public/javascripts/widgets/i18n.js
     - public/javascripts/widgets/alert.js

public/javascripts/application.js

@@ -30,5 +30,8 @@ $(document).ready(function() {
   $('a').live('tap',function(){
     $(this).addClass('tapped');
   })
+
+  // autocomplete search box
+  Search.initialize();
 });
 

public/javascripts/jquery.autocomplete-custom.js

@@ -8,11 +8,11 @@
  *   http://www.gnu.org/licenses/gpl.html
  *
  * Revision: $Id: jquery.autocomplete.js 5785 2008-07-12 10:37:33Z joern.zaefferer $
- *
+ * Modified by Diaspora
  */
 
 ;(function($) {
-	
+
 $.fn.extend({
 	autocomplete: function(urlOrData, options) {
 		var isUrl = typeof urlOrData == "string";
@@ -22,13 +22,13 @@ $.fn.extend({
 			delay: isUrl ? $.Autocompleter.defaults.delay : 10,
 			max: options && !options.scroll ? 10 : 150
 		}, options);
-		
+
 		// if highlight is set to false, replace it with a do-nothing function
 		options.highlight = options.highlight || function(value) { return value; };
-		
+
 		// if the formatMatch option is not specified, then use formatItem for backwards compatibility
 		options.formatMatch = options.formatMatch || options.formatItem;
-		
+
 		return this.each(function() {
 			new $.Autocompleter(this, options);
 		});
@@ -77,9 +77,9 @@ $.Autocompleter = function(input, options) {
 		mouseDownOnSelect: false
 	};
 	var select = $.Autocompleter.Select(options, input, selectCurrent, config);
-	
+
 	var blockSubmit;
-	
+
 	// prevent form submit in opera when selecting with return key
 	$.browser.opera && $(input.form).bind("submit.autocomplete", function() {
 		if (blockSubmit) {
@@ -87,13 +87,13 @@ $.Autocompleter = function(input, options) {
 			return false;
 		}
 	});
-	
+
 	// only opera doesn't trigger keydown multiple times while pressed, others don't work with keypress at all
 	$input.bind(($.browser.opera ? "keypress" : "keydown") + ".autocomplete", function(event) {
 		// track last key pressed
 		lastKeyPressCode = event.keyCode;
 		switch(event.keyCode) {
-		
+
 			case KEY.UP:
 				event.preventDefault();
 				if ( select.visible() ) {
@@ -102,7 +102,7 @@ $.Autocompleter = function(input, options) {
 					onChange(0, true);
 				}
 				break;
-				
+
 			case KEY.DOWN:
 				event.preventDefault();
 				if ( select.visible() ) {
@@ -111,7 +111,7 @@ $.Autocompleter = function(input, options) {
 					onChange(0, true);
 				}
 				break;
-				
+
 			case KEY.PAGEUP:
 				event.preventDefault();
 				if ( select.visible() ) {
@@ -120,7 +120,7 @@ $.Autocompleter = function(input, options) {
 					onChange(0, true);
 				}
 				break;
-				
+
 			case KEY.PAGEDOWN:
 				event.preventDefault();
 				if ( select.visible() ) {
@@ -129,7 +129,7 @@ $.Autocompleter = function(input, options) {
 					onChange(0, true);
 				}
 				break;
-			
+
 			// matches also semicolon
 			case options.multiple && $.trim(options.multipleSeparator) == "," && KEY.COMMA:
 			case KEY.TAB:
@@ -141,11 +141,11 @@ $.Autocompleter = function(input, options) {
 					return false;
 				}
 				break;
-				
+
 			case KEY.ESC:
 				select.hide();
 				break;
-				
+
 			default:
 				clearTimeout(timeout);
 				timeout = setTimeout(onChange, options.delay);
@@ -196,16 +196,16 @@ $.Autocompleter = function(input, options) {
 		$input.unbind();
 		$(input.form).unbind(".autocomplete");
 	});
-	
-	
+
+
 	function selectCurrent() {
 		var selected = select.selected();
 		if( !selected )
 			return false;
-		
+
 		var v = selected.result;
 		previousValue = v;
-		
+
 		if ( options.multiple ) {
 			var words = trimWords($input.val());
 			if ( words.length > 1 ) {
@@ -213,26 +213,26 @@ $.Autocompleter = function(input, options) {
 			}
 			v += options.multipleSeparator;
 		}
-		
+
 		$input.val(v);
 		hideResultsNow();
 		$input.trigger("result", [selected.data, selected.value]);
 		return true;
 	}
-	
+
 	function onChange(crap, skipPrevCheck) {
 		if( lastKeyPressCode == KEY.DEL ) {
 			select.hide();
 			return;
 		}
-		
+
 		var currentValue = $input.val();
-		
+
 		if ( !skipPrevCheck && currentValue == previousValue )
 			return;
-		
+
 		previousValue = currentValue;
-		
+
 		currentValue = lastWord(currentValue);
 		if ( currentValue.length >= options.minChars) {
 			$input.addClass(options.loadingClass);
@@ -244,7 +244,7 @@ $.Autocompleter = function(input, options) {
 			select.hide();
 		}
 	};
-	
+
 	function trimWords(value) {
 		if ( !value ) {
 			return [""];
@@ -257,14 +257,14 @@ $.Autocompleter = function(input, options) {
 		});
 		return result;
 	}
-	
+
 	function lastWord(value) {
 		if ( !options.multiple )
 			return value;
 		var words = trimWords(value);
 		return words[words.length - 1];
 	}
-	
+
 	// fills in the input box w/the first match (assumed to be the best match)
 	// q: the term entered
 	// sValue: the first matching result
@@ -330,14 +330,14 @@ $.Autocompleter = function(input, options) {
 			success(term, data);
 		// if an AJAX url has been supplied, try loading the data now
 		} else if( (typeof options.url == "string") && (options.url.length > 0) ){
-			
+
 			var extraParams = {
 				timestamp: +new Date()
 			};
 			$.each(options.extraParams, function(key, param) {
 				extraParams[key] = typeof param == "function" ? param() : param;
 			});
-			
+
 			$.ajax({
 				// try to leverage ajaxQueue plugin to abort previous requests
 				mode: "abort",
@@ -361,7 +361,7 @@ $.Autocompleter = function(input, options) {
 			failure(term);
 		}
 	};
-	
+
 	function parse(data) {
 		var parsed = [];
 		var rows = data.split("\n");
@@ -400,6 +400,7 @@ $.Autocompleter.defaults = {
 	extraParams: {},
 	selectFirst: true,
 	formatItem: function(row) { return row[0]; },
+  selectionChanged : function(newItem) {},
 	formatMatch: null,
 	autoFill: false,
 	width: 0,
@@ -416,9 +417,9 @@ $.Autocompleter.Cache = function(options) {
 
 	var data = {};
 	var length = 0;
-	
+
 	function matchSubset(s, sub) {
-		if (!options.matchCase) 
+		if (!options.matchCase)
 			s = s.toLowerCase();
 		var i = s.indexOf(sub);
 		if (options.matchContains == "word"){
@@ -427,17 +428,17 @@ $.Autocompleter.Cache = function(options) {
 		if (i == -1) return false;
 		return i == 0 || options.matchContains;
 	};
-	
+
 	function add(q, value) {
 		if (length > options.cacheLength){
 			flush();
 		}
-		if (!data[q]){ 
+		if (!data[q]){
 			length++;
 		}
 		data[q] = value;
 	}
-	
+
 	function populate(){
 		if( !options.data ) return false;
 		// track the matches
@@ -446,23 +447,23 @@ $.Autocompleter.Cache = function(options) {
 
 		// no url was specified, we need to adjust the cache length to make sure it fits the local data store
 		if( !options.url ) options.cacheLength = 1;
-		
+
 		// track all options for minChars = 0
 		stMatchSets[""] = [];
-		
+
 		// loop through the array and create a lookup structure
 		for ( var i = 0, ol = options.data.length; i < ol; i++ ) {
 			var rawValue = options.data[i];
 			// if rawValue is a string, make an array otherwise just reference the array
 			rawValue = (typeof rawValue == "string") ? [rawValue] : rawValue;
-			
+
 			var value = options.formatMatch(rawValue, i+1, options.data.length);
 			if ( value === false )
 				continue;
-				
+
 			var firstChar = value.charAt(0).toLowerCase();
 			// if no lookup array for this character exists, look it up now
-			if( !stMatchSets[firstChar] ) 
+			if( !stMatchSets[firstChar] )
 				stMatchSets[firstChar] = [];
 
 			// if the match is a string
@@ -471,7 +472,7 @@ $.Autocompleter.Cache = function(options) {
 				data: rawValue,
 				result: options.formatResult && options.formatResult(rawValue) || value
 			};
-			
+
 			// push the current match into the set list
 			stMatchSets[firstChar].push(row);
 
@@ -489,15 +490,15 @@ $.Autocompleter.Cache = function(options) {
 			add(i, value);
 		});
 	}
-	
+
 	// populate any existing data
 	setTimeout(populate, 25);
-	
+
 	function flush(){
 		data = {};
 		length = 0;
 	}
-	
+
 	return {
 		flush: flush,
 		add: add,
@@ -505,7 +506,7 @@ $.Autocompleter.Cache = function(options) {
 		load: function(q) {
 			if (!options.cacheLength || !length)
 				return null;
-			/* 
+			/*
 			 * if dealing w/local data and matchContains than we must make sure
 			 * to loop through all the data collections looking for matches
 			 */
@@ -525,9 +526,9 @@ $.Autocompleter.Cache = function(options) {
 							}
 						});
 					}
-				}				
+				}
 				return csub;
-			} else 
+			} else
 			// if the exact item exists, use it
 			if (data[q]){
 				return data[q];
@@ -555,7 +556,7 @@ $.Autocompleter.Select = function (options, input, select, config) {
 	var CLASSES = {
 		ACTIVE: "ac_over"
 	};
-	
+
 	var listItems,
 		active = -1,
 		data,
@@ -563,7 +564,7 @@ $.Autocompleter.Select = function (options, input, select, config) {
 		needsInit = true,
 		element,
 		list;
-	
+
 	// Create results
 	function init() {
 		if (!needsInit)
@@ -573,11 +574,11 @@ $.Autocompleter.Select = function (options, input, select, config) {
 		.addClass(options.resultsClass)
 		.css("position", "absolute")
 		.appendTo(document.body);
-	
+
 		list = $("<ul/>").appendTo(element).mouseover( function(event) {
 			if(target(event).nodeName && target(event).nodeName.toUpperCase() == 'LI') {
 	            active = $("li", list).removeClass(CLASSES.ACTIVE).index(target(event));
-			    $(target(event)).addClass(CLASSES.ACTIVE);            
+			    $(target(event)).addClass(CLASSES.ACTIVE);
 	        }
 		}).click(function(event) {
 			$(target(event)).addClass(CLASSES.ACTIVE);
@@ -590,13 +591,13 @@ $.Autocompleter.Select = function (options, input, select, config) {
 		}).mouseup(function() {
 			config.mouseDownOnSelect = false;
 		});
-		
+
 		if( options.width > 0 )
 			element.css("width", options.width);
-			
+
 		needsInit = false;
-	} 
-	
+	}
+
 	function target(event) {
 		var element = event.target;
 		while(element && element.tagName != "LI")
@@ -608,7 +609,7 @@ $.Autocompleter.Select = function (options, input, select, config) {
 	}
 
 	function moveSelect(step) {
-		listItems.slice(active, active + 1).removeClass(CLASSES.ACTIVE);
+	  listItems.slice(active, active + 1).removeClass(CLASSES.ACTIVE);
 		movePosition(step);
         var activeItem = listItems.slice(active, active + 1).addClass(CLASSES.ACTIVE);
         if(options.scroll) {
@@ -622,8 +623,9 @@ $.Autocompleter.Select = function (options, input, select, config) {
                 list.scrollTop(offset);
             }
         }
+    options.selectionChanged(activeItem);
 	};
-	
+
 	function movePosition(step) {
 		active += step;
 		if (active < 0) {
@@ -632,13 +634,13 @@ $.Autocompleter.Select = function (options, input, select, config) {
 			active = 0;
 		}
 	}
-	
+
 	function limitNumberOfItems(available) {
 		return options.max && options.max < available
 			? options.max
 			: available;
 	}
-	
+
 	function fillList() {
 		list.empty();
 		var max = limitNumberOfItems(data.length);
@@ -660,7 +662,7 @@ $.Autocompleter.Select = function (options, input, select, config) {
 		if ( $.fn.bgiframe )
 			list.bgiframe();
 	}
-	
+
 	return {
 		display: function(d, q) {
 			init();
@@ -712,7 +714,7 @@ $.Autocompleter.Select = function (options, input, select, config) {
 					maxHeight: options.scrollHeight,
 					overflow: 'auto'
 				});
-				
+
                 if($.browser.msie && typeof document.body.style.maxHeight === "undefined") {
 					var listHeight = 0;
 					listItems.each(function() {
@@ -725,7 +727,7 @@ $.Autocompleter.Select = function (options, input, select, config) {
 						listItems.width( list.width() - parseInt(listItems.css("padding-left")) - parseInt(listItems.css("padding-right")) );
 					}
                 }
-                
+
             }
 		},
 		selected: function() {
@@ -759,4 +761,4 @@ $.Autocompleter.Selection = function(field, start, end) {
 	field.focus();
 };
 
-})(jQuery);
+})(jQuery);

public/javascripts/search.js

@@ -1,27 +1,51 @@
 var Search = {
+  source : '/people.json',
+
+  selector : '#global_search input#q',
   formatItem: function(row){
-      return "<img src='"+"images/user/default.png"+"' class='avatar'/>" + row['name'];
+    if(row['search']) {
+      return 'Search for ' + row['name'];
+    } else {
+      return "<img src='"+ row['avatar'] +"' class='avatar'/>" + row['name'];
+    }
   },
   formatResult: function(row){
      return row['name'];
    },
   parse : function(data) {
-    return data.map(function(person){
+    results =  data.map(function(person){
       return {data : person, value : person['name']}
     });
+    results.push(Search.searchLinkli());
+    return results;
+  },
+  selectItemCallback :  function(event, data, formatted) {
+    $(Search.selector).val(formatted);
+    window.location = data['url'];
+  },
+  options : function(){return {
+      minChars : 3,
+      max : 4,
+      formatItem : Search.formatItem,
+      formatResult : Search.formatResult,
+      parse : Search.parse,
+  };},
+
+  searchLinkli : function() {
+    var searchTerm = $(Search.selector).val();
+    return {
+      data : {
+        'search' : true,
+        'url' : '/people?q=' + searchTerm,
+        'name' : searchTerm
+      },
+      value : searchTerm
+    };
+  },
+
+  initialize : function() {
+    $(Search.selector).autocomplete(Search.source, Search.options());
+    $(Search.selector).result(Search.selectItemCallback);
   }
 }
 
-$(document).ready(function() {
-  $('#global_search input').autocomplete('/people.json',
-    {
-      minChars : 3,
-      max : 8,
-      autoFill : true,
-      formatItem : Search.formatItem,
-      formatResult : Search.formatResult,
-      parse : Search.parse
-  });
-});
-//$(":text, textarea").result(findValueCallback).next().click(function() {		$(this).prev().search();	});
-

spec/helpers/application_helper_spec.rb

@@ -35,7 +35,7 @@ describe ApplicationHelper do
       person_image_link(nil).should == ""
     end
     it "returns a link containing the person's photo" do
-      person_image_link(@person).should include(image_or_default(@person))
+      person_image_link(@person).should include(@person.profile.image_url)
     end
     it "returns a link to the person's profile" do
       person_image_link(@person).should include(person_path(@person))

spec/lib/data_conversion/import_to_mysql_spec.rb

@@ -314,7 +314,7 @@ describe DataConversion::ImportToMysql do
         profile = Profile.where(:mongo_id => "4d2b6eb6cc8cb43cc2000001").first
         profile.image_url_medium.should be_nil
         profile.searchable.should == true
-        profile.image_url.should be_nil
+        profile[:image_url].should be_nil
         profile.gender.should be_nil
         profile.diaspora_handle.should == profile.person.diaspora_handle
         profile.last_name.should == 'weinstien'

spec/models/photo_spec.rb

@@ -91,7 +91,7 @@ describe Photo do
       @user.profile.image_url = @photo.url(:thumb_large)
       @user.person.save
       @photo.destroy
-      Person.find(@user.person.id).profile.image_url.should be_nil
+      Person.find(@user.person.id).profile[:image_url].should be_nil
     end
 
     it 'should not use the imported filename as the url' do