import 'gsap';

class animation {
	/**
	 * @Author   rucky
	 * @DateTime 2018-05-16
	 * @param    {Object}   game [game object]
	 * @param    {Object}   view [view object]
	 * @param    {Object}   ani  [animations object]
	 * @return   
	 */
	constructor(game,view,ani) {
	  	this.game = game;
	  	this.view = view;
	  	this.ani  = ani;

	  	this.init();
	}
	init(){
		
	}

	commonBtnAni(target,callbacks,onStart){
		if(this.game.buttonDisabled) return 
		this.game.buttonDisabled = !this.game.buttonDisabled;
        let timeline = new TimelineMax({
        	onStart:()=>{
        		onStart &&onStart();
        		// !this.game.mute && createjs.Sound.play('button');
        	},
        	onComplete:()=>{
        		timeline.kill();
        		callbacks&&callbacks();
        		this.game.buttonDisabled = !this.game.buttonDisabled;
        	}});

        timeline
        .to(target,.4,{scaleX:target.scaleX*.9,scaleY:target.scaleY*.9})
        .to(target,.2,{scaleX:target.scaleX,scaleY:target.scaleY})
    }
	/**
	 * @Author   rucky
	 * @DateTime 2018-05-16
	 * @param    {Object}   argument [many prama]
	 * {
	 * 		now:          null,		//
	 *      next:         null,
	 *      effect:       'fade', 	//scale | translate | fade
	 *      translateOut: false,
	 *      translateIn:  false,
	 *      scaleOut:     false,
	 *      scaleIn:      false,
	 *      direction:    'x', 	
	 * }
	 * @return   {null}
	 */
	changePage(argument){
		let _default = {
			now:          null,
			next:         null,
			effect:       'fade', 	//scale | translate | fade
			translateOut: false,
			translateIn:  false,
			scaleOut:     false,
			scaleIn:      false,
			direction:    'x', 	
			onStart:      function(){},
			callbacks:    function(){},
		}

		let opts = Object.assign({}, _default, argument );

		let timeLine = new TimelineMax({
			onStart:()=>{
				opts.onStart && opts.onStart();
				// !this.game.mute && this.game.soundLoader && this.game.soundLoader.getResult('open') &&createjs.sound.play('open')
			},
			onComplete:()=>{
				opts.callbacks && opts.callbacks();
				timeLine.kill();
			}
		})
		let hideData      = {alpha:0,autoAlpha:0};
		let showStartData = {alpha:0,x:0,y:0,autoAlpha:0};
		let showEndData   = {alpha:1,autoAlpha:1};


		if(opts.effect == 'scale'){
			hideData.scaleX = .99;
			hideData.scaleY = .99;
			showStartData.scaleX = .99;
			showStartData.scaleY = .99;
			showEndData.scaleX   = 1;
			showEndData.scaleY   = 1;
		}
		if(opts.effect == 'translate'){
			if(opts.direction == 'x')
				hideData.x = -750;
			else 
				hideData.y = -1450;
		
			if(opts.direction == 'x'){
				showStartData.x = 750;
				showEndData.x   = 0;
			}
			else{
				showStartData.y = 1450;
				showEndData.y   = 0;
			}
		}
		
		if(opts.effect == 'translate' && opts.direction == 'y'){
			timeLine
			.to(opts.now,.6,hideData,'start')
			.fromTo(opts.next,.6,showStartData,showEndData,'start')
			// .to(this.game.gameView.interfaceBackground,.3,{y:-30},'start')
			// .to(this.game.gameView.interfaceBackground,.5,{y:0},'start+=.3')
		}else{
			timeLine
			.to(opts.now,.6,hideData,'start')
			.fromTo(opts.next,.6,showStartData,showEndData,'start')
		}
	}

