b01cf1d · elk · git.iko.soy

git.iko.soy/elk

webgl textures!

commitb01cf1d9f475d265473977f75bb4e70d5ba4c398 authorJohn P Mayer Jr <john.p.mayer.jr@gmail.com> dateThu 27 Feb 2014, 18:24 (13 years ago) parenta428bef

8 files changed+128−9

compare with master

unifiedsplit

compiler/Parse/Helpers.hs+2 compiler/SourceSyntax/Literal.hs+2−1 compiler/Type/Constrain/Expression.hs+5−2 libraries/Graphics/WebGL.elm+8−1 libraries/MJS.elm+3−1 libraries/Native/Graphics/WebGL.js+60−4 tests/test-files/good/Crate.elm+48 tests/test-files/good/woodCrate.JPG

compiler/Parse/Helpers.hs+2

@@ -355,9 +355,11 @@ glSource src =

355355 then case tipe of

356356 GLS.Int -> return (qual,Literal.Int,name)

357357 GLS.Float -> return (qual,Literal.Float,name)

358+ GLS.Vec2 -> return (qual,V2,name)

358359 GLS.Vec3 -> return (qual,V3,name)

359360 GLS.Vec4 -> return (qual,V4,name)

360361 GLS.Mat4 -> return (qual,M4,name)

362+ GLS.Sampler2D -> return (qual,Texture,name)

361363 _ -> []

362364 else []

363365 _ -> []

compiler/SourceSyntax/Literal.hs+2−1

@@ -21,12 +21,13 @@ instance Pretty Literal where

2121 Str s -> PP.text . show $ s

2222 Boolean bool -> PP.text (show bool)

2323

24−data GLTipe = Int | Float | V3 | V4 | M4 | Texture

24+data GLTipe = Int | Float | V2 | V3 | V4 | M4 | Texture

2525 deriving (Show)

2626

2727glTipeName :: GLTipe -> String

2828glTipeName Int = "Int"

2929glTipeName Float = "Float"

30+glTipeName V2 = "MJS.V2"

3031glTipeName V3 = "MJS.V3"

3132glTipeName V4 = "MJS.V4"

3233glTipeName M4 = "MJS.M4x4"

compiler/Type/Constrain/Expression.hs+5−2

@@ -9,7 +9,6 @@ import qualified Data.Map as Map

99import qualified Text.PrettyPrint as PP

1010

1111import SourceSyntax.Literal as Lit

12−import SourceSyntax.Pattern (Pattern, boundVars)

1312import SourceSyntax.Annotation as Ann

1413import SourceSyntax.Expression

1514import qualified SourceSyntax.Pattern as P

@@ -39,7 +38,11 @@ constrain env (A region expr) tipe =

3938 let

4039 shaderTipe a u v = Env.get env Env.types "Graphics.WebGL.Shader" <| a <| u <| v

4140 glTipe = Env.get env Env.types . Lit.glTipeName

42− makeRec accessor baseRec = record (Map.map (\t -> [glTipe t]) $ accessor gltipe) baseRec

41+ makeRec accessor baseRec =

42+ let decls = accessor gltipe

43+ in if Map.size decls == 0

44+ then baseRec

45+ else record (Map.map (\t -> [glTipe t]) decls) baseRec

4346 attribute = makeRec Lit.attribute attr

4447 uniform = makeRec Lit.uniform unif

4548 varying = makeRec Lit.varying (TermN EmptyRecord1)

libraries/Graphics/WebGL.elm+8−1

@@ -1,10 +1,12 @@

2−module Graphics.WebGL (mapTriangle, zipTriangle, model, webgl) where

2+module Graphics.WebGL (mapTriangle, zipTriangle, loadTex, model, webgl) where

44{-| WebGL -}

66import Graphics.Element (Element)

7+import Http (Response)

78import Native.Graphics.WebGL

9+import Signal (Signal)

810

911type Triangle a = (a,a,a)

1012

@@ -16,6 +18,11 @@ zipTriangle f (x,y,z) (x',y',z') = (f x x', f y y', f z z')

1618

1719data Shader attr unif vary = Shader

1820

21+data Texture = Texture

22+

23+loadTex : String -> Signal (Response Texture)

24+loadTex = Native.Graphics.WebGL.loadTex

25+

1926data Model = Model

2027

2128model : Shader attr unif vary -> Shader {} unif vary -> [Triangle attr] -> unif -> Model

libraries/MJS.elm+3−1

@@ -12,7 +12,9 @@ Both vectors and matrices are immutable.

1212

1313import Native.MJS

1414

15−data V3 = Dummy_V3

15+data V2 = V2

16+data V3 = V3

17+data V4 = V4

1618

1719v3 : Float -> Float -> Float -> V3

1820v3 = Native.MJS.v3

libraries/Native/Graphics/WebGL.js+60−4

