aboutsummaryrefslogtreecommitdiff
diff options
context:
space:
mode:
-rw-r--r--views/default/css.php60
-rw-r--r--views/default/input/userpicker.php150
2 files changed, 210 insertions, 0 deletions
diff --git a/views/default/css.php b/views/default/css.php
index 2554073ec..706c5fe50 100644
--- a/views/default/css.php
+++ b/views/default/css.php
@@ -2536,4 +2536,64 @@ a.delete_report_button:hover {
}
+/* ***************************************
+ Auto Suggest Boxes
+*************************************** */
+
+.ac_results {
+ padding: 0px;
+ border: 1px solid black;
+ background-color: white;
+ overflow: hidden;
+ z-index: 99999;
+}
+
+.ac_results ul {
+ width: 100%;
+ list-style-position: outside;
+ list-style: none;
+ padding: 0;
+ margin: 0;
+}
+
+.ac_results li {
+ margin: 0px;
+ padding: 2px 5px;
+ cursor: default;
+ display: block;
+ /*
+ if width will be 100% horizontal scrollbar will apear
+ when scroll mode will be used
+ */
+ /*width: 100%;*/
+ font: menu;
+ font-size: 12px;
+ /*
+ it is very important, if line-height not setted or setted
+ in relative units scroll will be broken in firefox
+ */
+ line-height: 16px;
+ overflow: hidden;
+}
+
+.ac_loading {
+ background: white url(<?php echo $vars['url']; ?>_graphics/indicator.gif') right center no-repeat;
+}
+
+.ac_odd {
+ background-color: #eee;
+}
+
+.ac_over {
+ background-color: #0A246A;
+ color: white;
+}
+
+.autocomplete {
+ width:300px;
+}
+.user_picker .user_picker_entry {
+ clear: both;
+ padding: 1em;
+} \ No newline at end of file
diff --git a/views/default/input/userpicker.php b/views/default/input/userpicker.php
new file mode 100644
index 000000000..8f26b8916
--- /dev/null
+++ b/views/default/input/userpicker.php
@@ -0,0 +1,150 @@
+<?php
+/**
+ * User Picker. Sends an array of user guids.
+ *
+ * @package Elgg
+ * @subpackage Core
+ * @author Curverider Ltd
+ * @link http://elgg.org/
+ *
+ * @uses $vars['value'] The current value, if any
+ * @uses $vars['internalname'] The name of the input field
+ *
+ *
+ * pops up defaulted to lazy load friends lists in paginated alphabetical order.
+ * upon
+ *
+ * As users are checked they move down to a "users" box.
+ * When this happens, a hidden input is created also.
+ * {$internalnal}[] with the value th GUID.
+ *
+ */
+
+global $user_picker_js_sent;
+
+if (!$user_picker_js_sent) {
+?>
+<!-- User picker JS -->
+<script language="javascript" type="text/javascript" src="<?php echo $vars['url']; ?>vendors/jquery/jquery.autocomplete.min.js"></script>
+<script type="text/javascript">
+// set up a few required variables
+userPickerURL = '<?php echo $vars['url'] ?>pg/livesearch';
+
+function userPickerBindEvents() {
+ // binding autocomplete.
+ // doing this as an each so we can past this to functions.
+ $('.user_picker .search').each(function (i, e) {
+ userPickerBindAutocomplete(e);
+ });
+
+ // changing friends vs all users.
+ $('.user_picker .all_users').click(function() {
+ // update the extra params for the autocomplete.
+ var e = $(this).parents('.user_picker').find('.search');
+ var params = userPickerGetSearchParams(e);
+ e.setOptions({extraParams: params});
+ e.flushCache();
+ });
+
+ // hitting enter on the text field
+// $('.user_picker .search').bind($.browser.opera ? "keypress" : "keydown", function(event) {
+// if(event.keyCode == 13) {
+//// console.log($(this).val());
+// userPickerAddUser(this);
+// }
+// });
+}
+
+function userPickerBindAutocomplete(e) {
+ var params = userPickerGetSearchParams(e);
+
+ $(e).autocomplete(userPickerURL, {
+ extraParams: params,
+ minChars: 1,
+ matchContains: true,
+ autoFill: false,
+ formatItem: userPickerFormatItem,
+ formatResult: function (row, i, max) {
+ eval("var info = " + row + ";");
+ //console.log('format result');
+ // upon select, adding the user to the user basket.
+ // this is slightly abusive for this function.
+ // set it to the hidden input name
+
+ //userPickerAddUser(info.guid);
+
+ // returning the name
+ return info.name;
+ }
+ });
+
+ // add users when a result is picked.
+ $(e).result(userPickerAddUser);
+}
+
+function userPickerFormatItem(row, i, max, term) {
+ eval("var info = " + row + ";");
+ var r = '';
+
+ switch (info.type) {
+ case 'user':
+ case 'group':
+ r = info.icon + info.name + ' - ' + info.desc;
+ break;
+
+ default:
+ r = info.name + ' - ' + info.desc;
+ break;
+ }
+ return r.replace(new RegExp("(" + term + ")", "gi"), "<b>$1</b>");
+}
+
+function userPickerAddUser(event, data, formatted) {
+ eval("var info = " + data + ";");
+ var picker = $(this).parent('.user_picker');
+ var users = picker.find('.users');
+ var internalName = picker.find('input.internalname').val();
+ // not sure why formatted isn't.
+ var formatted = userPickerFormatItem(data);
+
+ // add guid as hidden input and to list.
+ var li = formatted + ' (' + '<a onclick="userPickerRemoveUser(this, ' + info.guid + ')">X</a>)'
+ + '<input type="hidden" name="' + internalName + '[]" value="' + info.guid + '" />';
+ $('<li class="user_picker_entry">').html(li).appendTo(users);
+
+ $(this).val('');
+}
+
+function userPickerRemoveUser(link, guid) {
+ $(link).parent('.user_picker_entry').html('');
+}
+
+function userPickerGetSearchParams(e) {
+ if ($(e).parent().find('.all_users').attr('checked')) {
+ return {'match_on[]': 'users'};
+ } else {
+ return {'match_on[]': 'friends'};
+ }
+}
+
+$(document).ready(function() {
+ userPickerBindEvents();
+});
+</script>
+<?php
+ $user_picker_js_sent = true;
+}
+
+?>
+<div class="user_picker">
+ <input class="internalname" type="hidden" name="internalname" value="<?php echo $vars['internalname']; ?>" />
+ <input class="search" type="text" name="user_search" />
+ <span class="controls">
+ <label><input class="all_users" type="checkbox" name="match_on" value="true" />All Users</label>
+ </span>
+ <div class="results">
+ <!-- This space will be filled with users, checkboxes and magic. -->
+ </div>
+ <ul class="users"></ul>
+</div>
+