source: sandbox/expresso-solr/prototype/plugins/jquery-picklist/jquery-picklist.js @ 8056

Revision 8056, 13.8 KB checked in by gustavo, 11 years ago (diff)

Ticket #000 - Commit contendo o expresso com solr funcionando corretamente
Line 
1/**
2 * jQuery PickList Widget
3 *
4 * Copyright (c) 2012 Jonathon Freeman <jonathon@awnry.com>
5 * Distributed under the terms of the MIT License.
6 *
7 * http://code.google.com/p/jquery-ui-picklist/
8 */
9(function($)
10{
11        $.widget("awnry.pickList",
12        {
13                options:
14                {
15                        // Container classes
16                        mainClass:                  "pickList",
17                        listContainerClass:         "pickList_listContainer",
18                        sourceListContainerClass:   "pickList_sourceListContainer",
19                        controlsContainerClass:     "pickList_controlsContainer",
20                        targetListContainerClass:   "pickList_targetListContainer",
21                        listClass:                  "pickList_list",
22                        sourceListClass:            "pickList_sourceList",
23                        targetListClass:            "pickList_targetList",
24                        clearClass:                 "pickList_clear",
25
26                        // List item classes
27                        listItemClass:              "pickList_listItem",
28                        richListItemClass:          "pickList_richListItem",
29                        selectedListItemClass:      "pickList_selectedListItem",
30
31                        // Control classes
32                        addAllClass:                "pickList_addAll",
33                        addClass:                   "pickList_add",
34                        removeAllClass:             "pickList_removeAll",
35                        removeClass:                "pickList_remove",
36
37                        // Control labels
38                        addAllLabel:                "&gt;&gt;",
39                        addLabel:                   "&gt;",
40                        removeAllLabel:             "&lt;&lt;",
41                        removeLabel:                "&lt;",
42
43                        // List labels
44                        listLabelClass:             "pickList_listLabel",
45                        sourceListLabel:            "Available",
46                        sourceListLabelClass:       "pickList_sourceListLabel",
47                        targetListLabel:            "Selected",
48                        targetListLabelClass:       "pickList_targetListLabel",
49
50                        // Sorting
51                        sortItems:                  true,
52                        sortAttribute:              "label",
53
54                        // Name of custom value attribute for list items
55                        listItemValueAttribute:     "data-value",
56
57                        // Additional list items
58                        items:                                          []
59                },
60
61                _create: function()
62                {
63                        var self = this;
64
65                        self._buildPickList();
66                        self._refresh();
67                },
68
69                _buildPickList: function()
70                {
71                        var self = this;
72
73                        self._trigger("beforeBuild");
74
75                        self.pickList = $("<div/>")
76                                        .hide()
77                                        .addClass(self.options.mainClass)
78                                        .insertAfter(self.element)
79                                        .append(self._buildSourceList())
80                                        .append(self._buildControls())
81                                        .append(self._buildTargetList())
82                                        .append( $("<div/>").addClass(self.options.clearClass) );
83
84                        self._populateLists();
85
86                        self.element.hide();
87                        self.pickList.show();
88
89                        self._trigger("afterBuild");
90                },
91
92                _buildSourceList: function()
93                {
94                        var self = this;
95
96                        var container = $("<div/>")
97                                        .addClass(self.options.listContainerClass)
98                                        .addClass(self.options.sourceListContainerClass)
99                                        .css({
100                                                "-moz-user-select": "none",
101                                                "-webkit-user-select": "none",
102                                                "user-select": "none",
103                                                "-ms-user-select": "none"
104                                        })
105                                        .each(function()
106                                        {
107                                                this.onselectstart = function() { return false; };
108                                        });
109
110                        var label = $("<div/>")
111                                        .text(self.options.sourceListLabel)
112                                        .addClass(self.options.listLabelClass)
113                                        .addClass(self.options.sourceListLabelClass);
114
115                        self.sourceList = $("<ul/>")
116                                        .addClass(self.options.listClass)
117                                        .addClass(self.options.sourceListClass)
118                                        .delegate("li", "click", { pickList: self }, self._changeHandler);
119
120                        container
121                                        .append(label)
122                                        .append(self.sourceList);
123
124                        return container;
125                },
126
127                _buildTargetList: function()
128                {
129                        var self = this;
130
131                        var container = $("<div/>")
132                                        .addClass(self.options.listContainerClass)
133                                        .addClass(self.options.targetListContainerClass)
134                                        .css({
135                                                "-moz-user-select": "none",
136                                                "-webkit-user-select": "none",
137                                                "user-select": "none",
138                                                "-ms-user-select": "none"
139                                        })
140                                        .each(function()
141                                        {
142                                                this.onselectstart = function() { return false; };
143                                        });
144
145                        var label = $("<div/>")
146                                        .text(self.options.targetListLabel)
147                                        .addClass(self.options.listLabelClass)
148                                        .addClass(self.options.targetListLabelClass);
149
150                        self.targetList = $("<ul/>")
151                                        .addClass(self.options.listClass)
152                                        .addClass(self.options.targetListClass)
153                                        .delegate("li", "click", { pickList: self }, self._changeHandler);
154
155                        container
156                                        .append(label)
157                                        .append(self.targetList);
158
159                        return container;
160                },
161
162                _buildControls: function()
163                {
164                        var self = this;
165
166                        self.controls = $("<div/>").addClass(self.options.controlsContainerClass);
167
168                        self.addAllButton = $("<button type='button'/>").click({pickList: self}, self._addAllHandler).html(self.options.addAllLabel).addClass(self.options.addAllClass);
169                        self.addButton = $("<button type='button'/>").click({pickList: self}, self._addHandler).html(self.options.addLabel).addClass(self.options.addClass);
170                        self.removeButton = $("<button type='button'/>").click({pickList: self}, self._removeHandler).html(self.options.removeLabel).addClass(self.options.removeClass);
171                        self.removeAllButton = $("<button type='button'/>").click({pickList: self}, self._removeAllHandler).html(self.options.removeAllLabel).addClass(self.options.removeAllClass);
172
173                        self.controls
174                                        .append(self.addAllButton)
175                                        .append(self.addButton)
176                                        .append(self.removeButton)
177                                        .append(self.removeAllButton);
178
179                        return self.controls;
180                },
181
182                _populateLists: function()
183                {
184                        var self = this;
185
186                        self._trigger("beforePopulate");
187
188                        var sourceListItems = [];
189                        var targetListItems = [];
190                        var selectItems = self.element.children();
191
192                        selectItems.not(":selected").each(function()
193                        {
194                                sourceListItems.push( self._createDoppelganger(this) );
195                        });
196
197                        selectItems.filter(":selected").each(function()
198                        {
199                                targetListItems.push( self._createDoppelganger(this) );
200                        });
201
202                        self.sourceList.append(sourceListItems.join("\n"));
203                        self.targetList.append(targetListItems.join("\n"));
204                        self.insertItems(self.options.items);
205
206                        self._trigger("afterPopulate");
207                },
208
209                _addAllHandler: function(e)
210                {
211                        var self = e.data.pickList;
212
213                        self._trigger("beforeAddAll");
214
215                        var items = self.sourceList.children();
216                        self.targetList.append( self._removeSelections(items) );
217
218                        self.element.children().not(":selected").attr("selected", "selected");
219
220                        self._refresh();
221
222                        self._trigger("afterAddAll");
223                        self._trigger("onChange");
224                },
225
226                _addHandler: function(e)
227                {
228                        var self = e.data.pickList;
229
230                        self._trigger("beforeAdd");
231
232                        var items = self.sourceList.children(".ui-selected");
233                        self.targetList.append( self._removeSelections(items) );
234
235                        var itemIds = [];
236                        items.each(function()
237                        {
238                                itemIds.push( self._getItemValue(this) );
239                        });
240
241                        self.element.children().filter(function()
242                        {
243                                return $.inArray(this.value, itemIds) != -1;
244                        }).attr("selected", "selected");
245
246                        self._refresh();
247
248                        self._trigger("afterAdd");
249                        self._trigger("onChange");
250                },
251
252                _removeHandler: function(e)
253                {
254                        var self = e.data.pickList;
255
256                        self._trigger("beforeRemove");
257
258                        var items = self.targetList.children(".ui-selected");
259                        self.sourceList.append( self._removeSelections(items) );
260
261                        var itemIds = [];
262                        items.each(function()
263                        {
264                                itemIds.push( self._getItemValue(this) );
265                        });
266
267                        self.element.children().filter(function()
268                        {
269                                return $.inArray(this.value, itemIds) != -1;
270                        }).removeAttr("selected");
271
272                        self._refresh();
273
274                        self._trigger("afterRemove");
275                        self._trigger("onChange");
276                },
277
278                _removeAllHandler: function(e)
279                {
280                        var self = e.data.pickList;
281
282                        self._trigger("beforeRemoveAll");
283
284                        var items = self.targetList.children();
285                        self.sourceList.append( self._removeSelections(items) );
286
287                        self.element.children().filter(":selected").removeAttr("selected");
288
289                        self._refresh();
290
291                        self._trigger("afterRemoveAll");
292                        self._trigger("onChange");
293                },
294
295                _refresh: function()
296                {
297                        var self = this;
298
299                        self._trigger("beforeRefresh");
300
301                        self._refreshControls();
302
303                        // Sort the selection lists.
304                        if(self.options.sortItems)
305                        {
306                                self._sortItems(self.sourceList, self.options);
307                                self._sortItems(self.targetList, self.options);
308                        }
309
310                        self._trigger("afterRefresh");
311                },
312
313                _refreshControls: function()
314                {
315                        var self = this;
316
317                        self._trigger("beforeRefreshControls");
318
319                        // Enable/disable the Add All button state.
320                        if(self.sourceList.children().length)
321                        {
322                                self.addAllButton.removeAttr("disabled");
323                        }
324                        else
325                        {
326                                self.addAllButton.attr("disabled", "disabled");
327                        }
328
329                        // Enable/disable the Remove All button state.
330                        if(self.targetList.children().length)
331                        {
332                                self.removeAllButton.removeAttr("disabled");
333                        }
334                        else
335                        {
336                                self.removeAllButton.attr("disabled", "disabled");
337                        }
338
339                        // Enable/disable the Add button state.
340                        if(self.sourceList.children(".ui-selected").length)
341                        {
342                                self.addButton.removeAttr("disabled");
343                        }
344                        else
345                        {
346                                self.addButton.attr("disabled", "disabled");
347                        }
348
349                        // Enable/disable the Remove button state.
350                        if(self.targetList.children(".ui-selected").length)
351                        {
352                                self.removeButton.removeAttr("disabled");
353                        }
354                        else
355                        {
356                                self.removeButton.attr("disabled", "disabled");
357                        }
358
359                        self._trigger("afterRefreshControls");
360                },
361
362                _sortItems: function(list, options)
363                {
364                        var items = new Array();
365
366                        list.children().each(function()
367                        {
368                                items.push( $(this) );
369                        });
370
371                        items.sort(function(a, b)
372                        {
373                                if(a.attr(options.sortAttribute) > b.attr(options.sortAttribute))
374                                {
375                                        return 1;
376                                }
377                                else if(a.attr(options.sortAttribute) == b.attr(options.sortAttribute))
378                                {
379                                        return 0;
380                                }
381                                else
382                                {
383                                        return -1;
384                                }
385                        });
386
387                        list.empty();
388
389                        for(var i = 0; i < items.length; i++)
390                        {
391                                list.append(items[i]);
392                        }
393                },
394
395                _changeHandler: function(e)
396                {
397                        var self = e.data.pickList;
398
399                        if(e.ctrlKey)
400                        {
401                                if(self._isSelected( $(this) ))
402                                {
403                                        self._removeSelection( $(this) );
404                                }
405                                else
406                                {
407                                        self.lastSelectedItem = $(this);
408                                        self._addSelection( $(this) );
409                                }
410                        }
411                        else if(e.shiftKey)
412                        {
413                                var current = self._getItemValue(this);
414                                var last = self._getItemValue(self.lastSelectedItem);
415
416                                if($(this).index() < $(self.lastSelectedItem).index())
417                                {
418                                        var temp = current;
419                                        current = last;
420                                        last = temp;
421                                }
422
423                                var pastStart = false;
424                                var beforeEnd = true;
425
426                                self._clearSelections( $(this).parent() );
427
428                                $(this).parent().children().each(function()
429                                {
430                                        if(self._getItemValue(this) == last)
431                                        {
432                                                pastStart = true;
433                                        }
434
435                                        if(pastStart && beforeEnd)
436                                        {
437                                                self._addSelection( $(this) );
438                                        }
439
440                                        if(self._getItemValue(this) == current)
441                                        {
442                                                beforeEnd = false;
443                                        }
444
445                                });
446                        }
447                        else
448                        {
449                                self.lastSelectedItem = $(this);
450                                self._clearSelections( $(this).parent() );
451                                self._addSelection( $(this) );
452                        }
453
454                        self._refreshControls();
455                },
456
457                _isSelected: function(listItem)
458                {
459                        return listItem.hasClass("ui-selected");
460                },
461
462                _addSelection: function(listItem)
463                {
464                        var self = this;
465
466                        return listItem
467                                        .addClass("ui-selected")
468                                        .addClass("ui-state-highlight")
469                                        .addClass(self.options.selectedListItemClass);
470                },
471
472                _removeSelection: function(listItem)
473                {
474                        var self = this;
475
476                        return listItem
477                                        .removeClass("ui-selected")
478                                        .removeClass("ui-state-highlight")
479                                        .removeClass(self.options.selectedListItemClass);
480                },
481
482                _removeSelections: function(listItems)
483                {
484                        var self = this;
485
486                        listItems.each(function()
487                        {
488                                $(this)
489                                                .removeClass("ui-selected")
490                                                .removeClass("ui-state-highlight")
491                                                .removeClass(self.options.selectedListItemClass);
492                        });
493
494                        return listItems;
495                },
496
497                _clearSelections: function(list)
498                {
499                        var self = this;
500
501                        list.children().each(function()
502                        {
503                                self._removeSelection( $(this) );
504                        });
505                },
506
507                _setOption: function(key, value)
508                {
509                        switch(key)
510                        {
511                                case "clear":
512                                {
513                                        break;
514                                }
515                        }
516
517                        $.Widget.prototype._setOption.apply(this, arguments);
518                },
519
520                destroy: function()
521                {
522                        var self = this;
523
524                        self._trigger("onDestroy");
525
526                        self.pickList.remove();
527                        self.element.show();
528
529                        $.Widget.prototype.destroy.call(self);
530                },
531
532                insert: function(item)
533                {
534                        var self = this;
535
536                        var list = item.selected ? self.targetList : self.sourceList;
537                        var selectItem = self._createSelectItem(item);
538                        var listItem = self._createListItem(item);
539
540                        self.element.append(selectItem);
541                        list.append(listItem);
542
543                        self._trigger("onChange");
544
545                        self._refresh();
546                },
547
548                insertItems: function(items)
549                {
550                        var self = this;
551
552                        var selectItems = [];
553                        var sourceItems = [];
554                        var targetItems = [];
555
556                        $(items).each(function()
557                        {
558                                var selectItem = self._createSelectItem(this);
559                                var listItem = self._createListItem(this);
560
561                                selectItems.push(selectItem);
562
563                                if(this.selected)
564                                {
565                                        targetItems.push(listItem);
566                                }
567                                else
568                                {
569                                        sourceItems.push(listItem);
570                                }
571                        });
572
573                        self.element.append(selectItems.join("\n"));
574                        self.sourceList.append(sourceItems.join("\n"));
575                        self.targetList.append(targetItems.join("\n"));
576
577                        self._trigger("onChange");
578
579                        self._refresh();
580                },
581
582                _createSelectItem: function(item)
583                {
584                        var selected = item.selected ? " selected='selected'" : "";
585                        return "<option value='" + item.value + "'" + selected + ">" + item.label + "</option>";
586                },
587
588                _createListItem: function(item)
589                {
590                        var self = this;
591
592                        if(item.element != undefined)
593                        {
594                                var richItemHtml = item.element.clone().wrap("<div>").parent().html();
595                                item.element.hide();
596                                return "<li " + self.options.listItemValueAttribute + "='" + item.value + "' label='" + item.label + "' class='" + self.options.listItemClass + " " + self.options.richListItemClass + "'>" + richItemHtml + "</li>";
597                        }
598
599                        return "<li " + self.options.listItemValueAttribute + "='" + item.value + "' label='" + item.label + "' class='" + self.options.listItemClass + "'>" + item.label + "</li>";
600                },
601
602                _createDoppelganger: function(item)
603                {
604                        var self = this;
605                        return "<li " + self.options.listItemValueAttribute + "='" + $(item).val() + "' label='" + $(item).text() + "' class='" + self.options.listItemClass + "'>" + $(item).text() + "</li>";
606                },
607
608                _getItemValue: function(item)
609                {
610                        var self = this;
611                        return $(item).attr(self.options.listItemValueAttribute);
612                }
613        });
614}(jQuery));
Note: See TracBrowser for help on using the repository browser.