From 2f66a9ab38f761b7796800bb37f8146f140db40b Mon Sep 17 00:00:00 2001
From: hwc487
Date: Mon, 26 Mar 2012 11:31:23 -0700
Subject: WebGL & Canvas as data for texture maps.

---
 js/lib/rdge/texture.js | 377 +++++++++++++++++++------------------------------
 1 file changed, 149 insertions(+), 228 deletions(-)

(limited to 'js/lib/rdge/texture.js')

diff --git a/js/lib/rdge/texture.js b/js/lib/rdge/texture.js
index c72864b8..b349ee62 100644
--- a/js/lib/rdge/texture.js
+++ b/js/lib/rdge/texture.js
@@ -15,267 +15,188 @@ function Texture( dstWorld )
     ///////////////////////////////////////////////////////////////////////
     // Instance variables
     ///////////////////////////////////////////////////////////////////////
-	this._texture;
+    this._texture;
 
-	// texture attributes
-	this._texMapName;
-	this._wrap;
-	this._mips;
+    // texture attributes
+    this._texMapName;
+    this._wrap;
+    this._mips;
 
-	this._srcCanvas;	// the canvas generating the texture map.
-	this._dstWorld;		// the world that will use the texture map
-	this._dstWorld = dstWorld;
+    this._srcCanvas;	// the canvas generating the texture map.
+    this._dstWorld;		// the world that will use the texture map
+    this._dstWorld = dstWorld;
 
     ///////////////////////////////////////////////////////////////////////
     // Property Accessors
     ///////////////////////////////////////////////////////////////////////
-	this.getTexture		= function()	{  return this._texture;	}
+    this.getTexture		= function()	{  return this._texture;	}
 
-	this.setSrcWorld	= function(w)	{  this._srcWorld = w;		}
-	this.getSrcWorld	= function()	{  return this._srcWorld;	}
+    this.setSrcWorld	= function(w)	{  this._srcWorld = w;		}
+    this.getSrcWorld	= function()	{  return this._srcWorld;	}
 
-	this.setDstWorld	= function(w)	{  this._dstWorld = w;		}
-	this.getDstWorld	= function()	{  return this._dstWorld;	}
+    this.setDstWorld	= function(w)	{  this._dstWorld = w;		}
+    this.getDstWorld	= function()	{  return this._dstWorld;	}
+
+    this.isAnimated     = function()    {  return this._isAnimated; }
 
     ///////////////////////////////////////////////////////////////////////
     // Methods
     ///////////////////////////////////////////////////////////////////////
 
-	this.loadFromFile = function( texMapName,  wrap,  mips )
-	{
-		var tex = this._texture;
-		this._srcCanvas = null;
-
-		// only load if something has changed
-		if (this._texMapName !== texMapName)	// does RDGE allow us to change wrap or mips?
-		{
-			this._texMapName = texMapName.slice();
-			this._wrap = wrap;
-			this._mips = mips;
-
-			var dstWorld = this.getDstWorld();
-			if (dstWorld)
-			{
-				var renderer = dstWorld.getRenderer();
-				tex = renderer.getTextureByName(texMapName, wrap, mips );
-				this._texture = tex;
-				dstWorld.textureToLoad( tex );
-			}
-		}
-
-		return tex;
-	}
+    this.loadFromFile = function( texMapName,  wrap,  mips )
+    {
+        var tex = this._texture;
+        this._srcCanvas = null;
+
+        // only load if something has changed
+        if (this._texMapName !== texMapName)	// does RDGE allow us to change wrap or mips?
+        {
+            this._texMapName = texMapName.slice();
+            this._wrap = wrap;
+            this._mips = mips;
+
+            var dstWorld = this.getDstWorld();
+            if (dstWorld)
+            {
+                var renderer = dstWorld.getRenderer();
+                tex = renderer.getTextureByName(texMapName, wrap, mips );
+                this._texture = tex;
+                dstWorld.textureToLoad( tex );
+            }
+        }
+
+        return tex;
+    }
 
     var __texCounter = 0;
