Haxe＋WebGLで最小限のコードで三角形を描く

Haxe3でWebGLを使って三角形を表示するプログラムを書きました。こちらのコード( https://github.com/skial/haxe-examples/blob/master/2.08/webgl_lesson_01/src/Main.hx )を参考にしました。多分これも元はhttp://learningwebgl.com/blog/?p=28 だと思います。

好きにf××kしてよいとのことだったので、untypedを使ってる部分の削除やhttp://qiita.com/jonigata/items/7c322fd5d5117d52a97a と同じような処置を行いました。

```haxe:Triangle.hx
import js.html.webgl.RenderingContext;

@:expose
class WebGL {
    static function main() {}

    public static var vertexShaderSource = "
        attribute vec3 aVertexPosition;

        void main(void) {
            gl_Position = vec4(aVertexPosition, 1.0);
        }
";
    
    public static var fragmentShaderSource = "
        precision mediump float;

        void main(void) {
            gl_FragColor = vec4(0.9, 0.9, 0.9, 1.0);
        }
";
    
    
    static function start(canvas: js.html.CanvasElement) {
        initGL(canvas);

        initShaders();
        initBuffers();

        gl.enable(RenderingContext.DEPTH_TEST);
        gl.viewport(0, 0, canvas.width, canvas.height);

        gl.clearColor(0.0, 0.0, 0.0, 1.0);
        gl.clear(
            RenderingContext.COLOR_BUFFER_BIT |
            RenderingContext.DEPTH_BUFFER_BIT);

        drawScene();
    }

    static private function initGL(canvas: js.html.CanvasElement) {
        try {
            gl = canvas.getContext("experimental-webgl");
        } catch (e: Dynamic) {}
        if (gl == null) {
            js.Lib.alert("Could not initialise WebGL, sorry :-(");
        }
    }

    public static function initShaders():Void {
        var vertexShader =
            getShader(RenderingContext.VERTEX_SHADER, vertexShaderSource);
        var fragmentShader =
            getShader(RenderingContext.FRAGMENT_SHADER, fragmentShaderSource);
		
        shaderProgram = gl.createProgram();
        gl.attachShader(shaderProgram, vertexShader);
        gl.attachShader(shaderProgram, fragmentShader);
        gl.linkProgram(shaderProgram);
		
        if (!gl.getProgramParameter(
                shaderProgram, RenderingContext.LINK_STATUS)) {
            js.Lib.alert('Could not initialise shaders');
        }
		
        gl.useProgram(shaderProgram);
		
        vertexPositionAttribute =
            gl.getAttribLocation(shaderProgram, 'aVertexPosition');
        gl.enableVertexAttribArray(vertexPositionAttribute);
    }

    public static function getShader(shaderType: Int, str: String) {
        var shader = gl.createShader(shaderType);

        gl.shaderSource(shader, str);
        gl.compileShader(shader);

        if (!gl.getShaderParameter(shader, RenderingContext.COMPILE_STATUS)) {
            js.Lib.alert(gl.getShaderInfoLog(shader));
            return null;
        }

        return shader;
    }
	
    public static function initBuffers() {
        triangleVertexPositionBuffer = gl.createBuffer();
        gl.bindBuffer(
            RenderingContext.ARRAY_BUFFER, triangleVertexPositionBuffer);
        var vertices:Array<Float> = [0.0, 1.0, 0.0,
                                     -1.0, -1.0, 0.0,
                                     1.0, -1.0, 0.0];
        gl.bufferData(
            RenderingContext.ARRAY_BUFFER,
            cast new js.html.Float32Array(cast vertices),
            RenderingContext.STATIC_DRAW);
        itemSize = 3;
        numItems = 3;
    }

    public static function drawScene() {
        gl.bindBuffer(
            RenderingContext.ARRAY_BUFFER, triangleVertexPositionBuffer);
        gl.vertexAttribPointer(
            vertexPositionAttribute,
            itemSize, RenderingContext.FLOAT, false, 0, 0);
        gl.drawArrays(RenderingContext.TRIANGLES, 0, numItems);
    }
	
    
    static private var gl: js.html.webgl.RenderingContext;
    static private var shaderProgram;
    static private var vertexPositionAttribute;
    static private var triangleVertexPositionBuffer;
    static private var itemSize;
    static private var numItems;
    
}
```

```html:triangle.html
<!doctype html>
<html lang="ja">
  <head>
    <meta charset="utf-8">
    <title>WebGL</title>
    <script src="./webgl.js"></script>

  </head>
  <body onload="WebGL.start(document.getElementById('main-screen'))">
    <canvas id="main-screen" style="border-width: 1px;border-style: solid;" width="640" height="480">
    </canvas>
  </body>
</html>
```