banananetwork
/
tt-rss
1
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

bump prototype and scriptaculous

Browse Source
master
Andrew Dolgov 16 years ago
parent 29bfa13c42
commit 4b9dfd5b91
5 changed files with 3717 additions and 1863 deletions
Show Stats Download Patch File Download Diff File

3691
prototype.js vendored
View File

File diff suppressed because it is too large Load Diff

834
scriptaculous/controls.js vendored
Unescape Escape View File

@ -1,8 +1,8 @@
// script.aculo.us controls.js v1.7.0, Fri Jan 19 19:16:36 CET 2007 // script.aculo.us controls.js v1.8.1, Thu Jan 03 22:07:12 -0500 2008
// Copyright (c) 2005, 2006 Thomas Fuchs (http://script.aculo.us, http://mir.aculo.us) // Copyright (c) 2005-2007 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
@ -40,16 +40,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);
@ -76,6 +77,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;
@ -83,15 +87,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" '+
@ -141,17 +144,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;
@ -197,7 +200,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;
@ -240,21 +242,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)
@ -298,39 +301,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; getTokenBounds: function() {
if (null != this.tokenBounds) return this.tokenBounds;
return /\n/.test(ret) ? '' : ret; var value = this.element.value;
}, if (value.strip().empty()) return [-1, 0];
var diff = arguments.callee.getFirstDifferencePos(value, this.oldElementValue);
findLastToken: function() { var offset = (diff == this.oldElementValue.length ? 1 : 0);
var lastTokenPos = -1; var prevTokenPos = -1, nextTokenPos = value.length;
var tp;
for (var i=0; i<this.options.tokens.length; i++) { for (var index = 0, l = this.options.tokens.length; index < l; ++index) {
var thisTokenPos = this.element.value.lastIndexOf(this.options.tokens[i]); tp = value.lastIndexOf(this.options.tokens[index], diff + offset - 1);
if (thisTokenPos > lastTokenPos) if (tp > prevTokenPos) prevTokenPos = tp;
lastTokenPos = thisTokenPos; tp = value.indexOf(this.options.tokens[index], diff + offset);
} if (-1 != tp && tp < nextTokenPos) nextTokenPos = tp;
return lastTokenPos; }
} return (this.tokenBounds = [prevTokenPos + 1, nextTokenPos]);
} }
});
Ajax.Autocompleter = Class.create(); Autocompleter.Base.prototype.getTokenBounds.getFirstDifferencePos = function(newS, oldS) {
Object.extend(Object.extend(Ajax.Autocompleter.prototype, Autocompleter.Base.prototype), { var boundary = Math.min(newS.length, oldS.length);
for (var index = 0; index < boundary; ++index)
if (newS[index] != oldS[index])
return index;
return boundary;
};
Ajax.Autocompleter = Class.create(Autocompleter.Base, {
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;
@ -340,7 +352,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 ?
@ -355,7 +369,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
@ -393,8 +406,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;
@ -454,9 +466,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
@ -467,353 +478,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) { checkForEscapeOrReturn: function(e) {
Event.observe(this.options.externalControl, 'click', this.onclickListener); if (!this._editing || e.ctrlKey || e.altKey || e.shiftKey) return;
Event.observe(this.options.externalControl, 'mouseover', this.mouseoverListener); if (Event.KEY_ESC == e.keyCode)
Event.observe(this.options.externalControl, 'mouseout', this.mouseoutListener); this.handleFormCancellation(e);
} else if (Event.KEY_RETURN == e.keyCode)
}, this.handleFormSubmission(e);
enterEditMode: function(evt) { },
if (this.saving) return; createControl: function(mode, handler, extraClasses) {
if (this.editing) return; var control = this.options[mode + 'Control'];
this.editing = true; var text = this.options[mode + 'Text'];
this.onEnterEditMode(); if ('button' == control) {
if (this.options.externalControl) { var btn = document.createElement('input');
Element.hide(this.options.externalControl); btn.type = 'submit';
} btn.value = text;
Element.hide(this.element); btn.className = 'editor_' + mode + '_button';
this.createForm(); if ('cancel' == mode)
this.element.parentNode.insertBefore(this.form, this.element); btn.onclick = this._boundCancelHandler;
if (!this.options.loadTextURL) Field.scrollFreeActivate(this.editField); this._form.appendChild(btn);
// stop the event to avoid a page refresh in Safari this._controls[mode] = btn;
if (evt) { } else if ('link' == control) {
Event.stop(evt); var link = document.createElement('a');
} link.href = '#';
return false; link.appendChild(document.createTextNode(text));
}, link.onclick = 'cancel' == mode ? this._boundCancelHandler : this._boundSubmitHandler;
createForm: function() { link.className = 'editor_' + mode + '_link';
this.form = document.createElement("form"); if (extraClasses)
this.form.id = this.options.formId; link.className += ' ' + extraClasses;
Element.addClassName(this.form, this.options.formClassName) this._form.appendChild(link);
this.form.onsubmit = this.onSubmit.bind(this); this._controls[mode] = link;
this.createEditField();
if (this.options.textarea) {
var br = document.createElement("br");
this.form.appendChild(br);
}
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);
textArea.rows = this.options.rows;
textArea.cols = this.options.cols || 40;
textArea.className = 'editor_field';
if (this.options.submitOnBlur)
textArea.onblur = this.onSubmit.bind(this);
this.editField = textArea;
} }
fld.name = this.options.paramName;
if(this.options.loadTextURL) { fld.value = text; // No HTML breaks conversion anymore
fld.className = 'editor_field';
if (this.options.submitOnBlur)
fld.onblur = this._boundSubmitHandler;
this._controls.editor = fld;
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) handleFormCancellation: function(e) {
}, this.options.ajaxOptions) this.wrapUp();
); if (e) Event.stop(e);
}, },
onLoadedExternalText: function(transport) { handleFormSubmission: function(e) {
Element.removeClassName(this.form, this.options.loadingClassName); var form = this._form;
this.editField.disabled = false; var value = $F(this._controls.editor);
this.editField.value = transport.responseText.stripTags(); this.prepareSubmission();
Field.scrollFreeActivate(this.editField); var params = this.options.callback(form, value) || '';
}, if (Object.isString(params))
onclickCancel: function() { params = params.toQueryParams();
this.onComplete(); params.editorId = this.element.id;
this.leaveEditMode(); if (this.options.htmlResponse) {
return false; var options = Object.extend({ evalScripts: true }, this.options.ajaxOptions);
}, Object.extend(options, {
onFailure: function(transport) { parameters: params,
this.options.onFailure(transport); onComplete: this._boundWrapperHandler,
if (this.oldInnerHTML) { onFailure: this._boundFailureHandler
this.element.innerHTML = this.oldInnerHTML; });
this.oldInnerHTML = null; new Ajax.Updater({ success: this.element }, this.url, options);
}
return false;
},
onSubmit: function() {
// onLoading resets these so we need to save them away for the Ajax call
var form = this.form;
var value = this.editField.value;
// do this first, sometimes the ajax call returns before we get a chance to switch on Saving...
// which means this will actually switch on Saving... *after* we've left edit mode causing Saving...
// to be displayed indefinitely
this.onLoading();
if (this.options.evalScripts) {
new Ajax.Request(
this.url, Object.extend({
parameters: this.options.callback(form, value),
onComplete: this.onComplete.bind(this),
onFailure: this.onFailure.bind(this),
asynchronous:true,
evalScripts:true
}, this.options.ajaxOptions));
} 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)); if (e) Event.stop(e);
} },
// stop the event to avoid a page refresh in Safari leaveEditMode: function() {
if (arguments.length > 1) { this.element.removeClassName(this.options.savingClassName);
Event.stop(arguments[0]); this.removeForm();
} this.leaveHover();
return false; this.element.style.backgroundColor = this._originalBackground;
}, this.element.show();
onLoading: function() { if (this.options.externalControl)
this.saving = true; 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();
}, },
registerListeners: function() {
this._listeners = { };
var listener;
$H(Ajax.InPlaceEditor.Listeners).each(function(pair) {
listener = this[pair.value].bind(this);
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() {
if (!this._form) return;
this._form.remove();
this._form = null;
this._controls = { };
},
showSaving: function() { showSaving: function() {
this.oldInnerHTML = this.element.innerHTML; this._oldInnerHTML = this.element.innerHTML;
this.element.innerHTML = this.options.savingText; this.element.innerHTML = this.options.savingText;
Element.addClassName(this.element, this.options.savingClassName); this.element.addClassName(this.options.savingClassName);
this.element.style.backgroundColor = this.originalBackground; this.element.style.backgroundColor = this._originalBackground;
Element.show(this.element); this.element.show();
}, },
removeForm: function() { triggerCallback: function(cbName, arg) {
if(this.form) { if ('function' == typeof this.options[cbName]) {
if (this.form.parentNode) Element.remove(this.form); this.options[cbName](this, arg);
this.form = null;
} }
}, },
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();
else
this.checkForExternalText();
this._form.appendChild(this._controls.editor);
},
loadCollection: function() {
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);
},
showLoadingText: function(text) {
this._controls.editor.disabled = true;
var tempOption = this._controls.editor.firstChild;
if (!tempOption) {
tempOption = document.createElement('option');
tempOption.value = '';
this._controls.editor.appendChild(tempOption);
tempOption.selected = true;
} }
this.editing = false; tempOption.update((text || '').stripScripts().stripTags());
this.saving = false;
this.oldInnerHTML = null;
this.onLeaveEditMode();
}, },
onComplete: function(transport) {
this.leaveEditMode(); checkForExternalText: function() {
this.options.onComplete.bind(this)(transport, this.element); this._text = this.getText();
if (this.options.loadTextURL)
this.loadExternalText();
else
this.buildOptionList();
}, },
onEnterEditMode: function() {},
onLeaveEditMode: function() {},
dispose: function() {
if (this.oldInnerHTML) {
this.element.innerHTML = this.oldInnerHTML;
}
this.leaveEditMode();
Event.stopObserving(this.element, 'click', this.onclickListener);
Event.stopObserving(this.element, 'mouseover', this.mouseoverListener);
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);
}
}
};
Ajax.InPlaceCollectionEditor = Class.create(); loadExternalText: function() {
Object.extend(Ajax.InPlaceCollectionEditor.prototype, Ajax.InPlaceEditor.prototype); this.showLoadingText(this.options.loadingText);
Object.extend(Ajax.InPlaceCollectionEditor.prototype, { var options = Object.extend({ method: 'get' }, this.options.ajaxOptions);
createEditField: function() { Object.extend(options, {
if (!this.cached_selectTag) { parameters: 'editorId=' + encodeURIComponent(this.element.id),
var selectTag = document.createElement("select"); onComplete: Prototype.emptyFunction,
var collection = this.options.collection || []; onSuccess: function(transport) {
var optionTag; this._text = transport.responseText.strip();
collection.each(function(e,i) { this.buildOptionList();
optionTag = document.createElement("option"); }.bind(this),
optionTag.value = (e instanceof Array) ? e[0] : e; onFailure: this.onFailure
if((typeof this.options.value == 'undefined') && });
((e instanceof Array) ? this.element.innerHTML == e[1] : e == optionTag.value)) optionTag.selected = true; new Ajax.Request(this.options.loadTextURL, options);
if(this.options.value==optionTag.value) optionTag.selected = true; },
optionTag.appendChild(document.createTextNode((e instanceof Array) ? e[1] : e));
selectTag.appendChild(optionTag); 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)); }.bind(this));
this.cached_selectTag = selectTag; 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);
};
this.editField = this.cached_selectTag; Object.extend(Ajax.InPlaceEditor, {
if(this.options.loadTextURL) this.loadExternalText(); DefaultOptions: {
this.form.appendChild(this.editField); ajaxOptions: { },
this.options.callback = function(form, value) { autoRows: 3, // Use when multi-line w/ rows == 1
return "value=" + encodeURIComponent(value); cancelControl: 'link', // 'link'|'button'|false
cancelText: 'cancel',
clickToEditText: 'Click to edit',
externalControl: null, // id|elt
externalControlOnly: false,
fieldPostCreation: 'activate', // 'activate'|'focus'|false
formClassName: 'inplaceeditor-form',
formId: null, // id|elt
highlightColor: '#ffff99',
highlightEndColor: '#ffffff',
hoverClassName: '',
htmlResponse: true,
loadingClassName: 'inplaceeditor-loading',
loadingText: 'Loading...',
okControl: 'button', // 'link'|'button'|false
okText: 'ok',
paramName: 'value',
rows: 1, // If 1 and multi-line, uses autoRows
savingClassName: 'inplaceeditor-saving',
savingText: 'Saving...',
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);
@ -832,4 +962,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));
} }
}; });

