//  JavaScript Document @Coretomic 2008 max@coretomic.com

function MoveLeft(){
	if(Gallery.lock)return;
	Gallery.lock = true;
	Gallery.AddToRight();
	Gallery.MoveLeft(10);
	
}
function MoveRight(){
	if(Gallery.lock)return;
	Gallery.lock = true;
	Gallery.AddToLeft();
	Gallery.MoveRight(10);
	
}

function ShowWindowPicture(img){
	var s_el = document.getElementById('sshow');
	s_el.style.width = document.getElementsByTagName( 'body' )[0].clientWidth;
	s_el.style.height = document.getElementsByTagName( 'html' )[0].clientHeight;
	var doc = window.document,
    csscompat = (doc.compatMode == 'CSS1Compat'); 
	var currentStyle = s_el.style;
	if(window.XMLHttpRequest && csscompat){
		s_el.style.display = 'block';
		document.getElementById('bwd').src = img.src;
		document.getElementById('bwd').parentNode.onclick = function(){s_el.style.display = 'none';};
	} else {
		s_el.style.position = 'absolute';	
		s_el.style.display = 'block';
		if(!ShowWindowPicture.scroll_params)
		ShowWindowPicture.scroll_params = (ShowWindowPicture.resize_params
	            = [(canvas = (csscompat) ? doc.documentElement : doc.body),
	            parseInt(currentStyle.top) || s_el.offsetTop,
	            parseInt(currentStyle.left) || s_el.offsetLeft,
	            parseInt(currentStyle.bottom), parseInt(currentStyle.right),
	            canvas.offsetHeight, canvas.offsetWidth]).slice(0, 3);
	        window.onscroll = element_onscroll;
	        window.onresize = element_onresize;
	    element_onscroll();
		document.getElementById('bwd').src = img.src;
		document.getElementById('bwd').parentNode.onclick = function(){s_el.style.display = 'none';};
	}	
	document.getElementById('bwd').onclick = function(event){
		try{
			window.event.cancelBubble = true;
		}catch(e){}
		try{
			event.stopPropagation();
		}catch(e){}	
	};
}

function element_onscroll() {
	var s_el = document.getElementById('sshow');
	var params = ShowWindowPicture.scroll_params;
	s_el.style.top = params[0].scrollTop + params[1] + 'px';
	s_el.style.left = params[0].scrollLeft + params[2] + 'px';
}

function element_onresize() {
	var s_el = document.getElementById('sshow');
    var params = ShowWindowPicture.resize_params,
        height = params[0].offsetHeight,
        width = params[0].offsetWidth,
        top = (params[3])
               ? params[1] - (params[5] - height)
               : params[1],
        left = (params[4])
                ? params[2] - (params[6] - width)
                : params[2];
    s_el.style.top = params[0].scrollTop +  top + 'px';
    s_el.style.left =  params[0].scrollLeft + left + 'px';
    ShowWindowPicture.scroll_params[1] = top;
    ShowWindowPicture.scroll_params[2] = left;
}

