/* image preloader */
var Asset = {
	// for one image
	image: function(source, properties){
		properties = $merge({
			onload: $empty,
			onabort: $empty,
			onerror: $empty
		}, properties);
		var image = new Image();
		var element = document.id(image) || new Element('img');
		['load', 'abort', 'error'].each(function(name){
			var type = 'on' + name;
			var event = properties[type];
			delete properties[type];
			image[type] = function(){
				if (!image) return;
				if (!element.parentNode){
					element.width = image.width;
					element.height = image.height;
				}
				image = image.onload = image.onabort = image.onerror = null;
				event.delay(1, element, element);
				element.fireEvent(name, element, 1);
			};
		});
		image.src = element.src = source;
		if (image && image.complete) image.onload.delay(1);
		return element.set(properties);
	},
	// for multiple images
	images: function(sources, options){
		options = $merge({
			onComplete: $empty,
			onProgress: $empty,
			onError: $empty,
			properties: {}
		}, options);
		sources = $splat(sources);
		var images = [];
		var counter = 0;
		return new Elements(sources.map(function(source){
			return Asset.image(source, $extend(options.properties, {
				onload: function(){
					options.onProgress.call(this, counter, sources.indexOf(source));
					counter++;
					if (counter == sources.length) options.onComplete();
				},
				onerror: function(){
					options.onError.call(this, counter, sources.indexOf(source));
					counter++;
					if (counter == sources.length) options.onComplete();
				}
			}));
		}));
	}

};




/*
	Common methods and variables
*/
Browser.Engine.ie6 = (function(){
	if( Browser.Engine.trident && Browser.Engine.version<=4)
		return true;
	else
		return false;
})();
var Engine = Browser.Engine;

// popup element object
window.Popup = new Element('div', {
	'class': 'ui-popup',
	'html': '<div class="s t">&nbsp;</div>' + 
			'<div class="s b">&nbsp;</div>' + 
			'<div class="s l">&nbsp;</div>' + 
			'<div class="s r">&nbsp;</div>' + 
			'<div class="s tl">&nbsp;</div>' + 
			'<div class="s tr">&nbsp;</div>' + 
			'<div class="s bl">&nbsp;</div>' + 
			'<div class="s br">&nbsp;</div>' +
			'<a>&nbsp;</a>'
	}
);

// method shows popup window with aimed image
window.Popup.show = function(elem){
	// Try to show popup with embedded element, if it passed
	if (elem) {
		this.hide();
		this.content = new Element('div', {
			'class': 'ui-popup-content'
			}
		).inject(this, 'bottom');
		elem.inject(this.content, 'bottom');
		this
			.inject(document.body, 'bottom')
			.fade('hide').fade('in')
			.setStyles({
				'margin-left': -this.getSize().x/2,
				'top': document.getScroll().y + 80 + 'px'
			});
		this.loupe = {
			src: '/img/_/bg.loupe.png',
			x: 140,
			y: 142,
			radius: 120
		}
		this.louper = new Louper(elem, {
			radius: 120,
			loupe: this.loupe
		});
		this.getElements('a').addEvent('click', this.hide.bind(this));
	}
	// returns Popup object anyway
	return this;
}

// method hides popup window
window.Popup.hide = function(){
	if (this.content) this.content.destroy();
	this.dispose();
	return this;
}




/* 
	Implements section
*/
Element.implement({
	// method works with inputs default VALUE
	resetValue: function(){
		this.addEvents({
			'focus': function(){
				if( this.get('value') === this.retrieve('defaultValue'))
					this.set('value', '');
				return false;
			},
			'blur': function(){
				if( this.get('value') === '')
					this.set('value', this.retrieve('defaultValue'));
				return false;
			}
		});
		return this;
	}
});