mirror of
https://github.com/jwinterm/modoboa.git
synced 2026-10-18 05:51:26 +02:00
tonio
cb1f62883b
* Dragging multiple messages is now possible * Better email displaying (headers and body are now displayed at the same time...) * Bugfixes about dropdown menus * Misc. enhancements.
2062 lines
50 KiB
JavaScript
2062 lines
50 KiB
JavaScript
//MooTools More, <http://mootools.net/more>. Copyright (c) 2006-2009 Aaron Newton <http://clientcide.com/>, Valerio Proietti <http://mad4milk.net> & the MooTools team <http://mootools.net/developers>, MIT Style License.
|
|
|
|
/*
|
|
---
|
|
|
|
script: More.js
|
|
|
|
description: MooTools More
|
|
|
|
license: MIT-style license
|
|
|
|
authors:
|
|
- Guillermo Rauch
|
|
- Thomas Aylott
|
|
- Scott Kyle
|
|
|
|
requires:
|
|
- core:1.2.4/MooTools
|
|
|
|
provides: [MooTools.More]
|
|
|
|
...
|
|
*/
|
|
|
|
MooTools.More = {
|
|
'version': '1.2.4.4',
|
|
'build': '6f6057dc645fdb7547689183b2311063bd653ddf'
|
|
};
|
|
|
|
/*
|
|
---
|
|
|
|
script: Log.js
|
|
|
|
description: Provides basic logging functionality for plugins to implement.
|
|
|
|
license: MIT-style license
|
|
|
|
authors:
|
|
- Guillermo Rauch
|
|
- Thomas Aylott
|
|
- Scott Kyle
|
|
|
|
requires:
|
|
- core:1.2.4/Class
|
|
- /MooTools.More
|
|
|
|
provides: [Log]
|
|
|
|
...
|
|
*/
|
|
|
|
(function(){
|
|
|
|
var global = this;
|
|
|
|
var log = function(){
|
|
if (global.console && console.log){
|
|
try {
|
|
console.log.apply(console, arguments);
|
|
} catch(e) {
|
|
console.log(Array.slice(arguments));
|
|
}
|
|
} else {
|
|
Log.logged.push(arguments);
|
|
}
|
|
return this;
|
|
};
|
|
|
|
var disabled = function(){
|
|
this.logged.push(arguments);
|
|
return this;
|
|
};
|
|
|
|
this.Log = new Class({
|
|
|
|
logged: [],
|
|
|
|
log: disabled,
|
|
|
|
resetLog: function(){
|
|
this.logged.empty();
|
|
return this;
|
|
},
|
|
|
|
enableLog: function(){
|
|
this.log = log;
|
|
this.logged.each(function(args){
|
|
this.log.apply(this, args);
|
|
}, this);
|
|
return this.resetLog();
|
|
},
|
|
|
|
disableLog: function(){
|
|
this.log = disabled;
|
|
return this;
|
|
}
|
|
|
|
});
|
|
|
|
Log.extend(new Log).enableLog();
|
|
|
|
// legacy
|
|
Log.logger = function(){
|
|
return this.log.apply(this, arguments);
|
|
};
|
|
|
|
})();
|
|
|
|
/*
|
|
---
|
|
|
|
script: Class.Refactor.js
|
|
|
|
description: Extends a class onto itself with new property, preserving any items attached to the class's namespace.
|
|
|
|
license: MIT-style license
|
|
|
|
authors:
|
|
- Aaron Newton
|
|
|
|
requires:
|
|
- core:1.2.4/Class
|
|
- /MooTools.More
|
|
|
|
provides: [Class.refactor]
|
|
|
|
...
|
|
*/
|
|
|
|
Class.refactor = function(original, refactors){
|
|
|
|
$each(refactors, function(item, name){
|
|
var origin = original.prototype[name];
|
|
if (origin && (origin = origin._origin) && typeof item == 'function') original.implement(name, function(){
|
|
var old = this.previous;
|
|
this.previous = origin;
|
|
var value = item.apply(this, arguments);
|
|
this.previous = old;
|
|
return value;
|
|
}); else original.implement(name, item);
|
|
});
|
|
|
|
return original;
|
|
|
|
};
|
|
|
|
/*
|
|
---
|
|
|
|
script: Class.Occlude.js
|
|
|
|
description: Prevents a class from being applied to a DOM element twice.
|
|
|
|
license: MIT-style license.
|
|
|
|
authors:
|
|
- Aaron Newton
|
|
|
|
requires:
|
|
- core/1.2.4/Class
|
|
- core:1.2.4/Element
|
|
- /MooTools.More
|
|
|
|
provides: [Class.Occlude]
|
|
|
|
...
|
|
*/
|
|
|
|
Class.Occlude = new Class({
|
|
|
|
occlude: function(property, element){
|
|
element = document.id(element || this.element);
|
|
var instance = element.retrieve(property || this.property);
|
|
if (instance && !$defined(this.occluded))
|
|
return this.occluded = instance;
|
|
|
|
this.occluded = false;
|
|
element.store(property || this.property, this);
|
|
return this.occluded;
|
|
}
|
|
|
|
});
|
|
|
|
/*
|
|
---
|
|
|
|
script: Element.Delegation.js
|
|
|
|
description: Extends the Element native object to include the delegate method for more efficient event management.
|
|
|
|
credits:
|
|
- "Event checking based on the work of Daniel Steigerwald. License: MIT-style license. Copyright: Copyright (c) 2008 Daniel Steigerwald, daniel.steigerwald.cz"
|
|
|
|
license: MIT-style license
|
|
|
|
authors:
|
|
- Aaron Newton
|
|
- Daniel Steigerwald
|
|
|
|
requires:
|
|
- core:1.2.4/Element.Event
|
|
- core:1.2.4/Selectors
|
|
- /MooTools.More
|
|
|
|
provides: [Element.Delegation]
|
|
|
|
...
|
|
*/
|
|
|
|
(function(addEvent, removeEvent){
|
|
|
|
var match = /(.*?):relay\(([^)]+)\)$/,
|
|
combinators = /[+>~\s]/,
|
|
splitType = function(type){
|
|
var bits = type.match(match);
|
|
return !bits ? {event: type} : {
|
|
event: bits[1],
|
|
selector: bits[2]
|
|
};
|
|
},
|
|
check = function(e, selector){
|
|
var t = e.target;
|
|
if (combinators.test(selector = selector.trim())){
|
|
var els = this.getElements(selector);
|
|
for (var i = els.length; i--; ){
|
|
var el = els[i];
|
|
if (t == el || el.hasChild(t)) return el;
|
|
}
|
|
} else {
|
|
for ( ; t && t != this; t = t.parentNode){
|
|
if (Element.match(t, selector)) return document.id(t);
|
|
}
|
|
}
|
|
return null;
|
|
};
|
|
|
|
Element.implement({
|
|
|
|
addEvent: function(type, fn){
|
|
var splitted = splitType(type);
|
|
if (splitted.selector){
|
|
var monitors = this.retrieve('$moo:delegateMonitors', {});
|
|
if (!monitors[type]){
|
|
var monitor = function(e){
|
|
var el = check.call(this, e, splitted.selector);
|
|
if (el) this.fireEvent(type, [e, el], 0, el);
|
|
}.bind(this);
|
|
monitors[type] = monitor;
|
|
addEvent.call(this, splitted.event, monitor);
|
|
}
|
|
}
|
|
return addEvent.apply(this, arguments);
|
|
},
|
|
|
|
removeEvent: function(type, fn){
|
|
var splitted = splitType(type);
|
|
if (splitted.selector){
|
|
var events = this.retrieve('events');
|
|
if (!events || !events[type] || (fn && !events[type].keys.contains(fn))) return this;
|
|
|
|
if (fn) removeEvent.apply(this, [type, fn]);
|
|
else removeEvent.apply(this, type);
|
|
|
|
events = this.retrieve('events');
|
|
if (events && events[type] && events[type].keys.length == 0){
|
|
var monitors = this.retrieve('$moo:delegateMonitors', {});
|
|
removeEvent.apply(this, [splitted.event, monitors[type]]);
|
|
delete monitors[type];
|
|
}
|
|
return this;
|
|
}
|
|
return removeEvent.apply(this, arguments);
|
|
},
|
|
|
|
fireEvent: function(type, args, delay, bind){
|
|
var events = this.retrieve('events');
|
|
if (!events || !events[type]) return this;
|
|
events[type].keys.each(function(fn){
|
|
fn.create({bind: bind || this, delay: delay, arguments: args})();
|
|
}, this);
|
|
return this;
|
|
}
|
|
|
|
});
|
|
|
|
})(Element.prototype.addEvent, Element.prototype.removeEvent);
|
|
|
|
/*
|
|
---
|
|
|
|
script: Fx.Elements.js
|
|
|
|
description: Effect to change any number of CSS properties of any number of Elements.
|
|
|
|
license: MIT-style license
|
|
|
|
authors:
|
|
- Valerio Proietti
|
|
|
|
requires:
|
|
- core:1.2.4/Fx.CSS
|
|
- /MooTools.More
|
|
|
|
provides: [Fx.Elements]
|
|
|
|
...
|
|
*/
|
|
|
|
Fx.Elements = new Class({
|
|
|
|
Extends: Fx.CSS,
|
|
|
|
initialize: function(elements, options){
|
|
this.elements = this.subject = $$(elements);
|
|
this.parent(options);
|
|
},
|
|
|
|
compute: function(from, to, delta){
|
|
var now = {};
|
|
for (var i in from){
|
|
var iFrom = from[i], iTo = to[i], iNow = now[i] = {};
|
|
for (var p in iFrom) iNow[p] = this.parent(iFrom[p], iTo[p], delta);
|
|
}
|
|
return now;
|
|
},
|
|
|
|
set: function(now){
|
|
for (var i in now){
|
|
var iNow = now[i];
|
|
for (var p in iNow) this.render(this.elements[i], p, iNow[p], this.options.unit);
|
|
}
|
|
return this;
|
|
},
|
|
|
|
start: function(obj){
|
|
if (!this.check(obj)) return this;
|
|
var from = {}, to = {};
|
|
for (var i in obj){
|
|
var iProps = obj[i], iFrom = from[i] = {}, iTo = to[i] = {};
|
|
for (var p in iProps){
|
|
var parsed = this.prepare(this.elements[i], p, iProps[p]);
|
|
iFrom[p] = parsed.from;
|
|
iTo[p] = parsed.to;
|
|
}
|
|
}
|
|
return this.parent(from, to);
|
|
}
|
|
|
|
});
|
|
|
|
/*
|
|
---
|
|
|
|
script: Fx.Accordion.js
|
|
|
|
description: An Fx.Elements extension which allows you to easily create accordion type controls.
|
|
|
|
license: MIT-style license
|
|
|
|
authors:
|
|
- Valerio Proietti
|
|
|
|
requires:
|
|
- core:1.2.4/Element.Event
|
|
- /Fx.Elements
|
|
|
|
provides: [Fx.Accordion]
|
|
|
|
...
|
|
*/
|
|
|
|
Fx.Accordion = new Class({
|
|
|
|
Extends: Fx.Elements,
|
|
|
|
options: {/*
|
|
onActive: $empty(toggler, section),
|
|
onBackground: $empty(toggler, section),
|
|
fixedHeight: false,
|
|
fixedWidth: false,
|
|
*/
|
|
display: 0,
|
|
show: false,
|
|
height: true,
|
|
width: false,
|
|
opacity: true,
|
|
alwaysHide: false,
|
|
trigger: 'click',
|
|
initialDisplayFx: true,
|
|
returnHeightToAuto: true
|
|
},
|
|
|
|
initialize: function(){
|
|
var params = Array.link(arguments, {
|
|
'container': Element.type, //deprecated
|
|
'options': Object.type,
|
|
'togglers': $defined,
|
|
'elements': $defined
|
|
});
|
|
this.parent(params.elements, params.options);
|
|
this.togglers = $$(params.togglers);
|
|
this.previous = -1;
|
|
this.internalChain = new Chain();
|
|
if (this.options.alwaysHide) this.options.wait = true;
|
|
if ($chk(this.options.show)){
|
|
this.options.display = false;
|
|
this.previous = this.options.show;
|
|
}
|
|
if (this.options.start){
|
|
this.options.display = false;
|
|
this.options.show = false;
|
|
}
|
|
this.effects = {};
|
|
if (this.options.opacity) this.effects.opacity = 'fullOpacity';
|
|
if (this.options.width) this.effects.width = this.options.fixedWidth ? 'fullWidth' : 'offsetWidth';
|
|
if (this.options.height) this.effects.height = this.options.fixedHeight ? 'fullHeight' : 'scrollHeight';
|
|
for (var i = 0, l = this.togglers.length; i < l; i++) this.addSection(this.togglers[i], this.elements[i]);
|
|
this.elements.each(function(el, i){
|
|
if (this.options.show === i){
|
|
this.fireEvent('active', [this.togglers[i], el]);
|
|
} else {
|
|
for (var fx in this.effects) el.setStyle(fx, 0);
|
|
}
|
|
}, this);
|
|
if ($chk(this.options.display) || this.options.initialDisplayFx === false) this.display(this.options.display, this.options.initialDisplayFx);
|
|
if (this.options.fixedHeight !== false) this.options.returnHeightToAuto = false;
|
|
this.addEvent('complete', this.internalChain.callChain.bind(this.internalChain));
|
|
},
|
|
|
|
addSection: function(toggler, element){
|
|
toggler = document.id(toggler);
|
|
element = document.id(element);
|
|
var test = this.togglers.contains(toggler);
|
|
this.togglers.include(toggler);
|
|
this.elements.include(element);
|
|
var idx = this.togglers.indexOf(toggler);
|
|
var displayer = this.display.bind(this, idx);
|
|
toggler.store('accordion:display', displayer);
|
|
toggler.addEvent(this.options.trigger, displayer);
|
|
if (this.options.height) element.setStyles({'padding-top': 0, 'border-top': 'none', 'padding-bottom': 0, 'border-bottom': 'none'});
|
|
if (this.options.width) element.setStyles({'padding-left': 0, 'border-left': 'none', 'padding-right': 0, 'border-right': 'none'});
|
|
element.fullOpacity = 1;
|
|
if (this.options.fixedWidth) element.fullWidth = this.options.fixedWidth;
|
|
if (this.options.fixedHeight) element.fullHeight = this.options.fixedHeight;
|
|
element.setStyle('overflow', 'hidden');
|
|
if (!test){
|
|
for (var fx in this.effects) element.setStyle(fx, 0);
|
|
}
|
|
return this;
|
|
},
|
|
|
|
detach: function(){
|
|
this.togglers.each(function(toggler) {
|
|
toggler.removeEvent(this.options.trigger, toggler.retrieve('accordion:display'));
|
|
}, this);
|
|
},
|
|
|
|
display: function(index, useFx){
|
|
if (!this.check(index, useFx)) return this;
|
|
useFx = $pick(useFx, true);
|
|
if (this.options.returnHeightToAuto){
|
|
var prev = this.elements[this.previous];
|
|
if (prev && !this.selfHidden){
|
|
for (var fx in this.effects){
|
|
prev.setStyle(fx, prev[this.effects[fx]]);
|
|
}
|
|
}
|
|
}
|
|
index = ($type(index) == 'element') ? this.elements.indexOf(index) : index;
|
|
if ((this.timer && this.options.wait) || (index === this.previous && !this.options.alwaysHide)) return this;
|
|
this.previous = index;
|
|
var obj = {};
|
|
this.elements.each(function(el, i){
|
|
obj[i] = {};
|
|
var hide;
|
|
if (i != index){
|
|
hide = true;
|
|
} else if (this.options.alwaysHide && ((el.offsetHeight > 0 && this.options.height) || el.offsetWidth > 0 && this.options.width)){
|
|
hide = true;
|
|
this.selfHidden = true;
|
|
}
|
|
this.fireEvent(hide ? 'background' : 'active', [this.togglers[i], el]);
|
|
for (var fx in this.effects) obj[i][fx] = hide ? 0 : el[this.effects[fx]];
|
|
}, this);
|
|
this.internalChain.chain(function(){
|
|
if (this.options.returnHeightToAuto && !this.selfHidden){
|
|
var el = this.elements[index];
|
|
if (el) el.setStyle('height', 'auto');
|
|
};
|
|
}.bind(this));
|
|
return useFx ? this.start(obj) : this.set(obj);
|
|
}
|
|
|
|
});
|
|
|
|
/*
|
|
Compatibility with 1.2.0
|
|
*/
|
|
var Accordion = new Class({
|
|
|
|
Extends: Fx.Accordion,
|
|
|
|
initialize: function(){
|
|
this.parent.apply(this, arguments);
|
|
var params = Array.link(arguments, {'container': Element.type});
|
|
this.container = params.container;
|
|
},
|
|
|
|
addSection: function(toggler, element, pos){
|
|
toggler = document.id(toggler);
|
|
element = document.id(element);
|
|
var test = this.togglers.contains(toggler);
|
|
var len = this.togglers.length;
|
|
if (len && (!test || pos)){
|
|
pos = $pick(pos, len - 1);
|
|
toggler.inject(this.togglers[pos], 'before');
|
|
element.inject(toggler, 'after');
|
|
} else if (this.container && !test){
|
|
toggler.inject(this.container);
|
|
element.inject(this.container);
|
|
}
|
|
return this.parent.apply(this, arguments);
|
|
}
|
|
|
|
});
|
|
|
|
/*
|
|
---
|
|
|
|
script: Fx.Slide.js
|
|
|
|
description: Effect to slide an element in and out of view.
|
|
|
|
license: MIT-style license
|
|
|
|
authors:
|
|
- Valerio Proietti
|
|
|
|
requires:
|
|
- core:1.2.4/Fx Element.Style
|
|
- /MooTools.More
|
|
|
|
provides: [Fx.Slide]
|
|
|
|
...
|
|
*/
|
|
|
|
Fx.Slide = new Class({
|
|
|
|
Extends: Fx,
|
|
|
|
options: {
|
|
mode: 'vertical',
|
|
wrapper: false,
|
|
hideOverflow: true
|
|
},
|
|
|
|
initialize: function(element, options){
|
|
this.addEvent('complete', function(){
|
|
this.open = (this.wrapper['offset' + this.layout.capitalize()] != 0);
|
|
if (this.open) this.wrapper.setStyle('height', '');
|
|
if (this.open && Browser.Engine.webkit419) this.element.dispose().inject(this.wrapper);
|
|
}, true);
|
|
this.element = this.subject = document.id(element);
|
|
this.parent(options);
|
|
var wrapper = this.element.retrieve('wrapper');
|
|
var styles = this.element.getStyles('margin', 'position', 'overflow');
|
|
if (this.options.hideOverflow) styles = $extend(styles, {overflow: 'hidden'});
|
|
if (this.options.wrapper) wrapper = document.id(this.options.wrapper).setStyles(styles);
|
|
this.wrapper = wrapper || new Element('div', {
|
|
styles: styles
|
|
}).wraps(this.element);
|
|
this.element.store('wrapper', this.wrapper).setStyle('margin', 0);
|
|
this.now = [];
|
|
this.open = true;
|
|
},
|
|
|
|
vertical: function(){
|
|
this.margin = 'margin-top';
|
|
this.layout = 'height';
|
|
this.offset = this.element.offsetHeight;
|
|
},
|
|
|
|
horizontal: function(){
|
|
this.margin = 'margin-left';
|
|
this.layout = 'width';
|
|
this.offset = this.element.offsetWidth;
|
|
},
|
|
|
|
set: function(now){
|
|
this.element.setStyle(this.margin, now[0]);
|
|
this.wrapper.setStyle(this.layout, now[1]);
|
|
return this;
|
|
},
|
|
|
|
compute: function(from, to, delta){
|
|
return [0, 1].map(function(i){
|
|
return Fx.compute(from[i], to[i], delta);
|
|
});
|
|
},
|
|
|
|
start: function(how, mode){
|
|
if (!this.check(how, mode)) return this;
|
|
this[mode || this.options.mode]();
|
|
var margin = this.element.getStyle(this.margin).toInt();
|
|
var layout = this.wrapper.getStyle(this.layout).toInt();
|
|
var caseIn = [[margin, layout], [0, this.offset]];
|
|
var caseOut = [[margin, layout], [-this.offset, 0]];
|
|
var start;
|
|
switch (how){
|
|
case 'in': start = caseIn; break;
|
|
case 'out': start = caseOut; break;
|
|
case 'toggle': start = (layout == 0) ? caseIn : caseOut;
|
|
}
|
|
return this.parent(start[0], start[1]);
|
|
},
|
|
|
|
slideIn: function(mode){
|
|
return this.start('in', mode);
|
|
},
|
|
|
|
slideOut: function(mode){
|
|
return this.start('out', mode);
|
|
},
|
|
|
|
hide: function(mode){
|
|
this[mode || this.options.mode]();
|
|
this.open = false;
|
|
return this.set([-this.offset, 0]);
|
|
},
|
|
|
|
show: function(mode){
|
|
this[mode || this.options.mode]();
|
|
this.open = true;
|
|
return this.set([0, this.offset]);
|
|
},
|
|
|
|
toggle: function(mode){
|
|
return this.start('toggle', mode);
|
|
}
|
|
|
|
});
|
|
|
|
Element.Properties.slide = {
|
|
|
|
set: function(options){
|
|
var slide = this.retrieve('slide');
|
|
if (slide) slide.cancel();
|
|
return this.eliminate('slide').store('slide:options', $extend({link: 'cancel'}, options));
|
|
},
|
|
|
|
get: function(options){
|
|
if (options || !this.retrieve('slide')){
|
|
if (options || !this.retrieve('slide:options')) this.set('slide', options);
|
|
this.store('slide', new Fx.Slide(this, this.retrieve('slide:options')));
|
|
}
|
|
return this.retrieve('slide');
|
|
}
|
|
|
|
};
|
|
|
|
Element.implement({
|
|
|
|
slide: function(how, mode){
|
|
how = how || 'toggle';
|
|
var slide = this.get('slide'), toggle;
|
|
switch (how){
|
|
case 'hide': slide.hide(mode); break;
|
|
case 'show': slide.show(mode); break;
|
|
case 'toggle':
|
|
var flag = this.retrieve('slide:flag', slide.open);
|
|
slide[flag ? 'slideOut' : 'slideIn'](mode);
|
|
this.store('slide:flag', !flag);
|
|
toggle = true;
|
|
break;
|
|
default: slide.start(how, mode);
|
|
}
|
|
if (!toggle) this.eliminate('slide:flag');
|
|
return this;
|
|
}
|
|
|
|
});
|
|
|
|
|
|
/*
|
|
---
|
|
|
|
script: Drag.js
|
|
|
|
description: The base Drag Class. Can be used to drag and resize Elements using mouse events.
|
|
|
|
license: MIT-style license
|
|
|
|
authors:
|
|
- Valerio Proietti
|
|
- Tom Occhinno
|
|
- Jan Kassens
|
|
|
|
requires:
|
|
- core:1.2.4/Events
|
|
- core:1.2.4/Options
|
|
- core:1.2.4/Element.Event
|
|
- core:1.2.4/Element.Style
|
|
- /MooTools.More
|
|
|
|
provides: [Drag]
|
|
|
|
*/
|
|
|
|
var Drag = new Class({
|
|
|
|
Implements: [Events, Options],
|
|
|
|
options: {/*
|
|
onBeforeStart: $empty(thisElement),
|
|
onStart: $empty(thisElement, event),
|
|
onSnap: $empty(thisElement)
|
|
onDrag: $empty(thisElement, event),
|
|
onCancel: $empty(thisElement),
|
|
onComplete: $empty(thisElement, event),*/
|
|
snap: 6,
|
|
unit: 'px',
|
|
grid: false,
|
|
style: true,
|
|
limit: false,
|
|
handle: false,
|
|
invert: false,
|
|
preventDefault: false,
|
|
stopPropagation: false,
|
|
modifiers: {x: 'left', y: 'top'}
|
|
},
|
|
|
|
initialize: function(){
|
|
var params = Array.link(arguments, {'options': Object.type, 'element': $defined});
|
|
this.element = document.id(params.element);
|
|
this.document = this.element.getDocument();
|
|
this.setOptions(params.options || {});
|
|
var htype = $type(this.options.handle);
|
|
this.handles = ((htype == 'array' || htype == 'collection') ? $$(this.options.handle) : document.id(this.options.handle)) || this.element;
|
|
this.mouse = {'now': {}, 'pos': {}};
|
|
this.value = {'start': {}, 'now': {}};
|
|
|
|
this.selection = (Browser.Engine.trident) ? 'selectstart' : 'mousedown';
|
|
|
|
this.bound = {
|
|
start: this.start.bind(this),
|
|
check: this.check.bind(this),
|
|
drag: this.drag.bind(this),
|
|
stop: this.stop.bind(this),
|
|
cancel: this.cancel.bind(this),
|
|
eventStop: $lambda(false)
|
|
};
|
|
this.attach();
|
|
},
|
|
|
|
attach: function(){
|
|
this.handles.addEvent('mousedown', this.bound.start);
|
|
return this;
|
|
},
|
|
|
|
detach: function(){
|
|
this.handles.removeEvent('mousedown', this.bound.start);
|
|
return this;
|
|
},
|
|
|
|
start: function(event){
|
|
if (event.rightClick) return;
|
|
if (this.options.preventDefault) event.preventDefault();
|
|
if (this.options.stopPropagation) event.stopPropagation();
|
|
this.mouse.start = event.page;
|
|
this.fireEvent('beforeStart', this.element);
|
|
var limit = this.options.limit;
|
|
this.limit = {x: [], y: []};
|
|
for (var z in this.options.modifiers){
|
|
if (!this.options.modifiers[z]) continue;
|
|
if (this.options.style) this.value.now[z] = this.element.getStyle(this.options.modifiers[z]).toInt();
|
|
else this.value.now[z] = this.element[this.options.modifiers[z]];
|
|
if (this.options.invert) this.value.now[z] *= -1;
|
|
/*this.mouse.pos[z] = event.page[z] - this.value.now[z];*/
|
|
this.mouse.pos[z] = this.value.now[z];
|
|
if (limit && limit[z]){
|
|
for (var i = 2; i--; i){
|
|
if ($chk(limit[z][i])) this.limit[z][i] = $lambda(limit[z][i])();
|
|
}
|
|
}
|
|
}
|
|
if ($type(this.options.grid) == 'number') this.options.grid = {x: this.options.grid, y: this.options.grid};
|
|
this.document.addEvents({mousemove: this.bound.check, mouseup: this.bound.cancel});
|
|
this.document.addEvent(this.selection, this.bound.eventStop);
|
|
},
|
|
|
|
check: function(event){
|
|
if (this.options.preventDefault) event.preventDefault();
|
|
var distance = Math.round(Math.sqrt(Math.pow(event.page.x - this.mouse.start.x, 2) + Math.pow(event.page.y - this.mouse.start.y, 2)));
|
|
if (distance > this.options.snap){
|
|
this.cancel();
|
|
this.document.addEvents({
|
|
mousemove: this.bound.drag,
|
|
mouseup: this.bound.stop
|
|
});
|
|
this.fireEvent('start', [this.element, event]).fireEvent('snap', this.element);
|
|
}
|
|
},
|
|
|
|
drag: function(event){
|
|
if (this.options.preventDefault) event.preventDefault();
|
|
this.mouse.now = event.page;
|
|
for (var z in this.options.modifiers){
|
|
if (!this.options.modifiers[z]) continue;
|
|
this.value.now[z] = this.mouse.now[z] - this.mouse.pos[z];
|
|
if (this.options.invert) this.value.now[z] *= -1;
|
|
if (this.options.limit && this.limit[z]){
|
|
if ($chk(this.limit[z][1]) && (this.value.now[z] > this.limit[z][1])){
|
|
this.value.now[z] = this.limit[z][1];
|
|
} else if ($chk(this.limit[z][0]) && (this.value.now[z] < this.limit[z][0])){
|
|
this.value.now[z] = this.limit[z][0];
|
|
}
|
|
}
|
|
if (this.options.grid[z]) this.value.now[z] -= ((this.value.now[z] - (this.limit[z][0]||0)) % this.options.grid[z]);
|
|
if (this.options.style) {
|
|
this.element.setStyle(this.options.modifiers[z], this.value.now[z] + this.options.unit);
|
|
} else {
|
|
this.element[this.options.modifiers[z]] = this.value.now[z];
|
|
}
|
|
}
|
|
this.fireEvent('drag', [this.element, event]);
|
|
},
|
|
|
|
cancel: function(event){
|
|
this.document.removeEvent('mousemove', this.bound.check);
|
|
this.document.removeEvent('mouseup', this.bound.cancel);
|
|
if (event){
|
|
this.document.removeEvent(this.selection, this.bound.eventStop);
|
|
this.fireEvent('cancel', this.element);
|
|
}
|
|
},
|
|
|
|
stop: function(event){
|
|
this.document.removeEvent(this.selection, this.bound.eventStop);
|
|
this.document.removeEvent('mousemove', this.bound.drag);
|
|
this.document.removeEvent('mouseup', this.bound.stop);
|
|
if (event) this.fireEvent('complete', [this.element, event]);
|
|
}
|
|
|
|
});
|
|
|
|
Element.implement({
|
|
|
|
makeResizable: function(options){
|
|
var drag = new Drag(this, $merge({modifiers: {x: 'width', y: 'height'}}, options));
|
|
this.store('resizer', drag);
|
|
return drag.addEvent('drag', function(){
|
|
this.fireEvent('resize', drag);
|
|
}.bind(this));
|
|
}
|
|
|
|
});
|
|
|
|
|
|
/*
|
|
---
|
|
|
|
script: Drag.Move.js
|
|
|
|
description: A Drag extension that provides support for the constraining of draggables to containers and droppables.
|
|
|
|
license: MIT-style license
|
|
|
|
authors:
|
|
- Valerio Proietti
|
|
- Tom Occhinno
|
|
- Jan Kassens
|
|
- Aaron Newton
|
|
- Scott Kyle
|
|
|
|
requires:
|
|
- core:1.2.4/Element.Dimensions
|
|
- /Drag
|
|
|
|
provides: [Drag.Move]
|
|
|
|
...
|
|
*/
|
|
|
|
Drag.Move = new Class({
|
|
|
|
Extends: Drag,
|
|
|
|
options: {/*
|
|
onEnter: $empty(thisElement, overed),
|
|
onLeave: $empty(thisElement, overed),
|
|
onDrop: $empty(thisElement, overed, event),*/
|
|
droppables: [],
|
|
container: false,
|
|
precalculate: false,
|
|
includeMargins: true,
|
|
checkDroppables: true
|
|
},
|
|
|
|
initialize: function(element, options){
|
|
this.parent(element, options);
|
|
element = this.element;
|
|
|
|
this.droppables = $$(this.options.droppables);
|
|
this.container = document.id(this.options.container);
|
|
|
|
if (this.container && $type(this.container) != 'element')
|
|
this.container = document.id(this.container.getDocument().body);
|
|
|
|
var styles = element.getStyles('left', 'top', 'position');
|
|
if (styles.left == 'auto' || styles.top == 'auto')
|
|
element.setPosition(element.getPosition(element.getOffsetParent()));
|
|
|
|
if (styles.position == 'static')
|
|
element.setStyle('position', 'absolute');
|
|
|
|
this.addEvent('start', this.checkDroppables, true);
|
|
|
|
this.overed = null;
|
|
},
|
|
|
|
start: function(event){
|
|
if (this.container) this.options.limit = this.calculateLimit();
|
|
|
|
if (this.options.precalculate){
|
|
this.positions = this.droppables.map(function(el){
|
|
return el.getCoordinates();
|
|
});
|
|
}
|
|
|
|
this.parent(event);
|
|
},
|
|
|
|
calculateLimit: function(){
|
|
var offsetParent = this.element.getOffsetParent(),
|
|
containerCoordinates = this.container.getCoordinates(offsetParent),
|
|
containerBorder = {},
|
|
elementMargin = {},
|
|
elementBorder = {},
|
|
containerMargin = {},
|
|
offsetParentPadding = {};
|
|
|
|
['top', 'right', 'bottom', 'left'].each(function(pad){
|
|
containerBorder[pad] = this.container.getStyle('border-' + pad).toInt();
|
|
elementBorder[pad] = this.element.getStyle('border-' + pad).toInt();
|
|
elementMargin[pad] = this.element.getStyle('margin-' + pad).toInt();
|
|
containerMargin[pad] = this.container.getStyle('margin-' + pad).toInt();
|
|
offsetParentPadding[pad] = offsetParent.getStyle('padding-' + pad).toInt();
|
|
}, this);
|
|
|
|
var width = this.element.offsetWidth + elementMargin.left + elementMargin.right,
|
|
height = this.element.offsetHeight + elementMargin.top + elementMargin.bottom,
|
|
left = 0,
|
|
top = 0,
|
|
right = containerCoordinates.right - containerBorder.right - width,
|
|
bottom = containerCoordinates.bottom - containerBorder.bottom - height;
|
|
|
|
if (this.options.includeMargins){
|
|
left += elementMargin.left;
|
|
top += elementMargin.top;
|
|
} else {
|
|
right += elementMargin.right;
|
|
bottom += elementMargin.bottom;
|
|
}
|
|
|
|
if (this.element.getStyle('position') == 'relative'){
|
|
var coords = this.element.getCoordinates(offsetParent);
|
|
coords.left -= this.element.getStyle('left').toInt();
|
|
coords.top -= this.element.getStyle('top').toInt();
|
|
|
|
left += containerBorder.left - coords.left;
|
|
top += containerBorder.top - coords.top;
|
|
right += elementMargin.left - coords.left;
|
|
bottom += elementMargin.top - coords.top;
|
|
|
|
if (this.container != offsetParent){
|
|
left += containerMargin.left + offsetParentPadding.left;
|
|
top += (Browser.Engine.trident4 ? 0 : containerMargin.top) + offsetParentPadding.top;
|
|
}
|
|
} else {
|
|
left -= elementMargin.left;
|
|
top -= elementMargin.top;
|
|
|
|
if (this.container == offsetParent){
|
|
right -= containerBorder.left;
|
|
bottom -= containerBorder.top;
|
|
} else {
|
|
left += containerCoordinates.left + containerBorder.left;
|
|
top += containerCoordinates.top + containerBorder.top;
|
|
}
|
|
}
|
|
|
|
return {
|
|
x: [left, right],
|
|
y: [top, bottom]
|
|
};
|
|
},
|
|
|
|
checkAgainst: function(el, i){
|
|
el = (this.positions) ? this.positions[i] : el.getCoordinates();
|
|
var now = this.mouse.now;
|
|
return (now.x > el.left && now.x < el.right && now.y < el.bottom && now.y > el.top);
|
|
},
|
|
|
|
checkDroppables: function(){
|
|
var overed = this.droppables.filter(this.checkAgainst, this).getLast();
|
|
if (this.overed != overed){
|
|
if (this.overed) this.fireEvent('leave', [this.element, this.overed]);
|
|
if (overed) this.fireEvent('enter', [this.element, overed]);
|
|
this.overed = overed;
|
|
}
|
|
},
|
|
|
|
drag: function(event){
|
|
this.parent(event);
|
|
if (this.options.checkDroppables && this.droppables.length) this.checkDroppables();
|
|
},
|
|
|
|
stop: function(event){
|
|
this.checkDroppables();
|
|
this.fireEvent('drop', [this.element, this.overed, event]);
|
|
this.overed = null;
|
|
return this.parent(event);
|
|
}
|
|
|
|
});
|
|
|
|
Element.implement({
|
|
|
|
makeDraggable: function(options){
|
|
var drag = new Drag.Move(this, options);
|
|
this.store('dragger', drag);
|
|
return drag;
|
|
}
|
|
|
|
});
|
|
|
|
|
|
/*
|
|
---
|
|
|
|
script: Sortables.js
|
|
|
|
description: Class for creating a drag and drop sorting interface for lists of items.
|
|
|
|
license: MIT-style license
|
|
|
|
authors:
|
|
- Tom Occhino
|
|
|
|
requires:
|
|
- /Drag.Move
|
|
|
|
provides: [Slider]
|
|
|
|
...
|
|
*/
|
|
|
|
var Sortables = new Class({
|
|
|
|
Implements: [Events, Options],
|
|
|
|
options: {/*
|
|
onSort: $empty(element, clone),
|
|
onStart: $empty(element, clone),
|
|
onComplete: $empty(element),*/
|
|
snap: 4,
|
|
opacity: 1,
|
|
clone: false,
|
|
revert: false,
|
|
handle: false,
|
|
constrain: false
|
|
},
|
|
|
|
initialize: function(lists, options){
|
|
this.setOptions(options);
|
|
this.elements = [];
|
|
this.lists = [];
|
|
this.idle = true;
|
|
|
|
this.addLists($$(document.id(lists) || lists));
|
|
if (!this.options.clone) this.options.revert = false;
|
|
if (this.options.revert) this.effect = new Fx.Morph(null, $merge({duration: 250, link: 'cancel'}, this.options.revert));
|
|
},
|
|
|
|
attach: function(){
|
|
this.addLists(this.lists);
|
|
return this;
|
|
},
|
|
|
|
detach: function(){
|
|
this.lists = this.removeLists(this.lists);
|
|
return this;
|
|
},
|
|
|
|
addItems: function(){
|
|
Array.flatten(arguments).each(function(element){
|
|
this.elements.push(element);
|
|
var start = element.retrieve('sortables:start', this.start.bindWithEvent(this, element));
|
|
(this.options.handle ? element.getElement(this.options.handle) || element : element).addEvent('mousedown', start);
|
|
}, this);
|
|
return this;
|
|
},
|
|
|
|
addLists: function(){
|
|
Array.flatten(arguments).each(function(list){
|
|
this.lists.push(list);
|
|
this.addItems(list.getChildren());
|
|
}, this);
|
|
return this;
|
|
},
|
|
|
|
removeItems: function(){
|
|
return $$(Array.flatten(arguments).map(function(element){
|
|
this.elements.erase(element);
|
|
var start = element.retrieve('sortables:start');
|
|
(this.options.handle ? element.getElement(this.options.handle) || element : element).removeEvent('mousedown', start);
|
|
|
|
return element;
|
|
}, this));
|
|
},
|
|
|
|
removeLists: function(){
|
|
return $$(Array.flatten(arguments).map(function(list){
|
|
this.lists.erase(list);
|
|
this.removeItems(list.getChildren());
|
|
|
|
return list;
|
|
}, this));
|
|
},
|
|
|
|
getClone: function(event, element){
|
|
if (!this.options.clone) return new Element('div').inject(document.body);
|
|
if ($type(this.options.clone) == 'function') return this.options.clone.call(this, event, element, this.list);
|
|
var clone = element.clone(true).setStyles({
|
|
margin: '0px',
|
|
position: 'absolute',
|
|
visibility: 'hidden',
|
|
'width': element.getStyle('width')
|
|
});
|
|
//prevent the duplicated radio inputs from unchecking the real one
|
|
if (clone.get('html').test('radio')) {
|
|
clone.getElements('input[type=radio]').each(function(input, i) {
|
|
input.set('name', 'clone_' + i);
|
|
});
|
|
}
|
|
|
|
return clone.inject(this.list).setPosition(element.getPosition(element.getOffsetParent()));
|
|
},
|
|
|
|
getDroppables: function(){
|
|
var droppables = this.list.getChildren();
|
|
if (!this.options.constrain) droppables = this.lists.concat(droppables).erase(this.list);
|
|
return droppables.erase(this.clone).erase(this.element);
|
|
},
|
|
|
|
insert: function(dragging, element){
|
|
var where = 'inside';
|
|
if (this.lists.contains(element)){
|
|
this.list = element;
|
|
this.drag.droppables = this.getDroppables();
|
|
} else {
|
|
where = this.element.getAllPrevious().contains(element) ? 'before' : 'after';
|
|
}
|
|
this.element.inject(element, where);
|
|
this.fireEvent('sort', [this.element, this.clone]);
|
|
},
|
|
|
|
start: function(event, element){
|
|
if (!this.idle) return;
|
|
this.idle = false;
|
|
this.element = element;
|
|
this.opacity = element.get('opacity');
|
|
this.list = element.getParent();
|
|
this.clone = this.getClone(event, element);
|
|
|
|
this.drag = new Drag.Move(this.clone, {
|
|
snap: this.options.snap,
|
|
container: this.options.constrain && this.element.getParent(),
|
|
droppables: this.getDroppables(),
|
|
onSnap: function(){
|
|
event.stop();
|
|
this.clone.setStyle('visibility', 'visible');
|
|
this.element.set('opacity', this.options.opacity || 0);
|
|
this.fireEvent('start', [this.element, this.clone]);
|
|
}.bind(this),
|
|
onEnter: this.insert.bind(this),
|
|
onCancel: this.reset.bind(this),
|
|
onComplete: this.end.bind(this)
|
|
});
|
|
|
|
this.clone.inject(this.element, 'before');
|
|
this.drag.start(event);
|
|
},
|
|
|
|
end: function(){
|
|
this.drag.detach();
|
|
this.element.set('opacity', this.opacity);
|
|
if (this.effect){
|
|
var dim = this.element.getStyles('width', 'height');
|
|
var pos = this.clone.computePosition(this.element.getPosition(this.clone.offsetParent));
|
|
this.effect.element = this.clone;
|
|
this.effect.start({
|
|
top: pos.top,
|
|
left: pos.left,
|
|
width: dim.width,
|
|
height: dim.height,
|
|
opacity: 0.25
|
|
}).chain(this.reset.bind(this));
|
|
} else {
|
|
this.reset();
|
|
}
|
|
},
|
|
|
|
reset: function(){
|
|
this.idle = true;
|
|
this.clone.destroy();
|
|
this.fireEvent('complete', this.element);
|
|
},
|
|
|
|
serialize: function(){
|
|
var params = Array.link(arguments, {modifier: Function.type, index: $defined});
|
|
var serial = this.lists.map(function(list){
|
|
return list.getChildren().map(params.modifier || function(element){
|
|
return element.get('id');
|
|
}, this);
|
|
}, this);
|
|
|
|
var index = params.index;
|
|
if (this.lists.length == 1) index = 0;
|
|
return $chk(index) && index >= 0 && index < this.lists.length ? serial[index] : serial;
|
|
}
|
|
|
|
});
|
|
|
|
|
|
/*
|
|
---
|
|
|
|
script: HtmlTable.js
|
|
|
|
description: Builds table elements with methods to add rows.
|
|
|
|
license: MIT-style license
|
|
|
|
authors:
|
|
- Aaron Newton
|
|
|
|
requires:
|
|
- core:1.2.4/Options
|
|
- core:1.2.4/Events
|
|
- /Class.Occlude
|
|
|
|
provides: [HtmlTable]
|
|
|
|
...
|
|
*/
|
|
|
|
var HtmlTable = new Class({
|
|
|
|
Implements: [Options, Events, Class.Occlude],
|
|
|
|
options: {
|
|
properties: {
|
|
cellpadding: 0,
|
|
cellspacing: 0,
|
|
border: 0
|
|
},
|
|
rows: [],
|
|
headers: [],
|
|
footers: []
|
|
},
|
|
|
|
property: 'HtmlTable',
|
|
|
|
initialize: function(){
|
|
var params = Array.link(arguments, {options: Object.type, table: Element.type});
|
|
this.setOptions(params.options);
|
|
this.element = params.table || new Element('table', this.options.properties);
|
|
if (this.occlude()) return this.occluded;
|
|
this.build();
|
|
},
|
|
|
|
build: function(){
|
|
this.element.store('HtmlTable', this);
|
|
|
|
this.body = document.id(this.element.tBodies[0]) || new Element('tbody').inject(this.element);
|
|
$$(this.body.rows);
|
|
|
|
if (this.options.headers.length) this.setHeaders(this.options.headers);
|
|
else this.thead = document.id(this.element.tHead);
|
|
if (this.thead) this.head = document.id(this.thead.rows[0]);
|
|
|
|
if (this.options.footers.length) this.setFooters(this.options.footers);
|
|
this.tfoot = document.id(this.element.tFoot);
|
|
if (this.tfoot) this.foot = document.id(this.thead.rows[0]);
|
|
|
|
this.options.rows.each(function(row){
|
|
this.push(row);
|
|
}, this);
|
|
|
|
['adopt', 'inject', 'wraps', 'grab', 'replaces', 'dispose'].each(function(method){
|
|
this[method] = this.element[method].bind(this.element);
|
|
}, this);
|
|
},
|
|
|
|
toElement: function(){
|
|
return this.element;
|
|
},
|
|
|
|
empty: function(){
|
|
this.body.empty();
|
|
return this;
|
|
},
|
|
|
|
set: function(what, items) {
|
|
var target = (what == 'headers') ? 'tHead' : 'tFoot';
|
|
this[target.toLowerCase()] = (document.id(this.element[target]) || new Element(target.toLowerCase()).inject(this.element, 'top')).empty();
|
|
var data = this.push(items, {}, this[target.toLowerCase()], what == 'headers' ? 'th' : 'td');
|
|
if (what == 'headers') this.head = document.id(this.thead.rows[0]);
|
|
else this.foot = document.id(this.thead.rows[0]);
|
|
return data;
|
|
},
|
|
|
|
setHeaders: function(headers){
|
|
this.set('headers', headers);
|
|
return this;
|
|
},
|
|
|
|
setFooters: function(footers){
|
|
this.set('footers', footers);
|
|
return this;
|
|
},
|
|
|
|
push: function(row, rowProperties, target, tag){
|
|
var tds = row.map(function(data){
|
|
var td = new Element(tag || 'td', data.properties),
|
|
type = data.content || data || '',
|
|
element = document.id(type);
|
|
if($type(type) != 'string' && element) td.adopt(element);
|
|
else td.set('html', type);
|
|
|
|
return td;
|
|
});
|
|
|
|
return {
|
|
tr: new Element('tr', rowProperties).inject(target || this.body).adopt(tds),
|
|
tds: tds
|
|
};
|
|
}
|
|
|
|
});
|
|
|
|
|
|
/*
|
|
---
|
|
|
|
script: HtmlTable.Select.js
|
|
|
|
description: Builds a stripy, sortable table with methods to add rows. Rows can be selected with the mouse or keyboard navigation.
|
|
|
|
license: MIT-style license
|
|
|
|
authors:
|
|
- Harald Kirschner
|
|
- Aaron Newton
|
|
|
|
requires:
|
|
- /Keyboard
|
|
- /HtmlTable
|
|
- /Class.refactor
|
|
- /Element.Delegation
|
|
|
|
provides: [HtmlTable.Select]
|
|
|
|
...
|
|
*/
|
|
|
|
HtmlTable = Class.refactor(HtmlTable, {
|
|
|
|
options: {
|
|
/*onRowFocus: $empty,
|
|
onRowUnfocus: $empty,*/
|
|
useKeyboard: true,
|
|
classRowSelected: 'table-tr-selected',
|
|
classRowHovered: 'table-tr-hovered',
|
|
classSelectable: 'table-selectable',
|
|
allowMultiSelect: true,
|
|
selectable: false
|
|
},
|
|
|
|
initialize: function(){
|
|
this.previous.apply(this, arguments);
|
|
if (this.occluded) return this.occluded;
|
|
this.selectedRows = new Elements();
|
|
this.bound = {
|
|
mouseleave: this.mouseleave.bind(this),
|
|
focusRow: this.focusRow.bind(this)
|
|
};
|
|
if (this.options.selectable) this.enableSelect();
|
|
},
|
|
|
|
enableSelect: function(){
|
|
this.selectEnabled = true;
|
|
this.attachSelects();
|
|
this.element.addClass(this.options.classSelectable);
|
|
},
|
|
|
|
disableSelect: function(){
|
|
this.selectEnabled = false;
|
|
this.attach(false);
|
|
this.element.removeClass(this.options.classSelectable);
|
|
},
|
|
|
|
attachSelects: function(attach){
|
|
attach = $pick(attach, true);
|
|
var method = attach ? 'addEvents' : 'removeEvents';
|
|
this.element[method]({
|
|
mouseleave: this.bound.mouseleave
|
|
});
|
|
this.body[method]({
|
|
'click:relay(tr)': this.bound.focusRow
|
|
});
|
|
if (this.options.useKeyboard || this.keyboard){
|
|
if (!this.keyboard) this.keyboard = new Keyboard({
|
|
events: {
|
|
down: function(e) {
|
|
e.preventDefault();
|
|
this.shiftFocus(1);
|
|
}.bind(this),
|
|
up: function(e) {
|
|
e.preventDefault();
|
|
this.shiftFocus(-1);
|
|
}.bind(this),
|
|
enter: function(e) {
|
|
e.preventDefault();
|
|
if (this.hover) this.focusRow(this.hover);
|
|
}.bind(this)
|
|
},
|
|
active: true
|
|
});
|
|
this.keyboard[attach ? 'activate' : 'deactivate']();
|
|
}
|
|
this.updateSelects();
|
|
},
|
|
|
|
mouseleave: function(){
|
|
if (this.hover) this.leaveRow(this.hover);
|
|
},
|
|
|
|
focus: function(){
|
|
if (this.keyboard) this.keyboard.activate();
|
|
},
|
|
|
|
blur: function(){
|
|
if (this.keyboard) this.keyboard.deactivate();
|
|
},
|
|
|
|
push: function(){
|
|
var ret = this.previous.apply(this, arguments);
|
|
this.updateSelects();
|
|
return ret;
|
|
},
|
|
|
|
updateSelects: function(){
|
|
Array.each(this.body.rows, function(row){
|
|
var binders = row.retrieve('binders');
|
|
if ((binders && this.selectEnabled) || (!binders && !this.selectEnabled)) return;
|
|
if (!binders){
|
|
binders = {
|
|
mouseenter: this.enterRow.bind(this, [row]),
|
|
mouseleave: this.leaveRow.bind(this, [row])
|
|
};
|
|
row.store('binders', binders).addEvents(binders);
|
|
} else {
|
|
row.removeEvents(binders);
|
|
}
|
|
}, this);
|
|
},
|
|
|
|
enterRow: function(row){
|
|
if (this.hover) this.hover = this.leaveRow(this.hover);
|
|
this.hover = row.addClass(this.options.classRowHovered);
|
|
},
|
|
|
|
shiftFocus: function(offset){
|
|
if (!this.hover) return this.enterRow(this.body.rows[0]);
|
|
var to = Array.indexOf(this.body.rows, this.hover) + offset;
|
|
if (to < 0) to = 0;
|
|
if (to >= this.body.rows.length) to = this.body.rows.length - 1;
|
|
if (this.hover == this.body.rows[to]) return this;
|
|
this.enterRow(this.body.rows[to]);
|
|
},
|
|
|
|
leaveRow: function(row){
|
|
row.removeClass(this.options.classRowHovered);
|
|
},
|
|
|
|
focusRow: function(){
|
|
var row = arguments[1] || arguments[0]; //delegation passes the event first
|
|
if (!this.body.getChildren().contains(row)) return;
|
|
var unfocus = function(row){
|
|
this.selectedRows.erase(row);
|
|
row.removeClass(this.options.classRowSelected);
|
|
this.fireEvent('rowUnfocus', [row, this.selectedRows]);
|
|
}.bind(this);
|
|
if (!this.options.allowMultiSelect) this.selectedRows.each(unfocus);
|
|
if (!this.selectedRows.contains(row)) {
|
|
this.selectedRows.push(row);
|
|
row.addClass(this.options.classRowSelected);
|
|
this.fireEvent('rowFocus', [row, this.selectedRows]);
|
|
} else {
|
|
unfocus(row);
|
|
}
|
|
return false;
|
|
},
|
|
|
|
selectAll: function(status){
|
|
status = $pick(status, true);
|
|
if (!this.options.allowMultiSelect && status) return;
|
|
if (!status) this.selectedRows.removeClass(this.options.classRowSelected).empty();
|
|
else this.selectedRows.combine(this.body.rows).addClass(this.options.classRowSelected);
|
|
return this;
|
|
},
|
|
|
|
selectNone: function(){
|
|
return this.selectAll(false);
|
|
}
|
|
|
|
});
|
|
|
|
|
|
/*
|
|
---
|
|
|
|
script: Keyboard.js
|
|
|
|
description: KeyboardEvents used to intercept events on a class for keyboard and format modifiers in a specific order so as to make alt+shift+c the same as shift+alt+c.
|
|
|
|
license: MIT-style license
|
|
|
|
authors:
|
|
- Perrin Westrich
|
|
- Aaron Newton
|
|
- Scott Kyle
|
|
|
|
requires:
|
|
- core:1.2.4/Events
|
|
- core:1.2.4/Options
|
|
- core:1.2.4/Element.Event
|
|
- /Log
|
|
|
|
provides: [Keyboard]
|
|
|
|
...
|
|
*/
|
|
|
|
(function(){
|
|
|
|
var Keyboard = this.Keyboard = new Class({
|
|
|
|
Extends: Events,
|
|
|
|
Implements: [Options, Log],
|
|
|
|
options: {
|
|
/*
|
|
onActivate: $empty,
|
|
onDeactivate: $empty,
|
|
*/
|
|
defaultEventType: 'keydown',
|
|
active: false,
|
|
events: {},
|
|
nonParsedEvents: ['activate', 'deactivate', 'onactivate', 'ondeactivate', 'changed', 'onchanged']
|
|
},
|
|
|
|
initialize: function(options){
|
|
this.setOptions(options);
|
|
this.setup();
|
|
},
|
|
setup: function(){
|
|
this.addEvents(this.options.events);
|
|
//if this is the root manager, nothing manages it
|
|
if (Keyboard.manager && !this.manager) Keyboard.manager.manage(this);
|
|
if (this.options.active) this.activate();
|
|
},
|
|
|
|
handle: function(event, type){
|
|
//Keyboard.stop(event) prevents key propagation
|
|
if (event.preventKeyboardPropagation) return;
|
|
|
|
var bubbles = !!this.manager;
|
|
if (bubbles && this.activeKB){
|
|
this.activeKB.handle(event, type);
|
|
if (event.preventKeyboardPropagation) return;
|
|
}
|
|
this.fireEvent(type, event);
|
|
|
|
if (!bubbles && this.activeKB) this.activeKB.handle(event, type);
|
|
},
|
|
|
|
addEvent: function(type, fn, internal){
|
|
return this.parent(Keyboard.parse(type, this.options.defaultEventType, this.options.nonParsedEvents), fn, internal);
|
|
},
|
|
|
|
removeEvent: function(type, fn){
|
|
return this.parent(Keyboard.parse(type, this.options.defaultEventType, this.options.nonParsedEvents), fn);
|
|
},
|
|
|
|
toggleActive: function(){
|
|
return this[this.active ? 'deactivate' : 'activate']();
|
|
},
|
|
|
|
activate: function(instance){
|
|
if (instance) {
|
|
//if we're stealing focus, store the last keyboard to have it so the relenquish command works
|
|
if (instance != this.activeKB) this.previous = this.activeKB;
|
|
//if we're enabling a child, assign it so that events are now passed to it
|
|
this.activeKB = instance.fireEvent('activate');
|
|
Keyboard.manager.fireEvent('changed');
|
|
} else if (this.manager) {
|
|
//else we're enabling ourselves, we must ask our parent to do it for us
|
|
this.manager.activate(this);
|
|
}
|
|
return this;
|
|
},
|
|
|
|
deactivate: function(instance){
|
|
if (instance) {
|
|
if(instance === this.activeKB) {
|
|
this.activeKB = null;
|
|
instance.fireEvent('deactivate');
|
|
Keyboard.manager.fireEvent('changed');
|
|
}
|
|
}
|
|
else if (this.manager) {
|
|
this.manager.deactivate(this);
|
|
}
|
|
return this;
|
|
},
|
|
|
|
relenquish: function(){
|
|
if (this.previous) this.activate(this.previous);
|
|
},
|
|
|
|
//management logic
|
|
manage: function(instance){
|
|
if (instance.manager) instance.manager.drop(instance);
|
|
this.instances.push(instance);
|
|
instance.manager = this;
|
|
if (!this.activeKB) this.activate(instance);
|
|
else this._disable(instance);
|
|
},
|
|
|
|
_disable: function(instance){
|
|
if (this.activeKB == instance) this.activeKB = null;
|
|
},
|
|
|
|
drop: function(instance){
|
|
this._disable(instance);
|
|
this.instances.erase(instance);
|
|
},
|
|
|
|
instances: [],
|
|
|
|
trace: function(){
|
|
Keyboard.trace(this);
|
|
},
|
|
|
|
each: function(fn){
|
|
Keyboard.each(this, fn);
|
|
}
|
|
|
|
});
|
|
|
|
var parsed = {};
|
|
var modifiers = ['shift', 'control', 'alt', 'meta'];
|
|
var regex = /^(?:shift|control|ctrl|alt|meta)$/;
|
|
|
|
Keyboard.parse = function(type, eventType, ignore){
|
|
if (ignore && ignore.contains(type.toLowerCase())) return type;
|
|
|
|
type = type.toLowerCase().replace(/^(keyup|keydown):/, function($0, $1){
|
|
eventType = $1;
|
|
return '';
|
|
});
|
|
|
|
if (!parsed[type]){
|
|
var key, mods = {};
|
|
type.split('+').each(function(part){
|
|
if (regex.test(part)) mods[part] = true;
|
|
else key = part;
|
|
});
|
|
|
|
mods.control = mods.control || mods.ctrl; // allow both control and ctrl
|
|
|
|
var keys = [];
|
|
modifiers.each(function(mod){
|
|
if (mods[mod]) keys.push(mod);
|
|
});
|
|
|
|
if (key) keys.push(key);
|
|
parsed[type] = keys.join('+');
|
|
}
|
|
|
|
return eventType + ':' + parsed[type];
|
|
};
|
|
|
|
Keyboard.each = function(keyboard, fn){
|
|
var current = keyboard || Keyboard.manager;
|
|
while (current){
|
|
fn.run(current);
|
|
current = current.activeKB;
|
|
}
|
|
};
|
|
|
|
Keyboard.stop = function(event){
|
|
event.preventKeyboardPropagation = true;
|
|
};
|
|
|
|
Keyboard.manager = new Keyboard({
|
|
active: true
|
|
});
|
|
|
|
Keyboard.trace = function(keyboard){
|
|
keyboard = keyboard || Keyboard.manager;
|
|
keyboard.enableLog();
|
|
keyboard.log('the following items have focus: ');
|
|
Keyboard.each(keyboard, function(current){
|
|
keyboard.log(document.id(current.widget) || current.wiget || current);
|
|
});
|
|
};
|
|
|
|
var handler = function(event){
|
|
var keys = [];
|
|
modifiers.each(function(mod){
|
|
if (event[mod]) keys.push(mod);
|
|
});
|
|
|
|
if (!regex.test(event.key)) keys.push(event.key);
|
|
Keyboard.manager.handle(event, event.type + ':' + keys.join('+'));
|
|
};
|
|
|
|
document.addEvents({
|
|
'keyup': handler,
|
|
'keydown': handler
|
|
});
|
|
|
|
Event.Keys.extend({
|
|
'shift': 16,
|
|
'control': 17,
|
|
'alt': 18,
|
|
'capslock': 20,
|
|
'pageup': 33,
|
|
'pagedown': 34,
|
|
'end': 35,
|
|
'home': 36,
|
|
'numlock': 144,
|
|
'scrolllock': 145,
|
|
';': 186,
|
|
'=': 187,
|
|
',': 188,
|
|
'-': Browser.Engine.Gecko ? 109 : 189,
|
|
'.': 190,
|
|
'/': 191,
|
|
'`': 192,
|
|
'[': 219,
|
|
'\\': 220,
|
|
']': 221,
|
|
"'": 222
|
|
});
|
|
|
|
})();
|
|
|
|
|
|
/*
|
|
---
|
|
|
|
script: Scroller.js
|
|
|
|
description: Class which scrolls the contents of any Element (including the window) when the mouse reaches the Element's boundaries.
|
|
|
|
license: MIT-style license
|
|
|
|
authors:
|
|
- Valerio Proietti
|
|
|
|
requires:
|
|
- core:1.2.4/Events
|
|
- core:1.2.4/Options
|
|
- core:1.2.4/Element.Event
|
|
- core:1.2.4/Element.Dimensions
|
|
|
|
provides: [Scroller]
|
|
|
|
...
|
|
*/
|
|
|
|
var Scroller = new Class({
|
|
|
|
Implements: [Events, Options],
|
|
|
|
options: {
|
|
area: 20,
|
|
velocity: 1,
|
|
onChange: function(x, y){
|
|
this.element.scrollTo(x, y);
|
|
},
|
|
fps: 50
|
|
},
|
|
|
|
initialize: function(element, options){
|
|
this.setOptions(options);
|
|
this.element = document.id(element);
|
|
this.docBody = document.id(this.element.getDocument().body);
|
|
this.listener = ($type(this.element) != 'element') ? this.docBody : this.element;
|
|
this.timer = null;
|
|
this.bound = {
|
|
attach: this.attach.bind(this),
|
|
detach: this.detach.bind(this),
|
|
getCoords: this.getCoords.bind(this)
|
|
};
|
|
},
|
|
|
|
start: function(){
|
|
this.listener.addEvents({
|
|
mouseover: this.bound.attach,
|
|
mouseout: this.bound.detach
|
|
});
|
|
},
|
|
|
|
stop: function(){
|
|
this.listener.removeEvents({
|
|
mouseover: this.bound.attach,
|
|
mouseout: this.bound.detach
|
|
});
|
|
this.detach();
|
|
this.timer = $clear(this.timer);
|
|
},
|
|
|
|
attach: function(){
|
|
this.listener.addEvent('mousemove', this.bound.getCoords);
|
|
},
|
|
|
|
detach: function(){
|
|
this.listener.removeEvent('mousemove', this.bound.getCoords);
|
|
this.timer = $clear(this.timer);
|
|
},
|
|
|
|
getCoords: function(event){
|
|
this.page = (this.listener.get('tag') == 'body') ? event.client : event.page;
|
|
if (!this.timer) this.timer = this.scroll.periodical(Math.round(1000 / this.options.fps), this);
|
|
},
|
|
|
|
scroll: function(){
|
|
var size = this.element.getSize(),
|
|
scroll = this.element.getScroll(),
|
|
pos = this.element != this.docBody ? this.element.getOffsets() : {x: 0, y:0},
|
|
scrollSize = this.element.getScrollSize(),
|
|
change = {x: 0, y: 0};
|
|
for (var z in this.page){
|
|
if (this.page[z] < (this.options.area + pos[z]) && scroll[z] != 0) {
|
|
change[z] = (this.page[z] - this.options.area - pos[z]) * this.options.velocity;
|
|
} else if (this.page[z] + this.options.area > (size[z] + pos[z]) && scroll[z] + size[z] != scrollSize[z]) {
|
|
change[z] = (this.page[z] - size[z] + this.options.area - pos[z]) * this.options.velocity;
|
|
}
|
|
}
|
|
if (change.y || change.x) this.fireEvent('change', [scroll.x + change.x, scroll.y + change.y]);
|
|
}
|
|
|
|
});
|
|
|
|
/*
|
|
---
|
|
|
|
script: Tips.js
|
|
|
|
description: Class for creating nice tips that follow the mouse cursor when hovering an element.
|
|
|
|
license: MIT-style license
|
|
|
|
authors:
|
|
- Valerio Proietti
|
|
- Christoph Pojer
|
|
|
|
requires:
|
|
- core:1.2.4/Options
|
|
- core:1.2.4/Events
|
|
- core:1.2.4/Element.Event
|
|
- core:1.2.4/Element.Style
|
|
- core:1.2.4/Element.Dimensions
|
|
- /MooTools.More
|
|
|
|
provides: [Tips]
|
|
|
|
...
|
|
*/
|
|
|
|
(function(){
|
|
|
|
var read = function(option, element){
|
|
return (option) ? ($type(option) == 'function' ? option(element) : element.get(option)) : '';
|
|
};
|
|
|
|
this.Tips = new Class({
|
|
|
|
Implements: [Events, Options],
|
|
|
|
options: {
|
|
/*
|
|
onAttach: $empty(element),
|
|
onDetach: $empty(element),
|
|
*/
|
|
onShow: function(){
|
|
this.tip.setStyle('display', 'block');
|
|
},
|
|
onHide: function(){
|
|
this.tip.setStyle('display', 'none');
|
|
},
|
|
title: 'title',
|
|
text: function(element){
|
|
return element.get('rel') || element.get('href');
|
|
},
|
|
showDelay: 100,
|
|
hideDelay: 100,
|
|
className: 'tip-wrap',
|
|
offset: {x: 16, y: 16},
|
|
windowPadding: {x:0, y:0},
|
|
fixed: false
|
|
},
|
|
|
|
initialize: function(){
|
|
var params = Array.link(arguments, {options: Object.type, elements: $defined});
|
|
this.setOptions(params.options);
|
|
if (params.elements) this.attach(params.elements);
|
|
this.container = new Element('div', {'class': 'tip'});
|
|
},
|
|
|
|
toElement: function(){
|
|
if (this.tip) return this.tip;
|
|
|
|
return this.tip = new Element('div', {
|
|
'class': this.options.className,
|
|
styles: {
|
|
position: 'absolute',
|
|
top: 0,
|
|
left: 0
|
|
}
|
|
}).adopt(
|
|
new Element('div', {'class': 'tip-top'}),
|
|
this.container,
|
|
new Element('div', {'class': 'tip-bottom'})
|
|
).inject(document.body);
|
|
},
|
|
|
|
attach: function(elements){
|
|
$$(elements).each(function(element){
|
|
var title = read(this.options.title, element),
|
|
text = read(this.options.text, element);
|
|
|
|
element.erase('title').store('tip:native', title).retrieve('tip:title', title);
|
|
element.retrieve('tip:text', text);
|
|
this.fireEvent('attach', [element]);
|
|
|
|
var events = ['enter', 'leave'];
|
|
if (!this.options.fixed) events.push('move');
|
|
|
|
events.each(function(value){
|
|
var event = element.retrieve('tip:' + value);
|
|
if (!event) event = this['element' + value.capitalize()].bindWithEvent(this, element);
|
|
|
|
element.store('tip:' + value, event).addEvent('mouse' + value, event);
|
|
}, this);
|
|
}, this);
|
|
|
|
return this;
|
|
},
|
|
|
|
detach: function(elements){
|
|
$$(elements).each(function(element){
|
|
['enter', 'leave', 'move'].each(function(value){
|
|
element.removeEvent('mouse' + value, element.retrieve('tip:' + value)).eliminate('tip:' + value);
|
|
});
|
|
|
|
this.fireEvent('detach', [element]);
|
|
|
|
if (this.options.title == 'title'){ // This is necessary to check if we can revert the title
|
|
var original = element.retrieve('tip:native');
|
|
if (original) element.set('title', original);
|
|
}
|
|
}, this);
|
|
|
|
return this;
|
|
},
|
|
|
|
elementEnter: function(event, element){
|
|
this.container.empty();
|
|
|
|
['title', 'text'].each(function(value){
|
|
var content = element.retrieve('tip:' + value);
|
|
if (content) this.fill(new Element('div', {'class': 'tip-' + value}).inject(this.container), content);
|
|
}, this);
|
|
|
|
$clear(this.timer);
|
|
this.timer = (function(){
|
|
this.show(this, element);
|
|
this.position((this.options.fixed) ? {page: element.getPosition()} : event);
|
|
}).delay(this.options.showDelay, this);
|
|
},
|
|
|
|
elementLeave: function(event, element){
|
|
$clear(this.timer);
|
|
this.timer = this.hide.delay(this.options.hideDelay, this, element);
|
|
this.fireForParent(event, element);
|
|
},
|
|
|
|
fireForParent: function(event, element){
|
|
element = element.getParent();
|
|
if (!element || element == document.body) return;
|
|
if (element.retrieve('tip:enter')) element.fireEvent('mouseenter', event);
|
|
else this.fireForParent(event, element);
|
|
},
|
|
|
|
elementMove: function(event, element){
|
|
this.position(event);
|
|
},
|
|
|
|
position: function(event){
|
|
if (!this.tip) document.id(this);
|
|
|
|
var size = window.getSize(), scroll = window.getScroll(),
|
|
tip = {x: this.tip.offsetWidth, y: this.tip.offsetHeight},
|
|
props = {x: 'left', y: 'top'},
|
|
obj = {};
|
|
|
|
for (var z in props){
|
|
obj[props[z]] = event.page[z] + this.options.offset[z];
|
|
if ((obj[props[z]] + tip[z] - scroll[z]) > size[z] - this.options.windowPadding[z]) obj[props[z]] = event.page[z] - this.options.offset[z] - tip[z];
|
|
}
|
|
|
|
this.tip.setStyles(obj);
|
|
},
|
|
|
|
fill: function(element, contents){
|
|
if(typeof contents == 'string') element.set('html', contents);
|
|
else element.adopt(contents);
|
|
},
|
|
|
|
show: function(element){
|
|
if (!this.tip) document.id(this);
|
|
this.fireEvent('show', [this.tip, element]);
|
|
},
|
|
|
|
hide: function(element){
|
|
if (!this.tip) document.id(this);
|
|
this.fireEvent('hide', [this.tip, element]);
|
|
}
|
|
|
|
});
|
|
|
|
})(); |