/*
Copyright (c) 2007, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 2.2.2
*/
/**
* The YAHOO object is the single global object used by YUI Library. It
* contains utility function for setting up namespaces, inheritance, and
* logging. YAHOO.util, YAHOO.widget, and YAHOO.example are namespaces
* created automatically for and used by the library.
* @module yahoo
* @title YAHOO Global
*/
/**
* YAHOO_config is not included part of the library. Instead it is an object
* that can be defined by the implementer immediately before including the
* YUI library. The properties included in this object will be used to
* configure global properties needed as soon as the library begins to load.
* @class YAHOO_config
* @static
*/
/**
* A reference to a function that will be executed every time a YAHOO module
* is loaded. As parameter, this function will receive the version
* information for the module. See
* YAHOO.env.getVersion for the description of the version data structure.
* @property listener
* @static
*/
if (typeof YAHOO == "undefined") {
/**
* The YAHOO global namespace object. If YAHOO is already defined, the
* existing YAHOO object will not be overwritten so that defined
* namespaces are preserved.
* @class YAHOO
* @static
*/
var YAHOO = {};
}
/**
* Returns the namespace specified and creates it if it doesn't exist
*
* Either of the above would create YAHOO.property, then
* YAHOO.property.package
*
* Be careful when naming packages. Reserved words may work in some browsers
* and not others. For instance, the following will fail in Safari:
*
* This fails because "long" is a future reserved word in ECMAScript
*
* @method namespace
* @static
* @param {String*} arguments 1-n namespaces to create
* @return {Object} A reference to the last namespace object created
*/
YAHOO.namespace = function() {
var a=arguments, o=null, i, j, d;
for (i=0; i
*
name:
The name of the module
*
version:
The version in use
*
build:
The build number in use
*
versions:
All versions that were registered
*
builds:
All builds that were registered.
*
mainClass:
An object that was was stamped with the
* current version and build. If
* mainClass.VERSION != version or mainClass.BUILD != build,
* multiple versions of pieces of the library have been
* loaded, potentially causing issues.
*
*
* @method getVersion
* @static
* @param {String} name the name of the module (event, slider, etc)
* @return {Object} The version info
*/
getVersion: function(name) {
return YAHOO.env.modules[name] || null;
}
};
/**
* Provides the language utilites and extensions used by the library
* @class YAHOO.lang
*/
YAHOO.lang = {
/**
* Determines whether or not the provided object is an array
* @method isArray
* @param {any} obj The object being testing
* @return Boolean
*/
isArray: function(obj) { // frames lose type, so test constructor string
if (obj && obj.constructor &&
obj.constructor.toString().indexOf('Array') > -1) {
return true;
} else {
return YAHOO.lang.isObject(obj) && obj.constructor == Array;
}
},
/**
* Determines whether or not the provided object is a boolean
* @method isBoolean
* @param {any} obj The object being testing
* @return Boolean
*/
isBoolean: function(obj) {
return typeof obj == 'boolean';
},
/**
* Determines whether or not the provided object is a function
* @method isFunction
* @param {any} obj The object being testing
* @return Boolean
*/
isFunction: function(obj) {
return typeof obj == 'function';
},
/**
* Determines whether or not the provided object is null
* @method isNull
* @param {any} obj The object being testing
* @return Boolean
*/
isNull: function(obj) {
return obj === null;
},
/**
* Determines whether or not the provided object is a legal number
* @method isNumber
* @param {any} obj The object being testing
* @return Boolean
*/
isNumber: function(obj) {
return typeof obj == 'number' && isFinite(obj);
},
/**
* Determines whether or not the provided object is of type object
* or function
* @method isObject
* @param {any} obj The object being testing
* @return Boolean
*/
isObject: function(obj) {
return obj && (typeof obj == 'object' || YAHOO.lang.isFunction(obj));
},
/**
* Determines whether or not the provided object is a string
* @method isString
* @param {any} obj The object being testing
* @return Boolean
*/
isString: function(obj) {
return typeof obj == 'string';
},
/**
* Determines whether or not the provided object is undefined
* @method isUndefined
* @param {any} obj The object being testing
* @return Boolean
*/
isUndefined: function(obj) {
return typeof obj == 'undefined';
},
/**
* Determines whether or not the property was added
* to the object instance. Returns false if the property is not present
* in the object, or was inherited from the prototype.
* This abstraction is provided to enable hasOwnProperty for Safari 1.3.x.
* There is a discrepancy between YAHOO.lang.hasOwnProperty and
* Object.prototype.hasOwnProperty when the property is a primitive added to
* both the instance AND prototype with the same value:
*
* var A = function() {};
* A.prototype.foo = 'foo';
* var a = new A();
* a.foo = 'foo';
* alert(a.hasOwnProperty('foo')); // true
* alert(YAHOO.lang.hasOwnProperty(a, 'foo')); // false when using fallback
*
* @method hasOwnProperty
* @param {any} obj The object being testing
* @return Boolean
*/
hasOwnProperty: function(obj, prop) {
if (Object.prototype.hasOwnProperty) {
return obj.hasOwnProperty(prop);
}
return !YAHOO.lang.isUndefined(obj[prop]) &&
obj.constructor.prototype[prop] !== obj[prop];
},
/**
* Utility to set up the prototype, constructor and superclass properties to
* support an inheritance strategy that can chain constructors and methods.
*
* @method extend
* @static
* @param {Function} subc the object to modify
* @param {Function} superc the object to inherit
* @param {Object} overrides additional properties/methods to add to the
* subclass prototype. These will override the
* matching items obtained from the superclass
* if present.
*/
extend: function(subc, superc, overrides) {
if (!superc||!subc) {
throw new Error("YAHOO.lang.extend failed, please check that " +
"all dependencies are included.");
}
var F = function() {};
F.prototype=superc.prototype;
subc.prototype=new F();
subc.prototype.constructor=subc;
subc.superclass=superc.prototype;
if (superc.prototype.constructor == Object.prototype.constructor) {
superc.prototype.constructor=superc;
}
if (overrides) {
for (var i in overrides) {
subc.prototype[i]=overrides[i];
}
}
},
/**
* Applies all prototype properties in the supplier to the receiver if the
* receiver does not have these properties yet. Optionally, one or more
* methods/properties can be specified (as additional parameters). This
* option will overwrite the property if receiver has it already.
*
* @method augment
* @static
* @param {Function} r the object to receive the augmentation
* @param {Function} s the object that supplies the properties to augment
* @param {String*} arguments zero or more properties methods to augment the
* receiver with. If none specified, everything
* in the supplier will be used unless it would
* overwrite an existing property in the receiver
*/
augment: function(r, s) {
if (!s||!r) {
throw new Error("YAHOO.lang.augment failed, please check that " +
"all dependencies are included.");
}
var rp=r.prototype, sp=s.prototype, a=arguments, i, p;
if (a[2]) {
for (i=2; iYAHOO.lang
* @class YAHOO.util.Lang
*/
YAHOO.util.Lang = YAHOO.lang;
/**
* An alias for YAHOO.lang.augment
* @for YAHOO
* @method augment
* @static
* @param {Function} r the object to receive the augmentation
* @param {Function} s the object that supplies the properties to augment
* @param {String*} arguments zero or more properties methods to augment the
* receiver with. If none specified, everything
* in the supplier will be used unless it would
* overwrite an existing property in the receiver
*/
YAHOO.augment = YAHOO.lang.augment;
/**
* An alias for YAHOO.lang.extend
* @method extend
* @static
* @param {Function} subc the object to modify
* @param {Function} superc the object to inherit
* @param {Object} overrides additional properties/methods to add to the
* subclass prototype. These will override the
* matching items obtained from the superclass
* if present.
*/
YAHOO.extend = YAHOO.lang.extend;
YAHOO.register("yahoo", YAHOO, {version: "2.2.2", build: "204"});
/*
Copyright (c) 2007, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 2.2.2
*/
/**
* The CustomEvent class lets you define events for your application
* that can be subscribed to by one or more independent component.
*
* @param {String} type The type of event, which is passed to the callback
* when the event fires
* @param {Object} oScope The context the event will fire from. "this" will
* refer to this object in the callback. Default value:
* the window object. The listener can override this.
* @param {boolean} silent pass true to prevent the event from writing to
* the debugsystem
* @param {int} signature the signature that the custom event subscriber
* will receive. YAHOO.util.CustomEvent.LIST or
* YAHOO.util.CustomEvent.FLAT. The default is
* YAHOO.util.CustomEvent.LIST.
* @namespace YAHOO.util
* @class CustomEvent
* @constructor
*/
YAHOO.util.CustomEvent = function(type, oScope, silent, signature) {
/**
* The type of event, returned to subscribers when the event fires
* @property type
* @type string
*/
this.type = type;
/**
* The scope the the event will fire from by default. Defaults to the window
* obj
* @property scope
* @type object
*/
this.scope = oScope || window;
/**
* By default all custom events are logged in the debug build, set silent
* to true to disable debug outpu for this event.
* @property silent
* @type boolean
*/
this.silent = silent;
/**
* Custom events support two styles of arguments provided to the event
* subscribers.
*
*
YAHOO.util.CustomEvent.LIST:
*
*
param1: event name
*
param2: array of arguments sent to fire
*
param3: a custom object supplied by the subscriber
*
*
*
YAHOO.util.CustomEvent.FLAT
*
*
param1: the first argument passed to fire. If you need to
* pass multiple parameters, use and array or object literal
*
param2: a custom object supplied by the subscriber
*
*
*
* @property signature
* @type int
*/
this.signature = signature || YAHOO.util.CustomEvent.LIST;
/**
* The subscribers to this event
* @property subscribers
* @type Subscriber[]
*/
this.subscribers = [];
if (!this.silent) {
}
var onsubscribeType = "_YUICEOnSubscribe";
// Only add subscribe events for events that are not generated by
// CustomEvent
if (type !== onsubscribeType) {
/**
* Custom events provide a custom event that fires whenever there is
* a new subscriber to the event. This provides an opportunity to
* handle the case where there is a non-repeating event that has
* already fired has a new subscriber.
*
* @event subscribeEvent
* @type YAHOO.util.CustomEvent
* @param {Function} fn The function to execute
* @param {Object} obj An object to be passed along when the event
* fires
* @param {boolean|Object} override If true, the obj passed in becomes
* the execution scope of the listener.
* if an object, that object becomes the
* the execution scope.
*/
this.subscribeEvent =
new YAHOO.util.CustomEvent(onsubscribeType, this, true);
}
};
/**
* Subscriber listener sigature constant. The LIST type returns three
* parameters: the event type, the array of args passed to fire, and
* the optional custom object
* @property YAHOO.util.CustomEvent.LIST
* @static
* @type int
*/
YAHOO.util.CustomEvent.LIST = 0;
/**
* Subscriber listener sigature constant. The FLAT type returns two
* parameters: the first argument passed to fire and the optional
* custom object
* @property YAHOO.util.CustomEvent.FLAT
* @static
* @type int
*/
YAHOO.util.CustomEvent.FLAT = 1;
YAHOO.util.CustomEvent.prototype = {
/**
* Subscribes the caller to this event
* @method subscribe
* @param {Function} fn The function to execute
* @param {Object} obj An object to be passed along when the event
* fires
* @param {boolean|Object} override If true, the obj passed in becomes
* the execution scope of the listener.
* if an object, that object becomes the
* the execution scope.
*/
subscribe: function(fn, obj, override) {
if (!fn) {
throw new Error("Invalid callback for subscriber to '" + this.type + "'");
}
if (this.subscribeEvent) {
this.subscribeEvent.fire(fn, obj, override);
}
this.subscribers.push( new YAHOO.util.Subscriber(fn, obj, override) );
},
/**
* Unsubscribes subscribers.
* @method unsubscribe
* @param {Function} fn The subscribed function to remove, if not supplied
* all will be removed
* @param {Object} obj The custom object passed to subscribe. This is
* optional, but if supplied will be used to
* disambiguate multiple listeners that are the same
* (e.g., you subscribe many object using a function
* that lives on the prototype)
* @return {boolean} True if the subscriber was found and detached.
*/
unsubscribe: function(fn, obj) {
if (!fn) {
return this.unsubscribeAll();
}
var found = false;
for (var i=0, len=this.subscribers.length; i
*
The type of event
*
All of the arguments fire() was executed with as an array
*
The custom object (if any) that was passed into the subscribe()
* method
*
* @method fire
* @param {Object*} arguments an arbitrary set of parameters to pass to
* the handler.
* @return {boolean} false if one of the subscribers returned false,
* true otherwise
*/
fire: function() {
var len=this.subscribers.length;
if (!len && this.silent) {
return true;
}
var args=[], ret=true, i;
for (i=0; i 0) {
param = args[0];
}
ret = s.fn.call(scope, param, s.obj);
} else {
ret = s.fn.call(scope, this.type, args, s.obj);
}
if (false === ret) {
if (!this.silent) {
}
//break;
return false;
}
}
}
return true;
},
/**
* Removes all listeners
* @method unsubscribeAll
* @return {int} The number of listeners unsubscribed
*/
unsubscribeAll: function() {
for (var i=0, len=this.subscribers.length; i= 0) {
cacheItem = listeners[index];
}
if (!el || !cacheItem) {
return false;
}
if (this.useLegacyEvent(el, sType)) {
var legacyIndex = this.getLegacyIndex(el, sType);
var llist = legacyHandlers[legacyIndex];
if (llist) {
for (i=0, len=llist.length; i 0);
}
// onAvailable
var notAvail = [];
var executeItem = function (el, item) {
var scope = el;
if (item.override) {
if (item.override === true) {
scope = item.obj;
} else {
scope = item.override;
}
}
item.fn.call(scope, item.obj);
};
var i,len,item,el;
// onAvailable
for (i=0,len=onAvailStack.length; i 0) {
for (var i=0,len=searchList.length; i 0) {
j = listeners.length;
while (j) {
index = j-1;
l = listeners[index];
if (l) {
EU.removeListener(l[EU.EL], l[EU.TYPE],
l[EU.FN], index);
}
j = j - 1;
}
l=null;
EU.clearCache();
}
for (i=0,len=legacyEvents.length; i');
var el = document.getElementById("_yui_eu_dr");
el.onreadystatechange = function() {
if ("complete" == this.readyState) {
this.parentNode.removeChild(this);
YAHOO.util.Event._ready();
}
};
el=null;
// Process onAvailable/onContentReady items when when the
// DOM is ready.
YAHOO.util.Event.onDOMReady(
YAHOO.util.Event._tryPreloadAttach,
YAHOO.util.Event, true);
// Safari: The document's readyState in Safari currently will
// change to loaded/complete before images are loaded.
} else if (EU.webkit) {
EU._drwatch = setInterval(function(){
var rs=document.readyState;
if ("loaded" == rs || "complete" == rs) {
clearInterval(EU._drwatch);
EU._drwatch = null;
EU._ready();
}
}, EU.POLL_INTERVAL);
// FireFox and Opera: These browsers provide a event for this
// moment.
} else {
EU._simpleAdd(document, "DOMContentLoaded", EU._ready);
}
/////////////////////////////////////////////////////////////
EU._simpleAdd(window, "load", EU._load);
EU._simpleAdd(window, "unload", EU._unload);
EU._tryPreloadAttach();
})();
}
/**
* EventProvider is designed to be used with YAHOO.augment to wrap
* CustomEvents in an interface that allows events to be subscribed to
* and fired by name. This makes it possible for implementing code to
* subscribe to an event that either has not been created yet, or will
* not be created at all.
*
* @Class EventProvider
*/
YAHOO.util.EventProvider = function() { };
YAHOO.util.EventProvider.prototype = {
/**
* Private storage of custom events
* @property __yui_events
* @type Object[]
* @private
*/
__yui_events: null,
/**
* Private storage of custom event subscribers
* @property __yui_subscribers
* @type Object[]
* @private
*/
__yui_subscribers: null,
/**
* Subscribe to a CustomEvent by event type
*
* @method subscribe
* @param p_type {string} the type, or name of the event
* @param p_fn {function} the function to exectute when the event fires
* @param p_obj
* @param p_obj {Object} An object to be passed along when the event
* fires
* @param p_override {boolean} If true, the obj passed in becomes the
* execution scope of the listener
*/
subscribe: function(p_type, p_fn, p_obj, p_override) {
this.__yui_events = this.__yui_events || {};
var ce = this.__yui_events[p_type];
if (ce) {
ce.subscribe(p_fn, p_obj, p_override);
} else {
this.__yui_subscribers = this.__yui_subscribers || {};
var subs = this.__yui_subscribers;
if (!subs[p_type]) {
subs[p_type] = [];
}
subs[p_type].push(
{ fn: p_fn, obj: p_obj, override: p_override } );
}
},
/**
* Unsubscribes one or more listeners the from the specified event
* @method unsubscribe
* @param p_type {string} The type, or name of the event
* @param p_fn {Function} The subscribed function to unsubscribe, if not
* supplied, all subscribers will be removed.
* @param p_obj {Object} The custom object passed to subscribe. This is
* optional, but if supplied will be used to
* disambiguate multiple listeners that are the same
* (e.g., you subscribe many object using a function
* that lives on the prototype)
* @return {boolean} true if the subscriber was found and detached.
*/
unsubscribe: function(p_type, p_fn, p_obj) {
this.__yui_events = this.__yui_events || {};
var ce = this.__yui_events[p_type];
if (ce) {
return ce.unsubscribe(p_fn, p_obj);
} else {
return false;
}
},
/**
* Removes all listeners from the specified event
* @method unsubscribeAll
* @param p_type {string} The type, or name of the event
*/
unsubscribeAll: function(p_type) {
return this.unsubscribe(p_type);
},
/**
* Creates a new custom event of the specified type. If a custom event
* by that name already exists, it will not be re-created. In either
* case the custom event is returned.
*
* @method createEvent
*
* @param p_type {string} the type, or name of the event
* @param p_config {object} optional config params. Valid properties are:
*
*
*
* scope: defines the default execution scope. If not defined
* the default scope will be this instance.
*
*
* silent: if true, the custom event will not generate log messages.
* This is false by default.
*
*
* onSubscribeCallback: specifies a callback to execute when the
* event has a new subscriber. This will fire immediately for
* each queued subscriber if any exist prior to the creation of
* the event.
*
*
*
* @return {CustomEvent} the custom event
*
*/
createEvent: function(p_type, p_config) {
this.__yui_events = this.__yui_events || {};
var opts = p_config || {};
var events = this.__yui_events;
if (events[p_type]) {
} else {
var scope = opts.scope || this;
var silent = opts.silent || null;
var ce = new YAHOO.util.CustomEvent(p_type, scope, silent,
YAHOO.util.CustomEvent.FLAT);
events[p_type] = ce;
if (opts.onSubscribeCallback) {
ce.subscribeEvent.subscribe(opts.onSubscribeCallback);
}
this.__yui_subscribers = this.__yui_subscribers || {};
var qs = this.__yui_subscribers[p_type];
if (qs) {
for (var i=0; i
*
The first argument fire() was executed with
*
The custom object (if any) that was passed into the subscribe()
* method
*
* @method fireEvent
* @param p_type {string} the type, or name of the event
* @param arguments {Object*} an arbitrary set of parameters to pass to
* the handler.
* @return {boolean} the return value from CustomEvent.fire, or null if
* the custom event does not exist.
*/
fireEvent: function(p_type, arg1, arg2, etc) {
this.__yui_events = this.__yui_events || {};
var ce = this.__yui_events[p_type];
if (ce) {
var args = [];
for (var i=1; i -1),
isSafari = (ua.indexOf('safari') > -1),
isGecko = (!isOpera && !isSafari && ua.indexOf('gecko') > -1),
isIE = (!isOpera && ua.indexOf('msie') > -1);
// regex cache
var patterns = {
HYPHEN: /(-[a-z])/i, // to normalize get/setStyle
ROOT_TAG: /body|html/i // body for quirks mode, html for standards
};
var toCamel = function(property) {
if ( !patterns.HYPHEN.test(property) ) {
return property; // no hyphens
}
if (propertyCache[property]) { // already converted
return propertyCache[property];
}
var converted = property;
while( patterns.HYPHEN.exec(converted) ) {
converted = converted.replace(RegExp.$1,
RegExp.$1.substr(1).toUpperCase());
}
propertyCache[property] = converted;
return converted;
//return property.replace(/-([a-z])/gi, function(m0, m1) {return m1.toUpperCase()}) // cant use function as 2nd arg yet due to safari bug
};
// branching at load instead of runtime
if (document.defaultView && document.defaultView.getComputedStyle) { // W3C DOM method
getStyle = function(el, property) {
var value = null;
if (property == 'float') { // fix reserved word
property = 'cssFloat';
}
var computed = document.defaultView.getComputedStyle(el, '');
if (computed) { // test computed before touching for safari
value = computed[toCamel(property)];
}
return el.style[property] || value;
};
} else if (document.documentElement.currentStyle && isIE) { // IE method
getStyle = function(el, property) {
switch( toCamel(property) ) {
case 'opacity' :// IE opacity uses filter
var val = 100;
try { // will error if no DXImageTransform
val = el.filters['DXImageTransform.Microsoft.Alpha'].opacity;
} catch(e) {
try { // make sure its in the document
val = el.filters('alpha').opacity;
} catch(e) {
}
}
return val / 100;
break;
case 'float': // fix reserved word
property = 'styleFloat'; // fall through
default:
// test currentStyle before touching
var value = el.currentStyle ? el.currentStyle[property] : null;
return ( el.style[property] || value );
}
};
} else { // default to inline only
getStyle = function(el, property) { return el.style[property]; };
}
if (isIE) {
setStyle = function(el, property, val) {
switch (property) {
case 'opacity':
if ( YAHOO.lang.isString(el.style.filter) ) { // in case not appended
el.style.filter = 'alpha(opacity=' + val * 100 + ')';
if (!el.currentStyle || !el.currentStyle.hasLayout) {
el.style.zoom = 1; // when no layout or cant tell
}
}
break;
case 'float':
property = 'styleFloat';
default:
el.style[property] = val;
}
};
} else {
setStyle = function(el, property, val) {
if (property == 'float') {
property = 'cssFloat';
}
el.style[property] = val;
};
}
/**
* Provides helper methods for DOM elements.
* @namespace YAHOO.util
* @class Dom
*/
YAHOO.util.Dom = {
/**
* Returns an HTMLElement reference.
* @method get
* @param {String | HTMLElement |Array} el Accepts a string to use as an ID for getting a DOM reference, an actual DOM reference, or an Array of IDs and/or HTMLElements.
* @return {HTMLElement | Array} A DOM reference to an HTML element or an array of HTMLElements.
*/
get: function(el) {
if ( YAHOO.lang.isString(el) ) { // ID
return document.getElementById(el);
}
if ( YAHOO.lang.isArray(el) ) { // Array of IDs and/or HTMLElements
var c = [];
for (var i = 0, len = el.length; i < len; ++i) {
c[c.length] = Y.Dom.get(el[i]);
}
return c;
}
if (el) { // assuming HTMLElement or HTMLCollection, just pass back
return el;
}
return null; // el is likely null or undefined
},
/**
* Normalizes currentStyle and ComputedStyle.
* @method getStyle
* @param {String | HTMLElement |Array} el Accepts a string to use as an ID, an actual DOM reference, or an Array of IDs and/or HTMLElements.
* @param {String} property The style property whose value is returned.
* @return {String | Array} The current value of the style property for the element(s).
*/
getStyle: function(el, property) {
property = toCamel(property);
var f = function(element) {
return getStyle(element, property);
};
return Y.Dom.batch(el, f, Y.Dom, true);
},
/**
* Wrapper for setting style properties of HTMLElements. Normalizes "opacity" across modern browsers.
* @method setStyle
* @param {String | HTMLElement | Array} el Accepts a string to use as an ID, an actual DOM reference, or an Array of IDs and/or HTMLElements.
* @param {String} property The style property to be set.
* @param {String} val The value to apply to the given property.
*/
setStyle: function(el, property, val) {
property = toCamel(property);
var f = function(element) {
setStyle(element, property, val);
};
Y.Dom.batch(el, f, Y.Dom, true);
},
/**
* Gets the current position of an element based on page coordinates. Element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
* @method getXY
* @param {String | HTMLElement | Array} el Accepts a string to use as an ID, an actual DOM reference, or an Array of IDs and/or HTMLElements
* @return {Array} The XY position of the element(s)
*/
getXY: function(el) {
var f = function(el) {
// has to be part of document to have pageXY
if ( (el.parentNode === null || el.offsetParent === null ||
this.getStyle(el, 'display') == 'none') && el != document.body) {
return false;
}
var parentNode = null;
var pos = [];
var box;
if (el.getBoundingClientRect) { // IE
box = el.getBoundingClientRect();
var doc = document;
if ( !this.inDocument(el) && parent.document != document) {// might be in a frame, need to get its scroll
doc = parent.document;
if ( !this.isAncestor(doc.documentElement, el) ) {
return false;
}
}
var scrollTop = Math.max(doc.documentElement.scrollTop, doc.body.scrollTop);
var scrollLeft = Math.max(doc.documentElement.scrollLeft, doc.body.scrollLeft);
return [box.left + scrollLeft, box.top + scrollTop];
}
else { // safari, opera, & gecko
pos = [el.offsetLeft, el.offsetTop];
parentNode = el.offsetParent;
// safari: if el is abs or any parent is abs, subtract body offsets
var hasAbs = this.getStyle(el, 'position') == 'absolute';
if (parentNode != el) {
while (parentNode) {
pos[0] += parentNode.offsetLeft;
pos[1] += parentNode.offsetTop;
if (isSafari && !hasAbs &&
this.getStyle(parentNode,'position') == 'absolute' ) {
hasAbs = true; // we need to offset if any parent is absolutely positioned
}
parentNode = parentNode.offsetParent;
}
}
if (isSafari && hasAbs) { //safari doubles in this case
pos[0] -= document.body.offsetLeft;
pos[1] -= document.body.offsetTop;
}
}
parentNode = el.parentNode;
// account for any scrolled ancestors
while ( parentNode.tagName && !patterns.ROOT_TAG.test(parentNode.tagName) )
{
// work around opera inline scrollLeft/Top bug
if (Y.Dom.getStyle(parentNode, 'display') != 'inline') {
pos[0] -= parentNode.scrollLeft;
pos[1] -= parentNode.scrollTop;
}
parentNode = parentNode.parentNode;
}
return pos;
};
return Y.Dom.batch(el, f, Y.Dom, true);
},
/**
* Gets the current X position of an element based on page coordinates. The element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
* @method getX
* @param {String | HTMLElement | Array} el Accepts a string to use as an ID, an actual DOM reference, or an Array of IDs and/or HTMLElements
* @return {String | Array} The X position of the element(s)
*/
getX: function(el) {
var f = function(el) {
return Y.Dom.getXY(el)[0];
};
return Y.Dom.batch(el, f, Y.Dom, true);
},
/**
* Gets the current Y position of an element based on page coordinates. Element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
* @method getY
* @param {String | HTMLElement | Array} el Accepts a string to use as an ID, an actual DOM reference, or an Array of IDs and/or HTMLElements
* @return {String | Array} The Y position of the element(s)
*/
getY: function(el) {
var f = function(el) {
return Y.Dom.getXY(el)[1];
};
return Y.Dom.batch(el, f, Y.Dom, true);
},
/**
* Set the position of an html element in page coordinates, regardless of how the element is positioned.
* The element(s) must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
* @method setXY
* @param {String | HTMLElement | Array} el Accepts a string to use as an ID, an actual DOM reference, or an Array of IDs and/or HTMLElements
* @param {Array} pos Contains X & Y values for new position (coordinates are page-based)
* @param {Boolean} noRetry By default we try and set the position a second time if the first fails
*/
setXY: function(el, pos, noRetry) {
var f = function(el) {
var style_pos = this.getStyle(el, 'position');
if (style_pos == 'static') { // default to relative
this.setStyle(el, 'position', 'relative');
style_pos = 'relative';
}
var pageXY = this.getXY(el);
if (pageXY === false) { // has to be part of doc to have pageXY
return false;
}
var delta = [ // assuming pixels; if not we will have to retry
parseInt( this.getStyle(el, 'left'), 10 ),
parseInt( this.getStyle(el, 'top'), 10 )
];
if ( isNaN(delta[0]) ) {// in case of 'auto'
delta[0] = (style_pos == 'relative') ? 0 : el.offsetLeft;
}
if ( isNaN(delta[1]) ) { // in case of 'auto'
delta[1] = (style_pos == 'relative') ? 0 : el.offsetTop;
}
if (pos[0] !== null) { el.style.left = pos[0] - pageXY[0] + delta[0] + 'px'; }
if (pos[1] !== null) { el.style.top = pos[1] - pageXY[1] + delta[1] + 'px'; }
if (!noRetry) {
var newXY = this.getXY(el);
// if retry is true, try one more time if we miss
if ( (pos[0] !== null && newXY[0] != pos[0]) ||
(pos[1] !== null && newXY[1] != pos[1]) ) {
this.setXY(el, pos, true);
}
}
};
Y.Dom.batch(el, f, Y.Dom, true);
},
/**
* Set the X position of an html element in page coordinates, regardless of how the element is positioned.
* The element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
* @method setX
* @param {String | HTMLElement | Array} el Accepts a string to use as an ID, an actual DOM reference, or an Array of IDs and/or HTMLElements.
* @param {Int} x The value to use as the X coordinate for the element(s).
*/
setX: function(el, x) {
Y.Dom.setXY(el, [x, null]);
},
/**
* Set the Y position of an html element in page coordinates, regardless of how the element is positioned.
* The element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false).
* @method setY
* @param {String | HTMLElement | Array} el Accepts a string to use as an ID, an actual DOM reference, or an Array of IDs and/or HTMLElements.
* @param {Int} x To use as the Y coordinate for the element(s).
*/
setY: function(el, y) {
Y.Dom.setXY(el, [null, y]);
},
/**
* Returns the region position of the given element.
* The element must be part of the DOM tree to have a region (display:none or elements not appended return false).
* @method getRegion
* @param {String | HTMLElement | Array} el Accepts a string to use as an ID, an actual DOM reference, or an Array of IDs and/or HTMLElements.
* @return {Region | Array} A Region or array of Region instances containing "top, left, bottom, right" member data.
*/
getRegion: function(el) {
var f = function(el) {
var region = new Y.Region.getRegion(el);
return region;
};
return Y.Dom.batch(el, f, Y.Dom, true);
},
/**
* Returns the width of the client (viewport).
* @method getClientWidth
* @deprecated Now using getViewportWidth. This interface left intact for back compat.
* @return {Int} The width of the viewable area of the page.
*/
getClientWidth: function() {
return Y.Dom.getViewportWidth();
},
/**
* Returns the height of the client (viewport).
* @method getClientHeight
* @deprecated Now using getViewportHeight. This interface left intact for back compat.
* @return {Int} The height of the viewable area of the page.
*/
getClientHeight: function() {
return Y.Dom.getViewportHeight();
},
/**
* Returns a array of HTMLElements with the given class.
* For optimized performance, include a tag and/or root node when possible.
* @method getElementsByClassName
* @param {String} className The class name to match against
* @param {String} tag (optional) The tag name of the elements being collected
* @param {String | HTMLElement} root (optional) The HTMLElement or an ID to use as the starting point
* @return {Array} An array of elements that have the given class name
*/
getElementsByClassName: function(className, tag, root) {
var method = function(el) { return Y.Dom.hasClass(el, className); };
return Y.Dom.getElementsBy(method, tag, root);
},
/**
* Determines whether an HTMLElement has the given className.
* @method hasClass
* @param {String | HTMLElement | Array} el The element or collection to test
* @param {String} className the class name to search for
* @return {Boolean | Array} A boolean value or array of boolean values
*/
hasClass: function(el, className) {
var re = new RegExp('(?:^|\\s+)' + className + '(?:\\s+|$)');
var f = function(el) {
return re.test(el.className);
};
return Y.Dom.batch(el, f, Y.Dom, true);
},
/**
* Adds a class name to a given element or collection of elements.
* @method addClass
* @param {String | HTMLElement | Array} el The element or collection to add the class to
* @param {String} className the class name to add to the class attribute
*/
addClass: function(el, className) {
var f = function(el) {
if (this.hasClass(el, className)) { return; } // already present
el.className = [el.className, className].join(' ');
};
Y.Dom.batch(el, f, Y.Dom, true);
},
/**
* Removes a class name from a given element or collection of elements.
* @method removeClass
* @param {String | HTMLElement | Array} el The element or collection to remove the class from
* @param {String} className the class name to remove from the class attribute
*/
removeClass: function(el, className) {
var re = new RegExp('(?:^|\\s+)' + className + '(?:\\s+|$)', 'g');
var f = function(el) {
if (!this.hasClass(el, className)) {
return; // not present
}
var c = el.className;
el.className = c.replace(re, ' ');
if ( this.hasClass(el, className) ) { // in case of multiple adjacent
this.removeClass(el, className);
}
};
Y.Dom.batch(el, f, Y.Dom, true);
},
/**
* Replace a class with another class for a given element or collection of elements.
* If no oldClassName is present, the newClassName is simply added.
* @method replaceClass
* @param {String | HTMLElement | Array} el The element or collection to remove the class from
* @param {String} oldClassName the class name to be replaced
* @param {String} newClassName the class name that will be replacing the old class name
*/
replaceClass: function(el, oldClassName, newClassName) {
if (oldClassName === newClassName) { // avoid infinite loop
return false;
}
var re = new RegExp('(?:^|\\s+)' + oldClassName + '(?:\\s+|$)', 'g');
var f = function(el) {
if ( !this.hasClass(el, oldClassName) ) {
this.addClass(el, newClassName); // just add it if nothing to replace
return; // note return
}
el.className = el.className.replace(re, ' ' + newClassName + ' ');
if ( this.hasClass(el, oldClassName) ) { // in case of multiple adjacent
this.replaceClass(el, oldClassName, newClassName);
}
};
Y.Dom.batch(el, f, Y.Dom, true);
},
/**
* Generates a unique ID
* @method generateId
* @param {String | HTMLElement | Array} el (optional) An optional element array of elements to add an ID to (no ID is added if one is already present).
* @param {String} prefix (optional) an optional prefix to use (defaults to "yui-gen").
* @return {String | Array} The generated ID, or array of generated IDs (or original ID if already present on an element)
*/
generateId: function(el, prefix) {
prefix = prefix || 'yui-gen';
el = el || {};
var f = function(el) {
if (el) {
el = Y.Dom.get(el);
} else {
el = {}; // just generating ID in this case
}
if (!el.id) {
el.id = prefix + id_counter++;
} // dont override existing
return el.id;
};
return Y.Dom.batch(el, f, Y.Dom, true);
},
/**
* Determines whether an HTMLElement is an ancestor of another HTML element in the DOM hierarchy.
* @method isAncestor
* @param {String | HTMLElement} haystack The possible ancestor
* @param {String | HTMLElement} needle The possible descendent
* @return {Boolean} Whether or not the haystack is an ancestor of needle
*/
isAncestor: function(haystack, needle) {
haystack = Y.Dom.get(haystack);
if (!haystack || !needle) { return false; }
var f = function(needle) {
if (haystack.contains && !isSafari) { // safari "contains" is broken
return haystack.contains(needle);
}
else if ( haystack.compareDocumentPosition ) {
return !!(haystack.compareDocumentPosition(needle) & 16);
}
else { // loop up and test each parent
var parent = needle.parentNode;
while (parent) {
if (parent == haystack) {
return true;
}
else if (!parent.tagName || parent.tagName.toUpperCase() == 'HTML') {
return false;
}
parent = parent.parentNode;
}
return false;
}
};
return Y.Dom.batch(needle, f, Y.Dom, true);
},
/**
* Determines whether an HTMLElement is present in the current document.
* @method inDocument
* @param {String | HTMLElement} el The element to search for
* @return {Boolean} Whether or not the element is present in the current document
*/
inDocument: function(el) {
var f = function(el) {
return this.isAncestor(document.documentElement, el);
};
return Y.Dom.batch(el, f, Y.Dom, true);
},
/**
* Returns a array of HTMLElements that pass the test applied by supplied boolean method.
* For optimized performance, include a tag and/or root node when possible.
* @method getElementsBy
* @param {Function} method - A boolean method for testing elements which receives the element as its only argument.
* @param {String} tag (optional) The tag name of the elements being collected
* @param {String | HTMLElement} root (optional) The HTMLElement or an ID to use as the starting point
* @return {Array} Array of HTMLElements
*/
getElementsBy: function(method, tag, root) {
tag = tag || '*';
var nodes = [];
if (root) {
root = Y.Dom.get(root);
if (!root) { // if no root node, then no children
return nodes;
}
} else {
root = document;
}
var elements = root.getElementsByTagName(tag);
if ( !elements.length && (tag == '*' && root.all) ) {
elements = root.all; // IE < 6
}
for (var i = 0, len = elements.length; i < len; ++i) {
if ( method(elements[i]) ) { nodes[nodes.length] = elements[i]; }
}
return nodes;
},
/**
* Returns an array of elements that have had the supplied method applied.
* The method is called with the element(s) as the first arg, and the optional param as the second ( method(el, o) ).
* @method batch
* @param {String | HTMLElement | Array} el (optional) An element or array of elements to apply the method to
* @param {Function} method The method to apply to the element(s)
* @param {Any} o (optional) An optional arg that is passed to the supplied method
* @param {Boolean} override (optional) Whether or not to override the scope of "method" with "o"
* @return {HTMLElement | Array} The element(s) with the method applied
*/
batch: function(el, method, o, override) {
var id = el;
el = Y.Dom.get(el);
var scope = (override) ? o : window;
if (!el || el.tagName || !el.length) { // is null or not a collection (tagName for SELECT and others that can be both an element and a collection)
if (!el) {
return false;
}
return method.call(scope, el, o);
}
var collection = [];
for (var i = 0, len = el.length; i < len; ++i) {
if (!el[i]) {
id = el[i];
}
collection[collection.length] = method.call(scope, el[i], o);
}
return collection;
},
/**
* Returns the height of the document.
* @method getDocumentHeight
* @return {Int} The height of the actual document (which includes the body and its margin).
*/
getDocumentHeight: function() {
var scrollHeight = (document.compatMode != 'CSS1Compat') ? document.body.scrollHeight : document.documentElement.scrollHeight;
var h = Math.max(scrollHeight, Y.Dom.getViewportHeight());
return h;
},
/**
* Returns the width of the document.
* @method getDocumentWidth
* @return {Int} The width of the actual document (which includes the body and its margin).
*/
getDocumentWidth: function() {
var scrollWidth = (document.compatMode != 'CSS1Compat') ? document.body.scrollWidth : document.documentElement.scrollWidth;
var w = Math.max(scrollWidth, Y.Dom.getViewportWidth());
return w;
},
/**
* Returns the current height of the viewport.
* @method getViewportHeight
* @return {Int} The height of the viewable area of the page (excludes scrollbars).
*/
getViewportHeight: function() {
var height = self.innerHeight; // Safari, Opera
var mode = document.compatMode;
if ( (mode || isIE) && !isOpera ) { // IE, Gecko
height = (mode == 'CSS1Compat') ?
document.documentElement.clientHeight : // Standards
document.body.clientHeight; // Quirks
}
return height;
},
/**
* Returns the current width of the viewport.
* @method getViewportWidth
* @return {Int} The width of the viewable area of the page (excludes scrollbars).
*/
getViewportWidth: function() {
var width = self.innerWidth; // Safari
var mode = document.compatMode;
if (mode || isIE) { // IE, Gecko, Opera
width = (mode == 'CSS1Compat') ?
document.documentElement.clientWidth : // Standards
document.body.clientWidth; // Quirks
}
return width;
}
};
})();
/**
* A region is a representation of an object on a grid. It is defined
* by the top, right, bottom, left extents, so is rectangular by default. If
* other shapes are required, this class could be extended to support it.
* @namespace YAHOO.util
* @class Region
* @param {Int} t the top extent
* @param {Int} r the right extent
* @param {Int} b the bottom extent
* @param {Int} l the left extent
* @constructor
*/
YAHOO.util.Region = function(t, r, b, l) {
/**
* The region's top extent
* @property top
* @type Int
*/
this.top = t;
/**
* The region's top extent as index, for symmetry with set/getXY
* @property 1
* @type Int
*/
this[1] = t;
/**
* The region's right extent
* @property right
* @type int
*/
this.right = r;
/**
* The region's bottom extent
* @property bottom
* @type Int
*/
this.bottom = b;
/**
* The region's left extent
* @property left
* @type Int
*/
this.left = l;
/**
* The region's left extent as index, for symmetry with set/getXY
* @property 0
* @type Int
*/
this[0] = l;
};
/**
* Returns true if this region contains the region passed in
* @method contains
* @param {Region} region The region to evaluate
* @return {Boolean} True if the region is contained with this region,
* else false
*/
YAHOO.util.Region.prototype.contains = function(region) {
return ( region.left >= this.left &&
region.right <= this.right &&
region.top >= this.top &&
region.bottom <= this.bottom );
};
/**
* Returns the area of the region
* @method getArea
* @return {Int} the region's area
*/
YAHOO.util.Region.prototype.getArea = function() {
return ( (this.bottom - this.top) * (this.right - this.left) );
};
/**
* Returns the region where the passed in region overlaps with this one
* @method intersect
* @param {Region} region The region that intersects
* @return {Region} The overlap region, or null if there is no overlap
*/
YAHOO.util.Region.prototype.intersect = function(region) {
var t = Math.max( this.top, region.top );
var r = Math.min( this.right, region.right );
var b = Math.min( this.bottom, region.bottom );
var l = Math.max( this.left, region.left );
if (b >= t && r >= l) {
return new YAHOO.util.Region(t, r, b, l);
} else {
return null;
}
};
/**
* Returns the region representing the smallest region that can contain both
* the passed in region and this region.
* @method union
* @param {Region} region The region that to create the union with
* @return {Region} The union region
*/
YAHOO.util.Region.prototype.union = function(region) {
var t = Math.min( this.top, region.top );
var r = Math.max( this.right, region.right );
var b = Math.max( this.bottom, region.bottom );
var l = Math.min( this.left, region.left );
return new YAHOO.util.Region(t, r, b, l);
};
/**
* toString
* @method toString
* @return string the region properties
*/
YAHOO.util.Region.prototype.toString = function() {
return ( "Region {" +
"top: " + this.top +
", right: " + this.right +
", bottom: " + this.bottom +
", left: " + this.left +
"}" );
};
/**
* Returns a region that is occupied by the DOM element
* @method getRegion
* @param {HTMLElement} el The element
* @return {Region} The region that the element occupies
* @static
*/
YAHOO.util.Region.getRegion = function(el) {
var p = YAHOO.util.Dom.getXY(el);
var t = p[1];
var r = p[0] + el.offsetWidth;
var b = p[1] + el.offsetHeight;
var l = p[0];
return new YAHOO.util.Region(t, r, b, l);
};
/////////////////////////////////////////////////////////////////////////////
/**
* A point is a region that is special in that it represents a single point on
* the grid.
* @namespace YAHOO.util
* @class Point
* @param {Int} x The X position of the point
* @param {Int} y The Y position of the point
* @constructor
* @extends YAHOO.util.Region
*/
YAHOO.util.Point = function(x, y) {
if (x instanceof Array) { // accept output from Dom.getXY
y = x[1];
x = x[0];
}
/**
* The X position of the point, which is also the right, left and index zero (for Dom.getXY symmetry)
* @property x
* @type Int
*/
this.x = this.right = this.left = this[0] = x;
/**
* The Y position of the point, which is also the top, bottom and index one (for Dom.getXY symmetry)
* @property y
* @type Int
*/
this.y = this.top = this.bottom = this[1] = y;
};
YAHOO.util.Point.prototype = new YAHOO.util.Region();
YAHOO.register("dom", YAHOO.util.Dom, {version: "2.2.2", build: "204"});
/*
Copyright (c) 2007, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 2.2.2
*/
/**
* Provides Attribute configurations.
* @namespace YAHOO.util
* @class Attribute
* @constructor
* @param hash {Object} The intial Attribute.
* @param {YAHOO.util.AttributeProvider} The owner of the Attribute instance.
*/
YAHOO.util.Attribute = function(hash, owner) {
if (owner) {
this.owner = owner;
this.configure(hash, true);
}
};
YAHOO.util.Attribute.prototype = {
/**
* The name of the attribute.
* @property name
* @type String
*/
name: undefined,
/**
* The value of the attribute.
* @property value
* @type String
*/
value: null,
/**
* The owner of the attribute.
* @property owner
* @type YAHOO.util.AttributeProvider
*/
owner: null,
/**
* Whether or not the attribute is read only.
* @property readOnly
* @type Boolean
*/
readOnly: false,
/**
* Whether or not the attribute can only be written once.
* @property writeOnce
* @type Boolean
*/
writeOnce: false,
/**
* The attribute's initial configuration.
* @private
* @property _initialConfig
* @type Object
*/
_initialConfig: null,
/**
* Whether or not the attribute's value has been set.
* @private
* @property _written
* @type Boolean
*/
_written: false,
/**
* The method to use when setting the attribute's value.
* The method recieves the new value as the only argument.
* @property method
* @type Function
*/
method: null,
/**
* The validator to use when setting the attribute's value.
* @property validator
* @type Function
* @return Boolean
*/
validator: null,
/**
* Retrieves the current value of the attribute.
* @method getValue
* @return {any} The current value of the attribute.
*/
getValue: function() {
return this.value;
},
/**
* Sets the value of the attribute and fires beforeChange and change events.
* @method setValue
* @param {Any} value The value to apply to the attribute.
* @param {Boolean} silent If true the change events will not be fired.
* @return {Boolean} Whether or not the value was set.
*/
setValue: function(value, silent) {
var beforeRetVal;
var owner = this.owner;
var name = this.name;
var event = {
type: name,
prevValue: this.getValue(),
newValue: value
};
if (this.readOnly || ( this.writeOnce && this._written) ) {
return false; // write not allowed
}
if (this.validator && !this.validator.call(owner, value) ) {
return false; // invalid value
}
if (!silent) {
beforeRetVal = owner.fireBeforeChangeEvent(event);
if (beforeRetVal === false) {
return false;
}
}
if (this.method) {
this.method.call(owner, value);
}
this.value = value;
this._written = true;
event.type = name;
if (!silent) {
this.owner.fireChangeEvent(event);
}
return true;
},
/**
* Allows for configuring the Attribute's properties.
* @method configure
* @param {Object} map A key-value map of Attribute properties.
* @param {Boolean} init Whether or not this should become the initial config.
*/
configure: function(map, init) {
map = map || {};
this._written = false; // reset writeOnce
this._initialConfig = this._initialConfig || {};
for (var key in map) {
if ( key && YAHOO.lang.hasOwnProperty(map, key) ) {
this[key] = map[key];
if (init) {
this._initialConfig[key] = map[key];
}
}
}
},
/**
* Resets the value to the initial config value.
* @method resetValue
* @return {Boolean} Whether or not the value was set.
*/
resetValue: function() {
return this.setValue(this._initialConfig.value);
},
/**
* Resets the attribute config to the initial config state.
* @method resetConfig
*/
resetConfig: function() {
this.configure(this._initialConfig);
},
/**
* Resets the value to the current value.
* Useful when values may have gotten out of sync with actual properties.
* @method refresh
* @return {Boolean} Whether or not the value was set.
*/
refresh: function(silent) {
this.setValue(this.value, silent);
}
};
(function() {
var Lang = YAHOO.util.Lang;
/*
Copyright (c) 2006, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
*/
/**
* Provides and manages YAHOO.util.Attribute instances
* @namespace YAHOO.util
* @class AttributeProvider
* @uses YAHOO.util.EventProvider
*/
YAHOO.util.AttributeProvider = function() {};
YAHOO.util.AttributeProvider.prototype = {
/**
* A key-value map of Attribute configurations
* @property _configs
* @protected (may be used by subclasses and augmentors)
* @private
* @type {Object}
*/
_configs: null,
/**
* Returns the current value of the attribute.
* @method get
* @param {String} key The attribute whose value will be returned.
*/
get: function(key){
var configs = this._configs || {};
var config = configs[key];
if (!config) {
return undefined;
}
return config.value;
},
/**
* Sets the value of a config.
* @method set
* @param {String} key The name of the attribute
* @param {Any} value The value to apply to the attribute
* @param {Boolean} silent Whether or not to suppress change events
* @return {Boolean} Whether or not the value was set.
*/
set: function(key, value, silent){
var configs = this._configs || {};
var config = configs[key];
if (!config) {
return false;
}
return config.setValue(value, silent);
},
/**
* Returns an array of attribute names.
* @method getAttributeKeys
* @return {Array} An array of attribute names.
*/
getAttributeKeys: function(){
var configs = this._configs;
var keys = [];
var config;
for (var key in configs) {
config = configs[key];
if ( Lang.hasOwnProperty(configs, key) &&
!Lang.isUndefined(config) ) {
keys[keys.length] = key;
}
}
return keys;
},
/**
* Sets multiple attribute values.
* @method setAttributes
* @param {Object} map A key-value map of attributes
* @param {Boolean} silent Whether or not to suppress change events
*/
setAttributes: function(map, silent){
for (var key in map) {
if ( Lang.hasOwnProperty(map, key) ) {
this.set(key, map[key], silent);
}
}
},
/**
* Resets the specified attribute's value to its initial value.
* @method resetValue
* @param {String} key The name of the attribute
* @param {Boolean} silent Whether or not to suppress change events
* @return {Boolean} Whether or not the value was set
*/
resetValue: function(key, silent){
var configs = this._configs || {};
if (configs[key]) {
this.set(key, configs[key]._initialConfig.value, silent);
return true;
}
return false;
},
/**
* Sets the attribute's value to its current value.
* @method refresh
* @param {String | Array} key The attribute(s) to refresh
* @param {Boolean} silent Whether or not to suppress change events
*/
refresh: function(key, silent){
var configs = this._configs;
key = ( ( Lang.isString(key) ) ? [key] : key ) ||
this.getAttributeKeys();
for (var i = 0, len = key.length; i < len; ++i) {
if ( // only set if there is a value and not null
configs[key[i]] &&
! Lang.isUndefined(configs[key[i]].value) &&
! Lang.isNull(configs[key[i]].value) ) {
configs[key[i]].refresh(silent);
}
}
},
/**
* Adds an Attribute to the AttributeProvider instance.
* @method register
* @param {String} key The attribute's name
* @param {Object} map A key-value map containing the
* attribute's properties.
* @deprecated Use setAttributeConfig
*/
register: function(key, map) {
this.setAttributeConfig(key, map);
},
/**
* Returns the attribute's properties.
* @method getAttributeConfig
* @param {String} key The attribute's name
* @private
* @return {object} A key-value map containing all of the
* attribute's properties.
*/
getAttributeConfig: function(key) {
var configs = this._configs || {};
var config = configs[key] || {};
var map = {}; // returning a copy to prevent overrides
for (key in config) {
if ( Lang.hasOwnProperty(config, key) ) {
map[key] = config[key];
}
}
return map;
},
/**
* Sets or updates an Attribute instance's properties.
* @method setAttributeConfig
* @param {String} key The attribute's name.
* @param {Object} map A key-value map of attribute properties
* @param {Boolean} init Whether or not this should become the intial config.
*/
setAttributeConfig: function(key, map, init) {
var configs = this._configs || {};
map = map || {};
if (!configs[key]) {
map.name = key;
configs[key] = new YAHOO.util.Attribute(map, this);
} else {
configs[key].configure(map, init);
}
},
/**
* Sets or updates an Attribute instance's properties.
* @method configureAttribute
* @param {String} key The attribute's name.
* @param {Object} map A key-value map of attribute properties
* @param {Boolean} init Whether or not this should become the intial config.
* @deprecated Use setAttributeConfig
*/
configureAttribute: function(key, map, init) {
this.setAttributeConfig(key, map, init);
},
/**
* Resets an attribute to its intial configuration.
* @method resetAttributeConfig
* @param {String} key The attribute's name.
* @private
*/
resetAttributeConfig: function(key){
var configs = this._configs || {};
configs[key].resetConfig();
},
/**
* Fires the attribute's beforeChange event.
* @method fireBeforeChangeEvent
* @param {String} key The attribute's name.
* @param {Obj} e The event object to pass to handlers.
*/
fireBeforeChangeEvent: function(e) {
var type = 'before';
type += e.type.charAt(0).toUpperCase() + e.type.substr(1) + 'Change';
e.type = type;
return this.fireEvent(e.type, e);
},
/**
* Fires the attribute's change event.
* @method fireChangeEvent
* @param {String} key The attribute's name.
* @param {Obj} e The event object to pass to the handlers.
*/
fireChangeEvent: function(e) {
e.type += 'Change';
return this.fireEvent(e.type, e);
}
};
YAHOO.augment(YAHOO.util.AttributeProvider, YAHOO.util.EventProvider);
})();
(function() {
// internal shorthand
var Dom = YAHOO.util.Dom,
AttributeProvider = YAHOO.util.AttributeProvider;
/**
* Element provides an wrapper object to simplify adding
* event listeners, using dom methods, and managing attributes.
* @module element
* @namespace YAHOO.util
* @requires yahoo, dom, event
* @beta
*/
/**
* Element provides an wrapper object to simplify adding
* event listeners, using dom methods, and managing attributes.
* @class Element
* @uses YAHOO.util.AttributeProvider
* @constructor
* @param el {HTMLElement | String} The html element that
* represents the Element.
* @param {Object} map A key-value map of initial config names and values
*/
YAHOO.util.Element = function(el, map) {
if (arguments.length) {
this.init(el, map);
}
};
YAHOO.util.Element.prototype = {
/**
* Dom events supported by the Element instance.
* @property DOM_EVENTS
* @type Object
*/
DOM_EVENTS: null,
/**
* Wrapper for HTMLElement method.
* @method appendChild
* @param {Boolean} deep Whether or not to do a deep clone
*/
appendChild: function(child) {
child = child.get ? child.get('element') : child;
this.get('element').appendChild(child);
},
/**
* Wrapper for HTMLElement method.
* @method getElementsByTagName
* @param {String} tag The tagName to collect
*/
getElementsByTagName: function(tag) {
return this.get('element').getElementsByTagName(tag);
},
/**
* Wrapper for HTMLElement method.
* @method hasChildNodes
* @return {Boolean} Whether or not the element has childNodes
*/
hasChildNodes: function() {
return this.get('element').hasChildNodes();
},
/**
* Wrapper for HTMLElement method.
* @method insertBefore
* @param {HTMLElement} element The HTMLElement to insert
* @param {HTMLElement} before The HTMLElement to insert
* the element before.
*/
insertBefore: function(element, before) {
element = element.get ? element.get('element') : element;
before = (before && before.get) ? before.get('element') : before;
this.get('element').insertBefore(element, before);
},
/**
* Wrapper for HTMLElement method.
* @method removeChild
* @param {HTMLElement} child The HTMLElement to remove
*/
removeChild: function(child) {
child = child.get ? child.get('element') : child;
this.get('element').removeChild(child);
return true;
},
/**
* Wrapper for HTMLElement method.
* @method replaceChild
* @param {HTMLElement} newNode The HTMLElement to insert
* @param {HTMLElement} oldNode The HTMLElement to replace
*/
replaceChild: function(newNode, oldNode) {
newNode = newNode.get ? newNode.get('element') : newNode;
oldNode = oldNode.get ? oldNode.get('element') : oldNode;
return this.get('element').replaceChild(newNode, oldNode);
},
/**
* Registers Element specific attributes.
* @method initAttributes
* @param {Object} map A key-value map of initial attribute configs
*/
initAttributes: function(map) {
},
/**
* Adds a listener for the given event. These may be DOM or
* customEvent listeners. Any event that is fired via fireEvent
* can be listened for. All handlers receive an event object.
* @method addListener
* @param {String} type The name of the event to listen for
* @param {Function} fn The handler to call when the event fires
* @param {Any} obj A variable to pass to the handler
* @param {Object} scope The object to use for the scope of the handler
*/
addListener: function(type, fn, obj, scope) {
var el = this.get('element');
scope = scope || this;
el = this.get('id') || el;
var self = this;
if (!this._events[type]) { // create on the fly
if ( this.DOM_EVENTS[type] ) {
YAHOO.util.Event.addListener(el, type, function(e) {
if (e.srcElement && !e.target) { // supplement IE with target
e.target = e.srcElement;
}
self.fireEvent(type, e);
}, obj, scope);
}
this.createEvent(type, this);
}
this.subscribe.apply(this, arguments); // notify via customEvent
},
/**
* Alias for addListener
* @method on
* @param {String} type The name of the event to listen for
* @param {Function} fn The function call when the event fires
* @param {Any} obj A variable to pass to the handler
* @param {Object} scope The object to use for the scope of the handler
*/
on: function() { this.addListener.apply(this, arguments); },
/**
* Remove an event listener
* @method removeListener
* @param {String} type The name of the event to listen for
* @param {Function} fn The function call when the event fires
*/
removeListener: function(type, fn) {
this.unsubscribe.apply(this, arguments);
},
/**
* Wrapper for Dom method.
* @method addClass
* @param {String} className The className to add
*/
addClass: function(className) {
Dom.addClass(this.get('element'), className);
},
/**
* Wrapper for Dom method.
* @method getElementsByClassName
* @param {String} className The className to collect
* @param {String} tag (optional) The tag to use in
* conjunction with class name
* @return {Array} Array of HTMLElements
*/
getElementsByClassName: function(className, tag) {
return Dom.getElementsByClassName(className, tag,
this.get('element') );
},
/**
* Wrapper for Dom method.
* @method hasClass
* @param {String} className The className to add
* @return {Boolean} Whether or not the element has the class name
*/
hasClass: function(className) {
return Dom.hasClass(this.get('element'), className);
},
/**
* Wrapper for Dom method.
* @method removeClass
* @param {String} className The className to remove
*/
removeClass: function(className) {
return Dom.removeClass(this.get('element'), className);
},
/**
* Wrapper for Dom method.
* @method replaceClass
* @param {String} oldClassName The className to replace
* @param {String} newClassName The className to add
*/
replaceClass: function(oldClassName, newClassName) {
return Dom.replaceClass(this.get('element'),
oldClassName, newClassName);
},
/**
* Wrapper for Dom method.
* @method setStyle
* @param {String} property The style property to set
* @param {String} value The value to apply to the style property
*/
setStyle: function(property, value) {
var el = this.get('element');
if (!el) {
return this._queue[this._queue.length] = ['setStyle', arguments];
}
return Dom.setStyle(el, property, value); // TODO: always queuing?
},
/**
* Wrapper for Dom method.
* @method getStyle
* @param {String} property The style property to retrieve
* @return {String} The current value of the property
*/
getStyle: function(property) {
return Dom.getStyle(this.get('element'), property);
},
/**
* Apply any queued set calls.
* @method fireQueue
*/
fireQueue: function() {
var queue = this._queue;
for (var i = 0, len = queue.length; i < len; ++i) {
this[queue[i][0]].apply(this, queue[i][1]);
}
},
/**
* Appends the HTMLElement into either the supplied parentNode.
* @method appendTo
* @param {HTMLElement | Element} parentNode The node to append to
* @param {HTMLElement | Element} before An optional node to insert before
*/
appendTo: function(parent, before) {
parent = (parent.get) ? parent.get('element') : Dom.get(parent);
this.fireEvent('beforeAppendTo', {
type: 'beforeAppendTo',
target: parent
});
before = (before && before.get) ?
before.get('element') : Dom.get(before);
var element = this.get('element');
if (!element) {
return false;
}
if (!parent) {
return false;
}
if (element.parent != parent) {
if (before) {
parent.insertBefore(element, before);
} else {
parent.appendChild(element);
}
}
this.fireEvent('appendTo', {
type: 'appendTo',
target: parent
});
},
get: function(key) {
var configs = this._configs || {};
var el = configs.element; // avoid loop due to 'element'
if (el && !configs[key] && !YAHOO.lang.isUndefined(el.value[key]) ) {
return el.value[key];
}
return AttributeProvider.prototype.get.call(this, key);
},
set: function(key, value, silent) {
var el = this.get('element');
if (!el) {
this._queue[this._queue.length] = ['set', arguments];
if (this._configs[key]) {
this._configs[key].value = value; // so "get" works while queueing
}
return;
}
// set it on the element if not configured and is an HTML attribute
if ( !this._configs[key] && !YAHOO.lang.isUndefined(el[key]) ) {
_registerHTMLAttr.call(this, key);
}
return AttributeProvider.prototype.set.apply(this, arguments);
},
setAttributeConfig: function(key, map, init) {
var el = this.get('element');
if (el && !this._configs[key] && !YAHOO.lang.isUndefined(el[key]) ) {
_registerHTMLAttr.call(this, key, map);
} else {
AttributeProvider.prototype.setAttributeConfig.apply(this, arguments);
}
},
getAttributeKeys: function() {
var el = this.get('element');
var keys = AttributeProvider.prototype.getAttributeKeys.call(this);
//add any unconfigured element keys
for (var key in el) {
if (!this._configs[key]) {
keys[key] = keys[key] || el[key];
}
}
return keys;
},
createEvent: function(type, scope) {
this._events[type] = true;
AttributeProvider.prototype.createEvent.apply(this, arguments);
},
init: function(el, attr) {
_initElement.apply(this, arguments);
}
};
var _initElement = function(el, attr) {
this._queue = this._queue || [];
this._events = this._events || {};
this._configs = this._configs || {};
attr = attr || {};
attr.element = attr.element || el || null;
this.DOM_EVENTS = {
'click': true,
'dblclick': true,
'keydown': true,
'keypress': true,
'keyup': true,
'mousedown': true,
'mousemove': true,
'mouseout': true,
'mouseover': true,
'mouseup': true,
'focus': true,
'blur': true,
'submit': true
};
var isReady = false; // to determine when to init HTMLElement and content
if (YAHOO.lang.isString(el) ) { // defer until available/ready
_registerHTMLAttr.call(this, 'id', { value: attr.element });
}
if (Dom.get(el)) {
isReady = true;
_initHTMLElement.call(this, attr);
_initContent.call(this, attr);
}
YAHOO.util.Event.onAvailable(attr.element, function() {
if (!isReady) { // otherwise already done
_initHTMLElement.call(this, attr);
}
this.fireEvent('available', { type: 'available', target: attr.element });
}, this, true);
YAHOO.util.Event.onContentReady(attr.element, function() {
if (!isReady) { // otherwise already done
_initContent.call(this, attr);
}
this.fireEvent('contentReady', { type: 'contentReady', target: attr.element });
}, this, true);
};
var _initHTMLElement = function(attr) {
/**
* The HTMLElement the Element instance refers to.
* @config element
* @type HTMLElement
*/
this.setAttributeConfig('element', {
value: Dom.get(attr.element),
readOnly: true
});
};
var _initContent = function(attr) {
this.initAttributes(attr);
this.setAttributes(attr, true);
this.fireQueue();
};
/**
* Sets the value of the property and fires beforeChange and change events.
* @private
* @method _registerHTMLAttr
* @param {YAHOO.util.Element} element The Element instance to
* register the config to.
* @param {String} key The name of the config to register
* @param {Object} map A key-value map of the config's params
*/
var _registerHTMLAttr = function(key, map) {
var el = this.get('element');
map = map || {};
map.name = key;
map.method = map.method || function(value) {
el[key] = value;
};
map.value = map.value || el[key];
this._configs[key] = new YAHOO.util.Attribute(map, this);
};
/**
* Fires when the Element's HTMLElement can be retrieved by Id.
*
* @event contentReady
*/
YAHOO.augment(YAHOO.util.Element, AttributeProvider);
})();
YAHOO.register("element", YAHOO.util.Element, {version: "2.2.2", build: "204"});
/*
Copyright (c) 2007, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 2.2.2
*/
(function() {
/**
* The tabview module provides a widget for managing content bound to tabs.
* @module tabview
* @requires yahoo, dom, event, element
*
*/
/**
* A widget to control tabbed views.
* @namespace YAHOO.widget
* @class TabView
* @extends YAHOO.util.Element
* @constructor
* @param {HTMLElement | String | Object} el(optional) The html
* element that represents the TabView, or the attribute object to use.
* An element will be created if none provided.
* @param {Object} attr (optional) A key map of the tabView's
* initial attributes. Ignored if first arg is attributes object.
*/
YAHOO.widget.TabView = function(el, attr) {
attr = attr || {};
if (arguments.length == 1 && !YAHOO.lang.isString(el) && !el.nodeName) {
attr = el; // treat first arg as attr object
el = attr.element || null;
}
if (!el && !attr.element) { // create if we dont have one
el = _createTabViewElement.call(this, attr);
}
YAHOO.widget.TabView.superclass.constructor.call(this, el, attr);
};
YAHOO.extend(YAHOO.widget.TabView, YAHOO.util.Element);
var proto = YAHOO.widget.TabView.prototype;
var Dom = YAHOO.util.Dom;
var Event = YAHOO.util.Event;
var Tab = YAHOO.widget.Tab;
/**
* The className to add when building from scratch.
* @property CLASSNAME
* @default "navset"
*/
proto.CLASSNAME = 'yui-navset';
/**
* The className of the HTMLElement containing the TabView's tab elements
* to look for when building from existing markup, or to add when building
* from scratch.
* All childNodes of the tab container are treated as Tabs when building
* from existing markup.
* @property TAB_PARENT_CLASSNAME
* @default "nav"
*/
proto.TAB_PARENT_CLASSNAME = 'yui-nav';
/**
* The className of the HTMLElement containing the TabView's label elements
* to look for when building from existing markup, or to add when building
* from scratch.
* All childNodes of the content container are treated as content elements when
* building from existing markup.
* @property CONTENT_PARENT_CLASSNAME
* @default "nav-content"
*/
proto.CONTENT_PARENT_CLASSNAME = 'yui-content';
proto._tabParent = null;
proto._contentParent = null;
/**
* Adds a Tab to the TabView instance.
* If no index is specified, the tab is added to the end of the tab list.
* @method addTab
* @param {YAHOO.widget.Tab} tab A Tab instance to add.
* @param {Integer} index The position to add the tab.
* @return void
*/
proto.addTab = function(tab, index) {
var tabs = this.get('tabs');
if (!tabs) { // not ready yet
this._queue[this._queue.length] = ['addTab', arguments];
return false;
}
index = (index === undefined) ? tabs.length : index;
var before = this.getTab(index);
var self = this;
var el = this.get('element');
var tabParent = this._tabParent;
var contentParent = this._contentParent;
var tabElement = tab.get('element');
var contentEl = tab.get('contentEl');
if ( before ) {
tabParent.insertBefore(tabElement, before.get('element'));
} else {
tabParent.appendChild(tabElement);
}
if ( contentEl && !Dom.isAncestor(contentParent, contentEl) ) {
contentParent.appendChild(contentEl);
}
if ( !tab.get('active') ) {
tab.set('contentVisible', false, true); /* hide if not active */
} else {
this.set('activeTab', tab, true);
}
var activate = function(e) {
YAHOO.util.Event.preventDefault(e);
self.set('activeTab', this);
};
tab.addListener( tab.get('activationEvent'), activate);
tab.addListener('activationEventChange', function(e) {
if (e.prevValue != e.newValue) {
tab.removeListener(e.prevValue, activate);
tab.addListener(e.newValue, activate);
}
});
tabs.splice(index, 0, tab);
};
/**
* Routes childNode events.
* @method DOMEventHandler
* @param {event} e The Dom event that is being handled.
* @return void
*/
proto.DOMEventHandler = function(e) {
var el = this.get('element');
var target = YAHOO.util.Event.getTarget(e);
var tabParent = this._tabParent;
if (Dom.isAncestor(tabParent, target) ) {
var tabEl;
var tab = null;
var contentEl;
var tabs = this.get('tabs');
for (var i = 0, len = tabs.length; i < len; i++) {
tabEl = tabs[i].get('element');
contentEl = tabs[i].get('contentEl');
if ( target == tabEl || Dom.isAncestor(tabEl, target) ) {
tab = tabs[i];
break; // note break
}
}
if (tab) {
tab.fireEvent(e.type, e);
}
}
};
/**
* Returns the Tab instance at the specified index.
* @method getTab
* @param {Integer} index The position of the Tab.
* @return YAHOO.widget.Tab
*/
proto.getTab = function(index) {
return this.get('tabs')[index];
};
/**
* Returns the index of given tab.
* @method getTabIndex
* @param {YAHOO.widget.Tab} tab The tab whose index will be returned.
* @return int
*/
proto.getTabIndex = function(tab) {
var index = null;
var tabs = this.get('tabs');
for (var i = 0, len = tabs.length; i < len; ++i) {
if (tab == tabs[i]) {
index = i;
break;
}
}
return index;
};
/**
* Removes the specified Tab from the TabView.
* @method removeTab
* @param {YAHOO.widget.Tab} item The Tab instance to be removed.
* @return void
*/
proto.removeTab = function(tab) {
var tabCount = this.get('tabs').length;
var index = this.getTabIndex(tab);
var nextIndex = index + 1;
if ( tab == this.get('activeTab') ) { // select next tab
if (tabCount > 1) {
if (index + 1 == tabCount) {
this.set('activeIndex', index - 1);
} else {
this.set('activeIndex', index + 1);
}
}
}
this._tabParent.removeChild( tab.get('element') );
this._contentParent.removeChild( tab.get('contentEl') );
this._configs.tabs.value.splice(index, 1);
};
/**
* Provides a readable name for the TabView instance.
* @method toString
* @return String
*/
proto.toString = function() {
var name = this.get('id') || this.get('tagName');
return "TabView " + name;
};
/**
* The transiton to use when switching between tabs.
* @method contentTransition
*/
proto.contentTransition = function(newTab, oldTab) {
newTab.set('contentVisible', true);
oldTab.set('contentVisible', false);
};
/**
* setAttributeConfigs TabView specific properties.
* @method initAttributes
* @param {Object} attr Hash of initial attributes
*/
proto.initAttributes = function(attr) {
YAHOO.widget.TabView.superclass.initAttributes.call(this, attr);
if (!attr.orientation) {
attr.orientation = 'top';
}
var el = this.get('element');
/**
* The Tabs belonging to the TabView instance.
* @config tabs
* @type Array
*/
this.setAttributeConfig('tabs', {
value: [],
readOnly: true
});
/**
* The container of the tabView's label elements.
* @property _tabParent
* @private
* @type HTMLElement
*/
this._tabParent =
this.getElementsByClassName(this.TAB_PARENT_CLASSNAME,
'ul' )[0] || _createTabParent.call(this);
/**
* The container of the tabView's content elements.
* @property _contentParent
* @type HTMLElement
* @private
*/
this._contentParent =
this.getElementsByClassName(this.CONTENT_PARENT_CLASSNAME,
'div')[0] || _createContentParent.call(this);
/**
* How the Tabs should be oriented relative to the TabView.
* @config orientation
* @type String
* @default "top"
*/
this.setAttributeConfig('orientation', {
value: attr.orientation,
method: function(value) {
var current = this.get('orientation');
this.addClass('yui-navset-' + value);
if (current != value) {
this.removeClass('yui-navset-' + current);
}
switch(value) {
case 'bottom':
this.appendChild(this._tabParent);
break;
}
}
});
/**
* The index of the tab currently active.
* @config activeIndex
* @type Int
*/
this.setAttributeConfig('activeIndex', {
value: attr.activeIndex,
method: function(value) {
this.set('activeTab', this.getTab(value));
},
validator: function(value) {
return !this.getTab(value).get('disabled'); // cannot activate if disabled
}
});
/**
* The tab currently active.
* @config activeTab
* @type YAHOO.widget.Tab
*/
this.setAttributeConfig('activeTab', {
value: attr.activeTab,
method: function(tab) {
var activeTab = this.get('activeTab');
if (tab) {
tab.set('active', true);
this._configs['activeIndex'].value = this.getTabIndex(tab); // keep in sync
}
if (activeTab && activeTab != tab) {
activeTab.set('active', false);
}
if (activeTab && tab != activeTab) { // no transition if only 1
this.contentTransition(tab, activeTab);
} else if (tab) {
tab.set('contentVisible', true);
}
},
validator: function(value) {
return !value.get('disabled'); // cannot activate if disabled
}
});
if ( this._tabParent ) {
_initTabs.call(this);
}
for (var type in this.DOM_EVENTS) {
if ( YAHOO.lang.hasOwnProperty(this.DOM_EVENTS, type) ) {
this.addListener.call(this, type, this.DOMEventHandler);
}
}
};
/**
* Creates Tab instances from a collection of HTMLElements.
* @method createTabs
* @private
* @param {Array|HTMLCollection} elements The elements to use for Tabs.
* @return void
*/
var _initTabs = function() {
var tab,
attr,
contentEl;
var el = this.get('element');
var tabs = _getChildNodes(this._tabParent);
var contentElements = _getChildNodes(this._contentParent);
for (var i = 0, len = tabs.length; i < len; ++i) {
attr = {};
if (contentElements[i]) {
attr.contentEl = contentElements[i];
}
tab = new YAHOO.widget.Tab(tabs[i], attr);
this.addTab(tab);
if (tab.hasClass(tab.ACTIVE_CLASSNAME) ) {
this._configs.activeTab.value = tab; // dont invoke method
}
}
};
var _createTabViewElement = function(attr) {
var el = document.createElement('div');
if ( this.CLASSNAME ) {
el.className = this.CLASSNAME;
}
return el;
};
var _createTabParent = function(attr) {
var el = document.createElement('ul');
if ( this.TAB_PARENT_CLASSNAME ) {
el.className = this.TAB_PARENT_CLASSNAME;
}
this.get('element').appendChild(el);
return el;
};
var _createContentParent = function(attr) {
var el = document.createElement('div');
if ( this.CONTENT_PARENT_CLASSNAME ) {
el.className = this.CONTENT_PARENT_CLASSNAME;
}
this.get('element').appendChild(el);
return el;
};
var _getChildNodes = function(el) {
var nodes = [];
var childNodes = el.childNodes;
for (var i = 0, len = childNodes.length; i < len; ++i) {
if (childNodes[i].nodeType == 1) {
nodes[nodes.length] = childNodes[i];
}
}
return nodes;
};
/**
* Fires before the activeTab is changed.
*
If handler returns false, the change will be cancelled, and the value will not
* be set.
*
Event fields:
* <String> type beforeActiveTabChange
* <YAHOO.widget.Tab>
* prevValue the currently active tab
* <YAHOO.widget.Tab>
* newValue the tab to be made active
Event fields:
* <String> type activeTabChange
* <YAHOO.widget.Tab>
* prevValue the formerly active tab
* <YAHOO.widget.Tab>
* newValue the new active tab
If handler returns false, the change will be cancelled, and the value will not
* be set.
*
Event fields:
* <String> type beforeOrientationChange
* <String>
* prevValue the current orientation
* <String>
* newValue the new orientation to be applied
* @event contentChange
*/
})();
YAHOO.register("tabview", YAHOO.widget.TabView, {version: "2.2.2", build: "204"});
/*
Copyright (c) 2007, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 2.2.2
*/
/**
* Config is a utility used within an Object to allow the implementer to maintain a list of local configuration properties and listen for changes to those properties dynamically using CustomEvent. The initial values are also maintained so that the configuration can be reset at any given point to its initial state.
* @namespace YAHOO.util
* @class Config
* @constructor
* @param {Object} owner The owner Object to which this Config Object belongs
*/
YAHOO.util.Config = function(owner) {
if (owner) {
this.init(owner);
}
};
/**
* Constant representing the CustomEvent type for the config changed event.
* @property YAHOO.util.Config.CONFIG_CHANGED_EVENT
* @private
* @static
* @final
*/
YAHOO.util.Config.CONFIG_CHANGED_EVENT = "configChanged";
/**
* Constant representing the boolean type string
* @property YAHOO.util.Config.BOOLEAN_TYPE
* @private
* @static
* @final
*/
YAHOO.util.Config.BOOLEAN_TYPE = "boolean";
YAHOO.util.Config.prototype = {
/**
* Object reference to the owner of this Config Object
* @property owner
* @type Object
*/
owner : null,
/**
* Boolean flag that specifies whether a queue is currently being executed
* @property queueInProgress
* @type Boolean
*/
queueInProgress : false,
/**
* Maintains the local collection of configuration property objects and their specified values
* @property config
* @private
* @type Object
*/
config : null,
/**
* Maintains the local collection of configuration property objects as they were initially applied.
* This object is used when resetting a property.
* @property initialConfig
* @private
* @type Object
*/
initialConfig : null,
/**
* Maintains the local, normalized CustomEvent queue
* @property eventQueue
* @private
* @type Object
*/
eventQueue : null,
/**
* Custom Event, notifying subscribers when Config properties are set (setProperty is called without the silent flag
* @event configChangedEvent
*/
configChangedEvent : null,
/**
* Validates that the value passed in is a Boolean.
* @method checkBoolean
* @param {Object} val The value to validate
* @return {Boolean} true, if the value is valid
*/
checkBoolean: function(val) {
return (typeof val == YAHOO.util.Config.BOOLEAN_TYPE);
},
/**
* Validates that the value passed in is a number.
* @method checkNumber
* @param {Object} val The value to validate
* @return {Boolean} true, if the value is valid
*/
checkNumber: function(val) {
return (!isNaN(val));
},
/**
* Fires a configuration property event using the specified value.
* @method fireEvent
* @private
* @param {String} key The configuration property's name
* @param {value} Object The value of the correct type for the property
*/
fireEvent : function( key, value ) {
var property = this.config[key];
if (property && property.event) {
property.event.fire(value);
}
},
/**
* Adds a property to the Config Object's private config hash.
* @method addProperty
* @param {String} key The configuration property's name
* @param {Object} propertyObject The Object containing all of this property's arguments
*/
addProperty : function( key, propertyObject ) {
key = key.toLowerCase();
this.config[key] = propertyObject;
propertyObject.event = new YAHOO.util.CustomEvent(key, this.owner);
propertyObject.key = key;
if (propertyObject.handler) {
propertyObject.event.subscribe(propertyObject.handler, this.owner);
}
this.setProperty(key, propertyObject.value, true);
if (! propertyObject.suppressEvent) {
this.queueProperty(key, propertyObject.value);
}
},
/**
* Returns a key-value configuration map of the values currently set in the Config Object.
* @method getConfig
* @return {Object} The current config, represented in a key-value map
*/
getConfig : function() {
var cfg = {};
for (var prop in this.config) {
var property = this.config[prop];
if (property && property.event) {
cfg[prop] = property.value;
}
}
return cfg;
},
/**
* Returns the value of specified property.
* @method getProperty
* @param {String} key The name of the property
* @return {Object} The value of the specified property
*/
getProperty : function(key) {
var property = this.config[key.toLowerCase()];
if (property && property.event) {
return property.value;
} else {
return undefined;
}
},
/**
* Resets the specified property's value to its initial value.
* @method resetProperty
* @param {String} key The name of the property
* @return {Boolean} True is the property was reset, false if not
*/
resetProperty : function(key) {
key = key.toLowerCase();
var property = this.config[key];
if (property && property.event) {
if (this.initialConfig[key] && !YAHOO.lang.isUndefined(this.initialConfig[key])) {
this.setProperty(key, this.initialConfig[key]);
}
return true;
} else {
return false;
}
},
/**
* Sets the value of a property. If the silent property is passed as true, the property's event will not be fired.
* @method setProperty
* @param {String} key The name of the property
* @param {String} value The value to set the property to
* @param {Boolean} silent Whether the value should be set silently, without firing the property event.
* @return {Boolean} True, if the set was successful, false if it failed.
*/
setProperty : function(key, value, silent) {
key = key.toLowerCase();
if (this.queueInProgress && ! silent) {
this.queueProperty(key,value); // Currently running through a queue...
return true;
} else {
var property = this.config[key];
if (property && property.event) {
if (property.validator && ! property.validator(value)) { // validator
return false;
} else {
property.value = value;
if (! silent) {
this.fireEvent(key, value);
this.configChangedEvent.fire([key, value]);
}
return true;
}
} else {
return false;
}
}
},
/**
* Sets the value of a property and queues its event to execute. If the event is already scheduled to execute, it is
* moved from its current position to the end of the queue.
* @method queueProperty
* @param {String} key The name of the property
* @param {String} value The value to set the property to
* @return {Boolean} true, if the set was successful, false if it failed.
*/
queueProperty : function(key, value) {
key = key.toLowerCase();
var property = this.config[key];
if (property && property.event) {
if (!YAHOO.lang.isUndefined(value) && property.validator && ! property.validator(value)) { // validator
return false;
} else {
if (!YAHOO.lang.isUndefined(value)) {
property.value = value;
} else {
value = property.value;
}
var foundDuplicate = false;
var iLen = this.eventQueue.length;
for (var i=0; i < iLen; i++) {
var queueItem = this.eventQueue[i];
if (queueItem) {
var queueItemKey = queueItem[0];
var queueItemValue = queueItem[1];
if (queueItemKey == key) {
// found a dupe... push to end of queue, null current item, and break
this.eventQueue[i] = null;
this.eventQueue.push([key, (!YAHOO.lang.isUndefined(value) ? value : queueItemValue)]);
foundDuplicate = true;
break;
}
}
}
if (! foundDuplicate && !YAHOO.lang.isUndefined(value)) { // this is a refire, or a new property in the queue
this.eventQueue.push([key, value]);
}
}
if (property.supercedes) {
var sLen = property.supercedes.length;
for (var s=0; s < sLen; s++) {
var supercedesCheck = property.supercedes[s];
var qLen = this.eventQueue.length;
for (var q=0; q < qLen; q++) {
var queueItemCheck = this.eventQueue[q];
if (queueItemCheck) {
var queueItemCheckKey = queueItemCheck[0];
var queueItemCheckValue = queueItemCheck[1];
if ( queueItemCheckKey == supercedesCheck.toLowerCase() ) {
this.eventQueue.push([queueItemCheckKey, queueItemCheckValue]);
this.eventQueue[q] = null;
break;
}
}
}
}
}
return true;
} else {
return false;
}
},
/**
* Fires the event for a property using the property's current value.
* @method refireEvent
* @param {String} key The name of the property
*/
refireEvent : function(key) {
key = key.toLowerCase();
var property = this.config[key];
if (property && property.event && !YAHOO.lang.isUndefined(property.value)) {
if (this.queueInProgress) {
this.queueProperty(key);
} else {
this.fireEvent(key, property.value);
}
}
},
/**
* Applies a key-value Object literal to the configuration, replacing any existing values, and queueing the property events.
* Although the values will be set, fireQueue() must be called for their associated events to execute.
* @method applyConfig
* @param {Object} userConfig The configuration Object literal
* @param {Boolean} init When set to true, the initialConfig will be set to the userConfig passed in, so that calling a reset will reset the properties to the passed values.
*/
applyConfig : function(userConfig, init) {
if (init) {
this.initialConfig = userConfig;
}
for (var prop in userConfig) {
this.queueProperty(prop, userConfig[prop]);
}
},
/**
* Refires the events for all configuration properties using their current values.
* @method refresh
*/
refresh : function() {
for (var prop in this.config) {
this.refireEvent(prop);
}
},
/**
* Fires the normalized list of queued property change events
* @method fireQueue
*/
fireQueue : function() {
this.queueInProgress = true;
for (var i=0;iOR
* @param {HTMLElement} el The element representing the Module
* @param {Object} userConfig The configuration Object literal containing the configuration that should be set for this module. See configuration documentation for more details.
*/
YAHOO.widget.Module = function(el, userConfig) {
if (el) {
this.init(el, userConfig);
} else {
}
};
/**
* Constant representing the prefix path to use for non-secure images
* @property YAHOO.widget.Module.IMG_ROOT
* @static
* @final
* @type String
*/
YAHOO.widget.Module.IMG_ROOT = null;
/**
* Constant representing the prefix path to use for securely served images
* @property YAHOO.widget.Module.IMG_ROOT_SSL
* @static
* @final
* @type String
*/
YAHOO.widget.Module.IMG_ROOT_SSL = null;
/**
* Constant for the default CSS class name that represents a Module
* @property YAHOO.widget.Module.CSS_MODULE
* @static
* @final
* @type String
*/
YAHOO.widget.Module.CSS_MODULE = "yui-module";
/**
* Constant representing the module header
* @property YAHOO.widget.Module.CSS_HEADER
* @static
* @final
* @type String
*/
YAHOO.widget.Module.CSS_HEADER = "hd";
/**
* Constant representing the module body
* @property YAHOO.widget.Module.CSS_BODY
* @static
* @final
* @type String
*/
YAHOO.widget.Module.CSS_BODY = "bd";
/**
* Constant representing the module footer
* @property YAHOO.widget.Module.CSS_FOOTER
* @static
* @final
* @type String
*/
YAHOO.widget.Module.CSS_FOOTER = "ft";
/**
* Constant representing the url for the "src" attribute of the iframe used to monitor changes to the browser's base font size
* @property YAHOO.widget.Module.RESIZE_MONITOR_SECURE_URL
* @static
* @final
* @type String
*/
YAHOO.widget.Module.RESIZE_MONITOR_SECURE_URL = "javascript:false;";
/**
* Singleton CustomEvent fired when the font size is changed in the browser.
* Opera's "zoom" functionality currently does not support text size detection.
* @event YAHOO.widget.Module.textResizeEvent
*/
YAHOO.widget.Module.textResizeEvent = new YAHOO.util.CustomEvent("textResize");
/**
* Constant representing the name of the Module's events
* @property YAHOO.widget.Module._EVENT_TYPES
* @private
* @final
* @type Object
*/
YAHOO.widget.Module._EVENT_TYPES = {
"BEFORE_INIT": "beforeInit",
"INIT": "init",
"APPEND": "append",
"BEFORE_RENDER": "beforeRender",
"RENDER": "render",
"CHANGE_HEADER": "changeHeader",
"CHANGE_BODY": "changeBody",
"CHANGE_FOOTER": "changeFooter",
"CHANGE_CONTENT": "changeContent",
"DESTORY": "destroy",
"BEFORE_SHOW": "beforeShow",
"SHOW": "show",
"BEFORE_HIDE": "beforeHide",
"HIDE": "hide"
};
/**
* Constant representing the Module's configuration properties
* @property YAHOO.widget.Module._DEFAULT_CONFIG
* @private
* @final
* @type Object
*/
YAHOO.widget.Module._DEFAULT_CONFIG = {
"VISIBLE": {
key: "visible",
value: true,
validator: YAHOO.lang.isBoolean
},
"EFFECT": {
key: "effect",
suppressEvent:true,
supercedes:["visible"]
},
"MONITOR_RESIZE": {
key: "monitorresize",
value:true
}
};
YAHOO.widget.Module.prototype = {
/**
* The class's constructor function
* @property contructor
* @type Function
*/
constructor : YAHOO.widget.Module,
/**
* The main module element that contains the header, body, and footer
* @property element
* @type HTMLElement
*/
element : null,
/**
* The header element, denoted with CSS class "hd"
* @property header
* @type HTMLElement
*/
header : null,
/**
* The body element, denoted with CSS class "bd"
* @property body
* @type HTMLElement
*/
body : null,
/**
* The footer element, denoted with CSS class "ft"
* @property footer
* @type HTMLElement
*/
footer : null,
/**
* The id of the element
* @property id
* @type String
*/
id : null,
/**
* The String representing the image root
* @property imageRoot
* @type String
*/
imageRoot : YAHOO.widget.Module.IMG_ROOT,
/**
* Initializes the custom events for Module which are fired automatically at appropriate times by the Module class.
* @method initEvents
*/
initEvents : function() {
var EVENT_TYPES = YAHOO.widget.Module._EVENT_TYPES;
/**
* CustomEvent fired prior to class initalization.
* @event beforeInitEvent
* @param {class} classRef class reference of the initializing class, such as this.beforeInitEvent.fire(YAHOO.widget.Module)
*/
this.beforeInitEvent = new YAHOO.util.CustomEvent(EVENT_TYPES.BEFORE_INIT, this);
/**
* CustomEvent fired after class initalization.
* @event initEvent
* @param {class} classRef class reference of the initializing class, such as this.beforeInitEvent.fire(YAHOO.widget.Module)
*/
this.initEvent = new YAHOO.util.CustomEvent(EVENT_TYPES.INIT, this);
/**
* CustomEvent fired when the Module is appended to the DOM
* @event appendEvent
*/
this.appendEvent = new YAHOO.util.CustomEvent(EVENT_TYPES.APPEND, this);
/**
* CustomEvent fired before the Module is rendered
* @event beforeRenderEvent
*/
this.beforeRenderEvent = new YAHOO.util.CustomEvent(EVENT_TYPES.BEFORE_RENDER, this);
/**
* CustomEvent fired after the Module is rendered
* @event renderEvent
*/
this.renderEvent = new YAHOO.util.CustomEvent(EVENT_TYPES.RENDER, this);
/**
* CustomEvent fired when the header content of the Module is modified
* @event changeHeaderEvent
* @param {String/HTMLElement} content String/element representing the new header content
*/
this.changeHeaderEvent = new YAHOO.util.CustomEvent(EVENT_TYPES.CHANGE_HEADER, this);
/**
* CustomEvent fired when the body content of the Module is modified
* @event changeBodyEvent
* @param {String/HTMLElement} content String/element representing the new body content
*/
this.changeBodyEvent = new YAHOO.util.CustomEvent(EVENT_TYPES.CHANGE_BODY, this);
/**
* CustomEvent fired when the footer content of the Module is modified
* @event changeFooterEvent
* @param {String/HTMLElement} content String/element representing the new footer content
*/
this.changeFooterEvent = new YAHOO.util.CustomEvent(EVENT_TYPES.CHANGE_FOOTER, this);
/**
* CustomEvent fired when the content of the Module is modified
* @event changeContentEvent
*/
this.changeContentEvent = new YAHOO.util.CustomEvent(EVENT_TYPES.CHANGE_CONTENT, this);
/**
* CustomEvent fired when the Module is destroyed
* @event destroyEvent
*/
this.destroyEvent = new YAHOO.util.CustomEvent(EVENT_TYPES.DESTORY, this);
/**
* CustomEvent fired before the Module is shown
* @event beforeShowEvent
*/
this.beforeShowEvent = new YAHOO.util.CustomEvent(EVENT_TYPES.BEFORE_SHOW, this);
/**
* CustomEvent fired after the Module is shown
* @event showEvent
*/
this.showEvent = new YAHOO.util.CustomEvent(EVENT_TYPES.SHOW, this);
/**
* CustomEvent fired before the Module is hidden
* @event beforeHideEvent
*/
this.beforeHideEvent = new YAHOO.util.CustomEvent(EVENT_TYPES.BEFORE_HIDE, this);
/**
* CustomEvent fired after the Module is hidden
* @event hideEvent
*/
this.hideEvent = new YAHOO.util.CustomEvent(EVENT_TYPES.HIDE, this);
},
/**
* String representing the current user-agent platform
* @property platform
* @type String
*/
platform : function() {
var ua = navigator.userAgent.toLowerCase();
if (ua.indexOf("windows") != -1 || ua.indexOf("win32") != -1) {
return "windows";
} else if (ua.indexOf("macintosh") != -1) {
return "mac";
} else {
return false;
}
}(),
/**
* String representing the current user-agent browser
* @property browser
* @type String
*/
browser : function() {
var ua = navigator.userAgent.toLowerCase();
if (ua.indexOf('opera')!=-1) { // Opera (check first in case of spoof)
return 'opera';
} else if (ua.indexOf('msie 7')!=-1) { // IE7
return 'ie7';
} else if (ua.indexOf('msie') !=-1) { // IE
return 'ie';
} else if (ua.indexOf('safari')!=-1) { // Safari (check before Gecko because it includes "like Gecko")
return 'safari';
} else if (ua.indexOf('gecko') != -1) { // Gecko
return 'gecko';
} else {
return false;
}
}(),
/**
* Boolean representing whether or not the current browsing context is secure (https)
* @property isSecure
* @type Boolean
*/
isSecure : function() {
if (window.location.href.toLowerCase().indexOf("https") === 0) {
return true;
} else {
return false;
}
}(),
/**
* Initializes the custom events for Module which are fired automatically at appropriate times by the Module class.
*/
initDefaultConfig : function() {
// Add properties //
var DEFAULT_CONFIG = YAHOO.widget.Module._DEFAULT_CONFIG;
/**
* Specifies whether the Module is visible on the page.
* @config visible
* @type Boolean
* @default true
*/
this.cfg.addProperty(
DEFAULT_CONFIG.VISIBLE.key,
{
handler: this.configVisible,
value: DEFAULT_CONFIG.VISIBLE.value,
validator: DEFAULT_CONFIG.VISIBLE.validator
}
);
/**
* Object or array of objects representing the ContainerEffect classes that are active for animating the container.
* @config effect
* @type Object
* @default null
*/
this.cfg.addProperty(
DEFAULT_CONFIG.EFFECT.key,
{
suppressEvent: DEFAULT_CONFIG.EFFECT.suppressEvent,
supercedes: DEFAULT_CONFIG.EFFECT.supercedes
}
);
/**
* Specifies whether to create a special proxy iframe to monitor for user font resizing in the document
* @config monitorresize
* @type Boolean
* @default true
*/
this.cfg.addProperty(
DEFAULT_CONFIG.MONITOR_RESIZE.key,
{
handler: this.configMonitorResize,
value: DEFAULT_CONFIG.MONITOR_RESIZE.value
}
);
},
/**
* The Module class's initialization method, which is executed for Module and all of its subclasses. This method is automatically called by the constructor, and sets up all DOM references for pre-existing markup, and creates required markup if it is not already present.
* @method init
* @param {String} el The element ID representing the Module OR
* @param {HTMLElement} el The element representing the Module
* @param {Object} userConfig The configuration Object literal containing the configuration that should be set for this module. See configuration documentation for more details.
*/
init : function(el, userConfig) {
this.initEvents();
this.beforeInitEvent.fire(YAHOO.widget.Module);
/**
* The Module's Config object used for monitoring configuration properties.
* @property cfg
* @type YAHOO.util.Config
*/
this.cfg = new YAHOO.util.Config(this);
if (this.isSecure) {
this.imageRoot = YAHOO.widget.Module.IMG_ROOT_SSL;
}
if (typeof el == "string") {
var elId = el;
el = document.getElementById(el);
if (! el) {
el = document.createElement("div");
el.id = elId;
}
}
this.element = el;
if (el.id) {
this.id = el.id;
}
var childNodes = this.element.childNodes;
if (childNodes) {
for (var i=0;iOR
* @param {HTMLElement} headerContent The HTMLElement to append to the header
*/
setHeader : function(headerContent) {
if (! this.header) {
this.header = document.createElement("div");
this.header.className = YAHOO.widget.Module.CSS_HEADER;
}
if (typeof headerContent == "string") {
this.header.innerHTML = headerContent;
} else {
this.header.innerHTML = "";
this.header.appendChild(headerContent);
}
this.changeHeaderEvent.fire(headerContent);
this.changeContentEvent.fire();
},
/**
* Appends the passed element to the header. If no header is present, one will be automatically created.
* @method appendToHeader
* @param {HTMLElement} element The element to append to the header
*/
appendToHeader : function(element) {
if (! this.header) {
this.header = document.createElement("div");
this.header.className = YAHOO.widget.Module.CSS_HEADER;
}
this.header.appendChild(element);
this.changeHeaderEvent.fire(element);
this.changeContentEvent.fire();
},
/**
* Sets the Module's body content to the HTML specified, or appends the passed element to the body. If no body is present, one will be automatically created.
* @method setBody
* @param {String} bodyContent The HTML used to set the body OR
* @param {HTMLElement} bodyContent The HTMLElement to append to the body
*/
setBody : function(bodyContent) {
if (! this.body) {
this.body = document.createElement("div");
this.body.className = YAHOO.widget.Module.CSS_BODY;
}
if (typeof bodyContent == "string")
{
this.body.innerHTML = bodyContent;
} else {
this.body.innerHTML = "";
this.body.appendChild(bodyContent);
}
this.changeBodyEvent.fire(bodyContent);
this.changeContentEvent.fire();
},
/**
* Appends the passed element to the body. If no body is present, one will be automatically created.
* @method appendToBody
* @param {HTMLElement} element The element to append to the body
*/
appendToBody : function(element) {
if (! this.body) {
this.body = document.createElement("div");
this.body.className = YAHOO.widget.Module.CSS_BODY;
}
this.body.appendChild(element);
this.changeBodyEvent.fire(element);
this.changeContentEvent.fire();
},
/**
* Sets the Module's footer content to the HTML specified, or appends the passed element to the footer. If no footer is present, one will be automatically created.
* @method setFooter
* @param {String} footerContent The HTML used to set the footer OR
* @param {HTMLElement} footerContent The HTMLElement to append to the footer
*/
setFooter : function(footerContent) {
if (! this.footer) {
this.footer = document.createElement("div");
this.footer.className = YAHOO.widget.Module.CSS_FOOTER;
}
if (typeof footerContent == "string") {
this.footer.innerHTML = footerContent;
} else {
this.footer.innerHTML = "";
this.footer.appendChild(footerContent);
}
this.changeFooterEvent.fire(footerContent);
this.changeContentEvent.fire();
},
/**
* Appends the passed element to the footer. If no footer is present, one will be automatically created.
* @method appendToFooter
* @param {HTMLElement} element The element to append to the footer
*/
appendToFooter : function(element) {
if (! this.footer) {
this.footer = document.createElement("div");
this.footer.className = YAHOO.widget.Module.CSS_FOOTER;
}
this.footer.appendChild(element);
this.changeFooterEvent.fire(element);
this.changeContentEvent.fire();
},
/**
* Renders the Module by inserting the elements that are not already in the main Module into their correct places. Optionally appends the Module to the specified node prior to the render's execution. NOTE: For Modules without existing markup, the appendToNode argument is REQUIRED. If this argument is ommitted and the current element is not present in the document, the function will return false, indicating that the render was a failure.
* @method render
* @param {String} appendToNode The element id to which the Module should be appended to prior to rendering OR
* @param {HTMLElement} appendToNode The element to which the Module should be appended to prior to rendering
* @param {HTMLElement} moduleElement OPTIONAL. The element that represents the actual Standard Module container.
* @return {Boolean} Success or failure of the render
*/
render : function(appendToNode, moduleElement) {
this.beforeRenderEvent.fire();
if (! moduleElement) {
moduleElement = this.element;
}
var me = this;
var appendTo = function(element) {
if (typeof element == "string") {
element = document.getElementById(element);
}
if (element) {
element.appendChild(me.element);
me.appendEvent.fire();
}
};
if (appendToNode) {
appendTo(appendToNode);
} else { // No node was passed in. If the element is not pre-marked up, this fails
if (! YAHOO.util.Dom.inDocument(this.element)) {
return false;
}
}
// Need to get everything into the DOM if it isn't already
if (this.header && ! YAHOO.util.Dom.inDocument(this.header)) {
// There is a header, but it's not in the DOM yet... need to add it
var firstChild = moduleElement.firstChild;
if (firstChild) { // Insert before first child if exists
moduleElement.insertBefore(this.header, firstChild);
} else { // Append to empty body because there are no children
moduleElement.appendChild(this.header);
}
}
if (this.body && ! YAHOO.util.Dom.inDocument(this.body)) {
// There is a body, but it's not in the DOM yet... need to add it
if (this.footer && YAHOO.util.Dom.isAncestor(this.moduleElement, this.footer)) { // Insert before footer if exists in DOM
moduleElement.insertBefore(this.body, this.footer);
} else { // Append to element because there is no footer
moduleElement.appendChild(this.body);
}
}
if (this.footer && ! YAHOO.util.Dom.inDocument(this.footer)) {
// There is a footer, but it's not in the DOM yet... need to add it
moduleElement.appendChild(this.footer);
}
this.renderEvent.fire();
return true;
},
/**
* Removes the Module element from the DOM and sets all child elements to null.
* @method destroy
*/
destroy : function() {
var parent;
if (this.element) {
YAHOO.util.Event.purgeElement(this.element, true);
parent = this.element.parentNode;
}
if (parent) {
parent.removeChild(this.element);
}
this.element = null;
this.header = null;
this.body = null;
this.footer = null;
for (var e in this) {
if (e instanceof YAHOO.util.CustomEvent) {
e.unsubscribeAll();
}
}
YAHOO.widget.Module.textResizeEvent.unsubscribe(this.onDomResize, this);
this.destroyEvent.fire();
},
/**
* Shows the Module element by setting the visible configuration property to true. Also fires two events: beforeShowEvent prior to the visibility change, and showEvent after.
* @method show
*/
showXYH : function(x,y,h) {
if (h!=-1)
this.cfg.setProperty("height",h);
if (x!=-1)
this.cfg.setProperty("x",x);
if (y!=-1)
this.cfg.setProperty("y",y);
this.cfg.setProperty("visible", true);
},
show : function() {
this.cfg.setProperty("visible", true);
},
/**
* Hides the Module element by setting the visible configuration property to false. Also fires two events: beforeHideEvent prior to the visibility change, and hideEvent after.
* @method hide
*/
hide : function() {
this.cfg.setProperty("visible", false);
},
// BUILT-IN EVENT HANDLERS FOR MODULE //
/**
* Default event handler for changing the visibility property of a Module. By default, this is achieved by switching the "display" style between "block" and "none".
* This method is responsible for firing showEvent and hideEvent.
* @param {String} type The CustomEvent type (usually the property name)
* @param {Object[]} args The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
* @param {Object} obj The scope object. For configuration handlers, this will usually equal the owner.
* @method configVisible
*/
configVisible : function(type, args, obj) {
var visible = args[0];
if (visible) {
this.beforeShowEvent.fire();
YAHOO.util.Dom.setStyle(this.element, "display", "block");
this.showEvent.fire();
} else {
this.beforeHideEvent.fire();
YAHOO.util.Dom.setStyle(this.element, "display", "none");
this.hideEvent.fire();
}
},
/**
* Default event handler for the "monitorresize" configuration property
* @param {String} type The CustomEvent type (usually the property name)
* @param {Object[]} args The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
* @param {Object} obj The scope object. For configuration handlers, this will usually equal the owner.
* @method configMonitorResize
*/
configMonitorResize : function(type, args, obj) {
var monitor = args[0];
if (monitor) {
this.initResizeMonitor();
} else {
YAHOO.widget.Module.textResizeEvent.unsubscribe(this.onDomResize, this, true);
this.resizeMonitor = null;
}
}
};
/**
* Returns a String representation of the Object.
* @method toString
* @return {String} The string representation of the Module
*/
YAHOO.widget.Module.prototype.toString = function() {
return "Module " + this.id;
};
/**
* Overlay is a Module that is absolutely positioned above the page flow. It has convenience methods for positioning and sizing, as well as options for controlling zIndex and constraining the Overlay's position to the current visible viewport. Overlay also contains a dynamicly generated IFRAME which is placed beneath it for Internet Explorer 6 and 5.x so that it will be properly rendered above SELECT elements.
* @namespace YAHOO.widget
* @class Overlay
* @extends YAHOO.widget.Module
* @param {String} el The element ID representing the Overlay OR
* @param {HTMLElement} el The element representing the Overlay
* @param {Object} userConfig The configuration object literal containing 10/23/2006the configuration that should be set for this Overlay. See configuration documentation for more details.
* @constructor
*/
YAHOO.widget.Overlay = function(el, userConfig) {
YAHOO.widget.Overlay.superclass.constructor.call(this, el, userConfig);
};
YAHOO.extend(YAHOO.widget.Overlay, YAHOO.widget.Module);
/**
* Constant representing the name of the Overlay's events
* @property YAHOO.widget.Overlay._EVENT_TYPES
* @private
* @final
* @type Object
*/
YAHOO.widget.Overlay._EVENT_TYPES = {
"BEFORE_MOVE": "beforeMove",
"MOVE": "move"
};
/**
* Constant representing the Overlay's configuration properties
* @property YAHOO.widget.Overlay._DEFAULT_CONFIG
* @private
* @final
* @type Object
*/
YAHOO.widget.Overlay._DEFAULT_CONFIG = {
"X": {
key: "x",
validator:YAHOO.lang.isNumber,
suppressEvent:true, supercedes:["iframe"]
},
"Y": {
key: "y",
validator:YAHOO.lang.isNumber,
suppressEvent:true, supercedes:["iframe"]
},
"XY": {
key: "xy",
suppressEvent:true,
supercedes:["iframe"]
},
"CONTEXT": {
key: "context",
suppressEvent:true,
supercedes:["iframe"]
},
"FIXED_CENTER": {
key: "fixedcenter",
value:false,
validator:YAHOO.lang.isBoolean,
supercedes:["iframe","visible"]
},
"WIDTH": {
key: "width",
suppressEvent:true,
supercedes:["iframe"]
},
"HEIGHT": {
key: "height",
suppressEvent:true,
supercedes:["iframe"]
},
"ZINDEX": {
key: "zindex",
value:null
},
"CONSTRAIN_TO_VIEWPORT": {
key: "constraintoviewport",
value:false,
validator:YAHOO.lang.isBoolean,
supercedes:["iframe","x","y","xy"]
},
"IFRAME": {
key: "iframe",
value:(YAHOO.widget.Module.prototype.browser == "ie" ? true : false),
validator:YAHOO.lang.isBoolean,
supercedes:["zIndex"]
}
};
/**
* The URL that will be placed in the iframe
* @property YAHOO.widget.Overlay.IFRAME_SRC
* @static
* @final
* @type String
*/
YAHOO.widget.Overlay.IFRAME_SRC = "javascript:false;";
/**
* Constant representing the top left corner of an element, used for configuring the context element alignment
* @property YAHOO.widget.Overlay.TOP_LEFT
* @static
* @final
* @type String
*/
YAHOO.widget.Overlay.TOP_LEFT = "tl";
/**
* Constant representing the top right corner of an element, used for configuring the context element alignment
* @property YAHOO.widget.Overlay.TOP_RIGHT
* @static
* @final
* @type String
*/
YAHOO.widget.Overlay.TOP_RIGHT = "tr";
/**
* Constant representing the top bottom left corner of an element, used for configuring the context element alignment
* @property YAHOO.widget.Overlay.BOTTOM_LEFT
* @static
* @final
* @type String
*/
YAHOO.widget.Overlay.BOTTOM_LEFT = "bl";
/**
* Constant representing the bottom right corner of an element, used for configuring the context element alignment
* @property YAHOO.widget.Overlay.BOTTOM_RIGHT
* @static
* @final
* @type String
*/
YAHOO.widget.Overlay.BOTTOM_RIGHT = "br";
/**
* Constant representing the default CSS class used for an Overlay
* @property YAHOO.widget.Overlay.CSS_OVERLAY
* @static
* @final
* @type String
*/
YAHOO.widget.Overlay.CSS_OVERLAY = "yui-overlay";
/**
* The Overlay initialization method, which is executed for Overlay and all of its subclasses. This method is automatically called by the constructor, and sets up all DOM references for pre-existing markup, and creates required markup if it is not already present.
* @method init
* @param {String} el The element ID representing the Overlay OR
* @param {HTMLElement} el The element representing the Overlay
* @param {Object} userConfig The configuration object literal containing the configuration that should be set for this Overlay. See configuration documentation for more details.
*/
YAHOO.widget.Overlay.prototype.init = function(el, userConfig) {
YAHOO.widget.Overlay.superclass.init.call(this, el/*, userConfig*/); // Note that we don't pass the user config in here yet because we only want it executed once, at the lowest subclass level
this.beforeInitEvent.fire(YAHOO.widget.Overlay);
YAHOO.util.Dom.addClass(this.element, YAHOO.widget.Overlay.CSS_OVERLAY);
if (userConfig) {
this.cfg.applyConfig(userConfig, true);
}
if (this.platform == "mac" && this.browser == "gecko") {
if (! YAHOO.util.Config.alreadySubscribed(this.showEvent,this.showMacGeckoScrollbars,this)) {
this.showEvent.subscribe(this.showMacGeckoScrollbars,this,true);
}
if (! YAHOO.util.Config.alreadySubscribed(this.hideEvent,this.hideMacGeckoScrollbars,this)) {
this.hideEvent.subscribe(this.hideMacGeckoScrollbars,this,true);
}
}
this.initEvent.fire(YAHOO.widget.Overlay);
};
/**
* Initializes the custom events for Overlay which are fired automatically at appropriate times by the Overlay class.
* @method initEvents
*/
YAHOO.widget.Overlay.prototype.initEvents = function() {
YAHOO.widget.Overlay.superclass.initEvents.call(this);
var EVENT_TYPES = YAHOO.widget.Overlay._EVENT_TYPES;
/**
* CustomEvent fired before the Overlay is moved.
* @event beforeMoveEvent
* @param {Number} x x coordinate
* @param {Number} y y coordinate
*/
this.beforeMoveEvent = new YAHOO.util.CustomEvent(EVENT_TYPES.BEFORE_MOVE, this);
/**
* CustomEvent fired after the Overlay is moved.
* @event moveEvent
* @param {Number} x x coordinate
* @param {Number} y y coordinate
*/
this.moveEvent = new YAHOO.util.CustomEvent(EVENT_TYPES.MOVE, this);
};
/**
* Initializes the class's configurable properties which can be changed using the Overlay's Config object (cfg).
* @method initDefaultConfig
*/
YAHOO.widget.Overlay.prototype.initDefaultConfig = function() {
YAHOO.widget.Overlay.superclass.initDefaultConfig.call(this);
// Add overlay config properties //
var DEFAULT_CONFIG = YAHOO.widget.Overlay._DEFAULT_CONFIG;
/**
* The absolute x-coordinate position of the Overlay
* @config x
* @type Number
* @default null
*/
this.cfg.addProperty(
DEFAULT_CONFIG.X.key,
{
handler: this.configX,
validator: DEFAULT_CONFIG.X.validator,
suppressEvent: DEFAULT_CONFIG.X.suppressEvent,
supercedes: DEFAULT_CONFIG.X.supercedes
}
);
/**
* The absolute y-coordinate position of the Overlay
* @config y
* @type Number
* @default null
*/
this.cfg.addProperty(
DEFAULT_CONFIG.Y.key,
{
handler: this.configY,
validator: DEFAULT_CONFIG.Y.validator,
suppressEvent: DEFAULT_CONFIG.Y.suppressEvent,
supercedes: DEFAULT_CONFIG.Y.supercedes
}
);
/**
* An array with the absolute x and y positions of the Overlay
* @config xy
* @type Number[]
* @default null
*/
this.cfg.addProperty(
DEFAULT_CONFIG.XY.key,
{
handler: this.configXY,
suppressEvent: DEFAULT_CONFIG.XY.suppressEvent,
supercedes: DEFAULT_CONFIG.XY.supercedes
}
);
/**
* The array of context arguments for context-sensitive positioning. The format is: [id or element, element corner, context corner]. For example, setting this property to ["img1", "tl", "bl"] would align the Overlay's top left corner to the context element's bottom left corner.
* @config context
* @type Array
* @default null
*/
this.cfg.addProperty(
DEFAULT_CONFIG.CONTEXT.key,
{
handler: this.configContext,
suppressEvent: DEFAULT_CONFIG.CONTEXT.suppressEvent,
supercedes: DEFAULT_CONFIG.CONTEXT.supercedes
}
);
/**
* True if the Overlay should be anchored to the center of the viewport.
* @config fixedcenter
* @type Boolean
* @default false
*/
this.cfg.addProperty(
DEFAULT_CONFIG.FIXED_CENTER.key,
{
handler: this.configFixedCenter,
value: DEFAULT_CONFIG.FIXED_CENTER.value,
validator: DEFAULT_CONFIG.FIXED_CENTER.validator,
supercedes: DEFAULT_CONFIG.FIXED_CENTER.supercedes
}
);
/**
* CSS width of the Overlay.
* @config width
* @type String
* @default null
*/
this.cfg.addProperty(
DEFAULT_CONFIG.WIDTH.key,
{
handler: this.configWidth,
suppressEvent: DEFAULT_CONFIG.WIDTH.suppressEvent,
supercedes: DEFAULT_CONFIG.WIDTH.supercedes
}
);
/**
* CSS height of the Overlay.
* @config height
* @type String
* @default null
*/
this.cfg.addProperty(
DEFAULT_CONFIG.HEIGHT.key,
{
handler: this.configHeight,
suppressEvent: DEFAULT_CONFIG.HEIGHT.suppressEvent,
supercedes: DEFAULT_CONFIG.HEIGHT.supercedes
}
);
/**
* CSS z-index of the Overlay.
* @config zIndex
* @type Number
* @default null
*/
this.cfg.addProperty(
DEFAULT_CONFIG.ZINDEX.key,
{
handler: this.configzIndex,
value: DEFAULT_CONFIG.ZINDEX.value
}
);
/**
* True if the Overlay should be prevented from being positioned out of the viewport.
* @config constraintoviewport
* @type Boolean
* @default false
*/
this.cfg.addProperty(
DEFAULT_CONFIG.CONSTRAIN_TO_VIEWPORT.key,
{
handler: this.configConstrainToViewport,
value: DEFAULT_CONFIG.CONSTRAIN_TO_VIEWPORT.value,
validator: DEFAULT_CONFIG.CONSTRAIN_TO_VIEWPORT.validator,
supercedes: DEFAULT_CONFIG.CONSTRAIN_TO_VIEWPORT.supercedes
}
);
/**
* True if the Overlay should have an IFRAME shim (for correcting the select z-index bug in IE6 and below).
* @config iframe
* @type Boolean
* @default true for IE6 and below, false for all others
*/
this.cfg.addProperty(
DEFAULT_CONFIG.IFRAME.key,
{
handler: this.configIframe,
value: DEFAULT_CONFIG.IFRAME.value,
validator: DEFAULT_CONFIG.IFRAME.validator,
supercedes: DEFAULT_CONFIG.IFRAME.supercedes
}
);
};
/**
* Moves the Overlay to the specified position. This function is identical to calling this.cfg.setProperty("xy", [x,y]);
* @method moveTo
* @param {Number} x The Overlay's new x position
* @param {Number} y The Overlay's new y position
*/
YAHOO.widget.Overlay.prototype.moveTo = function(x, y) {
this.cfg.setProperty("xy",[x,y]);
};
/**
* Adds a special CSS class to the Overlay when Mac/Gecko is in use, to work around a Gecko bug where
* scrollbars cannot be hidden. See https://bugzilla.mozilla.org/show_bug.cgi?id=187435
* @method hideMacGeckoScrollbars
*/
YAHOO.widget.Overlay.prototype.hideMacGeckoScrollbars = function() {
YAHOO.util.Dom.removeClass(this.element, "show-scrollbars");
YAHOO.util.Dom.addClass(this.element, "hide-scrollbars");
};
/**
* Removes a special CSS class from the Overlay when Mac/Gecko is in use, to work around a Gecko bug where
* scrollbars cannot be hidden. See https://bugzilla.mozilla.org/show_bug.cgi?id=187435
* @method showMacGeckoScrollbars
*/
YAHOO.widget.Overlay.prototype.showMacGeckoScrollbars = function() {
YAHOO.util.Dom.removeClass(this.element, "hide-scrollbars");
YAHOO.util.Dom.addClass(this.element, "show-scrollbars");
};
// BEGIN BUILT-IN PROPERTY EVENT HANDLERS //
/**
* The default event handler fired when the "visible" property is changed. This method is responsible for firing showEvent and hideEvent.
* @method configVisible
* @param {String} type The CustomEvent type (usually the property name)
* @param {Object[]} args The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
* @param {Object} obj The scope object. For configuration handlers, this will usually equal the owner.
*/
YAHOO.widget.Overlay.prototype.configVisible = function(type, args, obj) {
var visible = args[0];
var currentVis = YAHOO.util.Dom.getStyle(this.element, "visibility");
if (currentVis == "inherit") {
var e = this.element.parentNode;
while (e.nodeType != 9 && e.nodeType != 11) {
currentVis = YAHOO.util.Dom.getStyle(e, "visibility");
if (currentVis != "inherit") { break; }
e = e.parentNode;
}
if (currentVis == "inherit") {
currentVis = "visible";
}
}
var effect = this.cfg.getProperty("effect");
var effectInstances = [];
if (effect) {
if (effect instanceof Array) {
for (var i=0;i rightConstraint) {
x = rightConstraint;
}
if (y < topConstraint) {
y = topConstraint;
} else if (y > bottomConstraint) {
y = bottomConstraint;
}
this.cfg.setProperty("x", x, true);
this.cfg.setProperty("y", y, true);
this.cfg.setProperty("xy", [x,y], true);
};
/**
* Centers the container in the viewport.
* @method center
*/
YAHOO.widget.Overlay.prototype.center = function() {
var scrollX = document.documentElement.scrollLeft || document.body.scrollLeft;
var scrollY = document.documentElement.scrollTop || document.body.scrollTop;
var viewPortWidth = YAHOO.util.Dom.getClientWidth();
var viewPortHeight = YAHOO.util.Dom.getClientHeight();
var elementWidth = this.element.offsetWidth;
var elementHeight = this.element.offsetHeight;
var x = (viewPortWidth / 2) - (elementWidth / 2) + scrollX;
var y = (viewPortHeight / 2) - (elementHeight / 2) + scrollY;
this.cfg.setProperty("xy", [parseInt(x, 10), parseInt(y, 10)]);
this.cfg.refireEvent("iframe");
};
/**
* Synchronizes the Panel's "xy", "x", and "y" properties with the Panel's position in the DOM. This is primarily used to update position information during drag & drop.
* @method syncPosition
*/
YAHOO.widget.Overlay.prototype.syncPosition = function() {
var pos = YAHOO.util.Dom.getXY(this.element);
this.cfg.setProperty("x", pos[0], true);
this.cfg.setProperty("y", pos[1], true);
this.cfg.setProperty("xy", pos, true);
};
/**
* Event handler fired when the resize monitor element is resized.
* @method onDomResize
* @param {DOMEvent} e The resize DOM event
* @param {Object} obj The scope object
*/
YAHOO.widget.Overlay.prototype.onDomResize = function(e, obj) {
YAHOO.widget.Overlay.superclass.onDomResize.call(this, e, obj);
var me = this;
setTimeout(function() {
me.syncPosition();
me.cfg.refireEvent("iframe");
me.cfg.refireEvent("context");
}, 0);
};
/**
* Removes the Overlay element from the DOM and sets all child elements to null.
* @method destroy
*/
YAHOO.widget.Overlay.prototype.destroy = function() {
if (this.iframe) {
this.iframe.parentNode.removeChild(this.iframe);
}
this.iframe = null;
YAHOO.widget.Overlay.windowResizeEvent.unsubscribe(this.doCenterOnDOMEvent, this);
YAHOO.widget.Overlay.windowScrollEvent.unsubscribe(this.doCenterOnDOMEvent, this);
YAHOO.widget.Overlay.superclass.destroy.call(this);
};
/**
* Returns a String representation of the object.
* @method toString
* @return {String} The string representation of the Overlay.
*/
YAHOO.widget.Overlay.prototype.toString = function() {
return "Overlay " + this.id;
};
/**
* A singleton CustomEvent used for reacting to the DOM event for window scroll
* @event YAHOO.widget.Overlay.windowScrollEvent
*/
YAHOO.widget.Overlay.windowScrollEvent = new YAHOO.util.CustomEvent("windowScroll");
/**
* A singleton CustomEvent used for reacting to the DOM event for window resize
* @event YAHOO.widget.Overlay.windowResizeEvent
*/
YAHOO.widget.Overlay.windowResizeEvent = new YAHOO.util.CustomEvent("windowResize");
/**
* The DOM event handler used to fire the CustomEvent for window scroll
* @method YAHOO.widget.Overlay.windowScrollHandler
* @static
* @param {DOMEvent} e The DOM scroll event
*/
YAHOO.widget.Overlay.windowScrollHandler = function(e) {
if (YAHOO.widget.Module.prototype.browser == "ie" || YAHOO.widget.Module.prototype.browser == "ie7") {
if (! window.scrollEnd) {
window.scrollEnd = -1;
}
clearTimeout(window.scrollEnd);
window.scrollEnd = setTimeout(function() { YAHOO.widget.Overlay.windowScrollEvent.fire(); }, 1);
} else {
YAHOO.widget.Overlay.windowScrollEvent.fire();
}
};
/**
* The DOM event handler used to fire the CustomEvent for window resize
* @method YAHOO.widget.Overlay.windowResizeHandler
* @static
* @param {DOMEvent} e The DOM resize event
*/
YAHOO.widget.Overlay.windowResizeHandler = function(e) {
if (YAHOO.widget.Module.prototype.browser == "ie" || YAHOO.widget.Module.prototype.browser == "ie7") {
if (! window.resizeEnd) {
window.resizeEnd = -1;
}
clearTimeout(window.resizeEnd);
window.resizeEnd = setTimeout(function() { YAHOO.widget.Overlay.windowResizeEvent.fire(); }, 100);
} else {
YAHOO.widget.Overlay.windowResizeEvent.fire();
}
};
/**
* A boolean that indicated whether the window resize and scroll events have already been subscribed to.
* @property YAHOO.widget.Overlay._initialized
* @private
* @type Boolean
*/
YAHOO.widget.Overlay._initialized = null;
if (YAHOO.widget.Overlay._initialized === null) {
YAHOO.util.Event.addListener(window, "scroll", YAHOO.widget.Overlay.windowScrollHandler);
YAHOO.util.Event.addListener(window, "resize", YAHOO.widget.Overlay.windowResizeHandler);
YAHOO.widget.Overlay._initialized = true;
}
/**
* OverlayManager is used for maintaining the focus status of multiple Overlays.* @namespace YAHOO.widget
* @namespace YAHOO.widget
* @class OverlayManager
* @constructor
* @param {Array} overlays Optional. A collection of Overlays to register with the manager.
* @param {Object} userConfig The object literal representing the user configuration of the OverlayManager
*/
YAHOO.widget.OverlayManager = function(userConfig) {
this.init(userConfig);
};
/**
* The CSS class representing a focused Overlay
* @property YAHOO.widget.OverlayManager.CSS_FOCUSED
* @static
* @final
* @type String
*/
YAHOO.widget.OverlayManager.CSS_FOCUSED = "focused";
YAHOO.widget.OverlayManager.prototype = {
/**
* The class's constructor function
* @property contructor
* @type Function
*/
constructor : YAHOO.widget.OverlayManager,
/**
* The array of Overlays that are currently registered
* @property overlays
* @type YAHOO.widget.Overlay[]
*/
overlays : null,
/**
* Initializes the default configuration of the OverlayManager
* @method initDefaultConfig
*/
initDefaultConfig : function() {
/**
* The collection of registered Overlays in use by the OverlayManager
* @config overlays
* @type YAHOO.widget.Overlay[]
* @default null
*/
this.cfg.addProperty("overlays", { suppressEvent:true } );
/**
* The default DOM event that should be used to focus an Overlay
* @config focusevent
* @type String
* @default "mousedown"
*/
this.cfg.addProperty("focusevent", { value:"mousedown" } );
},
/**
* Initializes the OverlayManager
* @method init
* @param {YAHOO.widget.Overlay[]} overlays Optional. A collection of Overlays to register with the manager.
* @param {Object} userConfig The object literal representing the user configuration of the OverlayManager
*/
init : function(userConfig) {
/**
* The OverlayManager's Config object used for monitoring configuration properties.
* @property cfg
* @type YAHOO.util.Config
*/
this.cfg = new YAHOO.util.Config(this);
this.initDefaultConfig();
if (userConfig) {
this.cfg.applyConfig(userConfig, true);
}
this.cfg.fireQueue();
/**
* The currently activated Overlay
* @property activeOverlay
* @private
* @type YAHOO.widget.Overlay
*/
var activeOverlay = null;
/**
* Returns the currently focused Overlay
* @method getActive
* @return {YAHOO.widget.Overlay} The currently focused Overlay
*/
this.getActive = function() {
return activeOverlay;
};
/**
* Focuses the specified Overlay
* @method focus
* @param {YAHOO.widget.Overlay} overlay The Overlay to focus
* @param {String} overlay The id of the Overlay to focus
*/
this.focus = function(overlay) {
var o = this.find(overlay);
if (o) {
if (activeOverlay != o) {
if(activeOverlay) {
activeOverlay.blur();
}
activeOverlay = o;
YAHOO.util.Dom.addClass(activeOverlay.element, YAHOO.widget.OverlayManager.CSS_FOCUSED);
this.overlays.sort(this.compareZIndexDesc);
var topZIndex = YAHOO.util.Dom.getStyle(this.overlays[0].element, "zIndex");
if (! isNaN(topZIndex) && this.overlays[0] != overlay) {
activeOverlay.cfg.setProperty("zIndex", (parseInt(topZIndex, 10) + 2));
}
this.overlays.sort(this.compareZIndexDesc);
o.focusEvent.fire();
}
}
};
/**
* Removes the specified Overlay from the manager
* @method remove
* @param {YAHOO.widget.Overlay} overlay The Overlay to remove
* @param {String} overlay The id of the Overlay to remove
*/
this.remove = function(overlay) {
var o = this.find(overlay);
if (o) {
var originalZ = YAHOO.util.Dom.getStyle(o.element, "zIndex");
o.cfg.setProperty("zIndex", -1000, true);
this.overlays.sort(this.compareZIndexDesc);
this.overlays = this.overlays.slice(0, this.overlays.length-1);
o.hideEvent.unsubscribe(o.blur);
o.destroyEvent.unsubscribe(this._onOverlayDestroy, o);
if (o.element) {
YAHOO.util.Event.removeListener(o.element, this.cfg.getProperty("focusevent"), this._onOverlayElementFocus);
}
o.cfg.setProperty("zIndex", originalZ, true);
o.cfg.setProperty("manager", null);
o.focusEvent.unsubscribeAll();
o.blurEvent.unsubscribeAll();
o.focusEvent = null;
o.blurEvent = null;
o.focus = null;
o.blur = null;
}
};
/**
* Removes focus from all registered Overlays in the manager
* @method blurAll
*/
this.blurAll = function() {
for (var o=0;o 0) {
return true;
}
} else {
return false;
}
},
/**
* Attempts to locate an Overlay by instance or ID.
* @method find
* @param {YAHOO.widget.Overlay} overlay An Overlay to locate within the manager
* @param {String} overlay An Overlay id to locate within the manager
* @return {YAHOO.widget.Overlay} The requested Overlay, if found, or null if it cannot be located.
*/
find : function(overlay) {
if (overlay instanceof YAHOO.widget.Overlay) {
for (var o=0;o zIndex2) {
return -1;
} else if (zIndex1 < zIndex2) {
return 1;
} else {
return 0;
}
},
/**
* Shows all Overlays in the manager.
* @method showAll
*/
showAll : function() {
for (var o=0;oOR
* @param {HTMLElement} el The element representing the Tooltip
* @param {Object} userConfig The configuration object literal containing the configuration that should be set for this Overlay. See configuration documentation for more details.
*/
YAHOO.widget.Tooltip = function(el, userConfig) {
YAHOO.widget.Tooltip.superclass.constructor.call(this, el, userConfig);
};
YAHOO.extend(YAHOO.widget.Tooltip, YAHOO.widget.Overlay);
/**
* Constant representing the Tooltip CSS class
* @property YAHOO.widget.Tooltip.CSS_TOOLTIP
* @static
* @final
* @type String
*/
YAHOO.widget.Tooltip.CSS_TOOLTIP = "yui-tt";
/**
* Constant representing the Tooltip's configuration properties
* @property YAHOO.widget.Tooltip._DEFAULT_CONFIG
* @private
* @final
* @type Object
*/
YAHOO.widget.Tooltip._DEFAULT_CONFIG = {
"PREVENT_OVERLAP": {
key: "preventoverlap",
value:true,
validator:YAHOO.lang.isBoolean,
supercedes:["x","y","xy"]
},
"SHOW_DELAY": {
key: "showdelay",
value:200,
validator:YAHOO.lang.isNumber
},
"AUTO_DISMISS_DELAY": {
key: "autodismissdelay",
value:5000,
validator:YAHOO.lang.isNumber
},
"HIDE_DELAY": {
key: "hidedelay",
value:250,
validator:YAHOO.lang.isNumber
},
"TEXT": {
key: "text",
suppressEvent:true
},
"CONTAINER": {
key: "container"
}
};
/**
* The Tooltip initialization method. This method is automatically called by the constructor. A Tooltip is automatically rendered by the init method, and it also is set to be invisible by default, and constrained to viewport by default as well.
* @method init
* @param {String} el The element ID representing the Tooltip OR
* @param {HTMLElement} el The element representing the Tooltip
* @param {Object} userConfig The configuration object literal containing the configuration that should be set for this Tooltip. See configuration documentation for more details.
*/
YAHOO.widget.Tooltip.prototype.init = function(el, userConfig) {
if (document.readyState && document.readyState != "complete") {
var deferredInit = function() {
this.init(el, userConfig);
};
YAHOO.util.Event.addListener(window, "load", deferredInit, this, true);
} else {
YAHOO.widget.Tooltip.superclass.init.call(this, el);
this.beforeInitEvent.fire(YAHOO.widget.Tooltip);
YAHOO.util.Dom.addClass(this.element, YAHOO.widget.Tooltip.CSS_TOOLTIP);
if (userConfig) {
this.cfg.applyConfig(userConfig, true);
}
this.cfg.queueProperty("visible",false);
this.cfg.queueProperty("constraintoviewport",true);
this.setBody("");
this.render(this.cfg.getProperty("container"));
this.initEvent.fire(YAHOO.widget.Tooltip);
}
};
/**
* Initializes the class's configurable properties which can be changed using the Overlay's Config object (cfg).
* @method initDefaultConfig
*/
YAHOO.widget.Tooltip.prototype.initDefaultConfig = function() {
YAHOO.widget.Tooltip.superclass.initDefaultConfig.call(this);
var DEFAULT_CONFIG = YAHOO.widget.Tooltip._DEFAULT_CONFIG;
/**
* Specifies whether the Tooltip should be kept from overlapping its context element.
* @config preventoverlap
* @type Boolean
* @default true
*/
this.cfg.addProperty(
DEFAULT_CONFIG.PREVENT_OVERLAP.key,
{
value: DEFAULT_CONFIG.PREVENT_OVERLAP.value,
validator: DEFAULT_CONFIG.PREVENT_OVERLAP.validator,
supercedes: DEFAULT_CONFIG.PREVENT_OVERLAP.supercedes
}
);
/**
* The number of milliseconds to wait before showing a Tooltip on mouseover.
* @config showdelay
* @type Number
* @default 200
*/
this.cfg.addProperty(
DEFAULT_CONFIG.SHOW_DELAY.key,
{
handler: this.configShowDelay,
value: 200,
validator: DEFAULT_CONFIG.SHOW_DELAY.validator
}
);
/**
* The number of milliseconds to wait before automatically dismissing a Tooltip after the mouse has been resting on the context element.
* @config autodismissdelay
* @type Number
* @default 5000
*/
this.cfg.addProperty(
DEFAULT_CONFIG.AUTO_DISMISS_DELAY.key,
{
handler: this.configAutoDismissDelay,
value: DEFAULT_CONFIG.AUTO_DISMISS_DELAY.value,
validator: DEFAULT_CONFIG.AUTO_DISMISS_DELAY.validator
}
);
/**
* The number of milliseconds to wait before hiding a Tooltip on mouseover.
* @config hidedelay
* @type Number
* @default 250
*/
this.cfg.addProperty(
DEFAULT_CONFIG.HIDE_DELAY.key,
{
handler: this.configHideDelay,
value: DEFAULT_CONFIG.HIDE_DELAY.value,
validator: DEFAULT_CONFIG.HIDE_DELAY.validator
}
);
/**
* Specifies the Tooltip's text.
* @config text
* @type String
* @default null
*/
this.cfg.addProperty(
DEFAULT_CONFIG.TEXT.key,
{
handler: this.configText,
suppressEvent: DEFAULT_CONFIG.TEXT.suppressEvent
}
);
/**
* Specifies the container element that the Tooltip's markup should be rendered into.
* @config container
* @type HTMLElement/String
* @default document.body
*/
this.cfg.addProperty(
DEFAULT_CONFIG.CONTAINER.key,
{
handler: this.configContainer,
value: document.body
}
);
/**
* Specifies the element or elements that the Tooltip should be anchored to on mouseover.
* @config context
* @type HTMLElement[]/String[]
* @default null
*/
};
// BEGIN BUILT-IN PROPERTY EVENT HANDLERS //
/**
* The default event handler fired when the "text" property is changed.
* @method configText
* @param {String} type The CustomEvent type (usually the property name)
* @param {Object[]} args The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
* @param {Object} obj The scope object. For configuration handlers, this will usually equal the owner.
*/
YAHOO.widget.Tooltip.prototype.configText = function(type, args, obj) {
var text = args[0];
if (text) {
this.setBody(text);
}
};
/**
* The default event handler fired when the "container" property is changed.
* @method configContainer
* @param {String} type The CustomEvent type (usually the property name)
* @param {Object[]} args The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
* @param {Object} obj The scope object. For configuration handlers, this will usually equal the owner.
*/
YAHOO.widget.Tooltip.prototype.configContainer = function(type, args, obj) {
var container = args[0];
if (typeof container == 'string') {
this.cfg.setProperty("container", document.getElementById(container), true);
}
};
/**
* @method _removeEventListeners
* @description Removes all of the DOM event handlers from the HTML element(s)
* that trigger the display of the tooltip.
* @protected
*/
YAHOO.widget.Tooltip.prototype._removeEventListeners = function() {
var aElements = this._context;
if (aElements) {
var nElements = aElements.length;
if (nElements > 0) {
var i = nElements - 1,
oElement;
do {
oElement = aElements[i];
YAHOO.util.Event.removeListener(oElement, "mouseover", this.onContextMouseOver);
YAHOO.util.Event.removeListener(oElement, "mousemove", this.onContextMouseMove);
YAHOO.util.Event.removeListener(oElement, "mouseout", this.onContextMouseOut);
}
while(i--);
}
}
};
/**
* The default event handler fired when the "context" property is changed.
* @method configContext
* @param {String} type The CustomEvent type (usually the property name)
* @param {Object[]} args The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
* @param {Object} obj The scope object. For configuration handlers, this will usually equal the owner.
*/
YAHOO.widget.Tooltip.prototype.configContext = function(type, args, obj) {
var context = args[0];
if (context) {
// Normalize parameter into an array
if (! (context instanceof Array)) {
if (typeof context == "string") {
this.cfg.setProperty("context", [document.getElementById(context)], true);
} else { // Assuming this is an element
this.cfg.setProperty("context", [context], true);
}
context = this.cfg.getProperty("context");
}
// Remove any existing mouseover/mouseout listeners
this._removeEventListeners();
// Add mouseover/mouseout listeners to context elements
this._context = context;
var aElements = this._context;
if (aElements) {
var nElements = aElements.length;
if (nElements > 0) {
var i = nElements - 1,
oElement;
do {
oElement = aElements[i];
YAHOO.util.Event.addListener(oElement, "mouseover", this.onContextMouseOver, this);
YAHOO.util.Event.addListener(oElement, "mousemove", this.onContextMouseMove, this);
YAHOO.util.Event.addListener(oElement, "mouseout", this.onContextMouseOut, this);
}
while(i--);
}
}
}
};
// END BUILT-IN PROPERTY EVENT HANDLERS //
// BEGIN BUILT-IN DOM EVENT HANDLERS //
/**
* The default event handler fired when the user moves the mouse while over the context element.
* @method onContextMouseMove
* @param {DOMEvent} e The current DOM event
* @param {Object} obj The object argument
*/
YAHOO.widget.Tooltip.prototype.onContextMouseMove = function(e, obj) {
obj.pageX = YAHOO.util.Event.getPageX(e);
obj.pageY = YAHOO.util.Event.getPageY(e);
};
/**
* The default event handler fired when the user mouses over the context element.
* @method onContextMouseOver
* @param {DOMEvent} e The current DOM event
* @param {Object} obj The object argument
*/
YAHOO.widget.Tooltip.prototype.onContextMouseOver = function(e, obj) {
if (obj.hideProcId) {
clearTimeout(obj.hideProcId);
obj.hideProcId = null;
}
var context = this;
YAHOO.util.Event.addListener(context, "mousemove", obj.onContextMouseMove, obj);
if (context.title) {
obj._tempTitle = context.title;
context.title = "";
}
/**
* The unique process ID associated with the thread responsible for showing the Tooltip.
* @type int
*/
obj.showProcId = obj.doShow(e, context);
};
/**
* The default event handler fired when the user mouses out of the context element.
* @method onContextMouseOut
* @param {DOMEvent} e The current DOM event
* @param {Object} obj The object argument
*/
YAHOO.widget.Tooltip.prototype.onContextMouseOut = function(e, obj) {
var el = this;
if (obj._tempTitle) {
el.title = obj._tempTitle;
obj._tempTitle = null;
}
if (obj.showProcId) {
clearTimeout(obj.showProcId);
obj.showProcId = null;
}
if (obj.hideProcId) {
clearTimeout(obj.hideProcId);
obj.hideProcId = null;
}
obj.hideProcId = setTimeout(function() {
obj.hide();
}, obj.cfg.getProperty("hidedelay"));
};
// END BUILT-IN DOM EVENT HANDLERS //
/**
* Processes the showing of the Tooltip by setting the timeout delay and offset of the Tooltip.
* @method doShow
* @param {DOMEvent} e The current DOM event
* @return {Number} The process ID of the timeout function associated with doShow
*/
YAHOO.widget.Tooltip.prototype.doShow = function(e, context) {
var yOffset = 25;
if (this.browser == "opera" && context.tagName && context.tagName.toUpperCase() == "A") {
yOffset += 12;
}
var me = this;
return setTimeout(
function() {
if (me._tempTitle) {
me.setBody(me._tempTitle);
} else {
me.cfg.refireEvent("text");
}
me.moveTo(me.pageX, me.pageY + yOffset);
if (me.cfg.getProperty("preventoverlap")) {
me.preventOverlap(me.pageX, me.pageY);
}
YAHOO.util.Event.removeListener(context, "mousemove", me.onContextMouseMove);
me.show();
me.hideProcId = me.doHide();
},
this.cfg.getProperty("showdelay"));
};
/**
* Sets the timeout for the auto-dismiss delay, which by default is 5 seconds, meaning that a tooltip will automatically dismiss itself after 5 seconds of being displayed.
* @method doHide
*/
YAHOO.widget.Tooltip.prototype.doHide = function() {
var me = this;
return setTimeout(
function() {
me.hide();
},
this.cfg.getProperty("autodismissdelay"));
};
/**
* Fired when the Tooltip is moved, this event handler is used to prevent the Tooltip from overlapping with its context element.
* @method preventOverlay
* @param {Number} pageX The x coordinate position of the mouse pointer
* @param {Number} pageY The y coordinate position of the mouse pointer
*/
YAHOO.widget.Tooltip.prototype.preventOverlap = function(pageX, pageY) {
var height = this.element.offsetHeight;
var elementRegion = YAHOO.util.Dom.getRegion(this.element);
elementRegion.top -= 5;
elementRegion.left -= 5;
elementRegion.right += 5;
elementRegion.bottom += 5;
var mousePoint = new YAHOO.util.Point(pageX, pageY);
if (elementRegion.contains(mousePoint)) {
this.cfg.setProperty("y", (pageY-height-5));
}
};
/**
* Removes the Tooltip element from the DOM and sets all child elements to null.
* @method destroy
*/
YAHOO.widget.Tooltip.prototype.destroy = function() {
// Remove any existing mouseover/mouseout listeners
this._removeEventListeners();
YAHOO.widget.Tooltip.superclass.destroy.call(this);
};
/**
* Returns a string representation of the object.
* @method toString
* @return {String} The string representation of the Tooltip
*/
YAHOO.widget.Tooltip.prototype.toString = function() {
return "Tooltip " + this.id;
};
/**
* Panel is an implementation of Overlay that behaves like an OS window, with a draggable header and an optional close icon at the top right.
* @namespace YAHOO.widget
* @class Panel
* @extends YAHOO.widget.Overlay
* @constructor
* @param {String} el The element ID representing the Panel OR
* @param {HTMLElement} el The element representing the Panel
* @param {Object} userConfig The configuration object literal containing the configuration that should be set for this Panel. See configuration documentation for more details.
*/
YAHOO.widget.Panel = function(el, userConfig) {
YAHOO.widget.Panel.superclass.constructor.call(this, el, userConfig);
};
YAHOO.extend(YAHOO.widget.Panel, YAHOO.widget.Overlay);
/**
* Constant representing the default CSS class used for a Panel
* @property YAHOO.widget.Panel.CSS_PANEL
* @static
* @final
* @type String
*/
YAHOO.widget.Panel.CSS_PANEL = "yui-panel";
/**
* Constant representing the default CSS class used for a Panel's wrapping container
* @property YAHOO.widget.Panel.CSS_PANEL_CONTAINER
* @static
* @final
* @type String
*/
YAHOO.widget.Panel.CSS_PANEL_CONTAINER = "yui-panel-container";
/**
* Constant representing the name of the Panel's events
* @property YAHOO.widget.Panel._EVENT_TYPES
* @private
* @final
* @type Object
*/
YAHOO.widget.Panel._EVENT_TYPES = {
"SHOW_MASK": "showMask",
"HIDE_MASK": "hideMask",
"DRAG": "drag"
};
/**
* Constant representing the Panel's configuration properties
* @property YAHOO.widget.Panel._DEFAULT_CONFIG
* @private
* @final
* @type Object
*/
YAHOO.widget.Panel._DEFAULT_CONFIG = {
"CLOSE": {
key: "close",
value:true,
validator:YAHOO.lang.isBoolean,
supercedes:["visible"]
},
"DRAGGABLE": {
key: "draggable",
value:(YAHOO.util.DD ? true : false),
validator:YAHOO.lang.isBoolean,
supercedes:["visible"]
},
"UNDERLAY": {
key: "underlay",
value:"shadow",
supercedes:["visible"]
},
"MODAL": {
key: "modal",
value:false,
validator:YAHOO.lang.isBoolean,
supercedes:["visible"]
},
"KEY_LISTENERS": {
key: "keylisteners",
suppressEvent:true,
supercedes:["visible"]
}
};
/**
* The Overlay initialization method, which is executed for Overlay and all of its subclasses. This method is automatically called by the constructor, and sets up all DOM references for pre-existing markup, and creates required markup if it is not already present.
* @method init
* @param {String} el The element ID representing the Overlay OR
* @param {HTMLElement} el The element representing the Overlay
* @param {Object} userConfig The configuration object literal containing the configuration that should be set for this Overlay. See configuration documentation for more details.
*/
YAHOO.widget.Panel.prototype.init = function(el, userConfig) {
YAHOO.widget.Panel.superclass.init.call(this, el/*, userConfig*/); // Note that we don't pass the user config in here yet because we only want it executed once, at the lowest subclass level
this.beforeInitEvent.fire(YAHOO.widget.Panel);
YAHOO.util.Dom.addClass(this.element, YAHOO.widget.Panel.CSS_PANEL);
this.buildWrapper();
if (userConfig) {
this.cfg.applyConfig(userConfig, true);
}
this.beforeRenderEvent.subscribe(function() {
var draggable = this.cfg.getProperty("draggable");
if (draggable) {
if (! this.header) {
this.setHeader(" ");
}
}
}, this, true);
this.renderEvent.subscribe(function() {
/*
If no value for the "width" configuration property was specified,
set it to the offsetWidth. If the "width" is not set, then in IE
you can only drag the panel when you put the cursor on the
header's text.
*/
var sWidth = this.cfg.getProperty("width");
if(!sWidth) {
this.cfg.setProperty("width", (this.element.offsetWidth + "px"));
}
});
var me = this;
var doBlur = function() {
this.blur();
};
this.showMaskEvent.subscribe(function() {
var checkFocusable = function(el) {
var sTagName = el.tagName.toUpperCase(),
bFocusable = false;
switch(sTagName) {
case "A":
case "BUTTON":
case "SELECT":
case "TEXTAREA":
if (! YAHOO.util.Dom.isAncestor(me.element, el)) {
YAHOO.util.Event.addListener(el, "focus", doBlur, el, true);
bFocusable = true;
}
break;
case "INPUT":
if (el.type != "hidden" && ! YAHOO.util.Dom.isAncestor(me.element, el)) {
YAHOO.util.Event.addListener(el, "focus", doBlur, el, true);
bFocusable = true;
}
break;
}
return bFocusable;
};
this.focusableElements = YAHOO.util.Dom.getElementsBy(checkFocusable);
}, this, true);
this.hideMaskEvent.subscribe(function() {
for (var i=0;i400)
this.underlay.style.height="418px";
else
this.underlay.style.height = this.innerElement.offsetHeight + "px";
}
};
/**
* Event handler fired when the resize monitor element is resized.
* @method onDomResize
* @param {DOMEvent} e The resize DOM event
* @param {Object} obj The scope object
*/
YAHOO.widget.Panel.prototype.onDomResize = function(e, obj) {
YAHOO.widget.Panel.superclass.onDomResize.call(this, e, obj);
var me = this;
setTimeout(function() {
me.sizeUnderlay();
}, 0);
};
/**
* Registers the Panel's header for drag & drop capability.
* @method registerDragDrop
*/
function PanelMouseDown(e)
{
e = e ? e : window.event;
SS_dragX=e.clientX;
SS_dragY=e.clientY;
SS_scrollingOn=1;
document.onmouseup=PanelMouseUp;
document.onmousemove=PanelMouseMove;
}
function PanelMouseUp(e)
{
SS_scrollingOn=0;
document.onmouseup=null;
document.onmousemove=null;
}
function PanelMouseMove(e)
{
if (SS_scrollingOn==1)
{
e = e ? e : window.event;
oElem=document.getElementById("SS_largepanel");
var x = parseInt(oElem.style.left);
var y = parseInt(oElem.style.top);
oElem.style.left=(x+e.clientX-SS_dragX)+"px";
oElem.style.top=(y+e.clientY-SS_dragY)+"px"
SS_dragX=e.clientX;
SS_dragY=e.clientY;
}
}
YAHOO.widget.Panel.prototype.registerDragDrop = function() {
if (this.header) {
this.header.onmousedown=PanelMouseDown;
// this.header.onmouseup=PanelMouseUp;
// this.header.onmousemove=PanelMouseMove;
/* if(!YAHOO.util.DD) {
return;
}
this.dd = new YAHOO.util.DD(this.element.id, this.id);
if (! this.header.id) {
this.header.id = this.id + "_h";
}
var me = this;
this.dd.startDrag = function() {
if (me.browser == "ie") {
YAHOO.util.Dom.addClass(me.element,"drag");
}
if (me.cfg.getProperty("constraintoviewport")) {
var offsetHeight = me.element.offsetHeight;
var offsetWidth = me.element.offsetWidth;
var viewPortWidth = YAHOO.util.Dom.getViewportWidth();
var viewPortHeight = YAHOO.util.Dom.getViewportHeight();
var scrollX = window.scrollX || document.documentElement.scrollLeft;
var scrollY = window.scrollY || document.documentElement.scrollTop;
var topConstraint = scrollY + 10;
var leftConstraint = scrollX + 10;
var bottomConstraint = scrollY + viewPortHeight - offsetHeight - 10;
var rightConstraint = scrollX + viewPortWidth - offsetWidth - 10;
this.minX = leftConstraint;
this.maxX = rightConstraint;
this.constrainX = true;
this.minY = topConstraint;
this.maxY = bottomConstraint;
this.constrainY = true;
} else {
this.constrainX = false;
this.constrainY = false;
}
me.dragEvent.fire("startDrag", arguments);
};
this.dd.onDrag = function() {
me.syncPosition();
me.cfg.refireEvent("iframe");
if (this.platform == "mac" && this.browser == "gecko") {
this.showMacGeckoScrollbars();
}
me.dragEvent.fire("onDrag", arguments);
};
this.dd.endDrag = function() {
if (me.browser == "ie") {
YAHOO.util.Dom.removeClass(me.element,"drag");
}
me.dragEvent.fire("endDrag", arguments);
};
this.dd.setHandleElId(this.header.id);
this.dd.addInvalidHandleType("INPUT");
this.dd.addInvalidHandleType("SELECT");
this.dd.addInvalidHandleType("TEXTAREA"); */
}
};
/**
* Builds the mask that is laid over the document when the Panel is configured to be modal.
* @method buildMask
*/
YAHOO.widget.Panel.prototype.buildMask = function() {
if (! this.mask) {
this.mask = document.createElement("div");
this.mask.id = this.id + "_mask";
this.mask.className = "mask";
this.mask.innerHTML = " ";
var maskClick = function(e, obj) {
YAHOO.util.Event.stopEvent(e);
};
var firstChild = document.body.firstChild;
if (firstChild) {
document.body.insertBefore(this.mask, document.body.firstChild);
} else {
document.body.appendChild(this.mask);
}
}
};
/**
* Hides the modality mask.
* @method hideMask
*/
YAHOO.widget.Panel.prototype.hideMask = function() {
if (this.cfg.getProperty("modal") && this.mask) {
this.mask.style.display = "none";
this.hideMaskEvent.fire();
YAHOO.util.Dom.removeClass(document.body, "masked");
}
};
/**
* Shows the modality mask.
* @method showMask
*/
YAHOO.widget.Panel.prototype.showMask = function() {
if (this.cfg.getProperty("modal") && this.mask) {
YAHOO.util.Dom.addClass(document.body, "masked");
this.sizeMask();
this.mask.style.display = "block";
this.showMaskEvent.fire();
}
};
/**
* Sets the size of the modality mask to cover the entire scrollable area of the document
* @method sizeMask
*/
YAHOO.widget.Panel.prototype.sizeMask = function() {
if (this.mask) {
this.mask.style.height = YAHOO.util.Dom.getDocumentHeight()+"px";
this.mask.style.width = YAHOO.util.Dom.getDocumentWidth()+"px";
}
};
/**
* Renders the Panel by inserting the elements that are not already in the main Panel into their correct places. Optionally appends the Panel to the specified node prior to the render's execution. NOTE: For Panels without existing markup, the appendToNode argument is REQUIRED. If this argument is ommitted and the current element is not present in the document, the function will return false, indicating that the render was a failure.
* @method render
* @param {String} appendToNode The element id to which the Module should be appended to prior to rendering OR
* @param {HTMLElement} appendToNode The element to which the Module should be appended to prior to rendering
* @return {boolean} Success or failure of the render
*/
YAHOO.widget.Panel.prototype.render = function(appendToNode) {
return YAHOO.widget.Panel.superclass.render.call(this, appendToNode, this.innerElement);
};
/**
* Removes the Panel element from the DOM and sets all child elements to null.
* @method destroy
*/
YAHOO.widget.Panel.prototype.destroy = function() {
YAHOO.widget.Overlay.windowResizeEvent.unsubscribe(this.sizeMask, this);
if(this.close) {
YAHOO.util.Event.purgeElement(this.close);
}
YAHOO.widget.Panel.superclass.destroy.call(this);
};
/**
* Returns a String representation of the object.
* @method toString
* @return {String} The string representation of the Panel.
*/
YAHOO.widget.Panel.prototype.toString = function() {
return "Panel " + this.id;
};
/**
* Dialog is an implementation of Panel that can be used to submit form data. Built-in functionality for buttons with event handlers is included, and button sets can be build dynamically, or the preincluded ones for Submit/Cancel and OK/Cancel can be utilized. Forms can be processed in 3 ways -- via an asynchronous Connection utility call, a simple form POST or GET, or manually.
* @namespace YAHOO.widget
* @class Dialog
* @extends YAHOO.widget.Panel
* @constructor
* @param {String} el The element ID representing the Dialog OR
* @param {HTMLElement} el The element representing the Dialog
* @param {Object} userConfig The configuration object literal containing the configuration that should be set for this Dialog. See configuration documentation for more details.
*/
YAHOO.widget.Dialog = function(el, userConfig) {
YAHOO.widget.Dialog.superclass.constructor.call(this, el, userConfig);
};
YAHOO.extend(YAHOO.widget.Dialog, YAHOO.widget.Panel);
/**
* Constant representing the default CSS class used for a Dialog
* @property YAHOO.widget.Dialog.CSS_DIALOG
* @static
* @final
* @type String
*/
YAHOO.widget.Dialog.CSS_DIALOG = "yui-dialog";
/**
* Constant representing the name of the Dialog's events
* @property YAHOO.widget.Dialog._EVENT_TYPES
* @private
* @final
* @type Object
*/
YAHOO.widget.Dialog._EVENT_TYPES = {
"BEFORE_SUBMIT": "beforeSubmit",
"SUBMIT": "submit",
"MANUAL_SUBMIT": "manualSubmit",
"ASYNC_SUBMIT": "asyncSubmit",
"FORM_SUBMIT": "formSubmit",
"CANCEL": "cancel"
};
/**
* Constant representing the Dialog's configuration properties
* @property YAHOO.widget.Dialog._DEFAULT_CONFIG
* @private
* @final
* @type Object
*/
YAHOO.widget.Dialog._DEFAULT_CONFIG = {
"POST_METHOD": {
key: "postmethod",
value: "async"
},
"BUTTONS": {
key: "buttons",
value: "none"
}
};
/**
* Initializes the class's configurable properties which can be changed using the Dialog's Config object (cfg).
* @method initDefaultConfig
*/
YAHOO.widget.Dialog.prototype.initDefaultConfig = function() {
YAHOO.widget.Dialog.superclass.initDefaultConfig.call(this);
/**
* The internally maintained callback object for use with the Connection utility
* @property callback
* @type Object
*/
this.callback = {
/**
* The function to execute upon success of the Connection submission
* @property callback.success
* @type Function
*/
success : null,
/**
* The function to execute upon failure of the Connection submission
* @property callback.failure
* @type Function
*/
failure : null,
/**
* The arbitraty argument or arguments to pass to the Connection callback functions
* @property callback.argument
* @type Object
*/
argument: null
};
// Add form dialog config properties //
var DEFAULT_CONFIG = YAHOO.widget.Dialog._DEFAULT_CONFIG;
/**
* The method to use for posting the Dialog's form. Possible values are "async", "form", and "manual".
* @config postmethod
* @type String
* @default async
*/
this.cfg.addProperty(
DEFAULT_CONFIG.POST_METHOD.key,
{
handler: this.configPostMethod,
value: DEFAULT_CONFIG.POST_METHOD.value,
validator: function(val) {
if (val != "form" && val != "async" && val != "none" && val != "manual") {
return false;
} else {
return true;
}
}
}
);
/**
* Object literal(s) defining the buttons for the Dialog's footer.
* @config buttons
* @type Object[]
* @default "none"
*/
this.cfg.addProperty(
DEFAULT_CONFIG.BUTTONS.key,
{
handler: this.configButtons,
value: DEFAULT_CONFIG.BUTTONS.value
}
);
};
/**
* Initializes the custom events for Dialog which are fired automatically at appropriate times by the Dialog class.
* @method initEvents
*/
YAHOO.widget.Dialog.prototype.initEvents = function() {
YAHOO.widget.Dialog.superclass.initEvents.call(this);
var EVENT_TYPES = YAHOO.widget.Dialog._EVENT_TYPES;
/**
* CustomEvent fired prior to submission
* @event beforeSumitEvent
*/
this.beforeSubmitEvent = new YAHOO.util.CustomEvent(EVENT_TYPES.BEFORE_SUBMIT, this);
/**
* CustomEvent fired after submission
* @event submitEvent
*/
this.submitEvent = new YAHOO.util.CustomEvent(EVENT_TYPES.SUBMIT, this);
/**
* CustomEvent fired prior to manual submission
* @event manualSubmitEvent
*/
this.manualSubmitEvent = new YAHOO.util.CustomEvent(EVENT_TYPES.MANUAL_SUBMIT, this);
/**
* CustomEvent fired prior to asynchronous submission
* @event asyncSubmitEvent
*/
this.asyncSubmitEvent = new YAHOO.util.CustomEvent(EVENT_TYPES.ASYNC_SUBMIT, this);
/**
* CustomEvent fired prior to form-based submission
* @event formSubmitEvent
*/
this.formSubmitEvent = new YAHOO.util.CustomEvent(EVENT_TYPES.FORM_SUBMIT, this);
/**
* CustomEvent fired after cancel
* @event cancelEvent
*/
this.cancelEvent = new YAHOO.util.CustomEvent(EVENT_TYPES.CANCEL, this);
};
/**
* The Dialog initialization method, which is executed for Dialog and all of its subclasses. This method is automatically called by the constructor, and sets up all DOM references for pre-existing markup, and creates required markup if it is not already present.
* @method init
* @param {String} el The element ID representing the Dialog OR
* @param {HTMLElement} el The element representing the Dialog
* @param {Object} userConfig The configuration object literal containing the configuration that should be set for this Dialog. See configuration documentation for more details.
*/
YAHOO.widget.Dialog.prototype.init = function(el, userConfig) {
YAHOO.widget.Dialog.superclass.init.call(this, el/*, userConfig*/); // Note that we don't pass the user config in here yet because we only want it executed once, at the lowest subclass level
this.beforeInitEvent.fire(YAHOO.widget.Dialog);
YAHOO.util.Dom.addClass(this.element, YAHOO.widget.Dialog.CSS_DIALOG);
this.cfg.setProperty("visible", false);
if (userConfig) {
this.cfg.applyConfig(userConfig, true);
}
this.showEvent.subscribe(this.focusFirst, this, true);
this.beforeHideEvent.subscribe(this.blurButtons, this, true);
this.beforeRenderEvent.subscribe(function() {
var buttonCfg = this.cfg.getProperty("buttons");
if (buttonCfg && buttonCfg != "none") {
if (! this.footer) {
this.setFooter("");
}
}
}, this, true);
this.initEvent.fire(YAHOO.widget.Dialog);
};
/**
* Performs the submission of the Dialog form depending on the value of "postmethod" property.
* @method doSubmit
*/
YAHOO.widget.Dialog.prototype.doSubmit = function() {
var pm = this.cfg.getProperty("postmethod");
switch (pm) {
case "async":
var method = this.form.getAttribute("method") || 'POST';
method = method.toUpperCase();
YAHOO.util.Connect.setForm(this.form);
var cObj = YAHOO.util.Connect.asyncRequest(method, this.form.getAttribute("action"), this.callback);
this.asyncSubmitEvent.fire();
break;
case "form":
this.form.submit();
this.formSubmitEvent.fire();
break;
case "none":
case "manual":
this.manualSubmitEvent.fire();
break;
}
};
/**
* @method _onFormKeyDown
* @description "keydown" event handler for the dialog's form.
* @protected
* @param {Event} p_oEvent Object representing the DOM event object passed
* back by the event utility (YAHOO.util.Event).
*/
YAHOO.widget.Dialog.prototype._onFormKeyDown = function(p_oEvent) {
var oTarget = YAHOO.util.Event.getTarget(p_oEvent),
nCharCode = YAHOO.util.Event.getCharCode(p_oEvent);
if (
nCharCode == 13 &&
oTarget.tagName &&
oTarget.tagName.toUpperCase() == "INPUT"
) {
var sType = oTarget.type;
if(
sType == "text" || sType == "password" || sType == "checkbox" ||
sType == "radio" || sType == "file"
) {
// Fire the "click" event on the dialog's default button
this.defaultHtmlButton.click();
}
}
};
/**
* Prepares the Dialog's internal FORM object, creating one if one is not currently present.
* @method registerForm
*/
YAHOO.widget.Dialog.prototype.registerForm = function() {
var form = this.element.getElementsByTagName("form")[0];
if (! form) {
var formHTML = "";
this.body.innerHTML += formHTML;
form = this.element.getElementsByTagName("form")[0];
}
this.firstFormElement = function() {
for (var f=0;f=0;f-- ) {
var el = form.elements[f];
if (el.focus && ! el.disabled) {
if (el.type && el.type != "hidden") {
return el;
}
}
}
return null;
}();
this.form = form;
if(this.form && (this.browser == "ie" || this.browser == "ie7" || this.browser == "gecko")) {
YAHOO.util.Event.addListener(this.form, "keydown", this._onFormKeyDown, null, this);
}
if (this.cfg.getProperty("modal") && this.form) {
var me = this;
var firstElement = this.firstFormElement || this.firstButton;
if (firstElement) {
this.preventBackTab = new YAHOO.util.KeyListener(firstElement, { shift:true, keys:9 }, {fn:me.focusLast, scope:me, correctScope:true} );
this.showEvent.subscribe(this.preventBackTab.enable, this.preventBackTab, true);
this.hideEvent.subscribe(this.preventBackTab.disable, this.preventBackTab, true);
}
var lastElement = this.lastButton || this.lastFormElement;
if (lastElement) {
this.preventTabOut = new YAHOO.util.KeyListener(lastElement, { shift:false, keys:9 }, {fn:me.focusFirst, scope:me, correctScope:true} );
this.showEvent.subscribe(this.preventTabOut.enable, this.preventTabOut, true);
this.hideEvent.subscribe(this.preventTabOut.disable, this.preventTabOut, true);
}
}
};
// BEGIN BUILT-IN PROPERTY EVENT HANDLERS //
/**
* The default event handler fired when the "close" property is changed. The method controls the appending or hiding of the close icon at the top right of the Dialog.
* @method configClose
* @param {String} type The CustomEvent type (usually the property name)
* @param {Object[]} args The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
* @param {Object} obj The scope object. For configuration handlers, this will usually equal the owner.
*/
YAHOO.widget.Dialog.prototype.configClose = function(type, args, obj) {
var val = args[0];
var doCancel = function(e, obj) {
obj.cancel();
};
if (val) {
if (! this.close) {
this.close = document.createElement("div");
YAHOO.util.Dom.addClass(this.close, "container-close");
this.close.innerHTML = " ";
this.innerElement.appendChild(this.close);
YAHOO.util.Event.addListener(this.close, "click", doCancel, this);
} else {
this.close.style.display = "block";
}
} else {
if (this.close) {
this.close.style.display = "none";
}
}
};
/**
* The default event handler for the "buttons" configuration property
* @method configButtons
* @param {String} type The CustomEvent type (usually the property name)
* @param {Object[]} args The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
* @param {Object} obj The scope object. For configuration handlers, this will usually equal the owner.
*/
YAHOO.widget.Dialog.prototype.configButtons = function(type, args, obj) {
var buttons = args[0];
if (buttons != "none") {
this.buttonSpan = null;
this.buttonSpan = document.createElement("span");
this.buttonSpan.className = "button-group";
for (var b=0;b 0) {
if(nElements == 1) {
oElement = oElement[0];
var sType = oElement.type,
sTagName = oElement.tagName.toUpperCase();
switch(sTagName) {
case "INPUT":
if(sType == "checkbox") {
oData[sName] = oElement.checked;
}
else if(sType != "radio") {
oData[sName] = oElement.value;
}
break;
case "TEXTAREA":
oData[sName] = oElement.value;
break;
case "SELECT":
var aOptions = oElement.options,
nOptions = aOptions.length,
aValues = [],
oOption,
sValue;
for(var n=0; n 0) {
var i = aButtons.length - 1;
do {
Event.purgeElement(aButtons[i], false, "click");
}
while(i--);
}
}
if(oForm) {
Event.purgeElement(oForm);
this.body.removeChild(oForm);
this.form = null;
}
YAHOO.widget.Dialog.superclass.destroy.call(this);
};
/**
* Returns a string representation of the object.
* @method toString
* @return {String} The string representation of the Dialog
*/
YAHOO.widget.Dialog.prototype.toString = function() {
return "Dialog " + this.id;
};
/**
* SimpleDialog is a simple implementation of Dialog that can be used to submit a single value. Forms can be processed in 3 ways -- via an asynchronous Connection utility call, a simple form POST or GET, or manually.
* @namespace YAHOO.widget
* @class SimpleDialog
* @extends YAHOO.widget.Dialog
* @constructor
* @param {String} el The element ID representing the SimpleDialog OR
* @param {HTMLElement} el The element representing the SimpleDialog
* @param {Object} userConfig The configuration object literal containing the configuration that should be set for this SimpleDialog. See configuration documentation for more details.
*/
YAHOO.widget.SimpleDialog = function(el, userConfig) {
YAHOO.widget.SimpleDialog.superclass.constructor.call(this, el, userConfig);
};
YAHOO.extend(YAHOO.widget.SimpleDialog, YAHOO.widget.Dialog);
/**
* Constant for the standard network icon for a blocking action
* @property YAHOO.widget.SimpleDialog.ICON_BLOCK
* @static
* @final
* @type String
*/
YAHOO.widget.SimpleDialog.ICON_BLOCK = "blckicon";
/**
* Constant for the standard network icon for alarm
* @property YAHOO.widget.SimpleDialog.ICON_ALARM
* @static
* @final
* @type String
*/
YAHOO.widget.SimpleDialog.ICON_ALARM = "alrticon";
/**
* Constant for the standard network icon for help
* @property YAHOO.widget.SimpleDialog.ICON_HELP
* @static
* @final
* @type String
*/
YAHOO.widget.SimpleDialog.ICON_HELP = "hlpicon";
/**
* Constant for the standard network icon for info
* @property YAHOO.widget.SimpleDialog.ICON_INFO
* @static
* @final
* @type String
*/
YAHOO.widget.SimpleDialog.ICON_INFO = "infoicon";
/**
* Constant for the standard network icon for warn
* @property YAHOO.widget.SimpleDialog.ICON_WARN
* @static
* @final
* @type String
*/
YAHOO.widget.SimpleDialog.ICON_WARN = "warnicon";
/**
* Constant for the standard network icon for a tip
* @property YAHOO.widget.SimpleDialog.ICON_TIP
* @static
* @final
* @type String
*/
YAHOO.widget.SimpleDialog.ICON_TIP = "tipicon";
/**
* Constant representing the default CSS class used for a SimpleDialog
* @property YAHOO.widget.SimpleDialog.CSS_SIMPLEDIALOG
* @static
* @final
* @type String
*/
YAHOO.widget.SimpleDialog.CSS_SIMPLEDIALOG = "yui-simple-dialog";
/**
* Constant representing the SimpleDialog's configuration properties
* @property YAHOO.widget.SimpleDialog._DEFAULT_CONFIG
* @private
* @final
* @type Object
*/
YAHOO.widget.SimpleDialog._DEFAULT_CONFIG = {
"ICON": {
key: "icon",
value:"none",
suppressEvent:true
},
"TEXT": {
key: "text",
value:"",
suppressEvent:true,
supercedes:["icon"]
}
};
/**
* Initializes the class's configurable properties which can be changed using the SimpleDialog's Config object (cfg).
* @method initDefaultConfig
*/
YAHOO.widget.SimpleDialog.prototype.initDefaultConfig = function() {
YAHOO.widget.SimpleDialog.superclass.initDefaultConfig.call(this);
// Add dialog config properties //
var DEFAULT_CONFIG = YAHOO.widget.SimpleDialog._DEFAULT_CONFIG;
/**
* Sets the informational icon for the SimpleDialog
* @config icon
* @type String
* @default "none"
*/
this.cfg.addProperty(
DEFAULT_CONFIG.ICON.key,
{
handler: this.configIcon,
value: DEFAULT_CONFIG.ICON.value,
suppressEvent: DEFAULT_CONFIG.ICON.suppressEvent
}
);
/**
* Sets the text for the SimpleDialog
* @config text
* @type String
* @default ""
*/
this.cfg.addProperty(
DEFAULT_CONFIG.TEXT.key,
{
handler: this.configText,
value: DEFAULT_CONFIG.TEXT.value,
suppressEvent: DEFAULT_CONFIG.TEXT.suppressEvent,
supercedes: DEFAULT_CONFIG.TEXT.supercedes
}
);
};
/**
* The SimpleDialog initialization method, which is executed for SimpleDialog and all of its subclasses. This method is automatically called by the constructor, and sets up all DOM references for pre-existing markup, and creates required markup if it is not already present.
* @method init
* @param {String} el The element ID representing the SimpleDialog OR
* @param {HTMLElement} el The element representing the SimpleDialog
* @param {Object} userConfig The configuration object literal containing the configuration that should be set for this SimpleDialog. See configuration documentation for more details.
*/
YAHOO.widget.SimpleDialog.prototype.init = function(el, userConfig) {
YAHOO.widget.SimpleDialog.superclass.init.call(this, el/*, userConfig*/); // Note that we don't pass the user config in here yet because we only want it executed once, at the lowest subclass level
this.beforeInitEvent.fire(YAHOO.widget.SimpleDialog);
YAHOO.util.Dom.addClass(this.element, YAHOO.widget.SimpleDialog.CSS_SIMPLEDIALOG);
this.cfg.queueProperty("postmethod", "manual");
if (userConfig) {
this.cfg.applyConfig(userConfig, true);
}
this.beforeRenderEvent.subscribe(function() {
if (! this.body) {
this.setBody("");
}
}, this, true);
this.initEvent.fire(YAHOO.widget.SimpleDialog);
};
/**
* Prepares the SimpleDialog's internal FORM object, creating one if one is not currently present, and adding the value hidden field.
* @method registerForm
*/
YAHOO.widget.SimpleDialog.prototype.registerForm = function() {
YAHOO.widget.SimpleDialog.superclass.registerForm.call(this);
this.form.innerHTML += "";
};
// BEGIN BUILT-IN PROPERTY EVENT HANDLERS //
/**
* Fired when the "icon" property is set.
* @method configIcon
* @param {String} type The CustomEvent type (usually the property name)
* @param {Object[]} args The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
* @param {Object} obj The scope object. For configuration handlers, this will usually equal the owner.
*/
YAHOO.widget.SimpleDialog.prototype.configIcon = function(type,args,obj) {
var icon = args[0];
if (icon && icon != "none") {
var iconHTML = "";
if (icon.indexOf(".") == -1) {
iconHTML = "";
} else {
iconHTML = "";
}
this.body.innerHTML = iconHTML + this.body.innerHTML;
}
};
/**
* Fired when the "text" property is set.
* @method configText
* @param {String} type The CustomEvent type (usually the property name)
* @param {Object[]} args The CustomEvent arguments. For configuration handlers, args[0] will equal the newly applied value for the property.
* @param {Object} obj The scope object. For configuration handlers, this will usually equal the owner.
*/
YAHOO.widget.SimpleDialog.prototype.configText = function(type,args,obj) {
var text = args[0];
if (text) {
this.setBody(text);
this.cfg.refireEvent("icon");
}
};
// END BUILT-IN PROPERTY EVENT HANDLERS //
/**
* Returns a string representation of the object.
* @method toString
* @return {String} The string representation of the SimpleDialog
*/
YAHOO.widget.SimpleDialog.prototype.toString = function() {
return "SimpleDialog " + this.id;
};
/**
* ContainerEffect encapsulates animation transitions that are executed when an Overlay is shown or hidden.
* @namespace YAHOO.widget
* @class ContainerEffect
* @constructor
* @param {YAHOO.widget.Overlay} overlay The Overlay that the animation should be associated with
* @param {Object} attrIn The object literal representing the animation arguments to be used for the animate-in transition. The arguments for this literal are: attributes(object, see YAHOO.util.Anim for description), duration(Number), and method(i.e. YAHOO.util.Easing.easeIn).
* @param {Object} attrOut The object literal representing the animation arguments to be used for the animate-out transition. The arguments for this literal are: attributes(object, see YAHOO.util.Anim for description), duration(Number), and method(i.e. YAHOO.util.Easing.easeIn).
* @param {HTMLElement} targetElement Optional. The target element that should be animated during the transition. Defaults to overlay.element.
* @param {class} Optional. The animation class to instantiate. Defaults to YAHOO.util.Anim. Other options include YAHOO.util.Motion.
*/
YAHOO.widget.ContainerEffect = function(overlay, attrIn, attrOut, targetElement, animClass) {
if (! animClass) {
animClass = YAHOO.util.Anim;
}
/**
* The overlay to animate
* @property overlay
* @type YAHOO.widget.Overlay
*/
this.overlay = overlay;
/**
* The animation attributes to use when transitioning into view
* @property attrIn
* @type Object
*/
this.attrIn = attrIn;
/**
* The animation attributes to use when transitioning out of view
* @property attrOut
* @type Object
*/
this.attrOut = attrOut;
/**
* The target element to be animated
* @property targetElement
* @type HTMLElement
*/
this.targetElement = targetElement || overlay.element;
/**
* The animation class to use for animating the overlay
* @property animClass
* @type class
*/
this.animClass = animClass;
};
/**
* Initializes the animation classes and events.
* @method init
*/
YAHOO.widget.ContainerEffect.prototype.init = function() {
this.beforeAnimateInEvent = new YAHOO.util.CustomEvent("beforeAnimateIn", this);
this.beforeAnimateOutEvent = new YAHOO.util.CustomEvent("beforeAnimateOut", this);
this.animateInCompleteEvent = new YAHOO.util.CustomEvent("animateInComplete", this);
this.animateOutCompleteEvent = new YAHOO.util.CustomEvent("animateOutComplete", this);
this.animIn = new this.animClass(this.targetElement, this.attrIn.attributes, this.attrIn.duration, this.attrIn.method);
this.animIn.onStart.subscribe(this.handleStartAnimateIn, this);
this.animIn.onTween.subscribe(this.handleTweenAnimateIn, this);
this.animIn.onComplete.subscribe(this.handleCompleteAnimateIn, this);
this.animOut = new this.animClass(this.targetElement, this.attrOut.attributes, this.attrOut.duration, this.attrOut.method);
this.animOut.onStart.subscribe(this.handleStartAnimateOut, this);
this.animOut.onTween.subscribe(this.handleTweenAnimateOut, this);
this.animOut.onComplete.subscribe(this.handleCompleteAnimateOut, this);
};
/**
* Triggers the in-animation.
* @method animateIn
*/
YAHOO.widget.ContainerEffect.prototype.animateIn = function() {
this.beforeAnimateInEvent.fire();
this.animIn.animate();
};
/**
* Triggers the out-animation.
* @method animateOut
*/
YAHOO.widget.ContainerEffect.prototype.animateOut = function() {
this.beforeAnimateOutEvent.fire();
this.animOut.animate();
};
/**
* The default onStart handler for the in-animation.
* @method handleStartAnimateIn
* @param {String} type The CustomEvent type
* @param {Object[]} args The CustomEvent arguments
* @param {Object} obj The scope object
*/
YAHOO.widget.ContainerEffect.prototype.handleStartAnimateIn = function(type, args, obj) { };
/**
* The default onTween handler for the in-animation.
* @method handleTweenAnimateIn
* @param {String} type The CustomEvent type
* @param {Object[]} args The CustomEvent arguments
* @param {Object} obj The scope object
*/
YAHOO.widget.ContainerEffect.prototype.handleTweenAnimateIn = function(type, args, obj) { };
/**
* The default onComplete handler for the in-animation.
* @method handleCompleteAnimateIn
* @param {String} type The CustomEvent type
* @param {Object[]} args The CustomEvent arguments
* @param {Object} obj The scope object
*/
YAHOO.widget.ContainerEffect.prototype.handleCompleteAnimateIn = function(type, args, obj) { };
/**
* The default onStart handler for the out-animation.
* @method handleStartAnimateOut
* @param {String} type The CustomEvent type
* @param {Object[]} args The CustomEvent arguments
* @param {Object} obj The scope object
*/
YAHOO.widget.ContainerEffect.prototype.handleStartAnimateOut = function(type, args, obj) { };
/**
* The default onTween handler for the out-animation.
* @method handleTweenAnimateOut
* @param {String} type The CustomEvent type
* @param {Object[]} args The CustomEvent arguments
* @param {Object} obj The scope object
*/
YAHOO.widget.ContainerEffect.prototype.handleTweenAnimateOut = function(type, args, obj) { };
/**
* The default onComplete handler for the out-animation.
* @method handleCompleteAnimateOut
* @param {String} type The CustomEvent type
* @param {Object[]} args The CustomEvent arguments
* @param {Object} obj The scope object
*/
YAHOO.widget.ContainerEffect.prototype.handleCompleteAnimateOut = function(type, args, obj) { };
/**
* Returns a string representation of the object.
* @method toString
* @return {String} The string representation of the ContainerEffect
*/
YAHOO.widget.ContainerEffect.prototype.toString = function() {
var output = "ContainerEffect";
if (this.overlay) {
output += " [" + this.overlay.toString() + "]";
}
return output;
};
/**
* A pre-configured ContainerEffect instance that can be used for fading an overlay in and out.
* @method FADE
* @static
* @param {Overlay} overlay The Overlay object to animate
* @param {Number} dur The duration of the animation
* @return {ContainerEffect} The configured ContainerEffect object
*/
YAHOO.widget.ContainerEffect.FADE = function(overlay, dur) {
var fade = new YAHOO.widget.ContainerEffect(overlay, { attributes:{opacity: {from:0, to:1}}, duration:dur, method:YAHOO.util.Easing.easeIn }, { attributes:{opacity: {to:0}}, duration:dur, method:YAHOO.util.Easing.easeOut}, overlay.element );
fade.handleStartAnimateIn = function(type,args,obj) {
YAHOO.util.Dom.addClass(obj.overlay.element, "hide-select");
if (! obj.overlay.underlay) {
obj.overlay.cfg.refireEvent("underlay");
}
if (obj.overlay.underlay) {
obj.initialUnderlayOpacity = YAHOO.util.Dom.getStyle(obj.overlay.underlay, "opacity");
obj.overlay.underlay.style.filter = null;
}
YAHOO.util.Dom.setStyle(obj.overlay.element, "visibility", "visible");
YAHOO.util.Dom.setStyle(obj.overlay.element, "opacity", 0);
};
fade.handleCompleteAnimateIn = function(type,args,obj) {
YAHOO.util.Dom.removeClass(obj.overlay.element, "hide-select");
if (obj.overlay.element.style.filter) {
obj.overlay.element.style.filter = null;
}
if (obj.overlay.underlay) {
YAHOO.util.Dom.setStyle(obj.overlay.underlay, "opacity", obj.initialUnderlayOpacity);
}
obj.overlay.cfg.refireEvent("iframe");
obj.animateInCompleteEvent.fire();
};
fade.handleStartAnimateOut = function(type, args, obj) {
YAHOO.util.Dom.addClass(obj.overlay.element, "hide-select");
if (obj.overlay.underlay) {
obj.overlay.underlay.style.filter = null;
}
};
fade.handleCompleteAnimateOut = function(type, args, obj) {
YAHOO.util.Dom.removeClass(obj.overlay.element, "hide-select");
if (obj.overlay.element.style.filter) {
obj.overlay.element.style.filter = null;
}
YAHOO.util.Dom.setStyle(obj.overlay.element, "visibility", "hidden");
YAHOO.util.Dom.setStyle(obj.overlay.element, "opacity", 1);
obj.overlay.cfg.refireEvent("iframe");
obj.animateOutCompleteEvent.fire();
};
fade.init();
return fade;
};
/**
* A pre-configured ContainerEffect instance that can be used for sliding an overlay in and out.
* @method SLIDE
* @static
* @param {Overlay} overlay The Overlay object to animate
* @param {Number} dur The duration of the animation
* @return {ContainerEffect} The configured ContainerEffect object
*/
YAHOO.widget.ContainerEffect.SLIDE = function(overlay, dur) {
var x = overlay.cfg.getProperty("x") || YAHOO.util.Dom.getX(overlay.element);
var y = overlay.cfg.getProperty("y") || YAHOO.util.Dom.getY(overlay.element);
var clientWidth = YAHOO.util.Dom.getClientWidth();
var offsetWidth = overlay.element.offsetWidth;
var slide = new YAHOO.widget.ContainerEffect(overlay, {
attributes:{ points: { to:[x, y] } },
duration:dur,
method:YAHOO.util.Easing.easeIn
},
{
attributes:{ points: { to:[(clientWidth+25), y] } },
duration:dur,
method:YAHOO.util.Easing.easeOut
},
overlay.element,
YAHOO.util.Motion);
slide.handleStartAnimateIn = function(type,args,obj) {
obj.overlay.element.style.left = (-25-offsetWidth) + "px";
obj.overlay.element.style.top = y + "px";
};
slide.handleTweenAnimateIn = function(type, args, obj) {
var pos = YAHOO.util.Dom.getXY(obj.overlay.element);
var currentX = pos[0];
var currentY = pos[1];
if (YAHOO.util.Dom.getStyle(obj.overlay.element, "visibility") == "hidden" && currentX < x) {
YAHOO.util.Dom.setStyle(obj.overlay.element, "visibility", "visible");
}
obj.overlay.cfg.setProperty("xy", [currentX,currentY], true);
obj.overlay.cfg.refireEvent("iframe");
};
slide.handleCompleteAnimateIn = function(type, args, obj) {
obj.overlay.cfg.setProperty("xy", [x,y], true);
obj.startX = x;
obj.startY = y;
obj.overlay.cfg.refireEvent("iframe");
obj.animateInCompleteEvent.fire();
};
slide.handleStartAnimateOut = function(type, args, obj) {
var vw = YAHOO.util.Dom.getViewportWidth();
var pos = YAHOO.util.Dom.getXY(obj.overlay.element);
var yso = pos[1];
var currentTo = obj.animOut.attributes.points.to;
obj.animOut.attributes.points.to = [(vw+25), yso];
};
slide.handleTweenAnimateOut = function(type, args, obj) {
var pos = YAHOO.util.Dom.getXY(obj.overlay.element);
var xto = pos[0];
var yto = pos[1];
obj.overlay.cfg.setProperty("xy", [xto,yto], true);
obj.overlay.cfg.refireEvent("iframe");
};
slide.handleCompleteAnimateOut = function(type, args, obj) {
YAHOO.util.Dom.setStyle(obj.overlay.element, "visibility", "hidden");
obj.overlay.cfg.setProperty("xy", [x,y]);
obj.animateOutCompleteEvent.fire();
};
slide.init();
return slide;
};
YAHOO.register("container", YAHOO.widget.Module, {version: "2.2.2", build: "204"});