	loadingAnimations(){
		let A = {};
		let view = this.game.loadingView;
		//progress animation
		let progress = {value : 0};

		A.overProgress = TweenMax.to(progress,.5,{value:100,ease:Linear.easeNone,paused:true,
			onUpdate:()=>{
				view.loading_progress_text.text = Math.floor(progress.value)+'%';
				view.loading_progress_bar.graphics.command.w = progress.value/100 * 376;
			},
			onComplete:()=>{
				this.game.loadingAniEnding = true;
			}
		})

		// console.log(view.loading_progress_bar.graphics)
		TweenMax.to(progress,4,{value:86,ease:Linear.easeNone,
			onUpdate:()=>{
				view.loading_progress_text.text = Math.floor(progress.value)+'%';
				view.loading_progress_bar.graphics.command.w = progress.value/100 * 376;
			},
			onComplete:()=>{
				// this.game.loadingAniEnding = true;
				if(this.game.mainResourceLoaded === true){
					A.overProgress.play();
				}else{
					this.watch(this.game,'mainResourceLoaded',()=>{
						if(this.game.mainResourceLoaded === true){
							A.overProgress.play();
						}
					})
				}
			}
		})

		A.flashEye = new TimelineMax({repeat:-1,repeatDelay:1.5})
		.fromTo([view.loading_eye_1,view.loading_eye_2],.6,{scaleY:1,alpha:1},{scaleY:.1,alpha:.5})
		.to([view.loading_eye_1,view.loading_eye_2],.3,{scaleY:1,alpha:1})

		// console.log(view.loading_bingo.parent.mask.x)

		A.drawAni = new TimelineMax()
		.fromTo(view.loading_pen,.6,
			{x:view.loading_pen.ox,y:view.loading_pen.oy},
			{x:view.loading_pen.ox+12,y:view.loading_pen.oy-8,ease:Linear.easeNone
		},'start')
		.fromTo(view.loading_bingo.parent.mask,.6,{x:-100},{x:-91,ease:Linear.easeNone},'start+=.2')

		.to(view.loading_pen,.6,
			{x:view.loading_pen.ox+36,y:view.loading_pen.oy+32,ease:Linear.easeNone}
		,'start2')
		.to(view.loading_bingo.parent.mask,.6,
			{x:-54,ease:Linear.easeNone}
		,'start2+=.15')

		.to(view.loading_pen,.6,
			{x:view.loading_pen.ox+96,y:view.loading_pen.oy-33,ease:Linear.easeNone}
		,'start3')
		.to(view.loading_bingo.parent.mask,.6,
			{x:0,ease:Linear.easeNone}
		,'start3')
		.timeScale(.5)


		return A
	}

