mirror of
https://github.com/logsol/chuck.js.git
synced 2026-05-12 11:07:34 +00:00
updated pixi to v2
This commit is contained in:
parent
a5b3d2f671
commit
58b83f7297
95 changed files with 44677 additions and 3522 deletions
358
app/Lib/Vendor/src/pixi/renderers/canvas/CanvasGraphics.js
vendored
Normal file
358
app/Lib/Vendor/src/pixi/renderers/canvas/CanvasGraphics.js
vendored
Normal file
|
|
@ -0,0 +1,358 @@
|
|||
/**
|
||||
* @author Mat Groves http://matgroves.com/ @Doormat23
|
||||
*/
|
||||
|
||||
|
||||
/**
|
||||
* A set of functions used by the canvas renderer to draw the primitive graphics data.
|
||||
*
|
||||
* @class CanvasGraphics
|
||||
* @static
|
||||
*/
|
||||
PIXI.CanvasGraphics = function()
|
||||
{
|
||||
};
|
||||
|
||||
/*
|
||||
* Renders a PIXI.Graphics object to a canvas.
|
||||
*
|
||||
* @method renderGraphics
|
||||
* @static
|
||||
* @param graphics {Graphics} the actual graphics object to render
|
||||
* @param context {CanvasRenderingContext2D} the 2d drawing method of the canvas
|
||||
*/
|
||||
PIXI.CanvasGraphics.renderGraphics = function(graphics, context)
|
||||
{
|
||||
var worldAlpha = graphics.worldAlpha;
|
||||
|
||||
if(graphics.dirty)
|
||||
{
|
||||
this.updateGraphicsTint(graphics);
|
||||
graphics.dirty = false;
|
||||
}
|
||||
|
||||
|
||||
for (var i = 0; i < graphics.graphicsData.length; i++)
|
||||
{
|
||||
var data = graphics.graphicsData[i];
|
||||
var shape = data.shape;
|
||||
|
||||
var fillColor = data._fillTint;
|
||||
var lineColor = data._lineTint;
|
||||
|
||||
context.lineWidth = data.lineWidth;
|
||||
|
||||
if(data.type === PIXI.Graphics.POLY)
|
||||
{
|
||||
context.beginPath();
|
||||
|
||||
var points = shape.points;
|
||||
|
||||
context.moveTo(points[0], points[1]);
|
||||
|
||||
for (var j=1; j < points.length/2; j++)
|
||||
{
|
||||
context.lineTo(points[j * 2], points[j * 2 + 1]);
|
||||
}
|
||||
|
||||
if(shape.closed)
|
||||
{
|
||||
context.lineTo(points[0], points[1]);
|
||||
}
|
||||
|
||||
// if the first and last point are the same close the path - much neater :)
|
||||
if(points[0] === points[points.length-2] && points[1] === points[points.length-1])
|
||||
{
|
||||
context.closePath();
|
||||
}
|
||||
|
||||
if(data.fill)
|
||||
{
|
||||
context.globalAlpha = data.fillAlpha * worldAlpha;
|
||||
context.fillStyle = '#' + ('00000' + ( fillColor | 0).toString(16)).substr(-6);
|
||||
context.fill();
|
||||
}
|
||||
if(data.lineWidth)
|
||||
{
|
||||
context.globalAlpha = data.lineAlpha * worldAlpha;
|
||||
context.strokeStyle = '#' + ('00000' + ( lineColor | 0).toString(16)).substr(-6);
|
||||
context.stroke();
|
||||
}
|
||||
}
|
||||
else if(data.type === PIXI.Graphics.RECT)
|
||||
{
|
||||
|
||||
if(data.fillColor || data.fillColor === 0)
|
||||
{
|
||||
context.globalAlpha = data.fillAlpha * worldAlpha;
|
||||
context.fillStyle = '#' + ('00000' + ( fillColor | 0).toString(16)).substr(-6);
|
||||
context.fillRect(shape.x, shape.y, shape.width, shape.height);
|
||||
|
||||
}
|
||||
if(data.lineWidth)
|
||||
{
|
||||
context.globalAlpha = data.lineAlpha * worldAlpha;
|
||||
context.strokeStyle = '#' + ('00000' + ( lineColor | 0).toString(16)).substr(-6);
|
||||
context.strokeRect(shape.x, shape.y, shape.width, shape.height);
|
||||
}
|
||||
}
|
||||
else if(data.type === PIXI.Graphics.CIRC)
|
||||
{
|
||||
// TODO - need to be Undefined!
|
||||
context.beginPath();
|
||||
context.arc(shape.x, shape.y, shape.radius,0,2*Math.PI);
|
||||
context.closePath();
|
||||
|
||||
if(data.fill)
|
||||
{
|
||||
context.globalAlpha = data.fillAlpha * worldAlpha;
|
||||
context.fillStyle = '#' + ('00000' + ( fillColor | 0).toString(16)).substr(-6);
|
||||
context.fill();
|
||||
}
|
||||
if(data.lineWidth)
|
||||
{
|
||||
context.globalAlpha = data.lineAlpha * worldAlpha;
|
||||
context.strokeStyle = '#' + ('00000' + ( lineColor | 0).toString(16)).substr(-6);
|
||||
context.stroke();
|
||||
}
|
||||
}
|
||||
else if(data.type === PIXI.Graphics.ELIP)
|
||||
{
|
||||
// ellipse code taken from: http://stackoverflow.com/questions/2172798/how-to-draw-an-oval-in-html5-canvas
|
||||
|
||||
var w = shape.width * 2;
|
||||
var h = shape.height * 2;
|
||||
|
||||
var x = shape.x - w/2;
|
||||
var y = shape.y - h/2;
|
||||
|
||||
context.beginPath();
|
||||
|
||||
var kappa = 0.5522848,
|
||||
ox = (w / 2) * kappa, // control point offset horizontal
|
||||
oy = (h / 2) * kappa, // control point offset vertical
|
||||
xe = x + w, // x-end
|
||||
ye = y + h, // y-end
|
||||
xm = x + w / 2, // x-middle
|
||||
ym = y + h / 2; // y-middle
|
||||
|
||||
context.moveTo(x, ym);
|
||||
context.bezierCurveTo(x, ym - oy, xm - ox, y, xm, y);
|
||||
context.bezierCurveTo(xm + ox, y, xe, ym - oy, xe, ym);
|
||||
context.bezierCurveTo(xe, ym + oy, xm + ox, ye, xm, ye);
|
||||
context.bezierCurveTo(xm - ox, ye, x, ym + oy, x, ym);
|
||||
|
||||
context.closePath();
|
||||
|
||||
if(data.fill)
|
||||
{
|
||||
context.globalAlpha = data.fillAlpha * worldAlpha;
|
||||
context.fillStyle = '#' + ('00000' + ( fillColor | 0).toString(16)).substr(-6);
|
||||
context.fill();
|
||||
}
|
||||
if(data.lineWidth)
|
||||
{
|
||||
context.globalAlpha = data.lineAlpha * worldAlpha;
|
||||
context.strokeStyle = '#' + ('00000' + ( lineColor | 0).toString(16)).substr(-6);
|
||||
context.stroke();
|
||||
}
|
||||
}
|
||||
else if (data.type === PIXI.Graphics.RREC)
|
||||
{
|
||||
var rx = shape.x;
|
||||
var ry = shape.y;
|
||||
var width = shape.width;
|
||||
var height = shape.height;
|
||||
var radius = shape.radius;
|
||||
|
||||
var maxRadius = Math.min(width, height) / 2 | 0;
|
||||
radius = radius > maxRadius ? maxRadius : radius;
|
||||
|
||||
context.beginPath();
|
||||
context.moveTo(rx, ry + radius);
|
||||
context.lineTo(rx, ry + height - radius);
|
||||
context.quadraticCurveTo(rx, ry + height, rx + radius, ry + height);
|
||||
context.lineTo(rx + width - radius, ry + height);
|
||||
context.quadraticCurveTo(rx + width, ry + height, rx + width, ry + height - radius);
|
||||
context.lineTo(rx + width, ry + radius);
|
||||
context.quadraticCurveTo(rx + width, ry, rx + width - radius, ry);
|
||||
context.lineTo(rx + radius, ry);
|
||||
context.quadraticCurveTo(rx, ry, rx, ry + radius);
|
||||
context.closePath();
|
||||
|
||||
if(data.fillColor || data.fillColor === 0)
|
||||
{
|
||||
context.globalAlpha = data.fillAlpha * worldAlpha;
|
||||
context.fillStyle = '#' + ('00000' + ( fillColor | 0).toString(16)).substr(-6);
|
||||
context.fill();
|
||||
|
||||
}
|
||||
if(data.lineWidth)
|
||||
{
|
||||
context.globalAlpha = data.lineAlpha * worldAlpha;
|
||||
context.strokeStyle = '#' + ('00000' + ( lineColor | 0).toString(16)).substr(-6);
|
||||
context.stroke();
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
/*
|
||||
* Renders a graphics mask
|
||||
*
|
||||
* @static
|
||||
* @private
|
||||
* @method renderGraphicsMask
|
||||
* @param graphics {Graphics} the graphics which will be used as a mask
|
||||
* @param context {CanvasRenderingContext2D} the context 2d method of the canvas
|
||||
*/
|
||||
PIXI.CanvasGraphics.renderGraphicsMask = function(graphics, context)
|
||||
{
|
||||
var len = graphics.graphicsData.length;
|
||||
|
||||
if(len === 0) return;
|
||||
|
||||
if(len > 1)
|
||||
{
|
||||
len = 1;
|
||||
window.console.log('Pixi.js warning: masks in canvas can only mask using the first path in the graphics object');
|
||||
}
|
||||
|
||||
for (var i = 0; i < 1; i++)
|
||||
{
|
||||
var data = graphics.graphicsData[i];
|
||||
var shape = data.shape;
|
||||
|
||||
if(data.type === PIXI.Graphics.POLY)
|
||||
{
|
||||
context.beginPath();
|
||||
|
||||
var points = shape.points;
|
||||
|
||||
context.moveTo(points[0], points[1]);
|
||||
|
||||
for (var j=1; j < points.length/2; j++)
|
||||
{
|
||||
context.lineTo(points[j * 2], points[j * 2 + 1]);
|
||||
}
|
||||
|
||||
// if the first and last point are the same close the path - much neater :)
|
||||
if(points[0] === points[points.length-2] && points[1] === points[points.length-1])
|
||||
{
|
||||
context.closePath();
|
||||
}
|
||||
|
||||
}
|
||||
else if(data.type === PIXI.Graphics.RECT)
|
||||
{
|
||||
context.beginPath();
|
||||
context.rect(shape.x, shape.y, shape.width, shape.height);
|
||||
context.closePath();
|
||||
}
|
||||
else if(data.type === PIXI.Graphics.CIRC)
|
||||
{
|
||||
// TODO - need to be Undefined!
|
||||
context.beginPath();
|
||||
context.arc(shape.x, shape.y, shape.radius,0,2*Math.PI);
|
||||
context.closePath();
|
||||
}
|
||||
else if(data.type === PIXI.Graphics.ELIP)
|
||||
{
|
||||
|
||||
// ellipse code taken from: http://stackoverflow.com/questions/2172798/how-to-draw-an-oval-in-html5-canvas
|
||||
|
||||
var w = shape.width * 2;
|
||||
var h = shape.height * 2;
|
||||
|
||||
var x = shape.x - w/2;
|
||||
var y = shape.y - h/2;
|
||||
|
||||
context.beginPath();
|
||||
|
||||
var kappa = 0.5522848,
|
||||
ox = (w / 2) * kappa, // control point offset horizontal
|
||||
oy = (h / 2) * kappa, // control point offset vertical
|
||||
xe = x + w, // x-end
|
||||
ye = y + h, // y-end
|
||||
xm = x + w / 2, // x-middle
|
||||
ym = y + h / 2; // y-middle
|
||||
|
||||
context.moveTo(x, ym);
|
||||
context.bezierCurveTo(x, ym - oy, xm - ox, y, xm, y);
|
||||
context.bezierCurveTo(xm + ox, y, xe, ym - oy, xe, ym);
|
||||
context.bezierCurveTo(xe, ym + oy, xm + ox, ye, xm, ye);
|
||||
context.bezierCurveTo(xm - ox, ye, x, ym + oy, x, ym);
|
||||
context.closePath();
|
||||
}
|
||||
else if (data.type === PIXI.Graphics.RREC)
|
||||
{
|
||||
|
||||
var pts = shape.points;
|
||||
var rx = pts[0];
|
||||
var ry = pts[1];
|
||||
var width = pts[2];
|
||||
var height = pts[3];
|
||||
var radius = pts[4];
|
||||
|
||||
var maxRadius = Math.min(width, height) / 2 | 0;
|
||||
radius = radius > maxRadius ? maxRadius : radius;
|
||||
|
||||
context.beginPath();
|
||||
context.moveTo(rx, ry + radius);
|
||||
context.lineTo(rx, ry + height - radius);
|
||||
context.quadraticCurveTo(rx, ry + height, rx + radius, ry + height);
|
||||
context.lineTo(rx + width - radius, ry + height);
|
||||
context.quadraticCurveTo(rx + width, ry + height, rx + width, ry + height - radius);
|
||||
context.lineTo(rx + width, ry + radius);
|
||||
context.quadraticCurveTo(rx + width, ry, rx + width - radius, ry);
|
||||
context.lineTo(rx + radius, ry);
|
||||
context.quadraticCurveTo(rx, ry, rx, ry + radius);
|
||||
context.closePath();
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
PIXI.CanvasGraphics.updateGraphicsTint = function(graphics)
|
||||
{
|
||||
if(graphics.tint === 0xFFFFFF)return;
|
||||
|
||||
var tintR = (graphics.tint >> 16 & 0xFF) / 255;
|
||||
var tintG = (graphics.tint >> 8 & 0xFF) / 255;
|
||||
var tintB = (graphics.tint & 0xFF)/ 255;
|
||||
|
||||
for (var i = 0; i < graphics.graphicsData.length; i++)
|
||||
{
|
||||
var data = graphics.graphicsData[i];
|
||||
|
||||
var fillColor = data.fillColor | 0;
|
||||
var lineColor = data.lineColor | 0;
|
||||
|
||||
/*
|
||||
var colorR = (fillColor >> 16 & 0xFF) / 255;
|
||||
var colorG = (fillColor >> 8 & 0xFF) / 255;
|
||||
var colorB = (fillColor & 0xFF) / 255;
|
||||
|
||||
colorR *= tintR;
|
||||
colorG *= tintG;
|
||||
colorB *= tintB;
|
||||
|
||||
fillColor = ((colorR*255 << 16) + (colorG*255 << 8) + colorB*255);
|
||||
|
||||
colorR = (lineColor >> 16 & 0xFF) / 255;
|
||||
colorG = (lineColor >> 8 & 0xFF) / 255;
|
||||
colorB = (lineColor & 0xFF) / 255;
|
||||
|
||||
colorR *= tintR;
|
||||
colorG *= tintG;
|
||||
colorB *= tintB;
|
||||
|
||||
lineColor = ((colorR*255 << 16) + (colorG*255 << 8) + colorB*255);
|
||||
*/
|
||||
|
||||
// super inline cos im an optimization NAZI :)
|
||||
data._fillTint = (((fillColor >> 16 & 0xFF) / 255 * tintR*255 << 16) + ((fillColor >> 8 & 0xFF) / 255 * tintG*255 << 8) + (fillColor & 0xFF) / 255 * tintB*255);
|
||||
data._lineTint = (((lineColor >> 16 & 0xFF) / 255 * tintR*255 << 16) + ((lineColor >> 8 & 0xFF) / 255 * tintG*255 << 8) + (lineColor & 0xFF) / 255 * tintB*255);
|
||||
|
||||
}
|
||||
};
|
||||
|
||||
345
app/Lib/Vendor/src/pixi/renderers/canvas/CanvasRenderer.js
vendored
Normal file
345
app/Lib/Vendor/src/pixi/renderers/canvas/CanvasRenderer.js
vendored
Normal file
|
|
@ -0,0 +1,345 @@
|
|||
/**
|
||||
* @author Mat Groves http://matgroves.com/ @Doormat23
|
||||
*/
|
||||
|
||||
/**
|
||||
* The CanvasRenderer draws the Stage and all its content onto a 2d canvas. This renderer should be used for browsers that do not support webGL.
|
||||
* Don't forget to add the CanvasRenderer.view to your DOM or you will not see anything :)
|
||||
*
|
||||
* @class CanvasRenderer
|
||||
* @constructor
|
||||
* @param [width=800] {Number} the width of the canvas view
|
||||
* @param [height=600] {Number} the height of the canvas view
|
||||
* @param [options] {Object} The optional renderer parameters
|
||||
* @param [options.view] {HTMLCanvasElement} the canvas to use as a view, optional
|
||||
* @param [options.transparent=false] {Boolean} If the render view is transparent, default false
|
||||
* @param [options.autoResize=false] {Boolean} If the render view is automatically resized, default false
|
||||
* @param [options.resolution=1] {Number} the resolution of the renderer retina would be 2
|
||||
* @param [options.clearBeforeRender=true] {Boolean} This sets if the CanvasRenderer will clear the canvas or not before the new render pass.
|
||||
*/
|
||||
PIXI.CanvasRenderer = function(width, height, options)
|
||||
{
|
||||
if(options)
|
||||
{
|
||||
for (var i in PIXI.defaultRenderOptions)
|
||||
{
|
||||
if (typeof options[i] === "undefined") options[i] = PIXI.defaultRenderOptions[i];
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
options = PIXI.defaultRenderOptions;
|
||||
}
|
||||
|
||||
if(!PIXI.defaultRenderer)
|
||||
{
|
||||
PIXI.sayHello("Canvas");
|
||||
PIXI.defaultRenderer = this;
|
||||
}
|
||||
|
||||
/**
|
||||
* The renderer type.
|
||||
*
|
||||
* @property type
|
||||
* @type Number
|
||||
*/
|
||||
this.type = PIXI.CANVAS_RENDERER;
|
||||
|
||||
/**
|
||||
* The resolution of the canvas.
|
||||
*
|
||||
* @property resolution
|
||||
* @type Number
|
||||
*/
|
||||
this.resolution = options.resolution;
|
||||
|
||||
/**
|
||||
* This sets if the CanvasRenderer will clear the canvas or not before the new render pass.
|
||||
* If the Stage is NOT transparent Pixi will use a canvas sized fillRect operation every frame to set the canvas background color.
|
||||
* If the Stage is transparent Pixi will use clearRect to clear the canvas every frame.
|
||||
* Disable this by setting this to false. For example if your game has a canvas filling background image you often don't need this set.
|
||||
*
|
||||
* @property clearBeforeRender
|
||||
* @type Boolean
|
||||
* @default
|
||||
*/
|
||||
this.clearBeforeRender = options.clearBeforeRender;
|
||||
|
||||
/**
|
||||
* Whether the render view is transparent
|
||||
*
|
||||
* @property transparent
|
||||
* @type Boolean
|
||||
*/
|
||||
this.transparent = options.transparent;
|
||||
|
||||
/**
|
||||
* Whether the render view should be resized automatically
|
||||
*
|
||||
* @property autoResize
|
||||
* @type Boolean
|
||||
*/
|
||||
this.autoResize = options.autoResize || false;
|
||||
|
||||
|
||||
/**
|
||||
* The width of the canvas view
|
||||
*
|
||||
* @property width
|
||||
* @type Number
|
||||
* @default 800
|
||||
*/
|
||||
this.width = width || 800;
|
||||
|
||||
/**
|
||||
* The height of the canvas view
|
||||
*
|
||||
* @property height
|
||||
* @type Number
|
||||
* @default 600
|
||||
*/
|
||||
this.height = height || 600;
|
||||
|
||||
this.width *= this.resolution;
|
||||
this.height *= this.resolution;
|
||||
|
||||
/**
|
||||
* The canvas element that everything is drawn to.
|
||||
*
|
||||
* @property view
|
||||
* @type HTMLCanvasElement
|
||||
*/
|
||||
this.view = options.view || document.createElement( "canvas" );
|
||||
|
||||
/**
|
||||
* The canvas 2d context that everything is drawn with
|
||||
* @property context
|
||||
* @type CanvasRenderingContext2D
|
||||
*/
|
||||
this.context = this.view.getContext( "2d", { alpha: this.transparent } );
|
||||
|
||||
/**
|
||||
* Boolean flag controlling canvas refresh.
|
||||
*
|
||||
* @property refresh
|
||||
* @type Boolean
|
||||
*/
|
||||
this.refresh = true;
|
||||
|
||||
this.view.width = this.width * this.resolution;
|
||||
this.view.height = this.height * this.resolution;
|
||||
|
||||
/**
|
||||
* Internal var.
|
||||
*
|
||||
* @property count
|
||||
* @type Number
|
||||
*/
|
||||
this.count = 0;
|
||||
|
||||
/**
|
||||
* Instance of a PIXI.CanvasMaskManager, handles masking when using the canvas renderer
|
||||
* @property CanvasMaskManager
|
||||
* @type CanvasMaskManager
|
||||
*/
|
||||
this.maskManager = new PIXI.CanvasMaskManager();
|
||||
|
||||
/**
|
||||
* The render session is just a bunch of parameter used for rendering
|
||||
* @property renderSession
|
||||
* @type Object
|
||||
*/
|
||||
this.renderSession = {
|
||||
context: this.context,
|
||||
maskManager: this.maskManager,
|
||||
scaleMode: null,
|
||||
smoothProperty: null,
|
||||
/**
|
||||
* If true Pixi will Math.floor() x/y values when rendering, stopping pixel interpolation.
|
||||
* Handy for crisp pixel art and speed on legacy devices.
|
||||
*
|
||||
*/
|
||||
roundPixels: false
|
||||
};
|
||||
|
||||
this.mapBlendModes();
|
||||
|
||||
this.resize(width, height);
|
||||
|
||||
if("imageSmoothingEnabled" in this.context)
|
||||
this.renderSession.smoothProperty = "imageSmoothingEnabled";
|
||||
else if("webkitImageSmoothingEnabled" in this.context)
|
||||
this.renderSession.smoothProperty = "webkitImageSmoothingEnabled";
|
||||
else if("mozImageSmoothingEnabled" in this.context)
|
||||
this.renderSession.smoothProperty = "mozImageSmoothingEnabled";
|
||||
else if("oImageSmoothingEnabled" in this.context)
|
||||
this.renderSession.smoothProperty = "oImageSmoothingEnabled";
|
||||
else if ("msImageSmoothingEnabled" in this.context)
|
||||
this.renderSession.smoothProperty = "msImageSmoothingEnabled";
|
||||
};
|
||||
|
||||
// constructor
|
||||
PIXI.CanvasRenderer.prototype.constructor = PIXI.CanvasRenderer;
|
||||
|
||||
/**
|
||||
* Renders the Stage to this canvas view
|
||||
*
|
||||
* @method render
|
||||
* @param stage {Stage} the Stage element to be rendered
|
||||
*/
|
||||
PIXI.CanvasRenderer.prototype.render = function(stage)
|
||||
{
|
||||
stage.updateTransform();
|
||||
|
||||
this.context.setTransform(1,0,0,1,0,0);
|
||||
|
||||
this.context.globalAlpha = 1;
|
||||
|
||||
this.renderSession.currentBlendMode = PIXI.blendModes.NORMAL;
|
||||
this.context.globalCompositeOperation = PIXI.blendModesCanvas[PIXI.blendModes.NORMAL];
|
||||
|
||||
if (navigator.isCocoonJS && this.view.screencanvas) {
|
||||
this.context.fillStyle = "black";
|
||||
this.context.clear();
|
||||
}
|
||||
|
||||
if (this.clearBeforeRender)
|
||||
{
|
||||
if (this.transparent)
|
||||
{
|
||||
this.context.clearRect(0, 0, this.width, this.height);
|
||||
}
|
||||
else
|
||||
{
|
||||
this.context.fillStyle = stage.backgroundColorString;
|
||||
this.context.fillRect(0, 0, this.width , this.height);
|
||||
}
|
||||
}
|
||||
|
||||
this.renderDisplayObject(stage);
|
||||
|
||||
// run interaction!
|
||||
if(stage.interactive)
|
||||
{
|
||||
//need to add some events!
|
||||
if(!stage._interactiveEventsAdded)
|
||||
{
|
||||
stage._interactiveEventsAdded = true;
|
||||
stage.interactionManager.setTarget(this);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Removes everything from the renderer and optionally removes the Canvas DOM element.
|
||||
*
|
||||
* @method destroy
|
||||
* @param [removeView=true] {boolean} Removes the Canvas element from the DOM.
|
||||
*/
|
||||
PIXI.CanvasRenderer.prototype.destroy = function(removeView)
|
||||
{
|
||||
if (typeof removeView === "undefined") { removeView = true; }
|
||||
|
||||
if (removeView && this.view.parent)
|
||||
{
|
||||
this.view.parent.removeChild(this.view);
|
||||
}
|
||||
|
||||
this.view = null;
|
||||
this.context = null;
|
||||
this.maskManager = null;
|
||||
this.renderSession = null;
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
* Resizes the canvas view to the specified width and height
|
||||
*
|
||||
* @method resize
|
||||
* @param width {Number} the new width of the canvas view
|
||||
* @param height {Number} the new height of the canvas view
|
||||
*/
|
||||
PIXI.CanvasRenderer.prototype.resize = function(width, height)
|
||||
{
|
||||
this.width = width * this.resolution;
|
||||
this.height = height * this.resolution;
|
||||
|
||||
this.view.width = this.width;
|
||||
this.view.height = this.height;
|
||||
|
||||
if (this.autoResize) {
|
||||
this.view.style.width = this.width / this.resolution + "px";
|
||||
this.view.style.height = this.height / this.resolution + "px";
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Renders a display object
|
||||
*
|
||||
* @method renderDisplayObject
|
||||
* @param displayObject {DisplayObject} The displayObject to render
|
||||
* @param context {CanvasRenderingContext2D} the context 2d method of the canvas
|
||||
* @private
|
||||
*/
|
||||
PIXI.CanvasRenderer.prototype.renderDisplayObject = function(displayObject, context)
|
||||
{
|
||||
this.renderSession.context = context || this.context;
|
||||
this.renderSession.resolution = this.resolution;
|
||||
displayObject._renderCanvas(this.renderSession);
|
||||
};
|
||||
|
||||
/**
|
||||
* Maps Pixi blend modes to canvas blend modes.
|
||||
*
|
||||
* @method mapBlendModes
|
||||
* @private
|
||||
*/
|
||||
PIXI.CanvasRenderer.prototype.mapBlendModes = function()
|
||||
{
|
||||
if(!PIXI.blendModesCanvas)
|
||||
{
|
||||
PIXI.blendModesCanvas = [];
|
||||
|
||||
if(PIXI.canUseNewCanvasBlendModes())
|
||||
{
|
||||
PIXI.blendModesCanvas[PIXI.blendModes.NORMAL] = "source-over";
|
||||
PIXI.blendModesCanvas[PIXI.blendModes.ADD] = "lighter"; //IS THIS OK???
|
||||
PIXI.blendModesCanvas[PIXI.blendModes.MULTIPLY] = "multiply";
|
||||
PIXI.blendModesCanvas[PIXI.blendModes.SCREEN] = "screen";
|
||||
PIXI.blendModesCanvas[PIXI.blendModes.OVERLAY] = "overlay";
|
||||
PIXI.blendModesCanvas[PIXI.blendModes.DARKEN] = "darken";
|
||||
PIXI.blendModesCanvas[PIXI.blendModes.LIGHTEN] = "lighten";
|
||||
PIXI.blendModesCanvas[PIXI.blendModes.COLOR_DODGE] = "color-dodge";
|
||||
PIXI.blendModesCanvas[PIXI.blendModes.COLOR_BURN] = "color-burn";
|
||||
PIXI.blendModesCanvas[PIXI.blendModes.HARD_LIGHT] = "hard-light";
|
||||
PIXI.blendModesCanvas[PIXI.blendModes.SOFT_LIGHT] = "soft-light";
|
||||
PIXI.blendModesCanvas[PIXI.blendModes.DIFFERENCE] = "difference";
|
||||
PIXI.blendModesCanvas[PIXI.blendModes.EXCLUSION] = "exclusion";
|
||||
PIXI.blendModesCanvas[PIXI.blendModes.HUE] = "hue";
|
||||
PIXI.blendModesCanvas[PIXI.blendModes.SATURATION] = "saturation";
|
||||
PIXI.blendModesCanvas[PIXI.blendModes.COLOR] = "color";
|
||||
PIXI.blendModesCanvas[PIXI.blendModes.LUMINOSITY] = "luminosity";
|
||||
}
|
||||
else
|
||||
{
|
||||
// this means that the browser does not support the cool new blend modes in canvas "cough" ie "cough"
|
||||
PIXI.blendModesCanvas[PIXI.blendModes.NORMAL] = "source-over";
|
||||
PIXI.blendModesCanvas[PIXI.blendModes.ADD] = "lighter"; //IS THIS OK???
|
||||
PIXI.blendModesCanvas[PIXI.blendModes.MULTIPLY] = "source-over";
|
||||
PIXI.blendModesCanvas[PIXI.blendModes.SCREEN] = "source-over";
|
||||
PIXI.blendModesCanvas[PIXI.blendModes.OVERLAY] = "source-over";
|
||||
PIXI.blendModesCanvas[PIXI.blendModes.DARKEN] = "source-over";
|
||||
PIXI.blendModesCanvas[PIXI.blendModes.LIGHTEN] = "source-over";
|
||||
PIXI.blendModesCanvas[PIXI.blendModes.COLOR_DODGE] = "source-over";
|
||||
PIXI.blendModesCanvas[PIXI.blendModes.COLOR_BURN] = "source-over";
|
||||
PIXI.blendModesCanvas[PIXI.blendModes.HARD_LIGHT] = "source-over";
|
||||
PIXI.blendModesCanvas[PIXI.blendModes.SOFT_LIGHT] = "source-over";
|
||||
PIXI.blendModesCanvas[PIXI.blendModes.DIFFERENCE] = "source-over";
|
||||
PIXI.blendModesCanvas[PIXI.blendModes.EXCLUSION] = "source-over";
|
||||
PIXI.blendModesCanvas[PIXI.blendModes.HUE] = "source-over";
|
||||
PIXI.blendModesCanvas[PIXI.blendModes.SATURATION] = "source-over";
|
||||
PIXI.blendModesCanvas[PIXI.blendModes.COLOR] = "source-over";
|
||||
PIXI.blendModesCanvas[PIXI.blendModes.LUMINOSITY] = "source-over";
|
||||
}
|
||||
}
|
||||
};
|
||||
76
app/Lib/Vendor/src/pixi/renderers/canvas/utils/CanvasBuffer.js
vendored
Normal file
76
app/Lib/Vendor/src/pixi/renderers/canvas/utils/CanvasBuffer.js
vendored
Normal file
|
|
@ -0,0 +1,76 @@
|
|||
/**
|
||||
* @author Mat Groves http://matgroves.com/ @Doormat23
|
||||
*/
|
||||
|
||||
/**
|
||||
* Creates a Canvas element of the given size.
|
||||
*
|
||||
* @class CanvasBuffer
|
||||
* @constructor
|
||||
* @param width {Number} the width for the newly created canvas
|
||||
* @param height {Number} the height for the newly created canvas
|
||||
*/
|
||||
PIXI.CanvasBuffer = function(width, height)
|
||||
{
|
||||
/**
|
||||
* The width of the Canvas in pixels.
|
||||
*
|
||||
* @property width
|
||||
* @type Number
|
||||
*/
|
||||
this.width = width;
|
||||
|
||||
/**
|
||||
* The height of the Canvas in pixels.
|
||||
*
|
||||
* @property height
|
||||
* @type Number
|
||||
*/
|
||||
this.height = height;
|
||||
|
||||
/**
|
||||
* The Canvas object that belongs to this CanvasBuffer.
|
||||
*
|
||||
* @property canvas
|
||||
* @type HTMLCanvasElement
|
||||
*/
|
||||
this.canvas = document.createElement("canvas");
|
||||
|
||||
/**
|
||||
* A CanvasRenderingContext2D object representing a two-dimensional rendering context.
|
||||
*
|
||||
* @property context
|
||||
* @type CanvasRenderingContext2D
|
||||
*/
|
||||
this.context = this.canvas.getContext("2d");
|
||||
|
||||
this.canvas.width = width;
|
||||
this.canvas.height = height;
|
||||
};
|
||||
|
||||
PIXI.CanvasBuffer.prototype.constructor = PIXI.CanvasBuffer;
|
||||
|
||||
/**
|
||||
* Clears the canvas that was created by the CanvasBuffer class.
|
||||
*
|
||||
* @method clear
|
||||
* @private
|
||||
*/
|
||||
PIXI.CanvasBuffer.prototype.clear = function()
|
||||
{
|
||||
this.context.setTransform(1, 0, 0, 1, 0, 0);
|
||||
this.context.clearRect(0,0, this.width, this.height);
|
||||
};
|
||||
|
||||
/**
|
||||
* Resizes the canvas to the specified width and height.
|
||||
*
|
||||
* @method resize
|
||||
* @param width {Number} the new width of the canvas
|
||||
* @param height {Number} the new height of the canvas
|
||||
*/
|
||||
PIXI.CanvasBuffer.prototype.resize = function(width, height)
|
||||
{
|
||||
this.width = this.canvas.width = width;
|
||||
this.height = this.canvas.height = height;
|
||||
};
|
||||
58
app/Lib/Vendor/src/pixi/renderers/canvas/utils/CanvasMaskManager.js
vendored
Normal file
58
app/Lib/Vendor/src/pixi/renderers/canvas/utils/CanvasMaskManager.js
vendored
Normal file
|
|
@ -0,0 +1,58 @@
|
|||
/**
|
||||
* @author Mat Groves http://matgroves.com/ @Doormat23
|
||||
*/
|
||||
|
||||
/**
|
||||
* A set of functions used to handle masking.
|
||||
*
|
||||
* @class CanvasMaskManager
|
||||
* @constructor
|
||||
*/
|
||||
PIXI.CanvasMaskManager = function()
|
||||
{
|
||||
};
|
||||
|
||||
PIXI.CanvasMaskManager.prototype.constructor = PIXI.CanvasMaskManager;
|
||||
|
||||
/**
|
||||
* This method adds it to the current stack of masks.
|
||||
*
|
||||
* @method pushMask
|
||||
* @param maskData {Object} the maskData that will be pushed
|
||||
* @param renderSession {Object} The renderSession whose context will be used for this mask manager.
|
||||
*/
|
||||
PIXI.CanvasMaskManager.prototype.pushMask = function(maskData, renderSession)
|
||||
{
|
||||
var context = renderSession.context;
|
||||
|
||||
context.save();
|
||||
|
||||
var cacheAlpha = maskData.alpha;
|
||||
var transform = maskData.worldTransform;
|
||||
|
||||
var resolution = renderSession.resolution;
|
||||
|
||||
context.setTransform(transform.a * resolution,
|
||||
transform.b * resolution,
|
||||
transform.c * resolution,
|
||||
transform.d * resolution,
|
||||
transform.tx * resolution,
|
||||
transform.ty * resolution);
|
||||
|
||||
PIXI.CanvasGraphics.renderGraphicsMask(maskData, context);
|
||||
|
||||
context.clip();
|
||||
|
||||
maskData.worldAlpha = cacheAlpha;
|
||||
};
|
||||
|
||||
/**
|
||||
* Restores the current drawing context to the state it was before the mask was applied.
|
||||
*
|
||||
* @method popMask
|
||||
* @param renderSession {Object} The renderSession whose context will be used for this mask manager.
|
||||
*/
|
||||
PIXI.CanvasMaskManager.prototype.popMask = function(renderSession)
|
||||
{
|
||||
renderSession.context.restore();
|
||||
};
|
||||
242
app/Lib/Vendor/src/pixi/renderers/canvas/utils/CanvasTinter.js
vendored
Normal file
242
app/Lib/Vendor/src/pixi/renderers/canvas/utils/CanvasTinter.js
vendored
Normal file
|
|
@ -0,0 +1,242 @@
|
|||
/**
|
||||
* @author Mat Groves http://matgroves.com/ @Doormat23
|
||||
*/
|
||||
|
||||
/**
|
||||
* Utility methods for Sprite/Texture tinting.
|
||||
*
|
||||
* @class CanvasTinter
|
||||
* @static
|
||||
*/
|
||||
PIXI.CanvasTinter = function()
|
||||
{
|
||||
};
|
||||
|
||||
/**
|
||||
* Basically this method just needs a sprite and a color and tints the sprite with the given color.
|
||||
*
|
||||
* @method getTintedTexture
|
||||
* @static
|
||||
* @param sprite {Sprite} the sprite to tint
|
||||
* @param color {Number} the color to use to tint the sprite with
|
||||
* @return {HTMLCanvasElement} The tinted canvas
|
||||
*/
|
||||
PIXI.CanvasTinter.getTintedTexture = function(sprite, color)
|
||||
{
|
||||
var texture = sprite.texture;
|
||||
|
||||
color = PIXI.CanvasTinter.roundColor(color);
|
||||
|
||||
var stringColor = "#" + ("00000" + ( color | 0).toString(16)).substr(-6);
|
||||
|
||||
texture.tintCache = texture.tintCache || {};
|
||||
|
||||
if(texture.tintCache[stringColor]) return texture.tintCache[stringColor];
|
||||
|
||||
// clone texture..
|
||||
var canvas = PIXI.CanvasTinter.canvas || document.createElement("canvas");
|
||||
|
||||
//PIXI.CanvasTinter.tintWithPerPixel(texture, stringColor, canvas);
|
||||
PIXI.CanvasTinter.tintMethod(texture, color, canvas);
|
||||
|
||||
if(PIXI.CanvasTinter.convertTintToImage)
|
||||
{
|
||||
// is this better?
|
||||
var tintImage = new Image();
|
||||
tintImage.src = canvas.toDataURL();
|
||||
|
||||
texture.tintCache[stringColor] = tintImage;
|
||||
}
|
||||
else
|
||||
{
|
||||
texture.tintCache[stringColor] = canvas;
|
||||
// if we are not converting the texture to an image then we need to lose the reference to the canvas
|
||||
PIXI.CanvasTinter.canvas = null;
|
||||
}
|
||||
|
||||
return canvas;
|
||||
};
|
||||
|
||||
/**
|
||||
* Tint a texture using the "multiply" operation.
|
||||
*
|
||||
* @method tintWithMultiply
|
||||
* @static
|
||||
* @param texture {Texture} the texture to tint
|
||||
* @param color {Number} the color to use to tint the sprite with
|
||||
* @param canvas {HTMLCanvasElement} the current canvas
|
||||
*/
|
||||
PIXI.CanvasTinter.tintWithMultiply = function(texture, color, canvas)
|
||||
{
|
||||
var context = canvas.getContext( "2d" );
|
||||
|
||||
var crop = texture.crop;
|
||||
|
||||
canvas.width = crop.width;
|
||||
canvas.height = crop.height;
|
||||
|
||||
context.fillStyle = "#" + ("00000" + ( color | 0).toString(16)).substr(-6);
|
||||
|
||||
context.fillRect(0, 0, crop.width, crop.height);
|
||||
|
||||
context.globalCompositeOperation = "multiply";
|
||||
|
||||
context.drawImage(texture.baseTexture.source,
|
||||
crop.x,
|
||||
crop.y,
|
||||
crop.width,
|
||||
crop.height,
|
||||
0,
|
||||
0,
|
||||
crop.width,
|
||||
crop.height);
|
||||
|
||||
context.globalCompositeOperation = "destination-atop";
|
||||
|
||||
context.drawImage(texture.baseTexture.source,
|
||||
crop.x,
|
||||
crop.y,
|
||||
crop.width,
|
||||
crop.height,
|
||||
0,
|
||||
0,
|
||||
crop.width,
|
||||
crop.height);
|
||||
};
|
||||
|
||||
/**
|
||||
* Tint a texture using the "overlay" operation.
|
||||
*
|
||||
* @method tintWithOverlay
|
||||
* @static
|
||||
* @param texture {Texture} the texture to tint
|
||||
* @param color {Number} the color to use to tint the sprite with
|
||||
* @param canvas {HTMLCanvasElement} the current canvas
|
||||
*/
|
||||
PIXI.CanvasTinter.tintWithOverlay = function(texture, color, canvas)
|
||||
{
|
||||
var context = canvas.getContext( "2d" );
|
||||
|
||||
var crop = texture.crop;
|
||||
|
||||
canvas.width = crop.width;
|
||||
canvas.height = crop.height;
|
||||
|
||||
context.globalCompositeOperation = "copy";
|
||||
context.fillStyle = "#" + ("00000" + ( color | 0).toString(16)).substr(-6);
|
||||
context.fillRect(0, 0, crop.width, crop.height);
|
||||
|
||||
context.globalCompositeOperation = "destination-atop";
|
||||
context.drawImage(texture.baseTexture.source,
|
||||
crop.x,
|
||||
crop.y,
|
||||
crop.width,
|
||||
crop.height,
|
||||
0,
|
||||
0,
|
||||
crop.width,
|
||||
crop.height);
|
||||
|
||||
//context.globalCompositeOperation = "copy";
|
||||
};
|
||||
|
||||
/**
|
||||
* Tint a texture pixel per pixel.
|
||||
*
|
||||
* @method tintPerPixel
|
||||
* @static
|
||||
* @param texture {Texture} the texture to tint
|
||||
* @param color {Number} the color to use to tint the sprite with
|
||||
* @param canvas {HTMLCanvasElement} the current canvas
|
||||
*/
|
||||
PIXI.CanvasTinter.tintWithPerPixel = function(texture, color, canvas)
|
||||
{
|
||||
var context = canvas.getContext( "2d" );
|
||||
|
||||
var crop = texture.crop;
|
||||
|
||||
canvas.width = crop.width;
|
||||
canvas.height = crop.height;
|
||||
|
||||
context.globalCompositeOperation = "copy";
|
||||
context.drawImage(texture.baseTexture.source,
|
||||
crop.x,
|
||||
crop.y,
|
||||
crop.width,
|
||||
crop.height,
|
||||
0,
|
||||
0,
|
||||
crop.width,
|
||||
crop.height);
|
||||
|
||||
var rgbValues = PIXI.hex2rgb(color);
|
||||
var r = rgbValues[0], g = rgbValues[1], b = rgbValues[2];
|
||||
|
||||
var pixelData = context.getImageData(0, 0, crop.width, crop.height);
|
||||
|
||||
var pixels = pixelData.data;
|
||||
|
||||
for (var i = 0; i < pixels.length; i += 4)
|
||||
{
|
||||
pixels[i+0] *= r;
|
||||
pixels[i+1] *= g;
|
||||
pixels[i+2] *= b;
|
||||
}
|
||||
|
||||
context.putImageData(pixelData, 0, 0);
|
||||
};
|
||||
|
||||
/**
|
||||
* Rounds the specified color according to the PIXI.CanvasTinter.cacheStepsPerColorChannel.
|
||||
*
|
||||
* @method roundColor
|
||||
* @static
|
||||
* @param color {number} the color to round, should be a hex color
|
||||
*/
|
||||
PIXI.CanvasTinter.roundColor = function(color)
|
||||
{
|
||||
var step = PIXI.CanvasTinter.cacheStepsPerColorChannel;
|
||||
|
||||
var rgbValues = PIXI.hex2rgb(color);
|
||||
|
||||
rgbValues[0] = Math.min(255, (rgbValues[0] / step) * step);
|
||||
rgbValues[1] = Math.min(255, (rgbValues[1] / step) * step);
|
||||
rgbValues[2] = Math.min(255, (rgbValues[2] / step) * step);
|
||||
|
||||
return PIXI.rgb2hex(rgbValues);
|
||||
};
|
||||
|
||||
/**
|
||||
* Number of steps which will be used as a cap when rounding colors.
|
||||
*
|
||||
* @property cacheStepsPerColorChannel
|
||||
* @type Number
|
||||
* @static
|
||||
*/
|
||||
PIXI.CanvasTinter.cacheStepsPerColorChannel = 8;
|
||||
|
||||
/**
|
||||
* Tint cache boolean flag.
|
||||
*
|
||||
* @property convertTintToImage
|
||||
* @type Boolean
|
||||
* @static
|
||||
*/
|
||||
PIXI.CanvasTinter.convertTintToImage = false;
|
||||
|
||||
/**
|
||||
* Whether or not the Canvas BlendModes are supported, consequently the ability to tint using the multiply method.
|
||||
*
|
||||
* @property canUseMultiply
|
||||
* @type Boolean
|
||||
* @static
|
||||
*/
|
||||
PIXI.CanvasTinter.canUseMultiply = PIXI.canUseNewCanvasBlendModes();
|
||||
|
||||
/**
|
||||
* The tinting method that will be used.
|
||||
*
|
||||
* @method tintMethod
|
||||
* @static
|
||||
*/
|
||||
PIXI.CanvasTinter.tintMethod = PIXI.CanvasTinter.canUseMultiply ? PIXI.CanvasTinter.tintWithMultiply : PIXI.CanvasTinter.tintWithPerPixel;
|
||||
554
app/Lib/Vendor/src/pixi/renderers/webgl/WebGLRenderer.js
vendored
Normal file
554
app/Lib/Vendor/src/pixi/renderers/webgl/WebGLRenderer.js
vendored
Normal file
|
|
@ -0,0 +1,554 @@
|
|||
/**
|
||||
* @author Mat Groves http://matgroves.com/ @Doormat23
|
||||
*/
|
||||
|
||||
PIXI.glContexts = []; // this is where we store the webGL contexts for easy access.
|
||||
PIXI.instances = [];
|
||||
|
||||
/**
|
||||
* The WebGLRenderer draws the stage and all its content onto a webGL enabled canvas. This renderer
|
||||
* should be used for browsers that support webGL. This Render works by automatically managing webGLBatchs.
|
||||
* So no need for Sprite Batches or Sprite Clouds.
|
||||
* Don't forget to add the view to your DOM or you will not see anything :)
|
||||
*
|
||||
* @class WebGLRenderer
|
||||
* @constructor
|
||||
* @param [width=0] {Number} the width of the canvas view
|
||||
* @param [height=0] {Number} the height of the canvas view
|
||||
* @param [options] {Object} The optional renderer parameters
|
||||
* @param [options.view] {HTMLCanvasElement} the canvas to use as a view, optional
|
||||
* @param [options.transparent=false] {Boolean} If the render view is transparent, default false
|
||||
* @param [options.autoResize=false] {Boolean} If the render view is automatically resized, default false
|
||||
* @param [options.antialias=false] {Boolean} sets antialias (only applicable in chrome at the moment)
|
||||
* @param [options.preserveDrawingBuffer=false] {Boolean} enables drawing buffer preservation, enable this if you need to call toDataUrl on the webgl context
|
||||
* @param [options.resolution=1] {Number} the resolution of the renderer retina would be 2
|
||||
*/
|
||||
PIXI.WebGLRenderer = function(width, height, options)
|
||||
{
|
||||
if(options)
|
||||
{
|
||||
for (var i in PIXI.defaultRenderOptions)
|
||||
{
|
||||
if (typeof options[i] === 'undefined') options[i] = PIXI.defaultRenderOptions[i];
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
options = PIXI.defaultRenderOptions;
|
||||
}
|
||||
|
||||
if(!PIXI.defaultRenderer)
|
||||
{
|
||||
PIXI.sayHello('webGL');
|
||||
PIXI.defaultRenderer = this;
|
||||
}
|
||||
|
||||
/**
|
||||
* @property type
|
||||
* @type Number
|
||||
*/
|
||||
this.type = PIXI.WEBGL_RENDERER;
|
||||
|
||||
/**
|
||||
* The resolution of the renderer
|
||||
*
|
||||
* @property resolution
|
||||
* @type Number
|
||||
* @default 1
|
||||
*/
|
||||
this.resolution = options.resolution;
|
||||
|
||||
// do a catch.. only 1 webGL renderer..
|
||||
|
||||
/**
|
||||
* Whether the render view is transparent
|
||||
*
|
||||
* @property transparent
|
||||
* @type Boolean
|
||||
*/
|
||||
this.transparent = options.transparent;
|
||||
|
||||
/**
|
||||
* Whether the render view should be resized automatically
|
||||
*
|
||||
* @property autoResize
|
||||
* @type Boolean
|
||||
*/
|
||||
this.autoResize = options.autoResize || false;
|
||||
|
||||
/**
|
||||
* The value of the preserveDrawingBuffer flag affects whether or not the contents of the stencil buffer is retained after rendering.
|
||||
*
|
||||
* @property preserveDrawingBuffer
|
||||
* @type Boolean
|
||||
*/
|
||||
this.preserveDrawingBuffer = options.preserveDrawingBuffer;
|
||||
|
||||
/**
|
||||
* This sets if the WebGLRenderer will clear the context texture or not before the new render pass. If true:
|
||||
* If the Stage is NOT transparent, Pixi will clear to alpha (0, 0, 0, 0).
|
||||
* If the Stage is transparent, Pixi will clear to the target Stage's background color.
|
||||
* Disable this by setting this to false. For example: if your game has a canvas filling background image, you often don't need this set.
|
||||
*
|
||||
* @property clearBeforeRender
|
||||
* @type Boolean
|
||||
* @default
|
||||
*/
|
||||
this.clearBeforeRender = options.clearBeforeRender;
|
||||
|
||||
/**
|
||||
* The width of the canvas view
|
||||
*
|
||||
* @property width
|
||||
* @type Number
|
||||
* @default 800
|
||||
*/
|
||||
this.width = width || 800;
|
||||
|
||||
/**
|
||||
* The height of the canvas view
|
||||
*
|
||||
* @property height
|
||||
* @type Number
|
||||
* @default 600
|
||||
*/
|
||||
this.height = height || 600;
|
||||
|
||||
/**
|
||||
* The canvas element that everything is drawn to
|
||||
*
|
||||
* @property view
|
||||
* @type HTMLCanvasElement
|
||||
*/
|
||||
this.view = options.view || document.createElement( 'canvas' );
|
||||
|
||||
// deal with losing context..
|
||||
|
||||
/**
|
||||
* @property contextLostBound
|
||||
* @type Function
|
||||
*/
|
||||
this.contextLostBound = this.handleContextLost.bind(this);
|
||||
|
||||
/**
|
||||
* @property contextRestoredBound
|
||||
* @type Function
|
||||
*/
|
||||
this.contextRestoredBound = this.handleContextRestored.bind(this);
|
||||
|
||||
this.view.addEventListener('webglcontextlost', this.contextLostBound, false);
|
||||
this.view.addEventListener('webglcontextrestored', this.contextRestoredBound, false);
|
||||
|
||||
/**
|
||||
* @property _contextOptions
|
||||
* @type Object
|
||||
* @private
|
||||
*/
|
||||
this._contextOptions = {
|
||||
alpha: this.transparent,
|
||||
antialias: options.antialias, // SPEED UP??
|
||||
premultipliedAlpha:this.transparent && this.transparent !== 'notMultiplied',
|
||||
stencil:true,
|
||||
preserveDrawingBuffer: options.preserveDrawingBuffer
|
||||
};
|
||||
|
||||
/**
|
||||
* @property projection
|
||||
* @type Point
|
||||
*/
|
||||
this.projection = new PIXI.Point();
|
||||
|
||||
/**
|
||||
* @property offset
|
||||
* @type Point
|
||||
*/
|
||||
this.offset = new PIXI.Point(0, 0);
|
||||
|
||||
// time to create the render managers! each one focuses on managing a state in webGL
|
||||
|
||||
/**
|
||||
* Deals with managing the shader programs and their attribs
|
||||
* @property shaderManager
|
||||
* @type WebGLShaderManager
|
||||
*/
|
||||
this.shaderManager = new PIXI.WebGLShaderManager();
|
||||
|
||||
/**
|
||||
* Manages the rendering of sprites
|
||||
* @property spriteBatch
|
||||
* @type WebGLSpriteBatch
|
||||
*/
|
||||
this.spriteBatch = new PIXI.WebGLSpriteBatch();
|
||||
|
||||
/**
|
||||
* Manages the masks using the stencil buffer
|
||||
* @property maskManager
|
||||
* @type WebGLMaskManager
|
||||
*/
|
||||
this.maskManager = new PIXI.WebGLMaskManager();
|
||||
|
||||
/**
|
||||
* Manages the filters
|
||||
* @property filterManager
|
||||
* @type WebGLFilterManager
|
||||
*/
|
||||
this.filterManager = new PIXI.WebGLFilterManager();
|
||||
|
||||
/**
|
||||
* Manages the stencil buffer
|
||||
* @property stencilManager
|
||||
* @type WebGLStencilManager
|
||||
*/
|
||||
this.stencilManager = new PIXI.WebGLStencilManager();
|
||||
|
||||
/**
|
||||
* Manages the blendModes
|
||||
* @property blendModeManager
|
||||
* @type WebGLBlendModeManager
|
||||
*/
|
||||
this.blendModeManager = new PIXI.WebGLBlendModeManager();
|
||||
|
||||
/**
|
||||
* TODO remove
|
||||
* @property renderSession
|
||||
* @type Object
|
||||
*/
|
||||
this.renderSession = {};
|
||||
this.renderSession.gl = this.gl;
|
||||
this.renderSession.drawCount = 0;
|
||||
this.renderSession.shaderManager = this.shaderManager;
|
||||
this.renderSession.maskManager = this.maskManager;
|
||||
this.renderSession.filterManager = this.filterManager;
|
||||
this.renderSession.blendModeManager = this.blendModeManager;
|
||||
this.renderSession.spriteBatch = this.spriteBatch;
|
||||
this.renderSession.stencilManager = this.stencilManager;
|
||||
this.renderSession.renderer = this;
|
||||
this.renderSession.resolution = this.resolution;
|
||||
|
||||
// time init the context..
|
||||
this.initContext();
|
||||
|
||||
// map some webGL blend modes..
|
||||
this.mapBlendModes();
|
||||
};
|
||||
|
||||
// constructor
|
||||
PIXI.WebGLRenderer.prototype.constructor = PIXI.WebGLRenderer;
|
||||
|
||||
/**
|
||||
* @method initContext
|
||||
*/
|
||||
PIXI.WebGLRenderer.prototype.initContext = function()
|
||||
{
|
||||
var gl = this.view.getContext('webgl', this._contextOptions) || this.view.getContext('experimental-webgl', this._contextOptions);
|
||||
this.gl = gl;
|
||||
|
||||
if (!gl) {
|
||||
// fail, not able to get a context
|
||||
throw new Error('This browser does not support webGL. Try using the canvas renderer');
|
||||
}
|
||||
|
||||
this.glContextId = gl.id = PIXI.WebGLRenderer.glContextId ++;
|
||||
|
||||
PIXI.glContexts[this.glContextId] = gl;
|
||||
|
||||
PIXI.instances[this.glContextId] = this;
|
||||
|
||||
// set up the default pixi settings..
|
||||
gl.disable(gl.DEPTH_TEST);
|
||||
gl.disable(gl.CULL_FACE);
|
||||
gl.enable(gl.BLEND);
|
||||
|
||||
// need to set the context for all the managers...
|
||||
this.shaderManager.setContext(gl);
|
||||
this.spriteBatch.setContext(gl);
|
||||
this.maskManager.setContext(gl);
|
||||
this.filterManager.setContext(gl);
|
||||
this.blendModeManager.setContext(gl);
|
||||
this.stencilManager.setContext(gl);
|
||||
|
||||
this.renderSession.gl = this.gl;
|
||||
|
||||
// now resize and we are good to go!
|
||||
this.resize(this.width, this.height);
|
||||
};
|
||||
|
||||
/**
|
||||
* Renders the stage to its webGL view
|
||||
*
|
||||
* @method render
|
||||
* @param stage {Stage} the Stage element to be rendered
|
||||
*/
|
||||
PIXI.WebGLRenderer.prototype.render = function(stage)
|
||||
{
|
||||
// no point rendering if our context has been blown up!
|
||||
if(this.contextLost)return;
|
||||
|
||||
// if rendering a new stage clear the batches..
|
||||
if(this.__stage !== stage)
|
||||
{
|
||||
if(stage.interactive)stage.interactionManager.removeEvents();
|
||||
|
||||
// TODO make this work
|
||||
// dont think this is needed any more?
|
||||
this.__stage = stage;
|
||||
}
|
||||
|
||||
// update the scene graph
|
||||
stage.updateTransform();
|
||||
|
||||
var gl = this.gl;
|
||||
|
||||
// interaction
|
||||
if(stage._interactive)
|
||||
{
|
||||
//need to add some events!
|
||||
if(!stage._interactiveEventsAdded)
|
||||
{
|
||||
stage._interactiveEventsAdded = true;
|
||||
stage.interactionManager.setTarget(this);
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
if(stage._interactiveEventsAdded)
|
||||
{
|
||||
stage._interactiveEventsAdded = false;
|
||||
stage.interactionManager.setTarget(this);
|
||||
}
|
||||
}
|
||||
|
||||
// -- Does this need to be set every frame? -- //
|
||||
gl.viewport(0, 0, this.width, this.height);
|
||||
|
||||
// make sure we are bound to the main frame buffer
|
||||
gl.bindFramebuffer(gl.FRAMEBUFFER, null);
|
||||
|
||||
if (this.clearBeforeRender)
|
||||
{
|
||||
if(this.transparent)
|
||||
{
|
||||
gl.clearColor(0, 0, 0, 0);
|
||||
}
|
||||
else
|
||||
{
|
||||
gl.clearColor(stage.backgroundColorSplit[0],stage.backgroundColorSplit[1],stage.backgroundColorSplit[2], 1);
|
||||
}
|
||||
|
||||
gl.clear (gl.COLOR_BUFFER_BIT);
|
||||
}
|
||||
|
||||
this.renderDisplayObject( stage, this.projection );
|
||||
};
|
||||
|
||||
/**
|
||||
* Renders a Display Object.
|
||||
*
|
||||
* @method renderDisplayObject
|
||||
* @param displayObject {DisplayObject} The DisplayObject to render
|
||||
* @param projection {Point} The projection
|
||||
* @param buffer {Array} a standard WebGL buffer
|
||||
*/
|
||||
PIXI.WebGLRenderer.prototype.renderDisplayObject = function(displayObject, projection, buffer)
|
||||
{
|
||||
this.renderSession.blendModeManager.setBlendMode(PIXI.blendModes.NORMAL);
|
||||
|
||||
// reset the render session data..
|
||||
this.renderSession.drawCount = 0;
|
||||
|
||||
// make sure to flip the Y if using a render texture..
|
||||
this.renderSession.flipY = buffer ? -1 : 1;
|
||||
|
||||
// set the default projection
|
||||
this.renderSession.projection = projection;
|
||||
|
||||
//set the default offset
|
||||
this.renderSession.offset = this.offset;
|
||||
|
||||
// start the sprite batch
|
||||
this.spriteBatch.begin(this.renderSession);
|
||||
|
||||
// start the filter manager
|
||||
this.filterManager.begin(this.renderSession, buffer);
|
||||
|
||||
// render the scene!
|
||||
displayObject._renderWebGL(this.renderSession);
|
||||
|
||||
// finish the sprite batch
|
||||
this.spriteBatch.end();
|
||||
};
|
||||
|
||||
/**
|
||||
* Resizes the webGL view to the specified width and height.
|
||||
*
|
||||
* @method resize
|
||||
* @param width {Number} the new width of the webGL view
|
||||
* @param height {Number} the new height of the webGL view
|
||||
*/
|
||||
PIXI.WebGLRenderer.prototype.resize = function(width, height)
|
||||
{
|
||||
this.width = width * this.resolution;
|
||||
this.height = height * this.resolution;
|
||||
|
||||
this.view.width = this.width;
|
||||
this.view.height = this.height;
|
||||
|
||||
if (this.autoResize) {
|
||||
this.view.style.width = this.width / this.resolution + 'px';
|
||||
this.view.style.height = this.height / this.resolution + 'px';
|
||||
}
|
||||
|
||||
this.gl.viewport(0, 0, this.width, this.height);
|
||||
|
||||
this.projection.x = this.width / 2 / this.resolution;
|
||||
this.projection.y = -this.height / 2 / this.resolution;
|
||||
};
|
||||
|
||||
/**
|
||||
* Updates and Creates a WebGL texture for the renderers context.
|
||||
*
|
||||
* @method updateTexture
|
||||
* @param texture {Texture} the texture to update
|
||||
*/
|
||||
PIXI.WebGLRenderer.prototype.updateTexture = function(texture)
|
||||
{
|
||||
if(!texture.hasLoaded )return;
|
||||
|
||||
var gl = this.gl;
|
||||
|
||||
if(!texture._glTextures[gl.id])texture._glTextures[gl.id] = gl.createTexture();
|
||||
|
||||
gl.bindTexture(gl.TEXTURE_2D, texture._glTextures[gl.id]);
|
||||
|
||||
gl.pixelStorei(gl.UNPACK_PREMULTIPLY_ALPHA_WEBGL, texture.premultipliedAlpha);
|
||||
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, texture.source);
|
||||
|
||||
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, texture.scaleMode === PIXI.scaleModes.LINEAR ? gl.LINEAR : gl.NEAREST);
|
||||
|
||||
|
||||
if(texture.mipmap && PIXI.isPowerOfTwo(texture.width, texture.height))
|
||||
{
|
||||
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, texture.scaleMode === PIXI.scaleModes.LINEAR ? gl.LINEAR_MIPMAP_LINEAR : gl.NEAREST_MIPMAP_NEAREST);
|
||||
gl.generateMipmap(gl.TEXTURE_2D);
|
||||
}
|
||||
else
|
||||
{
|
||||
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, texture.scaleMode === PIXI.scaleModes.LINEAR ? gl.LINEAR : gl.NEAREST);
|
||||
}
|
||||
|
||||
// reguler...
|
||||
if(!texture._powerOf2)
|
||||
{
|
||||
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
|
||||
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
|
||||
}
|
||||
else
|
||||
{
|
||||
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.REPEAT);
|
||||
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.REPEAT);
|
||||
}
|
||||
|
||||
texture._dirty[gl.id] = false;
|
||||
|
||||
return texture._glTextures[gl.id];
|
||||
};
|
||||
|
||||
/**
|
||||
* Handles a lost webgl context
|
||||
*
|
||||
* @method handleContextLost
|
||||
* @param event {Event}
|
||||
* @private
|
||||
*/
|
||||
PIXI.WebGLRenderer.prototype.handleContextLost = function(event)
|
||||
{
|
||||
event.preventDefault();
|
||||
this.contextLost = true;
|
||||
};
|
||||
|
||||
/**
|
||||
* Handles a restored webgl context
|
||||
*
|
||||
* @method handleContextRestored
|
||||
* @param event {Event}
|
||||
* @private
|
||||
*/
|
||||
PIXI.WebGLRenderer.prototype.handleContextRestored = function()
|
||||
{
|
||||
this.initContext();
|
||||
|
||||
// empty all the ol gl textures as they are useless now
|
||||
for(var key in PIXI.TextureCache)
|
||||
{
|
||||
var texture = PIXI.TextureCache[key].baseTexture;
|
||||
texture._glTextures = [];
|
||||
}
|
||||
|
||||
this.contextLost = false;
|
||||
};
|
||||
|
||||
/**
|
||||
* Removes everything from the renderer (event listeners, spritebatch, etc...)
|
||||
*
|
||||
* @method destroy
|
||||
*/
|
||||
PIXI.WebGLRenderer.prototype.destroy = function()
|
||||
{
|
||||
// remove listeners
|
||||
this.view.removeEventListener('webglcontextlost', this.contextLostBound);
|
||||
this.view.removeEventListener('webglcontextrestored', this.contextRestoredBound);
|
||||
|
||||
PIXI.glContexts[this.glContextId] = null;
|
||||
|
||||
this.projection = null;
|
||||
this.offset = null;
|
||||
|
||||
// time to create the render managers! each one focuses on managine a state in webGL
|
||||
this.shaderManager.destroy();
|
||||
this.spriteBatch.destroy();
|
||||
this.maskManager.destroy();
|
||||
this.filterManager.destroy();
|
||||
|
||||
this.shaderManager = null;
|
||||
this.spriteBatch = null;
|
||||
this.maskManager = null;
|
||||
this.filterManager = null;
|
||||
|
||||
this.gl = null;
|
||||
this.renderSession = null;
|
||||
};
|
||||
|
||||
/**
|
||||
* Maps Pixi blend modes to WebGL blend modes.
|
||||
*
|
||||
* @method mapBlendModes
|
||||
*/
|
||||
PIXI.WebGLRenderer.prototype.mapBlendModes = function()
|
||||
{
|
||||
var gl = this.gl;
|
||||
|
||||
if(!PIXI.blendModesWebGL)
|
||||
{
|
||||
PIXI.blendModesWebGL = [];
|
||||
|
||||
PIXI.blendModesWebGL[PIXI.blendModes.NORMAL] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA];
|
||||
PIXI.blendModesWebGL[PIXI.blendModes.ADD] = [gl.SRC_ALPHA, gl.DST_ALPHA];
|
||||
PIXI.blendModesWebGL[PIXI.blendModes.MULTIPLY] = [gl.DST_COLOR, gl.ONE_MINUS_SRC_ALPHA];
|
||||
PIXI.blendModesWebGL[PIXI.blendModes.SCREEN] = [gl.SRC_ALPHA, gl.ONE];
|
||||
PIXI.blendModesWebGL[PIXI.blendModes.OVERLAY] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA];
|
||||
PIXI.blendModesWebGL[PIXI.blendModes.DARKEN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA];
|
||||
PIXI.blendModesWebGL[PIXI.blendModes.LIGHTEN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA];
|
||||
PIXI.blendModesWebGL[PIXI.blendModes.COLOR_DODGE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA];
|
||||
PIXI.blendModesWebGL[PIXI.blendModes.COLOR_BURN] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA];
|
||||
PIXI.blendModesWebGL[PIXI.blendModes.HARD_LIGHT] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA];
|
||||
PIXI.blendModesWebGL[PIXI.blendModes.SOFT_LIGHT] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA];
|
||||
PIXI.blendModesWebGL[PIXI.blendModes.DIFFERENCE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA];
|
||||
PIXI.blendModesWebGL[PIXI.blendModes.EXCLUSION] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA];
|
||||
PIXI.blendModesWebGL[PIXI.blendModes.HUE] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA];
|
||||
PIXI.blendModesWebGL[PIXI.blendModes.SATURATION] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA];
|
||||
PIXI.blendModesWebGL[PIXI.blendModes.COLOR] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA];
|
||||
PIXI.blendModesWebGL[PIXI.blendModes.LUMINOSITY] = [gl.ONE, gl.ONE_MINUS_SRC_ALPHA];
|
||||
}
|
||||
};
|
||||
|
||||
PIXI.WebGLRenderer.glContextId = 0;
|
||||
122
app/Lib/Vendor/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js
vendored
Normal file
122
app/Lib/Vendor/src/pixi/renderers/webgl/shaders/ComplexPrimitiveShader.js
vendored
Normal file
|
|
@ -0,0 +1,122 @@
|
|||
/**
|
||||
* @author Mat Groves http://matgroves.com/ @Doormat23
|
||||
*/
|
||||
|
||||
/**
|
||||
* @class ComplexPrimitiveShader
|
||||
* @constructor
|
||||
* @param gl {WebGLContext} the current WebGL drawing context
|
||||
*/
|
||||
PIXI.ComplexPrimitiveShader = function(gl)
|
||||
{
|
||||
/**
|
||||
* @property _UID
|
||||
* @type Number
|
||||
* @private
|
||||
*/
|
||||
this._UID = PIXI._UID++;
|
||||
|
||||
/**
|
||||
* @property gl
|
||||
* @type WebGLContext
|
||||
*/
|
||||
this.gl = gl;
|
||||
|
||||
/**
|
||||
* The WebGL program.
|
||||
* @property program
|
||||
* @type Any
|
||||
*/
|
||||
this.program = null;
|
||||
|
||||
/**
|
||||
* The fragment shader.
|
||||
* @property fragmentSrc
|
||||
* @type Array
|
||||
*/
|
||||
this.fragmentSrc = [
|
||||
|
||||
'precision mediump float;',
|
||||
|
||||
'varying vec4 vColor;',
|
||||
|
||||
'void main(void) {',
|
||||
' gl_FragColor = vColor;',
|
||||
'}'
|
||||
];
|
||||
|
||||
/**
|
||||
* The vertex shader.
|
||||
* @property vertexSrc
|
||||
* @type Array
|
||||
*/
|
||||
this.vertexSrc = [
|
||||
'attribute vec2 aVertexPosition;',
|
||||
//'attribute vec4 aColor;',
|
||||
'uniform mat3 translationMatrix;',
|
||||
'uniform vec2 projectionVector;',
|
||||
'uniform vec2 offsetVector;',
|
||||
|
||||
'uniform vec3 tint;',
|
||||
'uniform float alpha;',
|
||||
'uniform vec3 color;',
|
||||
'uniform float flipY;',
|
||||
'varying vec4 vColor;',
|
||||
|
||||
'void main(void) {',
|
||||
' vec3 v = translationMatrix * vec3(aVertexPosition , 1.0);',
|
||||
' v -= offsetVector.xyx;',
|
||||
' gl_Position = vec4( v.x / projectionVector.x -1.0, (v.y / projectionVector.y * -flipY) + flipY , 0.0, 1.0);',
|
||||
' vColor = vec4(color * alpha * tint, alpha);',//" * vec4(tint * alpha, alpha);',
|
||||
'}'
|
||||
];
|
||||
|
||||
this.init();
|
||||
};
|
||||
|
||||
PIXI.ComplexPrimitiveShader.prototype.constructor = PIXI.ComplexPrimitiveShader;
|
||||
|
||||
/**
|
||||
* Initialises the shader.
|
||||
*
|
||||
* @method init
|
||||
*/
|
||||
PIXI.ComplexPrimitiveShader.prototype.init = function()
|
||||
{
|
||||
var gl = this.gl;
|
||||
|
||||
var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc);
|
||||
gl.useProgram(program);
|
||||
|
||||
// get and store the uniforms for the shader
|
||||
this.projectionVector = gl.getUniformLocation(program, 'projectionVector');
|
||||
this.offsetVector = gl.getUniformLocation(program, 'offsetVector');
|
||||
this.tintColor = gl.getUniformLocation(program, 'tint');
|
||||
this.color = gl.getUniformLocation(program, 'color');
|
||||
this.flipY = gl.getUniformLocation(program, 'flipY');
|
||||
|
||||
// get and store the attributes
|
||||
this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition');
|
||||
// this.colorAttribute = gl.getAttribLocation(program, 'aColor');
|
||||
|
||||
this.attributes = [this.aVertexPosition, this.colorAttribute];
|
||||
|
||||
this.translationMatrix = gl.getUniformLocation(program, 'translationMatrix');
|
||||
this.alpha = gl.getUniformLocation(program, 'alpha');
|
||||
|
||||
this.program = program;
|
||||
};
|
||||
|
||||
/**
|
||||
* Destroys the shader.
|
||||
*
|
||||
* @method destroy
|
||||
*/
|
||||
PIXI.ComplexPrimitiveShader.prototype.destroy = function()
|
||||
{
|
||||
this.gl.deleteProgram( this.program );
|
||||
this.uniforms = null;
|
||||
this.gl = null;
|
||||
|
||||
this.attribute = null;
|
||||
};
|
||||
155
app/Lib/Vendor/src/pixi/renderers/webgl/shaders/PixiFastShader.js
vendored
Normal file
155
app/Lib/Vendor/src/pixi/renderers/webgl/shaders/PixiFastShader.js
vendored
Normal file
|
|
@ -0,0 +1,155 @@
|
|||
/**
|
||||
* @author Mat Groves http://matgroves.com/ @Doormat23
|
||||
*/
|
||||
|
||||
/**
|
||||
* @class PixiFastShader
|
||||
* @constructor
|
||||
* @param gl {WebGLContext} the current WebGL drawing context
|
||||
*/
|
||||
PIXI.PixiFastShader = function(gl)
|
||||
{
|
||||
/**
|
||||
* @property _UID
|
||||
* @type Number
|
||||
* @private
|
||||
*/
|
||||
this._UID = PIXI._UID++;
|
||||
|
||||
/**
|
||||
* @property gl
|
||||
* @type WebGLContext
|
||||
*/
|
||||
this.gl = gl;
|
||||
|
||||
/**
|
||||
* The WebGL program.
|
||||
* @property program
|
||||
* @type Any
|
||||
*/
|
||||
this.program = null;
|
||||
|
||||
/**
|
||||
* The fragment shader.
|
||||
* @property fragmentSrc
|
||||
* @type Array
|
||||
*/
|
||||
this.fragmentSrc = [
|
||||
'precision lowp float;',
|
||||
'varying vec2 vTextureCoord;',
|
||||
'varying float vColor;',
|
||||
'uniform sampler2D uSampler;',
|
||||
'void main(void) {',
|
||||
' gl_FragColor = texture2D(uSampler, vTextureCoord) * vColor ;',
|
||||
'}'
|
||||
];
|
||||
|
||||
/**
|
||||
* The vertex shader.
|
||||
* @property vertexSrc
|
||||
* @type Array
|
||||
*/
|
||||
this.vertexSrc = [
|
||||
'attribute vec2 aVertexPosition;',
|
||||
'attribute vec2 aPositionCoord;',
|
||||
'attribute vec2 aScale;',
|
||||
'attribute float aRotation;',
|
||||
'attribute vec2 aTextureCoord;',
|
||||
'attribute float aColor;',
|
||||
|
||||
'uniform vec2 projectionVector;',
|
||||
'uniform vec2 offsetVector;',
|
||||
'uniform mat3 uMatrix;',
|
||||
|
||||
'varying vec2 vTextureCoord;',
|
||||
'varying float vColor;',
|
||||
|
||||
'const vec2 center = vec2(-1.0, 1.0);',
|
||||
|
||||
'void main(void) {',
|
||||
' vec2 v;',
|
||||
' vec2 sv = aVertexPosition * aScale;',
|
||||
' v.x = (sv.x) * cos(aRotation) - (sv.y) * sin(aRotation);',
|
||||
' v.y = (sv.x) * sin(aRotation) + (sv.y) * cos(aRotation);',
|
||||
' v = ( uMatrix * vec3(v + aPositionCoord , 1.0) ).xy ;',
|
||||
' gl_Position = vec4( ( v / projectionVector) + center , 0.0, 1.0);',
|
||||
' vTextureCoord = aTextureCoord;',
|
||||
// ' vec3 color = mod(vec3(aColor.y/65536.0, aColor.y/256.0, aColor.y), 256.0) / 256.0;',
|
||||
' vColor = aColor;',
|
||||
'}'
|
||||
];
|
||||
|
||||
/**
|
||||
* A local texture counter for multi-texture shaders.
|
||||
* @property textureCount
|
||||
* @type Number
|
||||
*/
|
||||
this.textureCount = 0;
|
||||
|
||||
this.init();
|
||||
};
|
||||
|
||||
PIXI.PixiFastShader.prototype.constructor = PIXI.PixiFastShader;
|
||||
|
||||
/**
|
||||
* Initialises the shader.
|
||||
*
|
||||
* @method init
|
||||
*/
|
||||
PIXI.PixiFastShader.prototype.init = function()
|
||||
{
|
||||
var gl = this.gl;
|
||||
|
||||
var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc);
|
||||
|
||||
gl.useProgram(program);
|
||||
|
||||
// get and store the uniforms for the shader
|
||||
this.uSampler = gl.getUniformLocation(program, 'uSampler');
|
||||
|
||||
this.projectionVector = gl.getUniformLocation(program, 'projectionVector');
|
||||
this.offsetVector = gl.getUniformLocation(program, 'offsetVector');
|
||||
this.dimensions = gl.getUniformLocation(program, 'dimensions');
|
||||
this.uMatrix = gl.getUniformLocation(program, 'uMatrix');
|
||||
|
||||
// get and store the attributes
|
||||
this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition');
|
||||
this.aPositionCoord = gl.getAttribLocation(program, 'aPositionCoord');
|
||||
|
||||
this.aScale = gl.getAttribLocation(program, 'aScale');
|
||||
this.aRotation = gl.getAttribLocation(program, 'aRotation');
|
||||
|
||||
this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord');
|
||||
this.colorAttribute = gl.getAttribLocation(program, 'aColor');
|
||||
|
||||
// Begin worst hack eva //
|
||||
|
||||
// WHY??? ONLY on my chrome pixel the line above returns -1 when using filters?
|
||||
// maybe its somthing to do with the current state of the gl context.
|
||||
// Im convinced this is a bug in the chrome browser as there is NO reason why this should be returning -1 especially as it only manifests on my chrome pixel
|
||||
// If theres any webGL people that know why could happen please help :)
|
||||
if(this.colorAttribute === -1)
|
||||
{
|
||||
this.colorAttribute = 2;
|
||||
}
|
||||
|
||||
this.attributes = [this.aVertexPosition, this.aPositionCoord, this.aScale, this.aRotation, this.aTextureCoord, this.colorAttribute];
|
||||
|
||||
// End worst hack eva //
|
||||
|
||||
this.program = program;
|
||||
};
|
||||
|
||||
/**
|
||||
* Destroys the shader.
|
||||
*
|
||||
* @method destroy
|
||||
*/
|
||||
PIXI.PixiFastShader.prototype.destroy = function()
|
||||
{
|
||||
this.gl.deleteProgram( this.program );
|
||||
this.uniforms = null;
|
||||
this.gl = null;
|
||||
|
||||
this.attributes = null;
|
||||
};
|
||||
389
app/Lib/Vendor/src/pixi/renderers/webgl/shaders/PixiShader.js
vendored
Normal file
389
app/Lib/Vendor/src/pixi/renderers/webgl/shaders/PixiShader.js
vendored
Normal file
|
|
@ -0,0 +1,389 @@
|
|||
/**
|
||||
* @author Mat Groves http://matgroves.com/ @Doormat23
|
||||
* @author Richard Davey http://www.photonstorm.com @photonstorm
|
||||
*/
|
||||
|
||||
/**
|
||||
* @class PixiShader
|
||||
* @constructor
|
||||
* @param gl {WebGLContext} the current WebGL drawing context
|
||||
*/
|
||||
PIXI.PixiShader = function(gl)
|
||||
{
|
||||
/**
|
||||
* @property _UID
|
||||
* @type Number
|
||||
* @private
|
||||
*/
|
||||
this._UID = PIXI._UID++;
|
||||
|
||||
/**
|
||||
* @property gl
|
||||
* @type WebGLContext
|
||||
*/
|
||||
this.gl = gl;
|
||||
|
||||
/**
|
||||
* The WebGL program.
|
||||
* @property program
|
||||
* @type Any
|
||||
*/
|
||||
this.program = null;
|
||||
|
||||
/**
|
||||
* The fragment shader.
|
||||
* @property fragmentSrc
|
||||
* @type Array
|
||||
*/
|
||||
this.fragmentSrc = [
|
||||
'precision lowp float;',
|
||||
'varying vec2 vTextureCoord;',
|
||||
'varying vec4 vColor;',
|
||||
'uniform sampler2D uSampler;',
|
||||
'void main(void) {',
|
||||
' gl_FragColor = texture2D(uSampler, vTextureCoord) * vColor ;',
|
||||
'}'
|
||||
];
|
||||
|
||||
/**
|
||||
* A local texture counter for multi-texture shaders.
|
||||
* @property textureCount
|
||||
* @type Number
|
||||
*/
|
||||
this.textureCount = 0;
|
||||
|
||||
/**
|
||||
* A local flag
|
||||
* @property firstRun
|
||||
* @type Boolean
|
||||
* @private
|
||||
*/
|
||||
this.firstRun = true;
|
||||
|
||||
/**
|
||||
* A dirty flag
|
||||
* @property dirty
|
||||
* @type Boolean
|
||||
*/
|
||||
this.dirty = true;
|
||||
|
||||
/**
|
||||
* Uniform attributes cache.
|
||||
* @property attributes
|
||||
* @type Array
|
||||
* @private
|
||||
*/
|
||||
this.attributes = [];
|
||||
|
||||
this.init();
|
||||
};
|
||||
|
||||
PIXI.PixiShader.prototype.constructor = PIXI.PixiShader;
|
||||
|
||||
/**
|
||||
* Initialises the shader.
|
||||
*
|
||||
* @method init
|
||||
*/
|
||||
PIXI.PixiShader.prototype.init = function()
|
||||
{
|
||||
var gl = this.gl;
|
||||
|
||||
var program = PIXI.compileProgram(gl, this.vertexSrc || PIXI.PixiShader.defaultVertexSrc, this.fragmentSrc);
|
||||
|
||||
gl.useProgram(program);
|
||||
|
||||
// get and store the uniforms for the shader
|
||||
this.uSampler = gl.getUniformLocation(program, 'uSampler');
|
||||
this.projectionVector = gl.getUniformLocation(program, 'projectionVector');
|
||||
this.offsetVector = gl.getUniformLocation(program, 'offsetVector');
|
||||
this.dimensions = gl.getUniformLocation(program, 'dimensions');
|
||||
|
||||
// get and store the attributes
|
||||
this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition');
|
||||
this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord');
|
||||
this.colorAttribute = gl.getAttribLocation(program, 'aColor');
|
||||
|
||||
// Begin worst hack eva //
|
||||
|
||||
// WHY??? ONLY on my chrome pixel the line above returns -1 when using filters?
|
||||
// maybe its something to do with the current state of the gl context.
|
||||
// I'm convinced this is a bug in the chrome browser as there is NO reason why this should be returning -1 especially as it only manifests on my chrome pixel
|
||||
// If theres any webGL people that know why could happen please help :)
|
||||
if(this.colorAttribute === -1)
|
||||
{
|
||||
this.colorAttribute = 2;
|
||||
}
|
||||
|
||||
this.attributes = [this.aVertexPosition, this.aTextureCoord, this.colorAttribute];
|
||||
|
||||
// End worst hack eva //
|
||||
|
||||
// add those custom shaders!
|
||||
for (var key in this.uniforms)
|
||||
{
|
||||
// get the uniform locations..
|
||||
this.uniforms[key].uniformLocation = gl.getUniformLocation(program, key);
|
||||
}
|
||||
|
||||
this.initUniforms();
|
||||
|
||||
this.program = program;
|
||||
};
|
||||
|
||||
/**
|
||||
* Initialises the shader uniform values.
|
||||
*
|
||||
* Uniforms are specified in the GLSL_ES Specification: http://www.khronos.org/registry/webgl/specs/latest/1.0/
|
||||
* http://www.khronos.org/registry/gles/specs/2.0/GLSL_ES_Specification_1.0.17.pdf
|
||||
*
|
||||
* @method initUniforms
|
||||
*/
|
||||
PIXI.PixiShader.prototype.initUniforms = function()
|
||||
{
|
||||
this.textureCount = 1;
|
||||
var gl = this.gl;
|
||||
var uniform;
|
||||
|
||||
for (var key in this.uniforms)
|
||||
{
|
||||
uniform = this.uniforms[key];
|
||||
|
||||
var type = uniform.type;
|
||||
|
||||
if (type === 'sampler2D')
|
||||
{
|
||||
uniform._init = false;
|
||||
|
||||
if (uniform.value !== null)
|
||||
{
|
||||
this.initSampler2D(uniform);
|
||||
}
|
||||
}
|
||||
else if (type === 'mat2' || type === 'mat3' || type === 'mat4')
|
||||
{
|
||||
// These require special handling
|
||||
uniform.glMatrix = true;
|
||||
uniform.glValueLength = 1;
|
||||
|
||||
if (type === 'mat2')
|
||||
{
|
||||
uniform.glFunc = gl.uniformMatrix2fv;
|
||||
}
|
||||
else if (type === 'mat3')
|
||||
{
|
||||
uniform.glFunc = gl.uniformMatrix3fv;
|
||||
}
|
||||
else if (type === 'mat4')
|
||||
{
|
||||
uniform.glFunc = gl.uniformMatrix4fv;
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
// GL function reference
|
||||
uniform.glFunc = gl['uniform' + type];
|
||||
|
||||
if (type === '2f' || type === '2i')
|
||||
{
|
||||
uniform.glValueLength = 2;
|
||||
}
|
||||
else if (type === '3f' || type === '3i')
|
||||
{
|
||||
uniform.glValueLength = 3;
|
||||
}
|
||||
else if (type === '4f' || type === '4i')
|
||||
{
|
||||
uniform.glValueLength = 4;
|
||||
}
|
||||
else
|
||||
{
|
||||
uniform.glValueLength = 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
* Initialises a Sampler2D uniform (which may only be available later on after initUniforms once the texture has loaded)
|
||||
*
|
||||
* @method initSampler2D
|
||||
*/
|
||||
PIXI.PixiShader.prototype.initSampler2D = function(uniform)
|
||||
{
|
||||
if (!uniform.value || !uniform.value.baseTexture || !uniform.value.baseTexture.hasLoaded)
|
||||
{
|
||||
return;
|
||||
}
|
||||
|
||||
var gl = this.gl;
|
||||
|
||||
gl.activeTexture(gl['TEXTURE' + this.textureCount]);
|
||||
gl.bindTexture(gl.TEXTURE_2D, uniform.value.baseTexture._glTextures[gl.id]);
|
||||
|
||||
// Extended texture data
|
||||
if (uniform.textureData)
|
||||
{
|
||||
var data = uniform.textureData;
|
||||
|
||||
// GLTexture = mag linear, min linear_mipmap_linear, wrap repeat + gl.generateMipmap(gl.TEXTURE_2D);
|
||||
// GLTextureLinear = mag/min linear, wrap clamp
|
||||
// GLTextureNearestRepeat = mag/min NEAREST, wrap repeat
|
||||
// GLTextureNearest = mag/min nearest, wrap clamp
|
||||
// AudioTexture = whatever + luminance + width 512, height 2, border 0
|
||||
// KeyTexture = whatever + luminance + width 256, height 2, border 0
|
||||
|
||||
// magFilter can be: gl.LINEAR, gl.LINEAR_MIPMAP_LINEAR or gl.NEAREST
|
||||
// wrapS/T can be: gl.CLAMP_TO_EDGE or gl.REPEAT
|
||||
|
||||
var magFilter = (data.magFilter) ? data.magFilter : gl.LINEAR;
|
||||
var minFilter = (data.minFilter) ? data.minFilter : gl.LINEAR;
|
||||
var wrapS = (data.wrapS) ? data.wrapS : gl.CLAMP_TO_EDGE;
|
||||
var wrapT = (data.wrapT) ? data.wrapT : gl.CLAMP_TO_EDGE;
|
||||
var format = (data.luminance) ? gl.LUMINANCE : gl.RGBA;
|
||||
|
||||
if (data.repeat)
|
||||
{
|
||||
wrapS = gl.REPEAT;
|
||||
wrapT = gl.REPEAT;
|
||||
}
|
||||
|
||||
gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, !!data.flipY);
|
||||
|
||||
if (data.width)
|
||||
{
|
||||
var width = (data.width) ? data.width : 512;
|
||||
var height = (data.height) ? data.height : 2;
|
||||
var border = (data.border) ? data.border : 0;
|
||||
|
||||
// void texImage2D(GLenum target, GLint level, GLenum internalformat, GLsizei width, GLsizei height, GLint border, GLenum format, GLenum type, ArrayBufferView? pixels);
|
||||
gl.texImage2D(gl.TEXTURE_2D, 0, format, width, height, border, format, gl.UNSIGNED_BYTE, null);
|
||||
}
|
||||
else
|
||||
{
|
||||
// void texImage2D(GLenum target, GLint level, GLenum internalformat, GLenum format, GLenum type, ImageData? pixels);
|
||||
gl.texImage2D(gl.TEXTURE_2D, 0, format, gl.RGBA, gl.UNSIGNED_BYTE, uniform.value.baseTexture.source);
|
||||
}
|
||||
|
||||
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, magFilter);
|
||||
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, minFilter);
|
||||
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, wrapS);
|
||||
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, wrapT);
|
||||
}
|
||||
|
||||
gl.uniform1i(uniform.uniformLocation, this.textureCount);
|
||||
|
||||
uniform._init = true;
|
||||
|
||||
this.textureCount++;
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
* Updates the shader uniform values.
|
||||
*
|
||||
* @method syncUniforms
|
||||
*/
|
||||
PIXI.PixiShader.prototype.syncUniforms = function()
|
||||
{
|
||||
this.textureCount = 1;
|
||||
var uniform;
|
||||
var gl = this.gl;
|
||||
|
||||
// This would probably be faster in an array and it would guarantee key order
|
||||
for (var key in this.uniforms)
|
||||
{
|
||||
uniform = this.uniforms[key];
|
||||
|
||||
if (uniform.glValueLength === 1)
|
||||
{
|
||||
if (uniform.glMatrix === true)
|
||||
{
|
||||
uniform.glFunc.call(gl, uniform.uniformLocation, uniform.transpose, uniform.value);
|
||||
}
|
||||
else
|
||||
{
|
||||
uniform.glFunc.call(gl, uniform.uniformLocation, uniform.value);
|
||||
}
|
||||
}
|
||||
else if (uniform.glValueLength === 2)
|
||||
{
|
||||
uniform.glFunc.call(gl, uniform.uniformLocation, uniform.value.x, uniform.value.y);
|
||||
}
|
||||
else if (uniform.glValueLength === 3)
|
||||
{
|
||||
uniform.glFunc.call(gl, uniform.uniformLocation, uniform.value.x, uniform.value.y, uniform.value.z);
|
||||
}
|
||||
else if (uniform.glValueLength === 4)
|
||||
{
|
||||
uniform.glFunc.call(gl, uniform.uniformLocation, uniform.value.x, uniform.value.y, uniform.value.z, uniform.value.w);
|
||||
}
|
||||
else if (uniform.type === 'sampler2D')
|
||||
{
|
||||
if (uniform._init)
|
||||
{
|
||||
gl.activeTexture(gl['TEXTURE' + this.textureCount]);
|
||||
|
||||
if(uniform.value.baseTexture._dirty[gl.id])
|
||||
{
|
||||
PIXI.instances[gl.id].updateTexture(uniform.value.baseTexture);
|
||||
}
|
||||
else
|
||||
{
|
||||
// bind the current texture
|
||||
gl.bindTexture(gl.TEXTURE_2D, uniform.value.baseTexture._glTextures[gl.id]);
|
||||
}
|
||||
|
||||
// gl.bindTexture(gl.TEXTURE_2D, uniform.value.baseTexture._glTextures[gl.id] || PIXI.createWebGLTexture( uniform.value.baseTexture, gl));
|
||||
gl.uniform1i(uniform.uniformLocation, this.textureCount);
|
||||
this.textureCount++;
|
||||
}
|
||||
else
|
||||
{
|
||||
this.initSampler2D(uniform);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
* Destroys the shader.
|
||||
*
|
||||
* @method destroy
|
||||
*/
|
||||
PIXI.PixiShader.prototype.destroy = function()
|
||||
{
|
||||
this.gl.deleteProgram( this.program );
|
||||
this.uniforms = null;
|
||||
this.gl = null;
|
||||
|
||||
this.attributes = null;
|
||||
};
|
||||
|
||||
/**
|
||||
* The Default Vertex shader source.
|
||||
*
|
||||
* @property defaultVertexSrc
|
||||
* @type String
|
||||
*/
|
||||
PIXI.PixiShader.defaultVertexSrc = [
|
||||
'attribute vec2 aVertexPosition;',
|
||||
'attribute vec2 aTextureCoord;',
|
||||
'attribute vec4 aColor;',
|
||||
|
||||
'uniform vec2 projectionVector;',
|
||||
'uniform vec2 offsetVector;',
|
||||
|
||||
'varying vec2 vTextureCoord;',
|
||||
'varying vec4 vColor;',
|
||||
|
||||
'const vec2 center = vec2(-1.0, 1.0);',
|
||||
|
||||
'void main(void) {',
|
||||
' gl_Position = vec4( ((aVertexPosition + offsetVector) / projectionVector) + center , 0.0, 1.0);',
|
||||
' vTextureCoord = aTextureCoord;',
|
||||
' vColor = vec4(aColor.rgb * aColor.a, aColor.a);',
|
||||
'}'
|
||||
];
|
||||
117
app/Lib/Vendor/src/pixi/renderers/webgl/shaders/PrimitiveShader.js
vendored
Normal file
117
app/Lib/Vendor/src/pixi/renderers/webgl/shaders/PrimitiveShader.js
vendored
Normal file
|
|
@ -0,0 +1,117 @@
|
|||
/**
|
||||
* @author Mat Groves http://matgroves.com/ @Doormat23
|
||||
*/
|
||||
|
||||
/**
|
||||
* @class PrimitiveShader
|
||||
* @constructor
|
||||
* @param gl {WebGLContext} the current WebGL drawing context
|
||||
*/
|
||||
PIXI.PrimitiveShader = function(gl)
|
||||
{
|
||||
/**
|
||||
* @property _UID
|
||||
* @type Number
|
||||
* @private
|
||||
*/
|
||||
this._UID = PIXI._UID++;
|
||||
|
||||
/**
|
||||
* @property gl
|
||||
* @type WebGLContext
|
||||
*/
|
||||
this.gl = gl;
|
||||
|
||||
/**
|
||||
* The WebGL program.
|
||||
* @property program
|
||||
* @type Any
|
||||
*/
|
||||
this.program = null;
|
||||
|
||||
/**
|
||||
* The fragment shader.
|
||||
* @property fragmentSrc
|
||||
* @type Array
|
||||
*/
|
||||
this.fragmentSrc = [
|
||||
'precision mediump float;',
|
||||
'varying vec4 vColor;',
|
||||
|
||||
'void main(void) {',
|
||||
' gl_FragColor = vColor;',
|
||||
'}'
|
||||
];
|
||||
|
||||
/**
|
||||
* The vertex shader.
|
||||
* @property vertexSrc
|
||||
* @type Array
|
||||
*/
|
||||
this.vertexSrc = [
|
||||
'attribute vec2 aVertexPosition;',
|
||||
'attribute vec4 aColor;',
|
||||
'uniform mat3 translationMatrix;',
|
||||
'uniform vec2 projectionVector;',
|
||||
'uniform vec2 offsetVector;',
|
||||
'uniform float alpha;',
|
||||
'uniform float flipY;',
|
||||
'uniform vec3 tint;',
|
||||
'varying vec4 vColor;',
|
||||
|
||||
'void main(void) {',
|
||||
' vec3 v = translationMatrix * vec3(aVertexPosition , 1.0);',
|
||||
' v -= offsetVector.xyx;',
|
||||
' gl_Position = vec4( v.x / projectionVector.x -1.0, (v.y / projectionVector.y * -flipY) + flipY , 0.0, 1.0);',
|
||||
' vColor = aColor * vec4(tint * alpha, alpha);',
|
||||
'}'
|
||||
];
|
||||
|
||||
this.init();
|
||||
};
|
||||
|
||||
PIXI.PrimitiveShader.prototype.constructor = PIXI.PrimitiveShader;
|
||||
|
||||
/**
|
||||
* Initialises the shader.
|
||||
*
|
||||
* @method init
|
||||
*/
|
||||
PIXI.PrimitiveShader.prototype.init = function()
|
||||
{
|
||||
var gl = this.gl;
|
||||
|
||||
var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc);
|
||||
gl.useProgram(program);
|
||||
|
||||
// get and store the uniforms for the shader
|
||||
this.projectionVector = gl.getUniformLocation(program, 'projectionVector');
|
||||
this.offsetVector = gl.getUniformLocation(program, 'offsetVector');
|
||||
this.tintColor = gl.getUniformLocation(program, 'tint');
|
||||
this.flipY = gl.getUniformLocation(program, 'flipY');
|
||||
|
||||
// get and store the attributes
|
||||
this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition');
|
||||
this.colorAttribute = gl.getAttribLocation(program, 'aColor');
|
||||
|
||||
this.attributes = [this.aVertexPosition, this.colorAttribute];
|
||||
|
||||
this.translationMatrix = gl.getUniformLocation(program, 'translationMatrix');
|
||||
this.alpha = gl.getUniformLocation(program, 'alpha');
|
||||
|
||||
this.program = program;
|
||||
};
|
||||
|
||||
/**
|
||||
* Destroys the shader.
|
||||
*
|
||||
* @method destroy
|
||||
*/
|
||||
PIXI.PrimitiveShader.prototype.destroy = function()
|
||||
{
|
||||
this.gl.deleteProgram( this.program );
|
||||
this.uniforms = null;
|
||||
this.gl = null;
|
||||
|
||||
this.attributes = null;
|
||||
};
|
||||
123
app/Lib/Vendor/src/pixi/renderers/webgl/shaders/StripShader.js
vendored
Normal file
123
app/Lib/Vendor/src/pixi/renderers/webgl/shaders/StripShader.js
vendored
Normal file
|
|
@ -0,0 +1,123 @@
|
|||
/**
|
||||
* @author Mat Groves http://matgroves.com/ @Doormat23
|
||||
*/
|
||||
|
||||
/**
|
||||
* @class StripShader
|
||||
* @constructor
|
||||
* @param gl {WebGLContext} the current WebGL drawing context
|
||||
*/
|
||||
PIXI.StripShader = function(gl)
|
||||
{
|
||||
/**
|
||||
* @property _UID
|
||||
* @type Number
|
||||
* @private
|
||||
*/
|
||||
this._UID = PIXI._UID++;
|
||||
|
||||
/**
|
||||
* @property gl
|
||||
* @type WebGLContext
|
||||
*/
|
||||
this.gl = gl;
|
||||
|
||||
/**
|
||||
* The WebGL program.
|
||||
* @property program
|
||||
* @type Any
|
||||
*/
|
||||
this.program = null;
|
||||
|
||||
/**
|
||||
* The fragment shader.
|
||||
* @property fragmentSrc
|
||||
* @type Array
|
||||
*/
|
||||
this.fragmentSrc = [
|
||||
'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)) * alpha;',
|
||||
// ' gl_FragColor = vec4(1.0, 0.0, 0.0, 1.0);',//gl_FragColor * alpha;',
|
||||
'}'
|
||||
];
|
||||
|
||||
/**
|
||||
* The vertex shader.
|
||||
* @property vertexSrc
|
||||
* @type Array
|
||||
*/
|
||||
this.vertexSrc = [
|
||||
'attribute vec2 aVertexPosition;',
|
||||
'attribute vec2 aTextureCoord;',
|
||||
'uniform mat3 translationMatrix;',
|
||||
'uniform vec2 projectionVector;',
|
||||
'uniform vec2 offsetVector;',
|
||||
// 'uniform float alpha;',
|
||||
// 'uniform vec3 tint;',
|
||||
'varying vec2 vTextureCoord;',
|
||||
// 'varying vec4 vColor;',
|
||||
|
||||
'void main(void) {',
|
||||
' vec3 v = translationMatrix * vec3(aVertexPosition , 1.0);',
|
||||
' v -= offsetVector.xyx;',
|
||||
' gl_Position = vec4( v.x / projectionVector.x -1.0, v.y / -projectionVector.y + 1.0 , 0.0, 1.0);',
|
||||
' vTextureCoord = aTextureCoord;',
|
||||
// ' vColor = aColor * vec4(tint * alpha, alpha);',
|
||||
'}'
|
||||
];
|
||||
|
||||
this.init();
|
||||
};
|
||||
|
||||
PIXI.StripShader.prototype.constructor = PIXI.StripShader;
|
||||
|
||||
/**
|
||||
* Initialises the shader.
|
||||
*
|
||||
* @method init
|
||||
*/
|
||||
PIXI.StripShader.prototype.init = function()
|
||||
{
|
||||
var gl = this.gl;
|
||||
|
||||
var program = PIXI.compileProgram(gl, this.vertexSrc, this.fragmentSrc);
|
||||
gl.useProgram(program);
|
||||
|
||||
// get and store the uniforms for the shader
|
||||
this.uSampler = gl.getUniformLocation(program, 'uSampler');
|
||||
this.projectionVector = gl.getUniformLocation(program, 'projectionVector');
|
||||
this.offsetVector = gl.getUniformLocation(program, 'offsetVector');
|
||||
this.colorAttribute = gl.getAttribLocation(program, 'aColor');
|
||||
//this.dimensions = gl.getUniformLocation(this.program, 'dimensions');
|
||||
|
||||
// get and store the attributes
|
||||
this.aVertexPosition = gl.getAttribLocation(program, 'aVertexPosition');
|
||||
this.aTextureCoord = gl.getAttribLocation(program, 'aTextureCoord');
|
||||
|
||||
this.attributes = [this.aVertexPosition, this.aTextureCoord];
|
||||
|
||||
this.translationMatrix = gl.getUniformLocation(program, 'translationMatrix');
|
||||
this.alpha = gl.getUniformLocation(program, 'alpha');
|
||||
|
||||
this.program = program;
|
||||
};
|
||||
|
||||
/**
|
||||
* Destroys the shader.
|
||||
*
|
||||
* @method destroy
|
||||
*/
|
||||
PIXI.StripShader.prototype.destroy = function()
|
||||
{
|
||||
this.gl.deleteProgram( this.program );
|
||||
this.uniforms = null;
|
||||
this.gl = null;
|
||||
|
||||
this.attribute = null;
|
||||
};
|
||||
110
app/Lib/Vendor/src/pixi/renderers/webgl/utils/FilterTexture.js
vendored
Normal file
110
app/Lib/Vendor/src/pixi/renderers/webgl/utils/FilterTexture.js
vendored
Normal file
|
|
@ -0,0 +1,110 @@
|
|||
/**
|
||||
* @author Mat Groves http://matgroves.com/ @Doormat23
|
||||
*/
|
||||
|
||||
/**
|
||||
* @class FilterTexture
|
||||
* @constructor
|
||||
* @param gl {WebGLContext} the current WebGL drawing context
|
||||
* @param width {Number} the horizontal range of the filter
|
||||
* @param height {Number} the vertical range of the filter
|
||||
* @param scaleMode {Number} See {{#crossLink "PIXI/scaleModes:property"}}PIXI.scaleModes{{/crossLink}} for possible values
|
||||
*/
|
||||
PIXI.FilterTexture = function(gl, width, height, scaleMode)
|
||||
{
|
||||
/**
|
||||
* @property gl
|
||||
* @type WebGLContext
|
||||
*/
|
||||
this.gl = gl;
|
||||
|
||||
// next time to create a frame buffer and texture
|
||||
|
||||
/**
|
||||
* @property frameBuffer
|
||||
* @type Any
|
||||
*/
|
||||
this.frameBuffer = gl.createFramebuffer();
|
||||
|
||||
/**
|
||||
* @property texture
|
||||
* @type Any
|
||||
*/
|
||||
this.texture = gl.createTexture();
|
||||
|
||||
/**
|
||||
* @property scaleMode
|
||||
* @type Number
|
||||
*/
|
||||
scaleMode = scaleMode || PIXI.scaleModes.DEFAULT;
|
||||
|
||||
gl.bindTexture(gl.TEXTURE_2D, this.texture);
|
||||
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, scaleMode === PIXI.scaleModes.LINEAR ? gl.LINEAR : gl.NEAREST);
|
||||
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, scaleMode === PIXI.scaleModes.LINEAR ? gl.LINEAR : gl.NEAREST);
|
||||
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, gl.CLAMP_TO_EDGE);
|
||||
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, gl.CLAMP_TO_EDGE);
|
||||
gl.bindFramebuffer(gl.FRAMEBUFFER, this.frameBuffer );
|
||||
|
||||
gl.bindFramebuffer(gl.FRAMEBUFFER, this.frameBuffer );
|
||||
gl.framebufferTexture2D(gl.FRAMEBUFFER, gl.COLOR_ATTACHMENT0, gl.TEXTURE_2D, this.texture, 0);
|
||||
|
||||
// required for masking a mask??
|
||||
this.renderBuffer = gl.createRenderbuffer();
|
||||
gl.bindRenderbuffer(gl.RENDERBUFFER, this.renderBuffer);
|
||||
gl.framebufferRenderbuffer(gl.FRAMEBUFFER, gl.DEPTH_STENCIL_ATTACHMENT, gl.RENDERBUFFER, this.renderBuffer);
|
||||
|
||||
this.resize(width, height);
|
||||
};
|
||||
|
||||
PIXI.FilterTexture.prototype.constructor = PIXI.FilterTexture;
|
||||
|
||||
/**
|
||||
* Clears the filter texture.
|
||||
*
|
||||
* @method clear
|
||||
*/
|
||||
PIXI.FilterTexture.prototype.clear = function()
|
||||
{
|
||||
var gl = this.gl;
|
||||
|
||||
gl.clearColor(0,0,0, 0);
|
||||
gl.clear(gl.COLOR_BUFFER_BIT);
|
||||
};
|
||||
|
||||
/**
|
||||
* Resizes the texture to the specified width and height
|
||||
*
|
||||
* @method resize
|
||||
* @param width {Number} the new width of the texture
|
||||
* @param height {Number} the new height of the texture
|
||||
*/
|
||||
PIXI.FilterTexture.prototype.resize = function(width, height)
|
||||
{
|
||||
if(this.width === width && this.height === height) return;
|
||||
|
||||
this.width = width;
|
||||
this.height = height;
|
||||
|
||||
var gl = this.gl;
|
||||
|
||||
gl.bindTexture(gl.TEXTURE_2D, this.texture);
|
||||
gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, width , height , 0, gl.RGBA, gl.UNSIGNED_BYTE, null);
|
||||
// update the stencil buffer width and height
|
||||
gl.bindRenderbuffer(gl.RENDERBUFFER, this.renderBuffer);
|
||||
gl.renderbufferStorage(gl.RENDERBUFFER, gl.DEPTH_STENCIL, width , height );
|
||||
};
|
||||
|
||||
/**
|
||||
* Destroys the filter texture.
|
||||
*
|
||||
* @method destroy
|
||||
*/
|
||||
PIXI.FilterTexture.prototype.destroy = function()
|
||||
{
|
||||
var gl = this.gl;
|
||||
gl.deleteFramebuffer( this.frameBuffer );
|
||||
gl.deleteTexture( this.texture );
|
||||
|
||||
this.frameBuffer = null;
|
||||
this.texture = null;
|
||||
};
|
||||
58
app/Lib/Vendor/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js
vendored
Normal file
58
app/Lib/Vendor/src/pixi/renderers/webgl/utils/WebGLBlendModeManager.js
vendored
Normal file
|
|
@ -0,0 +1,58 @@
|
|||
/**
|
||||
* @author Mat Groves http://matgroves.com/ @Doormat23
|
||||
*/
|
||||
|
||||
/**
|
||||
* @class WebGLBlendModeManager
|
||||
* @constructor
|
||||
* @param gl {WebGLContext} the current WebGL drawing context
|
||||
*/
|
||||
PIXI.WebGLBlendModeManager = function()
|
||||
{
|
||||
/**
|
||||
* @property currentBlendMode
|
||||
* @type Number
|
||||
*/
|
||||
this.currentBlendMode = 99999;
|
||||
};
|
||||
|
||||
PIXI.WebGLBlendModeManager.prototype.constructor = PIXI.WebGLBlendModeManager;
|
||||
|
||||
/**
|
||||
* Sets the WebGL Context.
|
||||
*
|
||||
* @method setContext
|
||||
* @param gl {WebGLContext} the current WebGL drawing context
|
||||
*/
|
||||
PIXI.WebGLBlendModeManager.prototype.setContext = function(gl)
|
||||
{
|
||||
this.gl = gl;
|
||||
};
|
||||
|
||||
/**
|
||||
* Sets-up the given blendMode from WebGL's point of view.
|
||||
*
|
||||
* @method setBlendMode
|
||||
* @param blendMode {Number} the blendMode, should be a Pixi const, such as PIXI.BlendModes.ADD
|
||||
*/
|
||||
PIXI.WebGLBlendModeManager.prototype.setBlendMode = function(blendMode)
|
||||
{
|
||||
if(this.currentBlendMode === blendMode)return false;
|
||||
|
||||
this.currentBlendMode = blendMode;
|
||||
|
||||
var blendModeWebGL = PIXI.blendModesWebGL[this.currentBlendMode];
|
||||
this.gl.blendFunc(blendModeWebGL[0], blendModeWebGL[1]);
|
||||
|
||||
return true;
|
||||
};
|
||||
|
||||
/**
|
||||
* Destroys this object.
|
||||
*
|
||||
* @method destroy
|
||||
*/
|
||||
PIXI.WebGLBlendModeManager.prototype.destroy = function()
|
||||
{
|
||||
this.gl = null;
|
||||
};
|
||||
428
app/Lib/Vendor/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js
vendored
Normal file
428
app/Lib/Vendor/src/pixi/renderers/webgl/utils/WebGLFastSpriteBatch.js
vendored
Normal file
|
|
@ -0,0 +1,428 @@
|
|||
/**
|
||||
* @author Mat Groves
|
||||
*
|
||||
* Big thanks to the very clever Matt DesLauriers <mattdesl> https://github.com/mattdesl/
|
||||
* for creating the original pixi version!
|
||||
*
|
||||
* Heavily inspired by LibGDX's WebGLSpriteBatch:
|
||||
* https://github.com/libgdx/libgdx/blob/master/gdx/src/com/badlogic/gdx/graphics/g2d/WebGLSpriteBatch.java
|
||||
*/
|
||||
|
||||
/**
|
||||
* @class WebGLFastSpriteBatch
|
||||
* @constructor
|
||||
*/
|
||||
PIXI.WebGLFastSpriteBatch = function(gl)
|
||||
{
|
||||
/**
|
||||
* @property vertSize
|
||||
* @type Number
|
||||
*/
|
||||
this.vertSize = 10;
|
||||
|
||||
/**
|
||||
* @property maxSize
|
||||
* @type Number
|
||||
*/
|
||||
this.maxSize = 6000;//Math.pow(2, 16) / this.vertSize;
|
||||
|
||||
/**
|
||||
* @property size
|
||||
* @type Number
|
||||
*/
|
||||
this.size = this.maxSize;
|
||||
|
||||
//the total number of floats in our batch
|
||||
var numVerts = this.size * 4 * this.vertSize;
|
||||
|
||||
//the total number of indices in our batch
|
||||
var numIndices = this.maxSize * 6;
|
||||
|
||||
/**
|
||||
* Vertex data
|
||||
* @property vertices
|
||||
* @type Float32Array
|
||||
*/
|
||||
this.vertices = new PIXI.Float32Array(numVerts);
|
||||
|
||||
/**
|
||||
* Index data
|
||||
* @property indices
|
||||
* @type Uint16Array
|
||||
*/
|
||||
this.indices = new PIXI.Uint16Array(numIndices);
|
||||
|
||||
/**
|
||||
* @property vertexBuffer
|
||||
* @type Object
|
||||
*/
|
||||
this.vertexBuffer = null;
|
||||
|
||||
/**
|
||||
* @property indexBuffer
|
||||
* @type Object
|
||||
*/
|
||||
this.indexBuffer = null;
|
||||
|
||||
/**
|
||||
* @property lastIndexCount
|
||||
* @type Number
|
||||
*/
|
||||
this.lastIndexCount = 0;
|
||||
|
||||
for (var i=0, j=0; i < numIndices; i += 6, j += 4)
|
||||
{
|
||||
this.indices[i + 0] = j + 0;
|
||||
this.indices[i + 1] = j + 1;
|
||||
this.indices[i + 2] = j + 2;
|
||||
this.indices[i + 3] = j + 0;
|
||||
this.indices[i + 4] = j + 2;
|
||||
this.indices[i + 5] = j + 3;
|
||||
}
|
||||
|
||||
/**
|
||||
* @property drawing
|
||||
* @type Boolean
|
||||
*/
|
||||
this.drawing = false;
|
||||
|
||||
/**
|
||||
* @property currentBatchSize
|
||||
* @type Number
|
||||
*/
|
||||
this.currentBatchSize = 0;
|
||||
|
||||
/**
|
||||
* @property currentBaseTexture
|
||||
* @type BaseTexture
|
||||
*/
|
||||
this.currentBaseTexture = null;
|
||||
|
||||
/**
|
||||
* @property currentBlendMode
|
||||
* @type Number
|
||||
*/
|
||||
this.currentBlendMode = 0;
|
||||
|
||||
/**
|
||||
* @property renderSession
|
||||
* @type Object
|
||||
*/
|
||||
this.renderSession = null;
|
||||
|
||||
/**
|
||||
* @property shader
|
||||
* @type Object
|
||||
*/
|
||||
this.shader = null;
|
||||
|
||||
/**
|
||||
* @property matrix
|
||||
* @type Matrix
|
||||
*/
|
||||
this.matrix = null;
|
||||
|
||||
this.setContext(gl);
|
||||
};
|
||||
|
||||
PIXI.WebGLFastSpriteBatch.prototype.constructor = PIXI.WebGLFastSpriteBatch;
|
||||
|
||||
/**
|
||||
* Sets the WebGL Context.
|
||||
*
|
||||
* @method setContext
|
||||
* @param gl {WebGLContext} the current WebGL drawing context
|
||||
*/
|
||||
PIXI.WebGLFastSpriteBatch.prototype.setContext = function(gl)
|
||||
{
|
||||
this.gl = gl;
|
||||
|
||||
// create a couple of buffers
|
||||
this.vertexBuffer = gl.createBuffer();
|
||||
this.indexBuffer = gl.createBuffer();
|
||||
|
||||
// 65535 is max index, so 65535 / 6 = 10922.
|
||||
|
||||
//upload the index data
|
||||
gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer);
|
||||
gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, this.indices, gl.STATIC_DRAW);
|
||||
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer);
|
||||
gl.bufferData(gl.ARRAY_BUFFER, this.vertices, gl.DYNAMIC_DRAW);
|
||||
};
|
||||
|
||||
/**
|
||||
* @method begin
|
||||
* @param spriteBatch {WebGLSpriteBatch}
|
||||
* @param renderSession {Object}
|
||||
*/
|
||||
PIXI.WebGLFastSpriteBatch.prototype.begin = function(spriteBatch, renderSession)
|
||||
{
|
||||
this.renderSession = renderSession;
|
||||
this.shader = this.renderSession.shaderManager.fastShader;
|
||||
|
||||
this.matrix = spriteBatch.worldTransform.toArray(true);
|
||||
|
||||
this.start();
|
||||
};
|
||||
|
||||
/**
|
||||
* @method end
|
||||
*/
|
||||
PIXI.WebGLFastSpriteBatch.prototype.end = function()
|
||||
{
|
||||
this.flush();
|
||||
};
|
||||
|
||||
/**
|
||||
* @method render
|
||||
* @param spriteBatch {WebGLSpriteBatch}
|
||||
*/
|
||||
PIXI.WebGLFastSpriteBatch.prototype.render = function(spriteBatch)
|
||||
{
|
||||
var children = spriteBatch.children;
|
||||
var sprite = children[0];
|
||||
|
||||
// if the uvs have not updated then no point rendering just yet!
|
||||
|
||||
// check texture.
|
||||
if(!sprite.texture._uvs)return;
|
||||
|
||||
this.currentBaseTexture = sprite.texture.baseTexture;
|
||||
|
||||
// check blend mode
|
||||
if(sprite.blendMode !== this.renderSession.blendModeManager.currentBlendMode)
|
||||
{
|
||||
this.flush();
|
||||
this.renderSession.blendModeManager.setBlendMode(sprite.blendMode);
|
||||
}
|
||||
|
||||
for(var i=0,j= children.length; i<j; i++)
|
||||
{
|
||||
this.renderSprite(children[i]);
|
||||
}
|
||||
|
||||
this.flush();
|
||||
};
|
||||
|
||||
/**
|
||||
* @method renderSprite
|
||||
* @param sprite {Sprite}
|
||||
*/
|
||||
PIXI.WebGLFastSpriteBatch.prototype.renderSprite = function(sprite)
|
||||
{
|
||||
//sprite = children[i];
|
||||
if(!sprite.visible)return;
|
||||
|
||||
// TODO trim??
|
||||
if(sprite.texture.baseTexture !== this.currentBaseTexture)
|
||||
{
|
||||
this.flush();
|
||||
this.currentBaseTexture = sprite.texture.baseTexture;
|
||||
|
||||
if(!sprite.texture._uvs)return;
|
||||
}
|
||||
|
||||
var uvs, verticies = this.vertices, width, height, w0, w1, h0, h1, index;
|
||||
|
||||
uvs = sprite.texture._uvs;
|
||||
|
||||
width = sprite.texture.frame.width;
|
||||
height = sprite.texture.frame.height;
|
||||
|
||||
if (sprite.texture.trim)
|
||||
{
|
||||
// if the sprite is trimmed then we need to add the extra space before transforming the sprite coords..
|
||||
var trim = sprite.texture.trim;
|
||||
|
||||
w1 = trim.x - sprite.anchor.x * trim.width;
|
||||
w0 = w1 + sprite.texture.crop.width;
|
||||
|
||||
h1 = trim.y - sprite.anchor.y * trim.height;
|
||||
h0 = h1 + sprite.texture.crop.height;
|
||||
}
|
||||
else
|
||||
{
|
||||
w0 = (sprite.texture.frame.width ) * (1-sprite.anchor.x);
|
||||
w1 = (sprite.texture.frame.width ) * -sprite.anchor.x;
|
||||
|
||||
h0 = sprite.texture.frame.height * (1-sprite.anchor.y);
|
||||
h1 = sprite.texture.frame.height * -sprite.anchor.y;
|
||||
}
|
||||
|
||||
index = this.currentBatchSize * 4 * this.vertSize;
|
||||
|
||||
// xy
|
||||
verticies[index++] = w1;
|
||||
verticies[index++] = h1;
|
||||
|
||||
verticies[index++] = sprite.position.x;
|
||||
verticies[index++] = sprite.position.y;
|
||||
|
||||
//scale
|
||||
verticies[index++] = sprite.scale.x;
|
||||
verticies[index++] = sprite.scale.y;
|
||||
|
||||
//rotation
|
||||
verticies[index++] = sprite.rotation;
|
||||
|
||||
// uv
|
||||
verticies[index++] = uvs.x0;
|
||||
verticies[index++] = uvs.y1;
|
||||
// color
|
||||
verticies[index++] = sprite.alpha;
|
||||
|
||||
|
||||
// xy
|
||||
verticies[index++] = w0;
|
||||
verticies[index++] = h1;
|
||||
|
||||
verticies[index++] = sprite.position.x;
|
||||
verticies[index++] = sprite.position.y;
|
||||
|
||||
//scale
|
||||
verticies[index++] = sprite.scale.x;
|
||||
verticies[index++] = sprite.scale.y;
|
||||
|
||||
//rotation
|
||||
verticies[index++] = sprite.rotation;
|
||||
|
||||
// uv
|
||||
verticies[index++] = uvs.x1;
|
||||
verticies[index++] = uvs.y1;
|
||||
// color
|
||||
verticies[index++] = sprite.alpha;
|
||||
|
||||
|
||||
// xy
|
||||
verticies[index++] = w0;
|
||||
verticies[index++] = h0;
|
||||
|
||||
verticies[index++] = sprite.position.x;
|
||||
verticies[index++] = sprite.position.y;
|
||||
|
||||
//scale
|
||||
verticies[index++] = sprite.scale.x;
|
||||
verticies[index++] = sprite.scale.y;
|
||||
|
||||
//rotation
|
||||
verticies[index++] = sprite.rotation;
|
||||
|
||||
// uv
|
||||
verticies[index++] = uvs.x2;
|
||||
verticies[index++] = uvs.y2;
|
||||
// color
|
||||
verticies[index++] = sprite.alpha;
|
||||
|
||||
|
||||
|
||||
|
||||
// xy
|
||||
verticies[index++] = w1;
|
||||
verticies[index++] = h0;
|
||||
|
||||
verticies[index++] = sprite.position.x;
|
||||
verticies[index++] = sprite.position.y;
|
||||
|
||||
//scale
|
||||
verticies[index++] = sprite.scale.x;
|
||||
verticies[index++] = sprite.scale.y;
|
||||
|
||||
//rotation
|
||||
verticies[index++] = sprite.rotation;
|
||||
|
||||
// uv
|
||||
verticies[index++] = uvs.x3;
|
||||
verticies[index++] = uvs.y3;
|
||||
// color
|
||||
verticies[index++] = sprite.alpha;
|
||||
|
||||
// increment the batchs
|
||||
this.currentBatchSize++;
|
||||
|
||||
if(this.currentBatchSize >= this.size)
|
||||
{
|
||||
this.flush();
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* @method flush
|
||||
*/
|
||||
PIXI.WebGLFastSpriteBatch.prototype.flush = function()
|
||||
{
|
||||
// If the batch is length 0 then return as there is nothing to draw
|
||||
if (this.currentBatchSize===0)return;
|
||||
|
||||
var gl = this.gl;
|
||||
|
||||
// bind the current texture
|
||||
|
||||
if(!this.currentBaseTexture._glTextures[gl.id])this.renderSession.renderer.updateTexture(this.currentBaseTexture, gl);
|
||||
|
||||
gl.bindTexture(gl.TEXTURE_2D, this.currentBaseTexture._glTextures[gl.id]);
|
||||
|
||||
// upload the verts to the buffer
|
||||
|
||||
if(this.currentBatchSize > ( this.size * 0.5 ) )
|
||||
{
|
||||
gl.bufferSubData(gl.ARRAY_BUFFER, 0, this.vertices);
|
||||
}
|
||||
else
|
||||
{
|
||||
var view = this.vertices.subarray(0, this.currentBatchSize * 4 * this.vertSize);
|
||||
|
||||
gl.bufferSubData(gl.ARRAY_BUFFER, 0, view);
|
||||
}
|
||||
|
||||
// now draw those suckas!
|
||||
gl.drawElements(gl.TRIANGLES, this.currentBatchSize * 6, gl.UNSIGNED_SHORT, 0);
|
||||
|
||||
// then reset the batch!
|
||||
this.currentBatchSize = 0;
|
||||
|
||||
// increment the draw count
|
||||
this.renderSession.drawCount++;
|
||||
};
|
||||
|
||||
|
||||
/**
|
||||
* @method stop
|
||||
*/
|
||||
PIXI.WebGLFastSpriteBatch.prototype.stop = function()
|
||||
{
|
||||
this.flush();
|
||||
};
|
||||
|
||||
/**
|
||||
* @method start
|
||||
*/
|
||||
PIXI.WebGLFastSpriteBatch.prototype.start = function()
|
||||
{
|
||||
var gl = this.gl;
|
||||
|
||||
// bind the main texture
|
||||
gl.activeTexture(gl.TEXTURE0);
|
||||
|
||||
// bind the buffers
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer);
|
||||
gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer);
|
||||
|
||||
// set the projection
|
||||
var projection = this.renderSession.projection;
|
||||
gl.uniform2f(this.shader.projectionVector, projection.x, projection.y);
|
||||
|
||||
// set the matrix
|
||||
gl.uniformMatrix3fv(this.shader.uMatrix, false, this.matrix);
|
||||
|
||||
// set the pointers
|
||||
var stride = this.vertSize * 4;
|
||||
|
||||
gl.vertexAttribPointer(this.shader.aVertexPosition, 2, gl.FLOAT, false, stride, 0);
|
||||
gl.vertexAttribPointer(this.shader.aPositionCoord, 2, gl.FLOAT, false, stride, 2 * 4);
|
||||
gl.vertexAttribPointer(this.shader.aScale, 2, gl.FLOAT, false, stride, 4 * 4);
|
||||
gl.vertexAttribPointer(this.shader.aRotation, 1, gl.FLOAT, false, stride, 6 * 4);
|
||||
gl.vertexAttribPointer(this.shader.aTextureCoord, 2, gl.FLOAT, false, stride, 7 * 4);
|
||||
gl.vertexAttribPointer(this.shader.colorAttribute, 1, gl.FLOAT, false, stride, 9 * 4);
|
||||
|
||||
};
|
||||
450
app/Lib/Vendor/src/pixi/renderers/webgl/utils/WebGLFilterManager.js
vendored
Normal file
450
app/Lib/Vendor/src/pixi/renderers/webgl/utils/WebGLFilterManager.js
vendored
Normal file
|
|
@ -0,0 +1,450 @@
|
|||
/**
|
||||
* @author Mat Groves http://matgroves.com/ @Doormat23
|
||||
*/
|
||||
|
||||
/**
|
||||
* @class WebGLFilterManager
|
||||
* @constructor
|
||||
*/
|
||||
PIXI.WebGLFilterManager = function()
|
||||
{
|
||||
/**
|
||||
* @property filterStack
|
||||
* @type Array
|
||||
*/
|
||||
this.filterStack = [];
|
||||
|
||||
/**
|
||||
* @property offsetX
|
||||
* @type Number
|
||||
*/
|
||||
this.offsetX = 0;
|
||||
|
||||
/**
|
||||
* @property offsetY
|
||||
* @type Number
|
||||
*/
|
||||
this.offsetY = 0;
|
||||
};
|
||||
|
||||
PIXI.WebGLFilterManager.prototype.constructor = PIXI.WebGLFilterManager;
|
||||
|
||||
/**
|
||||
* Initialises the context and the properties.
|
||||
*
|
||||
* @method setContext
|
||||
* @param gl {WebGLContext} the current WebGL drawing context
|
||||
*/
|
||||
PIXI.WebGLFilterManager.prototype.setContext = function(gl)
|
||||
{
|
||||
this.gl = gl;
|
||||
this.texturePool = [];
|
||||
|
||||
this.initShaderBuffers();
|
||||
};
|
||||
|
||||
/**
|
||||
* @method begin
|
||||
* @param renderSession {RenderSession}
|
||||
* @param buffer {ArrayBuffer}
|
||||
*/
|
||||
PIXI.WebGLFilterManager.prototype.begin = function(renderSession, buffer)
|
||||
{
|
||||
this.renderSession = renderSession;
|
||||
this.defaultShader = renderSession.shaderManager.defaultShader;
|
||||
|
||||
var projection = this.renderSession.projection;
|
||||
this.width = projection.x * 2;
|
||||
this.height = -projection.y * 2;
|
||||
this.buffer = buffer;
|
||||
};
|
||||
|
||||
/**
|
||||
* Applies the filter and adds it to the current filter stack.
|
||||
*
|
||||
* @method pushFilter
|
||||
* @param filterBlock {Object} the filter that will be pushed to the current filter stack
|
||||
*/
|
||||
PIXI.WebGLFilterManager.prototype.pushFilter = function(filterBlock)
|
||||
{
|
||||
var gl = this.gl;
|
||||
|
||||
var projection = this.renderSession.projection;
|
||||
var offset = this.renderSession.offset;
|
||||
|
||||
filterBlock._filterArea = filterBlock.target.filterArea || filterBlock.target.getBounds();
|
||||
|
||||
// filter program
|
||||
// OPTIMISATION - the first filter is free if its a simple color change?
|
||||
this.filterStack.push(filterBlock);
|
||||
|
||||
var filter = filterBlock.filterPasses[0];
|
||||
|
||||
this.offsetX += filterBlock._filterArea.x;
|
||||
this.offsetY += filterBlock._filterArea.y;
|
||||
|
||||
var texture = this.texturePool.pop();
|
||||
if(!texture)
|
||||
{
|
||||
texture = new PIXI.FilterTexture(this.gl, this.width, this.height);
|
||||
}
|
||||
else
|
||||
{
|
||||
texture.resize(this.width, this.height);
|
||||
}
|
||||
|
||||
gl.bindTexture(gl.TEXTURE_2D, texture.texture);
|
||||
|
||||
var filterArea = filterBlock._filterArea;// filterBlock.target.getBounds();///filterBlock.target.filterArea;
|
||||
|
||||
var padding = filter.padding;
|
||||
filterArea.x -= padding;
|
||||
filterArea.y -= padding;
|
||||
filterArea.width += padding * 2;
|
||||
filterArea.height += padding * 2;
|
||||
|
||||
// cap filter to screen size..
|
||||
if(filterArea.x < 0)filterArea.x = 0;
|
||||
if(filterArea.width > this.width)filterArea.width = this.width;
|
||||
if(filterArea.y < 0)filterArea.y = 0;
|
||||
if(filterArea.height > this.height)filterArea.height = this.height;
|
||||
|
||||
//gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, filterArea.width, filterArea.height, 0, gl.RGBA, gl.UNSIGNED_BYTE, null);
|
||||
gl.bindFramebuffer(gl.FRAMEBUFFER, texture.frameBuffer);
|
||||
|
||||
// set view port
|
||||
gl.viewport(0, 0, filterArea.width, filterArea.height);
|
||||
|
||||
projection.x = filterArea.width/2;
|
||||
projection.y = -filterArea.height/2;
|
||||
|
||||
offset.x = -filterArea.x;
|
||||
offset.y = -filterArea.y;
|
||||
|
||||
// update projection
|
||||
// now restore the regular shader..
|
||||
// this.renderSession.shaderManager.setShader(this.defaultShader);
|
||||
//gl.uniform2f(this.defaultShader.projectionVector, filterArea.width/2, -filterArea.height/2);
|
||||
//gl.uniform2f(this.defaultShader.offsetVector, -filterArea.x, -filterArea.y);
|
||||
|
||||
gl.colorMask(true, true, true, true);
|
||||
gl.clearColor(0,0,0, 0);
|
||||
gl.clear(gl.COLOR_BUFFER_BIT);
|
||||
|
||||
filterBlock._glFilterTexture = texture;
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
* Removes the last filter from the filter stack and doesn't return it.
|
||||
*
|
||||
* @method popFilter
|
||||
*/
|
||||
PIXI.WebGLFilterManager.prototype.popFilter = function()
|
||||
{
|
||||
var gl = this.gl;
|
||||
var filterBlock = this.filterStack.pop();
|
||||
var filterArea = filterBlock._filterArea;
|
||||
var texture = filterBlock._glFilterTexture;
|
||||
var projection = this.renderSession.projection;
|
||||
var offset = this.renderSession.offset;
|
||||
|
||||
if(filterBlock.filterPasses.length > 1)
|
||||
{
|
||||
gl.viewport(0, 0, filterArea.width, filterArea.height);
|
||||
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer);
|
||||
|
||||
this.vertexArray[0] = 0;
|
||||
this.vertexArray[1] = filterArea.height;
|
||||
|
||||
this.vertexArray[2] = filterArea.width;
|
||||
this.vertexArray[3] = filterArea.height;
|
||||
|
||||
this.vertexArray[4] = 0;
|
||||
this.vertexArray[5] = 0;
|
||||
|
||||
this.vertexArray[6] = filterArea.width;
|
||||
this.vertexArray[7] = 0;
|
||||
|
||||
gl.bufferSubData(gl.ARRAY_BUFFER, 0, this.vertexArray);
|
||||
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, this.uvBuffer);
|
||||
// now set the uvs..
|
||||
this.uvArray[2] = filterArea.width/this.width;
|
||||
this.uvArray[5] = filterArea.height/this.height;
|
||||
this.uvArray[6] = filterArea.width/this.width;
|
||||
this.uvArray[7] = filterArea.height/this.height;
|
||||
|
||||
gl.bufferSubData(gl.ARRAY_BUFFER, 0, this.uvArray);
|
||||
|
||||
var inputTexture = texture;
|
||||
var outputTexture = this.texturePool.pop();
|
||||
if(!outputTexture)outputTexture = new PIXI.FilterTexture(this.gl, this.width, this.height);
|
||||
outputTexture.resize(this.width, this.height);
|
||||
|
||||
// need to clear this FBO as it may have some left over elements from a previous filter.
|
||||
gl.bindFramebuffer(gl.FRAMEBUFFER, outputTexture.frameBuffer );
|
||||
gl.clear(gl.COLOR_BUFFER_BIT);
|
||||
|
||||
gl.disable(gl.BLEND);
|
||||
|
||||
for (var i = 0; i < filterBlock.filterPasses.length-1; i++)
|
||||
{
|
||||
var filterPass = filterBlock.filterPasses[i];
|
||||
|
||||
gl.bindFramebuffer(gl.FRAMEBUFFER, outputTexture.frameBuffer );
|
||||
|
||||
// set texture
|
||||
gl.activeTexture(gl.TEXTURE0);
|
||||
gl.bindTexture(gl.TEXTURE_2D, inputTexture.texture);
|
||||
|
||||
// draw texture..
|
||||
//filterPass.applyFilterPass(filterArea.width, filterArea.height);
|
||||
this.applyFilterPass(filterPass, filterArea, filterArea.width, filterArea.height);
|
||||
|
||||
// swap the textures..
|
||||
var temp = inputTexture;
|
||||
inputTexture = outputTexture;
|
||||
outputTexture = temp;
|
||||
}
|
||||
|
||||
gl.enable(gl.BLEND);
|
||||
|
||||
texture = inputTexture;
|
||||
this.texturePool.push(outputTexture);
|
||||
}
|
||||
|
||||
var filter = filterBlock.filterPasses[filterBlock.filterPasses.length-1];
|
||||
|
||||
this.offsetX -= filterArea.x;
|
||||
this.offsetY -= filterArea.y;
|
||||
|
||||
var sizeX = this.width;
|
||||
var sizeY = this.height;
|
||||
|
||||
var offsetX = 0;
|
||||
var offsetY = 0;
|
||||
|
||||
var buffer = this.buffer;
|
||||
|
||||
// time to render the filters texture to the previous scene
|
||||
if(this.filterStack.length === 0)
|
||||
{
|
||||
gl.colorMask(true, true, true, true);//this.transparent);
|
||||
}
|
||||
else
|
||||
{
|
||||
var currentFilter = this.filterStack[this.filterStack.length-1];
|
||||
filterArea = currentFilter._filterArea;
|
||||
|
||||
sizeX = filterArea.width;
|
||||
sizeY = filterArea.height;
|
||||
|
||||
offsetX = filterArea.x;
|
||||
offsetY = filterArea.y;
|
||||
|
||||
buffer = currentFilter._glFilterTexture.frameBuffer;
|
||||
}
|
||||
|
||||
// TODO need to remove these global elements..
|
||||
projection.x = sizeX/2;
|
||||
projection.y = -sizeY/2;
|
||||
|
||||
offset.x = offsetX;
|
||||
offset.y = offsetY;
|
||||
|
||||
filterArea = filterBlock._filterArea;
|
||||
|
||||
var x = filterArea.x-offsetX;
|
||||
var y = filterArea.y-offsetY;
|
||||
|
||||
// update the buffers..
|
||||
// make sure to flip the y!
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer);
|
||||
|
||||
this.vertexArray[0] = x;
|
||||
this.vertexArray[1] = y + filterArea.height;
|
||||
|
||||
this.vertexArray[2] = x + filterArea.width;
|
||||
this.vertexArray[3] = y + filterArea.height;
|
||||
|
||||
this.vertexArray[4] = x;
|
||||
this.vertexArray[5] = y;
|
||||
|
||||
this.vertexArray[6] = x + filterArea.width;
|
||||
this.vertexArray[7] = y;
|
||||
|
||||
gl.bufferSubData(gl.ARRAY_BUFFER, 0, this.vertexArray);
|
||||
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, this.uvBuffer);
|
||||
|
||||
this.uvArray[2] = filterArea.width/this.width;
|
||||
this.uvArray[5] = filterArea.height/this.height;
|
||||
this.uvArray[6] = filterArea.width/this.width;
|
||||
this.uvArray[7] = filterArea.height/this.height;
|
||||
|
||||
gl.bufferSubData(gl.ARRAY_BUFFER, 0, this.uvArray);
|
||||
|
||||
gl.viewport(0, 0, sizeX, sizeY);
|
||||
|
||||
// bind the buffer
|
||||
gl.bindFramebuffer(gl.FRAMEBUFFER, buffer );
|
||||
|
||||
// set the blend mode!
|
||||
//gl.blendFunc(gl.ONE, gl.ONE_MINUS_SRC_ALPHA)
|
||||
|
||||
// set texture
|
||||
gl.activeTexture(gl.TEXTURE0);
|
||||
gl.bindTexture(gl.TEXTURE_2D, texture.texture);
|
||||
|
||||
// apply!
|
||||
this.applyFilterPass(filter, filterArea, sizeX, sizeY);
|
||||
|
||||
// now restore the regular shader.. should happen automatically now..
|
||||
// this.renderSession.shaderManager.setShader(this.defaultShader);
|
||||
// gl.uniform2f(this.defaultShader.projectionVector, sizeX/2, -sizeY/2);
|
||||
// gl.uniform2f(this.defaultShader.offsetVector, -offsetX, -offsetY);
|
||||
|
||||
// return the texture to the pool
|
||||
this.texturePool.push(texture);
|
||||
filterBlock._glFilterTexture = null;
|
||||
};
|
||||
|
||||
|
||||
/**
|
||||
* Applies the filter to the specified area.
|
||||
*
|
||||
* @method applyFilterPass
|
||||
* @param filter {AbstractFilter} the filter that needs to be applied
|
||||
* @param filterArea {Texture} TODO - might need an update
|
||||
* @param width {Number} the horizontal range of the filter
|
||||
* @param height {Number} the vertical range of the filter
|
||||
*/
|
||||
PIXI.WebGLFilterManager.prototype.applyFilterPass = function(filter, filterArea, width, height)
|
||||
{
|
||||
// use program
|
||||
var gl = this.gl;
|
||||
var shader = filter.shaders[gl.id];
|
||||
|
||||
if(!shader)
|
||||
{
|
||||
shader = new PIXI.PixiShader(gl);
|
||||
|
||||
shader.fragmentSrc = filter.fragmentSrc;
|
||||
shader.uniforms = filter.uniforms;
|
||||
shader.init();
|
||||
|
||||
filter.shaders[gl.id] = shader;
|
||||
}
|
||||
|
||||
// set the shader
|
||||
this.renderSession.shaderManager.setShader(shader);
|
||||
|
||||
// gl.useProgram(shader.program);
|
||||
|
||||
gl.uniform2f(shader.projectionVector, width/2, -height/2);
|
||||
gl.uniform2f(shader.offsetVector, 0,0);
|
||||
|
||||
if(filter.uniforms.dimensions)
|
||||
{
|
||||
filter.uniforms.dimensions.value[0] = this.width;//width;
|
||||
filter.uniforms.dimensions.value[1] = this.height;//height;
|
||||
filter.uniforms.dimensions.value[2] = this.vertexArray[0];
|
||||
filter.uniforms.dimensions.value[3] = this.vertexArray[5];//filterArea.height;
|
||||
}
|
||||
|
||||
shader.syncUniforms();
|
||||
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer);
|
||||
gl.vertexAttribPointer(shader.aVertexPosition, 2, gl.FLOAT, false, 0, 0);
|
||||
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, this.uvBuffer);
|
||||
gl.vertexAttribPointer(shader.aTextureCoord, 2, gl.FLOAT, false, 0, 0);
|
||||
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, this.colorBuffer);
|
||||
gl.vertexAttribPointer(shader.colorAttribute, 2, gl.FLOAT, false, 0, 0);
|
||||
|
||||
gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer);
|
||||
|
||||
// draw the filter...
|
||||
gl.drawElements(gl.TRIANGLES, 6, gl.UNSIGNED_SHORT, 0 );
|
||||
|
||||
this.renderSession.drawCount++;
|
||||
};
|
||||
|
||||
/**
|
||||
* Initialises the shader buffers.
|
||||
*
|
||||
* @method initShaderBuffers
|
||||
*/
|
||||
PIXI.WebGLFilterManager.prototype.initShaderBuffers = function()
|
||||
{
|
||||
var gl = this.gl;
|
||||
|
||||
// create some buffers
|
||||
this.vertexBuffer = gl.createBuffer();
|
||||
this.uvBuffer = gl.createBuffer();
|
||||
this.colorBuffer = gl.createBuffer();
|
||||
this.indexBuffer = gl.createBuffer();
|
||||
|
||||
// bind and upload the vertexs..
|
||||
// keep a reference to the vertexFloatData..
|
||||
this.vertexArray = new PIXI.Float32Array([0.0, 0.0,
|
||||
1.0, 0.0,
|
||||
0.0, 1.0,
|
||||
1.0, 1.0]);
|
||||
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer);
|
||||
gl.bufferData(gl.ARRAY_BUFFER, this.vertexArray, gl.STATIC_DRAW);
|
||||
|
||||
// bind and upload the uv buffer
|
||||
this.uvArray = new PIXI.Float32Array([0.0, 0.0,
|
||||
1.0, 0.0,
|
||||
0.0, 1.0,
|
||||
1.0, 1.0]);
|
||||
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, this.uvBuffer);
|
||||
gl.bufferData(gl.ARRAY_BUFFER, this.uvArray, gl.STATIC_DRAW);
|
||||
|
||||
this.colorArray = new PIXI.Float32Array([1.0, 0xFFFFFF,
|
||||
1.0, 0xFFFFFF,
|
||||
1.0, 0xFFFFFF,
|
||||
1.0, 0xFFFFFF]);
|
||||
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, this.colorBuffer);
|
||||
gl.bufferData(gl.ARRAY_BUFFER, this.colorArray, gl.STATIC_DRAW);
|
||||
|
||||
// bind and upload the index
|
||||
gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer);
|
||||
gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Uint16Array([0, 1, 2, 1, 3, 2]), gl.STATIC_DRAW);
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
* Destroys the filter and removes it from the filter stack.
|
||||
*
|
||||
* @method destroy
|
||||
*/
|
||||
PIXI.WebGLFilterManager.prototype.destroy = function()
|
||||
{
|
||||
var gl = this.gl;
|
||||
|
||||
this.filterStack = null;
|
||||
|
||||
this.offsetX = 0;
|
||||
this.offsetY = 0;
|
||||
|
||||
// destroy textures
|
||||
for (var i = 0; i < this.texturePool.length; i++) {
|
||||
this.texturePool[i].destroy();
|
||||
}
|
||||
|
||||
this.texturePool = null;
|
||||
|
||||
//destroy buffers..
|
||||
gl.deleteBuffer(this.vertexBuffer);
|
||||
gl.deleteBuffer(this.uvBuffer);
|
||||
gl.deleteBuffer(this.colorBuffer);
|
||||
gl.deleteBuffer(this.indexBuffer);
|
||||
};
|
||||
896
app/Lib/Vendor/src/pixi/renderers/webgl/utils/WebGLGraphics.js
vendored
Normal file
896
app/Lib/Vendor/src/pixi/renderers/webgl/utils/WebGLGraphics.js
vendored
Normal file
|
|
@ -0,0 +1,896 @@
|
|||
/**
|
||||
* @author Mat Groves http://matgroves.com/ @Doormat23
|
||||
*/
|
||||
|
||||
/**
|
||||
* A set of functions used by the webGL renderer to draw the primitive graphics data
|
||||
*
|
||||
* @class WebGLGraphics
|
||||
* @private
|
||||
* @static
|
||||
*/
|
||||
PIXI.WebGLGraphics = function()
|
||||
{
|
||||
};
|
||||
|
||||
/**
|
||||
* Renders the graphics object
|
||||
*
|
||||
* @static
|
||||
* @private
|
||||
* @method renderGraphics
|
||||
* @param graphics {Graphics}
|
||||
* @param renderSession {Object}
|
||||
*/
|
||||
PIXI.WebGLGraphics.renderGraphics = function(graphics, renderSession)//projection, offset)
|
||||
{
|
||||
var gl = renderSession.gl;
|
||||
var projection = renderSession.projection,
|
||||
offset = renderSession.offset,
|
||||
shader = renderSession.shaderManager.primitiveShader,
|
||||
webGLData;
|
||||
|
||||
if(graphics.dirty)
|
||||
{
|
||||
PIXI.WebGLGraphics.updateGraphics(graphics, gl);
|
||||
}
|
||||
|
||||
var webGL = graphics._webGL[gl.id];
|
||||
|
||||
// This could be speeded up for sure!
|
||||
|
||||
for (var i = 0; i < webGL.data.length; i++)
|
||||
{
|
||||
if(webGL.data[i].mode === 1)
|
||||
{
|
||||
webGLData = webGL.data[i];
|
||||
|
||||
renderSession.stencilManager.pushStencil(graphics, webGLData, renderSession);
|
||||
|
||||
// render quad..
|
||||
gl.drawElements(gl.TRIANGLE_FAN, 4, gl.UNSIGNED_SHORT, ( webGLData.indices.length - 4 ) * 2 );
|
||||
|
||||
renderSession.stencilManager.popStencil(graphics, webGLData, renderSession);
|
||||
}
|
||||
else
|
||||
{
|
||||
webGLData = webGL.data[i];
|
||||
|
||||
|
||||
renderSession.shaderManager.setShader( shader );//activatePrimitiveShader();
|
||||
shader = renderSession.shaderManager.primitiveShader;
|
||||
gl.uniformMatrix3fv(shader.translationMatrix, false, graphics.worldTransform.toArray(true));
|
||||
|
||||
gl.uniform1f(shader.flipY, 1);
|
||||
|
||||
gl.uniform2f(shader.projectionVector, projection.x, -projection.y);
|
||||
gl.uniform2f(shader.offsetVector, -offset.x, -offset.y);
|
||||
|
||||
gl.uniform3fv(shader.tintColor, PIXI.hex2rgb(graphics.tint));
|
||||
|
||||
gl.uniform1f(shader.alpha, graphics.worldAlpha);
|
||||
|
||||
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, webGLData.buffer);
|
||||
|
||||
gl.vertexAttribPointer(shader.aVertexPosition, 2, gl.FLOAT, false, 4 * 6, 0);
|
||||
gl.vertexAttribPointer(shader.colorAttribute, 4, gl.FLOAT, false,4 * 6, 2 * 4);
|
||||
|
||||
// set the index buffer!
|
||||
gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, webGLData.indexBuffer);
|
||||
gl.drawElements(gl.TRIANGLE_STRIP, webGLData.indices.length, gl.UNSIGNED_SHORT, 0 );
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Updates the graphics object
|
||||
*
|
||||
* @static
|
||||
* @private
|
||||
* @method updateGraphics
|
||||
* @param graphicsData {Graphics} The graphics object to update
|
||||
* @param gl {WebGLContext} the current WebGL drawing context
|
||||
*/
|
||||
PIXI.WebGLGraphics.updateGraphics = function(graphics, gl)
|
||||
{
|
||||
// get the contexts graphics object
|
||||
var webGL = graphics._webGL[gl.id];
|
||||
// if the graphics object does not exist in the webGL context time to create it!
|
||||
if(!webGL)webGL = graphics._webGL[gl.id] = {lastIndex:0, data:[], gl:gl};
|
||||
|
||||
// flag the graphics as not dirty as we are about to update it...
|
||||
graphics.dirty = false;
|
||||
|
||||
var i;
|
||||
|
||||
// if the user cleared the graphics object we will need to clear every object
|
||||
if(graphics.clearDirty)
|
||||
{
|
||||
graphics.clearDirty = false;
|
||||
|
||||
// lop through and return all the webGLDatas to the object pool so than can be reused later on
|
||||
for (i = 0; i < webGL.data.length; i++)
|
||||
{
|
||||
var graphicsData = webGL.data[i];
|
||||
graphicsData.reset();
|
||||
PIXI.WebGLGraphics.graphicsDataPool.push( graphicsData );
|
||||
}
|
||||
|
||||
// clear the array and reset the index..
|
||||
webGL.data = [];
|
||||
webGL.lastIndex = 0;
|
||||
}
|
||||
|
||||
var webGLData;
|
||||
|
||||
// loop through the graphics datas and construct each one..
|
||||
// if the object is a complex fill then the new stencil buffer technique will be used
|
||||
// other wise graphics objects will be pushed into a batch..
|
||||
for (i = webGL.lastIndex; i < graphics.graphicsData.length; i++)
|
||||
{
|
||||
var data = graphics.graphicsData[i];
|
||||
|
||||
if(data.type === PIXI.Graphics.POLY)
|
||||
{
|
||||
// need to add the points the the graphics object..
|
||||
data.points = data.shape.points.slice();
|
||||
if(data.shape.closed)
|
||||
{
|
||||
// close the poly if the value is true!
|
||||
if(data.points[0] !== data.points[data.points.length-2] || data.points[1] !== data.points[data.points.length-1])
|
||||
{
|
||||
data.points.push(data.points[0], data.points[1]);
|
||||
}
|
||||
}
|
||||
|
||||
// MAKE SURE WE HAVE THE CORRECT TYPE..
|
||||
if(data.fill)
|
||||
{
|
||||
if(data.points.length >= 6)
|
||||
{
|
||||
if(data.points.length < 6 * 2)
|
||||
{
|
||||
webGLData = PIXI.WebGLGraphics.switchMode(webGL, 0);
|
||||
|
||||
var canDrawUsingSimple = PIXI.WebGLGraphics.buildPoly(data, webGLData);
|
||||
// console.log(canDrawUsingSimple);
|
||||
|
||||
if(!canDrawUsingSimple)
|
||||
{
|
||||
// console.log("<>>>")
|
||||
webGLData = PIXI.WebGLGraphics.switchMode(webGL, 1);
|
||||
PIXI.WebGLGraphics.buildComplexPoly(data, webGLData);
|
||||
}
|
||||
|
||||
}
|
||||
else
|
||||
{
|
||||
webGLData = PIXI.WebGLGraphics.switchMode(webGL, 1);
|
||||
PIXI.WebGLGraphics.buildComplexPoly(data, webGLData);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if(data.lineWidth > 0)
|
||||
{
|
||||
webGLData = PIXI.WebGLGraphics.switchMode(webGL, 0);
|
||||
PIXI.WebGLGraphics.buildLine(data, webGLData);
|
||||
|
||||
}
|
||||
}
|
||||
else
|
||||
{
|
||||
webGLData = PIXI.WebGLGraphics.switchMode(webGL, 0);
|
||||
|
||||
if(data.type === PIXI.Graphics.RECT)
|
||||
{
|
||||
PIXI.WebGLGraphics.buildRectangle(data, webGLData);
|
||||
}
|
||||
else if(data.type === PIXI.Graphics.CIRC || data.type === PIXI.Graphics.ELIP)
|
||||
{
|
||||
PIXI.WebGLGraphics.buildCircle(data, webGLData);
|
||||
}
|
||||
else if(data.type === PIXI.Graphics.RREC)
|
||||
{
|
||||
PIXI.WebGLGraphics.buildRoundedRectangle(data, webGLData);
|
||||
}
|
||||
}
|
||||
|
||||
webGL.lastIndex++;
|
||||
}
|
||||
|
||||
// upload all the dirty data...
|
||||
for (i = 0; i < webGL.data.length; i++)
|
||||
{
|
||||
webGLData = webGL.data[i];
|
||||
if(webGLData.dirty)webGLData.upload();
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* @static
|
||||
* @private
|
||||
* @method switchMode
|
||||
* @param webGL {WebGLContext}
|
||||
* @param type {Number}
|
||||
*/
|
||||
PIXI.WebGLGraphics.switchMode = function(webGL, type)
|
||||
{
|
||||
var webGLData;
|
||||
|
||||
if(!webGL.data.length)
|
||||
{
|
||||
webGLData = PIXI.WebGLGraphics.graphicsDataPool.pop() || new PIXI.WebGLGraphicsData(webGL.gl);
|
||||
webGLData.mode = type;
|
||||
webGL.data.push(webGLData);
|
||||
}
|
||||
else
|
||||
{
|
||||
webGLData = webGL.data[webGL.data.length-1];
|
||||
|
||||
if(webGLData.mode !== type || type === 1)
|
||||
{
|
||||
webGLData = PIXI.WebGLGraphics.graphicsDataPool.pop() || new PIXI.WebGLGraphicsData(webGL.gl);
|
||||
webGLData.mode = type;
|
||||
webGL.data.push(webGLData);
|
||||
}
|
||||
}
|
||||
|
||||
webGLData.dirty = true;
|
||||
|
||||
return webGLData;
|
||||
};
|
||||
|
||||
/**
|
||||
* Builds a rectangle to draw
|
||||
*
|
||||
* @static
|
||||
* @private
|
||||
* @method buildRectangle
|
||||
* @param graphicsData {Graphics} The graphics object containing all the necessary properties
|
||||
* @param webGLData {Object}
|
||||
*/
|
||||
PIXI.WebGLGraphics.buildRectangle = function(graphicsData, webGLData)
|
||||
{
|
||||
// --- //
|
||||
// need to convert points to a nice regular data
|
||||
//
|
||||
var rectData = graphicsData.shape;
|
||||
var x = rectData.x;
|
||||
var y = rectData.y;
|
||||
var width = rectData.width;
|
||||
var height = rectData.height;
|
||||
|
||||
if(graphicsData.fill)
|
||||
{
|
||||
var color = PIXI.hex2rgb(graphicsData.fillColor);
|
||||
var alpha = graphicsData.fillAlpha;
|
||||
|
||||
var r = color[0] * alpha;
|
||||
var g = color[1] * alpha;
|
||||
var b = color[2] * alpha;
|
||||
|
||||
var verts = webGLData.points;
|
||||
var indices = webGLData.indices;
|
||||
|
||||
var vertPos = verts.length/6;
|
||||
|
||||
// start
|
||||
verts.push(x, y);
|
||||
verts.push(r, g, b, alpha);
|
||||
|
||||
verts.push(x + width, y);
|
||||
verts.push(r, g, b, alpha);
|
||||
|
||||
verts.push(x , y + height);
|
||||
verts.push(r, g, b, alpha);
|
||||
|
||||
verts.push(x + width, y + height);
|
||||
verts.push(r, g, b, alpha);
|
||||
|
||||
// insert 2 dead triangles..
|
||||
indices.push(vertPos, vertPos, vertPos+1, vertPos+2, vertPos+3, vertPos+3);
|
||||
}
|
||||
|
||||
if(graphicsData.lineWidth)
|
||||
{
|
||||
var tempPoints = graphicsData.points;
|
||||
|
||||
graphicsData.points = [x, y,
|
||||
x + width, y,
|
||||
x + width, y + height,
|
||||
x, y + height,
|
||||
x, y];
|
||||
|
||||
|
||||
PIXI.WebGLGraphics.buildLine(graphicsData, webGLData);
|
||||
|
||||
graphicsData.points = tempPoints;
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Builds a rounded rectangle to draw
|
||||
*
|
||||
* @static
|
||||
* @private
|
||||
* @method buildRoundedRectangle
|
||||
* @param graphicsData {Graphics} The graphics object containing all the necessary properties
|
||||
* @param webGLData {Object}
|
||||
*/
|
||||
PIXI.WebGLGraphics.buildRoundedRectangle = function(graphicsData, webGLData)
|
||||
{
|
||||
var rrectData = graphicsData.shape;
|
||||
var x = rrectData.x;
|
||||
var y = rrectData.y;
|
||||
var width = rrectData.width;
|
||||
var height = rrectData.height;
|
||||
|
||||
var radius = rrectData.radius;
|
||||
|
||||
var recPoints = [];
|
||||
recPoints.push(x, y + radius);
|
||||
recPoints = recPoints.concat(PIXI.WebGLGraphics.quadraticBezierCurve(x, y + height - radius, x, y + height, x + radius, y + height));
|
||||
recPoints = recPoints.concat(PIXI.WebGLGraphics.quadraticBezierCurve(x + width - radius, y + height, x + width, y + height, x + width, y + height - radius));
|
||||
recPoints = recPoints.concat(PIXI.WebGLGraphics.quadraticBezierCurve(x + width, y + radius, x + width, y, x + width - radius, y));
|
||||
recPoints = recPoints.concat(PIXI.WebGLGraphics.quadraticBezierCurve(x + radius, y, x, y, x, y + radius));
|
||||
|
||||
if (graphicsData.fill) {
|
||||
var color = PIXI.hex2rgb(graphicsData.fillColor);
|
||||
var alpha = graphicsData.fillAlpha;
|
||||
|
||||
var r = color[0] * alpha;
|
||||
var g = color[1] * alpha;
|
||||
var b = color[2] * alpha;
|
||||
|
||||
var verts = webGLData.points;
|
||||
var indices = webGLData.indices;
|
||||
|
||||
var vecPos = verts.length/6;
|
||||
|
||||
var triangles = PIXI.PolyK.Triangulate(recPoints);
|
||||
|
||||
//
|
||||
|
||||
var i = 0;
|
||||
for (i = 0; i < triangles.length; i+=3)
|
||||
{
|
||||
indices.push(triangles[i] + vecPos);
|
||||
indices.push(triangles[i] + vecPos);
|
||||
indices.push(triangles[i+1] + vecPos);
|
||||
indices.push(triangles[i+2] + vecPos);
|
||||
indices.push(triangles[i+2] + vecPos);
|
||||
}
|
||||
|
||||
|
||||
for (i = 0; i < recPoints.length; i++)
|
||||
{
|
||||
verts.push(recPoints[i], recPoints[++i], r, g, b, alpha);
|
||||
}
|
||||
}
|
||||
|
||||
if (graphicsData.lineWidth) {
|
||||
var tempPoints = graphicsData.points;
|
||||
|
||||
graphicsData.points = recPoints;
|
||||
|
||||
PIXI.WebGLGraphics.buildLine(graphicsData, webGLData);
|
||||
|
||||
graphicsData.points = tempPoints;
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Calculate the points for a quadratic bezier curve. (helper function..)
|
||||
* Based on: https://stackoverflow.com/questions/785097/how-do-i-implement-a-bezier-curve-in-c
|
||||
*
|
||||
* @static
|
||||
* @private
|
||||
* @method quadraticBezierCurve
|
||||
* @param fromX {Number} Origin point x
|
||||
* @param fromY {Number} Origin point x
|
||||
* @param cpX {Number} Control point x
|
||||
* @param cpY {Number} Control point y
|
||||
* @param toX {Number} Destination point x
|
||||
* @param toY {Number} Destination point y
|
||||
* @return {Array(Number)}
|
||||
*/
|
||||
PIXI.WebGLGraphics.quadraticBezierCurve = function(fromX, fromY, cpX, cpY, toX, toY) {
|
||||
|
||||
var xa,
|
||||
ya,
|
||||
xb,
|
||||
yb,
|
||||
x,
|
||||
y,
|
||||
n = 20,
|
||||
points = [];
|
||||
|
||||
function getPt(n1 , n2, perc) {
|
||||
var diff = n2 - n1;
|
||||
|
||||
return n1 + ( diff * perc );
|
||||
}
|
||||
|
||||
var j = 0;
|
||||
for (var i = 0; i <= n; i++ )
|
||||
{
|
||||
j = i / n;
|
||||
|
||||
// The Green Line
|
||||
xa = getPt( fromX , cpX , j );
|
||||
ya = getPt( fromY , cpY , j );
|
||||
xb = getPt( cpX , toX , j );
|
||||
yb = getPt( cpY , toY , j );
|
||||
|
||||
// The Black Dot
|
||||
x = getPt( xa , xb , j );
|
||||
y = getPt( ya , yb , j );
|
||||
|
||||
points.push(x, y);
|
||||
}
|
||||
return points;
|
||||
};
|
||||
|
||||
/**
|
||||
* Builds a circle to draw
|
||||
*
|
||||
* @static
|
||||
* @private
|
||||
* @method buildCircle
|
||||
* @param graphicsData {Graphics} The graphics object to draw
|
||||
* @param webGLData {Object}
|
||||
*/
|
||||
PIXI.WebGLGraphics.buildCircle = function(graphicsData, webGLData)
|
||||
{
|
||||
// need to convert points to a nice regular data
|
||||
var circleData = graphicsData.shape;
|
||||
var x = circleData.x;
|
||||
var y = circleData.y;
|
||||
var width;
|
||||
var height;
|
||||
|
||||
// TODO - bit hacky??
|
||||
if(graphicsData.type === PIXI.Graphics.CIRC)
|
||||
{
|
||||
width = circleData.radius;
|
||||
height = circleData.radius;
|
||||
}
|
||||
else
|
||||
{
|
||||
width = circleData.width;
|
||||
height = circleData.height;
|
||||
}
|
||||
|
||||
var totalSegs = 40;
|
||||
var seg = (Math.PI * 2) / totalSegs ;
|
||||
|
||||
var i = 0;
|
||||
|
||||
if(graphicsData.fill)
|
||||
{
|
||||
var color = PIXI.hex2rgb(graphicsData.fillColor);
|
||||
var alpha = graphicsData.fillAlpha;
|
||||
|
||||
var r = color[0] * alpha;
|
||||
var g = color[1] * alpha;
|
||||
var b = color[2] * alpha;
|
||||
|
||||
var verts = webGLData.points;
|
||||
var indices = webGLData.indices;
|
||||
|
||||
var vecPos = verts.length/6;
|
||||
|
||||
indices.push(vecPos);
|
||||
|
||||
for (i = 0; i < totalSegs + 1 ; i++)
|
||||
{
|
||||
verts.push(x,y, r, g, b, alpha);
|
||||
|
||||
verts.push(x + Math.sin(seg * i) * width,
|
||||
y + Math.cos(seg * i) * height,
|
||||
r, g, b, alpha);
|
||||
|
||||
indices.push(vecPos++, vecPos++);
|
||||
}
|
||||
|
||||
indices.push(vecPos-1);
|
||||
}
|
||||
|
||||
if(graphicsData.lineWidth)
|
||||
{
|
||||
var tempPoints = graphicsData.points;
|
||||
|
||||
graphicsData.points = [];
|
||||
|
||||
for (i = 0; i < totalSegs + 1; i++)
|
||||
{
|
||||
graphicsData.points.push(x + Math.sin(seg * i) * width,
|
||||
y + Math.cos(seg * i) * height);
|
||||
}
|
||||
|
||||
PIXI.WebGLGraphics.buildLine(graphicsData, webGLData);
|
||||
|
||||
graphicsData.points = tempPoints;
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Builds a line to draw
|
||||
*
|
||||
* @static
|
||||
* @private
|
||||
* @method buildLine
|
||||
* @param graphicsData {Graphics} The graphics object containing all the necessary properties
|
||||
* @param webGLData {Object}
|
||||
*/
|
||||
PIXI.WebGLGraphics.buildLine = function(graphicsData, webGLData)
|
||||
{
|
||||
// TODO OPTIMISE!
|
||||
var i = 0;
|
||||
var points = graphicsData.points;
|
||||
if(points.length === 0)return;
|
||||
|
||||
// if the line width is an odd number add 0.5 to align to a whole pixel
|
||||
if(graphicsData.lineWidth%2)
|
||||
{
|
||||
for (i = 0; i < points.length; i++) {
|
||||
points[i] += 0.5;
|
||||
}
|
||||
}
|
||||
|
||||
// get first and last point.. figure out the middle!
|
||||
var firstPoint = new PIXI.Point( points[0], points[1] );
|
||||
var lastPoint = new PIXI.Point( points[points.length - 2], points[points.length - 1] );
|
||||
|
||||
// if the first point is the last point - gonna have issues :)
|
||||
if(firstPoint.x === lastPoint.x && firstPoint.y === lastPoint.y)
|
||||
{
|
||||
// need to clone as we are going to slightly modify the shape..
|
||||
points = points.slice();
|
||||
|
||||
points.pop();
|
||||
points.pop();
|
||||
|
||||
lastPoint = new PIXI.Point( points[points.length - 2], points[points.length - 1] );
|
||||
|
||||
var midPointX = lastPoint.x + (firstPoint.x - lastPoint.x) *0.5;
|
||||
var midPointY = lastPoint.y + (firstPoint.y - lastPoint.y) *0.5;
|
||||
|
||||
points.unshift(midPointX, midPointY);
|
||||
points.push(midPointX, midPointY);
|
||||
}
|
||||
|
||||
var verts = webGLData.points;
|
||||
var indices = webGLData.indices;
|
||||
var length = points.length / 2;
|
||||
var indexCount = points.length;
|
||||
var indexStart = verts.length/6;
|
||||
|
||||
// DRAW the Line
|
||||
var width = graphicsData.lineWidth / 2;
|
||||
|
||||
// sort color
|
||||
var color = PIXI.hex2rgb(graphicsData.lineColor);
|
||||
var alpha = graphicsData.lineAlpha;
|
||||
var r = color[0] * alpha;
|
||||
var g = color[1] * alpha;
|
||||
var b = color[2] * alpha;
|
||||
|
||||
var px, py, p1x, p1y, p2x, p2y, p3x, p3y;
|
||||
var perpx, perpy, perp2x, perp2y, perp3x, perp3y;
|
||||
var a1, b1, c1, a2, b2, c2;
|
||||
var denom, pdist, dist;
|
||||
|
||||
p1x = points[0];
|
||||
p1y = points[1];
|
||||
|
||||
p2x = points[2];
|
||||
p2y = points[3];
|
||||
|
||||
perpx = -(p1y - p2y);
|
||||
perpy = p1x - p2x;
|
||||
|
||||
dist = Math.sqrt(perpx*perpx + perpy*perpy);
|
||||
|
||||
perpx /= dist;
|
||||
perpy /= dist;
|
||||
perpx *= width;
|
||||
perpy *= width;
|
||||
|
||||
// start
|
||||
verts.push(p1x - perpx , p1y - perpy,
|
||||
r, g, b, alpha);
|
||||
|
||||
verts.push(p1x + perpx , p1y + perpy,
|
||||
r, g, b, alpha);
|
||||
|
||||
for (i = 1; i < length-1; i++)
|
||||
{
|
||||
p1x = points[(i-1)*2];
|
||||
p1y = points[(i-1)*2 + 1];
|
||||
|
||||
p2x = points[(i)*2];
|
||||
p2y = points[(i)*2 + 1];
|
||||
|
||||
p3x = points[(i+1)*2];
|
||||
p3y = points[(i+1)*2 + 1];
|
||||
|
||||
perpx = -(p1y - p2y);
|
||||
perpy = p1x - p2x;
|
||||
|
||||
dist = Math.sqrt(perpx*perpx + perpy*perpy);
|
||||
perpx /= dist;
|
||||
perpy /= dist;
|
||||
perpx *= width;
|
||||
perpy *= width;
|
||||
|
||||
perp2x = -(p2y - p3y);
|
||||
perp2y = p2x - p3x;
|
||||
|
||||
dist = Math.sqrt(perp2x*perp2x + perp2y*perp2y);
|
||||
perp2x /= dist;
|
||||
perp2y /= dist;
|
||||
perp2x *= width;
|
||||
perp2y *= width;
|
||||
|
||||
a1 = (-perpy + p1y) - (-perpy + p2y);
|
||||
b1 = (-perpx + p2x) - (-perpx + p1x);
|
||||
c1 = (-perpx + p1x) * (-perpy + p2y) - (-perpx + p2x) * (-perpy + p1y);
|
||||
a2 = (-perp2y + p3y) - (-perp2y + p2y);
|
||||
b2 = (-perp2x + p2x) - (-perp2x + p3x);
|
||||
c2 = (-perp2x + p3x) * (-perp2y + p2y) - (-perp2x + p2x) * (-perp2y + p3y);
|
||||
|
||||
denom = a1*b2 - a2*b1;
|
||||
|
||||
if(Math.abs(denom) < 0.1 )
|
||||
{
|
||||
|
||||
denom+=10.1;
|
||||
verts.push(p2x - perpx , p2y - perpy,
|
||||
r, g, b, alpha);
|
||||
|
||||
verts.push(p2x + perpx , p2y + perpy,
|
||||
r, g, b, alpha);
|
||||
|
||||
continue;
|
||||
}
|
||||
|
||||
px = (b1*c2 - b2*c1)/denom;
|
||||
py = (a2*c1 - a1*c2)/denom;
|
||||
|
||||
|
||||
pdist = (px -p2x) * (px -p2x) + (py -p2y) + (py -p2y);
|
||||
|
||||
|
||||
if(pdist > 140 * 140)
|
||||
{
|
||||
perp3x = perpx - perp2x;
|
||||
perp3y = perpy - perp2y;
|
||||
|
||||
dist = Math.sqrt(perp3x*perp3x + perp3y*perp3y);
|
||||
perp3x /= dist;
|
||||
perp3y /= dist;
|
||||
perp3x *= width;
|
||||
perp3y *= width;
|
||||
|
||||
verts.push(p2x - perp3x, p2y -perp3y);
|
||||
verts.push(r, g, b, alpha);
|
||||
|
||||
verts.push(p2x + perp3x, p2y +perp3y);
|
||||
verts.push(r, g, b, alpha);
|
||||
|
||||
verts.push(p2x - perp3x, p2y -perp3y);
|
||||
verts.push(r, g, b, alpha);
|
||||
|
||||
indexCount++;
|
||||
}
|
||||
else
|
||||
{
|
||||
|
||||
verts.push(px , py);
|
||||
verts.push(r, g, b, alpha);
|
||||
|
||||
verts.push(p2x - (px-p2x), p2y - (py - p2y));
|
||||
verts.push(r, g, b, alpha);
|
||||
}
|
||||
}
|
||||
|
||||
p1x = points[(length-2)*2];
|
||||
p1y = points[(length-2)*2 + 1];
|
||||
|
||||
p2x = points[(length-1)*2];
|
||||
p2y = points[(length-1)*2 + 1];
|
||||
|
||||
perpx = -(p1y - p2y);
|
||||
perpy = p1x - p2x;
|
||||
|
||||
dist = Math.sqrt(perpx*perpx + perpy*perpy);
|
||||
perpx /= dist;
|
||||
perpy /= dist;
|
||||
perpx *= width;
|
||||
perpy *= width;
|
||||
|
||||
verts.push(p2x - perpx , p2y - perpy);
|
||||
verts.push(r, g, b, alpha);
|
||||
|
||||
verts.push(p2x + perpx , p2y + perpy);
|
||||
verts.push(r, g, b, alpha);
|
||||
|
||||
indices.push(indexStart);
|
||||
|
||||
for (i = 0; i < indexCount; i++)
|
||||
{
|
||||
indices.push(indexStart++);
|
||||
}
|
||||
|
||||
indices.push(indexStart-1);
|
||||
};
|
||||
|
||||
/**
|
||||
* Builds a complex polygon to draw
|
||||
*
|
||||
* @static
|
||||
* @private
|
||||
* @method buildComplexPoly
|
||||
* @param graphicsData {Graphics} The graphics object containing all the necessary properties
|
||||
* @param webGLData {Object}
|
||||
*/
|
||||
PIXI.WebGLGraphics.buildComplexPoly = function(graphicsData, webGLData)
|
||||
{
|
||||
//TODO - no need to copy this as it gets turned into a FLoat32Array anyways..
|
||||
var points = graphicsData.points.slice();
|
||||
if(points.length < 6)return;
|
||||
|
||||
// get first and last point.. figure out the middle!
|
||||
var indices = webGLData.indices;
|
||||
webGLData.points = points;
|
||||
webGLData.alpha = graphicsData.fillAlpha;
|
||||
webGLData.color = PIXI.hex2rgb(graphicsData.fillColor);
|
||||
|
||||
/*
|
||||
calclate the bounds..
|
||||
*/
|
||||
var minX = Infinity;
|
||||
var maxX = -Infinity;
|
||||
|
||||
var minY = Infinity;
|
||||
var maxY = -Infinity;
|
||||
|
||||
var x,y;
|
||||
|
||||
// get size..
|
||||
for (var i = 0; i < points.length; i+=2)
|
||||
{
|
||||
x = points[i];
|
||||
y = points[i+1];
|
||||
|
||||
minX = x < minX ? x : minX;
|
||||
maxX = x > maxX ? x : maxX;
|
||||
|
||||
minY = y < minY ? y : minY;
|
||||
maxY = y > maxY ? y : maxY;
|
||||
}
|
||||
|
||||
// add a quad to the end cos there is no point making another buffer!
|
||||
points.push(minX, minY,
|
||||
maxX, minY,
|
||||
maxX, maxY,
|
||||
minX, maxY);
|
||||
|
||||
// push a quad onto the end..
|
||||
|
||||
//TODO - this aint needed!
|
||||
var length = points.length / 2;
|
||||
for (i = 0; i < length; i++)
|
||||
{
|
||||
indices.push( i );
|
||||
}
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
* Builds a polygon to draw
|
||||
*
|
||||
* @static
|
||||
* @private
|
||||
* @method buildPoly
|
||||
* @param graphicsData {Graphics} The graphics object containing all the necessary properties
|
||||
* @param webGLData {Object}
|
||||
*/
|
||||
PIXI.WebGLGraphics.buildPoly = function(graphicsData, webGLData)
|
||||
{
|
||||
var points = graphicsData.points;
|
||||
|
||||
if(points.length < 6)return;
|
||||
// get first and last point.. figure out the middle!
|
||||
var verts = webGLData.points;
|
||||
var indices = webGLData.indices;
|
||||
|
||||
var length = points.length / 2;
|
||||
|
||||
// sort color
|
||||
var color = PIXI.hex2rgb(graphicsData.fillColor);
|
||||
var alpha = graphicsData.fillAlpha;
|
||||
var r = color[0] * alpha;
|
||||
var g = color[1] * alpha;
|
||||
var b = color[2] * alpha;
|
||||
|
||||
var triangles = PIXI.PolyK.Triangulate(points);
|
||||
|
||||
if(!triangles)return false;
|
||||
|
||||
var vertPos = verts.length / 6;
|
||||
|
||||
var i = 0;
|
||||
|
||||
for (i = 0; i < triangles.length; i+=3)
|
||||
{
|
||||
indices.push(triangles[i] + vertPos);
|
||||
indices.push(triangles[i] + vertPos);
|
||||
indices.push(triangles[i+1] + vertPos);
|
||||
indices.push(triangles[i+2] +vertPos);
|
||||
indices.push(triangles[i+2] + vertPos);
|
||||
}
|
||||
|
||||
for (i = 0; i < length; i++)
|
||||
{
|
||||
verts.push(points[i * 2], points[i * 2 + 1],
|
||||
r, g, b, alpha);
|
||||
}
|
||||
|
||||
return true;
|
||||
};
|
||||
|
||||
PIXI.WebGLGraphics.graphicsDataPool = [];
|
||||
|
||||
/**
|
||||
* @class WebGLGraphicsData
|
||||
* @private
|
||||
* @static
|
||||
*/
|
||||
PIXI.WebGLGraphicsData = function(gl)
|
||||
{
|
||||
this.gl = gl;
|
||||
|
||||
//TODO does this need to be split before uploding??
|
||||
this.color = [0,0,0]; // color split!
|
||||
this.points = [];
|
||||
this.indices = [];
|
||||
this.buffer = gl.createBuffer();
|
||||
this.indexBuffer = gl.createBuffer();
|
||||
this.mode = 1;
|
||||
this.alpha = 1;
|
||||
this.dirty = true;
|
||||
};
|
||||
|
||||
/**
|
||||
* @method reset
|
||||
*/
|
||||
PIXI.WebGLGraphicsData.prototype.reset = function()
|
||||
{
|
||||
this.points = [];
|
||||
this.indices = [];
|
||||
};
|
||||
|
||||
/**
|
||||
* @method upload
|
||||
*/
|
||||
PIXI.WebGLGraphicsData.prototype.upload = function()
|
||||
{
|
||||
var gl = this.gl;
|
||||
|
||||
// this.lastIndex = graphics.graphicsData.length;
|
||||
this.glPoints = new PIXI.Float32Array(this.points);
|
||||
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, this.buffer);
|
||||
gl.bufferData(gl.ARRAY_BUFFER, this.glPoints, gl.STATIC_DRAW);
|
||||
|
||||
this.glIndicies = new PIXI.Uint16Array(this.indices);
|
||||
|
||||
gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer);
|
||||
gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, this.glIndicies, gl.STATIC_DRAW);
|
||||
|
||||
this.dirty = false;
|
||||
};
|
||||
69
app/Lib/Vendor/src/pixi/renderers/webgl/utils/WebGLMaskManager.js
vendored
Normal file
69
app/Lib/Vendor/src/pixi/renderers/webgl/utils/WebGLMaskManager.js
vendored
Normal file
|
|
@ -0,0 +1,69 @@
|
|||
/**
|
||||
* @author Mat Groves http://matgroves.com/ @Doormat23
|
||||
*/
|
||||
|
||||
/**
|
||||
* @class WebGLMaskManager
|
||||
* @constructor
|
||||
* @private
|
||||
*/
|
||||
PIXI.WebGLMaskManager = function()
|
||||
{
|
||||
};
|
||||
|
||||
PIXI.WebGLMaskManager.prototype.constructor = PIXI.WebGLMaskManager;
|
||||
|
||||
/**
|
||||
* Sets the drawing context to the one given in parameter.
|
||||
*
|
||||
* @method setContext
|
||||
* @param gl {WebGLContext} the current WebGL drawing context
|
||||
*/
|
||||
PIXI.WebGLMaskManager.prototype.setContext = function(gl)
|
||||
{
|
||||
this.gl = gl;
|
||||
};
|
||||
|
||||
/**
|
||||
* Applies the Mask and adds it to the current filter stack.
|
||||
*
|
||||
* @method pushMask
|
||||
* @param maskData {Array}
|
||||
* @param renderSession {Object}
|
||||
*/
|
||||
PIXI.WebGLMaskManager.prototype.pushMask = function(maskData, renderSession)
|
||||
{
|
||||
var gl = renderSession.gl;
|
||||
|
||||
if(maskData.dirty)
|
||||
{
|
||||
PIXI.WebGLGraphics.updateGraphics(maskData, gl);
|
||||
}
|
||||
|
||||
if(!maskData._webGL[gl.id].data.length)return;
|
||||
|
||||
renderSession.stencilManager.pushStencil(maskData, maskData._webGL[gl.id].data[0], renderSession);
|
||||
};
|
||||
|
||||
/**
|
||||
* Removes the last filter from the filter stack and doesn't return it.
|
||||
*
|
||||
* @method popMask
|
||||
* @param maskData {Array}
|
||||
* @param renderSession {Object} an object containing all the useful parameters
|
||||
*/
|
||||
PIXI.WebGLMaskManager.prototype.popMask = function(maskData, renderSession)
|
||||
{
|
||||
var gl = this.gl;
|
||||
renderSession.stencilManager.popStencil(maskData, maskData._webGL[gl.id].data[0], renderSession);
|
||||
};
|
||||
|
||||
/**
|
||||
* Destroys the mask stack.
|
||||
*
|
||||
* @method destroy
|
||||
*/
|
||||
PIXI.WebGLMaskManager.prototype.destroy = function()
|
||||
{
|
||||
this.gl = null;
|
||||
};
|
||||
157
app/Lib/Vendor/src/pixi/renderers/webgl/utils/WebGLShaderManager.js
vendored
Normal file
157
app/Lib/Vendor/src/pixi/renderers/webgl/utils/WebGLShaderManager.js
vendored
Normal file
|
|
@ -0,0 +1,157 @@
|
|||
/**
|
||||
* @author Mat Groves http://matgroves.com/ @Doormat23
|
||||
*/
|
||||
|
||||
/**
|
||||
* @class WebGLShaderManager
|
||||
* @constructor
|
||||
* @private
|
||||
*/
|
||||
PIXI.WebGLShaderManager = function()
|
||||
{
|
||||
/**
|
||||
* @property maxAttibs
|
||||
* @type Number
|
||||
*/
|
||||
this.maxAttibs = 10;
|
||||
|
||||
/**
|
||||
* @property attribState
|
||||
* @type Array
|
||||
*/
|
||||
this.attribState = [];
|
||||
|
||||
/**
|
||||
* @property tempAttribState
|
||||
* @type Array
|
||||
*/
|
||||
this.tempAttribState = [];
|
||||
|
||||
for (var i = 0; i < this.maxAttibs; i++)
|
||||
{
|
||||
this.attribState[i] = false;
|
||||
}
|
||||
|
||||
/**
|
||||
* @property stack
|
||||
* @type Array
|
||||
*/
|
||||
this.stack = [];
|
||||
|
||||
};
|
||||
|
||||
PIXI.WebGLShaderManager.prototype.constructor = PIXI.WebGLShaderManager;
|
||||
|
||||
/**
|
||||
* Initialises the context and the properties.
|
||||
*
|
||||
* @method setContext
|
||||
* @param gl {WebGLContext} the current WebGL drawing context
|
||||
*/
|
||||
PIXI.WebGLShaderManager.prototype.setContext = function(gl)
|
||||
{
|
||||
this.gl = gl;
|
||||
|
||||
// the next one is used for rendering primitives
|
||||
this.primitiveShader = new PIXI.PrimitiveShader(gl);
|
||||
|
||||
// the next one is used for rendering triangle strips
|
||||
this.complexPrimitiveShader = new PIXI.ComplexPrimitiveShader(gl);
|
||||
|
||||
// this shader is used for the default sprite rendering
|
||||
this.defaultShader = new PIXI.PixiShader(gl);
|
||||
|
||||
// this shader is used for the fast sprite rendering
|
||||
this.fastShader = new PIXI.PixiFastShader(gl);
|
||||
|
||||
// the next one is used for rendering triangle strips
|
||||
this.stripShader = new PIXI.StripShader(gl);
|
||||
this.setShader(this.defaultShader);
|
||||
};
|
||||
|
||||
/**
|
||||
* Takes the attributes given in parameters.
|
||||
*
|
||||
* @method setAttribs
|
||||
* @param attribs {Array} attribs
|
||||
*/
|
||||
PIXI.WebGLShaderManager.prototype.setAttribs = function(attribs)
|
||||
{
|
||||
// reset temp state
|
||||
var i;
|
||||
|
||||
for (i = 0; i < this.tempAttribState.length; i++)
|
||||
{
|
||||
this.tempAttribState[i] = false;
|
||||
}
|
||||
|
||||
// set the new attribs
|
||||
for (i = 0; i < attribs.length; i++)
|
||||
{
|
||||
var attribId = attribs[i];
|
||||
this.tempAttribState[attribId] = true;
|
||||
}
|
||||
|
||||
var gl = this.gl;
|
||||
|
||||
for (i = 0; i < this.attribState.length; i++)
|
||||
{
|
||||
if(this.attribState[i] !== this.tempAttribState[i])
|
||||
{
|
||||
this.attribState[i] = this.tempAttribState[i];
|
||||
|
||||
if(this.tempAttribState[i])
|
||||
{
|
||||
gl.enableVertexAttribArray(i);
|
||||
}
|
||||
else
|
||||
{
|
||||
gl.disableVertexAttribArray(i);
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Sets the current shader.
|
||||
*
|
||||
* @method setShader
|
||||
* @param shader {Any}
|
||||
*/
|
||||
PIXI.WebGLShaderManager.prototype.setShader = function(shader)
|
||||
{
|
||||
if(this._currentId === shader._UID)return false;
|
||||
|
||||
this._currentId = shader._UID;
|
||||
|
||||
this.currentShader = shader;
|
||||
|
||||
this.gl.useProgram(shader.program);
|
||||
this.setAttribs(shader.attributes);
|
||||
|
||||
return true;
|
||||
};
|
||||
|
||||
/**
|
||||
* Destroys this object.
|
||||
*
|
||||
* @method destroy
|
||||
*/
|
||||
PIXI.WebGLShaderManager.prototype.destroy = function()
|
||||
{
|
||||
this.attribState = null;
|
||||
|
||||
this.tempAttribState = null;
|
||||
|
||||
this.primitiveShader.destroy();
|
||||
|
||||
this.complexPrimitiveShader.destroy();
|
||||
|
||||
this.defaultShader.destroy();
|
||||
|
||||
this.fastShader.destroy();
|
||||
|
||||
this.stripShader.destroy();
|
||||
|
||||
this.gl = null;
|
||||
};
|
||||
88
app/Lib/Vendor/src/pixi/renderers/webgl/utils/WebGLShaderUtils.js
vendored
Normal file
88
app/Lib/Vendor/src/pixi/renderers/webgl/utils/WebGLShaderUtils.js
vendored
Normal file
|
|
@ -0,0 +1,88 @@
|
|||
/**
|
||||
* @author Mat Groves http://matgroves.com/ @Doormat23
|
||||
*/
|
||||
|
||||
/**
|
||||
* @method initDefaultShaders
|
||||
* @static
|
||||
* @private
|
||||
*/
|
||||
PIXI.initDefaultShaders = function()
|
||||
{
|
||||
};
|
||||
|
||||
/**
|
||||
* @method CompileVertexShader
|
||||
* @static
|
||||
* @param gl {WebGLContext} the current WebGL drawing context
|
||||
* @param shaderSrc {Array}
|
||||
* @return {Any}
|
||||
*/
|
||||
PIXI.CompileVertexShader = function(gl, shaderSrc)
|
||||
{
|
||||
return PIXI._CompileShader(gl, shaderSrc, gl.VERTEX_SHADER);
|
||||
};
|
||||
|
||||
/**
|
||||
* @method CompileFragmentShader
|
||||
* @static
|
||||
* @param gl {WebGLContext} the current WebGL drawing context
|
||||
* @param shaderSrc {Array}
|
||||
* @return {Any}
|
||||
*/
|
||||
PIXI.CompileFragmentShader = function(gl, shaderSrc)
|
||||
{
|
||||
return PIXI._CompileShader(gl, shaderSrc, gl.FRAGMENT_SHADER);
|
||||
};
|
||||
|
||||
/**
|
||||
* @method _CompileShader
|
||||
* @static
|
||||
* @private
|
||||
* @param gl {WebGLContext} the current WebGL drawing context
|
||||
* @param shaderSrc {Array}
|
||||
* @param shaderType {Number}
|
||||
* @return {Any}
|
||||
*/
|
||||
PIXI._CompileShader = function(gl, shaderSrc, shaderType)
|
||||
{
|
||||
var src = shaderSrc.join("\n");
|
||||
var shader = gl.createShader(shaderType);
|
||||
gl.shaderSource(shader, src);
|
||||
gl.compileShader(shader);
|
||||
|
||||
if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS))
|
||||
{
|
||||
window.console.log(gl.getShaderInfoLog(shader));
|
||||
return null;
|
||||
}
|
||||
|
||||
return shader;
|
||||
};
|
||||
|
||||
/**
|
||||
* @method compileProgram
|
||||
* @static
|
||||
* @param gl {WebGLContext} the current WebGL drawing context
|
||||
* @param vertexSrc {Array}
|
||||
* @param fragmentSrc {Array}
|
||||
* @return {Any}
|
||||
*/
|
||||
PIXI.compileProgram = function(gl, vertexSrc, fragmentSrc)
|
||||
{
|
||||
var fragmentShader = PIXI.CompileFragmentShader(gl, fragmentSrc);
|
||||
var vertexShader = PIXI.CompileVertexShader(gl, vertexSrc);
|
||||
|
||||
var shaderProgram = gl.createProgram();
|
||||
|
||||
gl.attachShader(shaderProgram, vertexShader);
|
||||
gl.attachShader(shaderProgram, fragmentShader);
|
||||
gl.linkProgram(shaderProgram);
|
||||
|
||||
if (!gl.getProgramParameter(shaderProgram, gl.LINK_STATUS))
|
||||
{
|
||||
window.console.log("Could not initialise shaders");
|
||||
}
|
||||
|
||||
return shaderProgram;
|
||||
};
|
||||
635
app/Lib/Vendor/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js
vendored
Executable file
635
app/Lib/Vendor/src/pixi/renderers/webgl/utils/WebGLSpriteBatch.js
vendored
Executable file
|
|
@ -0,0 +1,635 @@
|
|||
/**
|
||||
* @author Mat Groves
|
||||
*
|
||||
* Big thanks to the very clever Matt DesLauriers <mattdesl> https://github.com/mattdesl/
|
||||
* for creating the original pixi version!
|
||||
* Also a thanks to https://github.com/bchevalier for tweaking the tint and alpha so that they now share 4 bytes on the vertex buffer
|
||||
*
|
||||
* Heavily inspired by LibGDX's WebGLSpriteBatch:
|
||||
* https://github.com/libgdx/libgdx/blob/master/gdx/src/com/badlogic/gdx/graphics/g2d/WebGLSpriteBatch.java
|
||||
*/
|
||||
|
||||
/**
|
||||
*
|
||||
* @class WebGLSpriteBatch
|
||||
* @private
|
||||
* @constructor
|
||||
*/
|
||||
PIXI.WebGLSpriteBatch = function()
|
||||
{
|
||||
/**
|
||||
* @property vertSize
|
||||
* @type Number
|
||||
*/
|
||||
this.vertSize = 5;
|
||||
|
||||
/**
|
||||
* The number of images in the SpriteBatch before it flushes
|
||||
* @property size
|
||||
* @type Number
|
||||
*/
|
||||
this.size = 2000;//Math.pow(2, 16) / this.vertSize;
|
||||
|
||||
//the total number of bytes in our batch
|
||||
var numVerts = this.size * 4 * 4 * this.vertSize;
|
||||
//the total number of indices in our batch
|
||||
var numIndices = this.size * 6;
|
||||
|
||||
/**
|
||||
* Holds the vertices
|
||||
*
|
||||
* @property vertices
|
||||
* @type ArrayBuffer
|
||||
*/
|
||||
this.vertices = new PIXI.ArrayBuffer(numVerts);
|
||||
|
||||
/**
|
||||
* View on the vertices as a Float32Array
|
||||
*
|
||||
* @property positions
|
||||
* @type Float32Array
|
||||
*/
|
||||
this.positions = new PIXI.Float32Array(this.vertices);
|
||||
|
||||
/**
|
||||
* View on the vertices as a Uint32Array
|
||||
*
|
||||
* @property colors
|
||||
* @type Uint32Array
|
||||
*/
|
||||
this.colors = new PIXI.Uint32Array(this.vertices);
|
||||
|
||||
/**
|
||||
* Holds the indices
|
||||
*
|
||||
* @property indices
|
||||
* @type Uint16Array
|
||||
*/
|
||||
this.indices = new PIXI.Uint16Array(numIndices);
|
||||
|
||||
/**
|
||||
* @property lastIndexCount
|
||||
* @type Number
|
||||
*/
|
||||
this.lastIndexCount = 0;
|
||||
|
||||
for (var i=0, j=0; i < numIndices; i += 6, j += 4)
|
||||
{
|
||||
this.indices[i + 0] = j + 0;
|
||||
this.indices[i + 1] = j + 1;
|
||||
this.indices[i + 2] = j + 2;
|
||||
this.indices[i + 3] = j + 0;
|
||||
this.indices[i + 4] = j + 2;
|
||||
this.indices[i + 5] = j + 3;
|
||||
}
|
||||
|
||||
/**
|
||||
* @property drawing
|
||||
* @type Boolean
|
||||
*/
|
||||
this.drawing = false;
|
||||
|
||||
/**
|
||||
* @property currentBatchSize
|
||||
* @type Number
|
||||
*/
|
||||
this.currentBatchSize = 0;
|
||||
|
||||
/**
|
||||
* @property currentBaseTexture
|
||||
* @type BaseTexture
|
||||
*/
|
||||
this.currentBaseTexture = null;
|
||||
|
||||
/**
|
||||
* @property dirty
|
||||
* @type Boolean
|
||||
*/
|
||||
this.dirty = true;
|
||||
|
||||
/**
|
||||
* @property textures
|
||||
* @type Array
|
||||
*/
|
||||
this.textures = [];
|
||||
|
||||
/**
|
||||
* @property blendModes
|
||||
* @type Array
|
||||
*/
|
||||
this.blendModes = [];
|
||||
|
||||
/**
|
||||
* @property shaders
|
||||
* @type Array
|
||||
*/
|
||||
this.shaders = [];
|
||||
|
||||
/**
|
||||
* @property sprites
|
||||
* @type Array
|
||||
*/
|
||||
this.sprites = [];
|
||||
|
||||
/**
|
||||
* @property defaultShader
|
||||
* @type AbstractFilter
|
||||
*/
|
||||
this.defaultShader = new PIXI.AbstractFilter([
|
||||
'precision lowp float;',
|
||||
'varying vec2 vTextureCoord;',
|
||||
'varying vec4 vColor;',
|
||||
'uniform sampler2D uSampler;',
|
||||
'void main(void) {',
|
||||
' gl_FragColor = texture2D(uSampler, vTextureCoord) * vColor ;',
|
||||
'}'
|
||||
]);
|
||||
};
|
||||
|
||||
/**
|
||||
* @method setContext
|
||||
* @param gl {WebGLContext} the current WebGL drawing context
|
||||
*/
|
||||
PIXI.WebGLSpriteBatch.prototype.setContext = function(gl)
|
||||
{
|
||||
this.gl = gl;
|
||||
|
||||
// create a couple of buffers
|
||||
this.vertexBuffer = gl.createBuffer();
|
||||
this.indexBuffer = gl.createBuffer();
|
||||
|
||||
// 65535 is max index, so 65535 / 6 = 10922.
|
||||
|
||||
//upload the index data
|
||||
gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer);
|
||||
gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, this.indices, gl.STATIC_DRAW);
|
||||
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer);
|
||||
gl.bufferData(gl.ARRAY_BUFFER, this.vertices, gl.DYNAMIC_DRAW);
|
||||
|
||||
this.currentBlendMode = 99999;
|
||||
|
||||
var shader = new PIXI.PixiShader(gl);
|
||||
|
||||
shader.fragmentSrc = this.defaultShader.fragmentSrc;
|
||||
shader.uniforms = {};
|
||||
shader.init();
|
||||
|
||||
this.defaultShader.shaders[gl.id] = shader;
|
||||
};
|
||||
|
||||
/**
|
||||
* @method begin
|
||||
* @param renderSession {Object} The RenderSession object
|
||||
*/
|
||||
PIXI.WebGLSpriteBatch.prototype.begin = function(renderSession)
|
||||
{
|
||||
this.renderSession = renderSession;
|
||||
this.shader = this.renderSession.shaderManager.defaultShader;
|
||||
|
||||
this.start();
|
||||
};
|
||||
|
||||
/**
|
||||
* @method end
|
||||
*/
|
||||
PIXI.WebGLSpriteBatch.prototype.end = function()
|
||||
{
|
||||
this.flush();
|
||||
};
|
||||
|
||||
/**
|
||||
* @method render
|
||||
* @param sprite {Sprite} the sprite to render when using this spritebatch
|
||||
*/
|
||||
PIXI.WebGLSpriteBatch.prototype.render = function(sprite)
|
||||
{
|
||||
var texture = sprite.texture;
|
||||
|
||||
//TODO set blend modes..
|
||||
// check texture..
|
||||
if(this.currentBatchSize >= this.size)
|
||||
{
|
||||
this.flush();
|
||||
this.currentBaseTexture = texture.baseTexture;
|
||||
}
|
||||
|
||||
// get the uvs for the texture
|
||||
var uvs = texture._uvs;
|
||||
// if the uvs have not updated then no point rendering just yet!
|
||||
if(!uvs)return;
|
||||
|
||||
// TODO trim??
|
||||
var aX = sprite.anchor.x;
|
||||
var aY = sprite.anchor.y;
|
||||
|
||||
var w0, w1, h0, h1;
|
||||
|
||||
if (texture.trim)
|
||||
{
|
||||
// if the sprite is trimmed then we need to add the extra space before transforming the sprite coords..
|
||||
var trim = texture.trim;
|
||||
|
||||
w1 = trim.x - aX * trim.width;
|
||||
w0 = w1 + texture.crop.width;
|
||||
|
||||
h1 = trim.y - aY * trim.height;
|
||||
h0 = h1 + texture.crop.height;
|
||||
|
||||
}
|
||||
else
|
||||
{
|
||||
w0 = (texture.frame.width ) * (1-aX);
|
||||
w1 = (texture.frame.width ) * -aX;
|
||||
|
||||
h0 = texture.frame.height * (1-aY);
|
||||
h1 = texture.frame.height * -aY;
|
||||
}
|
||||
|
||||
var index = this.currentBatchSize * 4 * this.vertSize;
|
||||
|
||||
var resolution = texture.baseTexture.resolution;
|
||||
|
||||
var worldTransform = sprite.worldTransform;
|
||||
|
||||
var a = worldTransform.a / resolution;
|
||||
var b = worldTransform.b / resolution;
|
||||
var c = worldTransform.c / resolution;
|
||||
var d = worldTransform.d / resolution;
|
||||
var tx = worldTransform.tx;
|
||||
var ty = worldTransform.ty;
|
||||
|
||||
var colors = this.colors;
|
||||
var positions = this.positions;
|
||||
|
||||
if(this.renderSession.roundPixels)
|
||||
{
|
||||
// xy
|
||||
positions[index] = a * w1 + c * h1 + tx | 0;
|
||||
positions[index+1] = d * h1 + b * w1 + ty | 0;
|
||||
|
||||
// xy
|
||||
positions[index+5] = a * w0 + c * h1 + tx | 0;
|
||||
positions[index+6] = d * h1 + b * w0 + ty | 0;
|
||||
|
||||
// xy
|
||||
positions[index+10] = a * w0 + c * h0 + tx | 0;
|
||||
positions[index+11] = d * h0 + b * w0 + ty | 0;
|
||||
|
||||
// xy
|
||||
positions[index+15] = a * w1 + c * h0 + tx | 0;
|
||||
positions[index+16] = d * h0 + b * w1 + ty | 0;
|
||||
}
|
||||
else
|
||||
{
|
||||
// xy
|
||||
positions[index] = a * w1 + c * h1 + tx;
|
||||
positions[index+1] = d * h1 + b * w1 + ty;
|
||||
|
||||
// xy
|
||||
positions[index+5] = a * w0 + c * h1 + tx;
|
||||
positions[index+6] = d * h1 + b * w0 + ty;
|
||||
|
||||
// xy
|
||||
positions[index+10] = a * w0 + c * h0 + tx;
|
||||
positions[index+11] = d * h0 + b * w0 + ty;
|
||||
|
||||
// xy
|
||||
positions[index+15] = a * w1 + c * h0 + tx;
|
||||
positions[index+16] = d * h0 + b * w1 + ty;
|
||||
}
|
||||
|
||||
// uv
|
||||
positions[index+2] = uvs.x0;
|
||||
positions[index+3] = uvs.y0;
|
||||
|
||||
// uv
|
||||
positions[index+7] = uvs.x1;
|
||||
positions[index+8] = uvs.y1;
|
||||
|
||||
// uv
|
||||
positions[index+12] = uvs.x2;
|
||||
positions[index+13] = uvs.y2;
|
||||
|
||||
// uv
|
||||
positions[index+17] = uvs.x3;
|
||||
positions[index+18] = uvs.y3;
|
||||
|
||||
// color and alpha
|
||||
var tint = sprite.tint;
|
||||
colors[index+4] = colors[index+9] = colors[index+14] = colors[index+19] = (tint >> 16) + (tint & 0xff00) + ((tint & 0xff) << 16) + (sprite.worldAlpha * 255 << 24);
|
||||
|
||||
// increment the batchsize
|
||||
this.sprites[this.currentBatchSize++] = sprite;
|
||||
|
||||
|
||||
};
|
||||
|
||||
/**
|
||||
* Renders a TilingSprite using the spriteBatch.
|
||||
*
|
||||
* @method renderTilingSprite
|
||||
* @param sprite {TilingSprite} the tilingSprite to render
|
||||
*/
|
||||
PIXI.WebGLSpriteBatch.prototype.renderTilingSprite = function(tilingSprite)
|
||||
{
|
||||
var texture = tilingSprite.tilingTexture;
|
||||
|
||||
// check texture..
|
||||
if(this.currentBatchSize >= this.size)
|
||||
{
|
||||
//return;
|
||||
this.flush();
|
||||
this.currentBaseTexture = texture.baseTexture;
|
||||
}
|
||||
|
||||
// set the textures uvs temporarily
|
||||
// TODO create a separate texture so that we can tile part of a texture
|
||||
|
||||
if(!tilingSprite._uvs)tilingSprite._uvs = new PIXI.TextureUvs();
|
||||
|
||||
var uvs = tilingSprite._uvs;
|
||||
|
||||
tilingSprite.tilePosition.x %= texture.baseTexture.width * tilingSprite.tileScaleOffset.x;
|
||||
tilingSprite.tilePosition.y %= texture.baseTexture.height * tilingSprite.tileScaleOffset.y;
|
||||
|
||||
var offsetX = tilingSprite.tilePosition.x/(texture.baseTexture.width*tilingSprite.tileScaleOffset.x);
|
||||
var offsetY = tilingSprite.tilePosition.y/(texture.baseTexture.height*tilingSprite.tileScaleOffset.y);
|
||||
|
||||
var scaleX = (tilingSprite.width / texture.baseTexture.width) / (tilingSprite.tileScale.x * tilingSprite.tileScaleOffset.x);
|
||||
var scaleY = (tilingSprite.height / texture.baseTexture.height) / (tilingSprite.tileScale.y * tilingSprite.tileScaleOffset.y);
|
||||
|
||||
uvs.x0 = 0 - offsetX;
|
||||
uvs.y0 = 0 - offsetY;
|
||||
|
||||
uvs.x1 = (1 * scaleX) - offsetX;
|
||||
uvs.y1 = 0 - offsetY;
|
||||
|
||||
uvs.x2 = (1 * scaleX) - offsetX;
|
||||
uvs.y2 = (1 * scaleY) - offsetY;
|
||||
|
||||
uvs.x3 = 0 - offsetX;
|
||||
uvs.y3 = (1 * scaleY) - offsetY;
|
||||
|
||||
// get the tilingSprites current alpha and tint and combining them into a single color
|
||||
var tint = tilingSprite.tint;
|
||||
var color = (tint >> 16) + (tint & 0xff00) + ((tint & 0xff) << 16) + (tilingSprite.alpha * 255 << 24);
|
||||
|
||||
var positions = this.positions;
|
||||
var colors = this.colors;
|
||||
|
||||
var width = tilingSprite.width;
|
||||
var height = tilingSprite.height;
|
||||
|
||||
// TODO trim??
|
||||
var aX = tilingSprite.anchor.x;
|
||||
var aY = tilingSprite.anchor.y;
|
||||
var w0 = width * (1-aX);
|
||||
var w1 = width * -aX;
|
||||
|
||||
var h0 = height * (1-aY);
|
||||
var h1 = height * -aY;
|
||||
|
||||
var index = this.currentBatchSize * 4 * this.vertSize;
|
||||
|
||||
var resolution = texture.baseTexture.resolution;
|
||||
|
||||
var worldTransform = tilingSprite.worldTransform;
|
||||
|
||||
var a = worldTransform.a / resolution;//[0];
|
||||
var b = worldTransform.b / resolution;//[3];
|
||||
var c = worldTransform.c / resolution;//[1];
|
||||
var d = worldTransform.d / resolution;//[4];
|
||||
var tx = worldTransform.tx;//[2];
|
||||
var ty = worldTransform.ty;//[5];
|
||||
|
||||
// xy
|
||||
positions[index++] = a * w1 + c * h1 + tx;
|
||||
positions[index++] = d * h1 + b * w1 + ty;
|
||||
// uv
|
||||
positions[index++] = uvs.x0;
|
||||
positions[index++] = uvs.y0;
|
||||
// color
|
||||
colors[index++] = color;
|
||||
|
||||
// xy
|
||||
positions[index++] = (a * w0 + c * h1 + tx);
|
||||
positions[index++] = d * h1 + b * w0 + ty;
|
||||
// uv
|
||||
positions[index++] = uvs.x1;
|
||||
positions[index++] = uvs.y1;
|
||||
// color
|
||||
colors[index++] = color;
|
||||
|
||||
// xy
|
||||
positions[index++] = a * w0 + c * h0 + tx;
|
||||
positions[index++] = d * h0 + b * w0 + ty;
|
||||
// uv
|
||||
positions[index++] = uvs.x2;
|
||||
positions[index++] = uvs.y2;
|
||||
// color
|
||||
colors[index++] = color;
|
||||
|
||||
// xy
|
||||
positions[index++] = a * w1 + c * h0 + tx;
|
||||
positions[index++] = d * h0 + b * w1 + ty;
|
||||
// uv
|
||||
positions[index++] = uvs.x3;
|
||||
positions[index++] = uvs.y3;
|
||||
// color
|
||||
colors[index++] = color;
|
||||
|
||||
// increment the batchsize
|
||||
this.sprites[this.currentBatchSize++] = tilingSprite;
|
||||
};
|
||||
|
||||
/**
|
||||
* Renders the content and empties the current batch.
|
||||
*
|
||||
* @method flush
|
||||
*/
|
||||
PIXI.WebGLSpriteBatch.prototype.flush = function()
|
||||
{
|
||||
// If the batch is length 0 then return as there is nothing to draw
|
||||
if (this.currentBatchSize===0)return;
|
||||
|
||||
var gl = this.gl;
|
||||
var shader;
|
||||
|
||||
if(this.dirty)
|
||||
{
|
||||
this.dirty = false;
|
||||
// bind the main texture
|
||||
gl.activeTexture(gl.TEXTURE0);
|
||||
|
||||
// bind the buffers
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexBuffer);
|
||||
gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexBuffer);
|
||||
|
||||
shader = this.defaultShader.shaders[gl.id];
|
||||
|
||||
// this is the same for each shader?
|
||||
var stride = this.vertSize * 4;
|
||||
gl.vertexAttribPointer(shader.aVertexPosition, 2, gl.FLOAT, false, stride, 0);
|
||||
gl.vertexAttribPointer(shader.aTextureCoord, 2, gl.FLOAT, false, stride, 2 * 4);
|
||||
|
||||
// color attributes will be interpreted as unsigned bytes and normalized
|
||||
gl.vertexAttribPointer(shader.colorAttribute, 4, gl.UNSIGNED_BYTE, true, stride, 4 * 4);
|
||||
}
|
||||
|
||||
// upload the verts to the buffer
|
||||
if(this.currentBatchSize > ( this.size * 0.5 ) )
|
||||
{
|
||||
gl.bufferSubData(gl.ARRAY_BUFFER, 0, this.vertices);
|
||||
}
|
||||
else
|
||||
{
|
||||
var view = this.positions.subarray(0, this.currentBatchSize * 4 * this.vertSize);
|
||||
gl.bufferSubData(gl.ARRAY_BUFFER, 0, view);
|
||||
}
|
||||
|
||||
var nextTexture, nextBlendMode, nextShader;
|
||||
var batchSize = 0;
|
||||
var start = 0;
|
||||
|
||||
var currentBaseTexture = null;
|
||||
var currentBlendMode = this.renderSession.blendModeManager.currentBlendMode;
|
||||
var currentShader = null;
|
||||
|
||||
var blendSwap = false;
|
||||
var shaderSwap = false;
|
||||
var sprite;
|
||||
|
||||
for (var i = 0, j = this.currentBatchSize; i < j; i++) {
|
||||
|
||||
sprite = this.sprites[i];
|
||||
|
||||
nextTexture = sprite.texture.baseTexture;
|
||||
nextBlendMode = sprite.blendMode;
|
||||
nextShader = sprite.shader || this.defaultShader;
|
||||
|
||||
blendSwap = currentBlendMode !== nextBlendMode;
|
||||
shaderSwap = currentShader !== nextShader; // should I use _UIDS???
|
||||
|
||||
if(currentBaseTexture !== nextTexture || blendSwap || shaderSwap)
|
||||
{
|
||||
this.renderBatch(currentBaseTexture, batchSize, start);
|
||||
|
||||
start = i;
|
||||
batchSize = 0;
|
||||
currentBaseTexture = nextTexture;
|
||||
|
||||
if( blendSwap )
|
||||
{
|
||||
currentBlendMode = nextBlendMode;
|
||||
this.renderSession.blendModeManager.setBlendMode( currentBlendMode );
|
||||
}
|
||||
|
||||
if( shaderSwap )
|
||||
{
|
||||
currentShader = nextShader;
|
||||
|
||||
shader = currentShader.shaders[gl.id];
|
||||
|
||||
if(!shader)
|
||||
{
|
||||
shader = new PIXI.PixiShader(gl);
|
||||
|
||||
shader.fragmentSrc =currentShader.fragmentSrc;
|
||||
shader.uniforms =currentShader.uniforms;
|
||||
shader.init();
|
||||
|
||||
currentShader.shaders[gl.id] = shader;
|
||||
}
|
||||
|
||||
// set shader function???
|
||||
this.renderSession.shaderManager.setShader(shader);
|
||||
|
||||
if(shader.dirty)shader.syncUniforms();
|
||||
|
||||
// both thease only need to be set if they are changing..
|
||||
// set the projection
|
||||
var projection = this.renderSession.projection;
|
||||
gl.uniform2f(shader.projectionVector, projection.x, projection.y);
|
||||
|
||||
// TODO - this is temprorary!
|
||||
var offsetVector = this.renderSession.offset;
|
||||
gl.uniform2f(shader.offsetVector, offsetVector.x, offsetVector.y);
|
||||
|
||||
// set the pointers
|
||||
}
|
||||
}
|
||||
|
||||
batchSize++;
|
||||
}
|
||||
|
||||
this.renderBatch(currentBaseTexture, batchSize, start);
|
||||
|
||||
// then reset the batch!
|
||||
this.currentBatchSize = 0;
|
||||
};
|
||||
|
||||
/**
|
||||
* @method renderBatch
|
||||
* @param texture {Texture}
|
||||
* @param size {Number}
|
||||
* @param startIndex {Number}
|
||||
*/
|
||||
PIXI.WebGLSpriteBatch.prototype.renderBatch = function(texture, size, startIndex)
|
||||
{
|
||||
if(size === 0)return;
|
||||
|
||||
var gl = this.gl;
|
||||
|
||||
// check if a texture is dirty..
|
||||
if(texture._dirty[gl.id])
|
||||
{
|
||||
this.renderSession.renderer.updateTexture(texture);
|
||||
}
|
||||
else
|
||||
{
|
||||
// bind the current texture
|
||||
gl.bindTexture(gl.TEXTURE_2D, texture._glTextures[gl.id]);
|
||||
}
|
||||
|
||||
// now draw those suckas!
|
||||
gl.drawElements(gl.TRIANGLES, size * 6, gl.UNSIGNED_SHORT, startIndex * 6 * 2);
|
||||
|
||||
// increment the draw count
|
||||
this.renderSession.drawCount++;
|
||||
};
|
||||
|
||||
/**
|
||||
* @method stop
|
||||
*/
|
||||
PIXI.WebGLSpriteBatch.prototype.stop = function()
|
||||
{
|
||||
this.flush();
|
||||
this.dirty = true;
|
||||
};
|
||||
|
||||
/**
|
||||
* @method start
|
||||
*/
|
||||
PIXI.WebGLSpriteBatch.prototype.start = function()
|
||||
{
|
||||
this.dirty = true;
|
||||
};
|
||||
|
||||
/**
|
||||
* Destroys the SpriteBatch.
|
||||
*
|
||||
* @method destroy
|
||||
*/
|
||||
PIXI.WebGLSpriteBatch.prototype.destroy = function()
|
||||
{
|
||||
this.vertices = null;
|
||||
this.indices = null;
|
||||
|
||||
this.gl.deleteBuffer( this.vertexBuffer );
|
||||
this.gl.deleteBuffer( this.indexBuffer );
|
||||
|
||||
this.currentBaseTexture = null;
|
||||
|
||||
this.gl = null;
|
||||
};
|
||||
297
app/Lib/Vendor/src/pixi/renderers/webgl/utils/WebGLStencilManager.js
vendored
Normal file
297
app/Lib/Vendor/src/pixi/renderers/webgl/utils/WebGLStencilManager.js
vendored
Normal file
|
|
@ -0,0 +1,297 @@
|
|||
/**
|
||||
* @author Mat Groves http://matgroves.com/ @Doormat23
|
||||
*/
|
||||
|
||||
/**
|
||||
* @class WebGLStencilManager
|
||||
* @constructor
|
||||
* @private
|
||||
*/
|
||||
PIXI.WebGLStencilManager = function()
|
||||
{
|
||||
this.stencilStack = [];
|
||||
this.reverse = true;
|
||||
this.count = 0;
|
||||
};
|
||||
|
||||
/**
|
||||
* Sets the drawing context to the one given in parameter.
|
||||
*
|
||||
* @method setContext
|
||||
* @param gl {WebGLContext} the current WebGL drawing context
|
||||
*/
|
||||
PIXI.WebGLStencilManager.prototype.setContext = function(gl)
|
||||
{
|
||||
this.gl = gl;
|
||||
};
|
||||
|
||||
/**
|
||||
* Applies the Mask and adds it to the current filter stack.
|
||||
*
|
||||
* @method pushMask
|
||||
* @param graphics {Graphics}
|
||||
* @param webGLData {Array}
|
||||
* @param renderSession {Object}
|
||||
*/
|
||||
PIXI.WebGLStencilManager.prototype.pushStencil = function(graphics, webGLData, renderSession)
|
||||
{
|
||||
var gl = this.gl;
|
||||
this.bindGraphics(graphics, webGLData, renderSession);
|
||||
|
||||
if(this.stencilStack.length === 0)
|
||||
{
|
||||
gl.enable(gl.STENCIL_TEST);
|
||||
gl.clear(gl.STENCIL_BUFFER_BIT);
|
||||
this.reverse = true;
|
||||
this.count = 0;
|
||||
}
|
||||
|
||||
this.stencilStack.push(webGLData);
|
||||
|
||||
var level = this.count;
|
||||
|
||||
gl.colorMask(false, false, false, false);
|
||||
|
||||
gl.stencilFunc(gl.ALWAYS,0,0xFF);
|
||||
gl.stencilOp(gl.KEEP,gl.KEEP,gl.INVERT);
|
||||
|
||||
// draw the triangle strip!
|
||||
|
||||
if(webGLData.mode === 1)
|
||||
{
|
||||
gl.drawElements(gl.TRIANGLE_FAN, webGLData.indices.length - 4, gl.UNSIGNED_SHORT, 0 );
|
||||
|
||||
if(this.reverse)
|
||||
{
|
||||
gl.stencilFunc(gl.EQUAL, 0xFF - level, 0xFF);
|
||||
gl.stencilOp(gl.KEEP,gl.KEEP,gl.DECR);
|
||||
}
|
||||
else
|
||||
{
|
||||
gl.stencilFunc(gl.EQUAL,level, 0xFF);
|
||||
gl.stencilOp(gl.KEEP,gl.KEEP,gl.INCR);
|
||||
}
|
||||
|
||||
// draw a quad to increment..
|
||||
gl.drawElements(gl.TRIANGLE_FAN, 4, gl.UNSIGNED_SHORT, ( webGLData.indices.length - 4 ) * 2 );
|
||||
|
||||
if(this.reverse)
|
||||
{
|
||||
gl.stencilFunc(gl.EQUAL,0xFF-(level+1), 0xFF);
|
||||
}
|
||||
else
|
||||
{
|
||||
gl.stencilFunc(gl.EQUAL,level+1, 0xFF);
|
||||
}
|
||||
|
||||
this.reverse = !this.reverse;
|
||||
}
|
||||
else
|
||||
{
|
||||
if(!this.reverse)
|
||||
{
|
||||
gl.stencilFunc(gl.EQUAL, 0xFF - level, 0xFF);
|
||||
gl.stencilOp(gl.KEEP,gl.KEEP,gl.DECR);
|
||||
}
|
||||
else
|
||||
{
|
||||
gl.stencilFunc(gl.EQUAL,level, 0xFF);
|
||||
gl.stencilOp(gl.KEEP,gl.KEEP,gl.INCR);
|
||||
}
|
||||
|
||||
gl.drawElements(gl.TRIANGLE_STRIP, webGLData.indices.length, gl.UNSIGNED_SHORT, 0 );
|
||||
|
||||
if(!this.reverse)
|
||||
{
|
||||
gl.stencilFunc(gl.EQUAL,0xFF-(level+1), 0xFF);
|
||||
}
|
||||
else
|
||||
{
|
||||
gl.stencilFunc(gl.EQUAL,level+1, 0xFF);
|
||||
}
|
||||
}
|
||||
|
||||
gl.colorMask(true, true, true, true);
|
||||
gl.stencilOp(gl.KEEP,gl.KEEP,gl.KEEP);
|
||||
|
||||
this.count++;
|
||||
};
|
||||
|
||||
/**
|
||||
* TODO this does not belong here!
|
||||
*
|
||||
* @method bindGraphics
|
||||
* @param graphics {Graphics}
|
||||
* @param webGLData {Array}
|
||||
* @param renderSession {Object}
|
||||
*/
|
||||
PIXI.WebGLStencilManager.prototype.bindGraphics = function(graphics, webGLData, renderSession)
|
||||
{
|
||||
//if(this._currentGraphics === graphics)return;
|
||||
this._currentGraphics = graphics;
|
||||
|
||||
var gl = this.gl;
|
||||
|
||||
// bind the graphics object..
|
||||
var projection = renderSession.projection,
|
||||
offset = renderSession.offset,
|
||||
shader;// = renderSession.shaderManager.primitiveShader;
|
||||
|
||||
if(webGLData.mode === 1)
|
||||
{
|
||||
shader = renderSession.shaderManager.complexPrimitiveShader;
|
||||
|
||||
renderSession.shaderManager.setShader( shader );
|
||||
|
||||
gl.uniform1f(shader.flipY, renderSession.flipY);
|
||||
|
||||
gl.uniformMatrix3fv(shader.translationMatrix, false, graphics.worldTransform.toArray(true));
|
||||
|
||||
gl.uniform2f(shader.projectionVector, projection.x, -projection.y);
|
||||
gl.uniform2f(shader.offsetVector, -offset.x, -offset.y);
|
||||
|
||||
gl.uniform3fv(shader.tintColor, PIXI.hex2rgb(graphics.tint));
|
||||
gl.uniform3fv(shader.color, webGLData.color);
|
||||
|
||||
gl.uniform1f(shader.alpha, graphics.worldAlpha * webGLData.alpha);
|
||||
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, webGLData.buffer);
|
||||
|
||||
gl.vertexAttribPointer(shader.aVertexPosition, 2, gl.FLOAT, false, 4 * 2, 0);
|
||||
|
||||
|
||||
// now do the rest..
|
||||
// set the index buffer!
|
||||
gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, webGLData.indexBuffer);
|
||||
}
|
||||
else
|
||||
{
|
||||
//renderSession.shaderManager.activatePrimitiveShader();
|
||||
shader = renderSession.shaderManager.primitiveShader;
|
||||
renderSession.shaderManager.setShader( shader );
|
||||
|
||||
gl.uniformMatrix3fv(shader.translationMatrix, false, graphics.worldTransform.toArray(true));
|
||||
|
||||
gl.uniform1f(shader.flipY, renderSession.flipY);
|
||||
gl.uniform2f(shader.projectionVector, projection.x, -projection.y);
|
||||
gl.uniform2f(shader.offsetVector, -offset.x, -offset.y);
|
||||
|
||||
gl.uniform3fv(shader.tintColor, PIXI.hex2rgb(graphics.tint));
|
||||
|
||||
gl.uniform1f(shader.alpha, graphics.worldAlpha);
|
||||
|
||||
gl.bindBuffer(gl.ARRAY_BUFFER, webGLData.buffer);
|
||||
|
||||
gl.vertexAttribPointer(shader.aVertexPosition, 2, gl.FLOAT, false, 4 * 6, 0);
|
||||
gl.vertexAttribPointer(shader.colorAttribute, 4, gl.FLOAT, false,4 * 6, 2 * 4);
|
||||
|
||||
// set the index buffer!
|
||||
gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, webGLData.indexBuffer);
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* @method popStencil
|
||||
* @param graphics {Graphics}
|
||||
* @param webGLData {Array}
|
||||
* @param renderSession {Object}
|
||||
*/
|
||||
PIXI.WebGLStencilManager.prototype.popStencil = function(graphics, webGLData, renderSession)
|
||||
{
|
||||
var gl = this.gl;
|
||||
this.stencilStack.pop();
|
||||
|
||||
this.count--;
|
||||
|
||||
if(this.stencilStack.length === 0)
|
||||
{
|
||||
// the stack is empty!
|
||||
gl.disable(gl.STENCIL_TEST);
|
||||
|
||||
}
|
||||
else
|
||||
{
|
||||
|
||||
var level = this.count;
|
||||
|
||||
this.bindGraphics(graphics, webGLData, renderSession);
|
||||
|
||||
gl.colorMask(false, false, false, false);
|
||||
|
||||
if(webGLData.mode === 1)
|
||||
{
|
||||
this.reverse = !this.reverse;
|
||||
|
||||
if(this.reverse)
|
||||
{
|
||||
gl.stencilFunc(gl.EQUAL, 0xFF - (level+1), 0xFF);
|
||||
gl.stencilOp(gl.KEEP,gl.KEEP,gl.INCR);
|
||||
}
|
||||
else
|
||||
{
|
||||
gl.stencilFunc(gl.EQUAL,level+1, 0xFF);
|
||||
gl.stencilOp(gl.KEEP,gl.KEEP,gl.DECR);
|
||||
}
|
||||
|
||||
// draw a quad to increment..
|
||||
gl.drawElements(gl.TRIANGLE_FAN, 4, gl.UNSIGNED_SHORT, ( webGLData.indices.length - 4 ) * 2 );
|
||||
|
||||
gl.stencilFunc(gl.ALWAYS,0,0xFF);
|
||||
gl.stencilOp(gl.KEEP,gl.KEEP,gl.INVERT);
|
||||
|
||||
// draw the triangle strip!
|
||||
gl.drawElements(gl.TRIANGLE_FAN, webGLData.indices.length - 4, gl.UNSIGNED_SHORT, 0 );
|
||||
|
||||
if(!this.reverse)
|
||||
{
|
||||
gl.stencilFunc(gl.EQUAL,0xFF-(level), 0xFF);
|
||||
}
|
||||
else
|
||||
{
|
||||
gl.stencilFunc(gl.EQUAL,level, 0xFF);
|
||||
}
|
||||
|
||||
}
|
||||
else
|
||||
{
|
||||
// console.log("<<>>")
|
||||
if(!this.reverse)
|
||||
{
|
||||
gl.stencilFunc(gl.EQUAL, 0xFF - (level+1), 0xFF);
|
||||
gl.stencilOp(gl.KEEP,gl.KEEP,gl.INCR);
|
||||
}
|
||||
else
|
||||
{
|
||||
gl.stencilFunc(gl.EQUAL,level+1, 0xFF);
|
||||
gl.stencilOp(gl.KEEP,gl.KEEP,gl.DECR);
|
||||
}
|
||||
|
||||
gl.drawElements(gl.TRIANGLE_STRIP, webGLData.indices.length, gl.UNSIGNED_SHORT, 0 );
|
||||
|
||||
if(!this.reverse)
|
||||
{
|
||||
gl.stencilFunc(gl.EQUAL,0xFF-(level), 0xFF);
|
||||
}
|
||||
else
|
||||
{
|
||||
gl.stencilFunc(gl.EQUAL,level, 0xFF);
|
||||
}
|
||||
}
|
||||
|
||||
gl.colorMask(true, true, true, true);
|
||||
gl.stencilOp(gl.KEEP,gl.KEEP,gl.KEEP);
|
||||
|
||||
|
||||
}
|
||||
};
|
||||
|
||||
/**
|
||||
* Destroys the mask stack.
|
||||
*
|
||||
* @method destroy
|
||||
*/
|
||||
PIXI.WebGLStencilManager.prototype.destroy = function()
|
||||
{
|
||||
this.stencilStack = null;
|
||||
this.gl = null;
|
||||
};
|
||||
Loading…
Add table
Add a link
Reference in a new issue