rails 2.1 updates
parent
c740d877c2
commit
478ce39941
140
config/boot.rb
140
config/boot.rb
|
|
@ -1,45 +1,109 @@
|
|||
# Don't change this file. Configuration is done in config/environment.rb and config/environments/*.rb
|
||||
# Don't change this file!
|
||||
# Configure your app in config/environment.rb and config/environments/*.rb
|
||||
|
||||
unless defined?(RAILS_ROOT)
|
||||
root_path = File.join(File.dirname(__FILE__), '..')
|
||||
RAILS_ROOT = "#{File.dirname(__FILE__)}/.." unless defined?(RAILS_ROOT)
|
||||
|
||||
unless RUBY_PLATFORM =~ /(:?mswin|mingw)/
|
||||
require 'pathname'
|
||||
root_path = Pathname.new(root_path).cleanpath(true).to_s
|
||||
end
|
||||
|
||||
RAILS_ROOT = root_path
|
||||
end
|
||||
|
||||
unless defined?(Rails::Initializer)
|
||||
if File.directory?("#{RAILS_ROOT}/vendor/rails")
|
||||
require "#{RAILS_ROOT}/vendor/rails/railties/lib/initializer"
|
||||
else
|
||||
require 'rubygems'
|
||||
|
||||
environment_without_comments = IO.readlines(File.dirname(__FILE__) + '/environment.rb').reject { |l| l =~ /^#/ }.join
|
||||
environment_without_comments =~ /[^#]RAILS_GEM_VERSION = '([\d.]+)'/
|
||||
rails_gem_version = $1
|
||||
|
||||
if version = defined?(RAILS_GEM_VERSION) ? RAILS_GEM_VERSION : rails_gem_version
|
||||
# Asking for 1.1.6 will give you 1.1.6.5206, if available -- makes it easier to use beta gems
|
||||
rails_gem = Gem.cache.search('rails', "~>#{version}.0").sort_by { |g| g.version.version }.last
|
||||
|
||||
if rails_gem
|
||||
gem "rails", "=#{rails_gem.version.version}"
|
||||
require rails_gem.full_gem_path + '/lib/initializer'
|
||||
else
|
||||
STDERR.puts %(Cannot find gem for Rails ~>#{version}.0:
|
||||
Install the missing gem with 'gem install -v=#{version} rails', or
|
||||
change environment.rb to define RAILS_GEM_VERSION with your desired version.
|
||||
)
|
||||
exit 1
|
||||
end
|
||||
else
|
||||
gem "rails"
|
||||
require 'initializer'
|
||||
module Rails
|
||||
class << self
|
||||
def boot!
|
||||
unless booted?
|
||||
preinitialize
|
||||
pick_boot.run
|
||||
end
|
||||
end
|
||||
|
||||
def booted?
|
||||
defined? Rails::Initializer
|
||||
end
|
||||
|
||||
def pick_boot
|
||||
(vendor_rails? ? VendorBoot : GemBoot).new
|
||||
end
|
||||
|
||||
def vendor_rails?
|
||||
File.exist?("#{RAILS_ROOT}/vendor/rails")
|
||||
end
|
||||
|
||||
def preinitialize
|
||||
load(preinitializer_path) if File.exist?(preinitializer_path)
|
||||
end
|
||||
|
||||
def preinitializer_path
|
||||
"#{RAILS_ROOT}/config/preinitializer.rb"
|
||||
end
|
||||
end
|
||||
|
||||
class Boot
|
||||
def run
|
||||
load_initializer
|
||||
Rails::Initializer.run(:set_load_path)
|
||||
end
|
||||
end
|
||||
|
||||
class VendorBoot < Boot
|
||||
def load_initializer
|
||||
require "#{RAILS_ROOT}/vendor/rails/railties/lib/initializer"
|
||||
Rails::Initializer.run(:install_gem_spec_stubs)
|
||||
end
|
||||
end
|
||||
|
||||
class GemBoot < Boot
|
||||
def load_initializer
|
||||
self.class.load_rubygems
|
||||
load_rails_gem
|
||||
require 'initializer'
|
||||
end
|
||||
|
||||
def load_rails_gem
|
||||
if version = self.class.gem_version
|
||||
gem 'rails', version
|
||||
else
|
||||
gem 'rails'
|
||||
end
|
||||
rescue Gem::LoadError => load_error
|
||||
$stderr.puts %(Missing the Rails #{version} gem. Please `gem install -v=#{version} rails`, update your RAILS_GEM_VERSION setting in config/environment.rb for the Rails version you do have installed, or comment out RAILS_GEM_VERSION to use the latest version installed.)
|
||||
exit 1
|
||||
end
|
||||
|
||||
class << self
|
||||
def rubygems_version
|
||||
Gem::RubyGemsVersion if defined? Gem::RubyGemsVersion
|
||||
end
|
||||
|
||||
def gem_version
|
||||
if defined? RAILS_GEM_VERSION
|
||||
RAILS_GEM_VERSION
|
||||
elsif ENV.include?('RAILS_GEM_VERSION')
|
||||
ENV['RAILS_GEM_VERSION']
|
||||
else
|
||||
parse_gem_version(read_environment_rb)
|
||||
end
|
||||
end
|
||||
|
||||
def load_rubygems
|
||||
require 'rubygems'
|
||||
|
||||
unless rubygems_version >= '0.9.4'
|
||||
$stderr.puts %(Rails requires RubyGems >= 0.9.4 (you have #{rubygems_version}). Please `gem update --system` and try again.)
|
||||
exit 1
|
||||
end
|
||||
|
||||
rescue LoadError
|
||||
$stderr.puts %(Rails requires RubyGems >= 0.9.4. Please install RubyGems and try again: http://rubygems.rubyforge.org)
|
||||
exit 1
|
||||
end
|
||||
|
||||
def parse_gem_version(text)
|
||||
$1 if text =~ /^[^#]*RAILS_GEM_VERSION\s*=\s*["']([!~<>=]*\s*[\d.]+)["']/
|
||||
end
|
||||
|
||||
private
|
||||
def read_environment_rb
|
||||
File.read("#{RAILS_ROOT}/config/environment.rb")
|
||||
end
|
||||
end
|
||||
end
|
||||
end
|
||||
|
||||
# All that for this:
|
||||
Rails.boot!
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
// Copyright (c) 2005, 2006 Thomas Fuchs (http://script.aculo.us, http://mir.aculo.us)
|
||||
// (c) 2005, 2006 Ivan Krstic (http://blogs.law.harvard.edu/ivan)
|
||||
// (c) 2005, 2006 Jon Tirsen (http://www.tirsen.com)
|
||||
// Copyright (c) 2005-2008 Thomas Fuchs (http://script.aculo.us, http://mir.aculo.us)
|
||||
// (c) 2005-2007 Ivan Krstic (http://blogs.law.harvard.edu/ivan)
|
||||
// (c) 2005-2007 Jon Tirsen (http://www.tirsen.com)
|
||||
// Contributors:
|
||||
// Richard Livsey
|
||||
// Rahul Bhargava
|
||||
|
|
@ -38,16 +38,17 @@ if(typeof Effect == 'undefined')
|
|||
throw("controls.js requires including script.aculo.us' effects.js library");
|
||||
|
||||
var Autocompleter = { }
|
||||
Autocompleter.Base = function() {};
|
||||
Autocompleter.Base.prototype = {
|
||||
Autocompleter.Base = Class.create({
|
||||
baseInitialize: function(element, update, options) {
|
||||
this.element = $(element);
|
||||
element = $(element)
|
||||
this.element = element;
|
||||
this.update = $(update);
|
||||
this.hasFocus = false;
|
||||
this.changed = false;
|
||||
this.active = false;
|
||||
this.index = 0;
|
||||
this.entryCount = 0;
|
||||
this.oldElementValue = this.element.value;
|
||||
|
||||
if(this.setOptions)
|
||||
this.setOptions(options);
|
||||
|
|
@ -74,6 +75,9 @@ Autocompleter.Base.prototype = {
|
|||
|
||||
if(typeof(this.options.tokens) == 'string')
|
||||
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;
|
||||
|
||||
|
|
@ -81,15 +85,14 @@ Autocompleter.Base.prototype = {
|
|||
|
||||
Element.hide(this.update);
|
||||
|
||||
Event.observe(this.element, "blur", this.onBlur.bindAsEventListener(this));
|
||||
Event.observe(this.element, "keypress", this.onKeyPress.bindAsEventListener(this));
|
||||
Event.observe(this.element, 'blur', this.onBlur.bindAsEventListener(this));
|
||||
Event.observe(this.element, 'keydown', this.onKeyPress.bindAsEventListener(this));
|
||||
},
|
||||
|
||||
show: function() {
|
||||
if(Element.getStyle(this.update, 'display')=='none') this.options.onShow(this.element, this.update);
|
||||
if(!this.iefix &&
|
||||
(navigator.appVersion.indexOf('MSIE')>0) &&
|
||||
(navigator.userAgent.indexOf('Opera')<0) &&
|
||||
(Prototype.Browser.IE) &&
|
||||
(Element.getStyle(this.update, 'position')=='absolute')) {
|
||||
new Insertion.After(this.update,
|
||||
'<iframe id="' + this.update.id + '_iefix" '+
|
||||
|
|
@ -139,17 +142,17 @@ Autocompleter.Base.prototype = {
|
|||
case Event.KEY_UP:
|
||||
this.markPrevious();
|
||||
this.render();
|
||||
if(navigator.appVersion.indexOf('AppleWebKit')>0) Event.stop(event);
|
||||
Event.stop(event);
|
||||
return;
|
||||
case Event.KEY_DOWN:
|
||||
this.markNext();
|
||||
this.render();
|
||||
if(navigator.appVersion.indexOf('AppleWebKit')>0) Event.stop(event);
|
||||
Event.stop(event);
|
||||
return;
|
||||
}
|
||||
else
|
||||
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.hasFocus = true;
|
||||
|
|
@ -195,7 +198,6 @@ Autocompleter.Base.prototype = {
|
|||
this.index==i ?
|
||||
Element.addClassName(this.getEntry(i),"selected") :
|
||||
Element.removeClassName(this.getEntry(i),"selected");
|
||||
|
||||
if(this.hasFocus) {
|
||||
this.show();
|
||||
this.active = true;
|
||||
|
|
@ -238,21 +240,22 @@ Autocompleter.Base.prototype = {
|
|||
}
|
||||
var value = '';
|
||||
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);
|
||||
} else
|
||||
value = Element.collectTextNodesIgnoreClass(selectedElement, 'informal');
|
||||
|
||||
var lastTokenPos = this.findLastToken();
|
||||
if (lastTokenPos != -1) {
|
||||
var newValue = this.element.value.substr(0, lastTokenPos + 1);
|
||||
var whitespace = this.element.value.substr(lastTokenPos + 1).match(/^\s+/);
|
||||
var bounds = this.getTokenBounds();
|
||||
if (bounds[0] != -1) {
|
||||
var newValue = this.element.value.substr(0, bounds[0]);
|
||||
var whitespace = this.element.value.substr(bounds[0]).match(/^\s+/);
|
||||
if (whitespace)
|
||||
newValue += whitespace[0];
|
||||
this.element.value = newValue + value;
|
||||
this.element.value = newValue + value + this.element.value.substr(bounds[1]);
|
||||
} else {
|
||||
this.element.value = value;
|
||||
}
|
||||
this.oldElementValue = this.element.value;
|
||||
this.element.focus();
|
||||
|
||||
if (this.options.afterUpdateElement)
|
||||
|
|
@ -296,39 +299,48 @@ Autocompleter.Base.prototype = {
|
|||
|
||||
onObserverEvent: function() {
|
||||
this.changed = false;
|
||||
this.tokenBounds = null;
|
||||
if(this.getToken().length>=this.options.minChars) {
|
||||
this.startIndicator();
|
||||
this.getUpdatedChoices();
|
||||
} else {
|
||||
this.active = false;
|
||||
this.hide();
|
||||
}
|
||||
this.oldElementValue = this.element.value;
|
||||
},
|
||||
|
||||
getToken: function() {
|
||||
var tokenPos = this.findLastToken();
|
||||
if (tokenPos != -1)
|
||||
var ret = this.element.value.substr(tokenPos + 1).replace(/^\s+/,'').replace(/\s+$/,'');
|
||||
else
|
||||
var ret = this.element.value;
|
||||
|
||||
return /\n/.test(ret) ? '' : ret;
|
||||
var bounds = this.getTokenBounds();
|
||||
return this.element.value.substring(bounds[0], bounds[1]).strip();
|
||||
},
|
||||
|
||||
findLastToken: function() {
|
||||
var lastTokenPos = -1;
|
||||
getTokenBounds: function() {
|
||||
if (null != this.tokenBounds) return this.tokenBounds;
|
||||
var value = this.element.value;
|
||||
if (value.strip().empty()) return [-1, 0];
|
||||
var diff = arguments.callee.getFirstDifferencePos(value, this.oldElementValue);
|
||||
var offset = (diff == this.oldElementValue.length ? 1 : 0);
|
||||
var prevTokenPos = -1, nextTokenPos = value.length;
|
||||
var tp;
|
||||
for (var index = 0, l = this.options.tokens.length; index < l; ++index) {
|
||||
tp = value.lastIndexOf(this.options.tokens[index], diff + offset - 1);
|
||||
if (tp > prevTokenPos) prevTokenPos = tp;
|
||||
tp = value.indexOf(this.options.tokens[index], diff + offset);
|
||||
if (-1 != tp && tp < nextTokenPos) nextTokenPos = tp;
|
||||
}
|
||||
return (this.tokenBounds = [prevTokenPos + 1, nextTokenPos]);
|
||||
}
|
||||
});
|
||||
|
||||
for (var i=0; i<this.options.tokens.length; i++) {
|
||||
var thisTokenPos = this.element.value.lastIndexOf(this.options.tokens[i]);
|
||||
if (thisTokenPos > lastTokenPos)
|
||||
lastTokenPos = thisTokenPos;
|
||||
}
|
||||
return lastTokenPos;
|
||||
}
|
||||
}
|
||||
Autocompleter.Base.prototype.getTokenBounds.getFirstDifferencePos = function(newS, oldS) {
|
||||
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();
|
||||
Object.extend(Object.extend(Ajax.Autocompleter.prototype, Autocompleter.Base.prototype), {
|
||||
Ajax.Autocompleter = Class.create(Autocompleter.Base, {
|
||||
initialize: function(element, update, url, options) {
|
||||
this.baseInitialize(element, update, options);
|
||||
this.options.asynchronous = true;
|
||||
|
|
@ -338,7 +350,9 @@ Object.extend(Object.extend(Ajax.Autocompleter.prototype, Autocompleter.Base.pro
|
|||
},
|
||||
|
||||
getUpdatedChoices: function() {
|
||||
entry = encodeURIComponent(this.options.paramName) + '=' +
|
||||
this.startIndicator();
|
||||
|
||||
var entry = encodeURIComponent(this.options.paramName) + '=' +
|
||||
encodeURIComponent(this.getToken());
|
||||
|
||||
this.options.parameters = this.options.callback ?
|
||||
|
|
@ -353,7 +367,6 @@ Object.extend(Object.extend(Ajax.Autocompleter.prototype, Autocompleter.Base.pro
|
|||
onComplete: function(request) {
|
||||
this.updateChoices(request.responseText);
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
// The local array autocompleter. Used when you'd prefer to
|
||||
|
|
@ -391,8 +404,7 @@ Object.extend(Object.extend(Ajax.Autocompleter.prototype, Autocompleter.Base.pro
|
|||
// In that case, the other options above will not apply unless
|
||||
// you support them.
|
||||
|
||||
Autocompleter.Local = Class.create();
|
||||
Autocompleter.Local.prototype = Object.extend(new Autocompleter.Base(), {
|
||||
Autocompleter.Local = Class.create(Autocompleter.Base, {
|
||||
initialize: function(element, update, array, options) {
|
||||
this.baseInitialize(element, update, options);
|
||||
this.options.array = array;
|
||||
|
|
@ -452,9 +464,8 @@ Autocompleter.Local.prototype = Object.extend(new Autocompleter.Base(), {
|
|||
}
|
||||
});
|
||||
|
||||
// AJAX in-place editor
|
||||
//
|
||||
// see documentation on http://wiki.script.aculo.us/scriptaculous/show/Ajax.InPlaceEditor
|
||||
// AJAX in-place editor and collection editor
|
||||
// Full rewrite by Christophe Porteneuve <tdd@tddsworld.com> (April 2007).
|
||||
|
||||
// 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
|
||||
|
|
@ -465,353 +476,472 @@ Field.scrollFreeActivate = function(field) {
|
|||
}, 1);
|
||||
}
|
||||
|
||||
Ajax.InPlaceEditor = Class.create();
|
||||
Ajax.InPlaceEditor.defaultHighlightColor = "#FFFF99";
|
||||
Ajax.InPlaceEditor.prototype = {
|
||||
Ajax.InPlaceEditor = Class.create({
|
||||
initialize: function(element, url, options) {
|
||||
this.url = url;
|
||||
this.element = $(element);
|
||||
|
||||
this.options = Object.extend({
|
||||
paramName: "value",
|
||||
okButton: true,
|
||||
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 || {});
|
||||
|
||||
this.element = element = $(element);
|
||||
this.prepareOptions();
|
||||
this._controls = { };
|
||||
arguments.callee.dealWithDeprecatedOptions(options); // DEPRECATION LAYER!!!
|
||||
Object.extend(this.options, options || { });
|
||||
if (!this.options.formId && this.element.id) {
|
||||
this.options.formId = this.element.id + "-inplaceeditor";
|
||||
if ($(this.options.formId)) {
|
||||
// there's already a form with that name, don't specify an id
|
||||
this.options.formId = null;
|
||||
this.options.formId = this.element.id + '-inplaceeditor';
|
||||
if ($(this.options.formId))
|
||||
this.options.formId = '';
|
||||
}
|
||||
}
|
||||
|
||||
if (this.options.externalControl) {
|
||||
if (this.options.externalControl)
|
||||
this.options.externalControl = $(this.options.externalControl);
|
||||
}
|
||||
|
||||
this.originalBackground = Element.getStyle(this.element, 'background-color');
|
||||
if (!this.originalBackground) {
|
||||
this.originalBackground = "transparent";
|
||||
}
|
||||
|
||||
if (!this.options.externalControl)
|
||||
this.options.externalControlOnly = false;
|
||||
this._originalBackground = this.element.getStyle('background-color') || 'transparent';
|
||||
this.element.title = this.options.clickToEditText;
|
||||
|
||||
this.onclickListener = this.enterEditMode.bindAsEventListener(this);
|
||||
this.mouseoverListener = this.enterHover.bindAsEventListener(this);
|
||||
this.mouseoutListener = this.leaveHover.bindAsEventListener(this);
|
||||
Event.observe(this.element, 'click', this.onclickListener);
|
||||
Event.observe(this.element, 'mouseover', this.mouseoverListener);
|
||||
Event.observe(this.element, 'mouseout', this.mouseoutListener);
|
||||
if (this.options.externalControl) {
|
||||
Event.observe(this.options.externalControl, 'click', this.onclickListener);
|
||||
Event.observe(this.options.externalControl, 'mouseover', this.mouseoverListener);
|
||||
Event.observe(this.options.externalControl, 'mouseout', this.mouseoutListener);
|
||||
}
|
||||
this._boundCancelHandler = this.handleFormCancellation.bind(this);
|
||||
this._boundComplete = (this.options.onComplete || Prototype.emptyFunction).bind(this);
|
||||
this._boundFailureHandler = this.handleAJAXFailure.bind(this);
|
||||
this._boundSubmitHandler = this.handleFormSubmission.bind(this);
|
||||
this._boundWrapperHandler = this.wrapUp.bind(this);
|
||||
this.registerListeners();
|
||||
},
|
||||
enterEditMode: function(evt) {
|
||||
if (this.saving) return;
|
||||
if (this.editing) return;
|
||||
this.editing = true;
|
||||
this.onEnterEditMode();
|
||||
if (this.options.externalControl) {
|
||||
Element.hide(this.options.externalControl);
|
||||
}
|
||||
Element.hide(this.element);
|
||||
this.createForm();
|
||||
this.element.parentNode.insertBefore(this.form, this.element);
|
||||
if (!this.options.loadTextURL) Field.scrollFreeActivate(this.editField);
|
||||
// stop the event to avoid a page refresh in Safari
|
||||
if (evt) {
|
||||
Event.stop(evt);
|
||||
}
|
||||
return false;
|
||||
checkForEscapeOrReturn: function(e) {
|
||||
if (!this._editing || e.ctrlKey || e.altKey || e.shiftKey) return;
|
||||
if (Event.KEY_ESC == e.keyCode)
|
||||
this.handleFormCancellation(e);
|
||||
else if (Event.KEY_RETURN == e.keyCode)
|
||||
this.handleFormSubmission(e);
|
||||
},
|
||||
createForm: function() {
|
||||
this.form = document.createElement("form");
|
||||
this.form.id = this.options.formId;
|
||||
Element.addClassName(this.form, this.options.formClassName)
|
||||
this.form.onsubmit = this.onSubmit.bind(this);
|
||||
|
||||
this.createEditField();
|
||||
|
||||
if (this.options.textarea) {
|
||||
var br = document.createElement("br");
|
||||
this.form.appendChild(br);
|
||||
createControl: function(mode, handler, extraClasses) {
|
||||
var control = this.options[mode + 'Control'];
|
||||
var text = this.options[mode + 'Text'];
|
||||
if ('button' == control) {
|
||||
var btn = document.createElement('input');
|
||||
btn.type = 'submit';
|
||||
btn.value = text;
|
||||
btn.className = 'editor_' + mode + '_button';
|
||||
if ('cancel' == mode)
|
||||
btn.onclick = this._boundCancelHandler;
|
||||
this._form.appendChild(btn);
|
||||
this._controls[mode] = btn;
|
||||
} else if ('link' == control) {
|
||||
var link = document.createElement('a');
|
||||
link.href = '#';
|
||||
link.appendChild(document.createTextNode(text));
|
||||
link.onclick = 'cancel' == mode ? this._boundCancelHandler : this._boundSubmitHandler;
|
||||
link.className = 'editor_' + mode + '_link';
|
||||
if (extraClasses)
|
||||
link.className += ' ' + extraClasses;
|
||||
this._form.appendChild(link);
|
||||
this._controls[mode] = link;
|
||||
}
|
||||
|
||||
if (this.options.okButton) {
|
||||
okButton = document.createElement("input");
|
||||
okButton.type = "submit";
|
||||
okButton.value = this.options.okText;
|
||||
okButton.className = 'editor_ok_button';
|
||||
this.form.appendChild(okButton);
|
||||
}
|
||||
|
||||
if (this.options.cancelLink) {
|
||||
cancelLink = document.createElement("a");
|
||||
cancelLink.href = "#";
|
||||
cancelLink.appendChild(document.createTextNode(this.options.cancelText));
|
||||
cancelLink.onclick = this.onclickCancel.bind(this);
|
||||
cancelLink.className = 'editor_cancel';
|
||||
this.form.appendChild(cancelLink);
|
||||
}
|
||||
},
|
||||
hasHTMLLineBreaks: function(string) {
|
||||
if (!this.options.handleLineBreaks) return false;
|
||||
return string.match(/<br/i) || string.match(/<p>/i);
|
||||
},
|
||||
convertHTMLLineBreaks: function(string) {
|
||||
return string.replace(/<br>/gi, "\n").replace(/<br\/>/gi, "\n").replace(/<\/p>/gi, "\n").replace(/<p>/gi, "");
|
||||
},
|
||||
createEditField: function() {
|
||||
var text;
|
||||
if(this.options.loadTextURL) {
|
||||
text = this.options.loadingText;
|
||||
} else {
|
||||
text = this.getText();
|
||||
}
|
||||
|
||||
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 text = (this.options.loadTextURL ? this.options.loadingText : this.getText());
|
||||
var fld;
|
||||
if (1 >= this.options.rows && !/\r|\n/.test(this.getText())) {
|
||||
fld = document.createElement('input');
|
||||
fld.type = 'text';
|
||||
var size = this.options.size || this.options.cols || 0;
|
||||
if (size != 0) textField.size = size;
|
||||
if (this.options.submitOnBlur)
|
||||
textField.onblur = this.onSubmit.bind(this);
|
||||
this.editField = textField;
|
||||
if (0 < size) fld.size = size;
|
||||
} else {
|
||||
this.options.textarea = true;
|
||||
var textArea = document.createElement("textarea");
|
||||
textArea.obj = this;
|
||||
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';
|
||||
fld = document.createElement('textarea');
|
||||
fld.rows = (1 >= this.options.rows ? this.options.autoRows : this.options.rows);
|
||||
fld.cols = this.options.cols || 40;
|
||||
}
|
||||
fld.name = this.options.paramName;
|
||||
fld.value = text; // No HTML breaks conversion anymore
|
||||
fld.className = 'editor_field';
|
||||
if (this.options.submitOnBlur)
|
||||
textArea.onblur = this.onSubmit.bind(this);
|
||||
this.editField = textArea;
|
||||
}
|
||||
|
||||
if(this.options.loadTextURL) {
|
||||
fld.onblur = this._boundSubmitHandler;
|
||||
this._controls.editor = fld;
|
||||
if (this.options.loadTextURL)
|
||||
this.loadExternalText();
|
||||
}
|
||||
this.form.appendChild(this.editField);
|
||||
this._form.appendChild(this._controls.editor);
|
||||
},
|
||||
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() {
|
||||
return this.element.innerHTML;
|
||||
},
|
||||
loadExternalText: function() {
|
||||
Element.addClassName(this.form, this.options.loadingClassName);
|
||||
this.editField.disabled = true;
|
||||
new Ajax.Request(
|
||||
this.options.loadTextURL,
|
||||
Object.extend({
|
||||
asynchronous: true,
|
||||
onComplete: this.onLoadedExternalText.bind(this)
|
||||
}, this.options.ajaxOptions)
|
||||
);
|
||||
},
|
||||
onLoadedExternalText: function(transport) {
|
||||
Element.removeClassName(this.form, this.options.loadingClassName);
|
||||
this.editField.disabled = false;
|
||||
this.editField.value = transport.responseText.stripTags();
|
||||
Field.scrollFreeActivate(this.editField);
|
||||
},
|
||||
onclickCancel: function() {
|
||||
this.onComplete();
|
||||
this.leaveEditMode();
|
||||
return false;
|
||||
},
|
||||
onFailure: function(transport) {
|
||||
this.options.onFailure(transport);
|
||||
if (this.oldInnerHTML) {
|
||||
this.element.innerHTML = this.oldInnerHTML;
|
||||
this.oldInnerHTML = null;
|
||||
handleAJAXFailure: function(transport) {
|
||||
this.triggerCallback('onFailure', transport);
|
||||
if (this._oldInnerHTML) {
|
||||
this.element.innerHTML = this._oldInnerHTML;
|
||||
this._oldInnerHTML = null;
|
||||
}
|
||||
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));
|
||||
handleFormCancellation: function(e) {
|
||||
this.wrapUp();
|
||||
if (e) Event.stop(e);
|
||||
},
|
||||
handleFormSubmission: function(e) {
|
||||
var form = this._form;
|
||||
var value = $F(this._controls.editor);
|
||||
this.prepareSubmission();
|
||||
var params = this.options.callback(form, value) || '';
|
||||
if (Object.isString(params))
|
||||
params = params.toQueryParams();
|
||||
params.editorId = this.element.id;
|
||||
if (this.options.htmlResponse) {
|
||||
var options = Object.extend({ evalScripts: true }, this.options.ajaxOptions);
|
||||
Object.extend(options, {
|
||||
parameters: params,
|
||||
onComplete: this._boundWrapperHandler,
|
||||
onFailure: this._boundFailureHandler
|
||||
});
|
||||
new Ajax.Updater({ success: this.element }, this.url, options);
|
||||
} else {
|
||||
new Ajax.Updater(
|
||||
{ success: this.element,
|
||||
// don't update on failure (this could be an option)
|
||||
failure: null },
|
||||
this.url, Object.extend({
|
||||
parameters: this.options.callback(form, value),
|
||||
onComplete: this.onComplete.bind(this),
|
||||
onFailure: this.onFailure.bind(this)
|
||||
}, this.options.ajaxOptions));
|
||||
var options = Object.extend({ method: 'get' }, this.options.ajaxOptions);
|
||||
Object.extend(options, {
|
||||
parameters: params,
|
||||
onComplete: this._boundWrapperHandler,
|
||||
onFailure: this._boundFailureHandler
|
||||
});
|
||||
new Ajax.Request(this.url, options);
|
||||
}
|
||||
// stop the event to avoid a page refresh in Safari
|
||||
if (arguments.length > 1) {
|
||||
Event.stop(arguments[0]);
|
||||
}
|
||||
return false;
|
||||
if (e) Event.stop(e);
|
||||
},
|
||||
onLoading: function() {
|
||||
this.saving = true;
|
||||
leaveEditMode: function() {
|
||||
this.element.removeClassName(this.options.savingClassName);
|
||||
this.removeForm();
|
||||
this.leaveHover();
|
||||
this.element.style.backgroundColor = this._originalBackground;
|
||||
this.element.show();
|
||||
if (this.options.externalControl)
|
||||
this.options.externalControl.show();
|
||||
this._saving = false;
|
||||
this._editing = false;
|
||||
this._oldInnerHTML = null;
|
||||
this.triggerCallback('onLeaveEditMode');
|
||||
},
|
||||
leaveHover: function(e) {
|
||||
if (this.options.hoverClassName)
|
||||
this.element.removeClassName(this.options.hoverClassName);
|
||||
if (this._saving) return;
|
||||
this.triggerCallback('onLeaveHover');
|
||||
},
|
||||
loadExternalText: function() {
|
||||
this._form.addClassName(this.options.loadingClassName);
|
||||
this._controls.editor.disabled = true;
|
||||
var options = Object.extend({ method: 'get' }, this.options.ajaxOptions);
|
||||
Object.extend(options, {
|
||||
parameters: 'editorId=' + encodeURIComponent(this.element.id),
|
||||
onComplete: Prototype.emptyFunction,
|
||||
onSuccess: function(transport) {
|
||||
this._form.removeClassName(this.options.loadingClassName);
|
||||
var text = transport.responseText;
|
||||
if (this.options.stripLoadedTextTags)
|
||||
text = text.stripTags();
|
||||
this._controls.editor.value = text;
|
||||
this._controls.editor.disabled = false;
|
||||
this.postProcessEditField();
|
||||
}.bind(this),
|
||||
onFailure: this._boundFailureHandler
|
||||
});
|
||||
new Ajax.Request(this.options.loadTextURL, options);
|
||||
},
|
||||
postProcessEditField: function() {
|
||||
var fpc = this.options.fieldPostCreation;
|
||||
if (fpc)
|
||||
$(this._controls.editor)['focus' == fpc ? 'focus' : 'activate']();
|
||||
},
|
||||
prepareOptions: function() {
|
||||
this.options = Object.clone(Ajax.InPlaceEditor.DefaultOptions);
|
||||
Object.extend(this.options, Ajax.InPlaceEditor.DefaultCallbacks);
|
||||
[this._extraDefaultOptions].flatten().compact().each(function(defs) {
|
||||
Object.extend(this.options, defs);
|
||||
}.bind(this));
|
||||
},
|
||||
prepareSubmission: function() {
|
||||
this._saving = true;
|
||||
this.removeForm();
|
||||
this.leaveHover();
|
||||
this.showSaving();
|
||||
},
|
||||
showSaving: function() {
|
||||
this.oldInnerHTML = this.element.innerHTML;
|
||||
this.element.innerHTML = this.options.savingText;
|
||||
Element.addClassName(this.element, this.options.savingClassName);
|
||||
this.element.style.backgroundColor = this.originalBackground;
|
||||
Element.show(this.element);
|
||||
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) {
|
||||
if (this.form.parentNode) Element.remove(this.form);
|
||||
this.form = null;
|
||||
if (!this._form) return;
|
||||
this._form.remove();
|
||||
this._form = null;
|
||||
this._controls = { };
|
||||
},
|
||||
showSaving: function() {
|
||||
this._oldInnerHTML = this.element.innerHTML;
|
||||
this.element.innerHTML = this.options.savingText;
|
||||
this.element.addClassName(this.options.savingClassName);
|
||||
this.element.style.backgroundColor = this._originalBackground;
|
||||
this.element.show();
|
||||
},
|
||||
triggerCallback: function(cbName, arg) {
|
||||
if ('function' == typeof this.options[cbName]) {
|
||||
this.options[cbName](this, arg);
|
||||
}
|
||||
},
|
||||
enterHover: function() {
|
||||
if (this.saving) return;
|
||||
this.element.style.backgroundColor = this.options.highlightcolor;
|
||||
if (this.effect) {
|
||||
this.effect.cancel();
|
||||
}
|
||||
Element.addClassName(this.element, this.options.hoverClassName)
|
||||
unregisterListeners: function() {
|
||||
$H(this._listeners).each(function(pair) {
|
||||
if (!this.options.externalControlOnly)
|
||||
this.element.stopObserving(pair.key, pair.value);
|
||||
if (this.options.externalControl)
|
||||
this.options.externalControl.stopObserving(pair.key, pair.value);
|
||||
}.bind(this));
|
||||
},
|
||||
leaveHover: function() {
|
||||
if (this.options.backgroundColor) {
|
||||
this.element.style.backgroundColor = this.oldBackground;
|
||||
wrapUp: function(transport) {
|
||||
this.leaveEditMode();
|
||||
// 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);
|
||||
this.removeForm();
|
||||
this.leaveHover();
|
||||
this.element.style.backgroundColor = this.originalBackground;
|
||||
Element.show(this.element);
|
||||
if (this.options.externalControl) {
|
||||
Element.show(this.options.externalControl);
|
||||
}
|
||||
this.editing = false;
|
||||
this.saving = false;
|
||||
this.oldInnerHTML = null;
|
||||
this.onLeaveEditMode();
|
||||
|
||||
createEditField: function() {
|
||||
var list = document.createElement('select');
|
||||
list.name = this.options.paramName;
|
||||
list.size = 1;
|
||||
this._controls.editor = list;
|
||||
this._collection = this.options.collection || [];
|
||||
if (this.options.loadCollectionURL)
|
||||
this.loadCollection();
|
||||
else
|
||||
this.checkForExternalText();
|
||||
this._form.appendChild(this._controls.editor);
|
||||
},
|
||||
onComplete: function(transport) {
|
||||
this.leaveEditMode();
|
||||
this.options.onComplete.bind(this)(transport, this.element);
|
||||
|
||||
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);
|
||||
},
|
||||
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);
|
||||
|
||||
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;
|
||||
}
|
||||
tempOption.update((text || '').stripScripts().stripTags());
|
||||
},
|
||||
|
||||
checkForExternalText: function() {
|
||||
this._text = this.getText();
|
||||
if (this.options.loadTextURL)
|
||||
this.loadExternalText();
|
||||
else
|
||||
this.buildOptionList();
|
||||
},
|
||||
|
||||
loadExternalText: function() {
|
||||
this.showLoadingText(this.options.loadingText);
|
||||
var options = Object.extend({ method: 'get' }, this.options.ajaxOptions);
|
||||
Object.extend(options, {
|
||||
parameters: 'editorId=' + encodeURIComponent(this.element.id),
|
||||
onComplete: Prototype.emptyFunction,
|
||||
onSuccess: function(transport) {
|
||||
this._text = transport.responseText.strip();
|
||||
this.buildOptionList();
|
||||
}.bind(this),
|
||||
onFailure: this.onFailure
|
||||
});
|
||||
new Ajax.Request(this.options.loadTextURL, options);
|
||||
},
|
||||
|
||||
buildOptionList: function() {
|
||||
this._form.removeClassName(this.options.loadingClassName);
|
||||
this._collection = this._collection.map(function(entry) {
|
||||
return 2 === entry.length ? entry : [entry, entry].flatten();
|
||||
});
|
||||
var marker = ('value' in this.options) ? this.options.value : this._text;
|
||||
var textFound = this._collection.any(function(entry) {
|
||||
return entry[0] == marker;
|
||||
}.bind(this));
|
||||
this._controls.editor.update('');
|
||||
var option;
|
||||
this._collection.each(function(entry, index) {
|
||||
option = document.createElement('option');
|
||||
option.value = entry[0];
|
||||
option.selected = textFound ? entry[0] == marker : 0 == index;
|
||||
option.appendChild(document.createTextNode(entry[1]));
|
||||
this._controls.editor.appendChild(option);
|
||||
}.bind(this));
|
||||
this._controls.editor.disabled = false;
|
||||
Field.scrollFreeActivate(this._controls.editor);
|
||||
}
|
||||
});
|
||||
|
||||
//**** DEPRECATION LAYER FOR InPlace[Collection]Editor! ****
|
||||
//**** This only exists for a while, in order to let ****
|
||||
//**** users adapt to the new API. Read up on the new ****
|
||||
//**** API and convert your code to it ASAP! ****
|
||||
|
||||
Ajax.InPlaceEditor.prototype.initialize.dealWithDeprecatedOptions = function(options) {
|
||||
if (!options) return;
|
||||
function fallback(name, expr) {
|
||||
if (name in options || expr === undefined) return;
|
||||
options[name] = expr;
|
||||
};
|
||||
fallback('cancelControl', (options.cancelLink ? 'link' : (options.cancelButton ? 'button' :
|
||||
options.cancelLink == options.cancelButton == false ? false : undefined)));
|
||||
fallback('okControl', (options.okLink ? 'link' : (options.okButton ? 'button' :
|
||||
options.okLink == options.okButton == false ? false : undefined)));
|
||||
fallback('highlightColor', options.highlightcolor);
|
||||
fallback('highlightEndColor', options.highlightendcolor);
|
||||
};
|
||||
|
||||
Ajax.InPlaceCollectionEditor = Class.create();
|
||||
Object.extend(Ajax.InPlaceCollectionEditor.prototype, Ajax.InPlaceEditor.prototype);
|
||||
Object.extend(Ajax.InPlaceCollectionEditor.prototype, {
|
||||
createEditField: function() {
|
||||
if (!this.cached_selectTag) {
|
||||
var selectTag = document.createElement("select");
|
||||
var collection = this.options.collection || [];
|
||||
var optionTag;
|
||||
collection.each(function(e,i) {
|
||||
optionTag = document.createElement("option");
|
||||
optionTag.value = (e instanceof Array) ? e[0] : e;
|
||||
if((typeof this.options.value == 'undefined') &&
|
||||
((e instanceof Array) ? this.element.innerHTML == e[1] : e == optionTag.value)) optionTag.selected = true;
|
||||
if(this.options.value==optionTag.value) optionTag.selected = true;
|
||||
optionTag.appendChild(document.createTextNode((e instanceof Array) ? e[1] : e));
|
||||
selectTag.appendChild(optionTag);
|
||||
}.bind(this));
|
||||
this.cached_selectTag = selectTag;
|
||||
}
|
||||
|
||||
this.editField = this.cached_selectTag;
|
||||
if(this.options.loadTextURL) this.loadExternalText();
|
||||
this.form.appendChild(this.editField);
|
||||
this.options.callback = function(form, value) {
|
||||
return "value=" + encodeURIComponent(value);
|
||||
Object.extend(Ajax.InPlaceEditor, {
|
||||
DefaultOptions: {
|
||||
ajaxOptions: { },
|
||||
autoRows: 3, // Use when multi-line w/ rows == 1
|
||||
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,
|
||||
// but waits for delay after last key input
|
||||
// Ideal for live-search fields
|
||||
|
||||
Form.Element.DelayedObserver = Class.create();
|
||||
Form.Element.DelayedObserver.prototype = {
|
||||
Form.Element.DelayedObserver = Class.create({
|
||||
initialize: function(element, delay, callback) {
|
||||
this.delay = delay || 0.5;
|
||||
this.element = $(element);
|
||||
|
|
@ -830,4 +960,4 @@ Form.Element.DelayedObserver.prototype = {
|
|||
this.timer = null;
|
||||
this.callback(this.element, $F(this.element));
|
||||
}
|
||||
};
|
||||
});
|
||||
|
|
|
|||
|
|
@ -1,10 +1,10 @@
|
|||
// Copyright (c) 2005, 2006 Thomas Fuchs (http://script.aculo.us, http://mir.aculo.us)
|
||||
// (c) 2005, 2006 Sammi Williams (http://www.oriontransfer.co.nz, sammi@oriontransfer.co.nz)
|
||||
// Copyright (c) 2005-2008 Thomas Fuchs (http://script.aculo.us, http://mir.aculo.us)
|
||||
// (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.
|
||||
// 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");
|
||||
|
||||
var Droppables = {
|
||||
|
|
@ -26,8 +26,7 @@ var Droppables = {
|
|||
if(options.containment) {
|
||||
options._containers = [];
|
||||
var containment = options.containment;
|
||||
if((typeof containment == 'object') &&
|
||||
(containment.constructor == Array)) {
|
||||
if(Object.isArray(containment)) {
|
||||
containment.each( function(c) { options._containers.push($(c)) });
|
||||
} else {
|
||||
options._containers.push($(containment));
|
||||
|
|
@ -87,21 +86,23 @@ var Droppables = {
|
|||
|
||||
show: function(point, element) {
|
||||
if(!this.drops.length) return;
|
||||
var affected = [];
|
||||
var drop, affected = [];
|
||||
|
||||
if(this.last_active) this.deactivate(this.last_active);
|
||||
this.drops.each( function(drop) {
|
||||
if(Droppables.isAffected(point, element, drop))
|
||||
affected.push(drop);
|
||||
});
|
||||
|
||||
if(affected.length>0) {
|
||||
if(affected.length>0)
|
||||
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]);
|
||||
if(drop.onHover)
|
||||
drop.onHover(element, drop.element, Position.overlap(drop.overlap, drop.element));
|
||||
|
||||
Droppables.activate(drop);
|
||||
if (drop != this.last_active) Droppables.activate(drop);
|
||||
}
|
||||
},
|
||||
|
||||
|
|
@ -110,8 +111,10 @@ var Droppables = {
|
|||
Position.prepare();
|
||||
|
||||
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);
|
||||
return true;
|
||||
}
|
||||
},
|
||||
|
||||
reset: function() {
|
||||
|
|
@ -219,10 +222,7 @@ var Draggables = {
|
|||
|
||||
/*--------------------------------------------------------------------------*/
|
||||
|
||||
var Draggable = Class.create();
|
||||
Draggable._dragging = {};
|
||||
|
||||
Draggable.prototype = {
|
||||
var Draggable = Class.create({
|
||||
initialize: function(element) {
|
||||
var defaults = {
|
||||
handle: false,
|
||||
|
|
@ -233,7 +233,7 @@ Draggable.prototype = {
|
|||
});
|
||||
},
|
||||
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,
|
||||
queue: {scope:'_draggable', position:'end'},
|
||||
afterFinish: function(){
|
||||
|
|
@ -243,6 +243,7 @@ Draggable.prototype = {
|
|||
},
|
||||
zindex: 1000,
|
||||
revert: false,
|
||||
quiet: false,
|
||||
scroll: false,
|
||||
scrollSensitivity: 20,
|
||||
scrollSpeed: 15,
|
||||
|
|
@ -250,7 +251,7 @@ Draggable.prototype = {
|
|||
delay: 0
|
||||
};
|
||||
|
||||
if(!arguments[1] || typeof arguments[1].endeffect == 'undefined')
|
||||
if(!arguments[1] || Object.isUndefined(arguments[1].endeffect))
|
||||
Object.extend(defaults, {
|
||||
starteffect: function(element) {
|
||||
element._opacity = Element.getOpacity(element);
|
||||
|
|
@ -263,7 +264,7 @@ Draggable.prototype = {
|
|||
|
||||
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);
|
||||
|
||||
if(!this.handle) this.handle = $(options.handle);
|
||||
|
|
@ -276,7 +277,6 @@ Draggable.prototype = {
|
|||
|
||||
Element.makePositioned(this.element); // fix IE
|
||||
|
||||
this.delta = this.currentDelta();
|
||||
this.options = options;
|
||||
this.dragging = false;
|
||||
|
||||
|
|
@ -298,17 +298,17 @@ Draggable.prototype = {
|
|||
},
|
||||
|
||||
initDrag: function(event) {
|
||||
if(typeof Draggable._dragging[this.element] != 'undefined' &&
|
||||
if(!Object.isUndefined(Draggable._dragging[this.element]) &&
|
||||
Draggable._dragging[this.element]) return;
|
||||
if(Event.isLeftClick(event)) {
|
||||
// abort on form elements, fixes a Firefox issue
|
||||
var src = Event.element(event);
|
||||
if(src.tagName && (
|
||||
src.tagName=='INPUT' ||
|
||||
src.tagName=='SELECT' ||
|
||||
src.tagName=='OPTION' ||
|
||||
src.tagName=='BUTTON' ||
|
||||
src.tagName=='TEXTAREA')) return;
|
||||
if((tag_name = src.tagName.toUpperCase()) && (
|
||||
tag_name=='INPUT' ||
|
||||
tag_name=='SELECT' ||
|
||||
tag_name=='OPTION' ||
|
||||
tag_name=='BUTTON' ||
|
||||
tag_name=='TEXTAREA')) return;
|
||||
|
||||
var pointer = [Event.pointerX(event), Event.pointerY(event)];
|
||||
var pos = Position.cumulativeOffset(this.element);
|
||||
|
|
@ -321,6 +321,8 @@ Draggable.prototype = {
|
|||
|
||||
startDrag: function(event) {
|
||||
this.dragging = true;
|
||||
if(!this.delta)
|
||||
this.delta = this.currentDelta();
|
||||
|
||||
if(this.options.zindex) {
|
||||
this.originalZ = parseInt(Element.getStyle(this.element,'z-index') || 0);
|
||||
|
|
@ -329,6 +331,8 @@ Draggable.prototype = {
|
|||
|
||||
if(this.options.ghosting) {
|
||||
this._clone = this.element.cloneNode(true);
|
||||
this.element._originallyAbsolute = (this.element.getStyle('position') == 'absolute');
|
||||
if (!this.element._originallyAbsolute)
|
||||
Position.absolutize(this.element);
|
||||
this.element.parentNode.insertBefore(this._clone, this.element);
|
||||
}
|
||||
|
|
@ -351,8 +355,12 @@ Draggable.prototype = {
|
|||
|
||||
updateDrag: function(event, pointer) {
|
||||
if(!this.dragging) this.startDrag(event);
|
||||
|
||||
if(!this.options.quiet){
|
||||
Position.prepare();
|
||||
Droppables.show(pointer, this.element);
|
||||
}
|
||||
|
||||
Draggables.notify('onDrag', this, event);
|
||||
|
||||
this.draw(pointer);
|
||||
|
|
@ -380,7 +388,7 @@ Draggable.prototype = {
|
|||
}
|
||||
|
||||
// fix AppleWebKit rendering
|
||||
if(navigator.appVersion.indexOf('AppleWebKit')>0) window.scrollBy(0,0);
|
||||
if(Prototype.Browser.WebKit) window.scrollBy(0,0);
|
||||
|
||||
Event.stop(event);
|
||||
},
|
||||
|
|
@ -388,20 +396,34 @@ Draggable.prototype = {
|
|||
finishDrag: function(event, success) {
|
||||
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.element._originallyAbsolute)
|
||||
Position.relativize(this.element);
|
||||
delete this.element._originallyAbsolute;
|
||||
Element.remove(this._clone);
|
||||
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);
|
||||
|
||||
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();
|
||||
if(revert && this.options.reverteffect) {
|
||||
if (dropped == 0 || revert != 'failure')
|
||||
this.options.reverteffect(this.element,
|
||||
d[1]-this.delta[1], d[0]-this.delta[0]);
|
||||
} else {
|
||||
|
|
@ -451,15 +473,15 @@ Draggable.prototype = {
|
|||
}.bind(this));
|
||||
|
||||
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);
|
||||
} else {
|
||||
if(this.options.snap instanceof Array) {
|
||||
if(Object.isArray(this.options.snap)) {
|
||||
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 {
|
||||
p = p.map( function(v) {
|
||||
return Math.round(v/this.options.snap)*this.options.snap }.bind(this))
|
||||
return (v/this.options.snap).round()*this.options.snap }.bind(this))
|
||||
}
|
||||
}}
|
||||
|
||||
|
|
@ -543,12 +565,13 @@ Draggable.prototype = {
|
|||
}
|
||||
return { top: T, left: L, width: W, height: H };
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
Draggable._dragging = { };
|
||||
|
||||
/*--------------------------------------------------------------------------*/
|
||||
|
||||
var SortableObserver = Class.create();
|
||||
SortableObserver.prototype = {
|
||||
var SortableObserver = Class.create({
|
||||
initialize: function(element, observer) {
|
||||
this.element = $(element);
|
||||
this.observer = observer;
|
||||
|
|
@ -564,7 +587,7 @@ SortableObserver.prototype = {
|
|||
if(this.lastValue != Sortable.serialize(this.element))
|
||||
this.observer(this.element)
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
var Sortable = {
|
||||
SERIALIZE_RULE: /^[^_\-](?:[A-Za-z0-9\-\_]*)[_](.*)$/,
|
||||
|
|
@ -572,7 +595,7 @@ var Sortable = {
|
|||
sortables: { },
|
||||
|
||||
_findRootElement: function(element) {
|
||||
while (element.tagName != "BODY") {
|
||||
while (element.tagName.toUpperCase() != "BODY") {
|
||||
if(element.id && Sortable.sortables[element.id]) return element;
|
||||
element = element.parentNode;
|
||||
}
|
||||
|
|
@ -612,10 +635,17 @@ var Sortable = {
|
|||
delay: 0,
|
||||
hoverclass: null,
|
||||
ghosting: false,
|
||||
quiet: false,
|
||||
scroll: false,
|
||||
scrollSensitivity: 20,
|
||||
scrollSpeed: 15,
|
||||
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,
|
||||
onUpdate: Prototype.emptyFunction
|
||||
}, arguments[1] || { });
|
||||
|
|
@ -626,6 +656,7 @@ var Sortable = {
|
|||
// build options for the draggables
|
||||
var options_for_draggable = {
|
||||
revert: true,
|
||||
quiet: options.quiet,
|
||||
scroll: options.scroll,
|
||||
scrollSpeed: options.scrollSpeed,
|
||||
scrollSensitivity: options.scrollSensitivity,
|
||||
|
|
@ -679,10 +710,9 @@ var Sortable = {
|
|||
options.droppables.push(element);
|
||||
}
|
||||
|
||||
(this.findElements(element, options) || []).each( function(e) {
|
||||
// handles are per-draggable
|
||||
var handle = options.handle ?
|
||||
$(e).down('.'+options.handle,0) : e;
|
||||
(options.elements || this.findElements(element, options) || []).each( function(e,i) {
|
||||
var handle = options.handles ? $(options.handles[i]) :
|
||||
(options.handle ? $(e).select('.' + options.handle)[0] : e);
|
||||
options.draggables.push(
|
||||
new Draggable(e, Object.extend(options_for_draggable, { handle: handle })));
|
||||
Droppables.add(e, options_for_droppable);
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
// Copyright (c) 2005, 2006 Thomas Fuchs (http://script.aculo.us, http://mir.aculo.us)
|
||||
// Copyright (c) 2005-2008 Thomas Fuchs (http://script.aculo.us, http://mir.aculo.us)
|
||||
// Contributors:
|
||||
// Justin Palmer (http://encytemedia.com/)
|
||||
// Mark Pilgrim (http://diveintomark.org/)
|
||||
|
|
@ -21,7 +21,7 @@ String.prototype.parseColor = function() {
|
|||
}
|
||||
}
|
||||
return (color.length==7 ? color : (arguments[0] || this));
|
||||
}
|
||||
};
|
||||
|
||||
/*--------------------------------------------------------------------------*/
|
||||
|
||||
|
|
@ -30,7 +30,7 @@ Element.collectTextNodes = function(element) {
|
|||
return (node.nodeType==3 ? node.nodeValue :
|
||||
(node.hasChildNodes() ? Element.collectTextNodes(node) : ''));
|
||||
}).flatten().join('');
|
||||
}
|
||||
};
|
||||
|
||||
Element.collectTextNodesIgnoreClass = function(element, className) {
|
||||
return $A($(element).childNodes).collect( function(node) {
|
||||
|
|
@ -38,47 +38,18 @@ Element.collectTextNodesIgnoreClass = function(element, className) {
|
|||
((node.hasChildNodes() && !Element.hasClassName(node,className)) ?
|
||||
Element.collectTextNodesIgnoreClass(node, className) : ''));
|
||||
}).flatten().join('');
|
||||
}
|
||||
};
|
||||
|
||||
Element.setContentZoom = function(element, percent) {
|
||||
element = $(element);
|
||||
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;
|
||||
}
|
||||
|
||||
Element.getOpacity = function(element){
|
||||
element = $(element);
|
||||
var opacity;
|
||||
if (opacity = element.getStyle('opacity'))
|
||||
return parseFloat(opacity);
|
||||
if (opacity = (element.getStyle('filter') || '').match(/alpha\(opacity=(.*)\)/))
|
||||
if(opacity[1]) return parseFloat(opacity[1]) / 100;
|
||||
return 1.0;
|
||||
}
|
||||
|
||||
Element.setOpacity = function(element, value){
|
||||
element= $(element);
|
||||
if (value == 1){
|
||||
element.setStyle({ opacity:
|
||||
(/Gecko/.test(navigator.userAgent) && !/Konqueror|Safari|KHTML/.test(navigator.userAgent)) ?
|
||||
0.999999 : 1.0 });
|
||||
if(/MSIE/.test(navigator.userAgent) && !window.opera)
|
||||
element.setStyle({filter: Element.getStyle(element,'filter').replace(/alpha\([^\)]*\)/gi,'')});
|
||||
} else {
|
||||
if(value < 0.00001) value = 0;
|
||||
element.setStyle({opacity: value});
|
||||
if(/MSIE/.test(navigator.userAgent) && !window.opera)
|
||||
element.setStyle(
|
||||
{ filter: element.getStyle('filter').replace(/alpha\([^\)]*\)/gi,'') +
|
||||
'alpha(opacity='+value*100+')' });
|
||||
}
|
||||
return element;
|
||||
}
|
||||
};
|
||||
|
||||
Element.getInlineOpacity = function(element){
|
||||
return $(element).style.opacity || '';
|
||||
}
|
||||
};
|
||||
|
||||
Element.forceRerendering = function(element) {
|
||||
try {
|
||||
|
|
@ -91,31 +62,63 @@ Element.forceRerendering = function(element) {
|
|||
|
||||
/*--------------------------------------------------------------------------*/
|
||||
|
||||
Array.prototype.call = function() {
|
||||
var args = arguments;
|
||||
this.each(function(f){ f.apply(this, args) });
|
||||
}
|
||||
|
||||
/*--------------------------------------------------------------------------*/
|
||||
|
||||
var Effect = {
|
||||
_elementDoesNotExistError: {
|
||||
name: 'ElementDoesNotExistError',
|
||||
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) {
|
||||
if(typeof Builder == 'undefined')
|
||||
throw("Effect.tagifyText requires including script.aculo.us' builder.js library");
|
||||
|
||||
var tagifyStyle = 'position:relative';
|
||||
if(/MSIE/.test(navigator.userAgent) && !window.opera) tagifyStyle += ';zoom:1';
|
||||
if (Prototype.Browser.IE) tagifyStyle += ';zoom:1';
|
||||
|
||||
element = $(element);
|
||||
$A(element.childNodes).each( function(child) {
|
||||
if (child.nodeType==3) {
|
||||
child.nodeValue.toArray().each( function(character) {
|
||||
element.insertBefore(
|
||||
Builder.node('span',{style: tagifyStyle},
|
||||
new Element('span', {style: tagifyStyle}).update(
|
||||
character == ' ' ? String.fromCharCode(160) : character),
|
||||
child);
|
||||
});
|
||||
|
|
@ -126,7 +129,7 @@ var Effect = {
|
|||
multiple: function(element, effect) {
|
||||
var elements;
|
||||
if (((typeof element == 'object') ||
|
||||
(typeof element == 'function')) &&
|
||||
Object.isFunction(element)) &&
|
||||
(element.length))
|
||||
elements = element;
|
||||
else
|
||||
|
|
@ -158,44 +161,11 @@ var Effect = {
|
|||
}
|
||||
};
|
||||
|
||||
var Effect2 = Effect; // deprecated
|
||||
|
||||
/* ------------- 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;
|
||||
}
|
||||
};
|
||||
Effect.DefaultOptions.transition = Effect.Transitions.sinoidal;
|
||||
|
||||
/* ------------- core effects ------------- */
|
||||
|
||||
Effect.ScopedQueue = Class.create();
|
||||
Object.extend(Object.extend(Effect.ScopedQueue.prototype, Enumerable), {
|
||||
Effect.ScopedQueue = Class.create(Enumerable, {
|
||||
initialize: function() {
|
||||
this.effects = [];
|
||||
this.interval = null;
|
||||
|
|
@ -206,7 +176,7 @@ Object.extend(Object.extend(Effect.ScopedQueue.prototype, Enumerable), {
|
|||
add: function(effect) {
|
||||
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;
|
||||
|
||||
switch(position) {
|
||||
|
|
@ -233,7 +203,7 @@ Object.extend(Object.extend(Effect.ScopedQueue.prototype, Enumerable), {
|
|||
this.effects.push(effect);
|
||||
|
||||
if (!this.interval)
|
||||
this.interval = setInterval(this.loop.bind(this), 40);
|
||||
this.interval = setInterval(this.loop.bind(this), 15);
|
||||
},
|
||||
remove: function(effect) {
|
||||
this.effects = this.effects.reject(function(e) { return e==effect });
|
||||
|
|
@ -244,46 +214,57 @@ Object.extend(Object.extend(Effect.ScopedQueue.prototype, Enumerable), {
|
|||
},
|
||||
loop: function() {
|
||||
var timePos = new Date().getTime();
|
||||
this.effects.invoke('loop', timePos);
|
||||
for(var i=0, len=this.effects.length;i<len;i++)
|
||||
this.effects[i] && this.effects[i].loop(timePos);
|
||||
}
|
||||
});
|
||||
|
||||
Effect.Queues = {
|
||||
instances: $H(),
|
||||
get: function(queueName) {
|
||||
if(typeof queueName != 'string') return queueName;
|
||||
if (!Object.isString(queueName)) return queueName;
|
||||
|
||||
if(!this.instances[queueName])
|
||||
this.instances[queueName] = new Effect.ScopedQueue();
|
||||
|
||||
return this.instances[queueName];
|
||||
}
|
||||
return this.instances.get(queueName) ||
|
||||
this.instances.set(queueName, new Effect.ScopedQueue());
|
||||
}
|
||||
};
|
||||
Effect.Queue = Effect.Queues.get('global');
|
||||
|
||||
Effect.DefaultOptions = {
|
||||
transition: Effect.Transitions.sinoidal,
|
||||
duration: 1.0, // seconds
|
||||
fps: 25.0, // max. 25fps due to Effect.Queue implementation
|
||||
sync: false, // true for combining
|
||||
from: 0.0,
|
||||
to: 1.0,
|
||||
delay: 0.0,
|
||||
queue: 'parallel'
|
||||
}
|
||||
|
||||
Effect.Base = function() {};
|
||||
Effect.Base.prototype = {
|
||||
Effect.Base = Class.create({
|
||||
position: null,
|
||||
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.currentFrame = 0;
|
||||
this.state = 'idle';
|
||||
this.startOn = this.options.delay*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');
|
||||
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);
|
||||
},
|
||||
loop: function(timePos) {
|
||||
|
|
@ -296,34 +277,17 @@ Effect.Base.prototype = {
|
|||
this.event('afterFinish');
|
||||
return;
|
||||
}
|
||||
var pos = (timePos - this.startOn) / (this.finishOn - this.startOn);
|
||||
var frame = Math.round(pos * this.options.fps * this.options.duration);
|
||||
var pos = (timePos - this.startOn) / this.totalTime,
|
||||
frame = (pos * this.totalFrames).round();
|
||||
if (frame > this.currentFrame) {
|
||||
this.render(pos);
|
||||
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() {
|
||||
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);
|
||||
this.state = 'finished';
|
||||
},
|
||||
|
|
@ -332,12 +296,14 @@ Effect.Base.prototype = {
|
|||
if (this.options[eventName]) this.options[eventName](this);
|
||||
},
|
||||
inspect: function() {
|
||||
return '#<Effect:' + $H(this).inspect() + ',options:' + $H(this.options).inspect() + '>';
|
||||
}
|
||||
var data = $H();
|
||||
for(property in this)
|
||||
if (!Object.isFunction(this[property])) data.set(property, this[property]);
|
||||
return '#<Effect:' + data.inspect() + ',options:' + $H(this.options).inspect() + '>';
|
||||
}
|
||||
});
|
||||
|
||||
Effect.Parallel = Class.create();
|
||||
Object.extend(Object.extend(Effect.Parallel.prototype, Effect.Base.prototype), {
|
||||
Effect.Parallel = Class.create(Effect.Base, {
|
||||
initialize: function(effects) {
|
||||
this.effects = effects || [];
|
||||
this.start(arguments[1]);
|
||||
|
|
@ -356,24 +322,34 @@ Object.extend(Object.extend(Effect.Parallel.prototype, Effect.Base.prototype), {
|
|||
}
|
||||
});
|
||||
|
||||
Effect.Event = Class.create();
|
||||
Object.extend(Object.extend(Effect.Event.prototype, Effect.Base.prototype), {
|
||||
Effect.Tween = Class.create(Effect.Base, {
|
||||
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() {
|
||||
var options = Object.extend({
|
||||
duration: 0
|
||||
}, arguments[0] || {});
|
||||
this.start(options);
|
||||
this.start(Object.extend({ duration: 0 }, arguments[0] || { }));
|
||||
},
|
||||
update: Prototype.emptyFunction
|
||||
});
|
||||
|
||||
Effect.Opacity = Class.create();
|
||||
Object.extend(Object.extend(Effect.Opacity.prototype, Effect.Base.prototype), {
|
||||
Effect.Opacity = Class.create(Effect.Base, {
|
||||
initialize: function(element) {
|
||||
this.element = $(element);
|
||||
if (!this.element) throw(Effect._elementDoesNotExistError);
|
||||
// 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});
|
||||
var options = Object.extend({
|
||||
from: this.element.getOpacity() || 0.0,
|
||||
|
|
@ -386,8 +362,7 @@ Object.extend(Object.extend(Effect.Opacity.prototype, Effect.Base.prototype), {
|
|||
}
|
||||
});
|
||||
|
||||
Effect.Move = Class.create();
|
||||
Object.extend(Object.extend(Effect.Move.prototype, Effect.Base.prototype), {
|
||||
Effect.Move = Class.create(Effect.Base, {
|
||||
initialize: function(element) {
|
||||
this.element = $(element);
|
||||
if (!this.element) throw(Effect._elementDoesNotExistError);
|
||||
|
|
@ -399,23 +374,18 @@ Object.extend(Object.extend(Effect.Move.prototype, Effect.Base.prototype), {
|
|||
this.start(options);
|
||||
},
|
||||
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.originalLeft = parseFloat(this.element.getStyle('left') || '0');
|
||||
this.originalTop = parseFloat(this.element.getStyle('top') || '0');
|
||||
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.y = this.options.y - this.originalTop;
|
||||
}
|
||||
},
|
||||
update: function(position) {
|
||||
this.element.setStyle({
|
||||
left: Math.round(this.options.x * position + this.originalLeft) + 'px',
|
||||
top: Math.round(this.options.y * position + this.originalTop) + 'px'
|
||||
left: (this.options.x * position + this.originalLeft).round() + 'px',
|
||||
top: (this.options.y * position + this.originalTop).round() + 'px'
|
||||
});
|
||||
}
|
||||
});
|
||||
|
|
@ -426,8 +396,7 @@ Effect.MoveBy = function(element, toTop, toLeft) {
|
|||
Object.extend({ x: toLeft, y: toTop }, arguments[3] || { }));
|
||||
};
|
||||
|
||||
Effect.Scale = Class.create();
|
||||
Object.extend(Object.extend(Effect.Scale.prototype, Effect.Base.prototype), {
|
||||
Effect.Scale = Class.create(Effect.Base, {
|
||||
initialize: function(element, percent) {
|
||||
this.element = $(element);
|
||||
if (!this.element) throw(Effect._elementDoesNotExistError);
|
||||
|
|
@ -484,8 +453,8 @@ Object.extend(Object.extend(Effect.Scale.prototype, Effect.Base.prototype), {
|
|||
},
|
||||
setDimensions: function(height, width) {
|
||||
var d = { };
|
||||
if(this.options.scaleX) d.width = Math.round(width) + 'px';
|
||||
if(this.options.scaleY) d.height = Math.round(height) + 'px';
|
||||
if (this.options.scaleX) d.width = width.round() + 'px';
|
||||
if (this.options.scaleY) d.height = height.round() + 'px';
|
||||
if (this.options.scaleFromCenter) {
|
||||
var topd = (height - this.dims[0])/2;
|
||||
var leftd = (width - this.dims[1])/2;
|
||||
|
|
@ -501,8 +470,7 @@ Object.extend(Object.extend(Effect.Scale.prototype, Effect.Base.prototype), {
|
|||
}
|
||||
});
|
||||
|
||||
Effect.Highlight = Class.create();
|
||||
Object.extend(Object.extend(Effect.Highlight.prototype, Effect.Base.prototype), {
|
||||
Effect.Highlight = Class.create(Effect.Base, {
|
||||
initialize: function(element) {
|
||||
this.element = $(element);
|
||||
if (!this.element) throw(Effect._elementDoesNotExistError);
|
||||
|
|
@ -513,9 +481,11 @@ Object.extend(Object.extend(Effect.Highlight.prototype, Effect.Base.prototype),
|
|||
// Prevent executing on elements not in the layout flow
|
||||
if (this.element.getStyle('display')=='none') { this.cancel(); return; }
|
||||
// Disable background image during the effect
|
||||
this.oldStyle = {
|
||||
backgroundImage: this.element.getStyle('background-image') };
|
||||
this.oldStyle = { };
|
||||
if (!this.options.keepBackgroundImage) {
|
||||
this.oldStyle.backgroundImage = this.element.getStyle('background-image');
|
||||
this.element.setStyle({backgroundImage: 'none'});
|
||||
}
|
||||
if (!this.options.endcolor)
|
||||
this.options.endcolor = this.element.getStyle('background-color').parseColor('#ffffff');
|
||||
if (!this.options.restorecolor)
|
||||
|
|
@ -526,7 +496,7 @@ Object.extend(Object.extend(Effect.Highlight.prototype, Effect.Base.prototype),
|
|||
},
|
||||
update: function(position) {
|
||||
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() {
|
||||
this.element.setStyle(Object.extend(this.oldStyle, {
|
||||
|
|
@ -535,30 +505,21 @@ Object.extend(Object.extend(Effect.Highlight.prototype, Effect.Base.prototype),
|
|||
}
|
||||
});
|
||||
|
||||
Effect.ScrollTo = Class.create();
|
||||
Object.extend(Object.extend(Effect.ScrollTo.prototype, Effect.Base.prototype), {
|
||||
initialize: function(element) {
|
||||
this.element = $(element);
|
||||
this.start(arguments[1] || {});
|
||||
},
|
||||
setup: function() {
|
||||
Position.prepare();
|
||||
var offsets = Position.cumulativeOffset(this.element);
|
||||
if(this.options.offset) offsets[1] += this.options.offset;
|
||||
var max = window.innerHeight ?
|
||||
window.height - window.innerHeight :
|
||||
document.body.scrollHeight -
|
||||
(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));
|
||||
}
|
||||
});
|
||||
Effect.ScrollTo = function(element) {
|
||||
var options = arguments[1] || { },
|
||||
scrollOffsets = document.viewport.getScrollOffsets(),
|
||||
elementOffsets = $(element).cumulativeOffset(),
|
||||
max = (window.height || document.body.scrollHeight) - document.viewport.getHeight();
|
||||
|
||||
if (options.offset) elementOffsets[1] += options.offset;
|
||||
|
||||
return new Effect.Tween(null,
|
||||
scrollOffsets.top,
|
||||
elementOffsets[1] > max ? max : elementOffsets[1],
|
||||
options,
|
||||
function(p){ scrollTo(scrollOffsets.left, p.round()) }
|
||||
);
|
||||
};
|
||||
|
||||
/* ------------- combination effects ------------- */
|
||||
|
||||
|
|
@ -571,9 +532,10 @@ Effect.Fade = function(element) {
|
|||
afterFinishInternal: function(effect) {
|
||||
if (effect.options.to!=0) return;
|
||||
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) {
|
||||
element = $(element);
|
||||
|
|
@ -588,7 +550,7 @@ Effect.Appear = function(element) {
|
|||
effect.element.setOpacity(effect.options.from).show();
|
||||
}}, arguments[1] || { });
|
||||
return new Effect.Opacity(element,options);
|
||||
}
|
||||
};
|
||||
|
||||
Effect.Puff = function(element) {
|
||||
element = $(element);
|
||||
|
|
@ -612,7 +574,7 @@ Effect.Puff = function(element) {
|
|||
effect.effects[0].element.hide().setStyle(oldStyle); }
|
||||
}, arguments[1] || { })
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
Effect.BlindUp = function(element) {
|
||||
element = $(element);
|
||||
|
|
@ -626,7 +588,7 @@ Effect.BlindUp = function(element) {
|
|||
}
|
||||
}, arguments[1] || { })
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
Effect.BlindDown = function(element) {
|
||||
element = $(element);
|
||||
|
|
@ -644,7 +606,7 @@ Effect.BlindDown = function(element) {
|
|||
effect.element.undoClipping();
|
||||
}
|
||||
}, arguments[1] || { }));
|
||||
}
|
||||
};
|
||||
|
||||
Effect.SwitchOff = function(element) {
|
||||
element = $(element);
|
||||
|
|
@ -666,7 +628,7 @@ Effect.SwitchOff = function(element) {
|
|||
})
|
||||
}
|
||||
}, arguments[1] || { }));
|
||||
}
|
||||
};
|
||||
|
||||
Effect.DropOut = function(element) {
|
||||
element = $(element);
|
||||
|
|
@ -686,28 +648,34 @@ Effect.DropOut = function(element) {
|
|||
effect.effects[0].element.hide().undoPositioned().setStyle(oldStyle);
|
||||
}
|
||||
}, arguments[1] || { }));
|
||||
}
|
||||
};
|
||||
|
||||
Effect.Shake = function(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 = {
|
||||
top: element.getStyle('top'),
|
||||
left: element.getStyle('left') };
|
||||
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,
|
||||
{ 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,
|
||||
{ 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,
|
||||
{ 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,
|
||||
{ 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,
|
||||
{ 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.SlideDown = function(element) {
|
||||
element = $(element).cleanWhitespace();
|
||||
|
|
@ -735,18 +703,20 @@ Effect.SlideDown = function(element) {
|
|||
effect.element.down().undoPositioned().setStyle({bottom: oldInnerBottom}); }
|
||||
}, arguments[1] || { })
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
Effect.SlideUp = function(element) {
|
||||
element = $(element).cleanWhitespace();
|
||||
var oldInnerBottom = element.down().getStyle('bottom');
|
||||
var elementDimensions = element.getDimensions();
|
||||
return new Effect.Scale(element, window.opera ? 0 : 1,
|
||||
Object.extend({ scaleContent: false,
|
||||
scaleX: false,
|
||||
scaleMode: 'box',
|
||||
scaleFrom: 100,
|
||||
scaleMode: {originalHeight: elementDimensions.height, originalWidth: elementDimensions.width},
|
||||
restoreAfterFinish: true,
|
||||
beforeStartInternal: function(effect) {
|
||||
afterSetup: function(effect) {
|
||||
effect.element.makePositioned();
|
||||
effect.element.down().makePositioned();
|
||||
if (window.opera) effect.element.setStyle({top: ''});
|
||||
|
|
@ -757,12 +727,12 @@ Effect.SlideUp = function(element) {
|
|||
(effect.dims[0] - effect.element.clientHeight) + 'px' });
|
||||
},
|
||||
afterFinishInternal: function(effect) {
|
||||
effect.element.hide().undoClipping().undoPositioned().setStyle({bottom: oldInnerBottom});
|
||||
effect.element.down().undoPositioned();
|
||||
effect.element.hide().undoClipping().undoPositioned();
|
||||
effect.element.down().undoPositioned().setStyle({bottom: oldInnerBottom});
|
||||
}
|
||||
}, arguments[1] || { })
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
// Bug in opera makes the TD containing this element expand for a instance after finish
|
||||
Effect.Squish = function(element) {
|
||||
|
|
@ -775,7 +745,7 @@ Effect.Squish = function(element) {
|
|||
effect.element.hide().undoClipping();
|
||||
}
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
Effect.Grow = function(element) {
|
||||
element = $(element);
|
||||
|
|
@ -849,7 +819,7 @@ Effect.Grow = function(element) {
|
|||
)
|
||||
}
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
Effect.Shrink = function(element) {
|
||||
element = $(element);
|
||||
|
|
@ -903,7 +873,7 @@ Effect.Shrink = function(element) {
|
|||
effect.effects[0].element.hide().undoClipping().undoPositioned().setStyle(oldStyle); }
|
||||
}, options)
|
||||
);
|
||||
}
|
||||
};
|
||||
|
||||
Effect.Pulsate = function(element) {
|
||||
element = $(element);
|
||||
|
|
@ -916,7 +886,7 @@ Effect.Pulsate = function(element) {
|
|||
Object.extend(Object.extend({ duration: 2.0, from: 0,
|
||||
afterFinishInternal: function(effect) { effect.element.setStyle({opacity: oldOpacity}); }
|
||||
}, options), {transition: reverser}));
|
||||
}
|
||||
};
|
||||
|
||||
Effect.Fold = function(element) {
|
||||
element = $(element);
|
||||
|
|
@ -939,16 +909,37 @@ Effect.Fold = function(element) {
|
|||
}}, arguments[1] || { }));
|
||||
};
|
||||
|
||||
Effect.Morph = Class.create();
|
||||
Object.extend(Object.extend(Effect.Morph.prototype, Effect.Base.prototype), {
|
||||
Effect.Morph = Class.create(Effect.Base, {
|
||||
initialize: function(element) {
|
||||
this.element = $(element);
|
||||
if (!this.element) throw(Effect._elementDoesNotExistError);
|
||||
var options = Object.extend({
|
||||
style: ''
|
||||
style: { }
|
||||
}, arguments[1] || { });
|
||||
|
||||
if (!Object.isString(options.style)) this.style = $H(options.style);
|
||||
else {
|
||||
if (options.style.include(':'))
|
||||
this.style = options.style.parseStyle();
|
||||
else {
|
||||
this.element.addClassName(options.style);
|
||||
this.style = $H(this.element.getStyles());
|
||||
this.element.removeClassName(options.style);
|
||||
var css = this.element.getStyles();
|
||||
this.style = this.style.reject(function(style) {
|
||||
return style.value == css[style.key];
|
||||
});
|
||||
options.afterFinishInternal = function(effect) {
|
||||
effect.element.addClassName(effect.options.style);
|
||||
effect.transforms.each(function(transform) {
|
||||
effect.element.style[transform.style] = '';
|
||||
});
|
||||
}
|
||||
}
|
||||
}
|
||||
this.start(options);
|
||||
},
|
||||
|
||||
setup: function(){
|
||||
function parseColor(color){
|
||||
if (!color || ['rgba(0, 0, 0, 0)','transparent'].include(color)) color = '#ffffff';
|
||||
|
|
@ -957,16 +948,29 @@ Object.extend(Object.extend(Effect.Morph.prototype, Effect.Base.prototype), {
|
|||
return parseInt( color.slice(i*2+1,i*2+3), 16 )
|
||||
});
|
||||
}
|
||||
this.transforms = this.options.style.parseStyle().map(function(property){
|
||||
var originalValue = this.element.getStyle(property[0]);
|
||||
return $H({
|
||||
style: property[0],
|
||||
originalValue: property[1].unit=='color' ?
|
||||
parseColor(originalValue) : parseFloat(originalValue || 0),
|
||||
targetValue: property[1].unit=='color' ?
|
||||
parseColor(property[1].value) : property[1].value,
|
||||
unit: property[1].unit
|
||||
});
|
||||
this.transforms = this.style.map(function(pair){
|
||||
var property = pair[0], value = pair[1], unit = null;
|
||||
|
||||
if (value.parseColor('#zzzzzz') != '#zzzzzz') {
|
||||
value = value.parseColor();
|
||||
unit = 'color';
|
||||
} else if (property == 'opacity') {
|
||||
value = parseFloat(value);
|
||||
if (Prototype.Browser.IE && (!this.element.currentStyle.hasLayout))
|
||||
this.element.setStyle({zoom: 1});
|
||||
} else if (Element.CSS_LENGTH.test(value)) {
|
||||
var components = value.match(/^([\+\-]?[0-9\.]+)(.*)$/);
|
||||
value = parseFloat(components[1]);
|
||||
unit = (components.length == 3) ? components[2] : null;
|
||||
}
|
||||
|
||||
var originalValue = this.element.getStyle(property);
|
||||
return {
|
||||
style: property.camelize(),
|
||||
originalValue: unit=='color' ? parseColor(originalValue) : parseFloat(originalValue || 0),
|
||||
targetValue: unit=='color' ? parseColor(value) : value,
|
||||
unit: unit
|
||||
};
|
||||
}.bind(this)).reject(function(transform){
|
||||
return (
|
||||
(transform.originalValue == transform.targetValue) ||
|
||||
|
|
@ -978,22 +982,24 @@ Object.extend(Object.extend(Effect.Morph.prototype, Effect.Base.prototype), {
|
|||
});
|
||||
},
|
||||
update: function(position) {
|
||||
var style = $H(), value = null;
|
||||
this.transforms.each(function(transform){
|
||||
value = transform.unit=='color' ?
|
||||
$R(0,2).inject('#',function(m,v,i){
|
||||
return m+(Math.round(transform.originalValue[i]+
|
||||
(transform.targetValue[i] - transform.originalValue[i])*position)).toColorPart() }) :
|
||||
transform.originalValue + Math.round(
|
||||
((transform.targetValue - transform.originalValue) * position) * 1000)/1000 + transform.unit;
|
||||
style[transform.style] = value;
|
||||
});
|
||||
this.element.setStyle(style);
|
||||
var style = { }, transform, i = this.transforms.length;
|
||||
while(i--)
|
||||
style[(transform = this.transforms[i]).style] =
|
||||
transform.unit=='color' ? '#'+
|
||||
(Math.round(transform.originalValue[0]+
|
||||
(transform.targetValue[0]-transform.originalValue[0])*position)).toColorPart() +
|
||||
(Math.round(transform.originalValue[1]+
|
||||
(transform.targetValue[1]-transform.originalValue[1])*position)).toColorPart() +
|
||||
(Math.round(transform.originalValue[2]+
|
||||
(transform.targetValue[2]-transform.originalValue[2])*position)).toColorPart() :
|
||||
(transform.originalValue +
|
||||
(transform.targetValue - transform.originalValue) * position).toFixed(3) +
|
||||
(transform.unit === null ? '' : transform.unit);
|
||||
this.element.setStyle(style, true);
|
||||
}
|
||||
});
|
||||
|
||||
Effect.Transform = Class.create();
|
||||
Object.extend(Effect.Transform.prototype, {
|
||||
Effect.Transform = Class.create({
|
||||
initialize: function(tracks){
|
||||
this.tracks = [];
|
||||
this.options = arguments[1] || { };
|
||||
|
|
@ -1001,9 +1007,10 @@ Object.extend(Effect.Transform.prototype, {
|
|||
},
|
||||
addTracks: function(tracks){
|
||||
tracks.each(function(track){
|
||||
var data = $H(track).values().first();
|
||||
track = $H(track);
|
||||
var data = track.values().first();
|
||||
this.tracks.push($H({
|
||||
ids: $H(track).keys().first(),
|
||||
ids: track.keys().first(),
|
||||
effect: Effect.Morph,
|
||||
options: { style: data }
|
||||
}));
|
||||
|
|
@ -1013,76 +1020,101 @@ Object.extend(Effect.Transform.prototype, {
|
|||
play: function(){
|
||||
return new Effect.Parallel(
|
||||
this.tracks.map(function(track){
|
||||
var elements = [$(track.ids) || $$(track.ids)].flatten();
|
||||
return elements.map(function(e){ return new track.effect(e, Object.extend({ sync:true }, track.options)) });
|
||||
var ids = track.get('ids'), effect = track.get('effect'), options = track.get('options');
|
||||
var elements = [$(ids) || $$(ids)].flatten();
|
||||
return elements.map(function(e){ return new effect(e, Object.extend({ sync:true }, options)) });
|
||||
}).flatten(),
|
||||
this.options
|
||||
);
|
||||
}
|
||||
});
|
||||
|
||||
Element.CSS_PROPERTIES = ['azimuth', 'backgroundAttachment', 'backgroundColor', 'backgroundImage',
|
||||
'backgroundPosition', 'backgroundRepeat', 'borderBottomColor', 'borderBottomStyle',
|
||||
'borderBottomWidth', 'borderCollapse', 'borderLeftColor', 'borderLeftStyle', 'borderLeftWidth',
|
||||
'borderRightColor', 'borderRightStyle', 'borderRightWidth', 'borderSpacing', 'borderTopColor',
|
||||
'borderTopStyle', 'borderTopWidth', 'bottom', 'captionSide', 'clear', 'clip', 'color', 'content',
|
||||
'counterIncrement', 'counterReset', 'cssFloat', 'cueAfter', 'cueBefore', 'cursor', 'direction',
|
||||
'display', 'elevation', 'emptyCells', 'fontFamily', 'fontSize', 'fontSizeAdjust', 'fontStretch',
|
||||
'fontStyle', 'fontVariant', 'fontWeight', 'height', 'left', 'letterSpacing', 'lineHeight',
|
||||
'listStyleImage', 'listStylePosition', 'listStyleType', 'marginBottom', 'marginLeft', 'marginRight',
|
||||
'marginTop', 'markerOffset', 'marks', 'maxHeight', 'maxWidth', 'minHeight', 'minWidth', 'opacity',
|
||||
'orphans', 'outlineColor', 'outlineOffset', 'outlineStyle', 'outlineWidth', 'overflowX', 'overflowY',
|
||||
'paddingBottom', 'paddingLeft', 'paddingRight', 'paddingTop', 'page', 'pageBreakAfter', 'pageBreakBefore',
|
||||
'pageBreakInside', 'pauseAfter', 'pauseBefore', 'pitch', 'pitchRange', 'position', 'quotes',
|
||||
'richness', 'right', 'size', 'speakHeader', 'speakNumeral', 'speakPunctuation', 'speechRate', 'stress',
|
||||
'tableLayout', 'textAlign', 'textDecoration', 'textIndent', 'textShadow', 'textTransform', 'top',
|
||||
'unicodeBidi', 'verticalAlign', 'visibility', 'voiceFamily', 'volume', 'whiteSpace', 'widows',
|
||||
'width', 'wordSpacing', 'zIndex'];
|
||||
Element.CSS_PROPERTIES = $w(
|
||||
'backgroundColor backgroundPosition borderBottomColor borderBottomStyle ' +
|
||||
'borderBottomWidth borderLeftColor borderLeftStyle borderLeftWidth ' +
|
||||
'borderRightColor borderRightStyle borderRightWidth borderSpacing ' +
|
||||
'borderTopColor borderTopStyle borderTopWidth bottom clip color ' +
|
||||
'fontSize fontWeight height left letterSpacing lineHeight ' +
|
||||
'marginBottom marginLeft marginRight marginTop markerOffset maxHeight '+
|
||||
'maxWidth minHeight minWidth opacity outlineColor outlineOffset ' +
|
||||
'outlineWidth paddingBottom paddingLeft paddingRight paddingTop ' +
|
||||
'right textIndent top width wordSpacing zIndex');
|
||||
|
||||
Element.CSS_LENGTH = /^(([\+\-]?[0-9\.]+)(em|ex|px|in|cm|mm|pt|pc|\%))|0$/;
|
||||
|
||||
String.__parseStyleElement = document.createElement('div');
|
||||
String.prototype.parseStyle = function(){
|
||||
var element = Element.extend(document.createElement('div'));
|
||||
element.innerHTML = '<div style="' + this + '"></div>';
|
||||
var style = element.down().style, styleRules = $H();
|
||||
var style, styleRules = $H();
|
||||
if (Prototype.Browser.WebKit)
|
||||
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){
|
||||
if(style[property]) styleRules[property] = style[property];
|
||||
if (style[property]) styleRules.set(property, style[property]);
|
||||
});
|
||||
|
||||
var result = $H();
|
||||
if (Prototype.Browser.IE && this.include('opacity'))
|
||||
styleRules.set('opacity', this.match(/opacity:\s*((?:0|1)?(?:\.\d*)?)/)[1]);
|
||||
|
||||
styleRules.each(function(pair){
|
||||
var property = pair[0], value = pair[1], unit = null;
|
||||
|
||||
if(value.parseColor('#zzzzzz') != '#zzzzzz') {
|
||||
value = value.parseColor();
|
||||
unit = 'color';
|
||||
} else if(Element.CSS_LENGTH.test(value))
|
||||
var components = value.match(/^([\+\-]?[0-9\.]+)(.*)$/),
|
||||
value = parseFloat(components[1]), unit = (components.length == 3) ? components[2] : null;
|
||||
|
||||
result[property.underscore().dasherize()] = $H({ value:value, unit:unit });
|
||||
}.bind(this));
|
||||
|
||||
return result;
|
||||
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(hash, property) {
|
||||
hash.set(property, css[property]);
|
||||
return hash;
|
||||
});
|
||||
if (!styles.opacity) styles.set('opacity', element.getOpacity());
|
||||
return styles;
|
||||
};
|
||||
};
|
||||
|
||||
Effect.Methods = {
|
||||
morph: function(element, style) {
|
||||
element = $(element);
|
||||
new Effect.Morph(element, Object.extend({ style: style }, arguments[2] || { }));
|
||||
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',
|
||||
'collectTextNodes','collectTextNodesIgnoreClass','morph'].each(
|
||||
function(f) { Element.Methods[f] = Element[f]; }
|
||||
$w('fade appear grow shrink fold blindUp blindDown slideUp slideDown '+
|
||||
'pulsate shake puff squish switchOff dropOut').each(
|
||||
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) {
|
||||
s = effect.gsub(/_/, '-').camelize();
|
||||
effect_class = s.charAt(0).toUpperCase() + s.substring(1);
|
||||
new Effect[effect_class](element, options);
|
||||
return $(element);
|
||||
};
|
||||
$w('getInlineOpacity forceRerendering setContentZoom collectTextNodes collectTextNodesIgnoreClass getStyles').each(
|
||||
function(f) { Effect.Methods[f] = Element[f]; }
|
||||
);
|
||||
|
||||
Element.addMethods();
|
||||
Element.addMethods(Effect.Methods);
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
Reference in New Issue