from pylons.i18n import ugettext as _, lazy_ugettext as l_

/**

 * Autocompleter.Local

 *

 * http://digitarald.de/project/autocompleter/

 *

 * @version		1.1.2

 *

 * @license		MIT-style license

 * @author		Harald Kirschner <mail [at] digitarald.de>

 * @copyright	Author

 */

Autocompleter.Local = new Class({

	Extends: Autocompleter,

	options: {

		minLength: 0,

		delay: 200

	},

	initialize: function(element, tokens, options) {

		this.parent(element, options);

		this.tokens = tokens;

	},

	query: function() {

		this.update(this.filter());

	}

});

/**

 * Autocompleter.Request

 *

 * http://digitarald.de/project/autocompleter/

 *

 * @version		1.1.2

 *

 * @license		MIT-style license

 * @author		Harald Kirschner <mail [at] digitarald.de>

 * @copyright	Author

 */

Autocompleter.Request = new Class({

	Extends: Autocompleter,

	options: {/*

		indicator: null,

		indicatorClass: null,

		onRequest: $empty,

		onComplete: $empty,*/

		postData: {},

		ajaxOptions: {},

		postVar: 'value'

	},

	query: function(){

		var data = $unlink(this.options.postData) || {};

		data[this.options.postVar] = this.queryValue;

		var indicator = $(this.options.indicator);

		if (indicator) indicator.setStyle('display', '');

		var cls = this.options.indicatorClass;

		if (cls) this.element.addClass(cls);

		this.fireEvent('onRequest', [this.element, this.request, data, this.queryValue]);

		this.request.send({'data': data});

	},

	/**

	 * queryResponse - abstract

	 *

	 * Inherated classes have to extend this function and use this.parent()

	 */

	queryResponse: function() {

		var indicator = $(this.options.indicator);

		if (indicator) indicator.setStyle('display', 'none');

		var cls = this.options.indicatorClass;

		if (cls) this.element.removeClass(cls);

		return this.fireEvent('onComplete', [this.element, this.request]);

	}

});

Autocompleter.Request.JSON = new Class({

	Extends: Autocompleter.Request,

	initialize: function(el, url, options) {

		this.parent(el, options);

		this.request = new Request.JSON($merge({

			'url': url,

			'link': 'cancel'

		}, this.options.ajaxOptions)).addEvent('onComplete', this.queryResponse.bind(this));

	},

	queryResponse: function(response) {

		this.parent();

		this.update(response);

	}

});

Autocompleter.Request.HTML = new Class({

	Extends: Autocompleter.Request,

	initialize: function(el, url, options) {

		this.parent(el, options);

		this.request = new Request.HTML($merge({

			'url': url,

			'link': 'cancel',

			'update': this.choices

		}, this.options.ajaxOptions)).addEvent('onComplete', this.queryResponse.bind(this));

	},

	queryResponse: function(tree, elements) {

		this.parent();

		if (!elements || !elements.length) {

			this.hideChoices();

		} else {

			this.choices.getChildren(this.options.choicesMatch).each(this.options.injectChoice || function(choice) {

				var value = choice.innerHTML;

				choice.inputValue = value;

				this.addChoiceEvents(choice.set('html', this.markQueryValue(value)));

			}, this);

			this.showChoices();

		}

	}

});

/* compatibility */

Autocompleter.Ajax = {

	Base: Autocompleter.Request,

	Json: Autocompleter.Request.JSON,

	Xhtml: Autocompleter.Request.HTML

};

/**

 * Autocompleter

 *

 * http://digitarald.de/project/autocompleter/

 *

 * @version		1.1.2

 *

 * @license		MIT-style license

 * @author		Harald Kirschner <mail [at] digitarald.de>

 * @copyright	Author

 */