	indexAnimations(){
		let A = {};
		let gameView = this.game.gameView;

		//wait ani
		A.waitLine = new TimelineMax({
			paused:true,
			repeat:-1,
			yoyo:true
		})

		for(let i = 1; i < 10; i++){
			A.waitLine
			
			.fromTo(gameView[`index_text_${i}`],Math.random() * 2 + 1,
				{rotation:0},
				{rotation:(Math.random()>.5?1:-1) * Math.random() * 10+5,ease:Linear.easeNone},
				`start`
			)
			.to(gameView[`index_text_${i}`],Math.random() * 1 + 1,
				{rotation:0,ease:Linear.easeNone},
				`start2`
			)
		}

		//show ani
		A.textTimeLine = new TimelineMax({
			paused:true
		})

		let speArr = [1,2,4,5],
			speArr2= [6,7,8,9]
		for(let i = 1; i < 10; i++){
			let timelineSpan = new TimelineMax()
			//text
			.fromTo(gameView[`index_text_${i}`],1,
				{y:gameView[`index_text_${i}`].oy-700,x:gameView[`index_text_${i}`].ox-200},
				{y:gameView[`index_text_${i}`].oy,x:gameView[`index_text_${i}`].ox,ease:i > 5 ? Back.easeOut.config(0) : Back.easeOut.config(1.2)},
				`text_${i}`
			)
			//line
			.fromTo(gameView[`index_line_${i}`],1,
				{y:gameView[`index_line_${i}`].oy-700,x:gameView[`index_line_${i}`].ox-200},
				{y:gameView[`index_line_${i}`].oy,x:gameView[`index_line_${i}`].ox,ease:i > 5 ? Back.easeOut.config(0) : Back.easeOut.config(1.2)},
				`text_${i}`
			)
			.fromTo(gameView[`index_text_${i}`],.5,
				{rotation:0},
				{rotation:-25},
				`text_${i}+=.4`
			)
			.to(gameView[`index_text_${i}`],.6,
				{rotation:0},
				`text_${i}+=1`
			)
			.timeScale(2.2)
			// if(speArr.indexOf(i) > -1){
			// 	let index = speArr2[speArr.indexOf(i)];

			// 	timelineSpan

			// 	.fromTo(gameView[`index_text_${index}`],1,
			// 		{y:gameView[`index_text_${index}`].oy-700},
			// 		{y:gameView[`index_text_${index}`].oy,ease:Back.easeOut.config(1.2)},
			// 		`text_${i}`
			// 	)
			// 	//line
			// 	.fromTo(gameView[`index_line_${index}`],1,
			// 		{y:gameView[`index_line_${index}`].oy-700},
			// 		{y:gameView[`index_line_${index}`].oy,ease:Back.easeOut.config(1.2)},
			// 		`text_${i}`
			// 	)
			// 	.fromTo(gameView[`index_text_${index}`],.5,
			// 		{rotation:0},
			// 		{rotation:-25},
			// 		`text_${i}+=.4`
			// 	)
			// 	.to(gameView[`index_text_${index}`],.6,
			// 		{rotation:0},
			// 		`text_${i}+=1`
			// 	)
			// 	// timelineSpan.add(otherLine,'same_${i}')
			// }
			

			A.textTimeLine.add(timelineSpan,`-=${i == 1 ? 0 : .6}`)
			A.textTimeLine.timeScale(1.2)
		}

		//other show animations
		A.textTimeLine
		.fromTo(
			gameView.index_robot,
			.7,
			{y:gameView.index_robot.oy-1400},
			{y:gameView.index_robot.oy,ease:Back.easeOut.config(1.2),
				onStart:()=>{
					A.waitLine.play();
				},
				onComplete:()=>{
					A.robotFloat = TweenMax.to(gameView.index_robot,1,{y:gameView.index_robot.oy+20,yoyo:true,repeat:-1})
					A.askFloat = TweenMax.to(gameView.index_ask,1,{y:gameView.index_ask.oy+20,yoyo:true,repeat:-1})
				}
			},
			'robot-=.3'
		)
		.fromTo(
			gameView.index_ask,
			.7,
			{x:gameView.index_ask.ox-150,alpha:0},
			{x:gameView.index_ask.ox,alpha:1,ease:Back.easeOut.config(1.2)},
			'robot+=.2'
		)
		.fromTo(
			gameView.index_btn,
			.7,
			{y:gameView.index_btn.oy-1400+122/2},
			{y:gameView.index_btn.oy+122/2,ease:Back.easeOut.config(1.2),
				onComplete:()=>{
					A.robotFloat = TweenMax.to(gameView.index_btn,1,{scaleX:.95,scaleY:.95,ease:Elastic.easeOut.config(1, 0.3),yoyo:true,repeat:-1})
				}
			},
			'robot-=.3'
		)
		.fromTo(
			gameView.index_pipe,
			.7,
			{y:-800},
			{y:gameView.index_pipe.oy,ease:Back.easeOut.config(1.2)},
			'robot-=.3'
		)
		.fromTo(
			[gameView.index_title,gameView.index_desc],
			.7,
			{alpha:0},
			{alpha:1},
			'robot+=.3'
		)
		.fromTo(
			[gameView.index_stars_1],
			.7,
			{x:gameView.index_stars_1.ox+300,alpha:0},
			{x:gameView.index_stars_1.ox,alpha:1},
			'robot+=.3'
		)
		.fromTo(
			[gameView.index_stars_2],
			.7,
			{x:gameView.index_stars_2.ox-300,alpha:0},
			{x:gameView.index_stars_2.ox,alpha:1},
			'robot+=.55'
		)
		.fromTo(
			[gameView.index_stars_3],
			.7,
			{x:gameView.index_stars_3.ox-300,alpha:0},
			{x:gameView.index_stars_3.ox,alpha:1},
			'robot+=.625'
		)
		.fromTo(
			[gameView.index_star_2],
			.7,
			{x:gameView.index_star_2.ox-300,alpha:0},
			{x:gameView.index_star_2.ox,alpha:1},
			'robot+=.7'
		)
		.fromTo(
			[gameView.index_leida],
			.7,
			{x:gameView.index_leida.ox+300,alpha:0},
			{x:gameView.index_leida.ox,alpha:1},
			'robot+=.8'
		)
		.fromTo(
			[gameView.index_star_1],
			.7,
			{x:gameView.index_star_1.ox+300,alpha:0},
			{x:gameView.index_star_1.ox,alpha:1},
			'robot+=.9'
		)
			


		
		// 暂停
		A.pause = function(){
			A.textTimeLine.pause();
		}

		// 开始
		A.play = function(){
			A.textTimeLine.play();
		}


		return A
	}

