/// <reference path="three.d.ts" />
window.onload = ()=> {
	new demo.Main();
}

module demo{
	export class Main {
		image:HTMLImageElement;
		camera:THREE.PerspectiveCamera;
		scene:THREE.Scene;
		renderer:THREE.WebGLRenderer;
		butterfly:THREE.Object3D;
		wingL:THREE.Object3D;
		wingR:THREE.Object3D;
		countButterfly:number = 0;
		countCamera:number = 0;

		constructor() {
			this.init();
		}

		init() {
			this.image = <HTMLImageElement> new Image();
			this.image.onload = ()=> {
				this.handleComplete();
			}
			this.image.src = "imgs/butterfly_wing.png";
		}

		handleComplete() {
			this.init3D();
			this.initModel();
			setInterval(()=>this.tick(), 1000 / 60);
			window.onresize = ()=> this.handleResize();
		}

		init3D() {
			// 3D空間を作成
			this.scene = new THREE.Scene();

			// カメラを作成
			this.camera = new THREE.PerspectiveCamera();
			this.camera.far = 4000;
			this.camera.lookAt(new THREE.Vector3(0, 0, 0));
			this.scene.add(this.camera);

			// レンダラーを作成
			this.renderer = new THREE.WebGLRenderer({antialias: true});
			this.handleResize();

			// エレメントを追加
			document.getElementById('container').appendChild(this.renderer.domElement);
		}

		initModel() {
			// 地面
			var mat = new THREE.MeshBasicMaterial({wireframe: true, color: 0xB0B0B0, opacity:0.5});
			var plane = new THREE.Mesh(new THREE.PlaneGeometry(2000, 2000, 20, 20), mat);
			plane.rotation.x = 90 * (Math.PI / 180);
			this.scene.add(plane);

			// 蝶のコンテナーを作成
			this.butterfly = new THREE.Object3D();

			// 蝶
			// 蝶の羽の素材を作成(PNGファイルを読み込み)
			var texture = new THREE.Texture(this.image);
			texture.needsUpdate = true;

			var material = new THREE.MeshBasicMaterial({
				map: texture,
				transparent: true,
				side: THREE.DoubleSide
			});

			// 蝶の羽を貼り付ける平面を作成
			var wingLPlane = new THREE.Mesh(new THREE.PlaneGeometry(200, 200, 1, 1), material);
			var wingRPlane = new THREE.Mesh(new THREE.PlaneGeometry(200, 200, 1, 1), material);

			// 蝶の羽を作成
			this.wingL = new THREE.Object3D();
			this.wingR = new THREE.Object3D();

			// 蝶の羽平面の座標や角度を調整
			wingLPlane.scale.x = -1;
			wingLPlane.position.x = -100;
			wingRPlane.position.x = 100;

			// 蝶の羽をコンテナーの表示リストに追加
			this.wingL.add(wingLPlane);
			this.wingR.add(wingRPlane);
			this.butterfly.add(this.wingL);
			this.butterfly.add(this.wingR);
			this.butterfly.rotation.x = 90 * (Math.PI / 180);

			// シーンに追加
			this.scene.add(this.butterfly);
		}

		tick() {
			// 蝶の揺らぎを設定しています
			this.butterfly.position.y = Math.sin(this.countButterfly) * 50 + 300;

			// 蝶の
			this.wingL.rotation.y = Math.sin(this.countButterfly) * -60 * Math.PI / 180;
			this.wingR.rotation.y = Math.sin(this.countButterfly) * 60 * Math.PI / 180;

			// カメラの動き
			this.camera.position.x = 1000 * Math.sin(this.countCamera);
			this.camera.position.y = 500 * Math.sin(this.countCamera / 4) + 500;
			this.camera.position.z = 1000 * Math.cos(this.countCamera);
			this.camera.lookAt(new THREE.Vector3(0, 100, 0));

			// レンダリング
			this.renderer.render(this.scene, this.camera);

			// カウンタのアップデート
			this.countCamera += 1 * Math.PI / 180; // 1度ずつ加算
			this.countButterfly += 4 * Math.PI / 180; // 1度ずつ加算
		}

		handleResize() {
			this.renderer.setSize(window.innerWidth, window.innerHeight);
			this.camera.aspect = window.innerWidth / window.innerHeight;
			this.camera.updateProjectionMatrix();
		}
	}
}