var placeholder = null;
var item_arr = new Array();
var curr = 1;
var t;
var slide_show_interval = 5000;
var fading_speed = 20;

function initGallery(id, img_array, title_array, desc_array, link_array) {
    placeholder = document.getElementById(id);
    
    fillGallery(img_array, title_array, desc_array, link_array);
}

function doSomething(alerting){
	alert(alerting);
	}

function fillGallery(img_array, title_array, desc_array, link_array) {
    var div = null;
    var title = null;
    var title_bg = null;
    var title_h1 = null;
    var img = null;
    var desc = null;
	var lokacija = null;
    var menu = placeholder.appendChild(document.createElement('div'));
    var menu_wrap = menu.appendChild(document.createElement('div'));
    
    menu.id = "menu_tray";
    menu_wrap.className = "wrap";
    
    menu_wrap.innerHTML += "<a class='button first' href='javascript:;' onclick='setPic(1)'></a>";
    menu_wrap.innerHTML += "<a class='button prev' href='javascript:;' onclick='changePic(curr - 1)'></a>";
    
    for(i = 1; i <= img_array.length; i++) {
		
        div = placeholder.appendChild(document.createElement('div'));
        div.className = "gallery_item";
				
        img = div.appendChild(document.createElement('img'));
        img.src = img_array[i-1];
        
		lokacija = menu.appendChild(document.createElement('div'));
        lokacija.className = "link";
        lokacija.id = "link" + i;
		
        title = div.appendChild(document.createElement('div'));
        title.className = "title";
        title.id = "title" + i;
		
        title_bg = title.appendChild(document.createElement('div'));
        title_bg.className = "bg";
			
        title_h1 = title.appendChild(document.createElement('h1'));

	
	
	//	lokacija.innerHTML = '<a href="'+link_array[i-1]+'">'+link_array[i-1]+"</a>";
		
		//
		var myLink = document.createElement('a');
				lokacija.appendChild(myLink);
				var href = document.createAttribute('href');
				myLink.setAttribute('href',link_array[i-1]);
				myLink.setAttribute('label',link_array[i-1]);
			
				myLink.innerHTML ="Opširnije";
		//
		
		
		
        title_h1.innerHTML = title_array[i-1] != "" ? title_array[i-1] : "&nbsp;";
        desc = title.appendChild(document.createElement('p'));
        desc.innerHTML = desc_array[i-1] != "" ? desc_array[i-1]  : "";
        
		
        if(title_array[i-1] == "" && desc_array[i-1] == "") {
            title.style.display = "none";
				
        }
        
        item_arr[i] = div;
        
        menu_wrap.innerHTML += "<a id='menu_item" + i + "' href='javascript:;' onclick='setPic(" + i +")'>" + (i < 10 ? "0" + i : i) + "</a>";
        
        if(i == 1) {
            setOpacity(100, i);
            document.getElementById("title" + i).style.visibility = "visible";
		//	document.getElementById("link" + i).style.display = "inline";
            document.getElementById("menu_item" + i).className = "active";
			
        }
        else {
            setOpacity(0, i);
            document.getElementById("title" + i).style.visibility = "hidden";
		//	document.getElementById("link" + i).style.visibility = "hidden";
		//	document.getElementById("title" + i).style.display = "none";
			document.getElementById("link" + i).style.display = "none";

		
        }
    }
    
    menu_wrap.innerHTML += "<a class='button next' href='javascript:;' onclick='setPic(curr + 1)'></a>";
    menu_wrap.innerHTML += "<a class='button last' href='javascript:;' onclick='setPic(item_arr.length - 1)'></a>";
    menu_wrap.innerHTML += "<a id='pause' class='button pause' href='javascript:;' onclick='pausePlay()'></a>";
    menu_wrap.innerHTML += "<br class='clear' />";
    
    menu_wrap.style.width = (100 + 26 * (i - 1)) + "px";
}

function changePic(i) {
    if(i > 0 && i < item_arr.length) {
        fadeIn(i, 0, 100);
        fadeOut(curr, 100, 0);
        
        document.getElementById("title" + curr).style.visibility = "hidden";
        document.getElementById("title" + i).style.visibility = "visible";
		
		document.getElementById("link" + curr).style.display = "none";
        document.getElementById("link" + i).style.display = "inline";
		
     //   document.getElementById("link" + curr).style.visibility = "hidden";
      //  document.getElementById("link" + i).style.visibility = "visible";
        
        document.getElementById("menu_item" + curr).className = "";
        document.getElementById("menu_item" + i).className = "active";
        
        curr = i;
    }
}

function setPic(i) {
    changePic(i);
}

//---------------- SLIDE SHOW ---------------------------

function slideShow() {
    t = setTimeout("startShow()", slide_show_interval);
}
function startShow() {
    var i = (curr + 1 == item_arr.length) ? 1 : curr + 1;
    changePic(i);
    
    if(document.getElementById("pause").className == "button pause") {
        t = setTimeout("startShow()", slide_show_interval);
    }
}
function stopShow() {
    clearTimeout(t);
}
function pausePlay() {
    var obj = document.getElementById("pause");
    if(obj.className == "button pause") {
        obj.className = "button play";
        stopShow();
    }
    else {
        obj.className = "button pause";
        t = setTimeout("startShow()", slide_show_interval);
    }
}

//--------------- OPACITY EFFECTS ---------------------

function fadeIn(i, startfade, endfade) {
	timer = 0;
	if (startfade < endfade) {
		for (j = startfade; j <= endfade; j++) {
			setTimeout("setOpacity(" + j + "," + i + ");", (timer * fading_speed));
			timer++;
		}
	}
}

function fadeOut(i, startfade, endfade) {
	timer = 0;
	if (startfade > endfade) {
		for (j = startfade; j >= endfade; j--) {
			setTimeout("setOpacity(" + j + "," + i + ");", (timer * fading_speed));
			timer++;
		}
	}
}

function setOpacity(opacity, i) {
	var el = item_arr[i].getElementsByTagName("img")[0].style;
	
	el.opacity = (opacity / 100);
	el.MozOpacity = (opacity / 100);
	el.KhtmlOpacity = (opacity / 100);
	el.filter = "alpha(opacity=" + opacity + ")";
}