/********************************************************************* 
v..Gallery
http://macvek.pl
*/

/*
	prefix -> prefix identyfikatora poszczegolnych zdjec
	preReplace -> czesc ktora powinna zostac zamieniona z nazwy zdjecia
	postReplace -> wynik zamienienia nazwy
	from -> pierwszy indeks elementu galerii
	to -> ostatni indeks elementu galerii
*/

vDotsGallery = function(prefix,preReplace,postReplace,from,to) {
	this.prefix = prefix;
	this.preReplace = preReplace;
	this.postReplace = postReplace;
	this.from = from;
	this.to = to;
	this.size = to - from;
}

vDotsGallery.prototype.init = function(prefix,preReplace,postReplace,from,to) {
	
	//obiekty DOM
	this.background = null;
	this.frame = null;
	this.image = null;
	
	this.id = 'vDotsGallery_'+Math.round((Math.random()*10000));
	
	this.backgroundId = this.id+'_background';
	this.frameId = this.id+'_frame';
	this.imageId = this.id+'_image';
	this.loadingId = this.id+'_loading';
	
	if (!this.prepared) 
		var a = this.initBackground();	
	
	return true;
}

vDotsGallery.prototype.imageLoaded = function() {

	this.hide(this.loading,1,0,0.1);	

	var viewDims = document.viewport.getDimensions();
	var scrollDims = document.viewport.getScrollOffsets();
	var imageDims = this.image.getDimensions();
	
	this.image.setStyle({
		top: Math.round(((viewDims.height - imageDims.height)/2)+scrollDims.top)+'px',
		left: Math.round(((viewDims.width - imageDims.width)/2)+scrollDims.left)+'px'
	});

	this.show(this.image,0,1,0.5);
}

vDotsGallery.prototype.show = function(node,From,To,time) {
	if (!From) From=0;
	if (!To) To=1;	

	node.setStyle({visibility:'visible',display:'block'});
	node.setOpacity(From);
	if (node.activeEffect) node.activeEffect.cancel();
	if (From != To)
		node.activeEffect = new Effect.Opacity(node,{from: From, to: To, duration:time});
}

vDotsGallery.prototype.hide = function(node,From,To,time) {
	if (From==null) From=1;
	if (To==null) To=0;
	node.setOpacity(From);
	
	if (node.activeEffect) node.activeEffect.cancel();
	
	if (From != To) 
		node.activeEffect = new Effect.Opacity(node, {from:From, to:To, duration:time, 
		afterFinish:function() {
			node.setStyle(
				{
					visibility:'hidden',
					display:'none'
				});
			}
		});
}


vDotsGallery.prototype.unzoom = function(event) {
	var hit = event.findElement();
	if (!(hit == this.image || hit == this.loaded || hit == this.background)) return;
	
	
	this.hide(this.background,0.75,0,0.5);
	this.hide(this.loading,0,0,0.1);
	this.hide(this.image,1,0,0.5);
	
}

vDotsGallery.prototype.zoom = function(node) {
	if (!this.prepared) 
		this.init();
		
	this.show(this.background,0,0.75,0.5);
	
	var loadingDims = this.loading.getDimensions();	
	var viewDims = document.viewport.getDimensions();
	var scrollDims = document.viewport.getScrollOffsets();
	
	this.loading.setStyle({
		top: Math.round(((viewDims.height - loadingDims.height)/2)+scrollDims.top)+'px',
		left: Math.round(((viewDims.width - loadingDims.width)/2)+scrollDims.left)+'px'
	});
	
	this.show(this.loading,0,1,0.1);
	this.image.src = node.src.replace(this.preReplace, this.postReplace);

}

vDotsGallery.prototype.initBackground = function() {
	var background = '<div id="'+this.backgroundId+'" style="display:none;visibility:hidden;position:absolute;"></div>';
	var frame = '<div id="'+this.frameId+'" style="display:none;visibility:hidden;position:absolute;"></div>';
	var image = '<img id="'+this.imageId+'" style="display:none;visibility:hidden;position:absolute;"/>';
	var loading = '\
		<div \
		id="'+this.loadingId+'" \
		style="display:none;visibility:hidden;position:absolute; border: 1px solid; width:300px; height:100px; background-color:#fff">\
		<p style="padding-top:13px;font-size:20px;text-align:center">Wczytywanie...</p>\
		</div>';
	
	var bodyNode = $$('body')[0];
	if (!bodyNode) return;
	
	bodyNode.insert(background,{position:"before"});
	bodyNode.insert(frame,{position:"before"});
	bodyNode.insert(image,{position:"before"});
	bodyNode.insert(loading,{position:"before"});
	
	
	if (!$(this.backgroundId)) return;
	if (!$(this.frameId)) return;
	if (!$(this.imageId)) return;
	
	
	this.frame = $(this.frameId);
	this.background = $(this.backgroundId);
	this.image = $(this.imageId);
	this.loading = $(this.loadingId);

	var bodyDims = bodyNode.getDimensions();
	var viewDims = document.viewport.getDimensions();

	tWidth = Math.max(bodyDims.width, viewDims.width);
	tHeight = Math.max(bodyDims.height, viewDims.height);
		
	this.background.setStyle({
		backgroundColor: '#fff',
		width: tWidth+'px', 
		height: tHeight+'px',
		left: '0px',
		top: '0px'
	});
	
	this.image.observe('load',this.imageLoaded.bind(this));
	bodyNode.observe('click',this.unzoom.bind(this));
	
	this.prepared = true;
}

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