Skip to content

Commit 90e997b

Browse files
Eric RowellEric Rowell
authored andcommitted
setup some things I ended up not using
1 parent e3f0583 commit 90e997b

File tree

5 files changed

+48
-36
lines changed

5 files changed

+48
-36
lines changed

engine/dist/ElGrapho.js

Lines changed: 23 additions & 17 deletions
Original file line numberDiff line numberDiff line change
@@ -476,26 +476,24 @@ module.exports = `#version 300 es
476476
//https://www.desultoryquest.com/blog/drawing-anti-aliased-circular-points-using-opengl-slash-webgl/
477477
//#extension GL_OES_standard_derivatives : enable
478478

479-
//https://www.desultoryquest.com/blog/drawing-anti-aliased-circular-points-using-opengl-slash-webgl/
479+
// https://www.desultoryquest.com/blog/drawing-anti-aliased-circular-points-using-opengl-slash-webgl/
480+
// https://www.desultoryquest.com/blog/downloads/code/points.js
480481
precision mediump float;
481482
in vec4 vVertexColor;
482483
out vec4 fragColor;
483484

484485
void main(void) {
485486
float r = 0.0, delta = 0.0, alpha = 1.0;
486487
vec2 cxy = 2.0 * gl_PointCoord - 1.0;
487-
488488
r = dot(cxy, cxy);
489+
489490
if (r > 1.0) {
490491
discard;
491492
}
492493

493-
// r = dot(cxy, cxy);
494494
// delta = fwidth(r);
495495
// alpha = 1.0 - smoothstep(1.0 - delta, 1.0 + delta, r);
496-
// if (r > 1.0) {
497-
// discard;
498-
// }
496+
499497

500498

501499

@@ -2071,11 +2069,9 @@ let WebGL = function(config) {
20712069
let gl = layer.scene.context;
20722070
let hitGl = layer.hit.context;
20732071

2074-
gl.clearColor(1.0, 1.0, 1.0, 1.0);
20752072
gl.enable(gl.DEPTH_TEST);
2076-
//gl.getExtension('OES_standard_derivatives');
2073+
//gl.enable(gl.BLEND);
20772074

2078-
hitGl.clearColor(1.0, 1.0, 1.0, 1.0);
20792075
hitGl.enable(hitGl.DEPTH_TEST);
20802076
};
20812077

@@ -2334,9 +2330,14 @@ WebGL.prototype = {
23342330
drawScene: function(panX, panY, zoomX, zoomY, magicZoom, nodeSize, focusedGroup, hoverNode) {
23352331
let layer = this.layer;
23362332
let gl = layer.scene.context;
2333+
2334+
2335+
2336+
23372337
let modelViewMatrix = mat4.create();
23382338
let projectionMatrix = mat4.create();
23392339

2340+
23402341
// const fieldOfView = 45 * Math.PI / 180; // in radians
23412342
// const aspect = layer.width / layer.height;
23422343
// const zNear = 0.01;
@@ -2350,29 +2351,33 @@ WebGL.prototype = {
23502351
let far = 11.0;
23512352

23522353
gl.viewport(0, 0, layer.width*Concrete.PIXEL_RATIO, layer.height*Concrete.PIXEL_RATIO);
2354+
2355+
gl.clearColor(1, 1, 1, 1);
23532356
gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
2357+
//gl.blendFunc(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA); // To disable the background color of the canvas element
23542358
mat4.ortho(projectionMatrix, left, right, bottom, top, near, far);
23552359
mat4.translate(modelViewMatrix, modelViewMatrix, [panX, panY, 0]);
23562360
mat4.scale(modelViewMatrix, modelViewMatrix, [zoomX, zoomY, 1]);
23572361

23582362
//console.log(modelViewMatrix);
23592363

2360-
// each draw instruction is layered beneath current bitmap, so have to do them in reverse
2361-
if (this.buffers.points) {
2362-
this.drawScenePoints(projectionMatrix, modelViewMatrix, magicZoom, nodeSize, focusedGroup);
2363-
this.drawScenePointStrokes(projectionMatrix, modelViewMatrix, magicZoom, nodeSize, focusedGroup, hoverNode);
2364-
2365-
2366-
}
2367-
23682364
if (this.buffers.triangles) {
23692365
this.drawSceneTriangles(projectionMatrix, modelViewMatrix, magicZoom, nodeSize, focusedGroup);
23702366
}
2367+
2368+
if (this.buffers.points) {
2369+
this.drawScenePointStrokes(projectionMatrix, modelViewMatrix, magicZoom, nodeSize, focusedGroup, hoverNode);
2370+
this.drawScenePoints(projectionMatrix, modelViewMatrix, magicZoom, nodeSize, focusedGroup);
2371+
}
23712372
},
23722373
// TODO: need to abstract most of this away because it's copied from drawScene
23732374
drawHit: function(panX, panY, zoomX, zoomY, magicZoom, nodeSize) {
23742375
let layer = this.layer;
23752376
let gl = layer.hit.context;
2377+
2378+
2379+
2380+
23762381
let modelViewMatrix = mat4.create();
23772382
let projectionMatrix = mat4.create();
23782383
//let shaderProgram = this.shaderPrograms.hit;
@@ -2393,6 +2398,7 @@ WebGL.prototype = {
23932398
let far = 100000.0;
23942399

23952400
gl.viewport(0, 0, layer.width*Concrete.PIXEL_RATIO, layer.height*Concrete.PIXEL_RATIO);
2401+
gl.clearColor(1, 1, 1, 1);
23962402
gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
23972403
//mat4.perspective(projectionMatrix, fieldOfView, aspect, zNear, zFar);
23982404
mat4.ortho(projectionMatrix, left, right, bottom, top, near, far);

engine/dist/ElGrapho.min.js

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

engine/src/WebGL.js

Lines changed: 19 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -15,11 +15,9 @@ let WebGL = function(config) {
1515
let gl = layer.scene.context;
1616
let hitGl = layer.hit.context;
1717

18-
gl.clearColor(1.0, 1.0, 1.0, 1.0);
1918
gl.enable(gl.DEPTH_TEST);
20-
//gl.getExtension('OES_standard_derivatives');
19+
//gl.enable(gl.BLEND);
2120

22-
hitGl.clearColor(1.0, 1.0, 1.0, 1.0);
2321
hitGl.enable(hitGl.DEPTH_TEST);
2422
};
2523

@@ -278,9 +276,14 @@ WebGL.prototype = {
278276
drawScene: function(panX, panY, zoomX, zoomY, magicZoom, nodeSize, focusedGroup, hoverNode) {
279277
let layer = this.layer;
280278
let gl = layer.scene.context;
279+
280+
281+
282+
281283
let modelViewMatrix = mat4.create();
282284
let projectionMatrix = mat4.create();
283285

286+
284287
// const fieldOfView = 45 * Math.PI / 180; // in radians
285288
// const aspect = layer.width / layer.height;
286289
// const zNear = 0.01;
@@ -294,29 +297,33 @@ WebGL.prototype = {
294297
let far = 11.0;
295298

296299
gl.viewport(0, 0, layer.width*Concrete.PIXEL_RATIO, layer.height*Concrete.PIXEL_RATIO);
300+
301+
gl.clearColor(1, 1, 1, 1);
297302
gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
303+
//gl.blendFunc(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA); // To disable the background color of the canvas element
298304
mat4.ortho(projectionMatrix, left, right, bottom, top, near, far);
299305
mat4.translate(modelViewMatrix, modelViewMatrix, [panX, panY, 0]);
300306
mat4.scale(modelViewMatrix, modelViewMatrix, [zoomX, zoomY, 1]);
301307

302308
//console.log(modelViewMatrix);
303309

304-
// each draw instruction is layered beneath current bitmap, so have to do them in reverse
305-
if (this.buffers.points) {
306-
this.drawScenePoints(projectionMatrix, modelViewMatrix, magicZoom, nodeSize, focusedGroup);
307-
this.drawScenePointStrokes(projectionMatrix, modelViewMatrix, magicZoom, nodeSize, focusedGroup, hoverNode);
308-
309-
310-
}
311-
312310
if (this.buffers.triangles) {
313311
this.drawSceneTriangles(projectionMatrix, modelViewMatrix, magicZoom, nodeSize, focusedGroup);
314312
}
313+
314+
if (this.buffers.points) {
315+
this.drawScenePointStrokes(projectionMatrix, modelViewMatrix, magicZoom, nodeSize, focusedGroup, hoverNode);
316+
this.drawScenePoints(projectionMatrix, modelViewMatrix, magicZoom, nodeSize, focusedGroup);
317+
}
315318
},
316319
// TODO: need to abstract most of this away because it's copied from drawScene
317320
drawHit: function(panX, panY, zoomX, zoomY, magicZoom, nodeSize) {
318321
let layer = this.layer;
319322
let gl = layer.hit.context;
323+
324+
325+
326+
320327
let modelViewMatrix = mat4.create();
321328
let projectionMatrix = mat4.create();
322329
//let shaderProgram = this.shaderPrograms.hit;
@@ -337,6 +344,7 @@ WebGL.prototype = {
337344
let far = 100000.0;
338345

339346
gl.viewport(0, 0, layer.width*Concrete.PIXEL_RATIO, layer.height*Concrete.PIXEL_RATIO);
347+
gl.clearColor(1, 1, 1, 1);
340348
gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT);
341349
//mat4.perspective(projectionMatrix, fieldOfView, aspect, zNear, zFar);
342350
mat4.ortho(projectionMatrix, left, right, bottom, top, near, far);

engine/src/shaders/point.frag

Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -3,26 +3,24 @@
33
//https://www.desultoryquest.com/blog/drawing-anti-aliased-circular-points-using-opengl-slash-webgl/
44
//#extension GL_OES_standard_derivatives : enable
55

6-
//https://www.desultoryquest.com/blog/drawing-anti-aliased-circular-points-using-opengl-slash-webgl/
6+
// https://www.desultoryquest.com/blog/drawing-anti-aliased-circular-points-using-opengl-slash-webgl/
7+
// https://www.desultoryquest.com/blog/downloads/code/points.js
78
precision mediump float;
89
in vec4 vVertexColor;
910
out vec4 fragColor;
1011

1112
void main(void) {
1213
float r = 0.0, delta = 0.0, alpha = 1.0;
1314
vec2 cxy = 2.0 * gl_PointCoord - 1.0;
14-
1515
r = dot(cxy, cxy);
16+
1617
if (r > 1.0) {
1718
discard;
1819
}
1920

20-
// r = dot(cxy, cxy);
2121
// delta = fwidth(r);
2222
// alpha = 1.0 - smoothstep(1.0 - delta, 1.0 + delta, r);
23-
// if (r > 1.0) {
24-
// discard;
25-
// }
23+
2624

2725

2826

package-lock.json

Lines changed: 1 addition & 1 deletion
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

0 commit comments

Comments
 (0)