var temp="";
var num;
var dir="images/"+catalogue+"/";
var m=12;
var page;
var n;
var s;
var loop;
var t1,t2;
var btn1,btn2;

btn1="<img src=\"images\/09_effect_btn_off.gif\" alt=\"\"\/>";
btn2="NEXT";

num=icon.length;
page=Math.ceil(num/m);

function fading(n,x,y) {
 if (loop) {
 faded();
 
 $("#effect-image2 img").attr({src:dir+icon[n]["img"]+"_"+x+".jpg",title:"",alt:""});
 $("#effect-image1").fadeTo(1000,0);
 $("#effect-image2").fadeTo(1000,1);
 
 if (x==y) x=1;
 else x+=1;
 t2=setTimeout("fading("+n+","+x+","+y+")",4000);
 }
}

function faded() {
 $("#effect-image1 img").attr({src:$("#effect-image2 img").attr("src"),title:"",alt:""});
 $("#effect-image1").css("opacity",1);
 $("#effect-image2").css("opacity",0);
}

function move(pg,w) {
 var tm="";
 if (w==0) {
  $("#effect-images-list").animate({left:"-=372"});
  if (pg+1<page) tm+="<div><a href=\"javascript:move("+(pg+1)+",0)\">"+btn2+"<\/a><\/div>";
  tm+="<div><a href=\"javascript:move("+(pg+1)+",1)\">"+btn1+"<\/a><\/div>";
 }
 if (w==1) {
  $("#effect-images-list").animate({left:"+=372"});
  tm+="<div><a href=\"javascript:move("+(pg-1)+",0)\">"+btn2+"<\/a><\/div>";
  if (pg-1>1) tm+="<div><a href=\"javascript:move("+(pg-1)+",1)\">"+btn1+"<\/a><\/div>";
 }
 $("#effect-btn").html(tm);
}

//var total=0;

$(document).ready(function() {
 $("#effect-images-list").css("width",page*372);

 /*for (var i=0; i<icon.length; i++) {
  var image0=new Image();
  image0.src=dir+icon[i]["img"]+"_thumb.jpg";
  //total+=icon[i]["num"];
 }*/

 for (var p=0; p<page; p++) {
  if (p==page-1 && num%m!=0) s=num%m;
  else s=m;
  temp+="<ul class=\"effect-list\">";
  for (var i=0; i<s; i++) temp+="<li><img src=\""+dir+icon[i+p*m]["img"]+"_thumb.jpg\" name=\""+(i+p*m)+"\" alt=\"\"\/><div><\/div><\/li>";
  temp+="</ul>";
 }

 $("#effect-images-list").html(temp); 
 $("#effect-images-list li").click(img_onclick);
 
 hide();
 hover();
 
 $("#effect-images-list li").eq(0).unbind('mouseover',mouseover).unbind('mouseout',mouseout);
 $("#effect-images-list li div").eq(0).show();
 
 if (page>1) temp="<div><a href=\"javascript:move(1,0)\">"+btn2+"<\/a><\/div>";
 else temp="";
 $("#effect-btn").html(temp);
 
 gettext(0);
 
 temp="";
 for (var i=0; i<icon.length; i++)
  if (icon[i]["num"]==1) {
   temp+="<img src=\""+dir+icon[i]["img"]+".jpg"+"\"\/>";
   //var image1=new Image();
   //image.onLoad=preloading();
   //image1.src=dir+icon[i]["img"]+".jpg";
   //alert(image.src);
  } else {
   for (var j=1; j<=icon[i]["num"]; j++) {
    temp+="<img src=\""+dir+icon[i]["img"]+"_"+j+".jpg"+"\"\/>";
	//var image2=new Image();
    //image.onLoad=preloading();
    //image2.src=dir+icon[i]["img"]+"_"+j+".jpg";
	//alert(image.src);
   }
  }
  //$.preloadImages("image1.gif", "/path/to/image2.png","some/image3.jpg");
 $("#portfolio-preload").html(temp);
 /*$("#imgpreload img").imgpreload(function()
{
	// this = jQuery image object selection
	// callback executes when all images are loaded
});*/
 //var img= new Image();
 //img.

});

function img_onclick () {
 n=$(this).find('img').attr("name");
 if (n!=$("#effect-image1 img").attr("rel")) {
  if (loop) {
   clearTimeout(t1);
   clearTimeout(t2);
  }
  hide();
  hover();
  $(this).unbind('mouseover',mouseover).unbind('mouseout',mouseout);
  $(this).find('div').removeClass("effect-mouseover").show();
  
  gettext(n);
 }
}

function gettext(n) {
 var temp=icon[n]["title"];
 if (icon[n]["num"]!=1) temp+=" ("+icon[n]["num"]+" images)";
 $("#effect-title").html(temp);
 if (catalogue=="logo") $("#effect-info").html(logo);
 else $("#effect-info").html(icon[n]["info"]);
 
 if (icon[n]["num"]==1) {
  loop=false;
  $("#effect-image img").attr({src:dir+icon[n]["img"]+".jpg",title:"",alt:"",rel:""+n+""});
 } else {
  loop=true;
  $("#effect-image img").attr({src:dir+icon[n]["img"]+"_1.jpg",title:"",alt:"",rel:""+n+""});
  t1=setTimeout("fading("+n+",2,"+icon[n]["num"]+")",2000);
 }
}

function hide() {
 $("#effect-images-list li div").hide();
}
function hover() {
 $("#effect-images-list li").bind('mouseover',mouseover).bind('mouseout',mouseout);
}

function mouseover() {
 $(this).find('div').addClass("effect-mouseover").show();
}
function mouseout() {
 $(this).find('div').removeClass("effect-mouseover").hide();
}

/*$.fn.wait = function(time, type) {
 time = time || 2000;
 type = type || "fx";
 return this.queue(type, function() {
  var self = this;
  setTimeout(function() {
   $(self).dequeue();
  }, time);
 });
};*/

/*jQuery.preloadImages = function()
{
  for(var i = 0; i<arguments.length; i++)
  {
    jQuery("<img>").attr("src", arguments[i]);
  }
}*/

/*var tt=0;

function preloading () {
 tt++;
 $("#preloading").css("width",tt*526/total);
}*/