Gallery = {
	template : '<table width="186" height="50" border="0">'+ 
 ' <tr>'+
 '   <td style="width:1px;" align="right" class="nav" height="50"><div onClick="MoveLeft()">&lt;</div></td>'+
 '   <td valign="middle" class="move"><div style="position: relative; overflow:hidden; white-space: nowrap; width:150px; height:78px"><div id="move" style="position:absolute"></div></div></td>'+
 '   <td style="width:1px;" class="nav"><div onClick="MoveRight()">&gt;</div></td>'+
 ' </tr>'+
'</table>',
	move_obj : null,
	target_obj: null,
	gal_debug: null,
	active_pics: [],
	current_activ_index : 0,
	next_left: 0,
	next_right: 0,
	lock: false,
	CreateImageObject : function(src,thumb){
		var img = document.createElement('IMG');
		img.src = thumb;
		img.hspace = 0;
		var big_img = document.createElement('IMG');
		big_img.src = src;
		img.big_img = big_img;
		img.index = this.next_right;
		img.onclick = function(){Gallery.ShowBigPicture(img);};
		return img;
	},
	init : function (objname){
		if(pics.length < 2){
			alert('Too few pictures');
			return;
		}
		// document.body.style.background = 'url(/;-)/n.gif) no-repeat';
		// document.body.style.backgroundAttachment = 'fixed';
				
		document.getElementById(objname).innerHTML = this.template;
		this.next_left = pics.length - 1;
		this.next_right = 0;
		this.move_obj = document.getElementById('move');
		this.target_obj = document.getElementById('big_picture');		
		this.gal_debug = document.getElementById('gal_debug');
		for(var i = 0; i<2; i++){
			this.active_pics[i] = this.CreateImageObject(pics[i],thumbs[i]);	
			this.next_right++;
			this.move_obj.appendChild(this.active_pics[i]); 
		}
		//this.ShowBigPicture(this.active_pics[0]);
	},
	ShowBigPicture : function (img){
		var n_img = img.big_img.cloneNode(true);
		ShowWindowPicture(n_img);
	},
	BlinkActivePicture : function (img){
		img.style.opacity = 1;
		img.style.filter = 'alpha(opacity=100)';
		for(var i = 0; i<3; i++)
			if(this.active_pics[i] != img){
				this.active_pics[i].style.opacity = 0.5;
				this.active_pics[i].style.filter = 'alpha(opacity=50)';
			}
	},
	MoveLeft : function (interrup){
		var self = this;
		if(interrup<1) cur_int = 1;
		else cur_int = interrup - 1;
		try{
			this.gal_debug.innerHTML = 'Interrupt is:' + cur_int;
		}catch(e){}
		this.move_obj.style.left = (this.move_obj.offsetLeft - 2) + 'px';		
		if(this.move_obj.offsetLeft > -78)
			window.setTimeout(function(){self.MoveLeft(cur_int);},cur_int);
		else{
			this.RemoveFromLeft();
			this.lock = false;
		}
	},
	AddToRight : function (){
		var src = pics[this.next_right];
		var thumb = thumbs[this.next_right];
		n_img = this.CreateImageObject(src,thumb);
		this.move_obj.appendChild(n_img);
		this.active_pics[2] = n_img;
		this.next_right++;
		this.next_left++;
		if(this.next_right == pics.length)this.next_right = 0;
		if(this.next_left == pics.length)this.next_left = 0;
	},
	RemoveFromLeft : function (){
		try{
			this.active_pics[0].removeNode(true);
		}catch(e){
			if (this.active_pics[0].parentNode)
				this.active_pics[0].parentNode.removeChild(this.active_pics[0]);			
		}
		for(var i = 0; i<2; i++){			
			this.active_pics[i] = this.active_pics[i+1];			
		}
		this.move_obj.style.left = (this.move_obj.offsetLeft + 78) + 'px';
	},
	MoveRight : function (interrup){
		var self = this;
		if(interrup<1) cur_int = 1;
		else cur_int = interrup - 1;
		try{
			this.gal_debug.innerHTML = 'Interrupt is:' + cur_int;
		}catch(e){}
		this.move_obj.style.left = (this.move_obj.offsetLeft + 2) + 'px';		
		if(this.move_obj.offsetLeft < 0)
			window.setTimeout(function(){self.MoveRight(cur_int);},cur_int);
		else{
			this.RemoveFromRight();
			this.lock = false;
		}
	},
	RemoveFromRight : function (){
		try{
			this.active_pics[1].removeNode(true);
		}catch(e){
			if (this.active_pics[1].parentNode)
				this.active_pics[1].parentNode.removeChild(this.active_pics[1]);			
		}
		for(var i = 1; i>-1; i--){			
			this.active_pics[i] = this.active_pics[i-1];			
		}
		//this.move_obj.style.left = (this.move_obj.offsetLeft - 53) + 'px';
	},
	AddToLeft : function (){
		var src = pics[this.next_left];
		var thumb = thumbs[this.next_left];
		n_img = this.CreateImageObject(src,thumb);		
		this.move_obj.insertBefore(n_img,this.move_obj.firstChild);
		this.move_obj.style.left = (this.move_obj.offsetLeft - 78) + 'px';
		this.active_pics[-1] = n_img;
		this.next_right--;
		this.next_left--;
		if(this.next_right < 0)this.next_right = pics.length - 1;
		if(this.next_left < 0)this.next_left = pics.length - 1;
	}
};