100
scriptaculous/dragdrop.js vendored
Unescape Escape View File

@ -1,12 +1,12 @@
// script.aculo.us dragdrop.js v1.7.0, Fri Jan 19 19:16:36 CET 2007 // script.aculo.us dragdrop.js v1.8.1, Thu Jan 03 22:07:12 -0500 2008
// Copyright (c) 2005, 2006 Thomas Fuchs (http://script.aculo.us, http://mir.aculo.us) // Copyright (c) 2005-2007 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 = {
@ -28,8 +28,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));
@ -89,21 +88,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);
} }
}, },
@ -112,8 +113,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() {
@ -221,10 +224,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,
@ -235,7 +235,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(){
@ -245,6 +245,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,
@ -252,7 +253,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);
@ -265,7 +266,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);
@ -278,7 +279,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;
@ -300,7 +300,7 @@ 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
@ -323,6 +323,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);
@ -331,6 +333,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);
} }
@ -353,8 +357,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);
@ -382,7 +390,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);
}, },
@ -390,20 +398,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 {
@ -453,15 +475,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))
} }
}} }}
@ -545,12 +567,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;
@ -566,7 +589,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\-\_]*)[_](.*)$/,
@ -614,10 +637,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] || { });
@ -628,6 +658,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,
@ -681,10 +712,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);

