// import frameData from './frameData';
import layoutData from './layout';
import createLayout from './createView';
// import maskCreater from './maskCreater';		//mask creater
import { gsap } from "gsap";
import decomp from 'poly-decomp';
// import utils from '@/utils/index.js'
// import { MotionPathPlugin } from "gsap/MotionPathPlugin.js";
// import Soul 		 from './plugins/ScrollContainer';	//app scroll plugin module

class layout {
	constructor() {
		this.filterMatrix = new createjs.ColorMatrix().adjustSaturation(-200);

		// 注册路径插件
		// gsap.registerPlugin(MotionPathPlugin);
	}

	init() {
		//update btns position by viewport
		// this.updatePosByViewport();

		return this
	}

	upgrate(GAME, VIEW, ANI) {
		this.game = GAME;
		this.view = VIEW;
		this.ani = ANI;

		return this
	}

	//根据页面更新适配内容
	updatePosByViewport() {
		// console.log(this.game.scene.oHeight)
		if (this.game.oHeight <= 1181 / 2) {
			if (this.game.scene.oHeight > 1110 / 2) {
				//iphone 5 5s
				console.log('iphone 5 5s')
				this.game_score_text.y += 140;
				this.game_time_bar.y += 140;
				this.game_score_bar.y += 140;
				this.game_time_text.y += 140;

			} else {
				//suitable huawei		
				console.log('suitable huawei')
				this.game_score_text.y += 220;
				this.game_time_bar.y += 220;
				this.game_score_bar.y += 220;
				this.game_time_text.y += 220;

			}
		} else if (this.game.scene.oHeight <= 673) {
			console.log('iphone8p')
			this.game_score_text.y += 120;
			this.game_time_bar.y += 120;
			this.game_score_bar.y += 120;
			this.game_time_text.y += 120;

		} else {
			console.log('适配机型x')
		}
	}

	createBitmap(name) {
		let img = this.game.mainLoader && this.game.mainLoader.getResult(name);
		return new createjs.Bitmap(img);
	}

	//创建loading页
	loading(GAME) {
		this.game = GAME;
		this.loadingCacheContainer = new createjs.Container();
		this.loadingAnimation = {};
		//create layout
		for (let i in layoutData['loading']) {
			let item = layoutData['loading'][i];
			item.layout = this;
			item.game = this.game;
			item.loader = this.game.loadingLoader;
			item.container = this.game.stage.loadingContainer;
			item.cacheContainer = this.loadingCacheContainer;

			if (item.singleSprite && item.singleSprite.visible) {
				item.singleSprite.parent = this.loadingSprite;
			}

			createLayout(item);
		}

		gsap.to(this.loading_snow, { rotation: 360, ease: 'none', repeat: -1, duration: 5 })

		// 创建粒子动画
		this.createLoadingParticle();

		// console.log(this.loading_bg)

		return this
	}

	//隐藏loading页面
	hideLoading() {
		//create story index
		gsap.to(this.game.stage.loadingContainer, { alpha: 0, duration: 0.65, })
		gsap.to([this.game.stage.mainContainer, this.gamePage], { alpha: 1, duration: 0.65 });
	}