	createAnimations(){
		let A = {},
			gameView = this.game.gameView;

		A.showTimeLine = new TimelineMax({
			paused:true
		})

		for(let i = 1; i < 7; i++){

			// console.log(gameView[`create_text_${i}`])
			let timelineSpan = new TimelineMax()
			//text
			.fromTo(gameView[`create_text_${i}`],1,
				{y:gameView[`create_text_${i}`].oy-100,x:gameView[`create_text_${i}`].ox-600},
				{y:gameView[`create_text_${i}`].oy,x:gameView[`create_text_${i}`].ox,ease:i > 5 ? Back.easeOut.config(0) : Back.easeOut.config(1.2)},
				`text_${i}`
			)
			//line
			.fromTo(gameView[`create_line_${i}`],1,
				{y:gameView[`create_line_${i}`].oy-100,x:gameView[`create_line_${i}`].ox-600},
				{y:gameView[`create_line_${i}`].oy,x:gameView[`create_line_${i}`].ox,ease:i > 5 ? Back.easeOut.config(0) : Back.easeOut.config(1.2)},
				`text_${i}`
			)
			.fromTo(gameView[`create_text_${i}`],.5,
				{rotation:0},
				{rotation:-25},
				`text_${i}+=.4`
			)
			.to(gameView[`create_text_${i}`],.6,
				{rotation:0},
				`text_${i}+=1`
			)
			.timeScale(2)

			A.showTimeLine.add(timelineSpan,`-=${i == 1? 0 : .55}`)
		}


		// 暂停
		A.pause = function(){
			A.showTimeLine.pause();
		}

		// 开始
		A.play = function(){
			A.showTimeLine.play();
		}


		return A
	}

	questionAnimations(target){
		const A = {};

		A.topAni = TweenMax.fromTo(target.topCartoon,2,{y:target.topCartoon.oy-16},{y:target.topCartoon.oy,yoyo:true,repeat:-1});

		A.ld = TweenMax.fromTo(target.d_2,2,{x:target.d_2.ox-16},{x:target.d_2.ox,yoyo:true,repeat:-1});

		A.star = TweenMax.fromTo(target.star,2,{rotation:0},{rotation:360,repeat:-1,ease:Linear.easeNone});

		if(target.index == 1)
			A.d_3 = TweenMax.fromTo(target.d_3,1.5,{y:target.d_3.oy-10,scaleX:1,scaleY:1},{y:target.d_3.oy,scaleX:.9,scaleY:.9,yoyo:true,repeat:-1});

		if(target.index == 5)
			A.d_4 = TweenMax.fromTo(target.d_4,1.5,{y:target.d_4.oy-10,scaleX:1,scaleY:1},{y:target.d_4.oy,scaleX:.9,scaleY:.9,yoyo:true,repeat:-1});

		return A
	}

