const ResizeFunAry = [];
const LoadFunAry = [];
const ScrollFunAry = [];

window.addEventListener( "resize", function ( event ) {
	for( var F = 0; F < ResizeFunAry.length; F++ ) {
		if( typeof ResizeFunAry[F] == 'function' )  { ResizeFunAry[F](); }
	}
});

window.addEventListener( "load", function ( event ) {
	for( var F = 0; F < LoadFunAry.length; F++ ) {
		if( typeof LoadFunAry[F] == 'function' )  { LoadFunAry[F](); }
	}
});

window.addEventListener( 'scroll', function ( event ) {
	for( var F = 0; F < ScrollFunAry.length; F++ ) {
		if( typeof ScrollFunAry[F] == 'function' )  { ScrollFunAry[F](); }
	}
});

//設定行動裝置 input date placeholder
function SetInputDate() {
	var InputDateAry = document.querySelectorAll( "input[type='date']" );

	for( var A = 0; A < InputDateAry.length; A++ ) {
		var SelectDateDiv = document.createElement( 'div' );
			SelectDateDiv.innerHTML = InputDateAry[A].getAttribute( 'placeholder' );
			SelectDateDiv.classList.add( 'SelectDatePlaceholder' );

		InputDateAry[A].before( SelectDateDiv );

		InputDateAry[A].addEventListener( 'blur', function ( event ) {
			var SelectDatePlaceholderObj = this.parentNode.querySelector( '.SelectDatePlaceholder' );
			SelectDatePlaceholderObj.style.display = ( this.value != '' ) ? 'none' : '' ;
		});
	}
}

function ShowPW( ThisObj ) {
	var InputPWObj = ThisObj.parentNode.querySelector( 'input' );
	if( InputPWObj.getAttribute( 'type' ) == 'password' ) {
		InputPWObj.setAttribute( 'type', 'text' );
		ThisObj.innerHTML = 'visibility_off';
	} else {
		InputPWObj.setAttribute( 'type', 'password' );
		ThisObj.innerHTML = 'visibility';
	}
}


function ViewImage( ThisObj ) {
	var LinghtboxDivObj = LinghtboxDiv( 200, 200 );

	var ThisUrl = ThisObj.getAttribute( 'img' ); 
	ShowImage( ThisUrl );
}

function ReloadCIM( DfJson ) {
	var CID = DfJson['CID'];
	var CHKID = DfJson['CHKID'];
	var ReloadPath = DfJson['ReloadPath'];
	var DATE_OBJ = new Date();
	var NOW_SEC = DATE_OBJ.getTime();
	document.getElementById( CID ).src = '';
	document.getElementById( CID ).src = ReloadPath + '?CID='+ CHKID +'&'+ NOW_SEC;
}

