Rename WebGL variables to match CSS shaders specification

See https://dvcs.w3.org/hg/FXTF/raw-file/tip/filters/index.htm
This commit is contained in:
Tom Payne
2013-03-04 19:45:42 +01:00
parent ad17c2ba90
commit 08dbeed23f
5 changed files with 57 additions and 57 deletions

View File

@@ -45,7 +45,7 @@ ol.renderer.webgl.ImageLayer = function(mapRenderer, imageLayer) {
* @private
* @type {!goog.vec.Mat4.Number}
*/
this.vertexCoordMatrix_ = goog.vec.Mat4.createNumber();
this.projectionMatrix_ = goog.vec.Mat4.createNumber();
};
goog.inherits(ol.renderer.webgl.ImageLayer, ol.renderer.webgl.Layer);
@@ -118,8 +118,8 @@ ol.renderer.webgl.ImageLayer.prototype.getTexture = function() {
/**
* @inheritDoc
*/
ol.renderer.webgl.ImageLayer.prototype.getVertexCoordMatrix = function() {
return this.vertexCoordMatrix_;
ol.renderer.webgl.ImageLayer.prototype.getProjectionMatrix = function() {
return this.projectionMatrix_;
};
@@ -187,7 +187,7 @@ ol.renderer.webgl.ImageLayer.prototype.renderFrame =
var canvas = this.getMapRenderer().getCanvas();
this.updateVertexCoordMatrix_(canvas.width, canvas.height,
this.updateProjectionMatrix_(canvas.width, canvas.height,
viewCenter, viewResolution, viewRotation, image.getExtent());
// Translate and scale to flip the Y coord.
@@ -213,24 +213,24 @@ ol.renderer.webgl.ImageLayer.prototype.renderFrame =
* @param {number} viewRotation View rotation.
* @param {ol.Extent} imageExtent Image extent.
*/
ol.renderer.webgl.ImageLayer.prototype.updateVertexCoordMatrix_ =
ol.renderer.webgl.ImageLayer.prototype.updateProjectionMatrix_ =
function(canvasWidth, canvasHeight, viewCenter,
viewResolution, viewRotation, imageExtent) {
var canvasExtentWidth = canvasWidth * viewResolution;
var canvasExtentHeight = canvasHeight * viewResolution;
var vertexCoordMatrix = this.vertexCoordMatrix_;
goog.vec.Mat4.makeIdentity(vertexCoordMatrix);
goog.vec.Mat4.scale(vertexCoordMatrix,
var projectionMatrix = this.projectionMatrix_;
goog.vec.Mat4.makeIdentity(projectionMatrix);
goog.vec.Mat4.scale(projectionMatrix,
2 / canvasExtentWidth, 2 / canvasExtentHeight, 1);
goog.vec.Mat4.rotateZ(vertexCoordMatrix, -viewRotation);
goog.vec.Mat4.translate(vertexCoordMatrix,
goog.vec.Mat4.rotateZ(projectionMatrix, -viewRotation);
goog.vec.Mat4.translate(projectionMatrix,
imageExtent.minX - viewCenter.x,
imageExtent.minY - viewCenter.y,
0);
goog.vec.Mat4.scale(vertexCoordMatrix,
goog.vec.Mat4.scale(projectionMatrix,
imageExtent.getWidth() / 2, imageExtent.getHeight() / 2, 1);
goog.vec.Mat4.translate(vertexCoordMatrix, 1, 1, 0);
goog.vec.Mat4.translate(projectionMatrix, 1, 1, 0);
};

View File

@@ -100,7 +100,7 @@ ol.renderer.webgl.Layer.prototype.getTexture = goog.abstractMethod;
/**
* @return {!goog.vec.Mat4.Number} Matrix.
*/
ol.renderer.webgl.Layer.prototype.getVertexCoordMatrix = goog.abstractMethod;
ol.renderer.webgl.Layer.prototype.getProjectionMatrix = goog.abstractMethod;
/**

View File

@@ -48,17 +48,17 @@ ol.renderer.webgl.map.shader.Fragment = function() {
goog.base(this, [
'precision mediump float;',
'',
'uniform mat4 uColorMatrix;',
'uniform float uOpacity;',
'uniform sampler2D uTexture;',
'uniform mat4 u_colorMatrix;',
'uniform float u_opacity;',
'uniform sampler2D u_texture;',
'',
'varying vec2 vTexCoord;',
'varying vec2 v_texCoord;',
'',
'void main(void) {',
'',
' vec4 texColor = texture2D(uTexture, vTexCoord);',
' vec4 color = uColorMatrix * vec4(texColor.rgb, 1.);',
' color.a = texColor.a * uOpacity;',
' vec4 texColor = texture2D(u_texture, v_texCoord);',
' vec4 color = u_colorMatrix * vec4(texColor.rgb, 1.);',
' color.a = texColor.a * u_opacity;',
'',
' gl_FragColor = color;',
'',
@@ -77,17 +77,17 @@ goog.addSingletonGetter(ol.renderer.webgl.map.shader.Fragment);
*/
ol.renderer.webgl.map.shader.Vertex = function() {
goog.base(this, [
'attribute vec2 aPosition;',
'attribute vec2 aTexCoord;',
'attribute vec2 a_position;',
'attribute vec2 a_texCoord;',
'',
'uniform mat4 uTexCoordMatrix;',
'uniform mat4 uVertexCoordMatrix;',
'uniform mat4 u_texCoordMatrix;',
'uniform mat4 u_projectionMatrix;',
'',
'varying vec2 vTexCoord;',
'varying vec2 v_texCoord;',
'',
'void main(void) {',
' gl_Position = uVertexCoordMatrix * vec4(aPosition, 0., 1.);',
' vTexCoord = (uTexCoordMatrix * vec4(aTexCoord, 0., 1.)).st;',
' gl_Position = u_projectionMatrix * vec4(a_position, 0., 1.);',
' v_texCoord = (u_texCoordMatrix * vec4(a_texCoord, 0., 1.)).st;',
'}'
].join('\n'));
};
@@ -157,13 +157,13 @@ ol.renderer.webgl.Map = function(container, map) {
/**
* @private
* @type {{aPosition: number,
* aTexCoord: number,
* uColorMatrix: WebGLUniformLocation,
* uOpacity: WebGLUniformLocation,
* uTexture: WebGLUniformLocation,
* uTexCoordMatrix: WebGLUniformLocation,
* uVertexCoordMatrix: WebGLUniformLocation}|null}
* @type {{a_position: number,
* a_texCoord: number,
* u_colorMatrix: WebGLUniformLocation,
* u_opacity: WebGLUniformLocation,
* u_texture: WebGLUniformLocation,
* u_texCoordMatrix: WebGLUniformLocation,
* u_projectionMatrix: WebGLUniformLocation}|null}
*/
this.locations_ = null;
@@ -522,13 +522,13 @@ ol.renderer.webgl.Map.prototype.renderFrame = function(frameState) {
gl.useProgram(program);
if (goog.isNull(this.locations_)) {
this.locations_ = {
aPosition: gl.getAttribLocation(program, 'aPosition'),
aTexCoord: gl.getAttribLocation(program, 'aTexCoord'),
uColorMatrix: gl.getUniformLocation(program, 'uColorMatrix'),
uTexCoordMatrix: gl.getUniformLocation(program, 'uTexCoordMatrix'),
uVertexCoordMatrix: gl.getUniformLocation(program, 'uVertexCoordMatrix'),
uOpacity: gl.getUniformLocation(program, 'uOpacity'),
uTexture: gl.getUniformLocation(program, 'uTexture')
a_position: gl.getAttribLocation(program, 'a_position'),
a_texCoord: gl.getAttribLocation(program, 'a_texCoord'),
u_colorMatrix: gl.getUniformLocation(program, 'u_colorMatrix'),
u_texCoordMatrix: gl.getUniformLocation(program, 'u_texCoordMatrix'),
u_projectionMatrix: gl.getUniformLocation(program, 'u_projectionMatrix'),
u_opacity: gl.getUniformLocation(program, 'u_opacity'),
u_texture: gl.getUniformLocation(program, 'u_texture')
};
}
@@ -546,13 +546,13 @@ ol.renderer.webgl.Map.prototype.renderFrame = function(frameState) {
gl.bindBuffer(goog.webgl.ARRAY_BUFFER, this.arrayBuffer_);
}
gl.enableVertexAttribArray(this.locations_.aPosition);
gl.enableVertexAttribArray(this.locations_.a_position);
gl.vertexAttribPointer(
this.locations_.aPosition, 2, goog.webgl.FLOAT, false, 16, 0);
gl.enableVertexAttribArray(this.locations_.aTexCoord);
this.locations_.a_position, 2, goog.webgl.FLOAT, false, 16, 0);
gl.enableVertexAttribArray(this.locations_.a_texCoord);
gl.vertexAttribPointer(
this.locations_.aTexCoord, 2, goog.webgl.FLOAT, false, 16, 8);
gl.uniform1i(this.locations_.uTexture, 0);
this.locations_.a_texCoord, 2, goog.webgl.FLOAT, false, 16, 8);
gl.uniform1i(this.locations_.u_texture, 0);
goog.array.forEach(frameState.layersArray, function(layer) {
var layerState = frameState.layerStates[goog.getUid(layer)];
@@ -561,14 +561,14 @@ ol.renderer.webgl.Map.prototype.renderFrame = function(frameState) {
}
var layerRenderer = this.getLayerRenderer(layer);
gl.uniformMatrix4fv(
this.locations_.uTexCoordMatrix, false,
this.locations_.u_texCoordMatrix, false,
layerRenderer.getTexCoordMatrix());
gl.uniformMatrix4fv(
this.locations_.uVertexCoordMatrix, false,
layerRenderer.getVertexCoordMatrix());
this.locations_.u_projectionMatrix, false,
layerRenderer.getProjectionMatrix());
gl.uniformMatrix4fv(
this.locations_.uColorMatrix, false, layerRenderer.getColorMatrix());
gl.uniform1f(this.locations_.uOpacity, layer.getOpacity());
this.locations_.u_colorMatrix, false, layerRenderer.getColorMatrix());
gl.uniform1f(this.locations_.u_opacity, layer.getOpacity());
gl.bindTexture(goog.webgl.TEXTURE_2D, layerRenderer.getTexture());
gl.drawArrays(goog.webgl.TRIANGLE_STRIP, 0, 4);
}, this);

View File

@@ -145,7 +145,7 @@ ol.renderer.webgl.TileLayer = function(mapRenderer, tileLayer) {
* @private
* @type {!goog.vec.Mat4.Number}
*/
this.vertexCoordMatrix_ = goog.vec.Mat4.createNumberIdentity();
this.projectionMatrix_ = goog.vec.Mat4.createNumberIdentity();
/**
* @private
@@ -246,8 +246,8 @@ ol.renderer.webgl.TileLayer.prototype.getTexture = function() {
/**
* @inheritDoc
*/
ol.renderer.webgl.TileLayer.prototype.getVertexCoordMatrix = function() {
return this.vertexCoordMatrix_;
ol.renderer.webgl.TileLayer.prototype.getProjectionMatrix = function() {
return this.projectionMatrix_;
};

View File

@@ -1,7 +1,7 @@
goog.provide('ol.test.renderer.webgl.ImageLayer');
describe('ol.renderer.webgl.ImageLayer', function() {
describe('updateVertexCoordMatrix_', function() {
describe('updateProjectionMatrix_', function() {
var map;
var renderer;
var canvasWidth;
@@ -41,9 +41,9 @@ describe('ol.renderer.webgl.ImageLayer', function() {
it('produces a correct matrix', function() {
renderer.updateVertexCoordMatrix_(canvasWidth, canvasHeight,
renderer.updateProjectionMatrix_(canvasWidth, canvasHeight,
viewCenter, viewResolution, viewRotation, imageExtent);
var matrix = renderer.getVertexCoordMatrix();
var matrix = renderer.getProjectionMatrix();
var input;
var output = goog.vec.Vec4.createNumber();