// JavaScript Document
function toolChainImages() {
	this.chain=new Array();
	includeCSS(PATH_STYLES+'gallery.css');
	includeCSS(PATH_STYLES+'modal.css');
	include(PATH_JS+'modalDiv.js');
}

toolChainImages.prototype = {
	debugMode: 1,
	dirImages: PATH_IMAGES+'/gallery/',
	typeNav: 1,// show images or text navigation: 1 - images, 0 - text
	navText: new Array('back','next'),
	navImages: new Array(62,32,PATH_IMAGES+'/gallery/back.gif',63,32,PATH_IMAGES+'/gallery/next.gif',82,32,PATH_IMAGES+'/gallery/close.gif'),
		
	imgPadding: new Array(90,0), // vertical padding, horizontal padding
	defOpacity: 1.0,
	navTextClass: 'test', // text navigation class
	mainDivId: 'mainDiv',
	bgDivId: 'bgDiv',
	chainTableId: 'galleryTable',
	actionTime: 200, // msec
	deltaTicker: 20, // msec
	destDiv: null, // object of main modal div
	idTicker: null, 
	defWidth: 140, // default width of main div
	defHeight: 120, // default height of main div
	botMenuHeight: 0, 
	padding: new Array(6,2,6,6), // padding in main modal div
	// animation settings:
	dX: 0,
	dY: 0,
	Sx: 0,
	Sy: 0,
	rSx: 0,
	rSy: 0,
	move_x: true,
	move_y: true,
	
	imageOpacity: 0,
	
	chain: new Array(),
	cancelTicker: function() {
		if(this.idTicker) clearInterval(this.idTicker);
		this.idTicker=null;
	},
	addImage: function(src, name, id, hdWidth, hdHeight, hdSize, lat, lng) {
		var tmp=new this.newItem(src, name, id, hdWidth, hdHeight, hdSize, lat, lng);
		this.chain.push(tmp);
	},
	newItem: function(src, name, id, hdWidth, hdHeight, hdSize, lat, lng, marker) {
		this.src=src;
		this.load=false;
		this.name=name;
		this.id = id;
		this.hdHeight = hdHeight;
		this.hdWidth = hdWidth;
		this.hdSize = (hdSize/1024).toFixed(2); // Mb
		this.lat = lat;
		this.lng = lng;
		this.marker = marker;
	
		this.buffer=new Image;
		
		return this;
	},
	debugInfo: function() {
		if(this.debugMode) alert(this.chain.length);
	},
	showModalFrame: function() {
		try{ 
			var self=this;
			this.modalFrame = null;
			this.destDiv=null;
			this.modalFrame = new toolModalDiv('func',function () { self.loadImage(-1); }, this.defWidth, this.defHeight, this.bgDivId, this.mainDivId); 
		} catch(e) { 
			alert('Please, include JavaScript librarys: modalDiv.js, core.js \nError: '+e); 
			return; 
		}
	},
	loadImage: function(id) {
		
		if(id != -1 && id >= 0) this.idImg = parseInt(id);
		if(!this.destDiv) this.destDiv = document.getElementById(this.mainDivId); 
		this.destDiv.innerHTML='<img style="padding-top:35px;" src="'+this.dirImages+'loaderm.gif" border="0px">';	

		if(this.chain[this.idImg].load==false) {
			this.chain[this.idImg].buffer.src = PATH_IMAGES+'/'+this.chain[this.idImg].src;	
			
			
			if(this.chain[this.idImg].buffer.complete) { this.resizeDiv(); }
			else {
				var self=this;
				this.chain[this.idImg].buffer.onload = function () { self.setLoad(); self.resizeDiv(); }
			}
		} else {
			this.resizeDiv();
		}
	},
	setLoad: function() {
		this.chain[this.idImg].load=true;
	},	
	showImageById: function(id) {
		var i=0;
		for(n in this.chain) {
			if(this.chain[n].id == id) {
				i=n;
				break;
			}
		}
		if(i) this.showImage(i);
	},	
	showImage: function(ind) {
		if(!ind) ind=0;
		if(!this.chain[ind]) { alert('no in array :('); return; }
		this.idImg=parseInt(ind);
		this.showModalFrame();
	},
	resizeDiv: function() {
		var w=this.chain[this.idImg].buffer.width;
		var h=this.chain[this.idImg].buffer.height;

		this.resetParams();
		w=parseInt(w, 10); h=parseInt(h, 10);
		
		this.Sx = w - parseFloat(this.destDiv.style.width) + this.padding[0]+this.padding[2];
		this.Sy = h - parseFloat(this.destDiv.style.height) + this.padding[1]+this.padding[3];

		var it=this.actionTime/this.deltaTicker;

		this.dX = this.Sx/it;
		this.dY = this.Sy/it;

		if(this.Sx < 0) this.Sx=(-1)*this.Sx;
		if(this.Sy < 0) this.Sy=(-1)*this.Sy;		
	
		if(this.Sx || this.Sy) {
			var self=this;
			this.idTicker=setInterval(function() { self.actionResize(); }, this.deltaTicker);
		} else {
			
			this.screenImage();
		}
	},
	screenImage: function() {
		var lnext='next';
		var lback='back';
		

		this.destDiv.innerHTML='<img id="image'+this.idImg+'" style="visibility:hidden" src="'+this.chain[this.idImg].buffer.src+'" border="0px" style="vertical-align: top">';
	
		this.animateShowImage();
		
		
		if(this.typeNav) {
			// images
			this.destDiv.innerHTML += '<img id="lback" alt="'+this.navText[0]+'" class="navBut" src="'+this.navImages[2]+'" style=" left:'+this.imgPadding[1]+'px; top:'+this.imgPadding[0]+'px; " />';
			nextx=parseInt(this.destDiv.style.width)-(this.imgPadding[1]+this.navImages[3]);
			this.destDiv.innerHTML += '<img id="lnext" alt="'+this.navText[1]+'" class="navBut" src="'+this.navImages[5]+'" style="left:'+nextx+'px; top:'+this.imgPadding[0]+'px" />';
			
			this.destDiv.innerHTML += '<dl><div class="pad"><a target="_blank" href="'+this.dirImages+'hd/'+this.chain[this.idImg].id+'.jpg" title="'+this.chain[this.idImg].hdWidth+'x'+this.chain[this.idImg].hdHeight+'px"><b>HD</b> ('+this.chain[this.idImg].hdSize+' Мб)</a>'+this.chain[this.idImg].name+'</div></dl>';
			
			this.destDiv.innerHTML += '<div title="назад" class="navBgDiv" id="lback_a" style="width:'+(parseInt(this.destDiv.style.width, 10)/2)+'px">&nbsp;</div>';
			this.destDiv.innerHTML += '<div title="вперёд" class="navBgDiv" id="lnext_a" style="width: '+(parseInt(this.destDiv.style.width, 10)/2)+'px; left: '+(parseInt(this.destDiv.style.width, 10)/2)+'px;">&nbsp;</div>';
			
			this.destDiv.innerHTML += '<div id="closeImage"><img src="'+this.navImages[8]+'" height="'+this.navImages[7]+'px" width="'+this.navImages[6]+'px" alt="закрыть"></div>';
			// text
			
		}
		
		//this.animateShowThumbnails();
		
		var obj_back=getElement('lback');
		var obj_next=getElement('lnext');		
		var obj_close=getElement('closeImage');
		if(this.typeNav) {
			if(obj_back) setOpacity(obj_back,this.defOpacity);
			if(obj_next) setOpacity(obj_next,this.defOpacity);
		}
		var self=this;
		if(obj_back) addEvent(obj_back,'click', function () { self.loadBack(); } ,false);	
		if(obj_next) addEvent(obj_next,'click', function () { self.loadNext(); } ,false);
		if(obj_close) addEvent(obj_close,'click', function () { self.modalFrame.delModalDivs(); } ,false);
		var obj_back_a=getElement('lback_a');
		var obj_next_a=getElement('lnext_a');
		
		if(obj_back_a) {
			addEvent(obj_back_a, 'click', function () { self.loadBack(); } ,false);
			setOpacity(obj_back_a, 0.0);
		}
		if(obj_next_a) {
			addEvent(obj_next_a, 'click', function () { self.loadNext(); } ,false);
			setOpacity(obj_next_a, 0.0);
		}
	},
	
	animateShowImage: function() {
		var self = this;
		
		var img = getElement('image'+this.idImg);
		this.imageOpacity = 0;
		
		setOpacity(img, this.imageOpacity);
		img.style.visibility = 'visible';
		
		this.cancelTicker();
		
		this.idTicker = setInterval(function () { self.incOpacityImage(); }, 50);
	},
	
	animateShowThumbnails: function() {
		
		var c = this.idImg;
		var total = this.chain.length;
		
		var start = c - 2;
		if(start < 0) start = 0;
		var end = c + 3;
		if(end >= total) end = total-1;
		
		var lineTh = '';
		for(i = start; i < end; i++) {
			
			lineTh += '<img src="'+PATH_IMAGES+'gallery/vsmall/'+this.chain[i].id+'.jpg" alt="'+this.chain[i].name+'" '; 
			if(i==c) lineTh += 'class="current"';
			lineTh += ' title="'+this.chain[i].name+'"';
			lineTh += ' onClick="wedding.loadImage('+i+')"';
			lineTh += '/>';
		}
		
		this.destDiv.innerHTML += '<div class="thumbnails"><div class="in">'+lineTh+'</div></div>';
		
	},
	
	incOpacityImage: function() {
		var img = getElement('image'+this.idImg);
		this.imageOpacity += 0.2;
		if(this.imageOpacity > 1) this.imageOpacity = 1.0;
		
		setOpacity(img, this.imageOpacity);
		
		if(this.imageOpacity==1) {
			this.cancelTicker();
		}
	},
	
	loadBack: function() {
		var prev=this.idImg-1;
		if(prev < 0) prev=this.chain.length-1;
		this.loadImage(prev);
	},
	loadNext: function() {
		var next=this.idImg+1;
		if(next >= this.chain.length) next=0;
		this.loadImage(next);
	},
	actionResize: function() {
		if(!this.dX) this.move_x=false;
		if(!this.dY) this.move_y=false;	
		var delta_x = this.dX;
		var delta_y = this.dY;
		if(this.dX < 0) delta_x=(-1)*this.dX;  
		if(this.dY < 0) delta_y=(-1)*this.dY;
		
		if(this.move_x) this.rSx += delta_x;
		if(this.move_y) this.rSy += delta_y;
		
		
		if(Math.round(this.rSx) <= this.Sx) {
			this.destDiv.style.width = Math.round( parseFloat(this.destDiv.style.width)+this.dX) +'px'; 	
		} else { 
			this.move_x=false;
		}
		
		if(Math.round(this.rSy) <= this.Sy) {
			this.destDiv.style.height = Math.round( parseFloat(this.destDiv.style.height)+this.dY) +'px';
		} else {
			this.move_y=false;
		}
		
		// reposition:
		this.destDiv.style.marginLeft = -(this.destDiv.offsetWidth/2) + "px";
		this.destDiv.style.marginTop = -(this.destDiv.offsetHeight/2) + document.body.scrollTop + "px";
		if(!this.move_x && !this.move_y) { 
			//this.destDiv.style.lineHeight = this.destDiv.style.height;
			this.cancelTicker(); 
			this.screenImage(); 
		}
	},
	resetParams: function() {
		this.cancelTicker();
		this.rSx=0;
		this.rSy=0;
		this.move_x=true;
		this.move_y=true;
		this.Sx=0;
		this.Sy=0;
		this.dX=0;
		this.dY=0;
	}
}