Skip to content

Commit 876cf06

Browse files
kenrussellkenrussell
committed
Actually added modifications described in last commit message.
1 parent 378d647 commit 876cf06

26 files changed

+110
-74
lines changed

‎CanvasMatrix.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@
3333
void load(in CanvasMatrix4 matrix); // copy the values from the passed matrix
3434
void load(in sequence<float> array); // copy 16 floats into the matrix
3535
sequence<float> getAsArray(); // return the matrix as an array of 16 floats
36-
WebGLFloatArray getAsWebGLFloatArray(); // return the matrix as a WebGLFloatArray with 16 values
36+
Float32Array getAsFloat32Array(); // return the matrix as a Float32Array with 16 values
3737
void makeIdentity(); // replace the matrix with identity
3838
void transpose(); // replace the matrix with its transpose
3939
void invert(); // replace the matrix with its inverse
@@ -139,9 +139,9 @@ CanvasMatrix4.prototype.getAsArray = function()
139139
];
140140
}
141141

142-
CanvasMatrix4.prototype.getAsWebGLFloatArray = function()
142+
CanvasMatrix4.prototype.getAsFloat32Array = function()
143143
{
144-
return new WebGLFloatArray(this.getAsArray());
144+
return new Float32Array(this.getAsArray());
145145
}
146146

147147
CanvasMatrix4.prototype.makeIdentity = function()

‎axes.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -46,11 +46,11 @@ function axes(gl, scr) {
4646

4747
this.vertexVBO = gl.createBuffer();
4848
gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexVBO);
49-
gl.bufferData(gl.ARRAY_BUFFER, new WebGLFloatArray(vertices), gl.STATIC_DRAW);
49+
gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);
5050

5151
this.indexVBO = gl.createBuffer();
5252
gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexVBO);
53-
gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new WebGLUnsignedShortArray(indices), gl.STATIC_DRAW);
53+
gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Uint16Array(indices), gl.STATIC_DRAW);
5454
}
5555

