Scripts and Javascripts

Add these ancilliary files that came with Rails 2.1.0 RC1.
This commit is contained in:
Jacques Distler 2008-05-18 00:25:51 -05:00
parent 5292899c9a
commit a37b06b801
6 changed files with 4104 additions and 2196 deletions

View file

@ -1,6 +1,6 @@
// Copyright (c) 2005, 2006 Thomas Fuchs (http://script.aculo.us, http://mir.aculo.us) // Copyright (c) 2005-2008 Thomas Fuchs (http://script.aculo.us, http://mir.aculo.us)
// (c) 2005, 2006 Ivan Krstic (http://blogs.law.harvard.edu/ivan) // (c) 2005-2007 Ivan Krstic (http://blogs.law.harvard.edu/ivan)
// (c) 2005, 2006 Jon Tirsen (http://www.tirsen.com) // (c) 2005-2007 Jon Tirsen (http://www.tirsen.com)
// Contributors: // Contributors:
// Richard Livsey // Richard Livsey
// Rahul Bhargava // Rahul Bhargava
@ -38,16 +38,17 @@ if(typeof Effect == 'undefined')
throw("controls.js requires including script.aculo.us' effects.js library"); throw("controls.js requires including script.aculo.us' effects.js library");
var Autocompleter = { } var Autocompleter = { }
Autocompleter.Base = function() {}; Autocompleter.Base = Class.create({
Autocompleter.Base.prototype = {
baseInitialize: function(element, update, options) { baseInitialize: function(element, update, options) {
this.element = $(element); element = $(element)
this.element = element;
this.update = $(update); this.update = $(update);
this.hasFocus = false; this.hasFocus = false;
this.changed = false; this.changed = false;
this.active = false; this.active = false;
this.index = 0; this.index = 0;
this.entryCount = 0; this.entryCount = 0;
this.oldElementValue = this.element.value;
if(this.setOptions) if(this.setOptions)
this.setOptions(options); this.setOptions(options);
@ -74,6 +75,9 @@ Autocompleter.Base.prototype = {
if(typeof(this.options.tokens) == 'string') if(typeof(this.options.tokens) == 'string')
this.options.tokens = new Array(this.options.tokens); this.options.tokens = new Array(this.options.tokens);
// Force carriage returns as token delimiters anyway
if (!this.options.tokens.include('\n'))
this.options.tokens.push('\n');
this.observer = null; this.observer = null;
@ -81,15 +85,14 @@ Autocompleter.Base.prototype = {
Element.hide(this.update); Element.hide(this.update);
Event.observe(this.element, "blur", this.onBlur.bindAsEventListener(this)); Event.observe(this.element, 'blur', this.onBlur.bindAsEventListener(this));
Event.observe(this.element, "keypress", this.onKeyPress.bindAsEventListener(this)); Event.observe(this.element, 'keydown', this.onKeyPress.bindAsEventListener(this));
}, },
show: function() { show: function() {
if(Element.getStyle(this.update, 'display')=='none') this.options.onShow(this.element, this.update); if(Element.getStyle(this.update, 'display')=='none') this.options.onShow(this.element, this.update);
if(!this.iefix && if(!this.iefix &&
(navigator.appVersion.indexOf('MSIE')>0) && (Prototype.Browser.IE) &&
(navigator.userAgent.indexOf('Opera')<0) &&
(Element.getStyle(this.update, 'position')=='absolute')) { (Element.getStyle(this.update, 'position')=='absolute')) {
new Insertion.After(this.update, new Insertion.After(this.update,
'<iframe id="' + this.update.id + '_iefix" '+ '<iframe id="' + this.update.id + '_iefix" '+
@ -139,17 +142,17 @@ Autocompleter.Base.prototype = {
case Event.KEY_UP: case Event.KEY_UP:
this.markPrevious(); this.markPrevious();
this.render(); this.render();
if(navigator.appVersion.indexOf('AppleWebKit')>0) Event.stop(event); Event.stop(event);
return; return;
case Event.KEY_DOWN: case Event.KEY_DOWN:
this.markNext(); this.markNext();
this.render(); this.render();
if(navigator.appVersion.indexOf('AppleWebKit')>0) Event.stop(event); Event.stop(event);
return; return;
} }
else else
if(event.keyCode==Event.KEY_TAB || event.keyCode==Event.KEY_RETURN || if(event.keyCode==Event.KEY_TAB || event.keyCode==Event.KEY_RETURN ||
(navigator.appVersion.indexOf('AppleWebKit') > 0 && event.keyCode == 0)) return; (Prototype.Browser.WebKit > 0 && event.keyCode == 0)) return;
this.changed = true; this.changed = true;
this.hasFocus = true; this.hasFocus = true;
@ -195,7 +198,6 @@ Autocompleter.Base.prototype = {
this.index==i ? this.index==i ?
Element.addClassName(this.getEntry(i),"selected") : Element.addClassName(this.getEntry(i),"selected") :
Element.removeClassName(this.getEntry(i),"selected"); Element.removeClassName(this.getEntry(i),"selected");
if(this.hasFocus) { if(this.hasFocus) {
this.show(); this.show();
this.active = true; this.active = true;
@ -238,21 +240,22 @@ Autocompleter.Base.prototype = {
} }
var value = ''; var value = '';
if (this.options.select) { if (this.options.select) {
var nodes = document.getElementsByClassName(this.options.select, selectedElement) || []; var nodes = $(selectedElement).select('.' + this.options.select) || [];
if(nodes.length>0) value = Element.collectTextNodes(nodes[0], this.options.select); if(nodes.length>0) value = Element.collectTextNodes(nodes[0], this.options.select);
} else } else
value = Element.collectTextNodesIgnoreClass(selectedElement, 'informal'); value = Element.collectTextNodesIgnoreClass(selectedElement, 'informal');
var lastTokenPos = this.findLastToken(); var bounds = this.getTokenBounds();
if (lastTokenPos != -1) { if (bounds[0] != -1) {
var newValue = this.element.value.substr(0, lastTokenPos + 1); var newValue = this.element.value.substr(0, bounds[0]);
var whitespace = this.element.value.substr(lastTokenPos + 1).match(/^\s+/); var whitespace = this.element.value.substr(bounds[0]).match(/^\s+/);
if (whitespace) if (whitespace)
newValue += whitespace[0]; newValue += whitespace[0];
this.element.value = newValue + value; this.element.value = newValue + value + this.element.value.substr(bounds[1]);
} else { } else {
this.element.value = value; this.element.value = value;
} }
this.oldElementValue = this.element.value;
this.element.focus(); this.element.focus();
if (this.options.afterUpdateElement) if (this.options.afterUpdateElement)
@ -296,39 +299,48 @@ Autocompleter.Base.prototype = {
onObserverEvent: function() { onObserverEvent: function() {
this.changed = false; this.changed = false;
this.tokenBounds = null;
if(this.getToken().length>=this.options.minChars) { if(this.getToken().length>=this.options.minChars) {
this.startIndicator();
this.getUpdatedChoices(); this.getUpdatedChoices();
} else { } else {
this.active = false; this.active = false;
this.hide(); this.hide();
} }
this.oldElementValue = this.element.value;
}, },
getToken: function() { getToken: function() {
var tokenPos = this.findLastToken(); var bounds = this.getTokenBounds();
if (tokenPos != -1) return this.element.value.substring(bounds[0], bounds[1]).strip();
var ret = this.element.value.substr(tokenPos + 1).replace(/^\s+/,'').replace(/\s+$/,'');
else
var ret = this.element.value;
return /\n/.test(ret) ? '' : ret;
}, },
findLastToken: function() { getTokenBounds: function() {
var lastTokenPos = -1; if (null != this.tokenBounds) return this.tokenBounds;
var value = this.element.value;
if (value.strip().empty()) return [-1, 0];
var diff = arguments.callee.getFirstDifferencePos(value, this.oldElementValue);
var offset = (diff == this.oldElementValue.length ? 1 : 0);
var prevTokenPos = -1, nextTokenPos = value.length;
var tp;
for (var index = 0, l = this.options.tokens.length; index < l; ++index) {
tp = value.lastIndexOf(this.options.tokens[index], diff + offset - 1);
if (tp > prevTokenPos) prevTokenPos = tp;
tp = value.indexOf(this.options.tokens[index], diff + offset);
if (-1 != tp && tp < nextTokenPos) nextTokenPos = tp;
}
return (this.tokenBounds = [prevTokenPos + 1, nextTokenPos]);
}
});
for (var i=0; i<this.options.tokens.length; i++) { Autocompleter.Base.prototype.getTokenBounds.getFirstDifferencePos = function(newS, oldS) {
var thisTokenPos = this.element.value.lastIndexOf(this.options.tokens[i]); var boundary = Math.min(newS.length, oldS.length);
if (thisTokenPos > lastTokenPos) for (var index = 0; index < boundary; ++index)
lastTokenPos = thisTokenPos; if (newS[index] != oldS[index])
} return index;
return lastTokenPos; return boundary;
} };
}
Ajax.Autocompleter = Class.create(); Ajax.Autocompleter = Class.create(Autocompleter.Base, {
Object.extend(Object.extend(Ajax.Autocompleter.prototype, Autocompleter.Base.prototype), {
initialize: function(element, update, url, options) { initialize: function(element, update, url, options) {
this.baseInitialize(element, update, options); this.baseInitialize(element, update, options);
this.options.asynchronous = true; this.options.asynchronous = true;
@ -338,7 +350,9 @@ Object.extend(Object.extend(Ajax.Autocompleter.prototype, Autocompleter.Base.pro
}, },
getUpdatedChoices: function() { getUpdatedChoices: function() {
entry = encodeURIComponent(this.options.paramName) + '=' + this.startIndicator();
var entry = encodeURIComponent(this.options.paramName) + '=' +
encodeURIComponent(this.getToken()); encodeURIComponent(this.getToken());
this.options.parameters = this.options.callback ? this.options.parameters = this.options.callback ?
@ -353,7 +367,6 @@ Object.extend(Object.extend(Ajax.Autocompleter.prototype, Autocompleter.Base.pro
onComplete: function(request) { onComplete: function(request) {
this.updateChoices(request.responseText); this.updateChoices(request.responseText);
} }
}); });
// The local array autocompleter. Used when you'd prefer to // The local array autocompleter. Used when you'd prefer to
@ -391,8 +404,7 @@ Object.extend(Object.extend(Ajax.Autocompleter.prototype, Autocompleter.Base.pro
// In that case, the other options above will not apply unless // In that case, the other options above will not apply unless
// you support them. // you support them.
Autocompleter.Local = Class.create(); Autocompleter.Local = Class.create(Autocompleter.Base, {
Autocompleter.Local.prototype = Object.extend(new Autocompleter.Base(), {
initialize: function(element, update, array, options) { initialize: function(element, update, array, options) {
this.baseInitialize(element, update, options); this.baseInitialize(element, update, options);
this.options.array = array; this.options.array = array;
@ -452,9 +464,8 @@ Autocompleter.Local.prototype = Object.extend(new Autocompleter.Base(), {
} }
}); });
// AJAX in-place editor // AJAX in-place editor and collection editor
// // Full rewrite by Christophe Porteneuve <tdd@tddsworld.com> (April 2007).
// see documentation on http://wiki.script.aculo.us/scriptaculous/show/Ajax.InPlaceEditor
// Use this if you notice weird scrolling problems on some browsers, // Use this if you notice weird scrolling problems on some browsers,
// the DOM might be a bit confused when this gets called so do this // the DOM might be a bit confused when this gets called so do this
@ -465,353 +476,472 @@ Field.scrollFreeActivate = function(field) {
}, 1); }, 1);
} }
Ajax.InPlaceEditor = Class.create(); Ajax.InPlaceEditor = Class.create({
Ajax.InPlaceEditor.defaultHighlightColor = "#FFFF99";
Ajax.InPlaceEditor.prototype = {
initialize: function(element, url, options) { initialize: function(element, url, options) {
this.url = url; this.url = url;
this.element = $(element); this.element = element = $(element);
this.prepareOptions();
this.options = Object.extend({ this._controls = { };
paramName: "value", arguments.callee.dealWithDeprecatedOptions(options); // DEPRECATION LAYER!!!
okButton: true, Object.extend(this.options, options || { });
okText: "ok",
cancelLink: true,
cancelText: "cancel",
savingText: "Saving...",
clickToEditText: "Click to edit",
okText: "ok",
rows: 1,
onComplete: function(transport, element) {
new Effect.Highlight(element, {startcolor: this.options.highlightcolor});
},
onFailure: function(transport) {
alert("Error communicating with the server: " + transport.responseText.stripTags());
},
callback: function(form) {
return Form.serialize(form);
},
handleLineBreaks: true,
loadingText: 'Loading...',
savingClassName: 'inplaceeditor-saving',
loadingClassName: 'inplaceeditor-loading',
formClassName: 'inplaceeditor-form',
highlightcolor: Ajax.InPlaceEditor.defaultHighlightColor,
highlightendcolor: "#FFFFFF",
externalControl: null,
submitOnBlur: false,
ajaxOptions: {},
evalScripts: false
}, options || {});
if (!this.options.formId && this.element.id) { if (!this.options.formId && this.element.id) {
this.options.formId = this.element.id + "-inplaceeditor"; this.options.formId = this.element.id + '-inplaceeditor';
if ($(this.options.formId)) { if ($(this.options.formId))
// there's already a form with that name, don't specify an id this.options.formId = '';
this.options.formId = null;
} }
} if (this.options.externalControl)
if (this.options.externalControl) {
this.options.externalControl = $(this.options.externalControl); this.options.externalControl = $(this.options.externalControl);
} if (!this.options.externalControl)
this.options.externalControlOnly = false;
this.originalBackground = Element.getStyle(this.element, 'background-color'); this._originalBackground = this.element.getStyle('background-color') || 'transparent';
if (!this.originalBackground) {
this.originalBackground = "transparent";
}
this.element.title = this.options.clickToEditText; this.element.title = this.options.clickToEditText;
this._boundCancelHandler = this.handleFormCancellation.bind(this);
this.onclickListener = this.enterEditMode.bindAsEventListener(this); this._boundComplete = (this.options.onComplete || Prototype.emptyFunction).bind(this);
this.mouseoverListener = this.enterHover.bindAsEventListener(this); this._boundFailureHandler = this.handleAJAXFailure.bind(this);
this.mouseoutListener = this.leaveHover.bindAsEventListener(this); this._boundSubmitHandler = this.handleFormSubmission.bind(this);
Event.observe(this.element, 'click', this.onclickListener); this._boundWrapperHandler = this.wrapUp.bind(this);
Event.observe(this.element, 'mouseover', this.mouseoverListener); this.registerListeners();
Event.observe(this.element, 'mouseout', this.mouseoutListener);
if (this.options.externalControl) {
Event.observe(this.options.externalControl, 'click', this.onclickListener);
Event.observe(this.options.externalControl, 'mouseover', this.mouseoverListener);
Event.observe(this.options.externalControl, 'mouseout', this.mouseoutListener);
}
}, },
enterEditMode: function(evt) { checkForEscapeOrReturn: function(e) {
if (this.saving) return; if (!this._editing || e.ctrlKey || e.altKey || e.shiftKey) return;
if (this.editing) return; if (Event.KEY_ESC == e.keyCode)
this.editing = true; this.handleFormCancellation(e);
this.onEnterEditMode(); else if (Event.KEY_RETURN == e.keyCode)
if (this.options.externalControl) { this.handleFormSubmission(e);
Element.hide(this.options.externalControl);
}
Element.hide(this.element);
this.createForm();
this.element.parentNode.insertBefore(this.form, this.element);
if (!this.options.loadTextURL) Field.scrollFreeActivate(this.editField);
// stop the event to avoid a page refresh in Safari
if (evt) {
Event.stop(evt);
}
return false;
}, },
createForm: function() { createControl: function(mode, handler, extraClasses) {
this.form = document.createElement("form"); var control = this.options[mode + 'Control'];
this.form.id = this.options.formId; var text = this.options[mode + 'Text'];
Element.addClassName(this.form, this.options.formClassName) if ('button' == control) {
this.form.onsubmit = this.onSubmit.bind(this); var btn = document.createElement('input');
btn.type = 'submit';
this.createEditField(); btn.value = text;
btn.className = 'editor_' + mode + '_button';
if (this.options.textarea) { if ('cancel' == mode)
var br = document.createElement("br"); btn.onclick = this._boundCancelHandler;
this.form.appendChild(br); this._form.appendChild(btn);
this._controls[mode] = btn;
} else if ('link' == control) {
var link = document.createElement('a');
link.href = '#';
link.appendChild(document.createTextNode(text));
link.onclick = 'cancel' == mode ? this._boundCancelHandler : this._boundSubmitHandler;
link.className = 'editor_' + mode + '_link';
if (extraClasses)
link.className += ' ' + extraClasses;
this._form.appendChild(link);
this._controls[mode] = link;
} }
if (this.options.okButton) {
okButton = document.createElement("input");
okButton.type = "submit";
okButton.value = this.options.okText;
okButton.className = 'editor_ok_button';
this.form.appendChild(okButton);
}
if (this.options.cancelLink) {
cancelLink = document.createElement("a");
cancelLink.href = "#";
cancelLink.appendChild(document.createTextNode(this.options.cancelText));
cancelLink.onclick = this.onclickCancel.bind(this);
cancelLink.className = 'editor_cancel';
this.form.appendChild(cancelLink);
}
},
hasHTMLLineBreaks: function(string) {
if (!this.options.handleLineBreaks) return false;
return string.match(/<br/i) || string.match(/<p>/i);
},
convertHTMLLineBreaks: function(string) {
return string.replace(/<br>/gi, "\n").replace(/<br\/>/gi, "\n").replace(/<\/p>/gi, "\n").replace(/<p>/gi, "");
}, },
createEditField: function() { createEditField: function() {
var text; var text = (this.options.loadTextURL ? this.options.loadingText : this.getText());
if(this.options.loadTextURL) { var fld;
text = this.options.loadingText; if (1 >= this.options.rows && !/\r|\n/.test(this.getText())) {
} else { fld = document.createElement('input');
text = this.getText(); fld.type = 'text';
}
var obj = this;
if (this.options.rows == 1 && !this.hasHTMLLineBreaks(text)) {
this.options.textarea = false;
var textField = document.createElement("input");
textField.obj = this;
textField.type = "text";
textField.name = this.options.paramName;
textField.value = text;
textField.style.backgroundColor = this.options.highlightcolor;
textField.className = 'editor_field';
var size = this.options.size || this.options.cols || 0; var size = this.options.size || this.options.cols || 0;
if (size != 0) textField.size = size; if (0 < size) fld.size = size;
if (this.options.submitOnBlur)
textField.onblur = this.onSubmit.bind(this);
this.editField = textField;
} else { } else {
this.options.textarea = true; fld = document.createElement('textarea');
var textArea = document.createElement("textarea"); fld.rows = (1 >= this.options.rows ? this.options.autoRows : this.options.rows);
textArea.obj = this; fld.cols = this.options.cols || 40;
textArea.name = this.options.paramName; }
textArea.value = this.convertHTMLLineBreaks(text); fld.name = this.options.paramName;
textArea.rows = this.options.rows; fld.value = text; // No HTML breaks conversion anymore
textArea.cols = this.options.cols || 40; fld.className = 'editor_field';
textArea.className = 'editor_field';
if (this.options.submitOnBlur) if (this.options.submitOnBlur)
textArea.onblur = this.onSubmit.bind(this); fld.onblur = this._boundSubmitHandler;
this.editField = textArea; this._controls.editor = fld;
} if (this.options.loadTextURL)
if(this.options.loadTextURL) {
this.loadExternalText(); this.loadExternalText();
} this._form.appendChild(this._controls.editor);
this.form.appendChild(this.editField); },
createForm: function() {
var ipe = this;
function addText(mode, condition) {
var text = ipe.options['text' + mode + 'Controls'];
if (!text || condition === false) return;
ipe._form.appendChild(document.createTextNode(text));
};
this._form = $(document.createElement('form'));
this._form.id = this.options.formId;
this._form.addClassName(this.options.formClassName);
this._form.onsubmit = this._boundSubmitHandler;
this.createEditField();
if ('textarea' == this._controls.editor.tagName.toLowerCase())
this._form.appendChild(document.createElement('br'));
if (this.options.onFormCustomization)
this.options.onFormCustomization(this, this._form);
addText('Before', this.options.okControl || this.options.cancelControl);
this.createControl('ok', this._boundSubmitHandler);
addText('Between', this.options.okControl && this.options.cancelControl);
this.createControl('cancel', this._boundCancelHandler, 'editor_cancel');
addText('After', this.options.okControl || this.options.cancelControl);
},
destroy: function() {
if (this._oldInnerHTML)
this.element.innerHTML = this._oldInnerHTML;
this.leaveEditMode();
this.unregisterListeners();
},
enterEditMode: function(e) {
if (this._saving || this._editing) return;
this._editing = true;
this.triggerCallback('onEnterEditMode');
if (this.options.externalControl)
this.options.externalControl.hide();
this.element.hide();
this.createForm();
this.element.parentNode.insertBefore(this._form, this.element);
if (!this.options.loadTextURL)
this.postProcessEditField();
if (e) Event.stop(e);
},
enterHover: function(e) {
if (this.options.hoverClassName)
this.element.addClassName(this.options.hoverClassName);
if (this._saving) return;
this.triggerCallback('onEnterHover');
}, },
getText: function() { getText: function() {
return this.element.innerHTML; return this.element.innerHTML;
}, },
loadExternalText: function() { handleAJAXFailure: function(transport) {
Element.addClassName(this.form, this.options.loadingClassName); this.triggerCallback('onFailure', transport);
this.editField.disabled = true; if (this._oldInnerHTML) {
new Ajax.Request( this.element.innerHTML = this._oldInnerHTML;
this.options.loadTextURL, this._oldInnerHTML = null;
Object.extend({
asynchronous: true,
onComplete: this.onLoadedExternalText.bind(this)
}, this.options.ajaxOptions)
);
},
onLoadedExternalText: function(transport) {
Element.removeClassName(this.form, this.options.loadingClassName);
this.editField.disabled = false;
this.editField.value = transport.responseText.stripTags();
Field.scrollFreeActivate(this.editField);
},
onclickCancel: function() {
this.onComplete();
this.leaveEditMode();
return false;
},
onFailure: function(transport) {
this.options.onFailure(transport);
if (this.oldInnerHTML) {
this.element.innerHTML = this.oldInnerHTML;
this.oldInnerHTML = null;
} }
return false;
}, },
onSubmit: function() { handleFormCancellation: function(e) {
// onLoading resets these so we need to save them away for the Ajax call this.wrapUp();
var form = this.form; if (e) Event.stop(e);
var value = this.editField.value; },
handleFormSubmission: function(e) {
// do this first, sometimes the ajax call returns before we get a chance to switch on Saving... var form = this._form;
// which means this will actually switch on Saving... *after* we've left edit mode causing Saving... var value = $F(this._controls.editor);
// to be displayed indefinitely this.prepareSubmission();
this.onLoading(); var params = this.options.callback(form, value) || '';
if (Object.isString(params))
if (this.options.evalScripts) { params = params.toQueryParams();
new Ajax.Request( params.editorId = this.element.id;
this.url, Object.extend({ if (this.options.htmlResponse) {
parameters: this.options.callback(form, value), var options = Object.extend({ evalScripts: true }, this.options.ajaxOptions);
onComplete: this.onComplete.bind(this), Object.extend(options, {
onFailure: this.onFailure.bind(this), parameters: params,
asynchronous:true, onComplete: this._boundWrapperHandler,
evalScripts:true onFailure: this._boundFailureHandler
}, this.options.ajaxOptions)); });
new Ajax.Updater({ success: this.element }, this.url, options);
} else { } else {
new Ajax.Updater( var options = Object.extend({ method: 'get' }, this.options.ajaxOptions);
{ success: this.element, Object.extend(options, {
// don't update on failure (this could be an option) parameters: params,
failure: null }, onComplete: this._boundWrapperHandler,
this.url, Object.extend({ onFailure: this._boundFailureHandler
parameters: this.options.callback(form, value), });
onComplete: this.onComplete.bind(this), new Ajax.Request(this.url, options);
onFailure: this.onFailure.bind(this)
}, this.options.ajaxOptions));
} }
// stop the event to avoid a page refresh in Safari if (e) Event.stop(e);
if (arguments.length > 1) {
Event.stop(arguments[0]);
}
return false;
}, },
onLoading: function() { leaveEditMode: function() {
this.saving = true; this.element.removeClassName(this.options.savingClassName);
this.removeForm();
this.leaveHover();
this.element.style.backgroundColor = this._originalBackground;
this.element.show();
if (this.options.externalControl)
this.options.externalControl.show();
this._saving = false;
this._editing = false;
this._oldInnerHTML = null;
this.triggerCallback('onLeaveEditMode');
},
leaveHover: function(e) {
if (this.options.hoverClassName)
this.element.removeClassName(this.options.hoverClassName);
if (this._saving) return;
this.triggerCallback('onLeaveHover');
},
loadExternalText: function() {
this._form.addClassName(this.options.loadingClassName);
this._controls.editor.disabled = true;
var options = Object.extend({ method: 'get' }, this.options.ajaxOptions);
Object.extend(options, {
parameters: 'editorId=' + encodeURIComponent(this.element.id),
onComplete: Prototype.emptyFunction,
onSuccess: function(transport) {
this._form.removeClassName(this.options.loadingClassName);
var text = transport.responseText;
if (this.options.stripLoadedTextTags)
text = text.stripTags();
this._controls.editor.value = text;
this._controls.editor.disabled = false;
this.postProcessEditField();
}.bind(this),
onFailure: this._boundFailureHandler
});
new Ajax.Request(this.options.loadTextURL, options);
},
postProcessEditField: function() {
var fpc = this.options.fieldPostCreation;
if (fpc)
$(this._controls.editor)['focus' == fpc ? 'focus' : 'activate']();
},
prepareOptions: function() {
this.options = Object.clone(Ajax.InPlaceEditor.DefaultOptions);
Object.extend(this.options, Ajax.InPlaceEditor.DefaultCallbacks);
[this._extraDefaultOptions].flatten().compact().each(function(defs) {
Object.extend(this.options, defs);
}.bind(this));
},
prepareSubmission: function() {
this._saving = true;
this.removeForm(); this.removeForm();
this.leaveHover(); this.leaveHover();
this.showSaving(); this.showSaving();
}, },
showSaving: function() { registerListeners: function() {
this.oldInnerHTML = this.element.innerHTML; this._listeners = { };
this.element.innerHTML = this.options.savingText; var listener;
Element.addClassName(this.element, this.options.savingClassName); $H(Ajax.InPlaceEditor.Listeners).each(function(pair) {
this.element.style.backgroundColor = this.originalBackground; listener = this[pair.value].bind(this);
Element.show(this.element); this._listeners[pair.key] = listener;
if (!this.options.externalControlOnly)
this.element.observe(pair.key, listener);
if (this.options.externalControl)
this.options.externalControl.observe(pair.key, listener);
}.bind(this));
}, },
removeForm: function() { removeForm: function() {
if(this.form) { if (!this._form) return;
if (this.form.parentNode) Element.remove(this.form); this._form.remove();
this.form = null; this._form = null;
this._controls = { };
},
showSaving: function() {
this._oldInnerHTML = this.element.innerHTML;
this.element.innerHTML = this.options.savingText;
this.element.addClassName(this.options.savingClassName);
this.element.style.backgroundColor = this._originalBackground;
this.element.show();
},
triggerCallback: function(cbName, arg) {
if ('function' == typeof this.options[cbName]) {
this.options[cbName](this, arg);
} }
}, },
enterHover: function() { unregisterListeners: function() {
if (this.saving) return; $H(this._listeners).each(function(pair) {
this.element.style.backgroundColor = this.options.highlightcolor; if (!this.options.externalControlOnly)
if (this.effect) { this.element.stopObserving(pair.key, pair.value);
this.effect.cancel(); if (this.options.externalControl)
} this.options.externalControl.stopObserving(pair.key, pair.value);
Element.addClassName(this.element, this.options.hoverClassName) }.bind(this));
}, },
leaveHover: function() { wrapUp: function(transport) {
if (this.options.backgroundColor) { this.leaveEditMode();
this.element.style.backgroundColor = this.oldBackground; // Can't use triggerCallback due to backward compatibility: requires
// binding + direct element
this._boundComplete(transport, this.element);
} }
Element.removeClassName(this.element, this.options.hoverClassName)
if (this.saving) return;
this.effect = new Effect.Highlight(this.element, {
startcolor: this.options.highlightcolor,
endcolor: this.options.highlightendcolor,
restorecolor: this.originalBackground
}); });
Object.extend(Ajax.InPlaceEditor.prototype, {
dispose: Ajax.InPlaceEditor.prototype.destroy
});
Ajax.InPlaceCollectionEditor = Class.create(Ajax.InPlaceEditor, {
initialize: function($super, element, url, options) {
this._extraDefaultOptions = Ajax.InPlaceCollectionEditor.DefaultOptions;
$super(element, url, options);
}, },
leaveEditMode: function() {
Element.removeClassName(this.element, this.options.savingClassName); createEditField: function() {
this.removeForm(); var list = document.createElement('select');
this.leaveHover(); list.name = this.options.paramName;
this.element.style.backgroundColor = this.originalBackground; list.size = 1;
Element.show(this.element); this._controls.editor = list;
if (this.options.externalControl) { this._collection = this.options.collection || [];
Element.show(this.options.externalControl); if (this.options.loadCollectionURL)
} this.loadCollection();
this.editing = false; else
this.saving = false; this.checkForExternalText();
this.oldInnerHTML = null; this._form.appendChild(this._controls.editor);
this.onLeaveEditMode();
}, },
onComplete: function(transport) {
this.leaveEditMode(); loadCollection: function() {
this.options.onComplete.bind(this)(transport, this.element); this._form.addClassName(this.options.loadingClassName);
this.showLoadingText(this.options.loadingCollectionText);
var options = Object.extend({ method: 'get' }, this.options.ajaxOptions);
Object.extend(options, {
parameters: 'editorId=' + encodeURIComponent(this.element.id),
onComplete: Prototype.emptyFunction,
onSuccess: function(transport) {
var js = transport.responseText.strip();
if (!/^\[.*\]$/.test(js)) // TODO: improve sanity check
throw 'Server returned an invalid collection representation.';
this._collection = eval(js);
this.checkForExternalText();
}.bind(this),
onFailure: this.onFailure
});
new Ajax.Request(this.options.loadCollectionURL, options);
}, },
onEnterEditMode: function() {},
onLeaveEditMode: function() {}, showLoadingText: function(text) {
dispose: function() { this._controls.editor.disabled = true;
if (this.oldInnerHTML) { var tempOption = this._controls.editor.firstChild;
this.element.innerHTML = this.oldInnerHTML; if (!tempOption) {
} tempOption = document.createElement('option');
this.leaveEditMode(); tempOption.value = '';
Event.stopObserving(this.element, 'click', this.onclickListener); this._controls.editor.appendChild(tempOption);
Event.stopObserving(this.element, 'mouseover', this.mouseoverListener); tempOption.selected = true;
Event.stopObserving(this.element, 'mouseout', this.mouseoutListener);
if (this.options.externalControl) {
Event.stopObserving(this.options.externalControl, 'click', this.onclickListener);
Event.stopObserving(this.options.externalControl, 'mouseover', this.mouseoverListener);
Event.stopObserving(this.options.externalControl, 'mouseout', this.mouseoutListener);
} }
tempOption.update((text || '').stripScripts().stripTags());
},
checkForExternalText: function() {
this._text = this.getText();
if (this.options.loadTextURL)
this.loadExternalText();
else
this.buildOptionList();
},
loadExternalText: function() {
this.showLoadingText(this.options.loadingText);
var options = Object.extend({ method: 'get' }, this.options.ajaxOptions);
Object.extend(options, {
parameters: 'editorId=' + encodeURIComponent(this.element.id),
onComplete: Prototype.emptyFunction,
onSuccess: function(transport) {
this._text = transport.responseText.strip();
this.buildOptionList();
}.bind(this),
onFailure: this.onFailure
});
new Ajax.Request(this.options.loadTextURL, options);
},
buildOptionList: function() {
this._form.removeClassName(this.options.loadingClassName);
this._collection = this._collection.map(function(entry) {
return 2 === entry.length ? entry : [entry, entry].flatten();
});
var marker = ('value' in this.options) ? this.options.value : this._text;
var textFound = this._collection.any(function(entry) {
return entry[0] == marker;
}.bind(this));
this._controls.editor.update('');
var option;
this._collection.each(function(entry, index) {
option = document.createElement('option');
option.value = entry[0];
option.selected = textFound ? entry[0] == marker : 0 == index;
option.appendChild(document.createTextNode(entry[1]));
this._controls.editor.appendChild(option);
}.bind(this));
this._controls.editor.disabled = false;
Field.scrollFreeActivate(this._controls.editor);
} }
});
//**** DEPRECATION LAYER FOR InPlace[Collection]Editor! ****
//**** This only exists for a while, in order to let ****
//**** users adapt to the new API. Read up on the new ****
//**** API and convert your code to it ASAP! ****
Ajax.InPlaceEditor.prototype.initialize.dealWithDeprecatedOptions = function(options) {
if (!options) return;
function fallback(name, expr) {
if (name in options || expr === undefined) return;
options[name] = expr;
};
fallback('cancelControl', (options.cancelLink ? 'link' : (options.cancelButton ? 'button' :
options.cancelLink == options.cancelButton == false ? false : undefined)));
fallback('okControl', (options.okLink ? 'link' : (options.okButton ? 'button' :
options.okLink == options.okButton == false ? false : undefined)));
fallback('highlightColor', options.highlightcolor);
fallback('highlightEndColor', options.highlightendcolor);
}; };
Ajax.InPlaceCollectionEditor = Class.create(); Object.extend(Ajax.InPlaceEditor, {
Object.extend(Ajax.InPlaceCollectionEditor.prototype, Ajax.InPlaceEditor.prototype); DefaultOptions: {
Object.extend(Ajax.InPlaceCollectionEditor.prototype, { ajaxOptions: { },
createEditField: function() { autoRows: 3, // Use when multi-line w/ rows == 1
if (!this.cached_selectTag) { cancelControl: 'link', // 'link'|'button'|false
var selectTag = document.createElement("select"); cancelText: 'cancel',
var collection = this.options.collection || []; clickToEditText: 'Click to edit',
var optionTag; externalControl: null, // id|elt
collection.each(function(e,i) { externalControlOnly: false,
optionTag = document.createElement("option"); fieldPostCreation: 'activate', // 'activate'|'focus'|false
optionTag.value = (e instanceof Array) ? e[0] : e; formClassName: 'inplaceeditor-form',
if((typeof this.options.value == 'undefined') && formId: null, // id|elt
((e instanceof Array) ? this.element.innerHTML == e[1] : e == optionTag.value)) optionTag.selected = true; highlightColor: '#ffff99',
if(this.options.value==optionTag.value) optionTag.selected = true; highlightEndColor: '#ffffff',
optionTag.appendChild(document.createTextNode((e instanceof Array) ? e[1] : e)); hoverClassName: '',
selectTag.appendChild(optionTag); htmlResponse: true,
}.bind(this)); loadingClassName: 'inplaceeditor-loading',
this.cached_selectTag = selectTag; loadingText: 'Loading...',
} okControl: 'button', // 'link'|'button'|false
okText: 'ok',
this.editField = this.cached_selectTag; paramName: 'value',
if(this.options.loadTextURL) this.loadExternalText(); rows: 1, // If 1 and multi-line, uses autoRows
this.form.appendChild(this.editField); savingClassName: 'inplaceeditor-saving',
this.options.callback = function(form, value) { savingText: 'Saving...',
return "value=" + encodeURIComponent(value); size: 0,
stripLoadedTextTags: false,
submitOnBlur: false,
textAfterControls: '',
textBeforeControls: '',
textBetweenControls: ''
},
DefaultCallbacks: {
callback: function(form) {
return Form.serialize(form);
},
onComplete: function(transport, element) {
// For backward compatibility, this one is bound to the IPE, and passes
// the element directly. It was too often customized, so we don't break it.
new Effect.Highlight(element, {
startcolor: this.options.highlightColor, keepBackgroundImage: true });
},
onEnterEditMode: null,
onEnterHover: function(ipe) {
ipe.element.style.backgroundColor = ipe.options.highlightColor;
if (ipe._effect)
ipe._effect.cancel();
},
onFailure: function(transport, ipe) {
alert('Error communication with the server: ' + transport.responseText.stripTags());
},
onFormCustomization: null, // Takes the IPE and its generated form, after editor, before controls.
onLeaveEditMode: null,
onLeaveHover: function(ipe) {
ipe._effect = new Effect.Highlight(ipe.element, {
startcolor: ipe.options.highlightColor, endcolor: ipe.options.highlightEndColor,
restorecolor: ipe._originalBackground, keepBackgroundImage: true
});
} }
},
Listeners: {
click: 'enterEditMode',
keydown: 'checkForEscapeOrReturn',
mouseover: 'enterHover',
mouseout: 'leaveHover'
} }
}); });
Ajax.InPlaceCollectionEditor.DefaultOptions = {
loadingCollectionText: 'Loading options...'
};
// Delayed observer, like Form.Element.Observer, // Delayed observer, like Form.Element.Observer,
// but waits for delay after last key input // but waits for delay after last key input
// Ideal for live-search fields // Ideal for live-search fields
Form.Element.DelayedObserver = Class.create(); Form.Element.DelayedObserver = Class.create({
Form.Element.DelayedObserver.prototype = {
initialize: function(element, delay, callback) { initialize: function(element, delay, callback) {
this.delay = delay || 0.5; this.delay = delay || 0.5;
this.element = $(element); this.element = $(element);
@ -830,4 +960,4 @@ Form.Element.DelayedObserver.prototype = {
this.timer = null; this.timer = null;
this.callback(this.element, $F(this.element)); this.callback(this.element, $F(this.element));
} }
}; });

View file

@ -1,10 +1,10 @@
// Copyright (c) 2005, 2006 Thomas Fuchs (http://script.aculo.us, http://mir.aculo.us) // Copyright (c) 2005-2008 Thomas Fuchs (http://script.aculo.us, http://mir.aculo.us)
// (c) 2005, 2006 Sammi Williams (http://www.oriontransfer.co.nz, sammi@oriontransfer.co.nz) // (c) 2005-2007 Sammi Williams (http://www.oriontransfer.co.nz, sammi@oriontransfer.co.nz)
// //
// script.aculo.us is freely distributable under the terms of an MIT-style license. // script.aculo.us is freely distributable under the terms of an MIT-style license.
// For details, see the script.aculo.us web site: http://script.aculo.us/ // For details, see the script.aculo.us web site: http://script.aculo.us/
if(typeof Effect == 'undefined') if(Object.isUndefined(Effect))
throw("dragdrop.js requires including script.aculo.us' effects.js library"); throw("dragdrop.js requires including script.aculo.us' effects.js library");
var Droppables = { var Droppables = {
@ -26,8 +26,7 @@ var Droppables = {
if(options.containment) { if(options.containment) {
options._containers = []; options._containers = [];
var containment = options.containment; var containment = options.containment;
if((typeof containment == 'object') && if(Object.isArray(containment)) {
(containment.constructor == Array)) {
containment.each( function(c) { options._containers.push($(c)) }); containment.each( function(c) { options._containers.push($(c)) });
} else { } else {
options._containers.push($(containment)); options._containers.push($(containment));
@ -87,21 +86,23 @@ var Droppables = {
show: function(point, element) { show: function(point, element) {
if(!this.drops.length) return; if(!this.drops.length) return;
var affected = []; var drop, affected = [];
if(this.last_active) this.deactivate(this.last_active);
this.drops.each( function(drop) { this.drops.each( function(drop) {
if(Droppables.isAffected(point, element, drop)) if(Droppables.isAffected(point, element, drop))
affected.push(drop); affected.push(drop);
}); });
if(affected.length>0) { if(affected.length>0)
drop = Droppables.findDeepestChild(affected); drop = Droppables.findDeepestChild(affected);
if(this.last_active && this.last_active != drop) this.deactivate(this.last_active);
if (drop) {
Position.within(drop.element, point[0], point[1]); Position.within(drop.element, point[0], point[1]);
if(drop.onHover) if(drop.onHover)
drop.onHover(element, drop.element, Position.overlap(drop.overlap, drop.element)); drop.onHover(element, drop.element, Position.overlap(drop.overlap, drop.element));
Droppables.activate(drop); if (drop != this.last_active) Droppables.activate(drop);
} }
}, },
@ -110,8 +111,10 @@ var Droppables = {
Position.prepare(); Position.prepare();
if (this.isAffected([Event.pointerX(event), Event.pointerY(event)], element, this.last_active)) if (this.isAffected([Event.pointerX(event), Event.pointerY(event)], element, this.last_active))
if (this.last_active.onDrop) if (this.last_active.onDrop) {
this.last_active.onDrop(element, this.last_active.element, event); this.last_active.onDrop(element, this.last_active.element, event);
return true;
}
}, },
reset: function() { reset: function() {
@ -219,10 +222,7 @@ var Draggables = {
/*--------------------------------------------------------------------------*/ /*--------------------------------------------------------------------------*/
var Draggable = Class.create(); var Draggable = Class.create({
Draggable._dragging = {};
Draggable.prototype = {
initialize: function(element) { initialize: function(element) {
var defaults = { var defaults = {
handle: false, handle: false,
@ -233,7 +233,7 @@ Draggable.prototype = {
}); });
}, },
endeffect: function(element) { endeffect: function(element) {
var toOpacity = typeof element._opacity == 'number' ? element._opacity : 1.0; var toOpacity = Object.isNumber(element._opacity) ? element._opacity : 1.0;
new Effect.Opacity(element, {duration:0.2, from:0.7, to:toOpacity, new Effect.Opacity(element, {duration:0.2, from:0.7, to:toOpacity,
queue: {scope:'_draggable', position:'end'}, queue: {scope:'_draggable', position:'end'},
afterFinish: function(){ afterFinish: function(){
@ -243,6 +243,7 @@ Draggable.prototype = {
}, },
zindex: 1000, zindex: 1000,
revert: false, revert: false,
quiet: false,
scroll: false, scroll: false,
scrollSensitivity: 20, scrollSensitivity: 20,
scrollSpeed: 15, scrollSpeed: 15,
@ -250,7 +251,7 @@ Draggable.prototype = {
delay: 0 delay: 0
}; };
if(!arguments[1] || typeof arguments[1].endeffect == 'undefined') if(!arguments[1] || Object.isUndefined(arguments[1].endeffect))
Object.extend(defaults, { Object.extend(defaults, {
starteffect: function(element) { starteffect: function(element) {
element._opacity = Element.getOpacity(element); element._opacity = Element.getOpacity(element);
@ -263,7 +264,7 @@ Draggable.prototype = {
this.element = $(element); this.element = $(element);
if(options.handle && (typeof options.handle == 'string')) if(options.handle && Object.isString(options.handle))
this.handle = this.element.down('.'+options.handle, 0); this.handle = this.element.down('.'+options.handle, 0);
if(!this.handle) this.handle = $(options.handle); if(!this.handle) this.handle = $(options.handle);
@ -276,7 +277,6 @@ Draggable.prototype = {
Element.makePositioned(this.element); // fix IE Element.makePositioned(this.element); // fix IE
this.delta = this.currentDelta();
this.options = options; this.options = options;
this.dragging = false; this.dragging = false;
@ -298,17 +298,17 @@ Draggable.prototype = {
}, },
initDrag: function(event) { initDrag: function(event) {
if(typeof Draggable._dragging[this.element] != 'undefined' && if(!Object.isUndefined(Draggable._dragging[this.element]) &&
Draggable._dragging[this.element]) return; Draggable._dragging[this.element]) return;
if(Event.isLeftClick(event)) { if(Event.isLeftClick(event)) {
// abort on form elements, fixes a Firefox issue // abort on form elements, fixes a Firefox issue
var src = Event.element(event); var src = Event.element(event);
if(src.tagName && ( if((tag_name = src.tagName.toUpperCase()) && (
src.tagName=='INPUT' || tag_name=='INPUT' ||
src.tagName=='SELECT' || tag_name=='SELECT' ||
src.tagName=='OPTION' || tag_name=='OPTION' ||
src.tagName=='BUTTON' || tag_name=='BUTTON' ||
src.tagName=='TEXTAREA')) return; tag_name=='TEXTAREA')) return;
var pointer = [Event.pointerX(event), Event.pointerY(event)]; var pointer = [Event.pointerX(event), Event.pointerY(event)];
var pos = Position.cumulativeOffset(this.element); var pos = Position.cumulativeOffset(this.element);
@ -321,6 +321,8 @@ Draggable.prototype = {
startDrag: function(event) { startDrag: function(event) {
this.dragging = true; this.dragging = true;
if(!this.delta)
this.delta = this.currentDelta();
if(this.options.zindex) { if(this.options.zindex) {
this.originalZ = parseInt(Element.getStyle(this.element,'z-index') || 0); this.originalZ = parseInt(Element.getStyle(this.element,'z-index') || 0);
@ -329,6 +331,8 @@ Draggable.prototype = {
if(this.options.ghosting) { if(this.options.ghosting) {
this._clone = this.element.cloneNode(true); this._clone = this.element.cloneNode(true);
this.element._originallyAbsolute = (this.element.getStyle('position') == 'absolute');
if (!this.element._originallyAbsolute)
Position.absolutize(this.element); Position.absolutize(this.element);
this.element.parentNode.insertBefore(this._clone, this.element); this.element.parentNode.insertBefore(this._clone, this.element);
} }
@ -351,8 +355,12 @@ Draggable.prototype = {
updateDrag: function(event, pointer) { updateDrag: function(event, pointer) {
if(!this.dragging) this.startDrag(event); if(!this.dragging) this.startDrag(event);
if(!this.options.quiet){
Position.prepare(); Position.prepare();
Droppables.show(pointer, this.element); Droppables.show(pointer, this.element);
}
Draggables.notify('onDrag', this, event); Draggables.notify('onDrag', this, event);
this.draw(pointer); this.draw(pointer);
@ -380,7 +388,7 @@ Draggable.prototype = {
} }
// fix AppleWebKit rendering // fix AppleWebKit rendering
if(navigator.appVersion.indexOf('AppleWebKit')>0) window.scrollBy(0,0); if(Prototype.Browser.WebKit) window.scrollBy(0,0);
Event.stop(event); Event.stop(event);
}, },
@ -388,20 +396,34 @@ Draggable.prototype = {
finishDrag: function(event, success) { finishDrag: function(event, success) {
this.dragging = false; this.dragging = false;
if(this.options.quiet){
Position.prepare();
var pointer = [Event.pointerX(event), Event.pointerY(event)];
Droppables.show(pointer, this.element);
}
if(this.options.ghosting) { if(this.options.ghosting) {
if (!this.element._originallyAbsolute)
Position.relativize(this.element); Position.relativize(this.element);
delete this.element._originallyAbsolute;
Element.remove(this._clone); Element.remove(this._clone);
this._clone = null; this._clone = null;
} }
if(success) Droppables.fire(event, this.element); var dropped = false;
if(success) {
dropped = Droppables.fire(event, this.element);
if (!dropped) dropped = false;
}
if(dropped && this.options.onDropped) this.options.onDropped(this.element);
Draggables.notify('onEnd', this, event); Draggables.notify('onEnd', this, event);
var revert = this.options.revert; var revert = this.options.revert;
if(revert && typeof revert == 'function') revert = revert(this.element); if(revert && Object.isFunction(revert)) revert = revert(this.element);
var d = this.currentDelta(); var d = this.currentDelta();
if(revert && this.options.reverteffect) { if(revert && this.options.reverteffect) {
if (dropped == 0 || revert != 'failure')
this.options.reverteffect(this.element, this.options.reverteffect(this.element,
d[1]-this.delta[1], d[0]-this.delta[0]); d[1]-this.delta[1], d[0]-this.delta[0]);
} else { } else {
@ -451,15 +473,15 @@ Draggable.prototype = {
}.bind(this)); }.bind(this));
if(this.options.snap) { if(this.options.snap) {
if(typeof this.options.snap == 'function') { if(Object.isFunction(this.options.snap)) {
p = this.options.snap(p[0],p[1],this); p = this.options.snap(p[0],p[1],this);
} else { } else {
if(this.options.snap instanceof Array) { if(Object.isArray(this.options.snap)) {
p = p.map( function(v, i) { p = p.map( function(v, i) {
return Math.round(v/this.options.snap[i])*this.options.snap[i] }.bind(this)) return (v/this.options.snap[i]).round()*this.options.snap[i] }.bind(this))
} else { } else {
p = p.map( function(v) { p = p.map( function(v) {
return Math.round(v/this.options.snap)*this.options.snap }.bind(this)) return (v/this.options.snap).round()*this.options.snap }.bind(this))
} }
}} }}
@ -543,12 +565,13 @@ Draggable.prototype = {
} }
return { top: T, left: L, width: W, height: H }; return { top: T, left: L, width: W, height: H };
} }
} });
Draggable._dragging = { };
/*--------------------------------------------------------------------------*/ /*--------------------------------------------------------------------------*/
var SortableObserver = Class.create(); var SortableObserver = Class.create({
SortableObserver.prototype = {
initialize: function(element, observer) { initialize: function(element, observer) {
this.element = $(element); this.element = $(element);
this.observer = observer; this.observer = observer;
@ -564,7 +587,7 @@ SortableObserver.prototype = {
if(this.lastValue != Sortable.serialize(this.element)) if(this.lastValue != Sortable.serialize(this.element))
this.observer(this.element) this.observer(this.element)
} }
} });
var Sortable = { var Sortable = {
SERIALIZE_RULE: /^[^_\-](?:[A-Za-z0-9\-\_]*)[_](.*)$/, SERIALIZE_RULE: /^[^_\-](?:[A-Za-z0-9\-\_]*)[_](.*)$/,
@ -572,7 +595,7 @@ var Sortable = {
sortables: { }, sortables: { },
_findRootElement: function(element) { _findRootElement: function(element) {
while (element.tagName != "BODY") { while (element.tagName.toUpperCase() != "BODY") {
if(element.id && Sortable.sortables[element.id]) return element; if(element.id && Sortable.sortables[element.id]) return element;
element = element.parentNode; element = element.parentNode;
} }
@ -612,10 +635,17 @@ var Sortable = {
delay: 0, delay: 0,
hoverclass: null, hoverclass: null,
ghosting: false, ghosting: false,
quiet: false,
scroll: false, scroll: false,
scrollSensitivity: 20, scrollSensitivity: 20,
scrollSpeed: 15, scrollSpeed: 15,
format: this.SERIALIZE_RULE, format: this.SERIALIZE_RULE,
// these take arrays of elements or ids and can be
// used for better initialization performance
elements: false,
handles: false,
onChange: Prototype.emptyFunction, onChange: Prototype.emptyFunction,
onUpdate: Prototype.emptyFunction onUpdate: Prototype.emptyFunction
}, arguments[1] || { }); }, arguments[1] || { });
@ -626,6 +656,7 @@ var Sortable = {
// build options for the draggables // build options for the draggables
var options_for_draggable = { var options_for_draggable = {
revert: true, revert: true,
quiet: options.quiet,
scroll: options.scroll, scroll: options.scroll,
scrollSpeed: options.scrollSpeed, scrollSpeed: options.scrollSpeed,
scrollSensitivity: options.scrollSensitivity, scrollSensitivity: options.scrollSensitivity,
@ -679,10 +710,9 @@ var Sortable = {
options.droppables.push(element); options.droppables.push(element);
} }
(this.findElements(element, options) || []).each( function(e) { (options.elements || this.findElements(element, options) || []).each( function(e,i) {
// handles are per-draggable var handle = options.handles ? $(options.handles[i]) :
var handle = options.handle ? (options.handle ? $(e).select('.' + options.handle)[0] : e);
$(e).down('.'+options.handle,0) : e;
options.draggables.push( options.draggables.push(
new Draggable(e, Object.extend(options_for_draggable, { handle: handle }))); new Draggable(e, Object.extend(options_for_draggable, { handle: handle })));
Droppables.add(e, options_for_droppable); Droppables.add(e, options_for_droppable);

View file

@ -1,4 +1,4 @@
// Copyright (c) 2005, 2006 Thomas Fuchs (http://script.aculo.us, http://mir.aculo.us) // Copyright (c) 2005-2008 Thomas Fuchs (http://script.aculo.us, http://mir.aculo.us)
// Contributors: // Contributors:
// Justin Palmer (http://encytemedia.com/) // Justin Palmer (http://encytemedia.com/)
// Mark Pilgrim (http://diveintomark.org/) // Mark Pilgrim (http://diveintomark.org/)
@ -21,7 +21,7 @@ String.prototype.parseColor = function() {
} }
} }
return (color.length==7 ? color : (arguments[0] || this)); return (color.length==7 ? color : (arguments[0] || this));
} };
/*--------------------------------------------------------------------------*/ /*--------------------------------------------------------------------------*/
@ -30,7 +30,7 @@ Element.collectTextNodes = function(element) {
return (node.nodeType==3 ? node.nodeValue : return (node.nodeType==3 ? node.nodeValue :
(node.hasChildNodes() ? Element.collectTextNodes(node) : '')); (node.hasChildNodes() ? Element.collectTextNodes(node) : ''));
}).flatten().join(''); }).flatten().join('');
} };
Element.collectTextNodesIgnoreClass = function(element, className) { Element.collectTextNodesIgnoreClass = function(element, className) {
return $A($(element).childNodes).collect( function(node) { return $A($(element).childNodes).collect( function(node) {
@ -38,47 +38,18 @@ Element.collectTextNodesIgnoreClass = function(element, className) {
((node.hasChildNodes() && !Element.hasClassName(node,className)) ? ((node.hasChildNodes() && !Element.hasClassName(node,className)) ?
Element.collectTextNodesIgnoreClass(node, className) : '')); Element.collectTextNodesIgnoreClass(node, className) : ''));
}).flatten().join(''); }).flatten().join('');
} };
Element.setContentZoom = function(element, percent) { Element.setContentZoom = function(element, percent) {
element = $(element); element = $(element);
element.setStyle({fontSize: (percent/100) + 'em'}); element.setStyle({fontSize: (percent/100) + 'em'});
if(navigator.appVersion.indexOf('AppleWebKit')>0) window.scrollBy(0,0); if (Prototype.Browser.WebKit) window.scrollBy(0,0);
return element; return element;
} };
Element.getOpacity = function(element){
element = $(element);
var opacity;
if (opacity = element.getStyle('opacity'))
return parseFloat(opacity);
if (opacity = (element.getStyle('filter') || '').match(/alpha\(opacity=(.*)\)/))
if(opacity[1]) return parseFloat(opacity[1]) / 100;
return 1.0;
}
Element.setOpacity = function(element, value){
element= $(element);
if (value == 1){
element.setStyle({ opacity:
(/Gecko/.test(navigator.userAgent) && !/Konqueror|Safari|KHTML/.test(navigator.userAgent)) ?
0.999999 : 1.0 });
if(/MSIE/.test(navigator.userAgent) && !window.opera)
element.setStyle({filter: Element.getStyle(element,'filter').replace(/alpha\([^\)]*\)/gi,'')});
} else {
if(value < 0.00001) value = 0;
element.setStyle({opacity: value});
if(/MSIE/.test(navigator.userAgent) && !window.opera)
element.setStyle(
{ filter: element.getStyle('filter').replace(/alpha\([^\)]*\)/gi,'') +
'alpha(opacity='+value*100+')' });
}
return element;
}
Element.getInlineOpacity = function(element){ Element.getInlineOpacity = function(element){
return $(element).style.opacity || ''; return $(element).style.opacity || '';
} };
Element.forceRerendering = function(element) { Element.forceRerendering = function(element) {
try { try {
@ -91,31 +62,63 @@ Element.forceRerendering = function(element) {
/*--------------------------------------------------------------------------*/ /*--------------------------------------------------------------------------*/
Array.prototype.call = function() {
var args = arguments;
this.each(function(f){ f.apply(this, args) });
}
/*--------------------------------------------------------------------------*/
var Effect = { var Effect = {
_elementDoesNotExistError: { _elementDoesNotExistError: {
name: 'ElementDoesNotExistError', name: 'ElementDoesNotExistError',
message: 'The specified DOM element does not exist, but is required for this effect to operate' message: 'The specified DOM element does not exist, but is required for this effect to operate'
}, },
Transitions: {
linear: Prototype.K,
sinoidal: function(pos) {
return (-Math.cos(pos*Math.PI)/2) + 0.5;
},
reverse: function(pos) {
return 1-pos;
},
flicker: function(pos) {
var pos = ((-Math.cos(pos*Math.PI)/4) + 0.75) + Math.random()/4;
return pos > 1 ? 1 : pos;
},
wobble: function(pos) {
return (-Math.cos(pos*Math.PI*(9*pos))/2) + 0.5;
},
pulse: function(pos, pulses) {
pulses = pulses || 5;
return (
((pos % (1/pulses)) * pulses).round() == 0 ?
((pos * pulses * 2) - (pos * pulses * 2).floor()) :
1 - ((pos * pulses * 2) - (pos * pulses * 2).floor())
);
},
spring: function(pos) {
return 1 - (Math.cos(pos * 4.5 * Math.PI) * Math.exp(-pos * 6));
},
none: function(pos) {
return 0;
},
full: function(pos) {
return 1;
}
},
DefaultOptions: {
duration: 1.0, // seconds
fps: 100, // 100= assume 66fps max.
sync: false, // true for combining
from: 0.0,
to: 1.0,
delay: 0.0,
queue: 'parallel'
},
tagifyText: function(element) { tagifyText: function(element) {
if(typeof Builder == 'undefined')
throw("Effect.tagifyText requires including script.aculo.us' builder.js library");
var tagifyStyle = 'position:relative'; var tagifyStyle = 'position:relative';
if(/MSIE/.test(navigator.userAgent) && !window.opera) tagifyStyle += ';zoom:1'; if (Prototype.Browser.IE) tagifyStyle += ';zoom:1';
element = $(element); element = $(element);
$A(element.childNodes).each( function(child) { $A(element.childNodes).each( function(child) {
if (child.nodeType==3) { if (child.nodeType==3) {
child.nodeValue.toArray().each( function(character) { child.nodeValue.toArray().each( function(character) {
element.insertBefore( element.insertBefore(
Builder.node('span',{style: tagifyStyle}, new Element('span', {style: tagifyStyle}).update(
character == ' ' ? String.fromCharCode(160) : character), character == ' ' ? String.fromCharCode(160) : character),
child); child);
}); });
@ -126,7 +129,7 @@ var Effect = {
multiple: function(element, effect) { multiple: function(element, effect) {
var elements; var elements;
if (((typeof element == 'object') || if (((typeof element == 'object') ||
(typeof element == 'function')) && Object.isFunction(element)) &&
(element.length)) (element.length))
elements = element; elements = element;
else else
@ -158,44 +161,11 @@ var Effect = {
} }
}; };
var Effect2 = Effect; // deprecated Effect.DefaultOptions.transition = Effect.Transitions.sinoidal;
/* ------------- transitions ------------- */
Effect.Transitions = {
linear: Prototype.K,
sinoidal: function(pos) {
return (-Math.cos(pos*Math.PI)/2) + 0.5;
},
reverse: function(pos) {
return 1-pos;
},
flicker: function(pos) {
return ((-Math.cos(pos*Math.PI)/4) + 0.75) + Math.random()/4;
},
wobble: function(pos) {
return (-Math.cos(pos*Math.PI*(9*pos))/2) + 0.5;
},
pulse: function(pos, pulses) {
pulses = pulses || 5;
return (
Math.round((pos % (1/pulses)) * pulses) == 0 ?
((pos * pulses * 2) - Math.floor(pos * pulses * 2)) :
1 - ((pos * pulses * 2) - Math.floor(pos * pulses * 2))
);
},
none: function(pos) {
return 0;
},
full: function(pos) {
return 1;
}
};
/* ------------- core effects ------------- */ /* ------------- core effects ------------- */
Effect.ScopedQueue = Class.create(); Effect.ScopedQueue = Class.create(Enumerable, {
Object.extend(Object.extend(Effect.ScopedQueue.prototype, Enumerable), {
initialize: function() { initialize: function() {
this.effects = []; this.effects = [];
this.interval = null; this.interval = null;
@ -206,7 +176,7 @@ Object.extend(Object.extend(Effect.ScopedQueue.prototype, Enumerable), {
add: function(effect) { add: function(effect) {
var timestamp = new Date().getTime(); var timestamp = new Date().getTime();
var position = (typeof effect.options.queue == 'string') ? var position = Object.isString(effect.options.queue) ?
effect.options.queue : effect.options.queue.position; effect.options.queue : effect.options.queue.position;
switch(position) { switch(position) {
@ -233,7 +203,7 @@ Object.extend(Object.extend(Effect.ScopedQueue.prototype, Enumerable), {
this.effects.push(effect); this.effects.push(effect);
if (!this.interval) if (!this.interval)
this.interval = setInterval(this.loop.bind(this), 40); this.interval = setInterval(this.loop.bind(this), 15);
}, },
remove: function(effect) { remove: function(effect) {
this.effects = this.effects.reject(function(e) { return e==effect }); this.effects = this.effects.reject(function(e) { return e==effect });
@ -244,46 +214,57 @@ Object.extend(Object.extend(Effect.ScopedQueue.prototype, Enumerable), {
}, },
loop: function() { loop: function() {
var timePos = new Date().getTime(); var timePos = new Date().getTime();
this.effects.invoke('loop', timePos); for(var i=0, len=this.effects.length;i<len;i++)
this.effects[i] && this.effects[i].loop(timePos);
} }
}); });
Effect.Queues = { Effect.Queues = {
instances: $H(), instances: $H(),
get: function(queueName) { get: function(queueName) {
if(typeof queueName != 'string') return queueName; if (!Object.isString(queueName)) return queueName;
if(!this.instances[queueName]) return this.instances.get(queueName) ||
this.instances[queueName] = new Effect.ScopedQueue(); this.instances.set(queueName, new Effect.ScopedQueue());
return this.instances[queueName];
}
} }
};
Effect.Queue = Effect.Queues.get('global'); Effect.Queue = Effect.Queues.get('global');
Effect.DefaultOptions = { Effect.Base = Class.create({
transition: Effect.Transitions.sinoidal,
duration: 1.0, // seconds
fps: 25.0, // max. 25fps due to Effect.Queue implementation
sync: false, // true for combining
from: 0.0,
to: 1.0,
delay: 0.0,
queue: 'parallel'
}
Effect.Base = function() {};
Effect.Base.prototype = {
position: null, position: null,
start: function(options) { start: function(options) {
function codeForEvent(options,eventName){
return (
(options[eventName+'Internal'] ? 'this.options.'+eventName+'Internal(this);' : '') +
(options[eventName] ? 'this.options.'+eventName+'(this);' : '')
);
}
if (options && options.transition === false) options.transition = Effect.Transitions.linear;
this.options = Object.extend(Object.extend({ },Effect.DefaultOptions), options || { }); this.options = Object.extend(Object.extend({ },Effect.DefaultOptions), options || { });
this.currentFrame = 0; this.currentFrame = 0;
this.state = 'idle'; this.state = 'idle';
this.startOn = this.options.delay*1000; this.startOn = this.options.delay*1000;
this.finishOn = this.startOn+(this.options.duration*1000); this.finishOn = this.startOn+(this.options.duration*1000);
this.fromToDelta = this.options.to-this.options.from;
this.totalTime = this.finishOn-this.startOn;
this.totalFrames = this.options.fps*this.options.duration;
eval('this.render = function(pos){ '+
'if (this.state=="idle"){this.state="running";'+
codeForEvent(this.options,'beforeSetup')+
(this.setup ? 'this.setup();':'')+
codeForEvent(this.options,'afterSetup')+
'};if (this.state=="running"){'+
'pos=this.options.transition(pos)*'+this.fromToDelta+'+'+this.options.from+';'+
'this.position=pos;'+
codeForEvent(this.options,'beforeUpdate')+
(this.update ? 'this.update(pos);':'')+
codeForEvent(this.options,'afterUpdate')+
'}}');
this.event('beforeStart'); this.event('beforeStart');
if (!this.options.sync) if (!this.options.sync)
Effect.Queues.get(typeof this.options.queue == 'string' ? Effect.Queues.get(Object.isString(this.options.queue) ?
'global' : this.options.queue.scope).add(this); 'global' : this.options.queue.scope).add(this);
}, },
loop: function(timePos) { loop: function(timePos) {
@ -296,34 +277,17 @@ Effect.Base.prototype = {
this.event('afterFinish'); this.event('afterFinish');
return; return;
} }
var pos = (timePos - this.startOn) / (this.finishOn - this.startOn); var pos = (timePos - this.startOn) / this.totalTime,
var frame = Math.round(pos * this.options.fps * this.options.duration); frame = (pos * this.totalFrames).round();
if (frame > this.currentFrame) { if (frame > this.currentFrame) {
this.render(pos); this.render(pos);
this.currentFrame = frame; this.currentFrame = frame;
} }
} }
}, },
render: function(pos) {
if(this.state == 'idle') {
this.state = 'running';
this.event('beforeSetup');
if(this.setup) this.setup();
this.event('afterSetup');
}
if(this.state == 'running') {
if(this.options.transition) pos = this.options.transition(pos);
pos *= (this.options.to-this.options.from);
pos += this.options.from;
this.position = pos;
this.event('beforeUpdate');
if(this.update) this.update(pos);
this.event('afterUpdate');
}
},
cancel: function() { cancel: function() {
if (!this.options.sync) if (!this.options.sync)
Effect.Queues.get(typeof this.options.queue == 'string' ? Effect.Queues.get(Object.isString(this.options.queue) ?
'global' : this.options.queue.scope).remove(this); 'global' : this.options.queue.scope).remove(this);
this.state = 'finished'; this.state = 'finished';
}, },
@ -332,12 +296,14 @@ Effect.Base.prototype = {
if (this.options[eventName]) this.options[eventName](this); if (this.options[eventName]) this.options[eventName](this);
}, },
inspect: function() { inspect: function() {
return '#<Effect:' + $H(this).inspect() + ',options:' + $H(this.options).inspect() + '>'; var data = $H();
} for(property in this)
if (!Object.isFunction(this[property])) data.set(property, this[property]);
return '#<Effect:' + data.inspect() + ',options:' + $H(this.options).inspect() + '>';
} }
});
Effect.Parallel = Class.create(); Effect.Parallel = Class.create(Effect.Base, {
Object.extend(Object.extend(Effect.Parallel.prototype, Effect.Base.prototype), {
initialize: function(effects) { initialize: function(effects) {
this.effects = effects || []; this.effects = effects || [];
this.start(arguments[1]); this.start(arguments[1]);
@ -356,24 +322,34 @@ Object.extend(Object.extend(Effect.Parallel.prototype, Effect.Base.prototype), {
} }
}); });
Effect.Event = Class.create(); Effect.Tween = Class.create(Effect.Base, {
Object.extend(Object.extend(Effect.Event.prototype, Effect.Base.prototype), { initialize: function(object, from, to) {
object = Object.isString(object) ? $(object) : object;
var args = $A(arguments), method = args.last(),
options = args.length == 5 ? args[3] : null;
this.method = Object.isFunction(method) ? method.bind(object) :
Object.isFunction(object[method]) ? object[method].bind(object) :
function(value) { object[method] = value };
this.start(Object.extend({ from: from, to: to }, options || { }));
},
update: function(position) {
this.method(position);
}
});
Effect.Event = Class.create(Effect.Base, {
initialize: function() { initialize: function() {
var options = Object.extend({ this.start(Object.extend({ duration: 0 }, arguments[0] || { }));
duration: 0
}, arguments[0] || {});
this.start(options);
}, },
update: Prototype.emptyFunction update: Prototype.emptyFunction
}); });
Effect.Opacity = Class.create(); Effect.Opacity = Class.create(Effect.Base, {
Object.extend(Object.extend(Effect.Opacity.prototype, Effect.Base.prototype), {
initialize: function(element) { initialize: function(element) {
this.element = $(element); this.element = $(element);
if (!this.element) throw(Effect._elementDoesNotExistError); if (!this.element) throw(Effect._elementDoesNotExistError);
// make this work on IE on elements without 'layout' // make this work on IE on elements without 'layout'
if(/MSIE/.test(navigator.userAgent) && !window.opera && (!this.element.currentStyle.hasLayout)) if (Prototype.Browser.IE && (!this.element.currentStyle.hasLayout))
this.element.setStyle({zoom: 1}); this.element.setStyle({zoom: 1});
var options = Object.extend({ var options = Object.extend({
from: this.element.getOpacity() || 0.0, from: this.element.getOpacity() || 0.0,
@ -386,8 +362,7 @@ Object.extend(Object.extend(Effect.Opacity.prototype, Effect.Base.prototype), {
} }
}); });
Effect.Move = Class.create(); Effect.Move = Class.create(Effect.Base, {
Object.extend(Object.extend(Effect.Move.prototype, Effect.Base.prototype), {
initialize: function(element) { initialize: function(element) {
this.element = $(element); this.element = $(element);
if (!this.element) throw(Effect._elementDoesNotExistError); if (!this.element) throw(Effect._elementDoesNotExistError);
@ -399,23 +374,18 @@ Object.extend(Object.extend(Effect.Move.prototype, Effect.Base.prototype), {
this.start(options); this.start(options);
}, },
setup: function() { setup: function() {
// Bug in Opera: Opera returns the "real" position of a static element or
// relative element that does not have top/left explicitly set.
// ==> Always set top and left for position relative elements in your stylesheets
// (to 0 if you do not need them)
this.element.makePositioned(); this.element.makePositioned();
this.originalLeft = parseFloat(this.element.getStyle('left') || '0'); this.originalLeft = parseFloat(this.element.getStyle('left') || '0');
this.originalTop = parseFloat(this.element.getStyle('top') || '0'); this.originalTop = parseFloat(this.element.getStyle('top') || '0');
if (this.options.mode == 'absolute') { if (this.options.mode == 'absolute') {
// absolute movement, so we need to calc deltaX and deltaY
this.options.x = this.options.x - this.originalLeft; this.options.x = this.options.x - this.originalLeft;
this.options.y = this.options.y - this.originalTop; this.options.y = this.options.y - this.originalTop;
} }
}, },
update: function(position) { update: function(position) {
this.element.setStyle({ this.element.setStyle({
left: Math.round(this.options.x * position + this.originalLeft) + 'px', left: (this.options.x * position + this.originalLeft).round() + 'px',
top: Math.round(this.options.y * position + this.originalTop) + 'px' top: (this.options.y * position + this.originalTop).round() + 'px'
}); });
} }
}); });
@ -426,8 +396,7 @@ Effect.MoveBy = function(element, toTop, toLeft) {
Object.extend({ x: toLeft, y: toTop }, arguments[3] || { })); Object.extend({ x: toLeft, y: toTop }, arguments[3] || { }));
}; };
Effect.Scale = Class.create(); Effect.Scale = Class.create(Effect.Base, {
Object.extend(Object.extend(Effect.Scale.prototype, Effect.Base.prototype), {
initialize: function(element, percent) { initialize: function(element, percent) {
this.element = $(element); this.element = $(element);
if (!this.element) throw(Effect._elementDoesNotExistError); if (!this.element) throw(Effect._elementDoesNotExistError);
@ -484,8 +453,8 @@ Object.extend(Object.extend(Effect.Scale.prototype, Effect.Base.prototype), {
}, },
setDimensions: function(height, width) { setDimensions: function(height, width) {
var d = { }; var d = { };
if(this.options.scaleX) d.width = Math.round(width) + 'px'; if (this.options.scaleX) d.width = width.round() + 'px';
if(this.options.scaleY) d.height = Math.round(height) + 'px'; if (this.options.scaleY) d.height = height.round() + 'px';
if (this.options.scaleFromCenter) { if (this.options.scaleFromCenter) {
var topd = (height - this.dims[0])/2; var topd = (height - this.dims[0])/2;
var leftd = (width - this.dims[1])/2; var leftd = (width - this.dims[1])/2;
@ -501,8 +470,7 @@ Object.extend(Object.extend(Effect.Scale.prototype, Effect.Base.prototype), {
} }
}); });
Effect.Highlight = Class.create(); Effect.Highlight = Class.create(Effect.Base, {
Object.extend(Object.extend(Effect.Highlight.prototype, Effect.Base.prototype), {
initialize: function(element) { initialize: function(element) {
this.element = $(element); this.element = $(element);
if (!this.element) throw(Effect._elementDoesNotExistError); if (!this.element) throw(Effect._elementDoesNotExistError);
@ -513,9 +481,11 @@ Object.extend(Object.extend(Effect.Highlight.prototype, Effect.Base.prototype),
// Prevent executing on elements not in the layout flow // Prevent executing on elements not in the layout flow
if (this.element.getStyle('display')=='none') { this.cancel(); return; } if (this.element.getStyle('display')=='none') { this.cancel(); return; }
// Disable background image during the effect // Disable background image during the effect
this.oldStyle = { this.oldStyle = { };
backgroundImage: this.element.getStyle('background-image') }; if (!this.options.keepBackgroundImage) {
this.oldStyle.backgroundImage = this.element.getStyle('background-image');
this.element.setStyle({backgroundImage: 'none'}); this.element.setStyle({backgroundImage: 'none'});
}
if (!this.options.endcolor) if (!this.options.endcolor)
this.options.endcolor = this.element.getStyle('background-color').parseColor('#ffffff'); this.options.endcolor = this.element.getStyle('background-color').parseColor('#ffffff');
if (!this.options.restorecolor) if (!this.options.restorecolor)
@ -526,7 +496,7 @@ Object.extend(Object.extend(Effect.Highlight.prototype, Effect.Base.prototype),
}, },
update: function(position) { update: function(position) {
this.element.setStyle({backgroundColor: $R(0,2).inject('#',function(m,v,i){ this.element.setStyle({backgroundColor: $R(0,2).inject('#',function(m,v,i){
return m+(Math.round(this._base[i]+(this._delta[i]*position)).toColorPart()); }.bind(this)) }); return m+((this._base[i]+(this._delta[i]*position)).round().toColorPart()); }.bind(this)) });
}, },
finish: function() { finish: function() {
this.element.setStyle(Object.extend(this.oldStyle, { this.element.setStyle(Object.extend(this.oldStyle, {
@ -535,30 +505,21 @@ Object.extend(Object.extend(Effect.Highlight.prototype, Effect.Base.prototype),
} }
}); });
Effect.ScrollTo = Class.create(); Effect.ScrollTo = function(element) {
Object.extend(Object.extend(Effect.ScrollTo.prototype, Effect.Base.prototype), { var options = arguments[1] || { },
initialize: function(element) { scrollOffsets = document.viewport.getScrollOffsets(),
this.element = $(element); elementOffsets = $(element).cumulativeOffset(),
this.start(arguments[1] || {}); max = (window.height || document.body.scrollHeight) - document.viewport.getHeight();
},
setup: function() { if (options.offset) elementOffsets[1] += options.offset;
Position.prepare();
var offsets = Position.cumulativeOffset(this.element); return new Effect.Tween(null,
if(this.options.offset) offsets[1] += this.options.offset; scrollOffsets.top,
var max = window.innerHeight ? elementOffsets[1] > max ? max : elementOffsets[1],
window.height - window.innerHeight : options,
document.body.scrollHeight - function(p){ scrollTo(scrollOffsets.left, p.round()) }
(document.documentElement.clientHeight ? );
document.documentElement.clientHeight : document.body.clientHeight); };
this.scrollStart = Position.deltaY;
this.delta = (offsets[1] > max ? max : offsets[1]) - this.scrollStart;
},
update: function(position) {
Position.prepare();
window.scrollTo(Position.deltaX,
this.scrollStart + (position*this.delta));
}
});
/* ------------- combination effects ------------- */ /* ------------- combination effects ------------- */
@ -571,9 +532,10 @@ Effect.Fade = function(element) {
afterFinishInternal: function(effect) { afterFinishInternal: function(effect) {
if (effect.options.to!=0) return; if (effect.options.to!=0) return;
effect.element.hide().setStyle({opacity: oldOpacity}); effect.element.hide().setStyle({opacity: oldOpacity});
}}, arguments[1] || {});
return new Effect.Opacity(element,options);
} }
}, arguments[1] || { });
return new Effect.Opacity(element,options);
};
Effect.Appear = function(element) { Effect.Appear = function(element) {
element = $(element); element = $(element);
@ -588,7 +550,7 @@ Effect.Appear = function(element) {
effect.element.setOpacity(effect.options.from).show(); effect.element.setOpacity(effect.options.from).show();
}}, arguments[1] || { }); }}, arguments[1] || { });
return new Effect.Opacity(element,options); return new Effect.Opacity(element,options);
} };
Effect.Puff = function(element) { Effect.Puff = function(element) {
element = $(element); element = $(element);
@ -612,7 +574,7 @@ Effect.Puff = function(element) {
effect.effects[0].element.hide().setStyle(oldStyle); } effect.effects[0].element.hide().setStyle(oldStyle); }
}, arguments[1] || { }) }, arguments[1] || { })
); );
} };
Effect.BlindUp = function(element) { Effect.BlindUp = function(element) {
element = $(element); element = $(element);
@ -626,7 +588,7 @@ Effect.BlindUp = function(element) {
} }
}, arguments[1] || { }) }, arguments[1] || { })
); );
} };
Effect.BlindDown = function(element) { Effect.BlindDown = function(element) {
element = $(element); element = $(element);
@ -644,7 +606,7 @@ Effect.BlindDown = function(element) {
effect.element.undoClipping(); effect.element.undoClipping();
} }
}, arguments[1] || { })); }, arguments[1] || { }));
} };
Effect.SwitchOff = function(element) { Effect.SwitchOff = function(element) {
element = $(element); element = $(element);
@ -666,7 +628,7 @@ Effect.SwitchOff = function(element) {
}) })
} }
}, arguments[1] || { })); }, arguments[1] || { }));
} };
Effect.DropOut = function(element) { Effect.DropOut = function(element) {
element = $(element); element = $(element);
@ -686,28 +648,34 @@ Effect.DropOut = function(element) {
effect.effects[0].element.hide().undoPositioned().setStyle(oldStyle); effect.effects[0].element.hide().undoPositioned().setStyle(oldStyle);
} }
}, arguments[1] || { })); }, arguments[1] || { }));
} };
Effect.Shake = function(element) { Effect.Shake = function(element) {
element = $(element); element = $(element);
var options = Object.extend({
distance: 20,
duration: 0.5
}, arguments[1] || {});
var distance = parseFloat(options.distance);
var split = parseFloat(options.duration) / 10.0;
var oldStyle = { var oldStyle = {
top: element.getStyle('top'), top: element.getStyle('top'),
left: element.getStyle('left') }; left: element.getStyle('left') };
return new Effect.Move(element, return new Effect.Move(element,
{ x: 20, y: 0, duration: 0.05, afterFinishInternal: function(effect) { { x: distance, y: 0, duration: split, afterFinishInternal: function(effect) {
new Effect.Move(effect.element, new Effect.Move(effect.element,
{ x: -40, y: 0, duration: 0.1, afterFinishInternal: function(effect) { { x: -distance*2, y: 0, duration: split*2, afterFinishInternal: function(effect) {
new Effect.Move(effect.element, new Effect.Move(effect.element,
{ x: 40, y: 0, duration: 0.1, afterFinishInternal: function(effect) { { x: distance*2, y: 0, duration: split*2, afterFinishInternal: function(effect) {
new Effect.Move(effect.element, new Effect.Move(effect.element,
{ x: -40, y: 0, duration: 0.1, afterFinishInternal: function(effect) { { x: -distance*2, y: 0, duration: split*2, afterFinishInternal: function(effect) {
new Effect.Move(effect.element, new Effect.Move(effect.element,
{ x: 40, y: 0, duration: 0.1, afterFinishInternal: function(effect) { { x: distance*2, y: 0, duration: split*2, afterFinishInternal: function(effect) {
new Effect.Move(effect.element, new Effect.Move(effect.element,
{ x: -20, y: 0, duration: 0.05, afterFinishInternal: function(effect) { { x: -distance, y: 0, duration: split, afterFinishInternal: function(effect) {
effect.element.undoPositioned().setStyle(oldStyle); effect.element.undoPositioned().setStyle(oldStyle);
}}) }}) }}) }}) }}) }}); }}) }}) }}) }}) }}) }});
} };
Effect.SlideDown = function(element) { Effect.SlideDown = function(element) {
element = $(element).cleanWhitespace(); element = $(element).cleanWhitespace();
@ -735,18 +703,20 @@ Effect.SlideDown = function(element) {
effect.element.down().undoPositioned().setStyle({bottom: oldInnerBottom}); } effect.element.down().undoPositioned().setStyle({bottom: oldInnerBottom}); }
}, arguments[1] || { }) }, arguments[1] || { })
); );
} };
Effect.SlideUp = function(element) { Effect.SlideUp = function(element) {
element = $(element).cleanWhitespace(); element = $(element).cleanWhitespace();
var oldInnerBottom = element.down().getStyle('bottom'); var oldInnerBottom = element.down().getStyle('bottom');
var elementDimensions = element.getDimensions();
return new Effect.Scale(element, window.opera ? 0 : 1, return new Effect.Scale(element, window.opera ? 0 : 1,
Object.extend({ scaleContent: false, Object.extend({ scaleContent: false,
scaleX: false, scaleX: false,
scaleMode: 'box', scaleMode: 'box',
scaleFrom: 100, scaleFrom: 100,
scaleMode: {originalHeight: elementDimensions.height, originalWidth: elementDimensions.width},
restoreAfterFinish: true, restoreAfterFinish: true,
beforeStartInternal: function(effect) { afterSetup: function(effect) {
effect.element.makePositioned(); effect.element.makePositioned();
effect.element.down().makePositioned(); effect.element.down().makePositioned();
if (window.opera) effect.element.setStyle({top: ''}); if (window.opera) effect.element.setStyle({top: ''});
@ -757,12 +727,12 @@ Effect.SlideUp = function(element) {
(effect.dims[0] - effect.element.clientHeight) + 'px' }); (effect.dims[0] - effect.element.clientHeight) + 'px' });
}, },
afterFinishInternal: function(effect) { afterFinishInternal: function(effect) {
effect.element.hide().undoClipping().undoPositioned().setStyle({bottom: oldInnerBottom}); effect.element.hide().undoClipping().undoPositioned();
effect.element.down().undoPositioned(); effect.element.down().undoPositioned().setStyle({bottom: oldInnerBottom});
} }
}, arguments[1] || { }) }, arguments[1] || { })
); );
} };
// Bug in opera makes the TD containing this element expand for a instance after finish // Bug in opera makes the TD containing this element expand for a instance after finish
Effect.Squish = function(element) { Effect.Squish = function(element) {
@ -775,7 +745,7 @@ Effect.Squish = function(element) {
effect.element.hide().undoClipping(); effect.element.hide().undoClipping();
} }
}); });
} };
Effect.Grow = function(element) { Effect.Grow = function(element) {
element = $(element); element = $(element);
@ -849,7 +819,7 @@ Effect.Grow = function(element) {
) )
} }
}); });
} };
Effect.Shrink = function(element) { Effect.Shrink = function(element) {
element = $(element); element = $(element);
@ -903,7 +873,7 @@ Effect.Shrink = function(element) {
effect.effects[0].element.hide().undoClipping().undoPositioned().setStyle(oldStyle); } effect.effects[0].element.hide().undoClipping().undoPositioned().setStyle(oldStyle); }
}, options) }, options)
); );
} };
Effect.Pulsate = function(element) { Effect.Pulsate = function(element) {
element = $(element); element = $(element);
@ -916,7 +886,7 @@ Effect.Pulsate = function(element) {
Object.extend(Object.extend({ duration: 2.0, from: 0, Object.extend(Object.extend({ duration: 2.0, from: 0,
afterFinishInternal: function(effect) { effect.element.setStyle({opacity: oldOpacity}); } afterFinishInternal: function(effect) { effect.element.setStyle({opacity: oldOpacity}); }
}, options), {transition: reverser})); }, options), {transition: reverser}));
} };
Effect.Fold = function(element) { Effect.Fold = function(element) {
element = $(element); element = $(element);
@ -939,16 +909,37 @@ Effect.Fold = function(element) {
}}, arguments[1] || { })); }}, arguments[1] || { }));
}; };
Effect.Morph = Class.create(); Effect.Morph = Class.create(Effect.Base, {
Object.extend(Object.extend(Effect.Morph.prototype, Effect.Base.prototype), {
initialize: function(element) { initialize: function(element) {
this.element = $(element); this.element = $(element);
if (!this.element) throw(Effect._elementDoesNotExistError); if (!this.element) throw(Effect._elementDoesNotExistError);
var options = Object.extend({ var options = Object.extend({
style: '' style: { }
}, arguments[1] || { }); }, arguments[1] || { });
if (!Object.isString(options.style)) this.style = $H(options.style);
else {
if (options.style.include(':'))
this.style = options.style.parseStyle();
else {
this.element.addClassName(options.style);
this.style = $H(this.element.getStyles());
this.element.removeClassName(options.style);
var css = this.element.getStyles();
this.style = this.style.reject(function(style) {
return style.value == css[style.key];
});
options.afterFinishInternal = function(effect) {
effect.element.addClassName(effect.options.style);
effect.transforms.each(function(transform) {
effect.element.style[transform.style] = '';
});
}
}
}
this.start(options); this.start(options);
}, },
setup: function(){ setup: function(){
function parseColor(color){ function parseColor(color){
if (!color || ['rgba(0, 0, 0, 0)','transparent'].include(color)) color = '#ffffff'; if (!color || ['rgba(0, 0, 0, 0)','transparent'].include(color)) color = '#ffffff';
@ -957,16 +948,29 @@ Object.extend(Object.extend(Effect.Morph.prototype, Effect.Base.prototype), {
return parseInt( color.slice(i*2+1,i*2+3), 16 ) return parseInt( color.slice(i*2+1,i*2+3), 16 )
}); });
} }
this.transforms = this.options.style.parseStyle().map(function(property){ this.transforms = this.style.map(function(pair){
var originalValue = this.element.getStyle(property[0]); var property = pair[0], value = pair[1], unit = null;
return $H({
style: property[0], if (value.parseColor('#zzzzzz') != '#zzzzzz') {
originalValue: property[1].unit=='color' ? value = value.parseColor();
parseColor(originalValue) : parseFloat(originalValue || 0), unit = 'color';
targetValue: property[1].unit=='color' ? } else if (property == 'opacity') {
parseColor(property[1].value) : property[1].value, value = parseFloat(value);
unit: property[1].unit if (Prototype.Browser.IE && (!this.element.currentStyle.hasLayout))
}); this.element.setStyle({zoom: 1});
} else if (Element.CSS_LENGTH.test(value)) {
var components = value.match(/^([\+\-]?[0-9\.]+)(.*)$/);
value = parseFloat(components[1]);
unit = (components.length == 3) ? components[2] : null;
}
var originalValue = this.element.getStyle(property);
return {
style: property.camelize(),
originalValue: unit=='color' ? parseColor(originalValue) : parseFloat(originalValue || 0),
targetValue: unit=='color' ? parseColor(value) : value,
unit: unit
};
}.bind(this)).reject(function(transform){ }.bind(this)).reject(function(transform){
return ( return (
(transform.originalValue == transform.targetValue) || (transform.originalValue == transform.targetValue) ||
@ -978,22 +982,24 @@ Object.extend(Object.extend(Effect.Morph.prototype, Effect.Base.prototype), {
}); });
}, },
update: function(position) { update: function(position) {
var style = $H(), value = null; var style = { }, transform, i = this.transforms.length;
this.transforms.each(function(transform){ while(i--)
value = transform.unit=='color' ? style[(transform = this.transforms[i]).style] =
$R(0,2).inject('#',function(m,v,i){ transform.unit=='color' ? '#'+
return m+(Math.round(transform.originalValue[i]+ (Math.round(transform.originalValue[0]+
(transform.targetValue[i] - transform.originalValue[i])*position)).toColorPart() }) : (transform.targetValue[0]-transform.originalValue[0])*position)).toColorPart() +
transform.originalValue + Math.round( (Math.round(transform.originalValue[1]+
((transform.targetValue - transform.originalValue) * position) * 1000)/1000 + transform.unit; (transform.targetValue[1]-transform.originalValue[1])*position)).toColorPart() +
style[transform.style] = value; (Math.round(transform.originalValue[2]+
}); (transform.targetValue[2]-transform.originalValue[2])*position)).toColorPart() :
this.element.setStyle(style); (transform.originalValue +
(transform.targetValue - transform.originalValue) * position).toFixed(3) +
(transform.unit === null ? '' : transform.unit);
this.element.setStyle(style, true);
} }
}); });
Effect.Transform = Class.create(); Effect.Transform = Class.create({
Object.extend(Effect.Transform.prototype, {
initialize: function(tracks){ initialize: function(tracks){
this.tracks = []; this.tracks = [];
this.options = arguments[1] || { }; this.options = arguments[1] || { };
@ -1001,9 +1007,10 @@ Object.extend(Effect.Transform.prototype, {
}, },
addTracks: function(tracks){ addTracks: function(tracks){
tracks.each(function(track){ tracks.each(function(track){
var data = $H(track).values().first(); track = $H(track);
var data = track.values().first();
this.tracks.push($H({ this.tracks.push($H({
ids: $H(track).keys().first(), ids: track.keys().first(),
effect: Effect.Morph, effect: Effect.Morph,
options: { style: data } options: { style: data }
})); }));
@ -1013,76 +1020,101 @@ Object.extend(Effect.Transform.prototype, {
play: function(){ play: function(){
return new Effect.Parallel( return new Effect.Parallel(
this.tracks.map(function(track){ this.tracks.map(function(track){
var elements = [$(track.ids) || $$(track.ids)].flatten(); var ids = track.get('ids'), effect = track.get('effect'), options = track.get('options');
return elements.map(function(e){ return new track.effect(e, Object.extend({ sync:true }, track.options)) }); var elements = [$(ids) || $$(ids)].flatten();
return elements.map(function(e){ return new effect(e, Object.extend({ sync:true }, options)) });
}).flatten(), }).flatten(),
this.options this.options
); );
} }
}); });
Element.CSS_PROPERTIES = ['azimuth', 'backgroundAttachment', 'backgroundColor', 'backgroundImage', Element.CSS_PROPERTIES = $w(
'backgroundPosition', 'backgroundRepeat', 'borderBottomColor', 'borderBottomStyle', 'backgroundColor backgroundPosition borderBottomColor borderBottomStyle ' +
'borderBottomWidth', 'borderCollapse', 'borderLeftColor', 'borderLeftStyle', 'borderLeftWidth', 'borderBottomWidth borderLeftColor borderLeftStyle borderLeftWidth ' +
'borderRightColor', 'borderRightStyle', 'borderRightWidth', 'borderSpacing', 'borderTopColor', 'borderRightColor borderRightStyle borderRightWidth borderSpacing ' +
'borderTopStyle', 'borderTopWidth', 'bottom', 'captionSide', 'clear', 'clip', 'color', 'content', 'borderTopColor borderTopStyle borderTopWidth bottom clip color ' +
'counterIncrement', 'counterReset', 'cssFloat', 'cueAfter', 'cueBefore', 'cursor', 'direction', 'fontSize fontWeight height left letterSpacing lineHeight ' +
'display', 'elevation', 'emptyCells', 'fontFamily', 'fontSize', 'fontSizeAdjust', 'fontStretch', 'marginBottom marginLeft marginRight marginTop markerOffset maxHeight '+
'fontStyle', 'fontVariant', 'fontWeight', 'height', 'left', 'letterSpacing', 'lineHeight', 'maxWidth minHeight minWidth opacity outlineColor outlineOffset ' +
'listStyleImage', 'listStylePosition', 'listStyleType', 'marginBottom', 'marginLeft', 'marginRight', 'outlineWidth paddingBottom paddingLeft paddingRight paddingTop ' +
'marginTop', 'markerOffset', 'marks', 'maxHeight', 'maxWidth', 'minHeight', 'minWidth', 'opacity', 'right textIndent top width wordSpacing zIndex');
'orphans', 'outlineColor', 'outlineOffset', 'outlineStyle', 'outlineWidth', 'overflowX', 'overflowY',
'paddingBottom', 'paddingLeft', 'paddingRight', 'paddingTop', 'page', 'pageBreakAfter', 'pageBreakBefore',
'pageBreakInside', 'pauseAfter', 'pauseBefore', 'pitch', 'pitchRange', 'position', 'quotes',
'richness', 'right', 'size', 'speakHeader', 'speakNumeral', 'speakPunctuation', 'speechRate', 'stress',
'tableLayout', 'textAlign', 'textDecoration', 'textIndent', 'textShadow', 'textTransform', 'top',
'unicodeBidi', 'verticalAlign', 'visibility', 'voiceFamily', 'volume', 'whiteSpace', 'widows',
'width', 'wordSpacing', 'zIndex'];
Element.CSS_LENGTH = /^(([\+\-]?[0-9\.]+)(em|ex|px|in|cm|mm|pt|pc|\%))|0$/; Element.CSS_LENGTH = /^(([\+\-]?[0-9\.]+)(em|ex|px|in|cm|mm|pt|pc|\%))|0$/;
String.__parseStyleElement = document.createElement('div');
String.prototype.parseStyle = function(){ String.prototype.parseStyle = function(){
var element = Element.extend(document.createElement('div')); var style, styleRules = $H();
element.innerHTML = '<div style="' + this + '"></div>'; if (Prototype.Browser.WebKit)
var style = element.down().style, styleRules = $H(); style = new Element('div',{style:this}).style;
else {
String.__parseStyleElement.innerHTML = '<div style="' + this + '"></div>';
style = String.__parseStyleElement.childNodes[0].style;
}
Element.CSS_PROPERTIES.each(function(property){ Element.CSS_PROPERTIES.each(function(property){
if(style[property]) styleRules[property] = style[property]; if (style[property]) styleRules.set(property, style[property]);
}); });
var result = $H(); if (Prototype.Browser.IE && this.include('opacity'))
styleRules.set('opacity', this.match(/opacity:\s*((?:0|1)?(?:\.\d*)?)/)[1]);
styleRules.each(function(pair){ return styleRules;
var property = pair[0], value = pair[1], unit = null;
if(value.parseColor('#zzzzzz') != '#zzzzzz') {
value = value.parseColor();
unit = 'color';
} else if(Element.CSS_LENGTH.test(value))
var components = value.match(/^([\+\-]?[0-9\.]+)(.*)$/),
value = parseFloat(components[1]), unit = (components.length == 3) ? components[2] : null;
result[property.underscore().dasherize()] = $H({ value:value, unit:unit });
}.bind(this));
return result;
}; };
Element.morph = function(element, style) { if (document.defaultView && document.defaultView.getComputedStyle) {
Element.getStyles = function(element) {
var css = document.defaultView.getComputedStyle($(element), null);
return Element.CSS_PROPERTIES.inject({ }, function(styles, property) {
styles[property] = css[property];
return styles;
});
};
} else {
Element.getStyles = function(element) {
element = $(element);
var css = element.currentStyle, styles;
styles = Element.CSS_PROPERTIES.inject({ }, function(hash, property) {
hash.set(property, css[property]);
return hash;
});
if (!styles.opacity) styles.set('opacity', element.getOpacity());
return styles;
};
};
Effect.Methods = {
morph: function(element, style) {
element = $(element);
new Effect.Morph(element, Object.extend({ style: style }, arguments[2] || { })); new Effect.Morph(element, Object.extend({ style: style }, arguments[2] || { }));
return element; return element;
},
visualEffect: function(element, effect, options) {
element = $(element)
var s = effect.dasherize().camelize(), klass = s.charAt(0).toUpperCase() + s.substring(1);
new Effect[klass](element, options);
return element;
},
highlight: function(element, options) {
element = $(element);
new Effect.Highlight(element, options);
return element;
}
}; };
['setOpacity','getOpacity','getInlineOpacity','forceRerendering','setContentZoom', $w('fade appear grow shrink fold blindUp blindDown slideUp slideDown '+
'collectTextNodes','collectTextNodesIgnoreClass','morph'].each( 'pulsate shake puff squish switchOff dropOut').each(
function(f) { Element.Methods[f] = Element[f]; } function(effect) {
Effect.Methods[effect] = function(element, options){
element = $(element);
Effect[effect.charAt(0).toUpperCase() + effect.substring(1)](element, options);
return element;
}
}
); );
Element.Methods.visualEffect = function(element, effect, options) { $w('getInlineOpacity forceRerendering setContentZoom collectTextNodes collectTextNodesIgnoreClass getStyles').each(
s = effect.gsub(/_/, '-').camelize(); function(f) { Effect.Methods[f] = Element[f]; }
effect_class = s.charAt(0).toUpperCase() + s.substring(1); );
new Effect[effect_class](element, options);
return $(element);
};
Element.addMethods(); Element.addMethods(Effect.Methods);

File diff suppressed because it is too large Load diff

3
script/dbconsole Executable file
View file

@ -0,0 +1,3 @@
#!/usr/bin/env ruby
require File.dirname(__FILE__) + '/../config/boot'
require 'commands/dbconsole'

3
script/performance/request Executable file
View file

@ -0,0 +1,3 @@
#!/usr/bin/env ruby
require File.dirname(__FILE__) + '/../../config/boot'
require 'commands/performance/request'