var Autocompleter = new Class({

	Implements: [Options, Events],

	options: {/*

		onOver: $empty,

		onSelect: $empty,

		onSelection: $empty,

		onShow: $empty,

		onHide: $empty,

		onBlur: $empty,

		onFocus: $empty,*/

		minLength: 1,

		markQuery: true,

		width: 'inherit',

		maxChoices: 10,

		injectChoice: null,

		customChoices: null,

		emptyChoices: null,

		visibleChoices: true,

		className: 'autocompleter-choices',

		zIndex: 42,

		delay: 400,

		observerOptions: {},

		fxOptions: {},

		autoSubmit: false,

		overflow: false,

		overflowMargin: 25,

		selectFirst: false,

		filter: null,

		filterCase: false,

		filterSubset: false,

		forceSelect: false,

		selectMode: true,

		choicesMatch: null,

		multiple: false,

		separator: ', ',

		separatorSplit: /\s*[,;]\s*/,

		autoTrim: false,

		allowDupes: false,

		cache: true,

		relative: false

	},

	initialize: function(element, options) {

		this.element = $(element);

		this.setOptions(options);

		this.build();

		this.observer = new Observer(this.element, this.prefetch.bind(this), $merge({

			'delay': this.options.delay

		}, this.options.observerOptions));

		this.queryValue = null;

		if (this.options.filter) this.filter = this.options.filter.bind(this);

		var mode = this.options.selectMode;

		this.typeAhead = (mode == 'type-ahead');

		this.selectMode = (mode === true) ? 'selection' : mode;

		this.cached = [];

	},

	/**

	 * build - Initialize DOM

	 *

	 * Builds the html structure for choices and appends the events to the element.

	 * Override this function to modify the html generation.

	 */

	build: function() {

		if ($(this.options.customChoices)) {

			this.choices = this.options.customChoices;

		} else {

			this.choices = new Element('ul', {

				'class': this.options.className,

				'styles': {

					'zIndex': this.options.zIndex

				}

			}).inject(document.body);

			this.relative = false;

			if (this.options.relative) {

				this.choices.inject(this.element, 'after');

				this.relative = this.element.getOffsetParent();

			}

			this.fix = new OverlayFix(this.choices);

		}

		if (!this.options.separator.test(this.options.separatorSplit)) {

			this.options.separatorSplit = this.options.separator;

		}

		this.fx = (!this.options.fxOptions) ? null : new Fx.Tween(this.choices, $merge({

			'property': 'opacity',

			'link': 'cancel',

			'duration': 200

		}, this.options.fxOptions)).addEvent('onStart', Chain.prototype.clearChain).set(0);

		this.element.setProperty('autocomplete', 'off')

			.addEvent((Browser.Engine.trident || Browser.Engine.webkit) ? 'keydown' : 'keypress', this.onCommand.bind(this))

			.addEvent('click', this.onCommand.bind(this, [false]))

			.addEvent('focus', this.toggleFocus.create({bind: this, arguments: true, delay: 100}))

			.addEvent('blur', this.toggleFocus.create({bind: this, arguments: false, delay: 100}));

	},

	destroy: function() {

		if (this.fix) this.fix.destroy();

		this.choices = this.selected = this.choices.destroy();

	},

	toggleFocus: function(state) {

		this.focussed = state;

		if (!state) this.hideChoices(true);

		this.fireEvent((state) ? 'onFocus' : 'onBlur', [this.element]);

	},

	onCommand: function(e) {

		if (!e && this.focussed) return this.prefetch();

		if (e && e.key && !e.shift) {

			switch (e.key) {

				case 'enter':

					if (this.element.value != this.opted) return true;

					if (this.selected && this.visible) {

						this.choiceSelect(this.selected);

						return !!(this.options.autoSubmit);

					}

					break;

				case 'up': case 'down':

					if (!this.prefetch() && this.queryValue !== null) {

						var up = (e.key == 'up');

						this.choiceOver((this.selected || this.choices)[

							(this.selected) ? ((up) ? 'getPrevious' : 'getNext') : ((up) ? 'getLast' : 'getFirst')

						](this.options.choicesMatch), true);

					}

					return false;

				case 'esc': case 'tab':

					this.hideChoices(true);

					break;

			}

		}

		return true;

	},

	setSelection: function(finish) {

		var input = this.selected.inputValue, value = input;

		var start = this.queryValue.length, end = input.length;

		if (input.substr(0, start).toLowerCase() != this.queryValue.toLowerCase()) start = 0;

		if (this.options.multiple) {

			var split = this.options.separatorSplit;

			value = this.element.value;

			start += this.queryIndex;

			end += this.queryIndex;

			var old = value.substr(this.queryIndex).split(split, 1)[0];

			value = value.substr(0, this.queryIndex) + input + value.substr(this.queryIndex + old.length);

			if (finish) {

				var tokens = value.split(this.options.separatorSplit).filter(function(entry) {

					return this.test(entry);

				}, /[^\s,]+/);

				if (!this.options.allowDupes) tokens = [].combine(tokens);

				var sep = this.options.separator;

				value = tokens.join(sep) + sep;

				end = value.length;

			}

		}

		this.observer.setValue(value);

		this.opted = value;

		if (finish || this.selectMode == 'pick') start = end;

		this.element.selectRange(start, end);

		this.fireEvent('onSelection', [this.element, this.selected, value, input]);

	},

	showChoices: function() {

		var match = this.options.choicesMatch, first = this.choices.getFirst(match);

		this.selected = this.selectedValue = null;

		if (this.fix) {

			var pos = this.element.getCoordinates(this.relative), width = this.options.width || 'auto';

			this.choices.setStyles({

				'left': pos.left,

				'top': pos.bottom,

				'width': (width === true || width == 'inherit') ? pos.width : width

			});

		}

		if (!first) return;

		if (!this.visible) {

			this.visible = true;

			this.choices.setStyle('display', '');

			if (this.fx) this.fx.start(1);

			this.fireEvent('onShow', [this.element, this.choices]);

		}

		if (this.options.selectFirst || this.typeAhead || first.inputValue == this.queryValue) this.choiceOver(first, this.typeAhead);

		var items = this.choices.getChildren(match), max = this.options.maxChoices;

		var styles = {'overflowY': 'hidden', 'height': ''};

		this.overflown = false;

		if (items.length > max) {

			var item = items[max - 1];

			styles.overflowY = 'scroll';

			styles.height = item.getCoordinates(this.choices).bottom;

			this.overflown = true;

		};

		this.choices.setStyles(styles);

		this.fix.show();

		if (this.options.visibleChoices) {

			var scroll = document.getScroll(),

			size = document.getSize(),

			coords = this.choices.getCoordinates();

			if (coords.right > scroll.x + size.x) scroll.x = coords.right - size.x;

			if (coords.bottom > scroll.y + size.y) scroll.y = coords.bottom - size.y;

			window.scrollTo(Math.min(scroll.x, coords.left), Math.min(scroll.y, coords.top));

		}

	},

	hideChoices: function(clear) {

		if (clear) {

			var value = this.element.value;

			if (this.options.forceSelect) value = this.opted;

			if (this.options.autoTrim) {

				value = value.split(this.options.separatorSplit).filter($arguments(0)).join(this.options.separator);

			}

			this.observer.setValue(value);

		}

		if (!this.visible) return;

		this.visible = false;

		if (this.selected) this.selected.removeClass('autocompleter-selected');

		this.observer.clear();

		var hide = function(){

			this.choices.setStyle('display', 'none');

			this.fix.hide();

		}.bind(this);

		if (this.fx) this.fx.start(0).chain(hide);

		else hide();

		this.fireEvent('onHide', [this.element, this.choices]);

	},

	prefetch: function() {

		var value = this.element.value, query = value;

		if (this.options.multiple) {

			var split = this.options.separatorSplit;

			var values = value.split(split);

			var index = this.element.getSelectedRange().start;

			var toIndex = value.substr(0, index).split(split);

			var last = toIndex.length - 1;

			index -= toIndex[last].length;

			query = values[last];

		}

		if (query.length < this.options.minLength) {

			this.hideChoices();

		} else {

			if (query === this.queryValue || (this.visible && query == this.selectedValue)) {

				if (this.visible) return false;

				this.showChoices();

			} else {

				this.queryValue = query;

				this.queryIndex = index;

				if (!this.fetchCached()) this.query();

			}

		}

		return true;

	},

	fetchCached: function() {

		return false;

		if (!this.options.cache

			|| !this.cached

			|| !this.cached.length

			|| this.cached.length >= this.options.maxChoices

			|| this.queryValue) return false;

		this.update(this.filter(this.cached));

		return true;

	},

	update: function(tokens) {

		this.choices.empty();

		this.cached = tokens;

		var type = tokens && $type(tokens);

		if (!type || (type == 'array' && !tokens.length) || (type == 'hash' && !tokens.getLength())) {

			(this.options.emptyChoices || this.hideChoices).call(this);

		} else {

			if (this.options.maxChoices < tokens.length && !this.options.overflow) tokens.length = this.options.maxChoices;

			tokens.each(this.options.injectChoice || function(token){

				var choice = new Element('li', {'html': this.markQueryValue(token)});

				choice.inputValue = token;

				this.addChoiceEvents(choice).inject(this.choices);

			}, this);

			this.showChoices();

		}

	},

	choiceOver: function(choice, selection) {

		if (!choice || choice == this.selected) return;

		if (this.selected) this.selected.removeClass('autocompleter-selected');

		this.selected = choice.addClass('autocompleter-selected');

		this.fireEvent('onSelect', [this.element, this.selected, selection]);

		if (!this.selectMode) this.opted = this.element.value;

		if (!selection) return;

		this.selectedValue = this.selected.inputValue;

		if (this.overflown) {

			var coords = this.selected.getCoordinates(this.choices), margin = this.options.overflowMargin,

				top = this.choices.scrollTop, height = this.choices.offsetHeight, bottom = top + height;

			if (coords.top - margin < top && top) this.choices.scrollTop = Math.max(coords.top - margin, 0);

			else if (coords.bottom + margin > bottom) this.choices.scrollTop = Math.min(coords.bottom - height + margin, bottom);

		}

		if (this.selectMode) this.setSelection();

	},

	choiceSelect: function(choice) {

		if (choice) this.choiceOver(choice);

		this.setSelection(true);

		this.queryValue = false;

		this.hideChoices();

	},

	filter: function(tokens) {

		return (tokens || this.tokens).filter(function(token) {

			return this.test(token);

		}, new RegExp(((this.options.filterSubset) ? '' : '^') + this.queryValue.escapeRegExp(), (this.options.filterCase) ? '' : 'i'));

	},

	/**

	 * markQueryValue

	 *

	 * Marks the queried word in the given string with <span class="autocompleter-queried">*</span>

	 * Call this i.e. from your custom parseChoices, same for addChoiceEvents

	 *

	 * @param		{String} Text

	 * @return		{String} Text

	 */

	markQueryValue: function(str) {

		return (!this.options.markQuery || !this.queryValue) ? str

			: str.replace(new RegExp('(' + ((this.options.filterSubset) ? '' : '^') + this.queryValue.escapeRegExp() + ')', (this.options.filterCase) ? '' : 'i'), '<span class="autocompleter-queried">$1</span>');

	},

	/**

	 * addChoiceEvents

	 *

	 * Appends the needed event handlers for a choice-entry to the given element.

	 *

	 * @param		{Element} Choice entry

	 * @return		{Element} Choice entry

	 */

	addChoiceEvents: function(el) {

		return el.addEvents({

			'mouseover': this.choiceOver.bind(this, [el]),

			'click': this.choiceSelect.bind(this, [el])

		});

	}

});