function ShowImage( Url ) {
	var UrlAry = [];
	var UrlJson = {};
	var PhotoDivObj = document.querySelector( '.PhotoShow' );
	var AObjAry = PhotoDivObj.querySelectorAll( 'a' );
	for( var A = 0; A < AObjAry.length; A++ ) {
		UrlAry.push( AObjAry[A].getAttribute( 'img' ) );
		UrlJson[AObjAry[A].getAttribute( 'img' )] = AObjAry[A].getAttribute( 'title' );
	}

	var LinghtboxDivObj = document.getElementById( 'lightboxId' );
	LinghtboxDivObj.innerHTML = "<div style=\"width: 100%; text-align: center; padding: 75px 0px;\"><img src=\"/__/i/lightbox/loading.gif\" title=\"下載中..\" alt=\"下載中..\" style=\"width: 50px;\" /></div>";

	var GetPageSizeInfoAry = GetPageSizeInfo();

	var MPageW = GetPageSizeInfoAry['windowWidth'] - 50;
	var MPageH = GetPageSizeInfoAry['windowHeight'] - 150;

	var MainImg = new Image(); 
	MainImg.src = Url; 
	MainImg.alt = Url;
	MainImg.onload = function() {
		var ImgW = this.width;
		var ImgH = this.height;
		var Info = GetBgImageInfo( MPageW, MPageH, ImgW, ImgH );
		console.log(this.width);
		LinghtboxDivObj.innerHTML = '';
		LinghtboxDivObj.style.backgroundImage = '';
		LinghtboxDivObj.style.width = Info['Width']+'px';
		LinghtboxDivObj.style.marginTop = '-'+( parseInt( Info['Height'] ) / 2 )+'px';
		LinghtboxDivObj.style.height = Info['Height']+'px';
		LinghtboxDivObj.style.marginLeft = '-'+( parseInt( Info['Width'] ) / 2 )+'px';

		setTimeout( function () {
			LinghtboxDivObj.style.backgroundImage = "url( "+Url+" )";

			for( var A = 0; A < UrlAry.length; A++ ) {
				if( UrlAry[A] == Url ) {
					if( A > 0 ) { var PrevUrl = UrlAry[A-1]; }
					if( A + 1 != UrlAry.length ) { var NextUrl = UrlAry[A+1]; }
				}
			}
			if( PrevUrl ) {
				var AObj = document.createElement( 'a' );
					AObj.href = 'javascript:void(0);';
					AObj.classList.add( 'Prev' );
					AObj.title = 'Prev';
					AObj.setAttribute( 'img', PrevUrl );
					AObj.onclick = function () { ShowImage( this.getAttribute( 'img' ) ) };
				LinghtboxDivObj.appendChild( AObj );
			}

			if( NextUrl ) {
				var AObj = document.createElement( 'a' );
					AObj.href = 'javascript:void(0);';
					AObj.classList.add( 'Next' );
					AObj.title = 'Next';
					AObj.setAttribute( 'img', NextUrl );
					AObj.onclick = function () { ShowImage( this.getAttribute( 'img' ) ) };
				LinghtboxDivObj.appendChild( AObj );
			}

			var CloseObj = document.createElement( 'a' );
				CloseObj.href = 'javascript:void(0);';
				CloseObj.classList.add( 'Close' );
				CloseObj.title = 'Close';
				CloseObj.onclick = function () { CloseLightbox(  ); }
			LinghtboxDivObj.appendChild( CloseObj );

			var TitleObj = document.createElement( 'div' )
				TitleObj.classList.add( 'Title' );
				TitleObj.innerHTML = UrlJson[Url];
			LinghtboxDivObj.appendChild( TitleObj );
		}, 500 );
	}
}


function GetBgImageInfo( NewWidth, NewHeight, ImageWidth, ImageHeight ) {
	var ReturnInfoJson = {};
	NewWidth = parseInt( NewWidth );
	NewHeight = parseInt( NewHeight );
	ImageWidth = parseInt( ImageWidth );
	ImageHeight = parseInt( ImageHeight );
	if( NewWidth >= ImageWidth && NewHeight >= ImageHeight ) {
		ReturnInfoJson['Height'] = ImageHeight;
		ReturnInfoJson['Width'] = ImageWidth;
	} else {
		//W
		var NW_W = NewWidth;
		var NW_H = NewWidth / ImageWidth * ImageHeight;
		//H
		var NH_W = NewHeight / ImageHeight * ImageWidth;
		var NH_H = NewHeight;

		if( NW_H > NewHeight ) {
			ReturnInfoJson['Height'] = NH_H;
			ReturnInfoJson['Width'] = NH_W;
		} else {
			ReturnInfoJson['Height'] = NW_H;
			ReturnInfoJson['Width'] = NW_W;
		}
	}
	return ReturnInfoJson;
}


