/*
 * 	Ajax.ImagePreview (c)2007
 *  A. Karasev 
 * 	Used: prototype.js
*/

if(typeof window.Ajax.ImagePreview == 'undefined'){
	
	var previewDivTeplate = new Template('<div class="#{previewDivStyleClass}" id="#{previewDivId}"></div>');
	
	Ajax.Cache = {
		data: $H({}),
		
		get: function(key){
			if(typeof this.data[key] != 'undefined'){
				return this.data[key];
			}
			
			throw "No cache entry found";
		},
		
		put: function(key, value){
			this.data[key] = value;
		},				
		
		onComplete: function(request, transport, json){
			if(request.success()){
				this.put(request.url, transport.responseText);
			} else {
				this.put(request.url, false);
			}
		}
	};
	
	// Register Ajax.Cache as ajax response listener
	Ajax.Responders.register(Ajax.Cache);
	
		
	Ajax.ImagePreview = Class.create();
	
	Ajax.ImagePreview.prototype = {
		popupTimer: null,
		options: {},
	
		initialize:function(options){
			this.options = {
				marker: 'a.popup',
				previewDivId: '_imagePreview',
				previewDivStyleClass: 'imagePreview',
				tipsUrlPrefix: '/tips',
				onComplete: function(transport){
					var previewDiv = $(this.options.previewDivId);
					if(!previewDiv.empty()) {
						previewDiv.show();
					}
				}.bind(this)
			};
			
			Object.extend(this.options, options || {});

			this.doImagePreviewHandler = function(event){
				var element = $(Event.element(event));
				var href = element.href || element.up(this.options.marker).href || false;

				if(href){
					this.popupTimer = new PeriodicalExecuter(function(pe) {
						this.doImagePreview(element, href);
						pe.stop();
					}.bind(this), 1);
				}
			}.bind(this);
			
			this.stopImagePreviewHandler = function(event){
				if(this.popupTimer) {
					this.popupTimer.stop();
				}
				
				var imagePreview = $(this.options.previewDivId);
				if(imagePreview) {
					Element.hide(imagePreview);
				}
			}.bind(this);			
						
			
			$$(this.options.marker).each(function(element){				
				Event.observe(element, 'mouseover', this.doImagePreviewHandler);				
				Event.observe(element, 'mouseout', this.stopImagePreviewHandler);
			}.bind(this));
		},
	
		doImagePreview: function(element, url) {
			var previewDiv = this.getImagePreviewDiv(element);
			var previewUrl = this.getUrl(url);
			
			try {
				var cachedValue = Ajax.Cache.get(previewUrl);
				if(cachedValue && cachedValue != "") {
					previewDiv.update(cachedValue);
					previewDiv.show();
				}						
			} catch(err) {
				new Ajax.Updater(
					{success: this.getImagePreviewDiv(element)}, 
					previewUrl,
					this.options
				);
			}
		}, 
		
		getImagePreviewDiv: function(element){
			var imagePreview = $(this.options.previewDivId);
			
			if (!imagePreview) {
				 new Insertion.Bottom(document.body, previewDivTeplate.evaluate(this.options));
				 imagePreview = $(this.options.previewDivId).hide();
			}
			
			Position.clone(element, imagePreview, {
				setLeft: true,
				setTop: true,
				setWidth: false, 
				setHeight: false, 
				offsetLeft: 0, 
				offsetTop: Element.getHeight(element) + 2
			}); 	
			
			return imagePreview;			
		},	
		
		getUrl: function(url){
			if(/^http:.*$/.test(url)) {
				var tmp = url.match(/^(http:\/\/[^\/]*)(\/.*)$/);
				return tmp[1] + this.options.tipsUrlPrefix + tmp[2];
			}
			
			return this.options.tipsUrlPrefix + url;
		},
		
		addPopup: function(element) {
			Event.observe(element, 'mouseover', this.doImagePreviewHandler);				
			Event.observe(element, 'mouseout', this.stopImagePreviewHandler);		
		},
		
		removePopup: function(element) {
			Event.stopObserving(element, 'mouseover', this.doImagePreviewHandler);
			Event.stopObserving(element, 'mouseout', this.stopImagePreviewHandler);
		}
	}
}