diff options
Diffstat (limited to 'views')
| -rw-r--r-- | views/default/input/userpicker.php | 148 |
1 files changed, 14 insertions, 134 deletions
diff --git a/views/default/input/userpicker.php b/views/default/input/userpicker.php index c6ecb1688..18c71a7f3 100644 --- a/views/default/input/userpicker.php +++ b/views/default/input/userpicker.php @@ -18,7 +18,7 @@ * */ -global $user_picker_js_sent; +elgg_register_js('js/lib/userpicker.js', 'userpicker', 'footer'); function user_picker_add_user($user_id) { $user = get_entity($user_id); @@ -28,13 +28,13 @@ function user_picker_add_user($user_id) { $icon = $user->getIconURL('tiny'); - $code = '<li class="user-picker-entry">'; - $code .= "<img class=\"livesearch_icon\" src=\"$icon\" />"; + $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 .= '<div class="delete-button">'; - $code .= "<a onclick=\"userPickerRemoveUser(this, $user_id)\"><strong>X</strong></a>"; - $code .= '</div>'; $code .= "<input type=\"hidden\" name=\"members[]\" value=\"$user_id\">"; + $code .= "</div>"; $code .= '</li>'; return $code; @@ -52,124 +52,6 @@ foreach ($vars['value'] as $value) { // convert the values to a json-encoded list $json_values = json_encode($values); -if (!$user_picker_js_sent) { -?> -<!-- User picker JS --> -<?php //@todo JS 1.8: no ?> -<script type="text/javascript" src="<?php echo elgg_get_site_url(); ?>vendors/jquery/jquery.autocomplete.min.js"></script> -<script type="text/javascript"> -// set up a few required variables -userPickerURL = '<?php echo elgg_get_site_url() ?>pg/livesearch'; -userList = <?php echo $json_values ?>; - -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, - max: 25, - minChars: 2, - matchContains: false, - autoFill: false, - formatItem: userPickerFormatItem, - formatResult: function (row, i, max) { - eval("var info = " + row + ";"); - // returning the just 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 = ''; - var name = info.name.replace(new RegExp("(" + term + ")", "gi"), "<span class=\"user-picker_highlight\">$1</b>"); - var desc = info.desc.replace(new RegExp("(" + term + ")", "gi"), "<span class=\"user-picker_highlight\">$1</b>"); - - switch (info.type) { - case 'user': - case 'group': - r = info.icon + name + ' - ' + desc; - break; - - default: - r = name + ' - ' + desc; - break; - } - return r; - //return r.replace(new RegExp("(" + term + ")", "gi"), "<span class=\"user-picker_highlight\">$1</b>"); -} - -function userPickerAddUser(event, data, formatted) { - eval("var info = " + data + ";"); - - // do not allow users to be added multiple times - if (!(info.guid in userList)) { - userList[info.guid] = true; - - 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 + ' <div class="delete-button"><a onclick="userPickerRemoveUser(this, ' + info.guid + ')"><strong>X</strong></a></div>' - + '<input type="hidden" name="' + internalName + '[]" value="' + info.guid + '" />'; - $('<li class="user-picker-entry">').html(li).appendTo(users); - - $(this).val(''); - } -} - -function userPickerRemoveUser(link, guid) { - $(link).parents('.user-picker-entry').remove(); -} - -function userPickerGetSearchParams(e) { - if ($(e).parent().find('.all_users').attr('checked')) { - return {'match_on[]': 'friends'}; - } else { - return {'match_on[]': 'users'}; - } -} - -$(document).ready(function() { - userPickerBindEvents(); -}); -</script> -<?php - $user_picker_js_sent = true; -} - // create an HTML list of users $user_list = ''; foreach ($vars['value'] as $user_id) { @@ -177,14 +59,12 @@ foreach ($vars['value'] as $user_id) { } ?> -<div class="user-picker"> - <input class="internalname" type="hidden" name="internalname" value="<?php echo $vars['internalname']; ?>" /> - <input class="search" type="text" name="user_search" size="30"/> - <span class="controls"> - <label><input class="all_users" type="checkbox" name="match_on" value="true" /><?php echo elgg_echo('userpicker:only_friends'); ?></label> - </span> - <div class="results"> - <!-- This space will be filled with users, checkboxes and magic. --> - </div> - <ul class="users"><?php echo $user_list; ?></ul> +<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> </div> +<script type="text/javascript"> + elgg.provide('elgg.userpicker'); + elgg.userpicker.userList = <?php echo $json_values ?>; +</script>
\ No newline at end of file |