524
scriptaculous/effects.js vendored
Unescape Escape View File

@ -1,6 +1,6 @@
// script.aculo.us effects.js v1.7.0, Fri Jan 19 19:16:36 CET 2007 // script.aculo.us effects.js v1.8.1, Thu Jan 03 22:07:12 -0500 2008
// Copyright (c) 2005, 2006 Thomas Fuchs (http://script.aculo.us, http://mir.aculo.us) // Copyright (c) 2005-2007 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/)
@ -23,7 +23,7 @@ String.prototype.parseColor = function() {
} }
} }
return (color.length==7 ? color : (arguments[0] || this)); return (color.length==7 ? color : (arguments[0] || this));
} };
/*--------------------------------------------------------------------------*/ /*--------------------------------------------------------------------------*/
@ -32,7 +32,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) {
@ -40,26 +40,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){
return $(element).getStyle('opacity');
}
Element.setOpacity = function(element, value){
return $(element).setStyle({opacity:value});
}
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 {
@ -72,31 +64,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);
}); });
@ -107,7 +131,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
@ -139,44 +163,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;
@ -187,7 +178,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) {
@ -226,46 +217,56 @@ Object.extend(Object.extend(Effect.ScopedQueue.prototype, Enumerable), {
loop: function() { loop: function() {
var timePos = new Date().getTime(); var timePos = new Date().getTime();
for(var i=0, len=this.effects.length;i<len;i++) for(var i=0, len=this.effects.length;i<len;i++)
if(this.effects[i]) this.effects[i].loop(timePos); 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: 60.0, // max. 60fps 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) {
@ -278,34 +279,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';
}, },
@ -316,13 +300,12 @@ Effect.Base.prototype = {
inspect: function() { inspect: function() {
var data = $H(); var data = $H();
for(property in this) for(property in this)
if(typeof this[property] != 'function') data[property] = this[property]; if (!Object.isFunction(this[property])) data.set(property, this[property]);
return '#<Effect:' + data.inspect() + ',options:' + $H(this.options).inspect() + '>'; 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]);
@ -341,24 +324,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,
@ -371,8 +364,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);
@ -384,23 +376,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'
}); });
} }
}); });
@ -411,8 +398,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);
@ -469,8 +455,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;
@ -486,8 +472,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,7 +498,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, {
@ -522,30 +507,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 ------------- */
@ -558,9 +534,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);
@ -575,7 +552,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);
@ -599,7 +576,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);
@ -613,7 +590,7 @@ Effect.BlindUp = function(element) {
} }
}, arguments[1] || { }) }, arguments[1] || { })
); );
} };
Effect.BlindDown = function(element) { Effect.BlindDown = function(element) {
element = $(element); element = $(element);
@ -631,7 +608,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);
@ -653,7 +630,7 @@ Effect.SwitchOff = function(element) {
}) })
} }
}, arguments[1] || { })); }, arguments[1] || { }));
} };
Effect.DropOut = function(element) { Effect.DropOut = function(element) {
element = $(element); element = $(element);
@ -673,28 +650,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();
@ -722,18 +705,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: ''});
@ -744,12 +729,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) {
@ -762,7 +747,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);
@ -836,7 +821,7 @@ Effect.Grow = function(element) {
) )
} }
}); });
} };
Effect.Shrink = function(element) { Effect.Shrink = function(element) {
element = $(element); element = $(element);
@ -890,7 +875,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);
@ -903,7 +888,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);
@ -926,40 +911,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 (typeof options.style == 'string') {
if(options.style.indexOf(':') == -1) { if (!Object.isString(options.style)) this.style = $H(options.style);
var cssText = '', selector = '.' + options.style; else {
$A(document.styleSheets).reverse().each(function(styleSheet) { if (options.style.include(':'))
if (styleSheet.cssRules) cssRules = styleSheet.cssRules; this.style = options.style.parseStyle();
else if (styleSheet.rules) cssRules = styleSheet.rules; else {
$A(cssRules).reverse().each(function(rule) { this.element.addClassName(options.style);
if (selector == rule.selectorText) { this.style = $H(this.element.getStyles());
cssText = rule.style.cssText; this.element.removeClassName(options.style);
throw $break; var css = this.element.getStyles();
} this.style = this.style.reject(function(style) {
}); return style.value == css[style.key];
if (cssText) throw $break;
}); });
this.style = cssText.parseStyle();
options.afterFinishInternal = function(effect) { options.afterFinishInternal = function(effect) {
effect.element.addClassName(effect.options.style); effect.element.addClassName(effect.options.style);
effect.transforms.each(function(transform) { effect.transforms.each(function(transform) {
if(transform.style != 'opacity') effect.element.style[transform.style] = '';
effect.element.style[transform.style.camelize()] = '';
}); });
} }
} else this.style = options.style.parseStyle(); }
} else this.style = $H(options.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';
@ -969,26 +951,28 @@ Object.extend(Object.extend(Effect.Morph.prototype, Effect.Base.prototype), {
}); });
} }
this.transforms = this.style.map(function(pair){ this.transforms = this.style.map(function(pair){
var property = pair[0].underscore().dasherize(), value = pair[1], unit = null; var property = pair[0], value = pair[1], unit = null;
if (value.parseColor('#zzzzzz') != '#zzzzzz') { if (value.parseColor('#zzzzzz') != '#zzzzzz') {
value = value.parseColor(); value = value.parseColor();
unit = 'color'; unit = 'color';
} else if (property == 'opacity') { } else if (property == 'opacity') {
value = parseFloat(value); value = parseFloat(value);
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});
} else if(Element.CSS_LENGTH.test(value)) } else if (Element.CSS_LENGTH.test(value)) {
var components = value.match(/^([\+\-]?[0-9\.]+)(.*)$/), var components = value.match(/^([\+\-]?[0-9\.]+)(.*)$/);
value = parseFloat(components[1]), unit = (components.length == 3) ? components[2] : null; value = parseFloat(components[1]);
unit = (components.length == 3) ? components[2] : null;
}
var originalValue = this.element.getStyle(property); var originalValue = this.element.getStyle(property);
return $H({ return {
style: property, style: property.camelize(),
originalValue: unit=='color' ? parseColor(originalValue) : parseFloat(originalValue || 0), originalValue: unit=='color' ? parseColor(originalValue) : parseFloat(originalValue || 0),
targetValue: unit=='color' ? parseColor(value) : value, targetValue: unit=='color' ? parseColor(value) : value,
unit: unit unit: unit
}); };
}.bind(this)).reject(function(transform){ }.bind(this)).reject(function(transform){
return ( return (
(transform.originalValue == transform.targetValue) || (transform.originalValue == transform.targetValue) ||
@ -1000,22 +984,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] || { };
@ -1023,9 +1009,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 }
})); }));
@ -1035,8 +1022,9 @@ 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
); );
@ -1056,35 +1044,79 @@ Element.CSS_PROPERTIES = $w(
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]);
}); });
if(/MSIE/.test(navigator.userAgent) && !window.opera && this.indexOf('opacity') > -1) {
styleRules.opacity = this.match(/opacity:\s*((?:0|1)?(?:\.\d*)?)/)[1]; if (Prototype.Browser.IE && this.include('opacity'))
} styleRules.set('opacity', this.match(/opacity:\s*((?:0|1)?(?:\.\d*)?)/)[1]);
return styleRules; return styleRules;
}; };
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(results, property) {
results[property] = css[property];
return results;
});
if (!styles.opacity) styles.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);

