;(function($){

	//panoramaView
	jQuery.fn.panoramaViewer=function(prmUser){

		///////////////////////////////////////////////////////////////////////////////////////////
		// Var
		///////////////////////////////////////////////////////////////////////////////////////////

		//parameter
		const prmDef={
			autoRotate      : false,
			autoRotateSpeed : 0.2,
			enableRotate    : true,
			camera          : {
				fov  : 45,
				near : 1,
				far  : 2000
			}
		};
		const prm=$.extend(prmDef,prmUser);

		//canvas
		const myCanvas=$(this);
		var cv=new Canvas();
		function Canvas(){
			this._id  =myCanvas.attr("id");
			this._box =myCanvas.closest("#canvas_box");
			this._w   =this._box.width();
			this._h   =this._box.height();
		}
		myCanvas.attr({
			'width'  : cv._w,
			'height' : cv._h
		});

		//three.js
		var renderer;
		var scene;
		var group;
		var camera;
		var controls;


		///////////////////////////////////////////////////////////////////////////////////////////
		// Canvas
		///////////////////////////////////////////////////////////////////////////////////////////

		setCanvas();
		function setCanvas(){

			renderer=new THREE.WebGLRenderer({
				canvas    : document.querySelector('#'+cv._id),
				antialias : true,
				alpha     : true
			});

			renderer.setPixelRatio(window.devicePixelRatio);
			renderer.setSize(cv._w,cv._h);

			scene=new THREE.Scene();
			group=new THREE.Group();

			camera=new THREE.PerspectiveCamera(prm.camera.fov,cv._w/cv._h,prm.camera.near,prm.camera.far);
			camera.translateZ(0.01);
			//camera.position.set(0,0,0.01);
			camera.lookAt(new THREE.Vector3(0,0,0));
			controls=new THREE.OrbitControls(camera,renderer.domElement);
			if(prm.autoRotate){
				controls.autoRotate=true;
				controls.autoRotateSpeed=prm.autoRotateSpeed;
			}else{
				controls.autoRotate=false;
			}
			if(prm.enableRotate){
				controls.enableRotate=true;
				controls.rotateSpeed=0.1;
			}else{
				controls.enableRotate=false;
			}
			controls.enableDamping =true;
			controls.dampingFactor =0.1;
			controls.enableZoom    =false;
			controls.enablePan     =false;

			//Geometry
			group.add(makeGeometry());

			scene.add(group);
			runAnimate();

			function runAnimate(){
				controls.update();
				renderer.render(scene,camera);
				requestAnimationFrame(runAnimate);
			}
		}

		///////////////////////////////////////////////////////////////////////////////////////////
		// Window Resize
		///////////////////////////////////////////////////////////////////////////////////////////

		var timerResize=false;
		$(window).on("resize",function(){
			if(timerResize!==false){
				clearTimeout(timerResize);
			}
			timerResize=setTimeout(function(){
				resizeCanvas();
			},500);
		});

		function resizeCanvas(){
			cv._w=cv._box.width();
			cv._h=cv._box.height();
			myCanvas.attr({
				'width'  : cv._w,
				'height' : cv._h
			});

			renderer.setPixelRatio(window.devicePixelRatio);
			renderer.setSize(cv._w,cv._h);
			camera.aspect=cv._w/cv._h;
			camera.updateProjectionMatrix();
		}

	};

	function makeGeometry(){
		var group=new THREE.Group();

		const stop=1000;
		const start=stop*-1;
		const max=10;
		const move=stop*2/max;

		const mtr_x=new THREE.LineBasicMaterial({color : 0xff0000});
		const mtr_y=new THREE.LineBasicMaterial({color : 0x00ff00});
		const mtr_z=new THREE.LineBasicMaterial({color : 0x0000ff});
		for(i=0;i<=max;i++){
			now1=start+(move*i);
			for(j=0;j<=max;j++){
				now2=start+(move*j);

				var wkgmr_x=new THREE.Geometry();
				wkgmr_x.vertices.push(
					new THREE.Vector3(start,now2,now1),
					new THREE.Vector3(stop,now2,now1)
				);
				var wkline_x=new THREE.Line(wkgmr_x,mtr_x);
				group.add(wkline_x);

				var wkgmr_y=new THREE.Geometry();
				wkgmr_y.vertices.push(
					new THREE.Vector3(now2,start,now1),
					new THREE.Vector3(now2,stop,now1)
				);
				var wkline_y=new THREE.Line(wkgmr_y,mtr_y);
				group.add(wkline_y);

				var wkgmr_z=new THREE.Geometry();
				wkgmr_z.vertices.push(
					new THREE.Vector3(now2,now1,start),
					new THREE.Vector3(now2,now1,stop)
				);
				var wkline_z=new THREE.Line(wkgmr_z,mtr_z);
				group.add(wkline_z);
			}
		}

		var testGeometry1=new THREE.BoxGeometry(150,150,120);
		var testMaterial1=new THREE.MeshNormalMaterial();
		var testMesh1=new THREE.Mesh(testGeometry1,testMaterial1);
		testMesh1.position.set(100,300,-500);
		group.add(testMesh1);

		var testGeometry2=new THREE.SphereGeometry(70,24,16);
		var testMaterial2=new THREE.MeshNormalMaterial();
		var testMesh2=new THREE.Mesh(testGeometry2,testMaterial2);
		testMesh2.position.set(-120,100,-400);
		group.add(testMesh2);

		var testGeometry3=new THREE.BoxGeometry(150,150,120);
		var testMaterial3=new THREE.MeshNormalMaterial();
		var testMesh3=new THREE.Mesh(testGeometry3,testMaterial3);
		testMesh3.position.set(100,300,500);
		group.add(testMesh3);

		var testGeometry4=new THREE.SphereGeometry(80,24,16);
		var testMaterial4=new THREE.MeshNormalMaterial();
		var testMesh4=new THREE.Mesh(testGeometry4,testMaterial4);
		testMesh4.position.set(-150,-30,500);
		group.add(testMesh4);

		return group;
	}

})(jQuery);