var OverlayFix = new Class({

	initialize: function(el) {

		if (Browser.Engine.trident) {

			this.element = $(el);

			this.relative = this.element.getOffsetParent();

			this.fix = new Element('iframe', {

				'frameborder': '0',

				'scrolling': 'no',

				'src': 'javascript:false;',

				'styles': {

					'position': 'absolute',

					'border': 'none',

					'display': 'none',

					'filter': 'progid:DXImageTransform.Microsoft.Alpha(opacity=0)'

				}

			}).inject(this.element, 'after');

		}

	},

	show: function() {

		if (this.fix) {

			var coords = this.element.getCoordinates(this.relative);

			delete coords.right;

			delete coords.bottom;

			this.fix.setStyles($extend(coords, {

				'display': '',

				'zIndex': (this.element.getStyle('zIndex') || 1) - 1

			}));

		}

		return this;

	},

	hide: function() {

		if (this.fix) this.fix.setStyle('display', 'none');

		return this;

	},

	destroy: function() {

		if (this.fix) this.fix = this.fix.destroy();

	}

});

Element.implement({

	getSelectedRange: function() {

		if (!Browser.Engine.trident) return {start: this.selectionStart, end: this.selectionEnd};

		var pos = {start: 0, end: 0};

		var range = this.getDocument().selection.createRange();

		if (!range || range.parentElement() != this) return pos;

		var dup = range.duplicate();

		if (this.type == 'text') {

			pos.start = 0 - dup.moveStart('character', -100000);

			pos.end = pos.start + range.text.length;

		} else {

			var value = this.value;

			var offset = value.length - value.match(/[\n\r]*$/)[0].length;

			dup.moveToElementText(this);

			dup.setEndPoint('StartToEnd', range);

			pos.end = offset - dup.text.length;

			dup.setEndPoint('StartToStart', range);

			pos.start = offset - dup.text.length;

		}

		return pos;

	},

	selectRange: function(start, end) {

		if (Browser.Engine.trident) {

			var diff = this.value.substr(start, end - start).replace(/\r/g, '').length;

			start = this.value.substr(0, start).replace(/\r/g, '').length;

			var range = this.createTextRange();

			range.collapse(true);

			range.moveEnd('character', start + diff);

			range.moveStart('character', start);

			range.select();

		} else {

			this.focus();

			this.setSelectionRange(start, end);

		}

		return this;

	}

});

