WebGL Render Bug Fix

docs/files/src_pixi_InteractionManager.js.html

@@ -337,6 +337,7 @@ PIXI.InteractionManager.prototype.update = function()
 
 PIXI.InteractionManager.prototype.onMouseMove = function(event)
 {
+	this.mouse.originalEvent = event || window.event; //IE uses window.event
 	// TODO optimize by not check EVERY TIME! maybe half as often? //
 	var rect = this.target.view.getBoundingClientRect();
 	
@@ -362,6 +363,7 @@ PIXI.InteractionManager.prototype.onMouseMove = function(event)
 PIXI.InteractionManager.prototype.onMouseDown = function(event)
 {
 	event.preventDefault();
+	this.mouse.originalEvent = event || window.event; //IE uses window.event
 	
 	// loop through inteaction tree...
 	// hit test each item! -> 
@@ -399,7 +401,7 @@ PIXI.InteractionManager.prototype.onMouseDown = function(event)
 
 PIXI.InteractionManager.prototype.onMouseUp = function(event)
 {
-	
+	this.mouse.originalEvent = event || window.event; //IE uses window.event
 	
 	var global = this.mouse.global;
 	
@@ -532,6 +534,7 @@ PIXI.InteractionManager.prototype.hitTest = function(item, interactionData)
 
 PIXI.InteractionManager.prototype.onTouchMove = function(event)
 {
+	this.mouse.originalEvent = event || window.event; //IE uses window.event
 	var rect = this.target.view.getBoundingClientRect();
 	var changedTouches = event.changedTouches;
 	
@@ -556,6 +559,7 @@ PIXI.InteractionManager.prototype.onTouchMove = function(event)
 PIXI.InteractionManager.prototype.onTouchStart = function(event)
 {
 	event.preventDefault();
+	this.mouse.originalEvent = event || window.event; //IE uses window.event
 	
 	var rect = this.target.view.getBoundingClientRect();
 	
@@ -598,6 +602,7 @@ PIXI.InteractionManager.prototype.onTouchStart = function(event)
 
 PIXI.InteractionManager.prototype.onTouchEnd = function(event)
 {
+	this.mouse.originalEvent = event || window.event; //IE uses window.event
 	var rect = this.target.view.getBoundingClientRect();
 	var changedTouches = event.changedTouches;
 	
@@ -682,6 +687,13 @@ PIXI.InteractionData = function()
 	 * @type Sprite
 	 */
 	this.target;
+
+	/**
+	 * When passed to an event handler, this will be the original DOM Event that was captured
+	 * @property originalEvent
+	 * @type Event
+	 */
+	this.originalEvent;
 }
 
 /**

docs/files/src_pixi_loaders_SpriteSheetLoader.js.html

@@ -236,6 +236,7 @@ PIXI.SpriteSheetLoader.prototype.onLoaded = function () {
 		content: this
 	});
 };
+
     </pre>
 </div>
 

docs/files/src_pixi_primitives_Graphics.js.html

@@ -149,6 +149,8 @@
 
 /**
  * The Graphics class contains a set of methods that you can use to create primitive shapes and lines. 
+ * It is important to know that with the webGL renderer only simple polys can be filled at this stage
+ * Complex polys will not be filled. Heres an example of a complex poly: http://www.goodboydigital.com/wp-content/uploads/2013/06/complexPolygon.png
  * @class Graphics 
  * @extends DisplayObjectContainer
  * @constructor

docs/files/src_pixi_renderers_canvas_CanvasGraphics.js.html

@@ -166,6 +166,7 @@ PIXI.CanvasGraphics = function()
  */
 PIXI.CanvasGraphics.renderGraphics = function(graphics, context)
 {
+	var worldAlpha = graphics.worldAlpha;
 	
 	for (var i=0; i < graphics.graphicsData.length; i++) 
 	{
@@ -198,13 +199,13 @@ PIXI.CanvasGraphics.renderGraphics = function(graphics, context)
 			
 			if(data.fill)
 			{
-				context.globalAlpha = data.fillAlpha;
+				context.globalAlpha = data.fillAlpha * worldAlpha;
 				context.fillStyle = color = '#' + ('00000' + ( data.fillColor | 0).toString(16)).substr(-6);
       			context.fill();
 			}
 			if(data.lineWidth)
 			{
-				context.globalAlpha = data.lineAlpha;
+				context.globalAlpha = data.lineAlpha * worldAlpha;
       			context.stroke();
 			}
 		}
@@ -213,14 +214,14 @@ PIXI.CanvasGraphics.renderGraphics = function(graphics, context)
 			// TODO - need to be Undefined!
 			if(data.fillColor)
 			{
-				context.globalAlpha = data.fillAlpha;
+				context.globalAlpha = data.fillAlpha * worldAlpha;
 				context.fillStyle = color = '#' + ('00000' + ( data.fillColor | 0).toString(16)).substr(-6);
 				context.fillRect(points[0], points[1], points[2], points[3]);
 				
 			}
 			if(data.lineWidth)
 			{
-				context.globalAlpha = data.lineAlpha;
+				context.globalAlpha = data.lineAlpha * worldAlpha;
 				context.strokeRect(points[0], points[1], points[2], points[3]);
 			}
 		}
@@ -233,13 +234,13 @@ PIXI.CanvasGraphics.renderGraphics = function(graphics, context)
 			
 			if(data.fill)
 			{
-				context.globalAlpha = data.fillAlpha;
+				context.globalAlpha = data.fillAlpha * worldAlpha;
 				context.fillStyle = color = '#' + ('00000' + ( data.fillColor | 0).toString(16)).substr(-6);
       			context.fill();
 			}
 			if(data.lineWidth)
 			{
-				context.globalAlpha = data.lineAlpha;
+				context.globalAlpha = data.lineAlpha * worldAlpha;
       			context.stroke();
 			}
 		}
@@ -276,13 +277,13 @@ PIXI.CanvasGraphics.renderGraphics = function(graphics, context)
 			
 			if(data.fill)
 			{
-				context.globalAlpha = data.fillAlpha;
+				context.globalAlpha = data.fillAlpha * worldAlpha;
 				context.fillStyle = color = '#' + ('00000' + ( data.fillColor | 0).toString(16)).substr(-6);
       			context.fill();
 			}
 			if(data.lineWidth)
 			{
-				context.globalAlpha = data.lineAlpha;
+				context.globalAlpha = data.lineAlpha * worldAlpha;
       			context.stroke();
 			}
 		}

docs/files/src_pixi_renderers_canvas_CanvasRenderer.js.html

@@ -401,6 +401,8 @@ PIXI.CanvasRenderer.prototype.renderTilingSprite = function(sprite)
 {
 	var context = this.context;
 	
+	context.globalAlpha = sprite.worldAlpha;
+	
  	if(!sprite.__tilePattern) sprite.__tilePattern = context.createPattern(sprite.texture.baseTexture.source, "repeat");
  	
 	context.beginPath();

docs/files/src_pixi_renderers_webgl_WebGLBatch.js.html

@@ -660,6 +660,7 @@ PIXI.WebGLBatch.prototype.update = function()
  */
 PIXI.WebGLBatch.prototype.render = function(start, end)
 {
+	
 //	console.log(start + " :: " + end + " : " + this.size);
 	start = start || 0;
 	//end = end || this.size;
@@ -672,6 +673,7 @@ PIXI.WebGLBatch.prototype.render = function(start, end)
 		
 	}
 	
+	
 	if (this.size == 0)return;
 	
 	this.update();
@@ -688,7 +690,6 @@ PIXI.WebGLBatch.prototype.render = function(start, end)
 	// ok..
 	gl.bufferSubData(gl.ARRAY_BUFFER, 0, this.verticies)
     gl.vertexAttribPointer(shaderProgram.vertexPositionAttribute, 2, gl.FLOAT, false, 0, 0);
-	
 	// update the uvs
    	gl.bindBuffer(gl.ARRAY_BUFFER, this.uvBuffer);
 
@@ -722,7 +723,7 @@ PIXI.WebGLBatch.prototype.render = function(start, end)
 	var len = end - start;
 	// console.log(this.size)
     // DRAW THAT this!
-    gl.drawElements(gl.TRIANGLES, len * 6, gl.UNSIGNED_SHORT, start * 2 * 6 );
+//    gl.drawElements(gl.TRIANGLES, len * 6, gl.UNSIGNED_SHORT, start * 2 * 6 );
 }
 
 

docs/files/src_pixi_renderers_webgl_WebGLGraphics.js.html

@@ -159,7 +159,7 @@ PIXI.WebGLGraphics = function()
 
 PIXI.WebGLGraphics.renderGraphics = function(graphics, projection)
 {
-	PIXI.activatePrimitiveShader();
+	
 	var gl = PIXI.gl;
 	
 	if(!graphics._webGL)graphics._webGL = {points:[], indices:[], lastIndex:0, 
@@ -176,27 +176,47 @@ PIXI.WebGLGraphics.renderGraphics = function(graphics, projection)
 			
 			graphics._webGL.lastIndex = 0;
 			graphics._webGL.points = [];
+			graphics._webGL.indices = [];
+			
 		}
 		
 		PIXI.WebGLGraphics.updateGraphics(graphics);
 	}
 	
+	
+	PIXI.activatePrimitiveShader();
+	
 	// This  could be speeded up fo sure!
 	var m = PIXI.mat3.clone(graphics.worldTransform);
 	
 	PIXI.mat3.transpose(m);
 	
 	// set the matrix transform for the 
+ 	gl.blendFunc(gl.ONE, gl.ONE_MINUS_SRC_ALPHA);
+ 	
  	gl.uniformMatrix3fv(PIXI.primitiveProgram.translationMatrix, false, m);
+ 	
 	gl.uniform2f(PIXI.primitiveProgram.projectionVector, projection.x, projection.y);
+	
+	gl.uniform1f(PIXI.primitiveProgram.alpha, graphics.worldAlpha);
 
 	gl.bindBuffer(gl.ARRAY_BUFFER, graphics._webGL.buffer);
+	
+	// WHY DOES THIS LINE NEED TO BE THERE???
+	gl.vertexAttribPointer(PIXI.shaderProgram.vertexPositionAttribute, 2, gl.FLOAT, false, 0, 0);
+	// its not even used.. but need to be set or it breaks?
+	// only on pc though..
+	
 	gl.vertexAttribPointer(PIXI.primitiveProgram.vertexPositionAttribute, 2, gl.FLOAT, false, 4 * 6, 0);
 	gl.vertexAttribPointer(PIXI.primitiveProgram.colorAttribute, 4, gl.FLOAT, false,4 * 6, 2 * 4);
 	
+//	console.log(PIXI.primitiveProgram.vertexPositionAttribute);
+	//console.log("Color " + PIXI.primitiveProgram.colorAttribute);
+	
 	// set the index buffer!
 	gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, graphics._webGL.indexBuffer);
 	
+	
 	gl.drawElements(gl.TRIANGLE_STRIP,  graphics._webGL.indices.length, gl.UNSIGNED_SHORT, 0 );
 	
 	// return to default shader...
@@ -237,6 +257,7 @@ PIXI.WebGLGraphics.updateGraphics = function(graphics)
 	var gl = PIXI.gl;
 
 	graphics._webGL.glPoints = new Float32Array(graphics._webGL.points);
+	
 	gl.bindBuffer(gl.ARRAY_BUFFER, graphics._webGL.buffer);
 	gl.bufferData(gl.ARRAY_BUFFER, graphics._webGL.glPoints, gl.STATIC_DRAW);
 	

docs/files/src_pixi_renderers_webgl_WebGLRenderGroup.js.html

@@ -928,6 +928,8 @@ PIXI.WebGLRenderGroup.prototype.renderStrip = function(strip, projection)
 	// set the matrix transform for the 
  	gl.uniformMatrix3fv(PIXI.stripShaderProgram.translationMatrix, false, m);
 	gl.uniform2f(PIXI.stripShaderProgram.projectionVector, projection.x, projection.y);
+	gl.uniform1f(PIXI.stripShaderProgram.alpha, strip.worldAlpha);
+
 
 	if(strip.blendMode == PIXI.blendModes.NORMAL)
 	{
@@ -938,6 +940,8 @@ PIXI.WebGLRenderGroup.prototype.renderStrip = function(strip, projection)
 		gl.blendFunc(gl.ONE, gl.ONE_MINUS_SRC_COLOR);
 	}
 	
+	
+	
 	if(!strip.dirty)
 	{
 		
@@ -1030,7 +1034,7 @@ PIXI.WebGLRenderGroup.prototype.renderTilingSprite = function(sprite, projection
 /**
  * @private
  */
-PIXI.WebGLRenderer.prototype.initStrip = function(strip)
+PIXI.WebGLRenderGroup.prototype.initStrip = function(strip)
 {
 	// build the strip!
 	var gl = this.gl;

docs/files/src_pixi_renderers_webgl_WebGLRenderer.js.html

@@ -191,7 +191,7 @@ PIXI.WebGLRenderer = function(width, height, view, transparent)
  	{
         PIXI.gl = this.gl = this.view.getContext("experimental-webgl",  {  	
     		 alpha: this.transparent,
-    		 antialias:false, // SPEED UP??
+    		 antialias:true, // SPEED UP??
     		 premultipliedAlpha:false
         });
     } 
@@ -446,9 +446,11 @@ PIXI.WebGLRenderer.prototype.handleContextRestored = function(event)
         
 	this.initShaders();	
 	
-	for (var i=0; i < PIXI.TextureCache.length; i++) 
+	for(var key in PIXI.TextureCache) 
 	{
-		this.updateTexture(PIXI.TextureCache[i]);
+        	var texture = PIXI.TextureCache[key].baseTexture;
+        	texture._glTexture = null;
+        	PIXI.WebGLRenderer.updateTexture(texture);
 	};
 	
 	for (var i=0; i <  this.batchs.length; i++) 

docs/files/src_pixi_renderers_webgl_WebGLShaders.js.html

@@ -168,6 +168,7 @@ PIXI.shaderVertexSrc = [
   "attribute vec2 aTextureCoord;",
   "attribute float aColor;",
   //"uniform mat4 uMVMatrix;",
+  
   "uniform vec2 projectionVector;",
   "varying vec2 vTextureCoord;",
   "varying float vColor;",
@@ -182,6 +183,20 @@ PIXI.shaderVertexSrc = [
 /*
  * the triangle strip shader..
  */
+
+PIXI.stripShaderFragmentSrc = [
+  "precision mediump float;",
+  "varying vec2 vTextureCoord;",
+  "varying float vColor;",
+  "uniform float alpha;",
+  "uniform sampler2D uSampler;",
+  "void main(void) {",
+    "gl_FragColor = texture2D(uSampler, vec2(vTextureCoord.x, vTextureCoord.y));",
+    "gl_FragColor = gl_FragColor * alpha;",
+  "}"
+];
+
+
 PIXI.stripShaderVertexSrc = [
   "attribute vec2 aVertexPosition;",
   "attribute vec2 aTextureCoord;",
@@ -216,16 +231,18 @@ PIXI.primitiveShaderVertexSrc = [
   "attribute vec4 aColor;",
   "uniform mat3 translationMatrix;",
   "uniform vec2 projectionVector;",
+  "uniform float alpha;",
   "varying vec4 vColor;",
   "void main(void) {",
   	"vec3 v = translationMatrix * vec3(aVertexPosition, 1.0);",
     "gl_Position = vec4( v.x / projectionVector.x -1.0, v.y / -projectionVector.y + 1.0 , 0.0, 1.0);",
-    "vColor = aColor;",
+    "vColor = aColor  * alpha;",
   "}"
 ];
 
 PIXI.initPrimitiveShader = function() 
 {
+	return;
 	var gl = PIXI.gl;
 
 	var shaderProgram = PIXI.compileProgram(PIXI.primitiveShaderVertexSrc, PIXI.primitiveShaderFragmentSrc)
@@ -234,8 +251,11 @@ PIXI.initPrimitiveShader = function()
 
     shaderProgram.vertexPositionAttribute = gl.getAttribLocation(shaderProgram, "aVertexPosition");
     shaderProgram.colorAttribute = gl.getAttribLocation(shaderProgram, "aColor");
+    
     shaderProgram.projectionVector = gl.getUniformLocation(shaderProgram, "projectionVector");
     shaderProgram.translationMatrix = gl.getUniformLocation(shaderProgram, "translationMatrix");
+    
+	shaderProgram.alpha = gl.getUniformLocation(shaderProgram, "alpha");
 
 	PIXI.primitiveProgram = shaderProgram;
 }
@@ -252,7 +272,7 @@ PIXI.initDefaultShader = function()
     shaderProgram.textureCoordAttribute = gl.getAttribLocation(shaderProgram, "aTextureCoord");
 	shaderProgram.colorAttribute = gl.getAttribLocation(shaderProgram, "aColor");
 
-    shaderProgram.mvMatrixUniform = gl.getUniformLocation(shaderProgram, "uMVMatrix");
+   // shaderProgram.mvMatrixUniform = gl.getUniformLocation(shaderProgram, "uMVMatrix");
     shaderProgram.samplerUniform = gl.getUniformLocation(shaderProgram, "uSampler");
     
 	PIXI.shaderProgram = shaderProgram;
@@ -261,7 +281,7 @@ PIXI.initDefaultShader = function()
 PIXI.initDefaultStripShader = function() 
 {
 	var gl = this.gl;
-	var shaderProgram = PIXI.compileProgram(PIXI.stripShaderVertexSrc, PIXI.shaderFragmentSrc)
+	var shaderProgram = PIXI.compileProgram(PIXI.stripShaderVertexSrc, PIXI.stripShaderFragmentSrc)
 	
     gl.useProgram(shaderProgram);
 
@@ -269,6 +289,7 @@ PIXI.initDefaultStripShader = function()
     shaderProgram.projectionVector = gl.getUniformLocation(shaderProgram, "projectionVector");
     shaderProgram.textureCoordAttribute = gl.getAttribLocation(shaderProgram, "aTextureCoord");
 	shaderProgram.translationMatrix = gl.getUniformLocation(shaderProgram, "translationMatrix");
+	shaderProgram.alpha = gl.getUniformLocation(shaderProgram, "alpha");
 
 	shaderProgram.colorAttribute = gl.getAttribLocation(shaderProgram, "aColor");
 
@@ -311,9 +332,13 @@ PIXI.activateDefaultShader = function()
 	
 	gl.useProgram(shaderProgram);
 	
+	
 	gl.enableVertexAttribArray(shaderProgram.vertexPositionAttribute);
     gl.enableVertexAttribArray(shaderProgram.textureCoordAttribute);
     gl.enableVertexAttribArray(shaderProgram.colorAttribute);
+    
+
+	
 } 
 
 PIXI.compileProgram = function(vertexSrc, fragmentSrc)

docs/files/src_pixi_textures_BaseTexture.js.html

@@ -256,7 +256,9 @@ PIXI.BaseTexture.fromImage = function(imageUrl, crossorigin)
 	var baseTexture = PIXI.BaseTextureCache[imageUrl];
 	if(!baseTexture)
 	{
-		var image = new Image();
+		// new Image() breaks tex loading in some versions of Chrome.
+		// See https://code.google.com/p/chromium/issues/detail?id=238071
+		var image = new Image();//document.createElement('img'); 
 		if (crossorigin)
 		{
 			image.crossOrigin = '';

docs/files/src_pixi_textures_RenderTexture.js.html

@@ -147,13 +147,33 @@
  */
 
 /**
- * A RenderTexture is a special texture that allows any pixi displayObject to be rendered to it. 
- * @class RenderTexture
- * @extends Texture
- * @constructor
- * @param width {Number}
- * @param height {Number}
- */
+ A RenderTexture is a special texture that allows any pixi displayObject to be rendered to it.
+
+ __Hint__: All DisplayObjects (exmpl. Sprites) that renders on RenderTexture should be preloaded. 
+ Otherwise black rectangles will be drawn instead.  
+ 
+ RenderTexture takes snapshot of DisplayObject passed to render method. If DisplayObject is passed to render method, position and rotation of it will be ignored. For example:
+ 
+	var renderTexture = new PIXI.RenderTexture(800, 600);
+	var sprite = PIXI.Sprite.fromImage("spinObj_01.png");
+	sprite.position.x = 800/2;
+	sprite.position.y = 600/2;
+	sprite.anchor.x = 0.5;
+	sprite.anchor.y = 0.5;
+	renderTexture.render(sprite);
+
+ Sprite in this case will be rendered to 0,0 position. To render this sprite at center DisplayObjectContainer should be used:
+
+	var doc = new PIXI.DisplayObjectContainer();
+	doc.addChild(sprite);
+	renderTexture.render(doc);  // Renders to center of renderTexture
+
+ @class RenderTexture
+ @extends Texture
+ @constructor
+ @param width {Number}
+ @param height {Number}
+ **/
 PIXI.RenderTexture = function(width, height)
 {
 	PIXI.EventTarget.call( this );