/*Radio Checkbox相關*/
var InputRadioCheckboxClass = new function() {

	var self = this;
	self.MainObj = document;

	self.Set = function( DfJson ) {
		if( DfJson['MainObj'] ) {
			self.MainObj = DfJson['MainObj'];
		}
	}

	self.SetAllInput = function () {
		var RadioCheckboxObjAry = self.MainObj.querySelectorAll( "input[type='radio'], input[type='checkbox']" );
		for( var S = 0; S < RadioCheckboxObjAry.length; S++ ) {
			if( RadioCheckboxObjAry[S].type == 'radio' ) {
				
				if( RadioCheckboxObjAry[S].checked == true ) {
					InputRadioCheckboxClass.RadioClickStyle( RadioCheckboxObjAry[S] );
				}

				RadioCheckboxObjAry[S].onclick = function () { 
					InputRadioCheckboxClass.RadioClickStyle( this ); 
					if( this.getAttribute( 'f' ) ) { 
						var FunValue = ( this.getAttribute( 'fv' ) ) ? this.getAttribute( 'fv' ) : 'this' ; 
						eval( this.getAttribute( 'f' )+"( "+FunValue+" )" ); 
					}
				};
			} else if( RadioCheckboxObjAry[S].type == 'checkbox' ) {

				if( RadioCheckboxObjAry[S].checked == true ) {
					InputRadioCheckboxClass.CheckboxClickStyle( RadioCheckboxObjAry[S] );
				}
				
				RadioCheckboxObjAry[S].onclick = function () { 
					InputRadioCheckboxClass.CheckboxClickStyle( this ); 
					if( this.getAttribute( 'f' ) ) { 
						var FunValue = ( this.getAttribute( 'fv' ) ) ? this.getAttribute( 'fv' ) : 'this' ; 
						eval( this.getAttribute( 'f' )+"( "+FunValue+" )" ); 
					}
				};
			}
		}
	}

	self.RadioClickStyle = function ( ThisObj ) {
		var Name = ThisObj.getAttribute( 'Name' );
		var InputObjAry = self.MainObj.querySelectorAll( "input[name='"+Name+"']" );
		for( var N = 0; N < InputObjAry.length; N++ ) {
			InputObjAry[N].parentNode.classList.remove( 'This' );
		}
		ThisObj.parentNode.classList.add( 'This' );
	}

	self.CheckboxClickStyle = function ( ThisObj ) {
		if( ThisObj.parentNode.classList.contains( 'This' ) ) { 
			ThisObj.parentNode.classList.remove( 'This' );
		} else { 
			ThisObj.parentNode.classList.add( 'This' );
		}
	}

	self.SetRadioStyle = function ( InputObj, V ) {
		for( var N = 0; N < InputObj.length; N++ ) {
			if( InputObj[N].value == V ) {
				InputObj[N].checked = true;
				InputObj[N].parentNode.classList.add( 'This' );
			} else {
				InputObj[N].checked = false;
				InputObj[N].parentNode.classList.remove( 'This' );
			}
		}
	}

	self.SetCheckboxStyle = function ( InputObj, VAry ) {
		if( InputObj.length > 1 ) {
			for( var N = 0; N < InputObj.length; N++ ) {
				if( InArray( InputObj[N].value, VAry ) ) {
					InputObj[N].checked = true;
					InputObj[N].parentNode.classList.add( 'This' );
				} else {
					InputObj[N].checked = false;
					InputObj[N].parentNode.classList.remove( 'This' );
				}
			}
		} else {
			for( var V = 0; V < VAry.length; V++ ){
				if( InputObj.value == VAry[V] ) {
					InputObj.checked = true;
					InputObj.parentNode.classList.add( 'This' );
				}
			}
		}
	}
	  
	self.ClearRadioStyle = function ( ThisObj ) {
		var Name = ThisObj.getAttribute( 'Name' );
		var InputObjAry = self.MainObj.querySelectorAll( "input[name='"+Name+"']" );
		for( var N = 0; N < InputObjAry.length; N++ ) {
			InputObjAry[N].parentNode.classList.remove( 'This' );
			InputObjAry.checked = false;
		}
	}

	self.ClearCheckboxStyle = function ( ThisObj ) {
		if( ThisObj.length > 1 ) {
			for( var N = 0; N < ThisObj.length; N++ ) {
				ThisObj[N].checked = false;
				ThisObj[N].parentNode.classList.remove( 'This' );
			}
		} else {
			ThisObj.checked = false;
			ThisObj.parentNode.classList.remove( 'This' );
		}
	}
}