/* compatibility */

Autocompleter.Base = Autocompleter;

/**

 * Observer - Observe formelements for changes

 *

 * - Additional code from clientside.cnet.com

 *

 * @version		1.1

 *

 * @license		MIT-style license

 * @author		Harald Kirschner <mail [at] digitarald.de>

 * @copyright	Author

 */

var Observer = new Class({

	Implements: [Options, Events],

	options: {

		periodical: false,

		delay: 1000

	},

	initialize: function(el, onFired, options){

		this.element = $(el) || $$(el);

		this.addEvent('onFired', onFired);

		this.setOptions(options);

		this.bound = this.changed.bind(this);

		this.resume();

	},

	changed: function() {

		var value = this.element.get('value');

		if ($equals(this.value, value)) return;

		this.clear();

		this.value = value;

		this.timeout = this.onFired.delay(this.options.delay, this);

	},

	setValue: function(value) {

		this.value = value;

		this.element.set('value', value);

		return this.clear();

	},

	onFired: function() {

		this.fireEvent('onFired', [this.value, this.element]);

	},

	clear: function() {

		$clear(this.timeout || null);

		return this;

	},

	pause: function(){

		if (this.timer) $clear(this.timer);

		else this.element.removeEvent('keyup', this.bound);

		return this.clear();

	},

	resume: function(){

		this.value = this.element.get('value');

		if (this.options.periodical) this.timer = this.changed.periodical(this.options.periodical, this);

		else this.element.addEvent('keyup', this.bound);

		return this;

	}

});

