@@ -5,72 +5,77 @@ import MJS (V3,M4x4,v3,makeRotate,makePerspective,makeLookAt,mul)
55import Graphics.WebGL (Triangle, zipTriangle, Shader, Model, model, webgl)
66import Window(dimensions)
77
8−-- Define what our geometry looks like
9−
10−p0 = v3 1 1 1
11−p1 = v3 -1 1 1
12−p2 = v3 -1 -1 1
13−p3 = v3 1 -1 1
14−p4 = v3 1 -1 -1
15−p5 = v3 1 1 -1
16−p6 = v3 -1 1 -1
17−p7 = v3 -1 -1 -1
18−
19−front = [(p0,p1,p2),(p2,p3,p0)]
20−back = [(p5,p6,p7),(p7,p4,p5)]
21−right = [(p0,p3,p4),(p4,p5,p0)]
22−left = [(p1,p2,p7),(p7,p6,p1)]
23−top = [(p0,p5,p6),(p6,p1,p0)]
24−bottom = [(p3,p4,p7),(p7,p2,p3)]
25−
26−positions = front ++ back ++ right ++ left ++ top ++ bottom
27−
28−toV3 color =
29− let c = toRgb color
30− in v3 (toFloat c.red / 255) (toFloat c.green / 255) (toFloat c.blue / 255)
31−
32−colors : [Triangle V3]
33−colors =
34− concatMap (\c' -> let c = toV3 c' in repeat 2 (c,c,c))
35− [gray,red,green,blue,yellow,purple]
36−
37−mesh : [Triangle {pos : V3, color : V3}]
38−mesh = zipWith (zipTriangle (\pos color -> { pos = pos, color = color })) positions colors
39−
40−per : M4x4
41−per = makePerspective 45 1 0.01 100
42−
43−cam : M4x4
44−cam = makeLookAt (v3 0 0 5) (v3 0 0 0) (v3 0 1 0)
8+-- Create a cube in which each point has a color
9+
10+type ColorPoint = { color:V3, point:V3 }
11+
12+face : Color -> V3 -> V3 -> V3 -> V3 -> [Triangle ColorPoint]
13+face color a b c d =
14+ let toV3 color =
15+ let c = toRgb color
16+ in v3 (toFloat c.red / 255) (toFloat c.green / 255) (toFloat c.blue / 255)
17+ p = ColorPoint (toV3 color)
18+ in
19+ [ (p a, p b, p c), (p c, p d, p a) ]
20+
21+cube : [Triangle ColorPoint]
22+cube =
23+ let rft = v3 1 1 1 -- right, front, top
24+ lft = v3 -1 1 1 -- left, front, top
25+ lbt = v3 -1 -1 1
26+ rbt = v3 1 -1 1
27+ rbb = v3 1 -1 -1
28+ rfb = v3 1 1 -1
29+ lfb = v3 -1 1 -1
30+ lbb = v3 -1 -1 -1
31+ in
32+ concat [ face green rft rfb rbb rbt -- right
33+ , face blue rft rfb lfb lft -- front
34+ , face purple lft lfb lbb lbt -- left
35+ , face orange rbt rbb lbb lbt -- back
36+ ]
37+
38+-- Create the scene
39+
40+main : Signal Element
41+main = webgl (400,400) <~ lift scene angle
4542
4643angle : Signal Float
47−angle = foldp (\dt theta -> theta + dt / 10000) 0 (fps 25)
44+angle = foldp (\dt theta -> theta + dt / 5000) 0 (fps 25)
4845
49−rot : Signal { rot : M4x4, per : M4x4, cam : M4x4, shade : Float }
50−rot = (\t -> { rot = mul (makeRotate (3*t) (v3 0 1 0)) (makeRotate (2*t) (v3 1 0 0)), per = per, cam = cam, shade = 0.8 }) <~ angle
46+scene : Float -> [Model]
47+scene angle =
48+ [ model vertexShader fragmentShader cube (uniforms angle) ]
5149
52−draw : Signal [Model]
53−draw = combine [ model vertexShader fragmentShader mesh <~ rot ]
50+uniforms : Float -> { rotation:M4x4, perspective:M4x4, camera:M4x4, shade:Float }
51+uniforms t =
52+ { rotation = mul (makeRotate (3*t) (v3 0 1 0)) (makeRotate (2*t) (v3 1 0 0))
53+ , perspective = makePerspective 45 1 0.01 100
54+ , camera = makeLookAt (v3 0 0 5) (v3 0 0 0) (v3 0 1 0)
55+ , shade = 0.8
56+ }
5457
55−main = webgl <~ dimensions ~ draw
58+-- Shaders
5659
57−vertexShader : Shader {a | pos : V3, color : V3} {b | rot : M4x4, per : M4x4, cam : M4x4} {vcolor : V3}
60+vertexShader : Shader { attr | point:V3, color:V3 }
61+ { unif | rotation:M4x4, perspective:M4x4, camera:M4x4 }
62+ { vcolor:V3 }
5863vertexShader = [glShader|
5964
60−attribute vec3 pos;
65+attribute vec3 point;
6166attribute vec3 color;
62−uniform mat4 per;
63−uniform mat4 cam;
64−uniform mat4 rot;
67+uniform mat4 perspective;
68+uniform mat4 camera;
69+uniform mat4 rotation;
6570varying vec3 vcolor;
6671void main () {
67− gl_Position = per * cam * rot * vec4(pos, 1.0);
72+ gl_Position = perspective * camera * rotation * vec4(point, 1.0);
6873 vcolor = color;
6974}
7075
7176|]
7277
73−fragmentShader : Shader {} {b | shade : Float} {vcolor : V3}
78+fragmentShader : Shader {} {u | shade : Float} {vcolor : V3}
7479fragmentShader = [glShader|
7580
7681precision mediump float;