23
scriptaculous/scriptaculous.js
Unescape Escape View File

@ -1,6 +1,6 @@
// script.aculo.us scriptaculous.js v1.7.0, Fri Jan 19 19:16:36 CET 2007 // script.aculo.us scriptaculous.js v1.8.1, Thu Jan 03 22:07:12 -0500 2008
// Copyright (c) 2005, 2006 Thomas Fuchs (http://script.aculo.us, http://mir.aculo.us) // Copyright (c) 2005-2007 Thomas Fuchs (http://script.aculo.us, http://mir.aculo.us)
// //
// Permission is hereby granted, free of charge, to any person obtaining // Permission is hereby granted, free of charge, to any person obtaining
// a copy of this software and associated documentation files (the // a copy of this software and associated documentation files (the
@ -24,25 +24,32 @@
// 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/
var Scriptaculous = { var Scriptaculous = {
Version: '1.7.0', Version: '1.8.1',
require: function(libraryName) { require: function(libraryName) {
// inserting via DOM fails in Safari 2.0, so brute force approach // inserting via DOM fails in Safari 2.0, so brute force approach
document.write('<script type="text/javascript" src="'+libraryName+'"></script>'); document.write('<script type="text/javascript" src="'+libraryName+'"><\/script>');
}, },
REQUIRED_PROTOTYPE: '1.6.0',
load: function() { load: function() {
function convertVersionString(versionString){
var r = versionString.split('.');
return parseInt(r[0])*100000 + parseInt(r[1])*1000 + parseInt(r[2]);
}
if((typeof Prototype=='undefined') || if((typeof Prototype=='undefined') ||
(typeof Element == 'undefined') || (typeof Element == 'undefined') ||
(typeof Element.Methods=='undefined') || (typeof Element.Methods=='undefined') ||
parseFloat(Prototype.Version.split(".")[0] + "." + (convertVersionString(Prototype.Version) <
Prototype.Version.split(".")[1]) < 1.5) convertVersionString(Scriptaculous.REQUIRED_PROTOTYPE)))
throw("script.aculo.us requires the Prototype JavaScript framework >= 1.5.0"); throw("script.aculo.us requires the Prototype JavaScript framework >= " +
Scriptaculous.REQUIRED_PROTOTYPE);
$A(document.getElementsByTagName("script")).findAll( function(s) { $A(document.getElementsByTagName("script")).findAll( function(s) {
return (s.src && s.src.match(/scriptaculous\.js(\?.*)?$/)) return (s.src && s.src.match(/scriptaculous\.js(\?.*)?$/))
}).each( function(s) { }).each( function(s) {
var path = s.src.replace(/scriptaculous\.js(\?.*)?$/,''); var path = s.src.replace(/scriptaculous\.js(\?.*)?$/,'');
var includes = s.src.match(/\?.*load=([a-z,]*)/); var includes = s.src.match(/\?.*load=([a-z,]*)/);
(includes ? includes[1] : 'builder,effects,dragdrop,controls,slider').split(',').each( (includes ? includes[1] : 'builder,effects,dragdrop,controls,slider,sound').split(',').each(
function(include) { Scriptaculous.require(path+include+'.js') }); function(include) { Scriptaculous.require(path+include+'.js') });
}); });
} }

Write Preview
Loading…
Cancel
Save