5656
this.draw = function(scr) {
@@ -72,7 +72,7 @@ function axes(gl, scr) {
7272
var vertex_source = this.read("shaders/passthru.vert");
7373
var frag_source = this.read("shaders/passthru.frag");
7474

75-
this.program = this.compile_program(vertex_source, frag_source);
75+
this.program = this.compile_program(vertex_source, frag_source, { "position": 0 });
7676
}
7777

7878
this.initialize(scr);

‎curve.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -68,11 +68,11 @@ function curve(string, color, options) {
6868

6969
this.vertexVBO = this.gl.createBuffer();
7070
this.gl.bindBuffer(this.gl.ARRAY_BUFFER, this.vertexVBO);
71-
this.gl.bufferData(this.gl.ARRAY_BUFFER, new WebGLFloatArray(vertices), this.gl.STATIC_DRAW);
71+
this.gl.bufferData(this.gl.ARRAY_BUFFER, new Float32Array(vertices), this.gl.STATIC_DRAW);
7272

7373
this.indexVBO = this.gl.createBuffer();
7474
this.gl.bindBuffer(this.gl.ELEMENT_ARRAY_BUFFER, this.indexVBO);
75-
this.gl.bufferData(this.gl.ELEMENT_ARRAY_BUFFER, new WebGLUnsignedShortArray(indices), this.gl.STATIC_DRAW);
75+
this.gl.bufferData(this.gl.ELEMENT_ARRAY_BUFFER, new Uint16Array(indices), this.gl.STATIC_DRAW);
7676
}
7777

7878
this.draw = function(scr) {
@@ -94,7 +94,7 @@ function curve(string, color, options) {
9494
var vertex_source = this.read("shaders/curve.vert").replace("USER_FUNCTION", this.f);
9595
var frag_source = this.read("shaders/curve.frag");
9696

97-
this.program = this.compile_program(vertex_source, frag_source, this.parameters);
97+
this.program = this.compile_program(vertex_source, frag_source, this.parameters, { "position": 0 });
9898
}
9999
}
100100

‎emptytexture.js

Lines changed: 4 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -17,20 +17,17 @@ function emptytexture(context, width, height) {
1717
this.texture = this.gl.createTexture();
1818
this.gl.bindTexture(this.gl.TEXTURE_2D, this.texture);
1919

20-
var pixels = new WebGLFloatArray(width * height * 4);
21-
//this.gl.texImage2D(this.gl.TEXTURE_2D, 0, this.gl.RGBA, width, height, 0, this.gl.RGBA, this.gl.FLOAT, pixels);
22-
this.gl.texImage2D(this.gl.TEXTURE_2D, 0, 0x8814, width, height, 0, this.gl.RGBA, this.gl.FLOAT, pixels);
20+
var pixels = new Float32Array(width * height * 4);
21+
this.gl.texImage2D(this.gl.TEXTURE_2D, 0, this.gl.RGBA, width, height, 0, this.gl.RGBA, this.gl.FLOAT, pixels);
2322

24-
this.gl.enable(this.gl.TEXTURE_2D);
2523
this.gl.texParameteri(this.gl.TEXTURE_2D, this.gl.TEXTURE_MAG_FILTER, this.gl.LINEAR);
2624
this.gl.texParameteri(this.gl.TEXTURE_2D, this.gl.TEXTURE_MIN_FILTER, this.gl.LINEAR);
27-
this.gl.texParameteri(this.gl.TEXTURE_2D, this.gl.TEXTURE_S_WRAP, this.gl.CLAMP);
28-
this.gl.texParameteri(this.gl.TEXTURE_2D, this.gl.TEXTURE_T_WRAP, this.gl.CLAMP);
25+
this.gl.texParameteri(this.gl.TEXTURE_2D, this.gl.TEXTURE_WRAP_S, this.gl.CLAMP_TO_EDGE);
26+
this.gl.texParameteri(this.gl.TEXTURE_2D, this.gl.TEXTURE_WRAP_T, this.gl.CLAMP_TO_EDGE);
2927
this.gl.bindTexture(this.gl.TEXTURE_2D, null);
3028
}
3129

3230
this.bind = function() {
33-
this.gl.enable(this.gl.TEXTURE_2D);
3431
this.gl.bindTexture(this.gl.TEXTURE_2D, this.texture);
3532
}
3633

‎flow.js

Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -186,19 +186,19 @@ function flow(string, options) {
186186

187187
this.vertexVBO = this.gl.createBuffer();
188188
this.gl.bindBuffer(this.gl.ARRAY_BUFFER, this.vertexVBO);
189-
this.gl.bufferData(this.gl.ARRAY_BUFFER, new WebGLFloatArray(vertices), this.gl.STATIC_DRAW);
189+
this.gl.bufferData(this.gl.ARRAY_BUFFER, new Float32Array(vertices), this.gl.STATIC_DRAW);
190190

191191
/* One of the options (currently anticipated from this version) is
192192
* to color the surface with a normal map or a regular texture and
193193
* lighting information for the perception of depth on the object.
194194
*/
195195
this.textureVBO = this.gl.createBuffer();
196196
this.gl.bindBuffer(this.gl.ARRAY_BUFFER, this.textureVBO);
197-
this.gl.bufferData(this.gl.ARRAY_BUFFER, new WebGLFloatArray(texture), this.gl.STATIC_DRAW);
197+
this.gl.bufferData(this.gl.ARRAY_BUFFER, new Float32Array(texture), this.gl.STATIC_DRAW);
198198

199199
this.indexVBO = this.gl.createBuffer();
200200
this.gl.bindBuffer(this.gl.ELEMENT_ARRAY_BUFFER, this.indexVBO);
201-
this.gl.bufferData(this.gl.ELEMENT_ARRAY_BUFFER, new WebGLUnsignedShortArray(indices), this.gl.STATIC_DRAW);
201+
this.gl.bufferData(this.gl.ELEMENT_ARRAY_BUFFER, new Uint16Array(indices), this.gl.STATIC_DRAW);
202202

203203
this.index_ct = indices.length;
204204
}
@@ -227,7 +227,6 @@ function flow(string, options) {
227227
this.gl.bindFramebuffer(this.gl.FRAMEBUFFER, this.fbo);
228228
this.gl.framebufferTexture2D(this.gl.FRAMEBUFFER, this.gl.COLOR_ATTACHMENT0, this.gl.TEXTURE_2D, this.ping, 0);
229229

230-
this.gl.enable(this.gl.TEXTURE_2D);
231230
this.gl.activeTexture(this.gl.TEXTURE0);
232231
this.gl.bindTexture(this.gl.TEXTURE_2D, this.pong);
233232
this.gl.activeTexture(this.gl.TEXTURE1);
@@ -277,7 +276,6 @@ function flow(string, options) {
277276
this.gl.bindFramebuffer(this.gl.FRAMEBUFFER, null);
278277

279278
// the recently-drawn texture
280-
this.gl.enable(this.gl.TEXTURE_2D);
281279
this.gl.activeTexture(this.gl.TEXTURE0);
282280
this.gl.bindTexture(this.gl.TEXTURE_2D, this.ping);
283281
this.gl.drawElements(this.gl.TRIANGLE_STRIP, this.index_ct, this.gl.UNSIGNED_SHORT, 0);
@@ -297,7 +295,7 @@ function flow(string, options) {
297295
var vertex_source = this.read("shaders/flow.vert").replace("USER_FUNCTION", this.f);
298296
var frag_source = this.read("shaders/flow.frag").replace("USER_FUNCTION", this.f);
299297

300-
this.program = this.compile_program(vertex_source, frag_source);
298+
this.program = this.compile_program(vertex_source, frag_source, { "position": 0, "aTextureCoord": 1 });
301299
}
302300
}
303301

‎ftexture.js

Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ function ftexture(context, width, height, f, type) {
2525
this.texture = null;
2626
this.image = null;
2727

28-
this.type = type || 0x8814;
28+
this.type = type || context.RGBA;
2929

3030
this.gl = context;
3131

@@ -36,21 +36,19 @@ function ftexture(context, width, height, f, type) {
3636
this.texture = this.gl.createTexture();
3737
this.gl.bindTexture(this.gl.TEXTURE_2D, this.texture);
3838

39-
var pixels = new WebGLFloatArray(this.width * this.height * 4);
39+
var pixels = new Float32Array(this.width * this.height * 4);
4040
// Pass pixels into the user-provided function
4141
pixels = f(pixels);
4242
this.gl.texImage2D(this.gl.TEXTURE_2D, 0, this.type, this.width, this.height, 0, this.gl.RGBA, this.gl.FLOAT, pixels);
4343

44-
this.gl.enable(this.gl.TEXTURE_2D);
4544
this.gl.texParameteri(this.gl.TEXTURE_2D, this.gl.TEXTURE_MAG_FILTER, this.gl.NEAREST);
4645
this.gl.texParameteri(this.gl.TEXTURE_2D, this.gl.TEXTURE_MIN_FILTER, this.gl.NEAREST);
47-
this.gl.texParameteri(this.gl.TEXTURE_2D, this.gl.TEXTURE_S_WRAP, this.gl.CLAMP);
48-
this.gl.texParameteri(this.gl.TEXTURE_2D, this.gl.TEXTURE_T_WRAP, this.gl.CLAMP);
46+
this.gl.texParameteri(this.gl.TEXTURE_2D, this.gl.TEXTURE_WRAP_S, this.gl.CLAMP_TO_EDGE);
47+
this.gl.texParameteri(this.gl.TEXTURE_2D, this.gl.TEXTURE_WRAP_T, this.gl.CLAMP_TO_EDGE);
4948
this.gl.bindTexture(this.gl.TEXTURE_2D, null);
5049
}
5150

5251
this.bind = function() {
53-
this.gl.enable(this.gl.TEXTURE_2D);
5452
this.gl.bindTexture(this.gl.TEXTURE_2D, this.texture);
5553
}
5654

‎gradient.js

Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -182,19 +182,19 @@ function gradient(string, options) {
182182

183183
this.vertexVBO = this.gl.createBuffer();
184184
this.gl.bindBuffer(this.gl.ARRAY_BUFFER, this.vertexVBO);
185-
this.gl.bufferData(this.gl.ARRAY_BUFFER, new WebGLFloatArray(vertices), this.gl.STATIC_DRAW);
185+
this.gl.bufferData(this.gl.ARRAY_BUFFER, new Float32Array(vertices), this.gl.STATIC_DRAW);
186186

187187
/* One of the options (currently anticipated from this version) is
188188
* to color the surface with a normal map or a regular texture and
189189
* lighting information for the perception of depth on the object.
190190
*/
191191
this.textureVBO = this.gl.createBuffer();
192192
this.gl.bindBuffer(this.gl.ARRAY_BUFFER, this.textureVBO);
193-
this.gl.bufferData(this.gl.ARRAY_BUFFER, new WebGLFloatArray(texture), this.gl.STATIC_DRAW);
193+
this.gl.bufferData(this.gl.ARRAY_BUFFER, new Float32Array(texture), this.gl.STATIC_DRAW);
194194

195195
this.indexVBO = this.gl.createBuffer();
196196
this.gl.bindBuffer(this.gl.ELEMENT_ARRAY_BUFFER, this.indexVBO);
197-
this.gl.bufferData(this.gl.ELEMENT_ARRAY_BUFFER, new WebGLUnsignedShortArray(indices), this.gl.STATIC_DRAW);
197+
this.gl.bufferData(this.gl.ELEMENT_ARRAY_BUFFER, new Uint16Array(indices), this.gl.STATIC_DRAW);
198198

199199
this.index_ct = indices.length;
200200
}
@@ -226,7 +226,6 @@ function gradient(string, options) {
226226
this.gl.bindFramebuffer(this.gl.FRAMEBUFFER, this.fbo);
227227
this.gl.framebufferTexture2D(this.gl.FRAMEBUFFER, this.gl.COLOR_ATTACHMENT0, this.gl.TEXTURE_2D, this.ping, 0);
228228

229-
this.gl.enable(this.gl.TEXTURE_2D);
230229
this.gl.activeTexture(this.gl.TEXTURE0);
231230
this.gl.bindTexture(this.gl.TEXTURE_2D, this.pong);
232231
this.gl.activeTexture(this.gl.TEXTURE1);
@@ -284,7 +283,6 @@ function gradient(string, options) {
284283
this.gl.bindFramebuffer(this.gl.FRAMEBUFFER, null);
285284

286285
// the recently-drawn texture
287-
this.gl.enable(this.gl.TEXTURE_2D);
288286
this.gl.activeTexture(this.gl.TEXTURE0);
289287
this.gl.bindTexture(this.gl.TEXTURE_2D, this.ping);
290288
this.gl.drawElements(this.gl.TRIANGLE_STRIP, this.index_ct, this.gl.UNSIGNED_SHORT, 0);
@@ -310,7 +308,7 @@ function gradient(string, options) {
310308

311309
var frag_source = this.read("shaders/flow.frag");
312310

313-
this.program = this.compile_program(vertex_source, frag_source);
311+
this.program = this.compile_program(vertex_source, frag_source, { "position": 0, "aTextureCoord": 1 });
314312
}
315313
}
316314

‎grapher.js

Lines changed: 25 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -49,6 +49,9 @@ function grapher(options) {
4949
this.parameters = new Array();
5050

5151
this.getContext = function() {
52+
if (this.gl)
53+
return this.gl;
54+
5255
var canvas = document.getElementById("glot");
5356

5457
/* It seems there's not a lot of uniformly-accepted strings for
@@ -67,6 +70,26 @@ function grapher(options) {
6770
} catch (e) { }
6871
}
6972

73+
// The vast majority of this library uses floating-point textures, so
74+
// require the availability of the OES_texture_float extension here.
75+
if (!this.gl.getExtension("OES_texture_float")) {
76+
this.gl = null;
77+
throw "Requires the OES_texture_float extension";
78+
}
79+
80+
/*
81+
// Uncomment, and include webgl-debug.js in .html file (must copy from Khronos repository),
82+
// to debug WebGL errors.
83+
function throwOnGLError(err, funcName, args) {
84+
var errorString = WebGLDebugUtils.glEnumToString(err) +
85+
" was caused by call to " + funcName;
86+
throw errorString;
87+
};
88+
89+
if (this.gl)
90+
this.gl = WebGLDebugUtils.makeDebugContext(this.gl, throwOnGLError);
91+
*/
92+
7093
return this.gl;
7194
}
7295

@@ -260,19 +283,17 @@ function grapher(options) {
260283
* character of the function call, and "gl." referes to the context
261284
* provided by getContext()
262285
*/
263-
this.gl.enable(this.gl.LINE_SMOOTH);
264-
this.gl.enable(this.gl.POINT_SMOOTH);
265286
this.gl.enable(this.gl.BLEND);
266-
this.gl.enable(this.gl.VERTEX_ARRAY);
267287
this.gl.enable(this.gl.DEPTH_TEST);
268288

269289
// Other smoothness and blending options
270290
this.gl.blendFunc(this.gl.SRC_ALPHA, this.gl.ONE_MINUS_SRC_ALPHA);
271-
this.gl.hint(this.gl.LINE_SMOOTH_HINT, this.gl.DONT_CARE);
272291

273292
// Set the line width and point size
274293
this.gl.lineWidth(1.5);
275294

295+
// FIXME: must set the point size using gl_PointSize in the vertex shader.
296+
276297
/* WebGL doesn't support this, it seems. OpenGL ES 2.0 elliminated
277298
* it to obviate the need for dedicated hardware for this task,
278299
* which is a luxury in some sense.

‎grid.js

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -72,12 +72,12 @@ function grid(gl, scr) {
7272

7373
this.vertexVBO = gl.createBuffer();
7474
gl.bindBuffer(gl.ARRAY_BUFFER, this.vertexVBO);
75-
gl.bufferData(gl.ARRAY_BUFFER, new WebGLFloatArray(vertices), gl.STATIC_DRAW);
75+
gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(vertices), gl.STATIC_DRAW);
7676

7777
this.count = indices.length;
7878
this.indexVBO = gl.createBuffer();
7979
gl.bindBuffer(gl.ELEMENT_ARRAY_BUFFER, this.indexVBO);
80-
gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new WebGLUnsignedShortArray(indices), gl.STATIC_DRAW);
80+
gl.bufferData(gl.ELEMENT_ARRAY_BUFFER, new Uint16Array(indices), gl.STATIC_DRAW);
8181
}
8282

8383
this.draw = function(scr) {
@@ -99,7 +99,7 @@ function grid(gl, scr) {
9999
var vertex_source = this.read("shaders/passthru.vert");
100100
var frag_source = this.read("shaders/passthru.frag");
101101

102-
this.program = this.compile_program(vertex_source, frag_source);
102+
this.program = this.compile_program(vertex_source, frag_source, { "position": 0 });
103103
}
104104

105105
this.initialize(scr);

‎nurbs.js

Lines changed: 4 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -102,17 +102,17 @@ function nurbs(knots, cps, degree, color, options) {
102102

103103
this.vertexVBO = this.gl.createBuffer();
104104
this.gl.bindBuffer(this.gl.ARRAY_BUFFER, this.vertexVBO);
105-
this.gl.bufferData(this.gl.ARRAY_BUFFER, new WebGLFloatArray(vertices), this.gl.STATIC_DRAW);
105+
this.gl.bufferData(this.gl.ARRAY_BUFFER, new Float32Array(vertices), this.gl.STATIC_DRAW);
106106

107107
this.lVBO = this.gl.createBuffer();
108108
this.gl.bindBuffer(this.gl.ARRAY_BUFFER, this.lVBO);
109-
this.gl.bufferData(this.gl.ARRAY_BUFFER, new WebGLFloatArray(ls), this.gl.STATIC_DRAW);
109+
this.gl.bufferData(this.gl.ARRAY_BUFFER, new Float32Array(ls), this.gl.STATIC_DRAW);
110110

111111
this.indexVBO = this.gl.createBuffer();
112112
this.gl.bindBuffer(this.gl.ELEMENT_ARRAY_BUFFER, this.indexVBO);
113113

114114
// I think this ought to be changed to STATIC_DRAW
115-
this.gl.bufferData(this.gl.ELEMENT_ARRAY_BUFFER, new WebGLUnsignedShortArray(indices), this.gl.STATIC_DRAW);
115+
this.gl.bufferData(this.gl.ELEMENT_ARRAY_BUFFER, new Uint16Array(indices), this.gl.STATIC_DRAW);
116116
}
117117

118118
this.draw = function(scr) {
@@ -138,7 +138,6 @@ function nurbs(knots, cps, degree, color, options) {
138138
this.gl.bindBuffer(this.gl.ELEMENT_ARRAY_BUFFER, this.indexVBO);
139139

140140
// Enable and bind pertinent textures
141-
this.gl.enable(this.gl.TEXTURE_2D);
142141
this.gl.activeTexture(this.gl.TEXTURE0);
143142
this.gl.bindTexture(this.gl.TEXTURE_2D, this.knotsTexture);
144143
this.gl.activeTexture(this.gl.TEXTURE1);
@@ -153,7 +152,7 @@ function nurbs(knots, cps, degree, color, options) {
153152
var vertex_source = this.read("shaders/nurbs.vert").replace("USER_FUNCTION", "s").replace(/DEGREE/g, this.degree);
154153
var frag_source = this.read("shaders/nurbs.frag");
155154

156-
this.program = this.compile_program(vertex_source, frag_source);
155+
this.program = this.compile_program(vertex_source, frag_source, { "position": 0, "l": 1 });
157156
}
158157
}
159158

0 commit comments

Comments
 (0)