/*
	[CISA] Common image slide set A
*/

;(function ( $ ) {
	
	
	// youtube load
	var tag = document.createElement('script');
	tag.src = "https://www.youtube.com/iframe_api";
	var firstScriptTag = document.getElementsByTagName('script')[0];
	firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
	
	$(document).ready(function(){
		// init
		
		// string for youtube ID creation
		var frameIdSeed = "cisaYoutubeFrameId";
		
		// The id of the video to play by default when an empty YouTube ID comes in.
		var defaultYoutubeID = "KA2R6jJE9o4";
		
		// youtube video players
		var youtubeVideos = [];
		
		// component slider class or id
		var slideComponentClass = ".sliderWrap.cisaSlider";
		
		// CISA component length check
		if($(slideComponentClass).length>0){
			
			// IX Slider
			var $slide = $(slideComponentClass).on('ixSlideMax:init', function(){
				
				// data=tabindexon : ix slider 내 포커스될 아이템들의 tabindex 관리
				ixSlider_focusItem_tabindexSwitcher();

				ixSlider_pagerCountControl();

			}).ixSlideMax();
			$( window ).on( 'resize', function() {
				$slide.ixSlideMax( 'resize' );
			});
			
			// Slider 가 바뀌기 전에 호출
			$(slideComponentClass).on('ixSlideMax:slideStart', function(){
				// ix Slider slide start

				// stop video when sliding is started
				var slideIndex = $(slideComponentClass).ixSlideMax( "getCurrentIndex" );

				// case : html5 video
				var slideHtml5Video = $(slideComponentClass + " .ix-list-item").eq(slideIndex).find(".html5Video");
				var slideVideo =  $(slideHtml5Video).find("video").get(0);
				if(slideVideo){
						slideVideo.pause();

						// show video cover & default image & play button
						html5VideoCoverUIOn(slideHtml5Video);
				}

				// Case : youtube video
				var youtubeWrap = $(slideComponentClass + " .ix-list-item").eq(slideIndex).find(".youtube");
				var slideYoutubeVideo = youtubeWrap.find(".youtubeFrame");
				if(slideYoutubeVideo.length){
					youtubeVideos[slideYoutubeVideo.attr("id")];
					youtubeVideoCoverUIOn(youtubeWrap);
				}
			});

			// ix-slider event : after slider changed
			$(slideComponentClass).on('ixSlideMax:change', function(){			
				// data=tabindexon : ix slider 내 포커스될 아이템들의 tabindex 관리
				ixSlider_focusItem_tabindexSwitcher();
			});
			
			// Html5VideoControl
			var videoWrap = slideComponentClass + " .html5Video";
			if($(videoWrap).length > 0)
			{

				// Video Container click & tab
				$(document).on("click", videoWrap, function(){

					var targetHtml5Video = $(this).find("video").get(0);

					// 비디오 종료 시
					$(targetHtml5Video).on("ended",function(){

						var targetHtml5VideoWrap = $(this).closest(".html5Video");
						$(this).currentTime = 0;

						// cover on
						html5VideoCoverUIOn(targetHtml5VideoWrap);

					});

					// 비디오 클릭 시. 비디오가 멈춤 상태 또는 종료 상태 일 경우
					if (targetHtml5Video.paused || targetHtml5Video.ended) {

						// cover off
						if(targetHtml5Video.paused){
							html5VideoCoverUIOff(this,true);
						} else {
							html5VideoCoverUIOff(this);
							var videoName = $(this).find(".videoPoster").find("img").attr("alt");
                                
                                _trackEvent(
                                        $.extend(_dl,{
                                            video_name : videoName, // video play 하는 경우의 video 이름
                                            page_event : {
                                                video_play : true, // 비디오 재생시
                                            }
                                        })
                                );
						}

						targetHtml5Video.play();


					} else {
						// 비디오 클릭 시. 비디오가 재생 중 일 경우
						// cover on
						html5VideoCoverUIOn(this, true);
						targetHtml5Video.pause();
					}
				});

			}
			

			// youtube
			var youtubeWrap = slideComponentClass + " .youtube";
			if($(youtubeWrap).length > 0){
				//youtubeVideo load
				// script 방식으로 로드

				$(document).on("youtubeScriptReady",slideComponentClass, function(){
					var youtubeWrap = slideComponentClass + " .youtube";
					$(youtubeWrap).each(function(){

						var indexNum = $(youtubeWrap).index(this);
						var targetYoutubeVideoContainer = $(this).find(".youtubeFrame");
						var targetYoutubeId = targetYoutubeVideoContainer.data("youtubeid");
						var targetVideoIframeID = frameIdSeed+indexNum+targetYoutubeId;
						targetYoutubeVideoContainer.attr("id",  targetVideoIframeID);

						if(!targetYoutubeId){
							// default Youtube video
							targetYoutubeId = defaultYoutubeID;
						}

						//console.log("* make youtube : [" + indexNum + "] ,id : #"+targetVideoIframeID + " , youtubeVideoId : " + targetYoutubeId);

						youtubeVideos[targetVideoIframeID] = new YT.Player(targetVideoIframeID, {
							videoId: targetYoutubeId,
							playerVars: { 'autoplay': 0, 'controls': 0, 'rel' :0, 'ecver' : 2, 'showinfo':0, 'fs':0, 'modestbranding':0 },
							width: 640,
							height: 360,
							events: {
							'onReady': onPlayerReady,
							'onStateChange': onPlayerStateChange,
							'onError': onPlayerError
							}
						});
					});

					$(document).on("click", youtubeWrap, function(){
						//var indexNum = $(youtubeWrap).index(this);
						var targetYoutubeVideoContainer = $(this).find(".youtubeFrame");

						var targetVideoIframeID = targetYoutubeVideoContainer.attr("id");

						//var targetYoutubeId = targetYoutubeVideoContainer.data("youtubeid");
						youtubeVideoCoverUIOff(this);

						var playBtn = $(this).find(".videoPlayBtn");
						playBtn.fadeOut();
						youtubeVideos[targetVideoIframeID].playVideo();
					});

				});
			}

			$(document).on("keyup", slideComponentClass + " .fullImg", function(e){
				var targetBtn = e.currentTarget;
				var playBtn;

				//var keyCode = e.keyCode || e.which;//키보드 코드값  
				// Enter 키 번호 13
				if (e.keyCode == '13' || e.keyCode == '32') {
					if($(targetBtn).hasClass("html5Video")){

						// html5 video
						$(targetBtn).trigger("click");

					} else if($(targetBtn).hasClass("youtube")){

						// youtube video
						var targetYoutubeVideoContainer = $(targetBtn).find(".youtubeFrame");
						var targetVideoIframeID = targetYoutubeVideoContainer.attr("id");
						//var targetYoutubeId = targetYoutubeVideoContainer.data("youtubeid");

						youtubeVideoCoverUIOff(this);
						//console.log("targetVideoIframeID > index : " + indexNum + " ,id : #"+targetVideoIframeID + " , youtubeVideoId : " + targetYoutubeId);

						playBtn = $(this).find(".videoPlayBtn");
						playBtn.fadeOut();

						var targetYoutubeState = youtubeVideos[targetVideoIframeID].getPlayerState();

						if( targetYoutubeState == 1){
							youtubeVideos[targetVideoIframeID].pauseVideo();
						} else {
							youtubeVideos[targetVideoIframeID].playVideo();
						}
						
						$(targetBtn).focus();

					}
				}

			});

			// pager 갯수 채크 : 1개 이하 일 때  prev, next, pager 숨김
			function ixSlider_pagerCountControl(){
				var countSlideItems = $(slideComponentClass + " .ix-btn").length;
				if(countSlideItems <= 1){
					$(slideComponentClass + " .ix-controller").hide();
				} else {
					$(slideComponentClass + " .ix-controller").show();
				}
			}
			
		}

		// Video Cover(Dimmed), Default Image, PlayButton : On
		function html5VideoCoverUIOn(t, pause){
			var targetHtml5VideoContainer = $(t).find("video");
			var html5Dim = $(t).find(".videoInnerDimm");
			var html5DefaultImg = $(t).find(".videoPoster");
			var playBtn = $(t).find(".videoPlayBtn");
			
			if(!pause){
				targetHtml5VideoContainer.css("visibility", "hidden");
				html5Dim.fadeIn();
				html5DefaultImg.css("visibility", "visible");
				playBtn.fadeIn();
			} else {
				playBtn.show().fadeOut(800);
			}
			
		}
		
		// Video Cover(Dimmed), Default Image, PlayButton : Off
		function html5VideoCoverUIOff(t, pause){
			var targetHtml5VideoContainer = $(t).find("video");
			var html5Dim = $(t).find(".videoInnerDimm");
			var html5DefaultImg = $(t).find(".videoPoster");
			var playBtn = $(t).find(".videoPlayBtn");
			
			if(!pause){
				targetHtml5VideoContainer.css("visibility", "visible");
				html5Dim.fadeOut();
				html5DefaultImg.css("visibility", "hidden");
				playBtn.fadeOut();
			} else {
				targetHtml5VideoContainer.css("visibility", "visible");
				html5Dim.fadeOut();
				html5DefaultImg.css("visibility", "hidden");
				playBtn.show().fadeOut(800);
			}
		}

		// Video Cover(Dimmed), Default Image, PlayButton : On
		function youtubeVideoCoverUIOn(t){
			
			var targetYoutubeVideoContainer = $(t).find(".youtubeFrame");
			var YoutubeDim = $(t).find(".videoInnerDimm");
			var YoutubeDefaultImg = $(t).find(".videoPoster");
			var playBtn = $(t).find(".videoPlayBtn");
			
			YoutubeDim.css("visibility", "visible");
			YoutubeDefaultImg.css("visibility", "visible");
			playBtn.fadeIn();
			targetYoutubeVideoContainer.css("visibility", "hidden");
		}
		
		// Video Cover(Dimmed), Default Image, PlayButton : Off
		function youtubeVideoCoverUIOff(t){
			
			var targetYoutubeVideoContainer = $(t).find(".youtubeFrame");
			var YoutubeDim = $(t).find(".videoInnerDimm");
			var YoutubeDefaultImg = $(t).find(".videoPoster");
			var playBtn = $(t).find(".videoPlayBtn");
			
			YoutubeDim.css("visibility", "hidden");
			YoutubeDefaultImg.css("visibility", "hidden");
			playBtn.fadeOut();
			targetYoutubeVideoContainer.css("visibility", "visible");
		}
		
		function onPlayerReady(event) {
			//console.log("> " + event.target + " >  youtube player Ready!");
			$(event.target).css("visibility", "visible");
			var youtubeWrap = "";
        var videoName = "";

        youtubeWrap = " .youtube";
        videoName = $("#"+$(event.target.i).attr("id")).closest(".fullImg.youtube").find(".videoPoster").find("img").attr("alt");
        
        $("#"+$(event.target.i).attr("id")).closest(youtubeWrap).off("click").on("click", function(){
            var targetYoutubeVideoContainer = $(this).find(".youtubeFrame");

            var targetVideoIframeID = targetYoutubeVideoContainer.attr("id");
            
            cisa_youtubeVideoCoverUIOff(this);

            var playBtn = $(this).find(".videoPlayBtn");
            playBtn.fadeOut();
            event.target.playVideo();
            
            _trackEvent(
                $.extend(_dl,{
                    video_name : videoName, // video play 하는 경우의 video 이름
                    page_event : {
                        video_play : true, // 비디오 재생시
                    }
                })
            );
        });
			
		}
		function onPlayerStateChange(event) {
			//console.log("> " + event.target + " >  youtube player Statechange!");
			
			var slideIndex = $(slideComponentClass).ixSlideMax( "getCurrentIndex" );
			var slideYoutubeVideo = $(slideComponentClass + " .ix-list-item").eq(slideIndex).find(".youtube");
			
			switch(event.data){
				case 0 :
					//console.log("  => youtube 종료" );
					
					if(slideYoutubeVideo.length){
						youtubeVideoCoverUIOn(slideYoutubeVideo);
					}
					
					break;
				case 2 :
					//console.log("  => youtube 멈춤" );
					if(slideYoutubeVideo.length){
						//youtubeVideoCoverUIOn(slideYoutubeVideo);
					}
					break;
				case 1 :
					//console.log("  => youtube 재생중" );
					
					if(slideYoutubeVideo.length){
						youtubeVideoCoverUIOff(slideYoutubeVideo);
					}
					break;
			}
		}
		function onPlayerError(event){
			console.log("* Youtube API Error occured.");
			switch (event.data){
				case 2 : 
					console.log("-> Requests includes invalid parameter.");
					break;
				case 5 : 
					console.log("-> Requested content cannot be played.");
					break;
				case 100 : 
					console.log("-> Requested content cannot be found.");
					break;
				case 101 :
				case 150 : 
					console.log("-> This content is not allowed to playing on built-in player.");
					break;
			}
		}
		
		// data=tabindexon : ix slider 내 포커스될 아이템들의 tabindex 관리
		function ixSlider_focusItem_tabindexSwitcher(){
			// tabindexon data가 true인 tabindex="-1"을 tabindex="0"으로 바꿈
			$(slideComponentClass + ' .ix-list-items .ix-list-item[aria-hidden="true"] [data-tabindexon="true"]').attr("tabindex","-1");
			$(slideComponentClass + ' .ix-list-items .ix-list-item[aria-hidden="false"]').each(function(){
				$(this).find("[data-tabindexon='true']").attr("tabindex","0");
			});
		}
		
		// 180709 vertical middle add
		function arrowVer (){
			var imgV = $('.cisaSlider .ix-list-items').height(), btnV = $('.cisaSlider .sliderBtnWrap').find('> button').height(),
			sPg = $('.cisaSlider .sliderPagination');
			$('.cisaSlider .sliderBtnWrap').find('> button').css({'top' : imgV/2, 'margin-top' : -btnV/2});
			$(sPg).css('top', imgV - (18 + sPg.height()));
		}
		$(document).ready(arrowVer);
		$(window).resize(arrowVer);
		// / 180709 vertical middle add
		
	});

})( jQuery );

function onYouTubeIframeAPIReady() {
	//console.log("> youtubeScript Ready!");
	$(document).find(".sliderWrap.cisaSlider").trigger("youtubeScriptReady");
}