API Documentation
1 /* 2 GLGE WebGL Graphics Engine 3 Copyright (c) 2010, Paul Brunt 4 All rights reserved. 5 6 Redistribution and use in source and binary forms, with or without 7 modification, are permitted provided that the following conditions are met: 8 * Redistributions of source code must retain the above copyright 9 notice, this list of conditions and the following disclaimer. 10 * Redistributions in binary form must reproduce the above copyright 11 notice, this list of conditions and the following disclaimer in the 12 documentation and/or other materials provided with the distribution. 13 * Neither the name of GLGE nor the 14 names of its contributors may be used to endorse or promote products 15 derived from this software without specific prior written permission. 16 17 THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS "AS IS" AND 18 ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED 19 WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE 20 DISCLAIMED. IN NO EVENT SHALL PAUL BRUNT BE LIABLE FOR ANY 21 DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES 22 (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; 23 LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND 24 ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT 25 (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS 26 SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE. 27 */ 28 29 /** 30 * @fileOverview 31 * @name glge_texturevideo.js 32 * @author me@paulbrunt.co.uk 33 */ 34 35 36 (function(GLGE){ 37 38 39 40 41 /** 42 * @class A video texture to be included in a material 43 * @param {string} uid the unique id for this texture 44 * @see GLGE.Material 45 * @augments GLGE.QuickNotation 46 * @augments GLGE.JSONLoader 47 */ 48 GLGE.TextureVideo=function(uid){ 49 this.video=document.createElement("video"); 50 this.video.style.display="none"; 51 this.video.setAttribute("loop","loop"); 52 this.video.autoplay=true; 53 //looping isn't working in firefox so quick fix! 54 this.video.addEventListener("ended", function() { this.play(); }, true); 55 //video needs to be part of page to work for some reason :-s 56 document.getElementsByTagName("body")[0].appendChild(this.video); 57 //used to get webkit working 58 this.canvas=document.createElement("canvas"); 59 this.ctx=this.canvas.getContext("2d"); 60 GLGE.Assets.registerAsset(this,uid); 61 62 } 63 GLGE.augment(GLGE.QuickNotation,GLGE.TextureVideo); 64 GLGE.augment(GLGE.JSONLoader,GLGE.TextureVideo); 65 GLGE.augment(GLGE.Events,GLGE.TextureVideo); 66 GLGE.TextureVideo.prototype.className="TextureVideo"; 67 GLGE.TextureVideo.prototype.glTexture=null; 68 /** 69 * Gets the canvas used by the texture 70 * @return {video} The textures image url 71 */ 72 GLGE.TextureVideo.prototype.getVideo=function(){ 73 return this.video; 74 }; 75 /** 76 * Sets the video used by the texture 77 * @param {video} canvas The canvas to use 78 */ 79 GLGE.TextureVideo.prototype.setVideo=function(video){ 80 this.video=video; 81 return this; 82 }; 83 84 /** 85 * Sets the source used for the video 86 * @param {string} src The URL of the video 87 */ 88 GLGE.TextureVideo.prototype.setSrc=function(src){ 89 this.video.src=src; 90 return this; 91 }; 92 /** 93 * gets the source used for the video 94 * @returns {string} The URL of the video 95 */ 96 GLGE.TextureVideo.prototype.getSrc=function(src){ 97 return this.video.src; 98 }; 99 100 /** 101 * does the canvas texture GL stuff 102 * @private 103 **/ 104 GLGE.TextureVideo.prototype.doTexture=function(gl){ 105 this.gl=gl; 106 //create the texture if it's not already created 107 if(!this.glTexture){ 108 this.glTexture=gl.createTexture(); 109 gl.bindTexture(gl.TEXTURE_2D, this.glTexture); 110 this.updateTexture(gl); 111 }else{ 112 gl.bindTexture(gl.TEXTURE_2D, this.glTexture); 113 this.updateTexture(gl); 114 } 115 116 117 return true; 118 } 119 /** 120 * Updates the canvas texture 121 * @private 122 */ 123 GLGE.TextureVideo.prototype.updateTexture=function(gl){ 124 var video = this.video; 125 gl.bindTexture(gl.TEXTURE_2D, this.glTexture); 126 //TODO: fix this when minefield is upto spec 127 if(video.readyState>0){ 128 if(video.height<=0){ 129 video.style.display=""; 130 video.height=video.offsetHeight; 131 video.width=video.offsetWidth; 132 video.style.display="none"; 133 } 134 this.canvas.height=video.height; 135 this.canvas.width=video.width; 136 this.ctx.drawImage(video, 0, 0); 137 try{gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, this.canvas);} 138 catch(e){gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, this.canvas,null);} 139 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR); 140 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR); 141 gl.generateMipmap(gl.TEXTURE_2D); 142 143 /* 144 use when video is working in webkit 145 try{gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, video);} 146 catch(e){gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, video,null);} 147 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR); 148 gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR); 149 gl.generateMipmap(gl.TEXTURE_2D); 150 */ 151 } 152 } 153 154 })(GLGE);