Merge pull request #74 from cash/autocomplete

Fixes #2102, #2712, #3450 Finishes autocomplete and userpicker for 1.8.1

2 files changed, 29 insertions, 23 deletions

diff --git a/views/default/input/autocomplete.php b/views/default/input/autocomplete.php
index 421541e24..e58eb1ae8 100644
--- a/views/default/input/autocomplete.php
+++ b/views/default/input/autocomplete.php
@@ -8,7 +8,7 @@
  * @todo This currently only works for ONE AUTOCOMPLETE TEXT FIELD on a page.
  *
  * @uses $vars['value']       Current value for the text input
- * @uses $vars['match_on']    Array | str What to match on. all|array(groups|users|friends|subtype)
+ * @uses $vars['match_on']    Array | str What to match on. all|array(groups|users|friends)
  * @uses $vars['match_owner'] Bool.  Match only entities that are owned by logged in user.
  * @uses $vars['class']       Additional CSS class
  */
@@ -26,15 +26,19 @@ $defaults = array(
 
 $vars = array_merge($defaults, $vars);
 
-$ac_url_params = http_build_query(array(
-	'match_on' => $vars['match_on'],
-	'match_owner' => $vars['match_owner'],
-));
-
-unset($vars['match_on']);
-unset($vars['match_owner']);
+$params = array();
+if (isset($vars['match_on'])) {
+	$params['match_on'] = $vars['match_on'];
+	unset($vars['match_on']);
+}
+if (isset($vars['match_owner'])) {
+	$params['match_owner'] = $vars['match_owner'];
+	unset($vars['match_owner']);
+}
+$ac_url_params = http_build_query($params);
 
 elgg_load_js('elgg.autocomplete');
+elgg_load_js('jquery.ui.autocomplete.html');
 
 ?>
 
diff --git a/views/default/input/userpicker.php b/views/default/input/userpicker.php
index b852d24fc..5c4b297b1 100644
--- a/views/default/input/userpicker.php
+++ b/views/default/input/userpicker.php
@@ -9,14 +9,14 @@
  *
  * The name of the hidden fields is members[]
  *
- * Defaults to lazy load user lists in paginated alphabetical order. User needs
+ * @warning Only a single input/userpicker is supported per web page.
+ *
+ * Defaults to lazy load user lists in alphabetical order. User needs
  * to type two characters before seeing the user popup list.
  *
- * As users are checked they move down to a "users" box.
+ * As users are selected they move down to a "users" box.
  * When this happens, a hidden input is created with the
  * name of members[] and a value of the GUID.
- *
- * @warning: this is not stable
  */
 
 elgg_load_js('elgg.userpicker');
@@ -24,18 +24,18 @@ elgg_load_js('elgg.userpicker');
 function user_picker_add_user($user_id) {
 	$user = get_entity($user_id);
 	if (!$user || !($user instanceof ElggUser)) {
-		return FALSE;
+		return false;
 	}
 	
-	$icon = $user->getIconURL('tiny');
-	
-	$code = '<li class="elgg-image-block">';
-	$code .= "<div class='elgg-image'><img class=\"livesearch_icon\" src=\"$icon\" /></div>";
-	$code .= "<div class='elgg-image-alt'><a onclick='elgg.userpicker.removeUser(this, $user_id)'><strong>X</strong></a></div>";
-	$code .= "<div class='elgg-body'>";
-	$code .= "$user->name - $user->username";
-	$code .= "<input type=\"hidden\" name=\"members[]\" value=\"$user_id\">";
+	$icon = elgg_view_entity_icon($user, 'tiny', array('hover' => false));
+
+	// this html must be synced with the userpicker.js library
+	$code = '<li><div class="elgg-image-block">';
+	$code .= "<div class='elgg-image'>$icon</div>";
+	$code .= "<div class='elgg-image-alt'><a href='#' class='elgg-userpicker-remove'>X</a></div>";
+	$code .= "<div class='elgg-body'>" . $user->name . "</div>";
 	$code .= "</div>";
+	$code .= "<input type=\"hidden\" name=\"members[]\" value=\"$user_id\">";
 	$code .= '</li>';
 	
 	return $code;
@@ -62,9 +62,11 @@ foreach ($vars['value'] as $user_id) {
 ?>
 <div class="elgg-user-picker">
 	<input type="text" class="elgg-input-user-picker" size="30"/>
-	<label><input type="checkbox" name="match_on" value="true" /><?php echo elgg_echo('userpicker:only_friends'); ?></label>
-	<ul class="elgg-user-picker-entries"><?php echo $user_list; ?></ul>
+	<input type="checkbox" name="match_on" value="true" />
+	<label><?php echo elgg_echo('userpicker:only_friends'); ?></label>
+	<ul class="elgg-user-picker-list"><?php echo $user_list; ?></ul>
 </div>
 <script type="text/javascript">
+	// @todo grab the values in the init function rather than using inline JS
 	elgg.userpicker.userList = <?php echo $json_values ?>;
 </script>
\ No newline at end of file