//画像・コメントの定義
var imgCnt = 4;
var imgSrc = new Array("00","01","02","03","04"); 
var imgAlt = new Array("","都心居住への挑戦","都市の再生","売れる街づくり","駅作りデザインゲーム"); 
var imgHrf = new Array("","projects/prjlist.php?ctg=41","service/urregeneration.html","projects/prjsheet.php?pid=5010&ctg=14","projects/prjsheet.php?pid=5021&ctg=13"); 
  
//開始Noをランダム発生＞画像・タブの並べ替え
Array.prototype.shuffle = function(){
  var i = this.length;
  while(i){
    var j = Math.floor(Math.random()*i);
    var t = this[--i];
    this[i] = this[j];
    this[j] = t;
  }
  return this;
}
var imgNo = new Array(imgCnt);
  for(var i=0; i<imgCnt; i++){
	imgNo[i]=i+1;
  }
rdm = imgNo.shuffle();
/*
  document.write(rdm[0]);
  document.write(rdm[1]);
  document.write(rdm[2]);
  document.write(rdm[3]);
*/
var imgSrc_rdm = new Array(5);
var imgAlt_rdm = new Array(5);
var imgHrf_rdm = new Array(5);
for(var i=0; i<4; i++){
  imgSrc_rdm[i+1] = imgSrc[rdm[i]];
  imgAlt_rdm[i+1] = imgAlt[rdm[i]];
  imgHrf_rdm[i+1] = imgHrf[rdm[i]];
}

// フェードイン情報の定義
var spd = 50; // 変化させる間隔（ミリ秒単位）
var ntc = 5;  // 何%ずつ変化させるか
var opc = 20; //画像の初期値


//画像の初期表示
function thumbTub(){
  for(var i=1; i<=4; i++){
	document.write("<tr>");
	if(i==1){
	  document.write("<td rowspan='4'><a href='"+imgHrf_rdm[i]+"' id='mainImg'><img src='img/top"+imgSrc_rdm[i]+"_img.jpg' alt='イメージ画像' name='mainImg' /></a></td>");
	  document.write("<td><a href='"+imgHrf_rdm[i]+"'><img src='img/top"+imgSrc_rdm[i]+"_tab.jpg' alt='"+imgAlt_rdm[i]+"' onMouseover='mouseTab("+i+");' id='tab"+i+"' /></a>");
	}else{
	  document.write("<td><a href='"+imgHrf_rdm[i]+"'><img src='img/top"+imgSrc_rdm[i]+"_tab_r.jpg' alt='"+imgAlt_rdm[i]+"' onMouseover='mouseTab("+i+");' id='tab"+i+"' /></a>");
	}
	document.write("</td></tr>");
  }
  document.mainImg.style.filter = "alpha(opacity:"+opc+")";
  slideShow(1);
fdInImg();
}

//イメージ＆タブ画像の差替え
function tab(a){
	
    document.getElementById("tab"+a).src = "img/top"+imgSrc_rdm[a]+"_tab.jpg";
	 
    //tab反転
    if(a!=1){ document.getElementById("tab1").src="img/top"+imgSrc_rdm[1]+"_tab_r.jpg"; }
    if(a!=2){ document.getElementById("tab2").src="img/top"+imgSrc_rdm[2]+"_tab_r.jpg"; }
    if(a!=3){ document.getElementById("tab3").src="img/top"+imgSrc_rdm[3]+"_tab_r.jpg"; } 
    if(a!=4){ document.getElementById("tab4").src="img/top"+imgSrc_rdm[4]+"_tab_r.jpg"; } 
 
    document.mainImg.src  = "img/top"+imgSrc_rdm[a]+"_img.jpg"; 
    document.getElementById("mainImg").href = imgHrf_rdm[a];
	
    document.mainImg.style.filter = "alpha(opacity:"+opc+")";
	
    slideShow(1)
    fdInImg();
  }

//スライドショー
var dispNo = 1;
function slideShow(a){
  if(a==0){
    clearTimeout(Timer_id);
  }else{
    dispNo++;
    if(dispNo>4){dispNo=1;}

	//次の画像の先読み
	var imgObj = new Image();
    imgObj.src = "img/top"+imgSrc_rdm[dispNo]+"_img.jpg";

    Timer_id = setTimeout("tab("+dispNo+")",5000);
  }
	
}

// フェードイン
function fdInImg() {
  // Internet Explorer  
  document.mainImg.style.filter = 'alpha(opacity='+opc+')';  
  // Opera, Safari, Chrome, Firefox>=3.5  
  document.mainImg.style.opacity = opc/100;  
  // Firefox  
  document.mainImg.style.MozOpacity = opc/100;  

  opc += ntc;
  if(opc >= 100){ opc=20; }
  else{setTimeout("fdInImg()",spd);}
}


//onMouseOverによるイメージ＆タブ画像の差替え
function mouseTab(a){
	
    document.getElementById("tab"+a).src="img/top"+imgSrc_rdm[a]+"_tab.jpg"; 
    //tab反転
    if(a!=1){ document.getElementById("tab1").src="img/top"+imgSrc_rdm[1]+"_tab_r.jpg"; }
    if(a!=2){ document.getElementById("tab2").src="img/top"+imgSrc_rdm[2]+"_tab_r.jpg"; }
    if(a!=3){ document.getElementById("tab3").src="img/top"+imgSrc_rdm[3]+"_tab_r.jpg"; } 
    if(a!=4){ document.getElementById("tab4").src="img/top"+imgSrc_rdm[4]+"_tab_r.jpg"; } 
 
    document.mainImg.src  = "img/top"+imgSrc_rdm[a]+"_img.jpg"; 
    document.getElementById("mainImg").href = imgHrf_rdm[a];
    slideShow(0)
  }