b/panorama-viewer
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Forget all that module noise

Browse Source
This commit is contained in:
Brandon Dyck 2022-10-22 12:08:26 -06:00
parent 16271a79b5
commit c83ea2e7c3
2 changed files with 55 additions and 55 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
index.html
View File

@ -1,14 +1,7 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<script type="module" src="panorama-viewer.js"></script> <script src="./panorama-viewer.js"></script>
<script type="module">
import { render } from "./panorama-viewer.js";
window.addEventListener("load", () => {
let viewer = document.getElementById("viewer");
render(viewer);
});
</script>
</head> </head>
<body> <body>
<h1>Panorama Viewer</h1> <h1>Panorama Viewer</h1>

101
panorama-viewer.js
View File

@ -1,56 +1,63 @@
"use strict";
(() => {
window.addEventListener("load", () => {
let viewer = document.getElementById("viewer");
render(viewer);
});
export const render = (canvas) => { const render = (canvas) => {
let gl = canvas.getContext("webgl"); let gl = canvas.getContext("webgl2");
const vShaderSrc = ` const vShaderSrc = `
attribute vec3 position; attribute vec3 position;
void main() { void main() {
gl_Position = vec4(position, 1); gl_Position = vec4(position, 1);
}
`;
const fShaderSrc = `
void main() {
gl_FragColor = vec4(0.5, 0.5, 0, 1);
}
`;
const compileShader = (src, type) => {
let shader = gl.createShader(type);
gl.shaderSource(shader, src);
gl.compileShader(shader);
let success = gl.getShaderParameter(shader, gl.COMPILE_STATUS);
if (!success) {
throw gl.getShaderInfoLog(vShader);
}
return shader;
} }
`;
const fShaderSrc = ` let vShader = compileShader(vShaderSrc, gl.VERTEX_SHADER);
void main() { let fShader = compileShader(fShaderSrc, gl.FRAGMENT_SHADER);
gl_FragColor = vec4(0.5, 0.5, 0, 1);
}
`;
const compileShader = (src, type) => { let program = gl.createProgram();
let shader = gl.createShader(type); gl.attachShader(program, vShader);
gl.shaderSource(shader, src); gl.attachShader(program, fShader);
gl.compileShader(shader); gl.linkProgram(program);
let success = gl.getShaderParameter(shader, gl.COMPILE_STATUS); let success = gl.getProgramParameter(program, gl.LINK_STATUS);
if (!success) { if (!success) {
throw gl.getShaderInfoLog(vShader); throw gl.getProgramInfoLog(program);
} }
return shader; gl.useProgram(program);
}
let vShader = compileShader(vShaderSrc, gl.VERTEX_SHADER); let vertexBuffer = gl.createBuffer();
let fShader = compileShader(fShaderSrc, gl.FRAGMENT_SHADER); let vertices = new Float32Array([
0, 0, 0,
let program = gl.createProgram(); 1, 0, 0,
gl.attachShader(program, vShader); 1, 1, 0,
gl.attachShader(program, fShader); ]);
gl.linkProgram(program); gl.bindBuffer(gl.ARRAY_BUFFER, vertexBuffer);
let success = gl.getProgramParameter(program, gl.LINK_STATUS); gl.bufferData(gl.ARRAY_BUFFER, vertices, gl.STATIC_DRAW);
if (!success) {
throw gl.getProgramInfoLog(program); let positionLocation = gl.getAttribLocation(program, "position");
} gl.enableVertexAttribArray(positionLocation);
gl.useProgram(program); gl.vertexAttribPointer(positionLocation, 3, gl.FLOAT, false, 4*3, 0);
gl.drawArrays(gl.TRIANGLES, 0, 3);
let vertexBuffer = gl.createBuffer(); };
let vertices = new Float32Array([ })();
0, 0, 0,
1, 0, 0,
1, 1, 0,
]);
gl.bindBuffer(gl.ARRAY_BUFFER, vertexBuffer);
gl.bufferData(gl.ARRAY_BUFFER, vertices, gl.STATIC_DRAW);
let positionLocation = gl.getAttribLocation(program, "position");
gl.enableVertexAttribArray(positionLocation);
gl.vertexAttribPointer(positionLocation, 3, gl.FLOAT, false, 4*3, 0);
gl.drawArrays(gl.TRIANGLES, 0, 3);
}