	// 创建游戏页
	createGamePage(game) {
		this.game = game;
		this.gamePage = new createjs.Container().set({ alpha: 0 });
		this.game.stage.mainContainer.addChild(this.gamePage);

		let bottom = this.createBitmap('bottom_ban').set({ y: 560 });
		let top = this.createBitmap('top');
		// 添加推板
		let pusher = this.createBitmap('pusher').set({
			x: 142,
			y: 683
		});

		// console.log(pusher)

		gsap.to(pusher, { y: '-=202', yoyo: true, repeat: -1, ease: 'none', duration: 5 })

		// 添加到
		this.gamePage.addChild(bottom, pusher, top);


		// Create a concave polygon
		var _g = [
			// 顶点坐标
			{ x: 0, y: 0 },
			{ x: 0, y: 956 },
			{ x: 141, y: 881 },
			{ x: 206, y: 683 },
			{ x: 548, y: 683 },
			{ x: 614, y: 881 },
			{ x: 750, y: 956 },
			{ x: 750, y: 0 },
		];
		var concavePolygon = [
			// 顶点坐标
			[0, 0],
			[0, 956],
			[141, 881],
			[206, 683],
			[548, 683],
			[614, 881],
			[750, 956],
			[750, 0],
		];

		// Make sure the polygon has counter-clockwise winding. Skip this step if you know it's already counter-clockwise.
		decomp.makeCCW(concavePolygon);


		var convexPolygons = decomp.quickDecomp(concavePolygon);
		// ==> [  [[1,0],[1,1],[0.5,0.5]],  [[0.5,0.5],[-1,1],[-1,0],[1,0]]  ]

		// // Decompose using the slow (but optimal) algorithm
		// var convexPolygons = decomp.decomp(concavePolygon);

		convexPolygons.forEach((item) => {
			item.forEach((t, i) => {
				item.push({
					x: t[0],
					y: t[1]
				})
				if (i == (item.length / 2) - 1) {
					item.splice(0, item.length / 2)
				}
			})
		})

		console.log(convexPolygons)
		// 添加ground 
		this.game.Composite.add(this.game.myWorld,
			this.game.Bodies.fromVertices(
				window.innerWidth / 2, window.innerHeight / 2,
				convexPolygons,
				{
					isStatic: true,
					scale: {
						screenX: 0.5,
						screenY: 0.5,
					},
					render: {
						fillStyle: 'rgba(39,7,238,0.25)'
					}
				},

			)
		);

		// 
		// let bounds = pusher.getBounds();
		// pusher.body = this.game.Bodies.trapezoid(
		// 	pusher.x,
		// 	pusher.y,
		// 	bounds.width,
		// 	bounds.height,
		// 	1,
		// 	{ isStatic: true }
		// );
		// this.game.Composite.add(this.myWorld, [pusher.body]);
	}

	// 生成硬币
	createCoin() {
		let coinImg = this.game.mainLoader.getResult('coin');
		let coin = new createjs.Bitmap(coinImg);
	}

	// loading 粒子制造机
	createLoadingParticle() {
		const container = new createjs.Container();

		const arr = [];
		for (let i = 0; i < (window.deviceInfo.system == 'IOS' ? 200 : 250); i++) {
			const scale = Math.random() * 0.35 + 0.5;
			const name = `snow_${this.game.utils.rangeRandom(1, 20)}`;
			const sprite = this.createBitmap(this.loadingSprite.spriteSheet, name).set({
				x: Math.random() * 750 - 30,
				y: Math.random() * 1624,
				ox: Math.random() * 750,
				oy: -100,
				// regX:14,
				// regY:14,
				scaleX: scale,
				scaleY: scale,
				speedX: (Math.random() > 0.5 ? 1 : -1) * (Math.random() * 0.25 + 0.25),
				speedY: Math.random() * 1 + 0.5,
				alpha: Math.random() * 0.3 + 0.5
			})

			arr.push(sprite)
		}
		// const mask = new createjs.Shape().setTransform(0, 0, 1, 1);
		// mask.graphics.f('#000000').drawRoundRect(0, 0, 750, 1300, 0).es();
		// contianer.mask = mask;
		// contianer.compositeOperation = 'darker';
		// arr.push(mask)
		container.children = arr;

		this.loadingPrarticleContainer = container;
		this.game.stage.loadingContainer.addChild(container);
		return container
	}

	//粒子动画更新
	update() {
		if (!this.game) return
		if (this.game.scene == 1 && this.loadingPrarticleContainer) {
			if (this.loadingPrarticleContainer.alpha == 0) {
				// console.log('2=>1')
				this.loadingPrarticleContainer.alpha = 1;
			}
			if (this.prarticleContainer && this.prarticleContainer.alpha == 1) {
				this.prarticleContainer.alpha = 0;
			}
			this.loadingPrarticleContainer.children.forEach((item, index) => {

				if (item.x < -30 || item.x > 800 || item.y > 1624) {
					item.y = item.oy;
					item.x = item.ox;
				}
				item.x += item.speedX
				item.y += item.speedY

			})
		}
		if (this.game.scene == 2 && this.prarticleContainer) {
			if (this.prarticleContainer.alpha == 0) {
				// console.log('1=>2')
				this.prarticleContainer.alpha = 1;
			}

			if (this.loadingPrarticleContainer.alpha == 1) {
				this.loadingPrarticleContainer.alpha = 0;
			}			//题目一 粒子运动
			this.prarticleContainer.children.forEach((item, index) => {

				if (item.x < -30 || item.x > 800 || item.y > 1400) {
					item.y = item.oy;
					item.x = item.ox;
					item.rotation = 0;
				}
				item.x += item.speedX * this.game.globalSpeed
				item.y += item.speedY * this.game.globalSpeed
				item.rotation += item.speedR * this.game.globalSpeed

			})
		}

	}
}

module.exports = layout;