From 28da2f9dcb560687d4904e7629ad38049ed3188a Mon Sep 17 00:00:00 2001
From: cash <cash.costello@gmail.com>
Date: Thu, 6 Oct 2011 22:27:33 -0400
Subject: using html extension to jquery.ui autocomplete

---
 engine/lib/input.php | 24 +++++++++++++++---------
 1 file changed, 15 insertions(+), 9 deletions(-)

(limited to 'engine/lib/input.php')

diff --git a/engine/lib/input.php b/engine/lib/input.php
index 127113205..e7c3a3d99 100644
--- a/engine/lib/input.php
+++ b/engine/lib/input.php
@@ -288,13 +288,19 @@ function input_livesearch_page_handler($page) {
 
 				if ($entities = get_data($query)) {
 					foreach ($entities as $entity) {
+						if (in_array('groups', $match_on)) {
+							$value = $entity->guid;
+						} else {
+							$value = $entity->username;
+						}
+
 						$result = array(
 							'type' => 'user',
 							'name' => $entity->name,
 							'desc' => $entity->username,
-							'icon' => '<img class="elgg-livesearch-icon" src="' .
-								get_entity($entity->guid)->getIconURL('tiny') . '" />',
-							'guid' => $entity->guid
+							'guid' => $entity->guid,
+							'label' => elgg_view_list_item(get_entity($entity->guid), array('hover' => false)),
+							'value' => $value,
 						);
 						$results[$entity->name . rand(1, 100)] = $result;
 					}
@@ -319,9 +325,9 @@ function input_livesearch_page_handler($page) {
 							'type' => 'group',
 							'name' => $entity->name,
 							'desc' => strip_tags($entity->description),
-							'icon' => '<img class="elgg-livesearch-icon" src="'
-								. get_entity($entity->guid)->getIconURL('tiny') . '" />',
-							'guid' => $entity->guid
+							'guid' => $entity->guid,
+							'label' => elgg_view_list_item(get_entity($entity->guid)),
+							'value' => $entity->guid,
 						);
 
 						$results[$entity->name . rand(1, 100)] = $result;
@@ -350,9 +356,9 @@ function input_livesearch_page_handler($page) {
 							'type' => 'user',
 							'name' => $entity->name,
 							'desc' => $entity->username,
-							'icon' => '<img class="elgg-livesearch-icon" src="'
-								. get_entity($entity->guid)->getIconURL('tiny') . '" />',
-							'guid' => $entity->guid
+							'guid' => $entity->guid,
+							'label' => elgg_view_list_item(get_entity($entity->guid), array('hover' => false)),
+							'value' => $entity->username,
 						);
 						$results[$entity->name . rand(1, 100)] = $result;
 					}
-- 
cgit v1.2.3


From 7effddf7a260e9d731fd33914d6ea3121ddb1d84 Mon Sep 17 00:00:00 2001
From: cash <cash.costello@gmail.com>
Date: Wed, 12 Oct 2011 21:40:18 -0400
Subject: Simple theme for autocomplete

---
 engine/lib/input.php                       | 21 ++++++++++++++---
 mod/groups/views/default/group/default.php |  2 +-
 views/default/css/elements/forms.php       | 37 +++++++++++++++++++++++++++++-
 views/default/object/default.php           |  2 +-
 views/default/user/default.php             |  2 +-
 5 files changed, 57 insertions(+), 7 deletions(-)

(limited to 'engine/lib/input.php')

diff --git a/engine/lib/input.php b/engine/lib/input.php
index e7c3a3d99..ceda2be3b 100644
--- a/engine/lib/input.php
+++ b/engine/lib/input.php
@@ -294,12 +294,17 @@ function input_livesearch_page_handler($page) {
 							$value = $entity->username;
 						}
 
+						$output = elgg_view_list_item(get_entity($entity->guid), array(
+							'hover' => false,
+							'class' => 'elgg-autocomplete-item',
+						));
+
 						$result = array(
 							'type' => 'user',
 							'name' => $entity->name,
 							'desc' => $entity->username,
 							'guid' => $entity->guid,
-							'label' => elgg_view_list_item(get_entity($entity->guid), array('hover' => false)),
+							'label' => $output,
 							'value' => $value,
 						);
 						$results[$entity->name . rand(1, 100)] = $result;
@@ -321,12 +326,17 @@ function input_livesearch_page_handler($page) {
 				";
 				if ($entities = get_data($query)) {
 					foreach ($entities as $entity) {
+						$output = elgg_view_list_item(get_entity($entity->guid), array(
+							'hover' => false,
+							'class' => 'elgg-autocomplete-item',
+						));
+
 						$result = array(
 							'type' => 'group',
 							'name' => $entity->name,
 							'desc' => strip_tags($entity->description),
 							'guid' => $entity->guid,
-							'label' => elgg_view_list_item(get_entity($entity->guid)),
+							'label' => $output,
 							'value' => $entity->guid,
 						);
 
@@ -352,12 +362,17 @@ function input_livesearch_page_handler($page) {
 
 				if ($entities = get_data($query)) {
 					foreach ($entities as $entity) {
+						$output = elgg_view_list_item(get_entity($entity->guid), array(
+							'hover' => false,
+							'class' => 'elgg-autocomplete-item',
+						));
+
 						$result = array(
 							'type' => 'user',
 							'name' => $entity->name,
 							'desc' => $entity->username,
 							'guid' => $entity->guid,
-							'label' => elgg_view_list_item(get_entity($entity->guid), array('hover' => false)),
+							'label' => $output,
 							'value' => $entity->username,
 						);
 						$results[$entity->name . rand(1, 100)] = $result;
diff --git a/mod/groups/views/default/group/default.php b/mod/groups/views/default/group/default.php
index fc91f90d0..6eae467c6 100644
--- a/mod/groups/views/default/group/default.php
+++ b/mod/groups/views/default/group/default.php
@@ -34,5 +34,5 @@ if ($vars['full_view']) {
 	$params = $params + $vars;
 	$list_body = elgg_view('group/elements/summary', $params);
 
-	echo elgg_view_image_block($icon, $list_body);
+	echo elgg_view_image_block($icon, $list_body, $vars);
 }
diff --git a/views/default/css/elements/forms.php b/views/default/css/elements/forms.php
index 83ec2f602..fa90f2bfd 100644
--- a/views/default/css/elements/forms.php
+++ b/views/default/css/elements/forms.php
@@ -235,9 +235,43 @@ input[type="radio"] {
 }
 
 /* ***************************************
-	USER PICKER
+	AUTOCOMPLETE
 *************************************** */
+<?php //autocomplete will expand to fullscreen without max-width ?>
+.ui-autocomplete {
+	position: absolute;
+	cursor: default;
+}
+.elgg-autocomplete-item .elgg-body {
+	max-width: 600px;
+}
+.ui-autocomplete {
+	background-color: white;
+	border: 1px solid #ccc;
+	overflow: hidden;
+
+	-webkit-border-radius: 5px;
+	-moz-border-radius: 5px;
+	border-radius: 5px;
+}
+.ui-autocomplete .ui-menu-item {
+	padding: 0px 4px;
+	
+	-webkit-border-radius: 5px;
+	-moz-border-radius: 5px;
+	border-radius: 5px;
+}
+.ui-autocomplete .ui-menu-item:hover {
+	background-color: #eee;
+}
+.ui-autocomplete a:hover {
+	text-decoration: none;
+	color: #4690D6;
+}
 
+/* ***************************************
+	USER PICKER
+*************************************** */
 .user-picker .user-picker-entry {
 	clear:both;
 	height:25px;
@@ -248,6 +282,7 @@ input[type="radio"] {
 .user-picker-entry .elgg-button-delete {
 	margin-right:10px;
 }
+
 /* ***************************************
       DATE PICKER
 **************************************** */
diff --git a/views/default/object/default.php b/views/default/object/default.php
index a50f19387..62c8197f9 100644
--- a/views/default/object/default.php
+++ b/views/default/object/default.php
@@ -45,4 +45,4 @@ $params = array(
 $params = $params + $vars;
 $body = elgg_view('object/elements/summary', $params);
 
-echo elgg_view_image_block($icon, $body);
+echo elgg_view_image_block($icon, $body, $vars);
diff --git a/views/default/user/default.php b/views/default/user/default.php
index 96386c870..6c84e84ad 100644
--- a/views/default/user/default.php
+++ b/views/default/user/default.php
@@ -53,5 +53,5 @@ if (elgg_get_context() == 'gallery') {
 
 	$list_body = elgg_view('user/elements/summary', $params);
 
-	echo elgg_view_image_block($icon, $list_body);
+	echo elgg_view_image_block($icon, $list_body, $vars);
 }
-- 
cgit v1.2.3


From c6a14d6c6a04eeee2c126ea20ec0e9ee23489ef3 Mon Sep 17 00:00:00 2001
From: cash <cash.costello@gmail.com>
Date: Thu, 13 Oct 2011 21:31:27 -0400
Subject: displaying users that have been selected and added remove capability

---
 engine/lib/input.php                 | 39 ++++++++++++++++++++++++++++++++---
 js/lib/userpicker.js                 | 40 +++++++++++++++++++++++++++---------
 views/default/css/elements/forms.php | 15 ++++++--------
 views/default/input/userpicker.php   | 19 ++++++++---------
 4 files changed, 81 insertions(+), 32 deletions(-)

(limited to 'engine/lib/input.php')

diff --git a/engine/lib/input.php b/engine/lib/input.php
index ceda2be3b..f2cefc3e5 100644
--- a/engine/lib/input.php
+++ b/engine/lib/input.php
@@ -288,17 +288,26 @@ function input_livesearch_page_handler($page) {
 
 				if ($entities = get_data($query)) {
 					foreach ($entities as $entity) {
+						$entity = get_entity($entity->guid);
+						if (!$entity) {
+							continue;
+						}
+
 						if (in_array('groups', $match_on)) {
 							$value = $entity->guid;
 						} else {
 							$value = $entity->username;
 						}
 
-						$output = elgg_view_list_item(get_entity($entity->guid), array(
+						$output = elgg_view_list_item($entity, array(
 							'hover' => false,
 							'class' => 'elgg-autocomplete-item',
 						));
 
+						$icon = elgg_view_entity_icon($entity, 'tiny', array(
+							'hover' => false,
+						));
+
 						$result = array(
 							'type' => 'user',
 							'name' => $entity->name,
@@ -306,6 +315,8 @@ function input_livesearch_page_handler($page) {
 							'guid' => $entity->guid,
 							'label' => $output,
 							'value' => $value,
+							'icon' => $icon,
+							'url' => $entity->getURL(),
 						);
 						$results[$entity->name . rand(1, 100)] = $result;
 					}
@@ -326,11 +337,20 @@ function input_livesearch_page_handler($page) {
 				";
 				if ($entities = get_data($query)) {
 					foreach ($entities as $entity) {
-						$output = elgg_view_list_item(get_entity($entity->guid), array(
+						$entity = get_entity($entity->guid);
+						if (!$entity) {
+							continue;
+						}
+
+						$output = elgg_view_list_item($entity, array(
 							'hover' => false,
 							'class' => 'elgg-autocomplete-item',
 						));
 
+						$icon = elgg_view_entity_icon($entity, 'tiny', array(
+							'hover' => false,
+						));
+
 						$result = array(
 							'type' => 'group',
 							'name' => $entity->name,
@@ -338,6 +358,8 @@ function input_livesearch_page_handler($page) {
 							'guid' => $entity->guid,
 							'label' => $output,
 							'value' => $entity->guid,
+							'icon' => $icon,
+							'url' => $entity->getURL(),
 						);
 
 						$results[$entity->name . rand(1, 100)] = $result;
@@ -362,11 +384,20 @@ function input_livesearch_page_handler($page) {
 
 				if ($entities = get_data($query)) {
 					foreach ($entities as $entity) {
-						$output = elgg_view_list_item(get_entity($entity->guid), array(
+						$entity = get_entity($entity->guid);
+						if (!$entity) {
+							continue;
+						}
+
+						$output = elgg_view_list_item($entity, array(
 							'hover' => false,
 							'class' => 'elgg-autocomplete-item',
 						));
 
+						$icon = elgg_view_entity_icon($entity, 'tiny', array(
+							'hover' => false,
+						));
+
 						$result = array(
 							'type' => 'user',
 							'name' => $entity->name,
@@ -374,6 +405,8 @@ function input_livesearch_page_handler($page) {
 							'guid' => $entity->guid,
 							'label' => $output,
 							'value' => $entity->username,
+							'icon' => $icon,
+							'url' => $entity->getURL(),
 						);
 						$results[$entity->name . rand(1, 100)] = $result;
 					}
diff --git a/js/lib/userpicker.js b/js/lib/userpicker.js
index 780fa47c6..ece5a6951 100644
--- a/js/lib/userpicker.js
+++ b/js/lib/userpicker.js
@@ -24,7 +24,9 @@ elgg.userpicker.init = function() {
 			select: elgg.userpicker.addUser
 		})
 	});
-};
+
+	$('.elgg-userpicker-remove').live('click', elgg.userpicker.removeUser);
+}
 
 /**
  * elgg.userpicker.userList is defined in the input/userpicker view
@@ -35,24 +37,42 @@ elgg.userpicker.addUser = function(event, ui) {
 	// do not allow users to be added multiple times
 	if (!(info.guid in elgg.userpicker.userList)) {
 		elgg.userpicker.userList[info.guid] = true;
-		var users = $(this).siblings('.elgg-user-picker-entries');
+		var users = $(this).siblings('.elgg-user-picker-list');
 		var li = '<input type="hidden" name="members[]" value="' + info.guid + '" />';
+		li += elgg.userpicker.renderUser(info);
 		$('<li>').html(li).appendTo(users);
 	}
 
 	$(this).val('');
 	event.preventDefault();
-};
+}
+
+elgg.userpicker.removeUser = function(event) {
+	$(this).closest('.elgg-user-picker-list > li').remove();
+	event.preventDefault();
+}
 
-elgg.userpicker.removeUser = function(link, guid) {
-	$(link).closest('.elgg-user-picker-entries > li').remove();
-};
+/**
+ * The html in this method has to remain sync'ed with input/userpicker
+ */
+elgg.userpicker.renderUser = function(info) {
+
+	var deleteLink = "<a href='#' class='elgg-userpicker-remove'>X</a>";
+
+	var html = "<div class='elgg-image-block'>";
+	html += "<div class='elgg-image'>" + info.icon + "</div>";
+	html += "<div class='elgg-image-alt'>" + deleteLink + "</div>";
+	html += "<div class='elgg-body'>" + info.name + "</div>";
+	html += "</div";
+	
+	return html;
+}
 
-elgg.userpicker.getSearchParams = function(e) {
-	if (e.element.siblings('[name=match_on]').attr('checked')) {
-		return {'match_on[]': 'friends', 'term' : e.term};
+elgg.userpicker.getSearchParams = function(obj) {
+	if (obj.element.siblings('[name=match_on]').attr('checked')) {
+		return {'match_on[]': 'friends', 'term' : obj.term};
 	} else {
-		return {'match_on[]': 'users', 'term' : e.term};
+		return {'match_on[]': 'users', 'term' : obj.term};
 	}
 }
 
diff --git a/views/default/css/elements/forms.php b/views/default/css/elements/forms.php
index fa90f2bfd..255d95622 100644
--- a/views/default/css/elements/forms.php
+++ b/views/default/css/elements/forms.php
@@ -272,15 +272,12 @@ input[type="radio"] {
 /* ***************************************
 	USER PICKER
 *************************************** */
-.user-picker .user-picker-entry {
-	clear:both;
-	height:25px;
-	padding:5px;
-	margin-top:5px;
-	border-bottom:1px solid #cccccc;
-}
-.user-picker-entry .elgg-button-delete {
-	margin-right:10px;
+.elgg-user-picker-list li:first-child {
+	border-top: 1px dotted #ccc;
+	margin-top: 5px;
+}
+.elgg-user-picker-list > li {
+	border-bottom: 1px dotted #ccc;
 }
 
 /* ***************************************
diff --git a/views/default/input/userpicker.php b/views/default/input/userpicker.php
index 94129d1e0..87cc6e24a 100644
--- a/views/default/input/userpicker.php
+++ b/views/default/input/userpicker.php
@@ -24,18 +24,17 @@ 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));
+
+	$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;
@@ -64,7 +63,7 @@ foreach ($vars['value'] as $user_id) {
 	<input type="text" class="elgg-input-user-picker" size="30"/>
 	<input type="checkbox" name="match_on" value="true" />
 	<label><?php echo elgg_echo('userpicker:only_friends'); ?></label>
-	<ul class="elgg-user-picker-entries"><?php echo $user_list; ?></ul>
+	<ul class="elgg-user-picker-list"><?php echo $user_list; ?></ul>
 </div>
 <script type="text/javascript">
 	elgg.userpicker.userList = <?php echo $json_values ?>;
-- 
cgit v1.2.3