var renderer,container,scene2D, scene3D,lines,WIDTH,HEIGHT,camera2D,camera3D;
var puutos;
var loader;
var loader2;
var manager;
var ribboner
var drive;
var objutorni;
var terminal;

var demosong;


var obju;
var passedtime;
var floorheight;
var floor;
var floorgeo;
var floormaterial;
var floorspeed;
var ribbonPalette = [0xffae00, 0xffe900, 0xff5900, 0xa67100, 0xffc340, 0xeed373, 0xbf9230, 0xa67100];
var floorPalette = [rgbToHex(31,22,41), rgbToHex(22,43,64), rgbToHex(21,21,32), rgbToHex(26,26,26), rgbToHex(31,31,31), rgbToHex(1,12,16), rgbToHex(16,11,18), rgbToHex(2,3,4)];
var ovi, tie, logo, logo2, background_effect3, pyora;
var texture, imageContext, image, video;
function dumpScene2D(){
	for ( i = scene2D.children.length - 1; i >= 0 ; i -- ) {
    	scene2D.remove(scene2D.children[ i ]);
	}
}
function dumpScene3D(){
  for ( i = scene3D.children.length - 1; i >= 0 ; i -- ) {
      scene3D.remove(scene3D.children[ i ]);
  }
}
var m_w = 123456789;
var m_z = 987654321;
var mask = 0xffffffff;

function seed(i) {
    m_w = i;
}

