diff options
Diffstat (limited to 'src/index.ts')
| -rw-r--r-- | src/index.ts | 138 |
1 files changed, 5 insertions, 133 deletions
diff --git a/src/index.ts b/src/index.ts index 8a5a067..718a321 100644 --- a/src/index.ts +++ b/src/index.ts @@ -1,141 +1,13 @@ -import {mat4} from 'gl-matrix'; +import Renderer from './view/Renderer'; +import Scene from './view/Scene'; (() => { - const body = document.getElementsByTagName('body')[0]; - const canvas = document.getElementById('rpgedit') as HTMLCanvasElement; if (!canvas) return; - const gl = canvas.getContext('webgl') as WebGLRenderingContext; - if (!gl) - return; - - gl.clearColor(0.0, 0.0, 0.0, 1.0); - gl.enable(gl.DEPTH_TEST); - - - function compileShader(type: number, src: string): WebGLShader|null { - let shader = gl.createShader(type); - if (!shader) { - console.error('Unable to create shader'); - return null; - } - - gl.shaderSource(shader, src); - gl.compileShader(shader); - - if (!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) { - console.error('Unable to compile shader'); - return null; - } - - return shader; - } - - - let shaderVertexPositionAttribute: number; - let shaderPMatrixUniform: WebGLUniformLocation|null; - let shaderVMatrixUniform: WebGLUniformLocation|null; - - function initShaders(): void { - let shaderProgram = gl.createProgram(); - - let vertexShader = compileShader(gl.VERTEX_SHADER, require('./default.vs')); - - let fragmentShaderSrc = require('./default.fs'); - let fragmentShader = compileShader(gl.FRAGMENT_SHADER, require('./default.fs')); - - if (!vertexShader || !fragmentShader) - return; - - gl.attachShader(shaderProgram, vertexShader); - gl.attachShader(shaderProgram, fragmentShader); - - gl.linkProgram(shaderProgram); - if (!gl.getProgramParameter(shaderProgram, gl.LINK_STATUS)) { - console.error('Unable to link shader'); - return; - } - - gl.useProgram(shaderProgram); - - shaderVertexPositionAttribute = gl.getAttribLocation(shaderProgram, "aVertexPosition"); - gl.enableVertexAttribArray(shaderVertexPositionAttribute); - - shaderPMatrixUniform = gl.getUniformLocation(shaderProgram, "uPMatrix"); - shaderVMatrixUniform = gl.getUniformLocation(shaderProgram, "uVMatrix"); - } - - - const triangleVertexPositionBuffer = gl.createBuffer(); - const squareVertexPositionBuffer = gl.createBuffer(); - - function initScene(): void { - gl.bindBuffer(gl.ARRAY_BUFFER, triangleVertexPositionBuffer); - const triangleVertices = [ - 0.0, 1.0, 0.0, - -1.0, -1.0, 0.0, - 1.0, -1.0, 0.0 - ]; - gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(triangleVertices), gl.STATIC_DRAW); - - gl.bindBuffer(gl.ARRAY_BUFFER, squareVertexPositionBuffer); - const squareVertices = [ - 1.0, 1.0, 0.0, - -1.0, 1.0, 0.0, - 1.0, -1.0, 0.0, - -1.0, -1.0, 0.0 - ]; - gl.bufferData(gl.ARRAY_BUFFER, new Float32Array(squareVertices), gl.STATIC_DRAW); - } - - initShaders(); - initScene(); - - const pMatrix = mat4.create(); - const vMatrix = mat4.create(); - - function drawScene(): void { - if (!shaderPMatrixUniform || !shaderVMatrixUniform) - return; - - let width = canvas.width, height = canvas.height - - gl.viewport(0, 0, width, height); - gl.clear(gl.COLOR_BUFFER_BIT | gl.DEPTH_BUFFER_BIT); - - mat4.perspective(pMatrix, 45, width / height, 0.1, 100.0); - gl.uniformMatrix4fv(shaderPMatrixUniform, false, pMatrix); - - mat4.identity(vMatrix); - mat4.translate(vMatrix, vMatrix, [-1.5, 0.0, -7.0]); - gl.uniformMatrix4fv(shaderVMatrixUniform, false, vMatrix); - - gl.bindBuffer(gl.ARRAY_BUFFER, triangleVertexPositionBuffer); - gl.vertexAttribPointer(shaderVertexPositionAttribute, 3, gl.FLOAT, false, 0, 0); - gl.drawArrays(gl.TRIANGLES, 0, 3); - - mat4.translate(vMatrix, vMatrix, [3.0, 0.0, 0.0]); - gl.uniformMatrix4fv(shaderVMatrixUniform, false, vMatrix); - - gl.bindBuffer(gl.ARRAY_BUFFER, squareVertexPositionBuffer); - gl.vertexAttribPointer(shaderVertexPositionAttribute, 3, gl.FLOAT, false, 0, 0); - gl.drawArrays(gl.TRIANGLE_STRIP, 0, 4); - } - - function setSize(): void { - var e = document.documentElement; - var w = window.innerWidth || e.clientWidth || body.clientWidth; - var h = window.innerHeight || e.clientHeight || body.clientHeight; - - canvas.width = w; - canvas.height = h; - - drawScene() - } - - window.addEventListener('resize', () => setSize()); - setSize(); + const renderer = new Renderer(canvas); + const scene = new Scene(renderer); + scene.draw(); })(); |