function GetInputValue( ThisObj ) {
	var ReturnValue = false;
	var TheForm = ThisObj.form;
	var InputName = ThisObj.getAttribute( 'name' );
	var ThisObjId = ThisObj.id;
	switch( ThisObj.type ) {
		case 'text':
		case 'number':
		case 'textarea':
		case 'hidden':
		case 'date':
			ReturnValue = TheForm[InputName].value;
		break;

		case 'checkbox':
			ReturnValue = InputDfClass.GetCheckboxValue( TheForm[InputName] );
		break;

		case 'radio':
			ReturnValue = InputDfClass.GetRadioValue( TheForm[InputName] );
		break;

		case 'select-one':
			ReturnValue = TheForm[InputName].options[TheForm[InputName].selectedIndex].value ;
		break;
	}
	return ReturnValue;
}

var MarqueeFun = function( DfJson ) {

	var self = this;
	self.ImageID = DfJson['ImageID'];
	self.ImageMainID = DfJson['ImageMainID'];
	self.DfItemWidth = ( DfJson['ImageWidth'] ) ? DfJson['ImageWidth'] : 0 ;
	self.PageNum = ( DfJson['PageNum'] ) ? DfJson['PageNum'] : 0 ;
	self.MarqueeImageObj = document.getElementById( self.ImageID );
	self.ImageMainObj = self.MarqueeImageObj.querySelector( '.ImageMain' );

	self.ImageBtnLeftObj = self.MarqueeImageObj.querySelector( '.BtnLeft' );
	self.ImageBtnRightObj = self.MarqueeImageObj.querySelector( '.BtnRight' );

	self.PointTotal = self.ImageMainObj.querySelectorAll( '.Item' ).length;
	self.MarqueeSecond = 8000;
	self.NPoint = 0;
	self.NextPoint = 0;
	self.flag = 0;
	self.marquee;

	self.DfWidth = DfJson['DfWidth'];
	self.DfHeight = DfJson['DfHeight'];
	self.T = DfJson['T'];
	self.Mq = DfJson['Mq'];//是否要自動滑動

	//var W = ( self.DfItemWidth > 0 ) ? self.DfItemWidth : self.MarqueeImageObj.offsetWidth;
	
	self.$pointer = $('.Pointer li');
	self.ImageMain = Flipsnap('#'+self.ImageMainID, {
	    distance: ( self.DfItemWidth > 0 ) ? self.DfItemWidth : self.MarqueeImageObj.offsetWidth,
		maxPoint: self.PointTotal - self.PageNum - 1
	});
	self.ImageMain.element.addEventListener('fspointmove', function() {
	    self.$pointer.filter('.Current').removeClass('Current');
	    self.$pointer.eq(self.ImageMain.currentPoint).addClass('Current');
	}, false);

	self.ImageMain.element.addEventListener('fspointmove', function(ev) {
		self.NPoint = self.ImageMain.currentPoint;
		console.log( self.NPoint );
	}, false);

	self.Move = function() { 
		self.NextPoint = self.NPoint + 1;
		self.NextPoint = ( self.NextPoint >= self.PointTotal - self.PageNum ) ? 0 : self.NextPoint ;
		self.ImageMain.moveToPoint( self.NextPoint );

		if( self.Mq == 'Y' ) {
			self.marquee = setTimeout( function () {
				self.Move();
			}, self.MarqueeSecond );
			self.flag = 1;
		}
	}

	self.StartMove = function() {
		if( self.flag == 0 ) { 
			if( self.Mq == 'Y' ) {
				self.marquee = setTimeout( function () {
					self.Move()
				}, self.MarqueeSecond ); 
			}
		}
	}

	self.ResetMove = function() {
		if( self.flag == 0 ) { 
			if( self.Mq == 'Y' ) {
				self.marquee = setTimeout( function () {
					self.Move()
				}, self.MarqueeSecond );
			}
		}
	}

	self.ClearMove = function() {
		clearTimeout( self.marquee );
		self.flag = 0;
	}

	self.PrevMove = function() {
		PrevPoint = self.NPoint - 1;
		self.NextPoint = ( PrevPoint < 0 ) ? self.PointTotal - 1 : PrevPoint ; 
		self.ImageMain.moveToPoint( self.NextPoint );
	}

	self.NextMove = function() {
		self.NextPoint = self.NPoint + 1;
		self.NextPoint = ( self.NextPoint >= self.PointTotal - self.PageNum ) ? 0 : self.NextPoint ;
		self.ImageMain.moveToPoint( self.NextPoint );
	}

	self.SetInfo = function( DfJson ) {
		self.PageNum = ( DfJson['PageNum'] ) ? DfJson['PageNum'] : 0 ;
		var SetImageWidth = ( DfJson['ImageWidth'] ) ? DfJson['ImageWidth'] : self.DfItemWidth ;
		self.ClearMove();
		self.ImageMain.init( '#'+self.ImageMainID,  { 
			distance: ( SetImageWidth > 0 ) ? SetImageWidth : self.MarqueeImageObj.offsetWidth,
			maxPoint: self.PointTotal - self.PageNum - 1
		} );
		self.ImageMain.moveToPoint( self.NPoint + 1 );
		self.StartMove();
	}

	self.SetResize = function() {
		if( self.T == 'Ad' ) {
			self.ImageWidth = ( self.DfItemWidth > 0 ) ? self.DfItemWidth : self.MarqueeImageObj.offsetWidth;
			self.ImageMainObj.style.width = self.ImageWidth * self.PointTotal + 'px';
			self.ImageMainObj.style.height = 'auto';

			var H = 0;
			H = parseInt( self.ImageWidth ) / self.DfWidth * self.DfHeight;

			if( H <= 250 )  { H = 250; }

			var ItemObjAry = self.ImageMainObj.querySelectorAll( '.Item' );
			for( var A = 0; A < ItemObjAry.length; A++ ) {

				ItemObjAry[A].style.width = self.ImageWidth + 'px';
				ItemObjAry[A].style.height =  H + 'px';
			}
			
			self.ImageMainObj.style.height = H + 'px';
		} else if( self.T == 'Product' ) {
			self.ImageWidth = self.MarqueeImageObj.offsetWidth / ( self.PageNum + 1 );
			self.ImageMainObj.style.width = self.ImageWidth * self.PointTotal + 'px';
			self.ImageMainObj.style.height = 'auto';

			var ItemObjAry = self.ImageMainObj.querySelectorAll( '.Item' );
			for( var A = 0; A < ItemObjAry.length; A++ ) {
				ItemObjAry[A].style.width = self.ImageWidth + 'px';
			}
		}
	}

	self.Set = function() {
		self.MarqueeImageObj.addEventListener( 'touchstart', function(e) { 
			//e.preventDefault();
			self.ClearMove(); 
		}, false );
		self.MarqueeImageObj.addEventListener( 'touchend', function(e) { 
			//e.preventDefault();
			self.ResetMove(); 
		}, false );
		self.MarqueeImageObj.addEventListener( 'mouseover', function(e) {
			//e.preventDefault(); 
			self.ClearMove(); 
		}, false );
		self.MarqueeImageObj.addEventListener( 'mouseout', function(e) { 
			//e.preventDefault();
			self.ResetMove(); 
		}, false );

		self.ImageBtnLeftObj.addEventListener( 'click', function() { self.PrevMove(); }, false );
		self.ImageBtnRightObj.addEventListener( 'click', function() { self.NextMove(); }, false );
	}
}