function random()
{
    m_z = (36969 * (m_z & 65535) + (m_z >> 16)) & mask;
    m_w = (18000 * (m_w & 65535) + (m_w >> 16)) & mask;
    var result = ((m_z << 16) + m_w) & mask;
    result /= 4294967296;
    return result + 0.5;
}
function maketree()
{
	this.treelist = new Array();
	this.init = function()
  	{
  		for(var i=0.0; i<20.0; i++)
  		{
  			var start = [i/100.0, -0.5];
  			var dir = [0.0, 0.001+i/2000.0];
  			var time = i;
  			this.treelist.push(new Tree(  start, dir, time ));
  		}
  	}
  	this.get = function(time)
  	{
  		var ret = new Array();
  		var l = Math.min(Math.floor(time), 20.0);
  		for(var i=0.0; i<l; i++)
  			ret[i] = this.treelist[i];
  		return ret;
  	}
  	this.update = function(time)
  	{
  		var l = Math.min(Math.floor(time), 20.0);
  		for(var i=0.0; i<l; i++)
  			this.treelist[i].update(time);
  	}
}
function maketree2(){
	this.treelist = new Array();
	this.init = function(){
      var start,dir,time;
  		for(var i=10.0; i<80.0; i++) {
  			start = [-0.4+random()*0.8, -0.4+i*0.11];
  			dir = [0.0288*Math.cos(((33.0+i)/18.0)*Math.PI), 0.01+0.033*Math.sin(((33.0+i)/11.0)*Math.PI)];
  			time = i;
  			this.treelist[i] = new Tree(  start, dir, time );
  		}
      for(var i=0.0; i<10.0; i++) {
        start = [Math.cos(i)*0.1-0.5, -0.5];
        dir = [0.03*Math.cos(((-2.0+i)/18.0)*Math.PI), 0.03+0.05*Math.sin(((-2.0+i)/18.0)*Math.PI)];
        time = i;
        this.treelist[i] = new Tree(  start, dir, time );
      }
  	}
  	this.get = function() {
  		return this.treelist;
  	}
  	this.update = function(time) {
  		for(var i=0.0; i<80.0; i++)
  			this.treelist[i].update(time);
  	}
}
function controller(){
    demosong=document.getElementById("musa"); 
  var keyboard = new THREEx.KeyboardState();
	renderer = new THREE.WebGLRenderer(), 				//three js renderer
	container = document.getElementById("container"),	//container dom on the screen
	scene2D = new THREE.Scene(),							//scene were we draw to
	scene3D = new THREE.Scene(),							//scene were we draw to

	lines = [],											/*list of lines
					 									 	 *array of arrays!!
					 			 							 */
	WIDTH = container.offsetWidth,						//size of the rendering dom
	HEIGHT = container.offsetHeight,
	camera3D = new THREE.PerspectiveCamera( /*our camera we see with*/
            45, WIDTH / HEIGHT, /*yes, i split this line, due to */
            0.1, 10000),
        /*lenght :-)*/
	camera2D = new THREE.PerspectiveCamera(				/*our camera2D we see with*/
			45, WIDTH / HEIGHT, 								/*yes, i split this line, due to */
			0.1, 10000);										/*lenght :-)*/


  ribboner = [];
  ribboner.push(new Ribbon(calculate_ribbon(0, 0, 0), 4));

  obju = [];
  passedtime = 0.0;
  floorheight = [];
  floor = [];

  for (var i = 0; i < 600; i++) {
    floorheight.push(Math.cos(i * 0.766) * 110.0 + 111.0);
    floorgeo = new THREE.CubeGeometry(Math.sin(i) * 64 + 100.0, floorheight[i], Math.sin(i) * 64 + 100.0);
    floormaterial = new THREE.MeshPhongMaterial({
      color: floorPalette[i & 7]
    });
    floor.push(new THREE.Mesh(floorgeo, floormaterial));
      while((floor[floor.length - 1].position.x<300 && floor[floor.length - 1].position.x>-300) && (floor[floor.length - 1].position.y<600 && floor[floor.length - 1].position.y>-600) ){
        floor[floor.length - 1].position.set(-3000 + random() * 6000, 200-random() * 300.0, -3000 + random() * 6000);
    }
  }
  floorgeo = new THREE.CubeGeometry(16000.0, 2.0, 16000.0);
  floormaterial = new THREE.MeshPhongMaterial({
    color: 0x1a1120
  });
  floor.push(new THREE.Mesh(floorgeo, floormaterial));
  floor[floor.length - 1].position.set(0.0, 0.0, 0.0);
  floorspeed = [];
  for (var i = 0; i < 1000; i++)
    floorspeed[i] = Math.abs(Math.sin(i)) * 4.0 + 1.2;

  ovi = THREE.ImageUtils.loadTexture('img/kuva1.jpg');
  tie = THREE.ImageUtils.loadTexture('img/kuva2.jpg');
  logo = THREE.ImageUtils.loadTexture('img/kuva3.png');
  background_effect3 = THREE.ImageUtils.loadTexture('img/kuva4.jpg');
  pyora = THREE.ImageUtils.loadTexture('img/kuva5.jpg');
  logo2 = THREE.ImageUtils.loadTexture('img/2logo.png');
  manager = new THREE.LoadingManager();
    manager.onProgress = function (item, loaded, total) {
    };

  loader = new THREE.OBJLoader(manager);
  loader.load('terminaali.obj', function (event) {
        var object = event;
        object.traverse(function (child) {
            if (child instanceof THREE.Mesh) {
                child.material.color.setRGB(0.125, 0.125, 0.15);
                child.material.side = THREE.DoubleSide;
            }
        });
        object.scale = new THREE.Vector3(15, 15, 15);

        object.position.set(0.0, 4.0, -110.0);
        object.rotation.y = (200.0 / 180.0) * Math.PI;
        terminal = object;
        terminal.position.set(0.0, 4.0, -110.0);

        
    });
  loader.load('torni.obj', function (event) {
        var object = event;
        object.traverse(function (child) {
            if (child instanceof THREE.Mesh) {
                child.material.color.setRGB(0.7125, 0.3125, 0.15);
                child.material.side = THREE.DoubleSide;
            }
        });
        object.scale = new THREE.Vector3(20, 40, 20);

        object.rotation.y = (200.0 / 180.0) * Math.PI;
        objutorni = object;

        
    });
    
  loader.load('tapedrive.obj', function (event) {
        var object = event;
        object.traverse(function (child) {
            if (child instanceof THREE.Mesh) {
                child.material.color.setRGB(0.125, 0.125, 0.15);
                child.material.side = THREE.DoubleSide;
            }
        });
        object.position.set(90, 140, 20);
        object.scale = new THREE.Vector3(15, 15, 15);

        object.rotation.y = (200.0 / 180.0) * Math.PI;
        drive = object;

        
    });
	var which_effect=0;
	var effu=new Effect1();
  var effu5=new Effect5();
  var effu6=new Effect6();
  effu6.init();
	var startTime=(new Date()).getTime();
	puutos = new maketree();
	puutos.init();
    this.requestAnimation = function() {
    var timePassed=demosong.currentTime;
    effu.updateScreen();
    if(which_effect==0 && (timePassed>48.165 || keyboard.pressed("1"))   ){
    	dumpScene2D();
    	effu=new Effect2();
    	which_effect=1;
    }
    else if(which_effect==1 && (timePassed>75.335 || keyboard.pressed("2"))){
    	dumpScene2D();
    	effu=new Effect3();
    	which_effect=2;
    }
    else if(which_effect==2 && (timePassed>117.0 || keyboard.pressed("3"))){
		puutos = new maketree2();
		puutos.init();
    	dumpScene2D();
    	effu=effu5;
      effu.start();
    	which_effect=4;
    }
    else if(which_effect==4 && (timePassed>170.5 || keyboard.pressed("4"))){
      dumpScene2D();
      dumpScene3D();
      effu=effu6;
      effu.launch();
      which_effect=5;
    }
    else if(which_effect==5 && (timePassed>243.482 || keyboard.pressed("5"))){
    puutos = new maketree2();
    puutos.init();
      dumpScene2D();
      dumpScene3D();
      effu=new Effect4();
      which_effect=3;
    }
    else if(which_effect==3 && (timePassed>60.0*6.02 || keyboard.pressed("6"))){
      dumpScene2D();
      dumpScene3D();
      renderer.setClearColor(0x000000, 1 );
      container.innerHTML="";
      document.getElementById( 'terminal' ).innerHTML="&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;[\&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;/\&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;/]<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;[&nbsp;&nbsp;\&nbsp;/&nbsp;&nbsp;&nbsp;&nbsp;\&nbsp;/&nbsp;&nbsp;]<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;[_____________&nbsp;]<br>&nbsp;&nbsp;&nbsp;&nbsp;the&nbsp;Royal&nbsp;Elite&nbsp;Ninjas&nbsp;inc.&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;____________________________<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;/&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;\<br>&nbsp;&nbsp;&nbsp;&nbsp;Branch&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;[&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;]<br>&nbsp;&nbsp;&nbsp;&nbsp;Bad&nbsp;Bandwidth&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;[&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;]<br>&nbsp;&nbsp;&nbsp;&nbsp;Sainigma&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;[&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;]<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;[&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;]<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;[&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;]<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;[&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;]<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;[&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;/|\&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;/|\&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;]<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;[&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;/&nbsp;&nbsp;|&nbsp;&nbsp;\\&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;/&nbsp;&nbsp;|&nbsp;&nbsp;\\&nbsp;&nbsp;&nbsp;&nbsp;]<br>&nbsp;&nbsp;&nbsp;&nbsp;atebit&nbsp;dekadence&nbsp;fit&nbsp;flo&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;[&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;]<br>&nbsp;&nbsp;&nbsp;&nbsp;kewlers&nbsp;mercury&nbsp;mirage&nbsp;peisik&nbsp;&nbsp;[&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;]<br>&nbsp;&nbsp;&nbsp;&nbsp;pwp&nbsp;traction&nbsp;trilobit&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;[&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;]<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;[&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;]<br>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;\______________________________/"
      document.getElementById( 'terminal' ).innerHTML+="<br\>Greetings goes to Atebit Dekadence Fit Flo Kewlers Mercury Miragɘ Peisik Pwp Traction Trilobit"
      if (document.cancelFullScreen) {
          document.cancelFullScreen();
      } else if (document.mozCancelFullScreen) {
          document.mozCancelFullScreen();
      } else if (document.webkitCancelFullScreen) {
          document.webkitCancelFullScreen();
      }
    }
    requestAnimationFrame(this.requestAnimation);
    }
    video = document.getElementById( 'video' );

    image = document.createElement( 'canvas' );
    image.width = 480;
    image.height = 204;

    imageContext = image.getContext( '2d' );
    imageContext.fillStyle = '#000000';
    imageContext.fillRect( 0, 0, 480, 204 );
    texture = new THREE.Texture( image );
    texture.minFilter = THREE.LinearFilter;
    texture.magFilter = THREE.LinearFilter;
    demosong.play();
    this.requestAnimation();
}