	showAnswerAnimation(target){
		const A = {};

		//ballLine
		A.ballLine = new TimelineMax({paused:true,repeat:-1})
		.to(target.ball_1,.5,{alpha:1})
		.fromTo(target.ball_1,2,{x:302+12},{x:302+12+256,ease:SlowMo.ease.config(0.05, 0.7, true)},'start')
		.fromTo(target.square,.4,{rotation:90},{rotation:90+360,ease:SlowMo.ease.config(0.05, 0.7, true)},'start+=.9')
		.to(target.ball_1,.5,{alpha:0},'start+=1.9')
		.fromTo(target.ball_2,.25,{alpha:0},{alpha:1},'start+=2.2')
		.fromTo(target.ball_2,2,{x:302+12},{x:302+12+256,ease:SlowMo.ease.config(0.05, 0.7, true)},'start+=2.6')
		.fromTo(target.square,.4,{rotation:90},{rotation:90+360},'start+=3.5')
		.to(target.ball_2,.5,{alpha:0})



		//show answer timeline
		A.timeline = new TimelineMax({
			onStart:()=>{
				TweenMax.set(target.ball_2,{alpha:0})
			},
			onComplete:()=>{
				A.ballLine.play();
				A.float_1 = TweenMax.fromTo(target.star_1,2,{y:836},{y:836+10,yoyo:true,ease:Linear.easeNone,repeat:-1});
				A.float_2 = TweenMax.fromTo(target.star_2,2,{y:441},{y:441+20,yoyo:true,ease:Linear.easeNone,repeat:-1,delay:1});
				A.float_3 = TweenMax.fromTo(target.ld,2,{x:560},{x:560+15,yoyo:true,ease:Linear.easeNone,repeat:-1,delay:1.5});
				A.btn = TweenMax.to(target.btn,1,{scaleX:.95,scaleY:.95,ease:Elastic.easeOut.config(1, 0.3),yoyo:true,repeat:-1,delay:2})
			}
		})
		.fromTo(this.game.gameView.answerContainer,.4,{alpha:0},{alpha:1})
		.fromTo(target.box,.45,{alpha:0,y:654},{alpha:1,y:354,ease:Back.easeOut.config(1.2)},'shown_1')
		.fromTo(target.answer,.45,{alpha:0,y:363+98/2-200,scaleX:2,scaleY:2},{alpha:1,y:363+98/2,ease:Back.easeOut.config(1.2),scaleX:1,scaleY:1},'shown_1+=.2')
		.fromTo(target.pipe,.55,{alpha:0,/*x:469-100,*/y:959-300},{alpha:1/*,x:469*/,y:959,ease:Back.easeOut.config(1.1)},'shown_2')
		.fromTo(target.btn,.55,{alpha:0,/*x:221+318/2-100,*/y:1070+122/2-300},{alpha:1/*,x:221+318/2*/,y:1070+122/2,ease:Back.easeOut.config(1.1)},'shown_2')
		.fromTo(target.answer_text,.55,{alpha:0,y:571+100},{alpha:1,y:571,ease:Back.easeOut.config(0)},'shown_3-=.3')
		.fromTo(target.ld,.55,{alpha:0,x:560+200},{alpha:1,x:560,ease:Back.easeOut.config(1.1)},'shown_3-=.2')
		.fromTo(target.star_1,.55,{alpha:0,x:96-200},{alpha:1,x:96,ease:Back.easeOut.config(1.1)},'shown_3-=.2')
		.fromTo(target.star_2,.55,{alpha:0,x:491+100},{alpha:1,x:491,ease:Back.easeOut.config(1.1)},'shown_3-=.2')
		.staggerFromTo([target.ball_1,target.ball_2,target.ban,target.square],.45,{alpha:0,scaleX:1.4,scaleY:1.4},{scaleX:1,scaleY:1,alpha:1,ease:Back.easeOut.config(1.1)},.1,'shown_3-=.1')


		return A
	}

