function remove(string,what){
	return parseFloat(string.replace(what,''));
}

function getQuery2(x){	
	query = x.substring(x.indexOf('?'), x.length);
	return query.replace('%20', ' ').toQueryParams();	
}

function scroller(){
	var items_cont = $('s_items_cont');
	var v = ($('scroller').className == 'v');
	//console.info(v)
	var items_scroll = $('s_items');
	//var pages_cont = $('pages');
	var pages_nav = $('pages_nav');
	var msg = $('s_msg');
	var msg_cont = $('s_msg_cont');
	var is_left = 0;
	var total_width = 0; // item_width * margin_right *items_length
	var total_height = 0; 
	var items = document.getElementsByClassName('s_item', items_scroll);
	var next = $('s_next_nav')
	var back = $('s_back_nav')
	var spacing = 20;
	var vspacing = 0;
	if(!v) var page_size = items_cont.offsetWidth-spacing;
	if(v) var page_size = 460;
	var doit = true;
	
	items[0].className += ' first';
	pages_nav.parentNode.onmouseover = function(){
	
		this.className += ' s_hover'
	}
	
	pages_nav.parentNode.onmouseout = function(){
		this.className = this.className.replace(' s_hover','')
	}
	
	
	//get total size
	function get_items_size(){		
		for(var i=0; i<items.length; i++){
			var items_width = 0;
			var items_space = spacing;
				total_width += items[i].offsetWidth;
				total_width += items_space;				
		}	
		return parseFloat(total_width);
	}

	
	
	if(!v) items_scroll.style.width = get_items_size() + 'px';	
	
/*--------------------------------------------------- Vertical --------------------------------------------------------------*/
	//get total size
	function get_items_v_size(){		
		for(var i=0; i<items.length/2; i++){
			var items_height = 0;
			var items_space = vspacing;
				total_height += items[i].offsetHeight;
				//console.log(items[i].offsetHeight);
				total_height += items_space;				
		}	
		return parseFloat(total_height);
		
	}
	
	
	if(v) items_scroll.style.height = get_items_v_size() + 'px';	
	//console.info('Total height:' + total_height)
	
/*--------------------------------------------------- Vertical --------------------------------------------------------------*/
	
	//goToPage
	
	if(!v) var pages = total_width/page_size;	
	if(v) var pages = total_height/page_size;	
	
	
	//pages <= Math.floor(pages) ? pages=pages : pages = pages+1;
	
	
	
	//console.info(pages);
	
	if(pages > 1){
		pages_nav.parentNode.style.display ='block';
		for (var x = 0; x<pages; x++){	
			DOM_a = document.createElement("a");
			pages_nav.appendChild(DOM_a);
			DOM_a.href = "#p_"+x;
			DOM_a.title = 'Stranica: '+(x+1);
			DOM_a.appendChild(document.createTextNode(x+1));
			DOM_a.onclick = goToPage;		
		}
	}
	
	//console.info(paginacija);
	
	//pages_cont.innerHTML = paginacija
	
	//move left / right
	function move_left (){
		new Effect.MoveBy(items_scroll, 0, -page_size,
		{beforeStart: set_false,
		 afterFinish: set_true}
		);		
		
	}

	
	function move_right (){
		new Effect.MoveBy(items_scroll, 0, page_size,
		{beforeStart: set_false,
		 afterFinish: set_true}
		);		
		
	}	
	
	
/*--------------------------------------------------- Vertical --------------------------------------------------------------*/	
	
	//move top/bottom
	function move_top (){
		new Effect.MoveBy(items_scroll, -page_size,0,
		{beforeStart: set_false,
		 afterFinish: set_true}
		);		
		
	}

	
	function move_bottom (){
		new Effect.MoveBy(items_scroll,  page_size,0,
		{beforeStart: set_false,
		 afterFinish: set_true}
		);		
		
	}	
	
/*--------------------------------------------------- Vertical --------------------------------------------------------------*/
	
	
	
	// check if done
	function set_true(){
		doit = true;
	}
	
	function set_false(){
		doit = false;
	}
	
	
	
	// onclick actions
	
	if(!v){
		next.onclick = function(){
			is_left = items_scroll.style.left;
			is_left == isNaN(is_left) ? is_left = '0' : items_scroll.style.left;
			var flag = total_width + (remove(is_left, 'px')) > page_size;
			if(doit && flag) move_left();		
			return false;	
		}
		
		
		back.onclick = function(){
			is_left = items_scroll.style.left;		
			var flag = remove(is_left, 'px')  < 0;		
			if(doit && flag) move_right();
			return false;	
		}
	}
	
	/*--------------------------------------------------- Vertical --------------------------------------------------------------*/
	
	// onclick actions
	
	if(v){
		next.onclick = function(){
			is_top = items_scroll.style.top;
			is_top == isNaN(is_top) ? is_top = '0' : items_scroll.style.top;
			var flag = total_height + (remove(is_top, 'px')) > page_size;
			if(doit && flag) move_top();		
			return false;	
		}
		
		
		back.onclick = function(){
			is_top = items_scroll.style.top;		
			var flag = remove(is_top, 'px')  < 0;		
			if(doit && flag) move_bottom();
			return false;	
		}
	}
	/*--------------------------------------------------- Vertical --------------------------------------------------------------*/
	
	function goToPage(){
		var p = this.href;
		p = p.substring(p.lastIndexOf('_')+1);
		var leftpos = -(p * page_size);
		var left = remove(items_scroll.style.left,'px');
		
		//console.info(left);
		//console.info(isNaN(left));
		isNaN(left) ? left = 0 : left = remove(items_scroll.style.left, 'px');
		//console.info(left);
		var leftpos = leftpos-left;
		//console.info(leftpos);
		//items_scroll.style.left = leftpos + 'px';
		if(doit && leftpos != 0){		
			new Effect.MoveBy(items_scroll, 0, leftpos,
			{beforeStart: set_false,
			 afterFinish: set_true}
			);	
		}
		//console.info(p);
	
	}
	
	
	
	function foto(){
	
	
	
	
	var fotoimg = $('fotoimg')
	var img_title = $('img_title')
	var img_download = $('img_download')
	var img_vezani = $('img_vezani')
	var image_size = $('image_size')
	
	var objLoading = document.createElement("div");
		objLoading.setAttribute('id','loading2');
		objLoading.style.display = 'none';
		fotoimg.parentNode.appendChild(objLoading);
		
		
	
		var objLoadingImage = document.createElement("img");
		objLoadingImage.setAttribute('src', fileLoadingImage);
		objLoading.appendChild(objLoadingImage);
		
		
		
		
	
		for(var i=0; i<items.length; i++){
		var link = items[i].getElementsByTagName('a')[0];
		link.onclick = openimg;	
		}
		
		function openimg(){
		Element.hide('fotoimg');
		Element.show('loading2');
		var s = this;
		var url = null;
		url = this.href;
		
		
		

		
		
				imgPreloader = new Image();
					
					
					imgPreloader.onload = function(){
						Element.setSrc('fotoimg', url);
						fotoimg.parentNode.style.height = imgPreloader.height + 'px';
						fotoimg.width = imgPreloader.width
						fotoimg.height = imgPreloader.height;
			
						/*Element.hide('loading');
						Element.show('fotoimg')*/
						
						Element.hide('loading2');
						new Effect.Appear('fotoimg', { duration: 0.5, queue: 'end'});
						
						
						img_title.innerHTML = s.title;
						//console.info(s.title == null || s.title == '');
						if(s.title == null || s.title == '') img_title.innerHTML = s.getAttribute('tip');
						if(s.getAttribute('tip') == '' || s.getAttribute('tip') == null){
							img_title.innerHTML = '';
							Element.hide(img_title);
							}
							else{Element.show(img_title);}
						//img_download.href = s.rel;
					}
					
					imgPreloader.src =  url;
				var clanak_link = getQuery2(url)
				//img_vezani.href = clanak_link.clanak
				//console.info(clanak_link.print)
				
				
				if(img_vezani){
					if(clanak_link.clanak){
						img_vezani.href = clanak_link.clanak
						Element.show(img_vezani);
					}
					else{			
						Element.hide(img_vezani);
					}
				}
				
				
				if(image_size){
					if(clanak_link.size){
						image_size.innerHTML = clanak_link.size
						Element.show(image_size);
					}
					else{			
						Element.hide(image_size);
					}
					
				}
				
				
				if(img_download){
					if(clanak_link.print){
						img_download.href = clanak_link.print
						Element.show(img_download);
					}
					else if(!clanak_link.print){
						img_download.href = s.rel
						Element.show(img_download);
					}
					else{			
						Element.hide(img_download);
						
					}
				}
				
			
			
			
			
			return false;
		}

	}
	
	if(v) foto();
	
	msg_cont.style.display = 'none';
	items_scroll.style.visibility = 'visible';
	//console.info(pages)
	if(pages>1){
		back.style.display = 'block';
		next.style.display = 'block';
	}
	
}
function pretest(){
	if($('s_items_cont')) scroller();
}

Event.observe(window, 'load', pretest, false);