var $equals = function(obj1, obj2) {

	return (obj1 == obj2 || JSON.encode(obj1) == JSON.encode(obj2));

};

Autocompleter.Request.VigiloJSON = new Class({

    Extends: Autocompleter.Request,

    options: {

        resVar: 'results'

    },

    initialize: function(el, url, options) {

        this.parent(el, options);

        this.request = new Request.JSON($merge({

            'url': url,

            'link': 'cancel'

        }, this.options.ajaxOptions)).addEvent('onComplete', this.queryResponse.bind(this));

    },

    queryResponse: function(response) {

        this.parent();

        this.update(response[this.options.resVar]);

    }

});

/******************************************************************************

 * MooTools 1.2.2

 * Copyright (c) 2006-2007 [Valerio Proietti](http://mad4milk.net/).

 * MooTools is distributed under an MIT-style license.

 ******************************************************************************

 * reset.css - Copyright (c) 2006, Yahoo! Inc. All rights reserved.

 * Code licensed under the BSD License: http://developer.yahoo.net/yui/license.txt

 ******************************************************************************

 * Jx UI Library, 2.0.1

 * Copyright (c) 2006-2008, DM Solutions Group Inc. All rights reserved.

 *

 * Permission is hereby granted, free of charge, to any person obtaining a

 * copy of this software and associated documentation files (the "Software"),

 * to deal in the Software without restriction, including without limitation

 * the rights to use, copy, modify, merge, publish, distribute, sublicense,

 * and/or sell copies of the Software, and to permit persons to whom the

 * Software is furnished to do so, subject to the following conditions:

 *

 * The above copyright notice and this permission notice shall be included

 * in all copies or substantial portions of the Software.

 *

 * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR

 * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,

 * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.  IN NO EVENT SHALL

 * THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER

 * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING

 * FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER

 * DEALINGS IN THE SOFTWARE.

 *****************************************************************************/

// $Id: common.js 423 2009-05-12 12:37:56Z pagameba $

/**

 * Class: Jx

 * Jx is a global singleton object that contains the entire Jx library

 * within it.  All Jx functions, attributes and classes are accessed

 * through the global Jx object.  Jx should not create any other

 * global variables, if you discover that it does then please report

 * it as a bug

 *

 * License: 

 * Copyright (c) 2008, DM Solutions Group Inc.

 * 

 * This file is licensed under an MIT style license

 */

/* firebug console supressor for IE/Safari/Opera */

window.addEvent('load', function() {

    if (!("console" in window) || !("firebug" in window.console)) {

        var names = ["log", "debug", "info", "warn", "error", "assert", "dir", "dirxml",

        "group", "groupEnd", "time", "timeEnd", "count", "trace", "profile", "profileEnd"];

        window.console = {};

        for (var i = 0; i < names.length; ++i) {

            window.console[names[i]] = function() {};

        }

    }

});

/* inspired by extjs, apparently removes css image flicker and related problems in IE 6 */

/* This is already done in mootools Source/Core/Browser.js  KASI*/

/*

(function() {

    var ua = navigator.userAgent.toLowerCase();

    var isIE = ua.indexOf("msie") > -1,

        isIE7 = ua.indexOf("msie 7") > -1;

    if(isIE && !isIE7) {

        try {

            document.execCommand("BackgroundImageCache", false, true);

        } catch(e) {}

    }    

})();

*/