+    this.loadFromCanvas = function( srcCanvas,  wrap, mips )
+    {
+        this._srcCanvas = srcCanvas;
 
-    /*
-	this.loadFromCanvas = function( srcCanvas,  wrap, mips )
-	{
-		this._texMapName = "GLTexture_" + __texCounter;
-		__texCounter++;
-
-		//if (elt.elementModel && elt.elementModel.shapeModel && elt.elementModel.shapeModel.GLWorld)
-		var world = this.getDstWorld();
-		var renderer = world.getRenderer();
+        this._texMapName = "GLTexture_" + __texCounter;
+        __texCounter++;
 
-		// set default values for wrap and mips
+        // set default values for wrap and mips
         if (wrap === undefined)
             wrap = "REPEAT";
         if (mips === undefined)
             mips = true;
 
-		var imageData;
-		var width = srcCanvas.width,  height = srcCanvas.height;
-		width = 64;  height = 64;	// some even power of 2 for now...
-
-		// create a canvas to be used as the image for the texture map
-		var doc = srcCanvas.ownerDocument;
-		var dstCanvas = doc.createElement("canvas");
-		dstCanvas.width = width;
-		dstCanvas.height = height;
-		var dstCtx = dstCanvas.getContext("2d");
-
-		var tex;
-		var srcCtx = srcCanvas.getContext("2d");
-		if (srcCtx)
-		{
-			tex = renderer.getTextureByName(this._texMapName, wrap, mips );
-			imageData = srcCtx.getImageData( 0, 0, width, height );
-		    dstCtx.putImageData( imageData, 0, 0 );
-		}
-		else
-		{
-			tex = renderer.getTextureByName(this._texMapName, wrap, mips );
-			//tex = world.getGLContext().createTexture();
-			tex.image = new Image;
-			tex.wrap = wrap;
-			tex.mips = mips;
-
-			srcCtx = srcCanvas.getContext("experimental-webgl");
-			if (srcCtx)
-			{
-//				var data = new Uint8Array(width * height * 4);
-//				srcCtx.readPixels(0, 0, width, height, srcCtx.RGBA, srcCtx.UNSIGNED_BYTE, data);
-//				console.log( "pixel 0: " + data[width+0] + ", " + data[width+1] + ", " + data[width+2] + ", " + data[width+3] );
-//						
-//				//imageData.data = data;
-//				imageData = dstCtx.createImageData(width, height);
-//				var nBytes = width*height*4;
-//				for (var i=0;  i<nBytes;  i++)
-//					imageData.data[i] = data[i];
-//		        dstCtx.putImageData( imageData, 0, 0 );
-
-				var data = new Uint8Array(width * height * 4);
-				srcCtx.readPixels(0, 0, width, height, srcCtx.RGBA, srcCtx.UNSIGNED_BYTE, data);
-                for (var i=1;  i<10;  i++)
-                {
-				    console.log( "row " + i + ": " + data[i*4*width] + ", " + data[i*4*width+1] + ", " + data[i*4*width+2] + ", " + data[i*4*width+3] );
-                }
+        // we animate only if the source is an animated GLWorld
+        if (srcCanvas.elementModel && srcCanvas.elementModel.shapeModel  && srcCanvas.elementModel.shapeModel.GLWorld)
+            this._isAnimated = srcCanvas.elementModel.shapeModel.GLWorld._hasAnimatedMaterials;
 
-                dstCtx.drawImage(srcCanvas, 0, 0);
-			}
-		}
+        // create the texture
+        var world = this.getDstWorld();
+        tex = world.getGLContext().createTexture();
+        this._texture = tex;
+        tex.texparams = new _texparams(wrap, mips);	// defined in renderer.js
+        tex.image = new Image;
 
+        // create the canvas and context to render into
+        var doc = srcCanvas.ownerDocument;
+        this._renderCanvas = doc.createElement("canvas");
 
-		/////////////////
-		tex.image = dstCanvas;
+        // cache whether this is a 2D canvas or 3D canvas
+        var srcCtx = srcCanvas.getContext("2d");
+        this._is3D = false;
+        if (!srcCtx)  this._is3D = true;
 
-		this._texture = tex;
-		return tex;
-	}
-    */
+        this.rerender();
 
-    this.loadFromCanvas = function( srcCanvas,  wrap, mips )
-	{
-		this._srcCanvas = srcCanvas;
+        return tex;
+    }
 
-		this._texMapName = "GLTexture_" + __texCounter;
-		__texCounter++;
+    this.rerender = function()
+    {
+        if (!this._srcCanvas)
+        {
+            console.log( " no source canvas in GLTexture.rerender" );
+            return;
+        }
+        var srcCanvas = this._srcCanvas;
+
+        var world = this.getDstWorld();
+        if (!world)
+        {
+            console.log( "no world in GLTexture.rerender" );
+            return;
+        }
+        var renderer = world.getRenderer();
+
+        var imageData;
+        var width = srcCanvas.width,  height = srcCanvas.height;
+        if (!this.isPowerOfTwo(width) || !this.isPowerOfTwo(height))
+        {
+            width = this.nextHighestPowerOfTwo( width );
+            height = this.nextHighestPowerOfTwo( height );
+            //width = 64;  height = 64;
+        }
+
+        // create a canvas to be used as the image for the texture map
+        var doc = srcCanvas.ownerDocument;
+        var renderCanvas = this._renderCanvas;
+        if (!renderCanvas)
+        {
+            console.log( "no render canvas in GLTexture.rerender" );
+            return;
+        }
+        renderCanvas.width = width;
+        renderCanvas.height = height;
+        var renderCtx = renderCanvas.getContext("2d");
+
+        // create the texture
+        var tex = this._texture;
+        if (!tex)
+        {
+            console.log( "no texture in GLTexture.rerender" );
+            return;
+        }
+
+        var srcCtx;
+        if (!this._is3D)
+        {
+            srcCtx = srcCanvas.getContext("2d");
+            imageData = srcCtx.getImageData( 0, 0, width, height );
+            renderCtx.putImageData( imageData, 0, 0 );
+        }
+        else
+        {
+            srcCtx = srcCanvas.getContext("experimental-webgl");
+            if (srcCtx)
+            {
+                renderCtx.drawImage(srcCanvas, 0, 0);
+//				var data = new Uint8Array(width * height * 4);
+//				srcCtx.readPixels(0, 0, width, height, srcCtx.RGBA, srcCtx.UNSIGNED_BYTE, data);
+//				imageData = renderCtx.createImageData(width, height);
+//				var nBytes = width*height*4;
+//				for (var i=0;  i<nBytes;  i++)
+//					imageData.data[i] = data[i];
+//		        renderCtx.putImageData( imageData, 0, 0 );
 
-		// set default values for wrap and mips
-        if (wrap === undefined)
-            wrap = "REPEAT";
-        if (mips === undefined)
-            mips = true;
+            }
+        }
 
-		// we animate only if the source is an animated GLWorld
-		if (srcCanvas.elementModel && srcCanvas.elementModel.shapeModel  && srcCanvas.elementModel.shapeModel.GLWorld)
-			this._isAnimated = srcCanvas.elementModel.shapeModel.GLWorld._hasAnimatedMaterials;
-
-		// create the texture
-		var world = this.getDstWorld();
-		tex = world.getGLContext().createTexture();
-		this._texture = tex;
-		tex.texparams = new _texparams(wrap, mips);	// defined in renderer.js
-		tex.image = new Image;
-
-		// create the canvas and context to render into
-		var doc = srcCanvas.ownerDocument;
-		this._renderCanvas = doc.createElement("canvas");
-
-		// cache whether this is a 2D canvas or 3D canvas
-		var srcCtx = srcCanvas.getContext("2d");
-		this._is3D = false;
-		if (!srcCtx)  this.is3D = true;
-
-		this.rerender();
-
-		return tex;
-	}
-
-	this.rerender = function()
-	{
-		if (!this._srcCanvas)
-		{
-			console.log( " no source canvas in GLTexture.rerender" );
-			return;
-		}
-		var srcCanvas = this._srcCanvas;
-
-		var world = this.getDstWorld();
-		if (!world)
-		{
-			console.log( "no world in GLTexture.rerender" );
-			return;
-		}
-		var renderer = world.getRenderer();
-
-		var imageData;
-		var width = srcCanvas.width,  height = srcCanvas.height;
-		if (!this.isPowerOfTwo(width) || !this.isPowerOfTwo(height))
-		{
-			width = this.nextHighestPowerOfTwo( width );
-			height = this.nextHighestPowerOfTwo( height );
-		}
-        width = 64;  height = 64;
-
-		// create a canvas to be used as the image for the texture map
-		var doc = srcCanvas.ownerDocument;
-		var renderCanvas = this._renderCanvas;
-		if (!renderCanvas)
-		{
-			console.log( "no render canvas in GLTexture.rerender" );
-			return;
-		}
-		renderCanvas.width = width;
-		renderCanvas.height = height;
-		var renderCtx = renderCanvas.getContext("2d");
-
-		// create the texture
-		var tex = this._texture;
-		if (!tex)
-		{
-			console.log( "no texture in GLTexture.rerender" );
-			return;
-		}
-
-		var srcCtx;
-		if (!this.is3D)
-		{
-			srcCtx = srcCanvas.getContext("2d");
-			imageData = srcCtx.getImageData( 0, 0, width, height );
-		}
-		else
-		{
-			srcCtx = srcCanvas.getContext("experimental-webgl");
-			if (srcCtx)
-			{
-				var data = new Uint8Array(width * height * 4);
-				srcCtx.readPixels(0, 0, width, height, srcCtx.RGBA, srcCtx.UNSIGNED_BYTE, data);
-						
-				imageData = renderCtx.createImageData(width, height);
-				var nBytes = width*height*4;
-				for (var i=0;  i<nBytes;  i++)
-					imageData.data[i] = data[i];
-                var nPrint = nBytes;
-                if (nPrint > 1000)  nPrint = 1000;
-                for (var i=0; i<nPrint;  i++)
-                    console.log( " " + data[i] );
-			}
-		}
-		renderCtx.putImageData( imageData, 0, 0 );
-
-		/////////////////
-		tex.image = renderCanvas;
-		renderer.commitTexture( tex );
-
-		return tex;
-    }
+        /////////////////
+        tex.image = renderCanvas;
+        renderer.commitTexture( tex );
 
+        return tex;
+}
  
-	this.isPowerOfTwo = function(x)
-	{
-		return (x & (x - 1)) == 0;
-	}
+    this.isPowerOfTwo = function(x)
+    {
+        return (x & (x - 1)) == 0;
+    }
  
-	this.nextHighestPowerOfTwo = function(x)
-	{
-		--x;
-		for (var i = 1; i < 32; i <<= 1) {
-			x = x | x >> i;
-		}
-		return x + 1;
-	}
+    this.nextHighestPowerOfTwo = function(x)
+    {
+        --x;
+        for (var i = 1; i < 32; i <<= 1) {
+            x = x | x >> i;
+        }
+        return x + 1;
+    }
 }
 
 if (typeof exports === "object") {
-- 
cgit v1.2.3