	//zhane result page ani
	zhaneResultAnimations(){
		let A = {};
		let gameView = this.game.gameView;

		//wait ani
		A.waitLine = new TimelineMax({
			paused:true,
			repeat:-1,
			yoyo:true
		})

		for(let i = 1; i < 10; i++){
			A.waitLine
			
			.fromTo(gameView[`zhane_index_text_${i}`],Math.random() * 2 + 1,
				{rotation:0},
				{rotation:(Math.random()>.5?1:-1) * Math.random() * 10+5,ease:Linear.easeNone},
				`start`
			)
			.to(gameView[`zhane_index_text_${i}`],Math.random() * 1 + 1,
				{rotation:0,ease:Linear.easeNone},
				`start2`
			)
		}

		//show ani
		A.textTimeLine = new TimelineMax({
			paused:false,
			delay: 1
		})

		.fromTo(
			[gameView.zhane_index_title],
			.7,
			{x:0,alpha:0},
			{x:gameView.zhane_index_title.ox+399/2,alpha:1,onComplete:()=>{
				A.flash = TweenMax.to(gameView.zhane_index_title,.6,{scaleX:1.1,scaleY:1.1,ease:Back.easeOut.config(1.2),yoyo:true,repeat:-1})
			}},
			'start1'
		)
		.fromTo(
			gameView.zhane_index_btn,
			.7,
			{y:gameView.zhane_index_btn.oy+500+122/2},
			{y:gameView.zhane_index_btn.oy+122/2,ease:Back.easeOut.config(1.2),
				onStart:()=>{
					// A.waitLine.play();
				},
				onComplete:()=>{
					A.robotFloat = TweenMax.to(gameView.zhane_index_btn,1,{scaleX:.95,scaleY:.95,ease:Elastic.easeOut.config(1, 0.3),yoyo:true,repeat:-1})
				}
			},
			'start1+=.4'
		)

		let speArr = [1,2,4,5],
			speArr2= [6,7,8,9]
		for(let i = 1; i < 10; i++){
			let timelineSpan = new TimelineMax()
			//text
			.fromTo(gameView[`zhane_index_text_${i}`],1,
				{y:gameView[`zhane_index_text_${i}`].oy-700,x:gameView[`zhane_index_text_${i}`].ox-200},
				{y:gameView[`zhane_index_text_${i}`].oy,x:gameView[`zhane_index_text_${i}`].ox,ease:i > 5 ? Back.easeOut.config(0) : Back.easeOut.config(1.2)},
				`text_${i}`
			)
			//line
			.fromTo(gameView[`zhane_index_line_${i}`],1,
				{y:gameView[`zhane_index_line_${i}`].oy-700,x:gameView[`zhane_index_line_${i}`].ox-200},
				{y:gameView[`zhane_index_line_${i}`].oy,x:gameView[`zhane_index_line_${i}`].ox,ease:i > 5 ? Back.easeOut.config(0) : Back.easeOut.config(1.2)},
				`text_${i}`
			)
			.fromTo(gameView[`zhane_index_text_${i}`],.5,
				{rotation:0},
				{rotation:-25},
				`text_${i}+=.4`
			)
			.to(gameView[`zhane_index_text_${i}`],.6,
				{rotation:0},
				`text_${i}+=1`
			)
			.timeScale(2.2)
			

			A.textTimeLine.add(timelineSpan,`-=${i == 1 ? 0 : .6}`)
			A.textTimeLine.timeScale(1.2)
		}

		//other show animations
		A.textTimeLine
		
		
		// .fromTo(
		// 	gameView.index_pipe,
		// 	.7,
		// 	{y:-800},
		// 	{y:gameView.index_pipe.oy,ease:Back.easeOut.config(1.2)},
		// 	'robot-=.3'
		// )
		
		.fromTo(
			[gameView.zhane_index_stars_1],
			.7,
			{x:gameView.zhane_index_stars_1.ox+300,alpha:0},
			{x:gameView.zhane_index_stars_1.ox,alpha:1,onComplete:()=>{
				A.waitLine.play();
			}},
			'robot+=.3'
		)
		.fromTo(
			[gameView.zhane_index_stars_2],
			.7,
			{x:gameView.zhane_index_stars_2.ox-300,alpha:0},
			{x:gameView.zhane_index_stars_2.ox,alpha:1},
			'robot+=.55'
		)
		.fromTo(
			[gameView.zhane_index_stars_3],
			.7,
			{x:gameView.zhane_index_stars_3.ox-300,alpha:0},
			{x:gameView.zhane_index_stars_3.ox,alpha:1},
			'robot+=.625'
		)
		.fromTo(
			[gameView.zhane_index_star_2],
			.7,
			{x:gameView.zhane_index_star_2.ox-300,alpha:0},
			{x:gameView.zhane_index_star_2.ox,alpha:1},
			'robot+=.7'
		)
		.fromTo(
			[gameView.zhane_index_leida],
			.7,
			{x:gameView.zhane_index_leida.ox+300,alpha:0},
			{x:gameView.zhane_index_leida.ox,alpha:1},
			'robot+=.8'
		)
		.fromTo(
			[gameView.zhane_index_star_1],
			.7,
			{x:gameView.zhane_index_star_1.ox+300,alpha:0},
			{x:gameView.zhane_index_star_1.ox,alpha:1},
			'robot+=.9'
		)
			


		
		// 暂停
		A.pause = function(){
			A.textTimeLine.pause();
		}

		// 开始
		A.play = function(){
			A.textTimeLine.play();
		}


		return A
	}
}
module.exports = animation;