/*  Prototype-UI, version trunk
*
*  Prototype-UI is freely distributable under the terms of an MIT-style license.
*  For details, see the PrototypeUI web site: http://www.prototype-ui.com/
*
*--------------------------------------------------------------------------*/

if (typeof Prototype == 'undefined' || !Prototype.Version.match("1.6"))
	throw ("Prototype-UI library require Prototype library >= 1.6.0");

if (Prototype.Browser.WebKit) {
	Prototype.Browser.WebKitVersion = parseFloat(navigator.userAgent.match(/AppleWebKit\/([\d\.\+]*)/)[1]);
	Prototype.Browser.Safari2 = (Prototype.Browser.WebKitVersion < 420);
}

if (Prototype.Browser.IE) {
	Prototype.Browser.IEVersion = parseFloat(navigator.appVersion.split(';')[1].strip().split(' ')[1]);
	Prototype.Browser.IE6 = Prototype.Browser.IEVersion == 6;
	Prototype.Browser.IE7 = Prototype.Browser.IEVersion == 7;
}

Prototype.falseFunction = function() { return false };
Prototype.trueFunction = function() { return true };

/*
Namespace: UI

Introduction:
Prototype-UI is a library of user interface components based on the Prototype framework.
Its aim is to easilly improve user experience in web applications.

It also provides utilities to help developers.

Guideline:
- Prototype conventions are followed
- Everything should be unobstrusive
- All components are themable with CSS stylesheets, various themes are provided

Warning:
Prototype-UI is still under deep development, this release is targeted to developers only.
All interfaces are subjects to changes, suggestions are welcome.

DO NOT use it in production for now.

Authors:
- Sébastien Gruhier, <http://www.xilinus.com>
- Samuel Lebeau, <http://gotfresh.info>
*/

var UI = {
	Abstract: {},
	Ajax: {}
};
Object.extend(Class.Methods, {
	extend: Object.extend.methodize(),

	addMethods: Class.Methods.addMethods.wrap(function(proceed, source) {
		// ensure we are not trying to add null or undefined
		if (!source) return this;

		// no callback, vanilla way
		if (!source.hasOwnProperty('methodsAdded'))
			return proceed(source);

		var callback = source.methodsAdded;
		delete source.methodsAdded;
		proceed(source);
		callback.call(source, this);
		source.methodsAdded = callback;

		return this;
	}),

	addMethod: function(name, lambda) {
		var methods = {};
		methods[name] = lambda;
		return this.addMethods(methods);
	},

	method: function(name) {
		return this.prototype[name].valueOf();
	},

	classMethod: function() {
		$A(arguments).flatten().each(function(method) {
			this[method] = (function() {
				return this[method].apply(this, arguments);
			}).bind(this.prototype);
		}, this);
		return this;
	},

	// prevent any call to this method
	undefMethod: function(name) {
		this.prototype[name] = undefined;
		return this;
	},

	// remove the class' own implementation of this method
	removeMethod: function(name) {
		delete this.prototype[name];
		return this;
	},

	aliasMethod: function(newName, name) {
		this.prototype[newName] = this.prototype[name];
		return this;
	},

	aliasMethodChain: function(target, feature) {
		feature = feature.camelcase();

		this.aliasMethod(target + "Without" + feature, target);
		this.aliasMethod(target, target + "With" + feature);

		return this;
	}
});
Object.extend(Number.prototype, {
	// Snap a number to a grid
	snap: function(round) {
		return parseInt(round == 1 ? this : (this / round).floor() * round);
	}
});
/*
Interface: String

*/

Object.extend(String.prototype, {
	camelcase: function() {
		var string = this.dasherize().camelize();
		return string.charAt(0).toUpperCase() + string.slice(1);
	},

	/*
	Method: makeElement
	toElement is unfortunately already taken :/

	Transforms html string into an extended element or null (when failed)

	> '<li><a href="#">some text</a></li>'.makeElement(); // => LI href#
	> '<img src="foo" id="bar" /><img src="bar" id="bar" />'.makeElement(); // => IMG#foo (first one)

	Returns:
	Extended element

	*/
	makeElement: function() {
		var wrapper = new Element('div'); wrapper.innerHTML = this;
		return wrapper.down();
	}
});
Object.extend(Array.prototype, {
	empty: function() {
		return !this.length;
	},

	extractOptions: function() {
		return this.last().constructor === Object ? this.pop() : {};
	},

	removeAt: function(index) {
		var object = this[index];
		this.splice(index, 1);
		return object;
	},

	remove: function(object) {
		var index;
		while ((index = this.indexOf(object)) != -1)
			this.removeAt(index);
		return object;
	},

	insert: function(index) {
		var args = $A(arguments);
		args.shift();
		this.splice.apply(this, [index, 0].concat(args));
		return this;
	}
});
Element.addMethods({
	getScrollDimensions: function(element) {
		return {
			width: element.scrollWidth,
			height: element.scrollHeight
		}
	},

	getScrollOffset: function(element) {
		return Element._returnOffset(element.scrollLeft, element.scrollTop);
	},

	setScrollOffset: function(element, offset) {
		element = $(element);
		if (arguments.length == 3)
			offset = { left: offset, top: arguments[2] };
		element.scrollLeft = offset.left;
		element.scrollTop = offset.top;
		return element;
	},

	// returns "clean" numerical style (without "px") or null if style can not be resolved
	// or is not numeric
	getNumStyle: function(element, style) {
		var value = parseFloat($(element).getStyle(style));
		return isNaN(value) ? null : value;
	},

	// by Tobie Langel (http://tobielangel.com/2007/5/22/prototype-quick-tip)
	appendText: function(element, text) {
		element = $(element);
		text = String.interpret(text);
		element.appendChild(document.createTextNode(text));
		return element;
	}
});

document.whenReady = function(callback) {
	if (document.loaded)
		callback.call(document);
	else
		document.observe('dom:loaded', callback);
};

Object.extend(document.viewport, {
	// Alias this method for consistency
	getScrollOffset: document.viewport.getScrollOffsets,

	setScrollOffset: function(offset) {
		Element.setScrollOffset(Prototype.Browser.WebKit ? document.body : document.documentElement, offset);
	},

	getScrollDimensions: function() {
		return Element.getScrollDimensions(Prototype.Browser.WebKit ? document.body : document.documentElement);
	}
});
/*
Interface: UI.Options
Mixin to handle *options* argument in initializer pattern.

TODO: find a better example than Circle that use an imaginary Point function,
this example should be used in tests too.

It assumes class defines a property called *options*, containing
default options values.

Instances hold their own *options* property after a first call to <setOptions>.

Example:
> var Circle = Class.create(UI.Options, {
>
>   // default options
>   options: {
>     radius: 1,
>     origin: Point(0, 0)
>   },
>
>   // common usage is to call setOptions in initializer
>   initialize: function(options) {
>     this.setOptions(options);
>   }
> });
>
> var circle = new Circle({ origin: Point(1, 4) });
>
> circle.options
> // => { radius: 1, origin: Point(1,4) }

Accessors:
There are builtin methods to automatically write options accessors. All those
methods can take either an array of option names nor option names as arguments.
Notice that those methods won't override an accessor method if already present.

* <optionsGetter> creates getters
* <optionsSetter> creates setters
* <optionsAccessor> creates both getters and setters

Common usage is to invoke them on a class to create accessors for all instances
of this class.
Invoking those methods on a class has the same effect as invoking them on the class prototype.
See <classMethod> for more details.

Example:
> // Creates getter and setter for the "radius" options of circles
> Circle.optionsAccessor('radius');
>
> circle.setRadius(4);
> // 4
>
> circle.getRadius();
> // => 4 (circle.options.radius)

Inheritance support:
Subclasses can refine default *options* values, after a first instance call on setOptions,
*options* attribute will hold all default options values coming from the inheritance hierarchy.
*/

(function() {
	UI.Options = {
		methodsAdded: function(klass) {
			klass.classMethod($w(' setOptions allOptions optionsGetter optionsSetter optionsAccessor '));
		},

		// Group: Methods

		/*
		Method: setOptions
		Extends object's *options* property with the given object
		*/
		setOptions: function(options) {
			if (!this.hasOwnProperty('options'))
				this.options = this.allOptions();

			this.options = Object.extend(this.options, options || {});
		},

		/*
		Method: allOptions
		Computes the complete default options hash made by reverse extending all superclasses
		default options.

        > Widget.prototype.allOptions();
		*/
		allOptions: function() {
			var superclass = this.constructor.superclass, ancestor = superclass && superclass.prototype;
			return (ancestor && ancestor.allOptions) ?
          Object.extend(ancestor.allOptions(), this.options) :
          Object.clone(this.options);
		},

		/*
		Method: optionsGetter
		Creates default getters for option names given as arguments.
		With no argument, creates getters for all option names.
		*/
		optionsGetter: function() {
			addOptionsAccessors(this, arguments, false);
		},

		/*
		Method: optionsSetter
		Creates default setters for option names given as arguments.
		With no argument, creates setters for all option names.
		*/
		optionsSetter: function() {
			addOptionsAccessors(this, arguments, true);
		},

		/*
		Method: optionsAccessor
		Creates default getters/setters for option names given as arguments.
		With no argument, creates accessors for all option names.
		*/
		optionsAccessor: function() {
			this.optionsGetter.apply(this, arguments);
			this.optionsSetter.apply(this, arguments);
		}
	};

	// Internal
	function addOptionsAccessors(receiver, names, areSetters) {
		names = $A(names).flatten();

		if (names.empty())
			names = Object.keys(receiver.allOptions());

		names.each(function(name) {
			var accessorName = (areSetters ? 'set' : 'get') + name.camelcase();

			receiver[accessorName] = receiver[accessorName] || (areSetters ?
			// Setter
        function(value) { return this.options[name] = value } :
			// Getter
        function() { return this.options[name] });
		});
	}
})();
/*
Namespace: CSS

Utility functions for CSS/StyleSheet files access

Authors:
- Sébastien Gruhier, <http://www.xilinus.com>
- Samuel Lebeau, <http://gotfresh.info>
*/

