jquery-ui/ui/source/ui.selectable.js

275 lines
7.7 KiB
JavaScript
Raw Normal View History

2008-05-23 09:26:18 +00:00
/*
* jQuery UI Selectable
*
* Copyright (c) 2008 Richard D. Worth (rdworth.org)
* Dual licensed under the MIT (MIT-LICENSE.txt)
* and GPL (GPL-LICENSE.txt) licenses.
*
* http://docs.jquery.com/UI/Selectables
*
* Depends:
* ui.core.js
*
* Revision: $Id: ui.selectable.js 5581 2008-05-13 16:58:03Z scott.gonzalez $
*/
;(function($) {
2008-05-25 04:04:57 +00:00
$.widget("ui.selectable", $.extend($.ui.mouse, {
2008-05-23 09:26:18 +00:00
init: function() {
2008-05-25 04:04:57 +00:00
var self = this;
2008-05-23 09:26:18 +00:00
this.element.addClass("ui-selectable");
this.dragged = false;
// cache selectee children based on filter
var selectees;
this.refresh = function() {
2008-05-25 04:04:57 +00:00
selectees = $(self.options.filter, self.element[0]);
2008-05-23 09:26:18 +00:00
selectees.each(function() {
var $this = $(this);
var pos = $this.offset();
$.data(this, "selectable-item", {
element: this,
$element: $this,
left: pos.left,
top: pos.top,
right: pos.left + $this.width(),
bottom: pos.top + $this.height(),
startselected: false,
selected: $this.hasClass('ui-selected'),
selecting: $this.hasClass('ui-selecting'),
unselecting: $this.hasClass('ui-unselecting')
});
});
};
this.refresh();
this.selectees = selectees.addClass("ui-selectee");
2008-05-25 04:04:57 +00:00
this.mouseInit();
2008-05-23 09:26:18 +00:00
this.helper = $(document.createElement('div')).css({border:'1px dotted black'});
},
toggle: function() {
if(this.disabled){
this.enable();
} else {
this.disable();
}
},
destroy: function() {
this.element
.removeClass("ui-selectable ui-selectable-disabled")
.removeData("selectable")
2008-05-25 04:04:57 +00:00
.unbind(".selectable");
this.mouseDestroy();
2008-05-23 09:26:18 +00:00
},
enable: function() {
this.element.removeClass("ui-selectable-disabled");
this.disabled = false;
},
disable: function() {
this.element.addClass("ui-selectable-disabled");
this.disabled = true;
},
2008-05-25 04:04:57 +00:00
mouseStart: function(e) {
var self = this;
2008-05-23 09:26:18 +00:00
2008-05-25 04:04:57 +00:00
this.opos = [e.pageX, e.pageY];
2008-05-23 09:26:18 +00:00
if (this.disabled)
return;
var options = this.options;
2008-05-25 04:04:57 +00:00
this.selectees = $(options.filter, this.element[0]);
2008-05-23 09:26:18 +00:00
// selectable START callback
2008-05-25 04:04:57 +00:00
this.element.triggerHandler("selectablestart", [e, {
"selectable": this.element[0],
2008-05-23 09:26:18 +00:00
"options": options
}], options.start);
$('body').append(this.helper);
// position helper (lasso)
this.helper.css({
"z-index": 100,
"position": "absolute",
2008-05-25 04:04:57 +00:00
"left": e.clientX,
"top": e.clientY,
2008-05-23 09:26:18 +00:00
"width": 0,
"height": 0
});
if (options.autoRefresh) {
this.refresh();
}
this.selectees.filter('.ui-selected').each(function() {
var selectee = $.data(this, "selectable-item");
selectee.startselected = true;
2008-05-25 04:04:57 +00:00
if (!e.ctrlKey) {
2008-05-23 09:26:18 +00:00
selectee.$element.removeClass('ui-selected');
selectee.selected = false;
selectee.$element.addClass('ui-unselecting');
selectee.unselecting = true;
// selectable UNSELECTING callback
2008-05-25 04:04:57 +00:00
self.element.triggerHandler("selectableunselecting", [e, {
selectable: self.element[0],
2008-05-23 09:26:18 +00:00
unselecting: selectee.element,
options: options
}], options.unselecting);
}
});
2008-05-25 04:04:57 +00:00
var isSelectee = false;
$(e.target).parents().andSelf().each(function() {
if($.data(this, "selectable-item")) isSelectee = true;
});
return this.options.keyboard ? !isSelectee : true;
2008-05-23 09:26:18 +00:00
},
2008-05-25 04:04:57 +00:00
mouseDrag: function(e) {
var self = this;
2008-05-23 09:26:18 +00:00
this.dragged = true;
if (this.disabled)
return;
var options = this.options;
2008-05-25 04:04:57 +00:00
var x1 = this.opos[0], y1 = this.opos[1], x2 = e.pageX, y2 = e.pageY;
2008-05-23 09:26:18 +00:00
if (x1 > x2) { var tmp = x2; x2 = x1; x1 = tmp; }
if (y1 > y2) { var tmp = y2; y2 = y1; y1 = tmp; }
this.helper.css({left: x1, top: y1, width: x2-x1, height: y2-y1});
this.selectees.each(function() {
var selectee = $.data(this, "selectable-item");
//prevent helper from being selected if appendTo: selectable
2008-05-25 04:04:57 +00:00
if (!selectee || selectee.element == self.element[0])
2008-05-23 09:26:18 +00:00
return;
var hit = false;
if (options.tolerance == 'touch') {
hit = ( !(selectee.left > x2 || selectee.right < x1 || selectee.top > y2 || selectee.bottom < y1) );
} else if (options.tolerance == 'fit') {
hit = (selectee.left > x1 && selectee.right < x2 && selectee.top > y1 && selectee.bottom < y2);
}
if (hit) {
// SELECT
if (selectee.selected) {
selectee.$element.removeClass('ui-selected');
selectee.selected = false;
}
if (selectee.unselecting) {
selectee.$element.removeClass('ui-unselecting');
selectee.unselecting = false;
}
if (!selectee.selecting) {
selectee.$element.addClass('ui-selecting');
selectee.selecting = true;
// selectable SELECTING callback
2008-05-25 04:04:57 +00:00
self.element.triggerHandler("selectableselecting", [e, {
selectable: self.element[0],
2008-05-23 09:26:18 +00:00
selecting: selectee.element,
options: options
}], options.selecting);
}
} else {
// UNSELECT
if (selectee.selecting) {
2008-05-25 04:04:57 +00:00
if (e.ctrlKey && selectee.startselected) {
2008-05-23 09:26:18 +00:00
selectee.$element.removeClass('ui-selecting');
selectee.selecting = false;
selectee.$element.addClass('ui-selected');
selectee.selected = true;
} else {
selectee.$element.removeClass('ui-selecting');
selectee.selecting = false;
if (selectee.startselected) {
selectee.$element.addClass('ui-unselecting');
selectee.unselecting = true;
}
// selectable UNSELECTING callback
2008-05-25 04:04:57 +00:00
self.element.triggerHandler("selectableunselecting", [e, {
selectable: self.element[0],
2008-05-23 09:26:18 +00:00
unselecting: selectee.element,
options: options
}], options.unselecting);
}
}
if (selectee.selected) {
2008-05-25 04:04:57 +00:00
if (!e.ctrlKey && !selectee.startselected) {
2008-05-23 09:26:18 +00:00
selectee.$element.removeClass('ui-selected');
selectee.selected = false;
selectee.$element.addClass('ui-unselecting');
selectee.unselecting = true;
// selectable UNSELECTING callback
2008-05-25 04:04:57 +00:00
self.element.triggerHandler("selectableunselecting", [e, {
selectable: self.element[0],
2008-05-23 09:26:18 +00:00
unselecting: selectee.element,
options: options
}], options.unselecting);
}
}
}
});
2008-05-25 04:04:57 +00:00
return false;
2008-05-23 09:26:18 +00:00
},
2008-05-25 04:04:57 +00:00
mouseStop: function(e) {
var self = this;
2008-05-23 09:26:18 +00:00
this.dragged = false;
var options = this.options;
2008-05-25 04:04:57 +00:00
$('.ui-unselecting', this.element[0]).each(function() {
2008-05-23 09:26:18 +00:00
var selectee = $.data(this, "selectable-item");
selectee.$element.removeClass('ui-unselecting');
selectee.unselecting = false;
selectee.startselected = false;
2008-05-25 04:04:57 +00:00
self.element.triggerHandler("selectableunselected", [e, {
selectable: self.element[0],
2008-05-23 09:26:18 +00:00
unselected: selectee.element,
options: options
}], options.unselected);
});
2008-05-25 04:04:57 +00:00
$('.ui-selecting', this.element[0]).each(function() {
2008-05-23 09:26:18 +00:00
var selectee = $.data(this, "selectable-item");
selectee.$element.removeClass('ui-selecting').addClass('ui-selected');
selectee.selecting = false;
selectee.selected = true;
selectee.startselected = true;
2008-05-25 04:04:57 +00:00
self.element.triggerHandler("selectableselected", [e, {
selectable: self.element[0],
2008-05-23 09:26:18 +00:00
selected: selectee.element,
options: options
}], options.selected);
});
2008-05-25 04:04:57 +00:00
this.element.triggerHandler("selectablestop", [e, {
selectable: self.element[0],
2008-05-23 09:26:18 +00:00
options: this.options
}], this.options.stop);
this.helper.remove();
2008-05-25 04:04:57 +00:00
return false;
2008-05-23 09:26:18 +00:00
}
2008-05-25 04:04:57 +00:00
}));
2008-05-23 09:26:18 +00:00
2008-05-25 04:04:57 +00:00
$.extend($.ui.selectable, {
defaults: {
distance: 0,
delay: 0,
cancel: ":input,button",
appendTo: 'body',
autoRefresh: true,
filter: '*',
tolerance: 'touch'
}
});
2008-05-23 09:26:18 +00:00
})(jQuery);