Zenn
Open4

WebGL-Native: DOSBoxのサポート

okuokuokuoku

フレームバッファの実装

DOSBoxは描画にSDLを直接利用しており、Emscriptenはこの実装にはCanvas APIを使っている。 ...流石にこのためだけにCanvasの実装を考えるのはやりすぎ感があるので、今回は自分のWebGLを使って専用品を用意した。

https://github.com/okuoku/cwgl-proto/commit/29c42f1923580e2dc4055a70fe17144d46689115

頂点シェーダがひでぇな。。

        const prog_v =
            "attribute vec2 pos;\n" +
            "varying highp vec2 cd;\n" +
            "uniform vec4 loc;\n" + /* loc = (offsx,offsy,magx,magy) */
            "void main(void){\n" +
            "  cd = vec2((pos.x + 1.0)/2.0,(1.0 - pos.y)/2.0);\n" +
            "  gl_Position = vec4(loc.x + pos.x * loc.z, loc.y + pos.y * loc.w, 0.0, 1.0);\n" +
            "}";

        const prog_p = 
            "uniform sampler2D tex;\n" +
            "varying highp vec2 cd;\n" +
            "void main(void){\n" +
            "  gl_FragColor = texture2D(tex, cd);\n" +
            "}";

かけ算一発で良いはず。。

Canvasとしては createImageData と putImageData の2つだけを実装している。Flipの直前に毎回テクスチャを転送し、描画することになる。

            GL.texImage2D(GL.TEXTURE_2D, 0, GL.RGBA, 
                          img.width, img.height, 0,
                          GL.RGBA, GL.UNSIGNED_BYTE, img.data);