From a5f4d66313bb1a455bbc344a671dd16d315a0fdc Mon Sep 17 00:00:00 2001
From: Jon Santmyer <jon@jonsantmyer.com>
Date: Sat, 24 Apr 2021 19:37:31 +0000
Subject: commit 2
---
blockgame/index.html | 16 ++++++++++++++++
blockgame/main.js | 18 ++++++++++++++++++
blockgame/shaders.js | 49 +++++++++++++++++++++++++++++++++++++++++++++++++
3 files changed, 83 insertions(+)
create mode 100644 blockgame/index.html
create mode 100644 blockgame/main.js
create mode 100644 blockgame/shaders.js
(limited to 'blockgame')
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;
+}
--
cgit v1.2.1