diff options
Diffstat (limited to 'web/pw-visualizer/src')
| -rw-r--r-- | web/pw-visualizer/src/webgl/index.ts | 129 | ||||
| -rw-r--r-- | web/pw-visualizer/src/webgl/util.ts | 26 |
2 files changed, 1 insertions, 154 deletions
diff --git a/web/pw-visualizer/src/webgl/index.ts b/web/pw-visualizer/src/webgl/index.ts deleted file mode 100644 index 8d785ef..0000000 --- a/web/pw-visualizer/src/webgl/index.ts +++ /dev/null @@ -1,129 +0,0 @@ -import { Uniform4f, Uniform1f, Uniform2f, ShaderFactory, UniformMatrix3fv, Uniform3f } from './shader'; -import { resizeCanvasToDisplaySize, FPSCounter, onload2promise, Resizer, url_to_mesh } from "./util"; -import { VertexBuffer, IndexBuffer } from './buffer'; -import { VertexArray, VertexBufferLayout } from './vertexBufferLayout'; -import { Renderer } from './renderer'; -import { Texture } from './texture'; -import * as assets from "../assets"; - -// const URL = window.location.origin+window.location.pathname; -// const LOCATION = URL.substring(0, URL.lastIndexOf("/") + 1); - -async function create_texture_from_svg(gl: WebGLRenderingContext, name: string, path: string, width: number, height: number): Promise<Texture> { - - const [mesh, factory] = await Promise.all([ - url_to_mesh(path), - ShaderFactory.create_factory( - // assets.simpleFragmentShader, - // assets.simpleVertexShader, - // TODO: previously: this was the old code, which was not working. - // what is the correct shader here? - "static/shaders/frag/static_color.glsl", "static/shaders/vert/svg.glsl" - ) - ]); - - const program = factory.create_shader(gl); - const renderer = new Renderer(); - - var positionBuffer = new VertexBuffer(gl, mesh.positions); - var layout = new VertexBufferLayout(); - layout.push(gl.FLOAT, 3, 4, "a_position"); - - const vao = new VertexArray(); - vao.addBuffer(positionBuffer, layout); - - program.bind(gl); - vao.bind(gl, program); - - var indexBuffer = new IndexBuffer(gl, mesh.cells); - indexBuffer.bind(gl); - - renderer.addToDraw(indexBuffer, vao, program, {}); - - return Texture.fromRenderer(gl, name, width, height, renderer); -} - - -async function main() { - - // Get A WebGL context - var canvas = <HTMLCanvasElement>document.getElementById("c"); - const resolution = [canvas.width, canvas.height]; - - const resizer = new Resizer(canvas, [-10, -10, 20, 20], true); - - var gl = canvas.getContext("webgl"); - if (!gl) { - return; - } - - // TODO: do we still need this? - const mesh = await url_to_mesh("static/res/images/earth.svg"); - const renderer = new Renderer(); - - const factory = await ShaderFactory.create_factory(assets.simpleFragmentShader, assets.simpleVertexShader); - const program = factory.create_shader(gl); - - var positionBuffer = new VertexBuffer(gl, mesh.positions); - var layout = new VertexBufferLayout(); - layout.push(gl.FLOAT, 3, 4, "a_position"); - // layout.push(gl.FLOAT, 2, 4, "a_tex"); - - const vao = new VertexArray(); - vao.addBuffer(positionBuffer, layout); - - resizeCanvasToDisplaySize(<HTMLCanvasElement>gl.canvas); - - // Tell WebGL how to convert from clip space to pixels - gl.viewport(0, 0, gl.canvas.width, gl.canvas.height); - - // Clear the canvas - gl.clearColor(0, 0, 0, 0); - gl.clear(gl.COLOR_BUFFER_BIT); - - gl.enable(gl.BLEND); - gl.blendFunc(gl.SRC_ALPHA, gl.ONE_MINUS_SRC_ALPHA); - - program.bind(gl); - vao.bind(gl, program); - - var indexBuffer = new IndexBuffer(gl, mesh.cells); - indexBuffer.bind(gl); - - renderer.addToDraw(indexBuffer, vao, program, {}); - - const counter = new FPSCounter(); - - const step = function (time: number) { - - // console.log(resizer.get_viewbox()); - - program.uniform(gl, "u_time", new Uniform1f(time * 0.001)); - program.uniform(gl, "u_mouse", new Uniform2f(resizer.get_mouse_pos())); - program.uniform(gl, "u_viewbox", new Uniform4f(resizer.get_viewbox())); - program.uniform(gl, "u_resolution", new Uniform2f(resolution)); - program.uniform(gl, "u_trans", new UniformMatrix3fv([1, 0, 0, 0, 1, 0, 0, 0, 1])); - program.uniform(gl, "u_color", new Uniform3f(1.0, 0.5, 0.0)); - - renderer.render(gl); - - counter.frame(time); - requestAnimationFrame(step); - } - - requestAnimationFrame(step); -} - - -main(); - -document.getElementById("loader").classList.remove("loading"); - -// const loader = document.getElementById("loader"); -// setInterval(() => { -// if (loader.classList.contains("loading")) { -// loader.classList.remove("loading") -// } else { -// loader.classList.add("loading"); -// } -// }, 2000); diff --git a/web/pw-visualizer/src/webgl/util.ts b/web/pw-visualizer/src/webgl/util.ts index 3ed2b4d..e08af3f 100644 --- a/web/pw-visualizer/src/webgl/util.ts +++ b/web/pw-visualizer/src/webgl/util.ts @@ -1,6 +1,3 @@ -import { parse as parsePath } from 'extract-svg-path'; -import svgMesh3d from 'svg-mesh-3d'; - export interface Dictionary<T> { [Key: string]: T; } @@ -205,25 +202,4 @@ export class Mesh { this.cells = mesh.cells.flat(); this.positions = mesh.positions.flat(); } -} - -export async function url_to_mesh(url: string): Promise<Mesh> { - - return new Promise(function(resolve) { - fetch(url) - .then(resp => resp.text()) - .then(data => { - // var div = document.createElement('div'); - // div.innerHTML = data; - // var svg = div.querySelector('svg'); - - var svgPath = parsePath(data); - var mesh = svgMesh3d(svgPath, { - delaunay: false, - scale: 10, - }); - - resolve(new Mesh(mesh)); - }) - }); -} +}
\ No newline at end of file |