Class.Mutators.Family = function(self,name) {

    if ($defined(name)){

        self.$family = {'name': name};

        $[name] = $.object;

        return self;

    }

    else {

        this.implement('$family',{'name':self});

    }

};

/* Setup global namespace

 * If jxcore is loaded by jx.js, then the namespace and baseURL are

 * already established

 */

if (typeof Jx == 'undefined') {

    var Jx = {};

    (function() {

        var aScripts = document.getElementsByTagName('SCRIPT');

        for (var i=0; i<aScripts.length; i++) {

            var s = aScripts[i].src;

            var matches = /(.*[jx|js|lib])\/jxlib(.*)/.exec(s);

            if (matches && matches[0]) {

                /**

                 * Property: {String} baseURL

                 * This is the URL that Jx was loaded from, it is 

                 * automatically calculated from the script tag

                 * src property that included Jx.

                 *

                 * Note that this assumes that you are loading Jx

                 * from a js/ or lib/ folder in parallel to the

                 * images/ folder that contains the various images

                 * needed by Jx components.  If you have a different

                 * folder structure, you can define Jx's base

                 * by including the following before including

                 * the jxlib javascript file:

                 *

                 * (code)

                 * Jx = {

                 *    baseURL: 'some/path'

                 * }

                 * (end)

                 */ 

                 Jx.aPixel = document.createElement('img', {alt:'',title:''});

                 Jx.aPixel.src = matches[1]+'/a_pixel.png';

                 Jx.baseURL = Jx.aPixel.src.substring(0,

                     Jx.aPixel.src.indexOf('a_pixel.png'));

            }

        }

       /**

        * Determine if we're running in Adobe AIR. If so, determine which sandbox we're in

        */

        var src = aScripts[0].src;

        if (src.contains('app:')){

            Jx.isAir = true;

        } else {

            Jx.isAir = false;

        }

    })();

} 

/**

 * Method: applyPNGFilter

 *

 * Static method that applies the PNG Filter Hack for IE browsers

 * when showing 24bit PNG's.  Used automatically for img tags with

 * a class of png24.

 *

 * The filter is applied using a nifty feature of IE that allows javascript to

 * be executed as part of a CSS style rule - this ensures that the hack only

 * gets applied on IE browsers.

 *

 * The CSS that triggers this hack is only in the ie6.css files of the various

 * themes.

 *

 * Parameters:

 * object {Object} the object (img) to which the filter needs to be applied.

 */

Jx.applyPNGFilter = function(o)  {

   var t=Jx.aPixel.src;

   if( o.src != t ) {

       var s=o.src;

       o.src = t;

       o.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='"+s+"',sizingMethod='scale')";

   }

};

Jx.imgQueue = [];   //The queue of images to be loaded

Jx.imgLoaded = {};  //a hash table of images that have been loaded and cached

Jx.imagesLoading = 0; //counter for number of concurrent image loads 

/**

 * Method: addToImgQueue

 * Request that an image be set to a DOM IMG element src attribute.  This puts 

 * the image into a queue and there are private methods to manage that queue

 * and limit image loading to 2 at a time.

 *

 * Parameters:

 * obj - {Object} an object containing an element and src

 * property, where element is the element to update and src

 * is the url to the image.

 */

Jx.addToImgQueue = function(obj) {

    if (Jx.imgLoaded[obj.src]) {

        //if this image was already requested (i.e. it's in cache) just set it directly

        obj.element.src = obj.src;

    } else {

        //otherwise stick it in the queue

        Jx.imgQueue.push(obj);

        Jx.imgLoaded[obj.src] = true;

    }

    //start the queue management process

    Jx.checkImgQueue();

};

/**

 * Method: checkImgQueue

 *

 * An internal method that ensures no more than 2 images are loading at a time.

 */

Jx.checkImgQueue = function() {

    while (Jx.imagesLoading < 2 && Jx.imgQueue.length > 0) {

        Jx.loadNextImg();

    }

};

/**

 * Method: loadNextImg

 *

 * An internal method actually populate the DOM element with the image source.

 */

Jx.loadNextImg = function() {

    var obj = Jx.imgQueue.shift();

    if (obj) {

        ++Jx.imagesLoading;

        obj.element.onload = function(){--Jx.imagesLoading; Jx.checkImgQueue();};

        obj.element.onerror = function(){--Jx.imagesLoading; Jx.checkImgQueue();};

        obj.element.src = obj.src;

    }

};

/**

 * Method: createIframeShim

 * Creates a new iframe element that is intended to fill a container

 * to mask out other operating system controls (scrollbars, inputs, 

 * buttons, etc) when HTML elements are supposed to be above them.

 *

 * Returns:

 * an HTML iframe element that can be inserted into the DOM.

 */