@@ -9,13 +9,35 @@ Elm.Native.Graphics.WebGL.make = function(elm) {

99 if (elm.Native.Graphics.WebGL.values) return elm.Native.Graphics.WebGL.values;

1010

1111 var newNode = ElmRuntime.use(ElmRuntime.Render.Utils).newElement;

12−

13− var Signal = Elm.Signal.make(elm);

1412 var newElement = Elm.Graphics.Element.make(elm).newElement;

13+

14+ var List = Elm.Native.List.make(elm);

15+ var MJS = Elm.Native.MJS.make(elm);

1516 var Utils = Elm.Native.Utils.make(elm);

17+ var Signal = Elm.Signal.make(elm);

1618 var Tuple2 = Utils.Tuple2;

17− var MJS = Elm.Native.MJS.make(elm);

18− var List = Elm.Native.List.make(elm);

19+

20+ function loadTex(source) {

21+

22+ var response = Signal.constant(elm.Http.values.Waiting);

23+

24+ var img = new Image();

25+

26+ img.onload = function() {

27+ var success = elm.Http.values.Success({img:img});

28+ elm.notify(response.id, success);

29+ }

30+

31+ img.onerror = function(e) {

32+ var failure = A2(elm.Http.values.Failure,0,"Failed");

33+ elm.notify(response.id, failure);

34+ }

35+

36+ img.src = source;

37+

38+ return response;

39+

40+ }

1941

2042 function model(vert, frag, buffer, uniforms) {

2143

@@ -28,6 +50,21 @@ Elm.Native.Graphics.WebGL.make = function(elm) {

2850

2951 }

3052

53+ function do_texture (gl, img) {

54+

55+ var tex = gl.createTexture();

56+ console.log("Created texture");

57+ gl.bindTexture(gl.TEXTURE_2D, tex);

58+ gl.pixelStorei(gl.UNPACK_FLIP_Y_WEBGL, true);

59+ gl.texImage2D(gl.TEXTURE_2D, 0, gl.RGBA, gl.RGBA, gl.UNSIGNED_BYTE, img);

60+ gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, gl.LINEAR);

61+ gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, gl.LINEAR);

62+ gl.generateMipmap(gl.TEXTURE_2D);

63+ //gl.bindTexture(gl.TEXTURE0, null);

64+ return tex;

65+

66+ }

67+

3168 function do_compile (gl, src, tipe) {

3269

3370 var shader = gl.createShader(tipe);

@@ -171,6 +208,7 @@ Elm.Native.Graphics.WebGL.make = function(elm) {

171208 gl.useProgram(program);

172209

173210 var numUniforms = gl.getProgramParameter(program, gl.ACTIVE_UNIFORMS);

211+ var textureCounter = 0;

174212 for (var i = 0; i < numUniforms; i += 1) {

175213 var uniform = gl.getActiveUniform(program, i);

176214 var uniformLocation = gl.getUniformLocation(program, uniform.name);

@@ -187,6 +225,23 @@ Elm.Native.Graphics.WebGL.make = function(elm) {

187225 case gl.FLOAT_MAT4:

188226 gl.uniformMatrix4fv(uniformLocation, false, m.uniforms[uniform.name]);

189227 break;

228+ case gl.SAMPLER_2D:

229+ var texture = m.uniforms[uniform.name];

230+ var tex = undefined;

231+ if (texture.id) {

232+ tex = model.cache.textures[texture.id];

233+ } else {

234+ texture.id = Utils.guid();

235+ }

236+ if (!tex) {

237+ tex = do_texture(gl, texture.img);

238+ }

239+ var activeName = 'TEXTURE' + textureCounter;

240+ gl.activeTexture(gl[activeName]);

241+ gl.bindTexture(gl.TEXTURE_2D,tex);

242+ gl.uniform1i(uniformLocation, textureCounter);

243+ textureCounter += 1;

244+ break;

190245 default:

191246 console.log("Unsupported uniform type: " + uniform.type);

192247 break;

@@ -296,6 +351,7 @@ Elm.Native.Graphics.WebGL.make = function(elm) {

296351 }

297352

298353 return elm.Native.Graphics.WebGL.values = {

354+ loadTex:loadTex,

299355 model:F4(model),

300356 webgl:F2(webgl)

301357 };

tests/test-files/good/Crate.elmnew file+48

@@ -0,0 +1,48 @@

2+module Crate where

4+import Http (..)

5+import MJS (..)

6+import Graphics.WebGL (..)

8+pul = v3 -1 1 0

9+pur = v3 1 1 0

10+pbl = v3 -1 -1 0

11+pbr = v3 1 -1 0

12+

13+mesh : [Triangle { pos : V3 }]

14+mesh = map (mapTriangle (\pos -> {pos=pos})) <|

15+ [(pul,pur,pbl),(pbl,pur,pbr)]

16+

17+vert : Shader { pos : V3 } u { coord : V2 }

18+vert = [glShader|

19+attribute vec3 pos;

20+varying vec2 coord;

21+void main () {

22+ gl_Position = vec4(pos, 1.0);

23+ coord = pos.xy;

24+}

25+|]

26+

27+frag : Shader {} { u | crate : Texture } { coord : V2 }

28+frag = [glShader|

29+precision mediump float;

30+uniform sampler2D crate;

31+varying vec2 coord;

32+void main () {

33+ gl_FragColor = texture2D(crate, coord);

34+}

35+|]

36+

37+crateTex : Signal (Response Texture)

38+crateTex = loadTex "woodCrate.JPG"

39+

40+content : Response Texture -> [Model]

41+content response = case response of

42+ Waiting -> []

43+ Failure i s -> []

44+ Success tex -> [model vert frag mesh { crate = tex }]

45+

46+main = webgl (400,400) <~ (content <~ crateTex)

47+

48+

tests/test-files/good/woodCrate.JPGnew file

Binary file not shown.