on master help sign in
ready to do some rendering! got gl program initialized and scene tree at console
c8a14ffJohn P Mayer Jr
libraries/Graphics/WebGL.elm+1−1
@@ -10,7 +10,7 @@ import Color (Color)
10import Graphics.Element (Element)
10import Graphics.Element (Element)
11import Native.Graphics.WebGL
11import Native.Graphics.WebGL
12
12
13−type GLPoint = (V3,Color)
13+type GLPoint = { pos: V3, color: Color }
14type GLTriangle = { a: GLPoint, b: GLPoint, c: GLPoint }
14type GLTriangle = { a: GLPoint, b: GLPoint, c: GLPoint }
15type Model = [GLTriangle]
15type Model = [GLTriangle]
16
16
libraries/MJS.elm+3
@@ -11,3 +11,6 @@ data M4x4 = Fake_M4x4
11
11
12v3 : Float -> Float -> Float -> V3
12v3 : Float -> Float -> Float -> V3
13v3 = Native.MJS.v3
13v3 = Native.MJS.v3
14+
15+m4x4identity : M4x4
16+m4x4identity = Native.MJS.m4x4identity
libraries/Native/Graphics/WebGL.js+77−6
@@ -15,21 +15,92 @@ Elm.Native.Graphics.WebGL.make = function(elm) {
15 //var Utils = Elm.Native.Utils.make(elm);
15 //var Utils = Elm.Native.Utils.make(elm);
16 //var Tuple2 = Utils.Tuple2;
16 //var Tuple2 = Utils.Tuple2;
17
17
18+ function createShader(gl, str, type) {
19+ var shader = gl.createShader(type);
20+ gl.shaderSource(shader, str);
21+ gl.compileShader(shader);
22+
23+ if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) {
24+ throw gl.getShaderInfoLog(shader);
25+ }
26+
27+ return shader;
28+ };
29+
30+ function linkProgram(gl, program) {
31+ var vshader = createShader(gl, program.vshaderSource, gl.VERTEX_SHADER);
32+ var fshader = createShader(gl, program.fshaderSource, gl.FRAGMENT_SHADER);
33+ gl.attachShader(program, vshader);
34+ gl.attachShader(program, fshader);
35+ gl.linkProgram(program);
36+ if (!gl.getProgramParameter(program, gl.LINK_STATUS)) {
37+ throw gl.getProgramInfoLog(program);
38+ }
39+ }
40+
41+ function createProgram(gl, vstr, fstr) {
42+ var program = gl.createProgram();
43+ var vshader = createShader(gl, vstr, gl.VERTEX_SHADER);
44+ var fshader = createShader(gl, fstr, gl.FRAGMENT_SHADER);
45+ gl.attachShader(program, vshader);
46+ gl.attachShader(program, fshader);
47+ gl.linkProgram(program);
48+
49+ if (!gl.getProgramParameter(program, gl.LINK_STATUS)) {
50+ throw gl.getProgramInfoLog(program);
51+ }
52+
53+ return program;
54+ };
55+
56+ var geoVert = "attribute vec3 aVertexPosition;\
57+ attribute vec4 aVertexColor;\
58+ \
59+ uniform mat4 uMMatrix;\
60+ uniform mat4 uPMatrix;\
61+ uniform mat4 uVMatrix;\
62+ \
63+ varying vec4 vVertexColor;\
64+ \
65+ void main() {\
66+ gl_Position = uPMatrix * uVMatrix * uMMatrix * vec4(aVertexPosition, 1.0);\
67+ vVertexColor = aVertexColor;\
68+ }"
69+
70+ var geoFrag = "precision mediump float;\
71+ \
72+ varying vec4 vVertexColor;\
73+ \
74+ void main() {\
75+ gl_FragColor = vVertexColor;\
76+ }"
77+
18− function drawGL(ctx,model) {
78+ function drawGL(model) {
19 var scene = model.scene;
79 var scene = model.scene;
20 console.log(scene);
80 console.log(scene);
21 }
81 }
22
82
83+ /*
84+ * Called for new node, caches lots of stuff
85+ */
23 function render(model) {
86 function render(model) {
24 var canvas = newNode('canvas');
87 var canvas = newNode('canvas');
25− gl = canvas.getContext("webgl");
88+ var gl = canvas.getContext("webgl");
89+ var program = createProgram(gl, geoVert, geoFrag);
90+ model.cache = {
91+ gl: gl,
92+ program: program,
93+ };
26− drawGL(gl,model);
94+ drawGL(model);
27 return canvas;
95 return canvas;
28 }
96 }
29
97
98+ /*
99+ * Called at existing node
100+ */
30− function update(canvasNode, _oldModel, newModel) {
101+ function update(canvasNode, oldModel, newModel) {
31− gl = canvasNode.getContext("webgl");
102+ newModel.cache = oldModel.cache;
32− drawGL(gl,newModel)
103+ drawGL(newModel)
33 }
104 }
34
105
35 function glContext(w,h,scene) {
106 function glContext(w,h,scene) {
libraries/Native/MJS.js+33−30
@@ -38,7 +38,7 @@ Elm.Native.MJS.make = function(elm) {
38
38
39 elm.Native = elm.Native || {};
39 elm.Native = elm.Native || {};
40 elm.Native.MJS = elm.Native.MJS || {};
40 elm.Native.MJS = elm.Native.MJS || {};
41− if (elm.Native.WebGL.values) return elm.Native.WebGL.values;
41+ if (elm.Native.MJS.values) return elm.Native.MJS.values;
42
42
43 /*
43 /*
44 * Constant: MJS_VERSION
44 * Constant: MJS_VERSION
@@ -1845,51 +1845,54 @@ Elm.Native.MJS.make = function(elm) {
1845 };
1845 };
1846
1846
1847 return {
1847 return {
1848− v3: A3(V3.$),
1848+ v3: F3(V3.$),
1849 v3clone: V3.clone,
1849 v3clone: V3.clone,
1850− v3add: A2(V3.add),
1850+ v3add: F2(V3.add),
1851− v3sub: A2(V3.sub),
1851+ v3sub: F2(V3.sub),
1852 v3neg: V3.neg,
1852 v3neg: V3.neg,
1853− v3direction: A2(V3.direction),
1853+ v3direction: F2(V3.direction),
1854 v3length: V3.length,
1854 v3length: V3.length,
1855 v3lengthSquared: V3.lengthSquared,
1855 v3lengthSquared: V3.lengthSquared,
1856 v3normalize: V3.normalize,
1856 v3normalize: V3.normalize,
1857− v3scale: A2(V3.scale),
1857+ v3scale: F2(V3.scale),
1858− v3dot: A2(V3.dot),
1858+ v3dot: F2(V3.dot),
1859− v3cross: A2(V3.cross),
1859+ v3cross: F2(V3.cross),
1860− v3mul4x4: A2(V3.mul4x4),
1860+ v3mul4x4: F2(V3.mul4x4),
1861+ /*
1861− m4x4: A16(M4x4.$),
1862+ m4x4: F16(M4x4.$),
1863+ */
1864+ m4x4identity: M4x4.identity,
1862 m4x4clone: M4x4.clone,
1865 m4x4clone: M4x4.clone,
1863 m4x4topLeft3x3: M4x4.topLeft3x3,
1866 m4x4topLeft3x3: M4x4.topLeft3x3,
1864 m4x4inverseOrthonormal: M4x4.inverseOrthonormal,
1867 m4x4inverseOrthonormal: M4x4.inverseOrthonormal,
1865 m4x4inverseTo3x3: M4x4.inverseTo3x3,
1868 m4x4inverseTo3x3: M4x4.inverseTo3x3,
1866− m4x4makeFrustum: A6(M4x4.makeFrustum),
1869+ m4x4makeFrustum: F6(M4x4.makeFrustum),
1867− m4x4makePerspective: A4(M4x4.makePerspective),
1870+ m4x4makePerspective: F4(M4x4.makePerspective),
1868− m4x4makeOrtho: A6(M4x4.makeOrtho),
1871+ m4x4makeOrtho: F6(M4x4.makeOrtho),
1869− m4x4makeOrtho2D: A4(M4x4.makeOrtho2D),
1872+ m4x4makeOrtho2D: F4(M4x4.makeOrtho2D),
1870− m4x4mul: A2(M4x4.mul),
1873+ m4x4mul: F2(M4x4.mul),
1871− m4x4Affine: A2(M4x4.mulAffine),
1874+ m4x4Affine: F2(M4x4.mulAffine),
1872− m4x4makeRotate: A2(M4x4.makeRotate),
1875+ m4x4makeRotate: F2(M4x4.makeRotate),
1873− m4x4rotate: A3(M4x4.rotate),
1876+ m4x4rotate: F3(M4x4.rotate),
1874− m4x4makeScale3: A3(M4x4.makeScale3),
1877+ m4x4makeScale3: F3(M4x4.makeScale3),
1875 m4x4makeScale1: M4x4.makeScale1,
1878 m4x4makeScale1: M4x4.makeScale1,
1876 m4x4makeScale: M4x4.makeScale,
1879 m4x4makeScale: M4x4.makeScale,
1877− m4x4scale3: A4(M4x4.scale3),
1880+ m4x4scale3: F4(M4x4.scale3),
1878− m4x4scale1: A2(M4x4.scale1),
1881+ m4x4scale1: F2(M4x4.scale1),
1879− m4x4scale: A2(M4x4.scale),
1882+ m4x4scale: F2(M4x4.scale),
1880− m4x4makeTranslate3: A3(M4x4.makeTranslate3),
1883+ m4x4makeTranslate3: F3(M4x4.makeTranslate3),
1881 m4x4makeTranslate1: M4x4.makeTranslate1,
1884 m4x4makeTranslate1: M4x4.makeTranslate1,
1882 m4x4makeTranslate: M4x4.makeTranslate,
1885 m4x4makeTranslate: M4x4.makeTranslate,
1883− m4x4translate3: A4(M4x4.translate3),
1886+ m4x4translate3: F4(M4x4.translate3),
1884− m4x4translate1: A2(M4x4.translate1),
1887+ m4x4translate1: F2(M4x4.translate1),
1885− m4x4translate: A2(M4x4.translate),
1888+ m4x4translate: F2(M4x4.translate),
1886− m4x4makeLookAt: A3(M4x4.makeLookAt),
1889+ m4x4makeLookFt: F3(M4x4.makeLookFt),
1887 m4x4transpose: M4x4.transpose,
1890 m4x4transpose: M4x4.transpose,
1888− m4x4transformPoint: A2(M4x4.transformPoint),
1891+ m4x4transformPoint: F2(M4x4.transformPoint),
1889 /*
1892 /*
1890 m4x4_transformLine(m, v, r) {
1893 m4x4_transformLine(m, v, r) {
1891− m4x4_transformPointAffine (m, v, r) {
1894+ m4x4_transformPointFffine (m, v, r) {
1892− m4x4_transformLineAffine(m, v, r) {
1895+ m4x4_transformLineFffine(m, v, r) {
1893 */
1896 */
1894 };
1897 };
1895
1898