Jx.createIframeShim = function() {

    return new Element('iframe', {

        'class':'jxIframeShim',

        'scrolling':'no',

        'frameborder':0

    });

};

/**

 * Method: getNumber

 * safely parse a number and return its integer value.  A NaN value 

 * returns 0.  CSS size values are also parsed correctly.

 *

 * Parameters: 

 * n - {Mixed} the string or object to parse.

 *

 * Returns:

 * {Integer} the integer value that the parameter represents

 */

Jx.getNumber = function(n, def) {

  var result = n===null||isNaN(parseInt(n,10))?(def||0):parseInt(n,10);

  return result;

}

/**

 * Method: getPageDimensions

 * return the dimensions of the browser client area.

 *

 * Returns:

 * {Object} an object containing a width and height property 

 * that represent the width and height of the browser client area.

 */

Jx.getPageDimensions = function() {

    return {width: window.getWidth(), height: window.getHeight()};

}

/**

 * Class: Element

 *

 * Element is a global object provided by the mootools library.  The

 * functions documented here are extensions to the Element object provided

 * by Jx to make cross-browser compatibility easier to achieve.  Most of the

 * methods are measurement related.

 *

 * While the code in these methods has been converted to use MooTools methods,

 * there may be better MooTools methods to use to accomplish these things.

 * Ultimately, it would be nice to eliminate most or all of these and find the

 * MooTools equivalent or convince MooTools to add them.

 */

