diff options
| author | Jon Santmyer <jon@jonsantmyer.com> | 2021-04-24 19:37:31 +0000 |
|---|---|---|
| committer | Jon Santmyer <jon@jonsantmyer.com> | 2021-04-24 19:37:31 +0000 |
| commit | a5f4d66313bb1a455bbc344a671dd16d315a0fdc (patch) | |
| tree | fd68f04802b3e7d199025da7e79a0655715c2351 /blockgame | |
| parent | a6615f0063a308709ef29d7d90350ac824f718aa (diff) | |
| download | website-a5f4d66313bb1a455bbc344a671dd16d315a0fdc.tar.gz website-a5f4d66313bb1a455bbc344a671dd16d315a0fdc.tar.bz2 website-a5f4d66313bb1a455bbc344a671dd16d315a0fdc.zip | |
commit 2
Diffstat (limited to 'blockgame')
| -rw-r--r-- | blockgame/index.html | 16 | ||||
| -rw-r--r-- | blockgame/main.js | 18 | ||||
| -rw-r--r-- | blockgame/shaders.js | 49 |
3 files changed, 83 insertions, 0 deletions
diff --git a/blockgame/index.html b/blockgame/index.html new file mode 100644 index 0000000..a882e14 --- /dev/null +++ b/blockgame/index.html @@ -0,0 +1,16 @@ +<!DOCTYPE html> + +<html> + <head> + <title>WebGL Block Game</title> + <link rel="stylesheet" href="/style.css"> + </head> + <body> + <center> + <div style="margin: 0;position:absolute;top:50%;left:50%;-ms-transform:translate(-50%, -50%);transform:translate(-50%, -50%);"> + <canvas id="glCanvas" width="1024" height="768"></canvas> + </div> + </center> + <script type="module" src="main.js"></script> + </body> +</html> diff --git a/blockgame/main.js b/blockgame/main.js new file mode 100644 index 0000000..d7bf3ea --- /dev/null +++ b/blockgame/main.js @@ -0,0 +1,18 @@ +import * as shaders from "./shaders.js" + +function main() { + const canvas = document.querySelector("#glCanvas"); + const gl = canvas.getContext("webgl") + + if(gl == null) { + alert("Unable to initialize WebGL."); + return; + } + + const shaderProgram = shaders.init(gl); + + gl.clearColor(0.0, 0.0, 0.0, 1.0); + gl.clear(gl.COLOR_BUFFER_BIT); +} + +window.onload = main; diff --git a/blockgame/shaders.js b/blockgame/shaders.js new file mode 100644 index 0000000..f89270a --- /dev/null +++ b/blockgame/shaders.js @@ -0,0 +1,49 @@ +const vs_src = ` + attribute vec4 position; + + uniform mat4 mv_matrix; + uniform mat4 projection_matrix; + + void main() { + gl_Position = projection_matrix * mv_matrix * position; + } +`; + +const fs_src = ` + void main() { + gl_FragColor = vec4(1.0, 1.0, 1.0, 1.0); + } +`; + +export function init(gl) { + const vshader = loadShader(gl, gl.VERTEX_SHADER, vs_src); + const fshader = loadShader(gl, gl.FRAGMENT_SHADER, fs_src); + + const program = gl.createProgram(); + gl.attachShader(program, vshader); + gl.attachShader(program, fshader); + + gl.linkProgram(program); + + if(!gl.getProgramParameter(program, gl.LINK_STATUS)) { + alert("Unable to initialize shader program: " + gl.getProgramInfoLog(program)); + return null; + } + + return program; +} + +export function loadShader(gl, type, src){ + const shader = gl.createShader(type) + + gl.shaderSource(shader, src); + gl.compileShader(shader); + + if(!gl.getShaderParameter(shader, gl.COMPILE_STATUS)) { + alert('Failed to compile shader : ' + gl.getShaderInfoLog(shader)); + gl.deleteShader(shader); + return null; + } + + return shader; +} |