var CSS = (function() {
	// Code based on:
	//   - IE5.5+ PNG Alpha Fix v1.0RC4 (c) 2004-2005 Angus Turnbull http://www.twinhelix.com
	//   - Whatever:hover - V2.02.060206 - hover, active & focus (c) 2005 - Peter Nederlof * Peterned - http://www.xs4all.nl/~peterned/
	function fixPNG() {
		parseStylesheet.apply(this, $A(arguments).concat(fixRule));
	};

	function parseStylesheet() {
		var patterns = $A(arguments);
		var method = patterns.pop();

		// To avoid flicking background
		//document.execCommand("BackgroundImageCache", false, true);
		// Parse all document stylesheets
		var styleSheets = $A(document.styleSheets);
		if (patterns.length > 1) {
			styleSheets = styleSheets.select(function(css) {
				return patterns.any(function(pattern) {
					return css.href && css.href.match(pattern)
				});
			});
		}
		styleSheets.each(function(styleSheet) { fixStylesheet.call(this, styleSheet, method) });
	};

	// Fixes a stylesheet
	function fixStylesheet(stylesheet, method) {
		// Parse import files
		if (stylesheet.imports)
			$A(stylesheet.imports).each(fixStylesheet);

		var href = stylesheet.href || document.location.href;
		var docPath = href.substr(0, href.lastIndexOf('/'));
		// Parse all CSS Rules
		$A(stylesheet.rules || stylesheet.cssRules).each(function(rule) { method.call(this, rule, docPath) });
	};

	var filterPattern = 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src="#{src}",sizingMethod="#{method}")';

	// Fixes a rule if it has a PNG background
	function fixRule(rule, docPath) {
		var bgImg = rule.style.backgroundImage;
		// Rule with PNG background image
		if (bgImg && bgImg != 'none' && bgImg.match(/^url[("']+(.*\.png)[)"']+$/i)) {
			var src = RegExp.$1;
			var bgRepeat = rule.style.backgroundRepeat;
			// Relative path
			if (src[0] != '/')
				src = docPath + "/" + src;
			// Apply filter
			rule.style.filter = filterPattern.interpolate({
				src: src,
				method: bgRepeat == "no-repeat" ? "crop" : "scale"
			});
			rule.style.backgroundImage = "none";
		}
	};

	var preloadedImages = new Hash();

	function preloadRule(rule, docPath) {
		var bgImg = rule.style.backgroundImage;
		if (bgImg && bgImg != 'none' && bgImg != 'initial') {
			if (!preloadedImages.get(bgImg)) {
				bgImg.match(/^url[("']+(.*)[)"']+$/i);
				var src = RegExp.$1;
				// Relative path
				if (!(src[0] == '/' || src.match(/^file:/) || src.match(/^https?:/)))
					src = docPath + "/" + src;
				preloadedImages.set(bgImg, true);
				var image = new Image();
				image.src = src;
			}
		}
	}

	return {
		/*
		Method: fixPNG
		Fix transparency of PNG background of document stylesheets.
		(only on IE version<7, otherwise does nothing)

         Warning: All png background will not work as IE filter use for handling transparency in PNG
		is not compatible with all background. It does not support top/left position (so no CSS sprite)

         I recommend to create a special CSS file with png that needs to be fixed and call CSS.fixPNG on this CSS

         Examples:
		> CSS.fixPNG() // To fix all css
		>
		> CSS.fixPNG("mac_shadow.css") // to fix all css files with mac_shadow.css so mainly only on file
		>
		> CSS.fixPNG("shadow", "vista"); // To fix all css files with shadow or vista in their names

       Parameters
		patterns: (optional) list of pattern to filter css files
		*/
		fixPNG: (Prototype.Browser.IE && Prototype.Browser.IEVersion < 7) ? fixPNG : Prototype.emptyFunction,

		// By Tobie Langel (http://tobielangel.com)
		//   inspired by http://yuiblog.com/blog/2007/06/07/style/
		addRule: function(css, backwardCompatibility) {
			if (backwardCompatibility) css = css + '{' + backwardCompatibility + '}';
			var style = new Element('style', { type: 'text/css', media: 'screen' });
			$(document.getElementsByTagName('head')[0]).insert(style);
			if (style.styleSheet) style.styleSheet.cssText = css;
			else style.appendText(css);
			return style;
		},

		preloadImages: function() {
			parseStylesheet.apply(this, $A(arguments).concat(preloadRule));
		}
	};
})();
UI.Benchmark = {
	benchmark: function(lambda, iterations) {
		var date = new Date();
		(iterations || 1).times(lambda);
		return (new Date() - date) / 1000;
	}
};
/*
Group: Drag
UI provides Element#enableDrag method that allow elements to fire drag-related events.

Events fired:
- drag:started : fired when a drag is started (mousedown then mousemove)
- drag:updated : fired when a drag is updated (mousemove)
- drag:ended   : fired when a drag is ended (mouseup)

Notice it doesn't actually move anything, drag behavior has to be implemented
by attaching handlers to drag events.

Drag-related informations:
event.memo contains useful information about the drag occuring:
- dx         : difference between pointer x position when drag started
and actual x position
- dy         : difference between pointer y position when drag started
and actual y position
- mouseEvent : the original mouse event, useful to know pointer absolute position,
or if key were pressed.

Example, with event handling for a specific element:

> // Now "resizable" will fire drag-related events
> $('resizable').enableDrag();
>
> // Let's observe them
> $('resizable').observe('drag:started', function(event) {
>   this._dimensions = this.getDimensions();
> }).observe('drag:updated', function(event) {
>   var drag = event.memo;
>
>   this.setStyle({
>     width:  this._dimensions.width  + drag.dx + 'px',
>     height: this._dimensions.height + drag.dy + 'px'
>   });
> });

Example, with event delegating on the whole document:

> // All elements in the having the "draggable" class name will fire drag events.
> $$('.draggable').invoke('enableDrag');
>
> document.observe('drag:started', function(event) {
>   UI.logger.info('trying to drag ' + event.element().id);
> }):
*/
(function() {
	var initPointer, currentDraggable, dragging;

	document.observe('mousedown', onMousedown);

	function onMousedown(event) {
		var draggable = event.findElement('[ui:draggable="true"]');

		if (draggable) {
			// prevent default browser action
			event.stop();
			currentDraggable = draggable;
			initPointer = event.pointer();

			document.observe("mousemove", onMousemove)
              .observe("mouseup", onMouseup);
		}
	};

	function onMousemove(event) {
		event.stop();

		if (dragging)
			fire('drag:updated', event);
		else {
			dragging = true;
			fire('drag:started', event);
		}
	};

	function onMouseup(event) {
		document.stopObserving('mousemove', onMousemove)
            .stopObserving('mouseup', onMouseup);

		if (dragging) {
			dragging = false;
			fire('drag:ended', event);
		}
	};

	function fire(eventName, mouseEvent) {
		var pointer = mouseEvent.pointer();

		currentDraggable.fire(eventName, {
			dx: pointer.x - initPointer.x,
			dy: pointer.y - initPointer.y,
			mouseEvent: mouseEvent
		})
	};

	Element.addMethods({
		enableDrag: function(element) {
			element = $(element);
			element.writeAttribute('ui:draggable', 'true');
			return element;
		},

		disableDrag: function(element) {
			element = $(element);
			element.writeAttribute('ui:draggable', null);
			return element;
		},

		isDraggable: function(element) {
			return $(element).readAttribute('ui:draggable') == 'true';
		}
	});
})();
/*
Class: UI.IframeShim
Handles IE6 bug when <select> elements overlap other elements with higher z-index

Example:
> // creates iframe and positions it under "contextMenu" element
> this.iefix = new UI.IframeShim().positionUnder('contextMenu');
> ...
> document.observe('click', function(e) {
>   if (e.isLeftClick()) {
>     this.contextMenu.hide();
>
>     // hides iframe when left click is fired on a document
>     this.iefix.hide();
>   }
> }.bind(this))
> ...
*/

// TODO:
//
// Maybe it makes sense to bind iframe to an element
// so that it automatically calls positionUnder method
// when the element it's binded to is moved or resized
// Not sure how this might affect overall perfomance...

UI.IframeShim = Class.create(UI.Options, {

	/*
	Method: initialize
	Constructor

	Creates iframe shim and appends it to the body.
	Note that this method does not perform proper positioning and resizing of an iframe.
	To do that use positionUnder method

	Returns:
	this
	*/
	initialize: function() {
		this.element = new Element('iframe', {
			style: 'position:absolute;filter:progid:DXImageTransform.Microsoft.Alpha(opacity=0);display:none',
			src: 'javascript:false;',
			frameborder: 0
		});
		$(document.body).insert(this.element);
	},

	/*
	Method: hide
	Hides iframe shim leaving its position and dimensions intact

	Returns:
	this
	*/
	hide: function() {
		this.element.hide();
		return this;
	},

	/*
	Method: show
	Show iframe shim leaving its position and dimensions intact

	Returns:
	this
	*/
	show: function() {
		this.element.show();
		return this;
	},

	/*
	Method: positionUnder
	Positions iframe shim under the specified element
	Sets proper dimensions, offset, zIndex and shows it
	Note that the element should have explicitly specified zIndex

	Returns:
	this
	*/
	positionUnder: function(element) {
		var element = $(element),
        offset = element.cumulativeOffset(),
        dimensions = element.getDimensions(),
        style = {
        	left: offset[0] + 'px',
        	top: offset[1] + 'px',
        	width: dimensions.width + 'px',
        	height: dimensions.height + 'px',
        	zIndex: element.getStyle('zIndex') - 1
        };
		this.element.setStyle(style).show();

		return this;
	},

	/*
	Method: setBounds
	Sets element's width, height, top and left css properties using 'px' as units

	Returns:
	this
	*/
	setBounds: function(bounds) {
		for (prop in bounds) {
			bounds[prop] += 'px';
		}
		this.element.setStyle(bounds);
		return this;
	},

	/*
	Method: destroy
	Completely removes the iframe shim from the document

	Returns:
	this
	*/
	destroy: function() {
		if (this.element)
			this.element.remove();

		return this;
	}
});
/*
Class: UI.Logger
*/

/*
Group: Logging Facilities
Prototype UI provides a facility to log message with levels.
Levels are in order "debug", "info", "warn" and "error".

As soon as the DOM is loaded, a default logger is present in UI.logger.

This logger is :
* an <ElementLogger> if $('log') is present
* a <ConsoleLogger> if window.console is defined
* a <MemLogger> otherwise

See <AbstractLogger> to learn how to use it.

Example:

> UI.logger.warn('something bad happenned !');
*/

// Class: AbstractLogger

UI.Abstract.Logger = Class.create({
	/*
	Property: level
	The log level, default value is debug  <br/>
	*/
	level: 'debug'
});

(function() {
	/*
	Method: debug
	Logs with "debug" level

	Method: info
	Logs with "info" level

	Method: warn
	Logs with "warn" level

	Method: error
	Logs with "error" level
	*/
	var levels = $w(" debug info warn error ");

	levels.each(function(level, index) {
		UI.Abstract.Logger.addMethod(level, function(message) {
			// filter lower level messages
			if (index >= levels.indexOf(this.level))
				this._log({ level: level, message: message, date: new Date() });
		});
	});
})();

/*
Class: NullLogger
Does nothing
*/
UI.NullLogger = Class.create(UI.Abstract.Logger, {
	_log: Prototype.emptyFunction
});

/*
Class: MemLogger
Logs in memory

Property: logs
An array of logs, objects with "date", "level", and "message" properties
*/
UI.MemLogger = Class.create(UI.Abstract.Logger, {
	initialize: function() {
		this.logs = [];
	},

	_log: function(log) {
		this.logs.push(log);
	}
});

/*
Class: ConsoleLogger
Logs using window.console
*/
UI.ConsoleLogger = Class.create(UI.Abstract.Logger, {
	_log: function(log) {
		console[log.level || 'log'](log.message);
	}
});

/*
Class: ElementLogger
Logs in a DOM element
*/
UI.ElementLogger = Class.create(UI.Abstract.Logger, {
	/*
	Method: initialize
	Constructor, takes a DOM element to log into as argument
	*/
	initialize: function(element) {
		this.element = $(element);
	},

	/*
	Property: format
	A format string, will be interpolated with "date", "level" and "message"

	Example:
	> "<p>(#{date}) #{level}: #{message}</p>"
	*/
	format: '<p>(<span class="date">#{date}</span>) ' +
              '<span class="level">#{level}</span> : ' +
              '<span class="message">#{message}</span></p>',

	_log: function(log) {
		var entry = this.format.interpolate({
			level: log.level.toUpperCase(),
			message: log.message.escapeHTML(),
			date: log.date.toLocaleTimeString()
		});
		this.element.insert({ top: entry });
	}
});

document.observe('dom:loaded', function() {
	if ($('log')) UI.logger = new UI.ElementLogger('log');
	else if (window.console) UI.logger = new UI.ConsoleLogger();
	else UI.logger = new UI.MemLogger();
});
/*
Class: UI.Shadow
Add shadow around a DOM element. The element MUST BE in ABSOLUTE position.

Shadow can be skinned by CSS (see mac_shadow.css or drop_shadow.css).
CSS must be included to see shadow.

A shadow can have two states: focused and blur.
Shadow shifts are set in CSS file as margin and padding of shadow_container to add visual information.

Example:
> new UI.Shadow("element_id");
*/
UI.Shadow = Class.create(UI.Options, {
	options: {
		theme: "mac_shadow",
		focus: false,
		zIndex: 100
	},

	/*
	Method: initialize
	Constructor, adds shadow elements to the DOM if element is in the DOM.
	Element MUST BE in ABSOLUTE position.

	Parameters:
	element - DOM element
	options - Hashmap of options
	- theme (default: mac_shadow)
	- focus (default: true)
	- zIndex (default: 100)

	Returns:
	this
	*/
	initialize: function(element, options) {
		this.setOptions(options);

		this.element = $(element);
		this.create();
		if (Object.isElement(this.element.parentNode))
			this.render();
	},

	/*
	Method: destroy
	Destructor, removes elements from the DOM
	*/
	destroy: function() {
		if (this.shadow.parentNode)
			this.remove();
	},

	// Group: Size and Position
	/*
	Method: setPosition
	Sets top/left shadow position in pixels

	Parameters:
	top -  top position in pixel
	left - left position in pixel

	Returns:
	this
	*/
	setPosition: function(top, left) {
		if (this.shadowSize) {
			var shadowStyle = this.shadow.style;

			shadowStyle.top = parseInt(top) - this.shadowSize.top + this.shadowShift.top + 'px';
			shadowStyle.left = parseInt(left) - this.shadowSize.left + this.shadowShift.left + 'px';
		}
		return this;
	},

	/*
	Method: setSize
	Sets width/height shadow in pixels

	Parameters:
	width  - width in pixel
	height - height in pixel

	Returns:
	this
	*/
	setSize: function(width, height) {
		if (this.shadowSize) {
			var w = parseInt(width) + this.shadowSize.width - this.shadowShift.width + "px";
			this.shadow.style.width = w;
			var h = parseInt(height) - this.shadowShift.height + "px";

			// this.shadowContents[1].style.height = h;
			this.shadowContents[1].childElements().each(function(e) { e.style.height = h });
			this.shadowContents.each(function(item) { item.style.width = w });
		}
		return this;
	},

	/*
	Method: setBounds
	Sets shadow bounds in pixels

	Parameters:
	bounds - an Hash {top:, left:, width:, height:}

	Returns:
	this
	*/
	setBounds: function(bounds) {
		return this.setPosition(bounds.top, bounds.left).setSize(bounds.width, bounds.height);
	},

	/*
	Method: setZIndex
	Sets shadow z-index

	Parameters:
	zIndex - zIndex value

	Returns:
	this
	*/
	setZIndex: function(zIndex) {
		this.shadow.style.zIndex = zIndex;
		return this;
	},

	// Group: Render
	/*
	Method: show
	Displays shadow

	Returns:
	this
	*/
	show: function() {
		this.shadow.show();
		return this;
	},

	/*
	Method: hide
	Hides shadow

	Returns:
	this
	*/
	hide: function() {
		this.shadow.hide();
		return this;
	},

	/*
	Method: remove
	Removes shadow from the DOM

	Returns:
	this
	*/
	remove: function() {
		this.shadow.remove();
		return this;
	},

	// Group: Status
	/*
	Method: focus
	Focus shadow.

	Change shadow shift. Shift values are set in CSS file as margin and padding of shadow_container
	to add visual information of shadow status.

	Returns:
	this
	*/
	focus: function() {
		this.options.focus = true;
		this.updateShadow();
		return this;
	},

	/*
	Method: blur
	Blurs shadow.

	Change shadow shift. Shift values are set in CSS file as margin and padding of shadow_container
	to add visual information of shadow status.

	Returns:
	this
	*/
	blur: function() {
		this.options.focus = false;
		this.updateShadow();
		return this;
	},

	// Private Functions
	// Adds shadow elements to DOM, computes shadow size and displays it
	render: function() {
		if (this.element.parentNode && !Object.isElement(this.shadow.parentNode)) {
			this.element.parentNode.appendChild(this.shadow);
			this.computeSize();
			this.setBounds(Object.extend(this.element.getDimensions(), this.getElementPosition()));
			this.shadow.show();
		}
		return this;
	},

	// Creates HTML elements without inserting them into the DOM
	create: function() {
		var zIndex = this.element.getStyle('zIndex');
		if (!zIndex)
			this.element.setStyle({ zIndex: this.options.zIndex });
		zIndex = (zIndex || this.options.zIndex) - 1;

		this.shadowContents = new Array(3);
		this.shadowContents[0] = new Element("div")
      .insert(new Element("div", { className: "shadow_center_wrapper" }).insert(new Element("div", { className: "n_shadow" })))
      .insert(new Element("div", { className: "shadow_right ne_shadow" }))
      .insert(new Element("div", { className: "shadow_left nw_shadow" }));

		this.shadowContents[1] = new Element("div")
      .insert(new Element("div", { className: "shadow_center_wrapper c_shadow" }))
      .insert(new Element("div", { className: "shadow_right e_shadow" }))
      .insert(new Element("div", { className: "shadow_left w_shadow" }));
		this.centerElements = this.shadowContents[1].childElements();

		this.shadowContents[2] = new Element("div")
      .insert(new Element("div", { className: "shadow_center_wrapper" }).insert(new Element("div", { className: "s_shadow" })))
      .insert(new Element("div", { className: "shadow_right se_shadow" }))
      .insert(new Element("div", { className: "shadow_left sw_shadow" }));

		this.shadow = new Element("div", { className: "shadow_container " + this.options.theme,
			style: "position:absolute; top:-10000px; left:-10000px; display:none; z-index:" + zIndex
		})
      .insert(this.shadowContents[0])
      .insert(this.shadowContents[1])
      .insert(this.shadowContents[2]);
	},

	// Compute shadow size
	computeSize: function() {
		if (this.focusedShadowShift)
			return;
		this.shadow.show();

		// Trick to get shadow shift designed in CSS as padding
		var content = this.shadowContents[1].select("div.c_shadow").first();
		this.unfocusedShadowShift = {};
		this.focusedShadowShift = {};

		$w("top left bottom right").each(function(pos) { this.unfocusedShadowShift[pos] = content.getNumStyle("padding-" + pos) || 0 } .bind(this));
		this.unfocusedShadowShift.width = this.unfocusedShadowShift.left + this.unfocusedShadowShift.right;
		this.unfocusedShadowShift.height = this.unfocusedShadowShift.top + this.unfocusedShadowShift.bottom;

		$w("top left bottom right").each(function(pos) { this.focusedShadowShift[pos] = content.getNumStyle("margin-" + pos) || 0 } .bind(this));
		this.focusedShadowShift.width = this.focusedShadowShift.left + this.focusedShadowShift.right;
		this.focusedShadowShift.height = this.focusedShadowShift.top + this.focusedShadowShift.bottom;

		this.shadowShift = this.options.focus ? this.focusedShadowShift : this.unfocusedShadowShift;

		// Get shadow size
		this.shadowSize = { top: this.shadowContents[0].childElements()[1].getNumStyle("height"),
			left: this.shadowContents[0].childElements()[1].getNumStyle("width"),
			bottom: this.shadowContents[2].childElements()[1].getNumStyle("height"),
			right: this.shadowContents[0].childElements()[2].getNumStyle("width")
		};

		this.shadowSize.width = this.shadowSize.left + this.shadowSize.right;
		this.shadowSize.height = this.shadowSize.top + this.shadowSize.bottom;

		// Remove padding
		content.setStyle("padding:0; margin:0");
		this.shadow.hide();
	},

	// Update shadow size (called when it changes from focused to blur and vice-versa)
	updateShadow: function() {
		this.shadowShift = this.options.focus ? this.focusedShadowShift : this.unfocusedShadowShift;
		var shadowStyle = this.shadow.style, pos = this.getElementPosition(), size = this.element.getDimensions();

		shadowStyle.top = pos.top - this.shadowSize.top + this.shadowShift.top + 'px';
		shadowStyle.left = pos.left - this.shadowSize.left + this.shadowShift.left + 'px';
		shadowStyle.width = size.width + this.shadowSize.width - this.shadowShift.width + "px";
		var h = size.height - this.shadowShift.height + "px";
		this.centerElements.each(function(e) { e.style.height = h });

		var w = size.width + this.shadowSize.width - this.shadowShift.width + "px";
		this.shadowContents.each(function(item) { item.style.width = w });
	},

	// Get element position in integer values
	getElementPosition: function() {
		return { top: this.element.getNumStyle("top"), left: this.element.getNumStyle("left") }
	}
});

// Set theme and focus as read/write accessor
document.whenReady(function() { CSS.fixPNG("shadow") });
/*
Class: UI.Window
Main class to handle windows inside a web page.

Example:
> new UI.Window({ theme: 'bluglighting' }).show()
*/


/*
<div class="STitle">Options</div>
*/

UI.Window = Class.create(UI.Options, {
	// Group: Options
	options: {

		// Property: theme
		//   window theme, uses the window manager theme as default
		theme: null,

		// Property: shadowTheme
		//   window shadow theme, uses the window manager one as default
		//   Only useful if <shadow> options is true, see <UI.Shadow> for details
		shadowTheme: null,

		// Property: id
		//   id ot the window, generated by default
		id: null,

		// Property: windowManager
		//   window manager that manages this window,
		//   uses UI.defaultWM as default
		windowManager: null,

		top: null,
		left: null,
		width: 200,
		height: 300,
		minHeight: 100,
		minWidth: 200,
		maxHeight: null,
		maxWidth: null,
		altitude: "front",

		// Property: resizable
		//   true by default
		resizable: true,

		// Property: draggable
		//   true by default
		draggable: true,

		// Property: wired
		//   draw wires around window when dragged, false by default
		wired: false,

		// Property: show
		//   Function used to show the window, default is Element.show
		show: Element.show,

		// Property: hide
		//   Function used to hide the window, default is Element.hide.
		hide: Element.hide,

		// Property: superflousEffects
		//   uses superflous effects when resizing or moving window.
		//   it's true if Scriptaculous' Effect is defined, false otherwise
		superflousEffects: !Object.isUndefined(window.Effect),

		// Property: shadow
		//   draw shadow around the window, default is false
		shadow: false,

		// Property: activeOnClick
		//   When set to true, a click on an blurred window content activates it,
		//   default is true
		activeOnClick: true,

		// Grid
		gridX: 1,
		gridY: 1,

		// Buttons and actions (false to disable)

		// Property: close
		//   Window method name as string, or false to disable close button
		//   Default is 'destroy'
		close: 'destroy',

		// Property: minimize
		//   Window method name as string, or false to disable minimize button
		//   Default is 'toggleFold'
		minimize: 'toggleFold',

		// Property: maximize
		//   Window method name as string, or false to disable maximize button
		//   Default is 'toggleMaximize'
		maximize: 'toggleMaximize'
	},

	// Group: Attributes

	/*
	Property: id
	DOM id of the window's element

	Property: element
	DOM element containing the window

	Property: windowManager
	Window manager that manages the window

	Property: content
	Window content element

	Property: header
	Window header element

	Property: footer
	Window footer element

	Property: visible
	true if window is visible

	Property: focused
	true if window is focused

	Property: folded
	true if window is folded

	Property: maximized
	true if window is maximized
	*/

	/*
	Group: Events
	List of events fired by a window
	*/

	/*
	Property: created
	Fired after creating the window

	Property: destroyed
	Fired after destroying the window

	Property: showing
	Fired when showing a window

	Property: shown
	Fired after showing effect

	Property: hiding
	Fired when hiding a window

	Property: hidden
	Fired after hiding effect

	Property: focused
	Fired after focusing the window

	Property: blurred
	Fired after bluring the window

	Property: maximized
	Fired after maximizing the window

	Property: restored
	Fired after restoring the window from its maximized state

	Property: fold
	Fired after unfolding the window

	Property: unfold
	Fired after folding the window

	Property: altitude:changed
	Fired when window altitude has changed (z-index)

	Property: size:changed
	Fired when window size has changed

	Property: position:changed
	Fired when window position has changed

	Property: move:started
	Fired when user has started a moving a window, position:changed are then fired continously

	Property: move:ended
	Fired when user has finished moving a window

	Property: resize:started
	Fired when user has started resizing window, size:changed are then fired continuously

	Property: resize:ended
	Fired when user has finished resizing window

	*/

	// Group: Contructor

	/*
	Method: initialize
	Constructor, should not be called directly, it's called by new operator (new Window())
	The window is not open and nothing has been added to the DOM yet

	Parameters:
	options - (Hash) list of optional parameters

	Returns:
	this
	*/
	initialize: function(options) {
		this.setOptions(options);
		this.windowManager = this.options.windowManager || UI.defaultWM;
		this.create();
		this.id = this.element.id;
		this.windowManager.register(this);
		this.render();
		if (this.options.activeOnClick)
			this.overlay.setStyle({ zIndex: this.lastZIndex + 1 }).show();
	},

	/*
	Method: destroy
	Destructor, closes window, cleans up DOM and memory
	*/
	destroy: function($super) {
		this.hide();
		if (this.centerOptions)
			Event.stopObserving(this.windowManager.scrollContainer, "scroll", this.centerOptions.handler);
		this.windowManager.unregister(this);
		this.fire('destroyed');
	},

	// Group: Event handling

	/*
	Method: fire
	Fires a window custom event automatically namespaced in "window:" (see Prototype custom events).
	The memo object contains a "window" property referring to the window.

	Example:
	> UI.Window.addMethods({
	>   iconify: function() {
	>     // ... your iconifying code here ...
	>     this.fire('iconified');
	>     // chain friendly
	>     return this;
	>   }
	> });
	>
	> document.observe('window:iconified', function(event) {
	>   alert("Window with id " + event.memo.window.id + " has just been iconified");
	> });

	Parameters:
	eventName - an event name
	memo - a memo object

	Returns:
	fired event
	*/
	fire: function(eventName, memo) {
		memo = memo || {};
		memo.window = this;
		return this.element.fire('window:' + eventName, memo);
	},

	/*
	Method: observe
	Observe a window event with a handler function automatically bound to the window

	Parameters:
	eventName - an event name
	handler - a handler function

	Returns:
	this
	*/
	observe: function(eventName, handler) {
		this.element.observe('window:' + eventName, handler.bind(this));
		return this;
	},


	// Group: Actions

	/*
	Method: show
	Opens the window (appends it to the DOM)

	Parameters:
	modal - open the window in a modal mode (default false)

	Returns:
	this
	*/
	show: function(modal) {
		if (this.visible) return this;

		this.fire('showing');
		this.effect('show');

		if (modal) {
			this.windowManager.startModalSession(this);
			this.modalSession = true;
		}

		this.addElements();
		this.visible = true;

		new PeriodicalExecuter(function(executer) {
			if (!this.element.visible()) return;
			this.fire('shown');
			executer.stop();
		} .bind(this), 0.1);

		return this;
	},

	/*
	Method: hide
	Hides the window, (removes it from the DOM)

	Returns:
	this
	*/
	hide: function() {
		if (!this.visible) return this;

		this.fire('hiding');
		this.effect('hide');

		if (this.modalSession) {
			this.windowManager.endModalSession(this);
			this.modalSession = false;
		}

		this.windowManager.hide(this);

		new PeriodicalExecuter(function(executer) {
			if (this.element.visible()) return;
			this.visible = false;
			this.element.remove();
			this.fire('hidden');
			executer.stop();
		} .bind(this), 0.1);

		return this;
	},

	close: function() {
		return this.action('close');
	},

	/*
	Method: activate
	Brings window to the front and sets focus on it

	Returns:
	this
	*/
	activate: function() {
		return this.bringToFront().focus();
	},

	/*
	Method: bringToFront
	Brings window to the front (but does not set focus on it)

	Returns:
	this
	*/
	bringToFront: function() {
		return this.setAltitude('front');
	},

	/*
	Method: sendToBack
	Sends window to the back (without changing its focus)

	Returns:
	this
	*/
	sendToBack: function() {
		return this.setAltitude('back');
	},

	/*
	Method: focus
	Focuses the window (without bringing window to the front)

	Returns:
	this
	*/
	focus: function() {
		if (this.focused) return this;

		this.windowManager.focus(this);
		// Hide the overlay that catch events
		this.overlay.hide();
		// Add focused class name
		this.element.addClassName(this.options.theme + '_focused');

		this.focused = true;
		this.fire('focused');
		return this;
	},

	/*
	Method: blur
	Blurs the window (without changing windows order)

	Returns:
	this
	*/
	blur: function() {
		if (!this.focused) return this;

		this.windowManager.blur(this);
		this.element.removeClassName(this.options.theme + '_focused');

		// Show the overlay to catch events
		if (this.options.activeOnClick)
			this.overlay.setStyle({ zIndex: this.lastZIndex + 1 }).show();

		this.focused = false;
		this.fire('blurred');
		return this;
	},

	/*
	Method: maximize
	Maximizes window inside its viewport (managed by WindowManager)
	Makes window take full size of its viewport

	Returns:
	this
	*/
	maximize: function() {
		if (this.maximized) return this;

		// Get bounds has to be before  this.windowManager.maximize for IE!! this.windowManager.maximize remove overflow
		// and it breaks this.getBounds()
		var bounds = this.getBounds();
		if (this.windowManager.maximize(this)) {
			this.disableButton('minimize').setResizable(false).setDraggable(false);

			this.activate();
			this.maximized = true;
			this.savedArea = bounds;
			var newBounds = Object.extend(this.windowManager.viewport.getDimensions(), { top: 0, left: 0 });
			this[this.options.superflousEffects && !Prototype.Browser.IE ? "morph" : "setBounds"](newBounds);
			this.fire('maximized');
			return this;
		}
	},

	/*
	Function: restore
	Restores a maximized window to its initial size

	Returns:
	this
	*/
	restore: function() {
		if (!this.maximized) return this;

		if (this.windowManager.restore(this)) {
			this[this.options.superflousEffects && !Prototype.Browser.IE ? "morph" : "setBounds"](this.savedArea);
			this.enableButton("minimize").setResizable(true).setDraggable(true);

			this.maximized = false;
			this.fire('restored');
			return this;
		}
	},

	/*
	Function: toggleMaximize
	Maximizes/Restores window inside it's viewport (managed by WindowManager)

	Returns:
	this
	*/
	toggleMaximize: function() {
		return this.maximized ? this.restore() : this.maximize();
	},

	/*
	Function: adapt
	Adapts window size to fit its content

	Returns:
	this
	*/
	adapt: function() {
		var dimensions = this.content.getScrollDimensions();
		if (this.options.superflousEffects)
			this.morph(dimensions, true);
		else
			this.setSize(dimensions.width, dimensions.height, true);
		return this;
	},

	/*
	Method: fold
	Folds window content

	Returns:
	this
	*/
	fold: function() {
		if (!this.folded) {
			var size = this.getSize(true);
			this.folded = true;
			this.savedInnerHeight = size.height;

			if (this.options.superflousEffects)
				this.morph({ width: size.width, height: 0 }, true);
			else
				this.setSize(size.width, 0, true);

			this.setResizable(false);
			this.fire("fold");
		}
		return this;
	},

	/*
	Method: unfold
	Unfolds window content

	Returns:
	this
	*/
	unfold: function() {
		if (this.folded) {
			var size = this.getSize(true);
			this.folded = false;

			if (this.options.superflousEffects)
				this.morph({ width: size.width, height: this.savedInnerHeight }, true);
			else
				this.setSize(size.width, this.savedInnerHeight, true);

			this.setResizable(true);
			this.fire("unfold");
		}
		return this;
	},

	/*
	Method: toggleFold
	Folds/Unfolds window content

	Returns:
	this
	*/
	toggleFold: function() {
		return this.folded ? this.unfold() : this.fold();
	},

	/*
	Method: setHeader
	Sets window header, equivalent to this.header.update(...) but allows chaining

	Returns:
	this
	*/
	setHeader: function(header) {
		this.header.update(header);
		return this;
	},

	/*
	Method: setContent
	Sets window content, equivalent to this.content.update(...) but allows chaining

	Returns:
	this
	*/
	setContent: function(content) {
		this.content.update(content);
		return this;
	},

	/*
	Method: setFooter
	Sets window footer, equivalent to this.footer.update(...) but allows chaining

	Returns:
	this
	*/
	setFooter: function(footer) {
		this.footer.update(footer);
		return this;
	},

	/*
	Method: setAjaxContent
	Sets window content using Ajax request

	Parameters:
	url - Ajax URL
	options - Ajax Updater options (see http://prototypejs.org/api/ajax/options and
	http://prototypejs.org/api/ajax/updater)

	Returns:
	this
	*/
	setAjaxContent: function(url, options) {
		// bind all callbacks to the window
		Object.keys(options || {}).each(function(name) {
			if (Object.isFunction(options[name]))
				options[name] = options[name].bind(this);
		}, this);

		new Ajax.Updater(this.content, url, options);
		return this;
	},

	// Group: Size and Position

	/*
	Method: getPosition
	Returns top/left position of a window (in pixels)

	Returns:
	an Hash {top:, left:}
	*/
	getPosition: function() {
		return { left: this.options.left, top: this.options.top };
	},

	/*
	Method: setPosition
	Sets top/left position of a window (in pixels)

	Parameters
	top:  top position in pixel
	left: left position in pixel

	Returns:
	this
	*/
	setPosition: function(top, left) {
		var pos = this.computePosition(top, left);
		this.options.top = pos.top;
		this.options.left = pos.left;

		var elementStyle = this.element.style;
		elementStyle.top = pos.top + 'px';
		elementStyle.left = pos.left + 'px';

		this.fire('position:changed');
		return this;
	},

	/*
	Method: center
	Centers the window within its viewport

	Returns:
	this
	*/
	center: function(options) {
		var size = this.getSize(),
        windowManager = this.windowManager,
        viewport = windowManager.viewport;
		viewportArea = viewport.getDimensions(),
        offset = viewport.getScrollOffset();

		if (options && options.auto) {
			this.centerOptions = Object.extend({ handler: this.recenter.bind(this) }, options);
			Event.observe(this.windowManager.scrollContainer, "scroll", this.centerOptions.handler);
			Event.observe(window, "resize", this.centerOptions.handler);
		}

		options = Object.extend({
			top: (viewportArea.height - size.height) / 2,
			left: (viewportArea.width - size.width) / 2
		}, options || {});

		return this.setPosition(options.top + offset.top, options.left + offset.left);
	},

	/*
	Method: getSize
	Returns window width/height dimensions (in pixels)

	Parameters
	innerSize: returns content size if true, window size if false (defaults to false)

	Returns:
	Hash {width:, height:}
	*/
	getSize: function(innerSize) {
		if (innerSize)
			return { width: this.options.width - this.borderSize.width,
				height: this.options.height - this.borderSize.height
			};
		else
			return { width: this.options.width, height: this.options.height };
	},

	/*
	Method: setSize
	Sets window width/height dimensions (in pixels), fires size:changed

	Parameters
	width:  width (in pixels)
	height: height (in pixels)
	innerSize: if true change set content size, else set window size (defaults to false)

	Returns:
	this
	*/
	setSize: function(width, height, innerSize) {
		var size = this.computeSize(width, height, innerSize);
		var elementStyle = this.element.style, contentStyle = this.content.style;

		this.options.width = size.outerWidth;
		this.options.height = size.outerHeight;

		elementStyle.width = size.outerWidth + "px", elementStyle.height = size.outerHeight + "px";
		contentStyle.width = size.innerWidth + "px", contentStyle.height = size.innerHeight + "px";
		this.overlay.style.height = size.innerHeight + "px";

		this.fire('size:changed');
		return this;
	},

	/*
	Method: getBounds
	Returns window bounds (in pixels)

	Parameters
	innerSize: returns content size if true, window size otherwise

	Returns:
	an Hash {top:, left:, width:, height:}
	*/
	getBounds: function(innerSize) {
		return Object.extend(this.getPosition(), this.getSize(innerSize));
	},

	/*
	Method: setBounds
	Sets window bounds (in pixels), fires position:changed and size:changed

	Parameters
	bounds: Hash {top:, left:, width:, height:} where all values are optional
	innerSize: sets content size if true, window size otherwise

	Returns:
	Hash {top:, left:, width:, height:}
	*/
	setBounds: function(bounds, innerSize) {
		return this.setPosition(bounds.top, bounds.left)
               .setSize(bounds.width, bounds.height, innerSize);
	},

	morph: function(bounds, innerSize) {
		bounds = Object.extend(this.getBounds(innerSize), bounds || {});

		if (this.centerOptions && this.centerOptions.auto)
			bounds = Object.extend(bounds, this.computeRecenter(bounds));

		if (innerSize) {
			bounds.width += this.borderSize.width;
			bounds.height += this.borderSize.height;
		}

		this.animating = true;

		new UI.Window.Effects.Morph(this, bounds, {
			duration: 0.5,
			afterFinish: function() { this.animating = false } .bind(this)
		});

		Object.extend(this.options, bounds);

		return this;
	},

	/*
	Method: getAltitude
	Returns window altitude, an integer between 0 and the number of windows,
	the higher the altitude number - the higher the window position.
	*/
	getAltitude: function() {
		return this.windowManager.getAltitude(this);
	},

	/*
	Method: setAltitude
	Sets window altitude, fires 'altitude:changed' if altitude was changed
	*/
	setAltitude: function(altitude) {
		if (this.windowManager.setAltitude(this, altitude))
			this.fire('altitude:changed');
		return this;
	},

	/*
	Method: setResizable
	TODO
	*/
	setResizable: function(resizable) {
		this.options.resizable = resizable;

		var toggleClassName = (resizable ? 'add' : 'remove') + 'ClassName';

		this.element[toggleClassName]('resizable')
      .select('div:[class*=_sizer]').invoke(resizable ? 'show' : 'hide');
		if (resizable)
			this.createResizeHandles();

		this.element.select('div.se').first()[toggleClassName]('se_resize_handle');

		return this;
	},

	/*
	Method: setDraggable
	TODO
	*/
	setDraggable: function(draggable) {
		this.options.draggable = draggable;
		this.element[(draggable ? 'add' : 'remove') + 'ClassName']('draggable');
		return this;
	},

	// Group: Theme
	/*
	Method: getTheme
	Returns window theme name
	*/
	getTheme: function() {
		return this.options.theme || this.windowManager.getTheme();
	},

	/*
	Method: setTheme
	Sets window theme
	*/
	setTheme: function(theme, windowManagerTheme) {
		this.element.removeClassName(this.getTheme()).addClassName(theme);
		// window has it's own theme
		if (!windowManagerTheme)
			this.options.theme = theme;

		return this;
	},

	/*
	Method: getShadowTheme
	Returns shadow theme name
	*/
	getShadowTheme: function() {
		return this.options.shadowTheme || this.windowManager.getShadowTheme();
	}
});

UI.Window.addMethods(UI.Window.Buttons);
UI.Window.addMethods(UI.Window.Shadow);
UI.Window.optionsAccessor($w(" minWidth minHeight maxWidth maxHeight gridX gridY altitude "));
// Private functions for window.js
UI.Window.addMethods({
	style: "position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0;",

	action: function(name) {
		var action = this.options[name];
		if (action)
			Object.isString(action) ? this[action]() : action.call(this, this);
	},

	create: function() {
		function createDiv(className, options) {
			return new Element('div', Object.extend({ className: className }, options));
		};

		// Main div
		this.element = createDiv("ui-window " + this.getTheme(), {
			id: this.options.id,
			style: "top:-10000px; left:-10000px"
		});

		// Create HTML window code
		this.header = createDiv('n move_handle').enableDrag();
		this.content = createDiv('content').appendText(' ');
		this.footer = createDiv('s move_handle').enableDrag();

		var header = createDiv('nw').insert(createDiv('ne').insert(this.header));
		var content = createDiv('w').insert(createDiv('e', { style: "position:relative" }).insert(this.content));
		var footer = createDiv('sw').insert(createDiv('se' + (this.options.resizable ? " se_resize_handle" : "")).insert(this.footer));

		this.element.insert(header).insert(content).insert(footer).identify('ui-window');
		this.header.observe('mousedown', this.activate.bind(this));

		this.setDraggable(this.options.draggable);
		this.setResizable(this.options.resizable);

		this.overlay = new Element('div', { style: this.style + "display: none" })
        .observe('mousedown', this.activate.bind(this));

		if (this.options.activeOnClick)
			this.content.insert({ before: this.overlay });
	},

	createWiredElement: function() {
		this.wiredElement = this.wiredElement || new Element("div", {
			className: this.getTheme() + "_wired",
			style: "display: none; position: absolute; top: 0; left: 0"
		});
	},

	createResizeHandles: function() {
		$w(" n  w  e  s  nw  ne  sw  se ").each(function(id) {
			this.insert(new Element("div", {
				className: id + "_sizer resize_handle",
				drag_prefix: id
			}).enableDrag());
		}, this.element);
		this.createResizeHandles = Prototype.emptyFunction;
	},

	// First rendering, pre-compute window border size
	render: function() {
		this.addElements();

		this.computeBorderSize();
		this.updateButtonsOrder();
		this.element.hide().remove();

		// this.options contains top, left, width and height keys
		return this.setBounds(this.options);
	},

	// Adds window elements to the DOM
	addElements: function() {
		this.windowManager.container.appendChild(this.element);
	},

	// Set z-index to all window elements
	setZIndex: function(zIndex) {
		if (this.zIndex != zIndex) {
			this.zIndex = zIndex;
			[this.element].concat(this.element.childElements()).each(function(element) {
				element.style.zIndex = zIndex++;
			});
			this.lastZIndex = zIndex;
		}
		return this;
	},

	effect: function(name, element, options) {
		var effect = this.options[name] || Prototype.emptyFunction;
		effect(element || this.element, options || {});
	},

	// re-compute window border size
	computeBorderSize: function() {
		if (this.element) {
			if (Prototype.Browser.IEVersion >= 7)
				this.content.style.width = "100%";
			var dim = this.element.getDimensions(), pos = this.content.positionedOffset();
			this.borderSize = { top: pos[1],
				bottom: dim.height - pos[1] - this.content.getHeight(),
				left: pos[0],
				right: dim.width - pos[0] - this.content.getWidth()
			};
			this.borderSize.width = this.borderSize.left + this.borderSize.right;
			this.borderSize.height = this.borderSize.top + this.borderSize.bottom;
			if (Prototype.Browser.IEVersion >= 7)
				this.content.style.width = "auto";
		}
	},

	computeSize: function(width, height, innerSize) {
		var innerWidth, innerHeight, outerWidth, outerHeight;
		if (innerSize) {
			outerWidth = width + this.borderSize.width;
			outerHeight = height + this.borderSize.height;
		} else {
			outerWidth = width;
			outerHeight = height;
		}
		// Check grid value
		if (!this.animating) {
			outerWidth = outerWidth.snap(this.options.gridX);
			outerHeight = outerHeight.snap(this.options.gridY);

			// Check min size
			if (!this.folded) {
				if (outerWidth < this.options.minWidth)
					outerWidth = this.options.minWidth;

				if (outerHeight < this.options.minHeight)
					outerHeight = this.options.minHeight;
			}

			// Check max size
			if (this.options.maxWidth && outerWidth > this.options.maxWidth)
				outerWidth = this.options.maxWidth;

			if (this.options.maxHeight && outerHeight > this.options.maxHeight)
				outerHeight = this.options.maxHeight;
		}

		if (this.centerOptions && this.centerOptions.auto)
			this.recenter();

		innerWidth = outerWidth - this.borderSize.width;
		innerHeight = outerHeight - this.borderSize.height;
		return {
			innerWidth: innerWidth, innerHeight: innerHeight,
			outerWidth: outerWidth, outerHeight: outerHeight
		};
	},

	computePosition: function(top, left) {
		if (this.centerOptions && this.centerOptions.auto)
			return this.computeRecenter(this.getSize()); ;

		return {
			top: this.animating ? top : top.snap(this.options.gridY),
			left: this.animating ? left : left.snap(this.options.gridX)
		};
	},

	computeRecenter: function(size) {
		var viewport = this.windowManager.viewport,
        area = viewport.getDimensions(),
        offset = viewport.getScrollOffset(),
        center = {
        	top: Object.isUndefined(this.centerOptions.top) ? (area.height - size.height) / 2 : this.centerOptions.top,
        	left: Object.isUndefined(this.centerOptions.left) ? (area.width - size.width) / 2 : this.centerOptions.left
        };

		return {
			top: parseInt(center.top + offset.top),
			left: parseInt(center.left + offset.left)
		};
	},

	recenter: function(event) {
		var pos = this.computeRecenter(this.getSize());
		this.setPosition(pos.top, pos.left);
	}
});
UI.URLWindow = Class.create(UI.Window, {
	options: {
		url: 'about:blank'
	},

	afterClassCreate: function() {
		this.undefMethod('setAjaxContent');
	},

	initialize: function($super, options) {
		$super(options);
		this.setUrl(this.options.url);
	},

	destroy: function($super) {
		this.iframe.src = null;
		$super();
	},

	getUrl: function() {
		return this.iframe.src;
	},

	setUrl: function(url, options) {
		this.iframe.src = url;
		return this;
	},

	create: function($super) {
		$super();

		this.iframe = new Element('iframe', {
			style: this.style,
			frameborder: 0,
			src: this.options.url,
			name: this.element.id + "_frame",
			id: this.element.id + "_frame"
		});

		this.content.insert(this.iframe);
	}
});
if (!Object.isUndefined(window.Effect)) {
	UI.Window.Effects = UI.Window.Effects || {};
	UI.Window.Effects.Morph = Class.create(Effect.Base, {
		initialize: function(window, bounds) {
			this.window = window;
			var options = Object.extend({
				fromBounds: this.window.getBounds(),
				toBounds: bounds,
				from: 0,
				to: 1
			}, arguments[2] || {});
			this.start(options);
		},

		update: function(position) {
			var t = this.options.fromBounds.top + (this.options.toBounds.top - this.options.fromBounds.top) * position;
			var l = this.options.fromBounds.left + (this.options.toBounds.left - this.options.fromBounds.left) * position;

			var ow = this.options.fromBounds.width + (this.options.toBounds.width - this.options.fromBounds.width) * position;
			var oh = this.options.fromBounds.height + (this.options.toBounds.height - this.options.fromBounds.height) * position;

			this.window.setBounds({ top: t, left: l, width: ow, height: oh })
		}
	});
}
UI.Window.addMethods({
	startDrag: function(handle) {
		this.initBounds = this.getBounds();
		this.activate();

		if (this.options.wired) {
			this.createWiredElement();
			this.wiredElement.style.cssText = this.element.style.cssText;
			this.element.hide();
			this.saveElement = this.element;
			this.windowManager.container.appendChild(this.wiredElement);
			this.element = this.wiredElement;
		}

		handle.hasClassName('resize_handle') ? this.startResize(handle) : this.startMove();
	},

	endDrag: function() {
		this.element.hasClassName('resized') ? this.endResize() : this.endMove();

		if (this.options.wired) {
			this.saveElement.style.cssText = this.wiredElement.style.cssText;
			this.wiredElement.remove();
			this.element = this.saveElement;
		}
	},

	startMove: function() {
		// method used to drag
		this.drag = this.moveDrag;
		this.element.addClassName('moved');
		this.fire('move:started');
	},

	endMove: function() {
		this.element.removeClassName('moved');
		this.fire('move:ended');
	},

	startResize: function(handle) {
		this.drag = this[handle.readAttribute('drag_prefix') + 'Drag'];
		this.element.addClassName('resized');
		this.fire('resize:started');
	},

	endResize: function() {
		this.element.removeClassName('resized');
		this.fire('resize:ended');
	},

	moveDrag: function(dx, dy) {
		this.setPosition(this.initBounds.top + dy, this.initBounds.left + dx);
	},

	swDrag: function(dx, dy) {
		var initBounds = this.initBounds;
		this.setSize(initBounds.width - dx, initBounds.height + dy)
        .setPosition(initBounds.top,
                     initBounds.left + (initBounds.width - this.getSize().width));
	},

	seDrag: function(dx, dy) {
		this.setSize(this.initBounds.width + dx, this.initBounds.height + dy);
	},

	nwDrag: function(dx, dy) {
		var initBounds = this.initBounds;
		this.setSize(initBounds.width - dx, initBounds.height - dy)
        .setPosition(initBounds.top + (initBounds.height - this.getSize().height),
                     initBounds.left + (initBounds.width - this.getSize().width));
	},

	neDrag: function(dx, dy) {
		var initBounds = this.initBounds;
		this.setSize(initBounds.width + dx, initBounds.height - dy)
        .setPosition(initBounds.top + (initBounds.height - this.getSize().height),
                     initBounds.left);
	},

	wDrag: function(dx, dy) {
		var initBounds = this.initBounds;
		this.setSize(initBounds.width - dx, initBounds.height)
        .setPosition(initBounds.top,
                     initBounds.left + (initBounds.width - this.getSize().width));
	},

	eDrag: function(dx, dy) {
		this.setSize(this.initBounds.width + dx, this.initBounds.height);
	},

	nDrag: function(dx, dy) {
		var initBounds = this.initBounds;
		this.setSize(initBounds.width, initBounds.height - dy)
        .setPosition(initBounds.top + (initBounds.height - this.getSize().height),
                     initBounds.left);
	},

	sDrag: function(dx, dy) {
		this.setSize(this.initBounds.width, this.initBounds.height + dy);
	}
});
UI.Window.addMethods({
	methodsAdded: function(base) {
		base.aliasMethodChain('create', 'buttons');
		base.aliasMethodChain('destroy', 'buttons');
	},

	createWithButtons: function() {
		this.createWithoutButtons();

		if (!this.options.resizable) {
			this.options.minimize = false;
			this.options.maximize = false;
		}

		this.buttons = new Element("div", { className: "buttons" })
      .observe('click', this.onButtonsClick.bind(this))
      .observe('mouseover', this.onButtonsHover.bind(this))
      .observe('mouseout', this.onButtonsOut.bind(this));

		this.element.insert(this.buttons);

		this.defaultButtons.each(function(button) {
			if (this.options[button] !== false)
				this.addButton(button);
		}, this);
	},

	destroyWithButtons: function() {
		this.buttons.stopObserving();
		this.destroyWithoutButtons();
	},

	defaultButtons: $w(' minimize maximize close '),

	getButtonElement: function(buttonName) {
		return this.buttons.down("." + buttonName);
	},

	// Controls close, minimize, maximize, etc.
	// action can be either a string or a function
	// if action is a string, it is the method name that will be called
	// else the function will take the window as first parameter.
	// if not given action will be taken in window's options
	addButton: function(buttonName, action) {
		this.buttons.insert(new Element("a", { className: buttonName, href: "#" }));

		if (action)
			this.options[buttonName] = action;

		return this;
	},

	removeButton: function(buttonName) {
		this.getButtonElement(buttonName).remove();
		return this;
	},

	disableButton: function(buttonName) {
		this.getButtonElement(buttonName).addClassName("disabled");
		return this;
	},

	enableButton: function(buttonName) {
		this.getButtonElement(buttonName).removeClassName("disabled");
		return this;
	},

	onButtonsClick: function(event) {
		var element = event.findElement('a:not(.disabled)');

		if (element) this.action(element.className);
		event.stop();
	},

	onButtonsHover: function(event) {
		this.buttons.addClassName("over");
	},

	onButtonsOut: function(event) {
		this.buttons.removeClassName("over");
	},

	updateButtonsOrder: function() {
		var buttons = this.buttons.childElements();

		buttons.inject(new Array(buttons.length), function(array, button) {
			array[parseInt(button.getStyle("padding-top"))] = button.setStyle("padding: 0");
			return array;
		}).each(function(button) { this.buttons.appendChild(button) }, this);
	}
});
UI.Window.addMethods({
	methodsAdded: function(base) {
		(function(methods) {
			$w(methods).each(function(m) { base.aliasMethodChain(m, 'shadow') });
		})(' create addElements setZIndex setPosition setSize setBounds ');
	},

	showShadow: function() {
		if (this.shadow) {
			this.shadow.hide();
			this.effect('show', this.shadow.shadow);
		}
	},

	hideShadow: function() {
		if (this.shadow)
			this.effect('hide', this.shadow.shadow);
	},

	removeShadow: function() {
		if (this.shadow)
			this.shadow.remove();
	},

	focusShadow: function() {
		if (this.shadow)
			this.shadow.focus();
	},

	blurShadow: function() {
		if (this.shadow)
			this.shadow.blur();
	},

	// Private Functions
	createWithShadow: function() {
		this.createWithoutShadow();

		this.observe('showing', this.showShadow)
        .observe('hiding', this.hideShadow)
        .observe('hidden', this.removeShadow)
        .observe('focused', this.focusShadow)
        .observe('blurred', this.blurShadow);

		if (this.options.shadow)
			this.shadow = new UI.Shadow(this.element, { theme: this.getShadowTheme() });
	},

	addElementsWithShadow: function() {
		this.addElementsWithoutShadow();
		if (this.shadow) {
			this.shadow.setBounds(this.options).render();
		}
	},

	setZIndexWithShadow: function(zIndex) {
		if (this.zIndex != zIndex) {
			if (this.shadow)
				this.shadow.setZIndex(zIndex - 1);
			this.setZIndexWithoutShadow(zIndex);
			this.zIndex = zIndex;
		}
		return this;
	},

	setPositionWithShadow: function(top, left) {
		this.setPositionWithoutShadow(top, left);
		if (this.shadow) {
			var pos = this.getPosition();
			this.shadow.setPosition(pos.top, pos.left);
		}
		return this;
	},

	setSizeWithShadow: function(width, height, innerSize) {
		this.setSizeWithoutShadow(width, height, innerSize);
		if (this.shadow) {
			var size = this.getSize();
			this.shadow.setSize(size.width, size.height);
		}
		return this;
	},

	setBoundsWithShadow: function(bounds, innerSize) {
		this.setBoundsWithoutShadow(bounds, innerSize);
		if (this.shadow)
			this.shadow.setBounds(this.getBounds());
	}
});

/*
Class: UI.WindowManager
Window Manager.
A default instance of this class is created in UI.defaultWM.

Example:
> new UI.WindowManger({
>   container: 'desktop',
>   theme: 'mac_os_x'
> });
*/

UI.WindowManager = Class.create(UI.Options, {
	options: {
		container: null, // will default to document.body
		zIndex: 0,
		theme: "alphacube",
		shadowTheme: "mac_shadow",
		showOverlay: Element.show,
		hideOverlay: Element.hide,
		positionningStrategy: function(win, area) {
			UI.WindowManager.DumbPositionningStrategy(win, area);
		}
	},

	initialize: function(options) {
		this.setOptions(options);

		this.container = $(this.options.container || document.body);

		if (this.container === $(document.body)) {
			this.viewport = document.viewport;
			this.scrollContainer = window;
		} else {
			this.viewport = this.scrollContainer = this.container;
		}

		this.container.observe('drag:started', this.onStartDrag.bind(this))
                  .observe('drag:updated', this.onDrag.bind(this))
                  .observe('drag:ended', this.onEndDrag.bind(this));

		this.stack = new UI.WindowManager.Stack();
		this.modalSessions = 0;

		this.createOverlays();
		this.resizeEvent = this.resize.bind(this);

		Event.observe(window, "resize", this.resizeEvent);
	},

	destroy: function() {
		this.windows().invoke('destroy');
		this.stack.destroy();
		Event.stopObserving(window, "resize", this.resizeEvent);
	},

	/*
	Method: setTheme
	Changes window manager's theme, all windows that don't have a own theme
	will have this new theme.

	Parameters:
	theme - theme name

	Example:
	> UI.defaultWM.setTheme('bluelighting');
	*/
	setTheme: function(theme) {
		this.stack.windows.select(function(w) {
			return !w.options.theme;
		}).invoke('setTheme', theme, true);
		this.options.theme = theme;
		return this;
	},

	register: function(win) {
		if (this.getWindow(win.id)) return;

		this.handlePosition(win);
		this.stack.add(win);
		this.restartZIndexes();
	},

	unregister: function(win) {
		this.stack.remove(win);

		if (win == this.focusedWindow)
			this.focusedWindow = null;
	},

	/*
	Method: getWindow
	Find the window containing a given element.

	Example:
	> $$('.ui-window a.close').invoke('observe', 'click', function() {
	>   UI.defaultWM.getWindow(this).close();
	> });

	Parameters:
	element - element or element identifier

	Returns:
	containing window or null
	*/
	getWindow: function(element) {
		element = $(element);

		if (!element) return;

		if (!element.hasClassName('ui-window'))
			element = element.up('.ui-window');

		var id = element.id;
		return this.stack.windows.find(function(win) { return win.id == id });
	},

	/*
	Method: windows
	Returns an array of all windows handled by this window manager.
	First one is the back window, last one is the front window.

	Example:
	> UI.defaultWM.windows().invoke('destroy');
	*/
	windows: function() {
		return this.stack.windows.clone();
	},

	/*
	Method: getFocusedWindow
	Returns the focused window
	*/
	getFocusedWindow: function() {
		return this.focusedWindow;
	},

	// INTERNAL

	// Modal mode
	startModalSession: function(win) {
		if (!this.modalSessions) {
			this.removeOverflow();
			this.modalOverlay.className = win.getTheme() + "_overlay";
			this.container.appendChild(this.modalOverlay);

			if (!this.modalOverlay.opacity)
				this.modalOverlay.opacity = this.modalOverlay.getOpacity();
			this.modalOverlay.setStyle("height: " + this.viewport.getHeight() + "px");

			this.options.showOverlay(this.modalOverlay, { from: 0, to: this.modalOverlay.opacity });
		}
		this.modalOverlay.setStyle({ zIndex: win.zIndex - 1 });
		this.modalSessions++;
	},

	endModalSession: function(win) {
		this.modalSessions--;
		if (this.modalSessions) {
			this.modalOverlay.setStyle({ zIndex: this.stack.getPreviousWindow(win).zIndex - 1 });
		} else {
			this.resetOverflow();
			this.options.hideOverlay(this.modalOverlay, { from: this.modalOverlay.opacity, to: 0 });
		}
	},

	moveHandleSelector: '.ui-window.draggable .move_handle',
	resizeHandleSelector: '.ui-window.resizable .resize_handle',

	onStartDrag: function(event) {
		var handle = event.element(),
        isMoveHandle = handle.match(this.moveHandleSelector),
        isResizeHandle = handle.match(this.resizeHandleSelector);

		// ensure dragged element is a window handle !
		if (isResizeHandle || isMoveHandle) {
			event.stop();

			// find the corresponding window
			var win = this.getWindow(event.findElement('.ui-window'));

			// render drag overlay
			this.container.insert(this.dragOverlay.setStyle({ zIndex: this.getLastZIndex() }));

			win.startDrag(handle);
			this.draggedWindow = win;
		}
	},

	onDrag: function(event) {
		if (this.draggedWindow) {
			event.stop();
			this.draggedWindow.drag(event.memo.dx, event.memo.dy);
		}
	},

	onEndDrag: function(event) {
		if (this.draggedWindow) {
			event.stop();
			this.dragOverlay.remove();
			this.draggedWindow.endDrag();
			this.draggedWindow = null;
		}
	},

	maximize: function(win) {
		this.removeOverflow();
		this.maximizedWindow = win;
		return true;
	},

	restore: function(win) {
		if (this.maximizedWindow) {
			this.resetOverflow();
			this.maximizedWindow = false;
		}
		return true;
	},

	removeOverflow: function() {
		var container = this.container;
		// Remove overflow, save overflow and scrolloffset values to restore them when restore window
		container.savedOverflow = container.style.overflow || "auto";
		container.savedOffset = this.viewport.getScrollOffset();
		container.style.overflow = "hidden";

		this.viewport.setScrollOffset({ top: 0, left: 0 });

		if (this.container == document.body && Prototype.Browser.IE)
			this.cssRule = CSS.addRule("html { overflow: hidden }");
	},

	resetOverflow: function() {
		var container = this.container;
		// Restore overflow ans scrolloffset
		if (container.savedOverflow) {
			if (this.container == document.body && Prototype.Browser.IE)
				this.cssRule.remove();

			container.style.overflow = container.savedOverflow;
			this.viewport.setScrollOffset(container.savedOffset);

			container.savedOffset = container.savedOverflow = null;
		}
	},

	hide: function(win) {
		var previous = this.stack.getPreviousWindow(win);
		if (previous) previous.focus();
	},

	restartZIndexes: function() {
		// Reset zIndex
		var zIndex = this.getZIndex() + 1; // keep a zIndex free for overlay divs
		this.stack.windows.each(function(w) {
			w.setZIndex(zIndex);
			zIndex = w.lastZIndex + 1;
		});
	},

	getLastZIndex: function() {
		return this.stack.getFrontWindow().lastZIndex + 1;
	},

	overlayStyle: "position: absolute; top: 0; left: 0; display: none; width: 100%;",

	createOverlays: function() {
		this.modalOverlay = new Element("div", { style: this.overlayStyle });
		this.dragOverlay = new Element("div", { style: this.overlayStyle + "height: 100%" });
	},

	focus: function(win) {
		// Blur the previous focused window
		if (this.focusedWindow)
			this.focusedWindow.blur();
		this.focusedWindow = win;
	},

	blur: function(win) {
		if (win == this.focusedWindow)
			this.focusedWindow = null;
	},

	setAltitude: function(win, altitude) {
		var stack = this.stack;

		if (altitude === "front") {
			if (stack.getFrontWindow() === win) return;
			stack.bringToFront(win);
		} else if (altitude === "back") {
			if (stack.getBackWindow() === win) return;
			stack.sendToBack(win);
		} else {
			if (stack.getPosition(win) == altitude) return;
			stack.setPosition(win, altitude);
		}

		this.restartZIndexes();
		return true;
	},

	getAltitude: function(win) {
		return this.stack.getPosition(win);
	},

	resize: function(event) {
		var area = this.viewport.getDimensions();

		if (this.maximizedWindow)
			this.maximizedWindow.setSize(area.width, area.height);

		if (this.modalOverlay.visible())
			this.modalOverlay.setStyle("height:" + area.height + "px");
	},

	handlePosition: function(win) {
		// window has its own position, nothing needs to be done
		if (Object.isNumber(win.options.top) && Object.isNumber(win.options.left))
			return;

		var strategy = this.options.positionningStrategy,
        area = this.viewport.getDimensions();

		Object.isFunction(strategy) ? strategy(win, area) : strategy.position(win, area);
	}
});

UI.WindowManager.DumbPositionningStrategy = function(win, area) {
	size = win.getSize();

	var top = area.height - size.height,
      left = area.width - size.width;

	top = top < 0 ? 0 : Math.random() * top;
	left = left < 0 ? 0 : Math.random() * left;

	win.setPosition(top, left);
};

UI.WindowManager.optionsAccessor('zIndex', 'theme', 'shadowTheme');

UI.WindowManager.Stack = Class.create(Enumerable, {
	initialize: function() {
		this.windows = [];
	},

	each: function(iterator) {
		this.windows.each(iterator);
	},

	add: function(win, position) {
		this.windows.splice(position || this.windows.length, 0, win);
	},

	remove: function(win) {
		this.windows = this.windows.without(win);
	},

	sendToBack: function(win) {
		this.remove(win);
		this.windows.unshift(win);
	},

	bringToFront: function(win) {
		this.remove(win);
		this.windows.push(win);
	},

	getPosition: function(win) {
		return this.windows.indexOf(win);
	},

	setPosition: function(win, position) {
		this.remove(win);
		this.windows.splice(position, 0, win);
	},

	getFrontWindow: function() {
		return this.windows.last();
	},

	getBackWindow: function() {
		return this.windows.first();
	},

	getPreviousWindow: function(win) {
		return (win == this.windows.first()) ? null : this.windows[this.windows.indexOf(win) - 1];
	}
});

document.whenReady(function() {
	UI.defaultWM = new UI.WindowManager();
});