Element.implement({

    /**

     * Method: getBoxSizing

     * return the box sizing of an element, one of 'content-box' or 

     *'border-box'.

     *

     * Parameters: 

     * elem - {Object} the element to get the box sizing of.

     *

     * Returns:

     * {String} the box sizing of the element.

     */

    getBoxSizing : function() {

      var result = 'content-box';

      if (Browser.Engine.trident || Browser.Engine.presto) { 

          var cm = document["compatMode"];

          if (cm == "BackCompat" || cm == "QuirksMode") { 

              result = 'border-box'; 

          } else {

              result = 'content-box'; 

        }

      } else {

          if (arguments.length === 0) {

              node = document.documentElement; 

          }

          var sizing = this.getStyle("-moz-box-sizing");

          if (!sizing) { 

              sizing = this.getStyle("box-sizing"); 

          }

          result = (sizing ? sizing : 'content-box');

      }

      return result;

    },

    /**

     * Method: getContentBoxSize

     * return the size of the content area of an element.  This is the size of

     * the element less margins, padding, and borders.

     *

     * Parameters: 

     * elem - {Object} the element to get the content size of.

     *

     * Returns:

     * {Object} an object with two properties, width and height, that

     * are the size of the content area of the measured element.

     */

    getContentBoxSize : function() {

      var w = this.offsetWidth;

      var h = this.offsetHeight;

      var padding = this.getPaddingSize();

      var border = this.getBorderSize();

      w = w - padding.left - padding.right - border.left - border.right;

      h = h - padding.bottom - padding.top - border.bottom - border.top;

      return {width: w, height: h};

    },

    /**

     * Method: getBorderBoxSize

     * return the size of the border area of an element.  This is the size of

     * the element less margins.

     *

     * Parameters: 

     * elem - {Object} the element to get the border sizing of.

     *

     * Returns:

     * {Object} an object with two properties, width and height, that

     * are the size of the border area of the measured element.

     */

    getBorderBoxSize: function() {

      var w = this.offsetWidth;

      var h = this.offsetHeight;

      return {width: w, height: h}; 

    },

    /**

     * Method: getMarginBoxSize

     * return the size of the margin area of an element.  This is the size of

     * the element plus margins.

     *

     * Parameters: 

     * elem - {Object} the element to get the margin sizing of.

     *

     * Returns:

     * {Object} an object with two properties, width and height, that

     * are the size of the margin area of the measured element.

     */

    getMarginBoxSize: function() {

        var margins = this.getMarginSize();

        var w = this.offsetWidth + margins.left + margins.right;

        var h = this.offsetHeight + margins.top + margins.bottom;

        return {width: w, height: h};

    },

    /**

     * Method: setContentBoxSize

     * set either or both of the width and height of an element to

     * the provided size.  This function ensures that the content

     * area of the element is the requested size and the resulting

     * size of the element may be larger depending on padding and

     * borders.

     *

     * Parameters: 

     * elem - {Object} the element to set the content area of.

     * size - {Object} an object with a width and/or height property that is the size to set

     * the content area of the element to.

     */

    setContentBoxSize : function(size) {

        if (this.getBoxSizing() == 'border-box') {

            var padding = this.getPaddingSize();

            var border = this.getBorderSize();

            if (typeof size.width != 'undefined') {

                var width = (size.width + padding.left + padding.right + border.left + border.right);

                if (width < 0) {

                    width = 0;

                }

                this.style.width = width + 'px';

            }

            if (typeof size.height != 'undefined') {

                var height = (size.height + padding.top + padding.bottom + border.top + border.bottom);

                if (height < 0) {

                    height = 0;

                }

                this.style.height = height + 'px';

            }

        } else {

            if (typeof size.width != 'undefined') {

                this.style.width = size.width + 'px';

            }

            if (typeof size.height != 'undefined') {

                this.style.height = size.height + 'px';

            }

        }

    },

    /**

     * Method: setBorderBoxSize

     * set either or both of the width and height of an element to

     * the provided size.  This function ensures that the border

     * size of the element is the requested size and the resulting

     * content areaof the element may be larger depending on padding and

     * borders.

     *

     * Parameters: 

     * elem - {Object} the element to set the border size of.

     * size - {Object} an object with a width and/or height property that is the size to set

     * the content area of the element to.

     */

    setBorderBoxSize : function(size) {

      if (this.getBoxSizing() == 'content-box') {

        var padding = this.getPaddingSize();

        var border = this.getBorderSize();

        var margin = this.getMarginSize();

        if (typeof size.width != 'undefined') {

          var width = (size.width - padding.left - padding.right - border.left - border.right - margin.left - margin.right);

          if (width < 0) {

            width = 0;

          }

          this.style.width = width + 'px';

        }

        if (typeof size.height != 'undefined') {

          var height = (size.height - padding.top - padding.bottom - border.top - border.bottom - margin.top - margin.bottom);

          if (height < 0) {

            height = 0;

          }

          this.style.height = height + 'px';

        }

      } else {

        if (typeof size.width != 'undefined' && size.width >= 0) {

          this.style.width = size.width + 'px';

        }

        if (typeof size.height != 'undefined' && size.height >= 0) {

          this.style.height = size.height + 'px';

        }

      }

    },

    /**

     * Method: getPaddingSize

     * returns the padding for each edge of an element

     *

     * Parameters: 

     * elem - {Object} The element to get the padding for.

     *

     * Returns:

     * {Object} an object with properties left, top, right and bottom

     * that contain the associated padding values.

     */

    getPaddingSize : function () {

      var l = Jx.getNumber(this.getStyle('padding-left'));

      var t = Jx.getNumber(this.getStyle('padding-top'));

      var r = Jx.getNumber(this.getStyle('padding-right'));

      var b = Jx.getNumber(this.getStyle('padding-bottom'));

      return {left:l, top:t, right: r, bottom: b};

    },

    /**

     * Method: getBorderSize

     * returns the border size for each edge of an element

     *

     * Parameters: 

     * elem - {Object} The element to get the borders for.

     *

     * Returns:

     * {Object} an object with properties left, top, right and bottom

     * that contain the associated border values.

     */

    getBorderSize : function() {

      var l = Jx.getNumber(this.getStyle('border-left-width'));

      var t = Jx.getNumber(this.getStyle('border-top-width'));

      var r = Jx.getNumber(this.getStyle('border-right-width'));

      var b = Jx.getNumber(this.getStyle('border-bottom-width'));

      return {left:l, top:t, right: r, bottom: b};

    },

    /**

     * Method: getMarginSize

     * returns the margin size for each edge of an element

     *

     * Parameters: 

     * elem - {Object} The element to get the margins for.

     *

     * Returns:

     *: {Object} an object with properties left, top, right and bottom

     * that contain the associated margin values.

     */

    getMarginSize : function() {

      var l = Jx.getNumber(this.getStyle('margin-left'));

      var t = Jx.getNumber(this.getStyle('margin-top'));

      var r = Jx.getNumber(this.getStyle('margin-right'));

      var b = Jx.getNumber(this.getStyle('margin-bottom'));

      return {left:l, top:t, right: r, bottom: b};

    },

    /**

     * Method: descendantOf

     * determines if the element is a descendent of the reference node.

     *

     * Parameters:

     * node - {HTMLElement} the reference node

     *

     * Returns:

     * {Boolean} true if the element is a descendent, false otherwise.

     */

    descendantOf: function(node) {

        var parent = $(this.parentNode);

        while (parent != node && parent && parent.parentNode && parent.parentNode != parent) {

            parent = $(parent.parentNode);

        }

        return parent == node;

    },

    /**

     * Method: findElement