Elgg  Version 2.2
UserPicker.js
Go to the documentation of this file.
1 
3 define(function(require) {
4  var $ = require('jquery');
5  var elgg = require('elgg');
6  require('jquery.ui.autocomplete.html');
7 
15  function UserPicker(wrapper) {
16  this.$wrapper = $(wrapper);
17  this.$input = $('.elgg-input-user-picker', wrapper);
18  this.$ul = $('.elgg-user-picker-list', wrapper);
19 
20  var self = this,
21  data = this.$wrapper.data();
22 
23  this.name = data.name || 'members';
24  this.handler = data.handler || 'livesearch';
25  this.limit = data.limit || 0;
26  this.minLength = data.minLength || 2;
27  this.isSealed = false;
28 
29  this.$input.autocomplete({
30  source: function(request, response) {
31  // note: "this" below will not be bound to the input, but rather
32  // to an object created by the autocomplete component
33 
34  if (self.isSealed) {
35  return;
36  }
37 
38  elgg.get(self.handler, {
39  data: {
40  term: this.term,
41  "match_on[]": ($('[name=match_on]', self.$wrapper).prop('checked') ? 'friends' : 'users'),
42  name: self.name
43  },
44  dataType: 'json',
45  success: function(data) {
46  response(data);
47  }
48  });
49  },
50  minLength: self.minLength,
51  html: "html",
52  select: function(event, ui) {
53  self.addUser(event, ui.item.guid, ui.item.html);
54  },
55  // turn off experimental live help - no i18n support and a little buggy
56  messages: {
57  noResults: '',
58  results: function() {}
59  }
60  });
61 
62  this.$wrapper.on('click', '.elgg-user-picker-remove', function(event) {
63  self.removeUser(event);
64  });
65 
66  this.enforceLimit();
67  }
68 
69  UserPicker.prototype = {
77  addUser : function(event, guid, html) {
78  // do not allow users to be added multiple times
79  if (!$('li[data-guid="' + guid + '"]', this.$ul).length) {
80  this.$ul.append(html);
81  }
82  this.$input.val('');
83 
84  this.enforceLimit();
85 
86  event.preventDefault();
87  },
88 
94  removeUser : function(event) {
95  $(event.target).closest('.elgg-user-picker-list > li').remove();
96 
97  this.enforceLimit();
98 
99  event.preventDefault();
100  },
101 
105  enforceLimit : function() {
106  if (this.limit) {
107  if ($('li[data-guid]', this.$ul).length >= this.limit) {
108  if (!this.isSealed) {
109  this.seal();
110  }
111  } else {
112  if (this.isSealed) {
113  this.unseal();
114  }
115  }
116  }
117  },
118 
122  seal : function() {
123  this.$input.prop('disabled', true);
124  this.$wrapper.addClass('elgg-state-disabled');
125  this.isSealed = true;
126  },
127 
131  unseal : function() {
132  this.$input.prop('disabled', false);
133  this.$wrapper.removeClass('elgg-state-disabled');
134  this.isSealed = false;
135  }
136  };
137 
141  UserPicker.setup = function(selector) {
142  elgg.register_hook_handler('init', 'system', function () {
143  $(selector).each(function () {
144  // we only want to wrap each picker once
145  if (!$(this).data('initialized')) {
146  new UserPicker(this);
147  $(this).data('initialized', 1);
148  }
149  });
150  });
151  };
152 
153  return UserPicker;
154 });
elgg
Definition: install.js:23
if(!$owner||!($owner instanceof ElggUser)||!$owner->canEdit()) $input
Definition: edit.php:19
friends picker main wrapper
Definition: admin.css.php:735
html
Definition: admin.css.php:36
elgg page messages
Definition: admin.css.php:233
elgg require
Throw an error if the required package isn't present.
Definition: elgglib.js:164
select
Definition: admin.css.php:523
elgg message elgg state success
Definition: admin.css.php:252
$site name
define(function(require){var $=require('jquery');$(document).on('change', '#elgg-river-selector', function(){var url=window.location.href;if(window.location.search.length){url=url.substring(0, url.indexOf('?'));}url+= '?'+$(this).val();window.location.href=url;});})
Initiates page reload when river selector value changes core/river/filter.