/*
 *
 *
 *【 FOR SUGAWARA SEIKATEN / SOUTHEAST　ORIGINAL IMAGE VIEWER 】
 * ©SOUTHEAST All rights Reserved.
 * 許可なく無断転載、改変、転用等は法律により罰せられます。
 * MENUのビューワー
 *
*/

var timerImg01;
var count_hensu;
var id_name;


document.addEventListener('DOMContentLoaded', function(){
viewSlide('timerImg01','.inter01','inter01','inter01', -1, 0);
});//end DOMContentLoaded




function viewSlide(timer_name, className, idName, timerName, slideNo, count_hensu) {
//console.log("slideNo = "+slideNo);
id_name = timer_name;//重要（ここで指定するけど、変数扱いは変わらないのでid_nameでいく）
//console.log("id_name = " + id_name);
//console.log("timer_name = " + timer_name);
var imgArray = document.querySelectorAll(className+' ul.imageviewer li');
//console.log(imgArray);


/*【なくてもいい】最初の読み込み時、下の2枚目消す*/
if (slideNo == -1) {
//console.log("読み込み時 = "+slideNo);
gsap.set( imgArray[0], {zIndex:5, overwrite:true,} );
gsap.set( imgArray[1], {zIndex:2, overwrite:true,} );
gsap.set( imgArray[2], {zIndex:1, overwrite:true,} );
gsap.set( imgArray[3], {zIndex:3, overwrite:true,} );
gsap.set( imgArray[4], {zIndex:4, overwrite:true,} );
}
/*【なくてもいい】最初の読み込み時、下の2枚目消す*/


/*指定の画像を下に*/
if (slideNo == 0) {
/*下にもあるから意味ないかも*/
gsap.set( imgArray[0], {zIndex:5, overwrite:true,} );
gsap.set( imgArray[1], {zIndex:1, overwrite:true,} );
gsap.set( imgArray[2], {zIndex:2, overwrite:true,} );
gsap.set( imgArray[3], {zIndex:3, overwrite:true,} );
gsap.set( imgArray[4], {zIndex:4, overwrite:true,} );

}else if (slideNo == 1) {
gsap.set( imgArray[0], {zIndex:4, overwrite:true,} );
gsap.set( imgArray[1], {zIndex:5, overwrite:true,} );
gsap.set( imgArray[2], {zIndex:1, overwrite:true,} );
gsap.set( imgArray[3], {zIndex:2, overwrite:true,} );
gsap.set( imgArray[4], {zIndex:3, overwrite:true,} );

}else if (slideNo == 2) {
gsap.set( imgArray[0], {zIndex:3, overwrite:true,} );
gsap.set( imgArray[1], {zIndex:4, overwrite:true,} );
gsap.set( imgArray[2], {zIndex:5, overwrite:true,} );
gsap.set( imgArray[3], {zIndex:1, overwrite:true,} );
gsap.set( imgArray[4], {zIndex:2, overwrite:true,} );

}else if (slideNo == 3) {
gsap.set( imgArray[0], {zIndex:2, overwrite:true,} );
gsap.set( imgArray[1], {zIndex:3, overwrite:true,} );
gsap.set( imgArray[2], {zIndex:4, overwrite:true,} );
gsap.set( imgArray[3], {zIndex:5, overwrite:true,} );
gsap.set( imgArray[4], {zIndex:1, overwrite:true,} );

}else if (slideNo == 4) {
gsap.set( imgArray[0], {zIndex:1, overwrite:true,} );
gsap.set( imgArray[1], {zIndex:2, overwrite:true,} );
gsap.set( imgArray[2], {zIndex:3, overwrite:true,} );
gsap.set( imgArray[3], {zIndex:4, overwrite:true,} );
gsap.set( imgArray[4], {zIndex:5, overwrite:true,} );

}



//console.log(slideNo);
slideNo++;

if (slideNo >= imgArray.length) {
slideNo = 0;
//console.log("動作3");
gsap.set( imgArray[0], {zIndex:5, overwrite:true,} );
gsap.set( imgArray[1], {zIndex:1, overwrite:true,} );
gsap.set( imgArray[2], {zIndex:2, overwrite:true,} );
gsap.set( imgArray[3], {zIndex:3, overwrite:true,} );
gsap.set( imgArray[4], {zIndex:4, overwrite:true,} );
}

/*最初にUI隠した場合はここで表示*/

/*指定の画像を上に移動して、0から100%表示*/
gsap.set( imgArray[slideNo], { zIndex:5, "clip-path": "polygon(100% 0%, 100% 0%, 100% 100%, 100% 100%)", opacity:1, transformOrigin: "top right", overwrite:true, });//ここopacity追加
gsap.set( imgArray[slideNo].getElementsByClassName('photo_zone')[0], { x:"0px", scale:1.0, overwrite:true, });
gsap.to(imgArray[slideNo], 2, { "clip-path": "polygon(-1% 0%, 100% 0%, 100% 100%, -1% 100%)", transformOrigin: "top right", ease: Expo.easeOut, overwrite:true, });
gsap.to( imgArray[slideNo].getElementsByClassName('photo_zone')[0], 12, { x:"0px", scale:1.08, ease:Linear.easeNone, overwrite:true, });




count_hensu++;



id_name = setTimeout(function(){
viewSlide(timer_name, className, idName, timerName, slideNo, count_hensu);
//console.log("ここ　count_hensu　=　"　+　count_hensu);
}, 10000);



}//end function viewSlide()--------------------------------------------------------------------------------