aboutsummaryrefslogtreecommitdiff
path: root/web
diff options
context:
space:
mode:
Diffstat (limited to 'web')
-rw-r--r--web/pw-visualizer/assets/res/font.pngbin912 -> 0 bytes
-rw-r--r--web/pw-visualizer/src/assets.ts2
-rw-r--r--web/pw-visualizer/src/index.ts16
-rw-r--r--web/pw-visualizer/src/webgl/msdf_text.ts1
-rw-r--r--web/pw-visualizer/src/webgl/text.ts199
5 files changed, 4 insertions, 214 deletions
diff --git a/web/pw-visualizer/assets/res/font.png b/web/pw-visualizer/assets/res/font.png
deleted file mode 100644
index 1724e0d..0000000
--- a/web/pw-visualizer/assets/res/font.png
+++ /dev/null
Binary files differ
diff --git a/web/pw-visualizer/src/assets.ts b/web/pw-visualizer/src/assets.ts
index abd17e4..817f766 100644
--- a/web/pw-visualizer/src/assets.ts
+++ b/web/pw-visualizer/src/assets.ts
@@ -7,8 +7,6 @@ export {default as venusSvg} from "../assets/res/venus.svg";
export {default as earthPng} from "../assets/res/earth.png";
export {default as shipPng} from "../assets/res/ship.png";
-export {default as fontPng} from "../assets/res/font.png";
-
export {default as robotoMsdfPng} from "../assets/res/fonts/roboto.png";
export {default as robotoMsdfJson} from "../assets/res/fonts/roboto.json";
diff --git a/web/pw-visualizer/src/index.ts b/web/pw-visualizer/src/index.ts
index 8159134..6bc72f6 100644
--- a/web/pw-visualizer/src/index.ts
+++ b/web/pw-visualizer/src/index.ts
@@ -21,11 +21,10 @@ import {
import { DefaultRenderable, Renderer } from "./webgl/renderer";
import { VertexBuffer, IndexBuffer } from "./webgl/buffer";
import { VertexBufferLayout, VertexArray } from "./webgl/vertexBufferLayout";
-import { defaultLabelFactory, LabelFactory, Align, Label } from "./webgl/text";
import { VoronoiBuilder } from "./voronoi/voronoi";
import * as assets from "./assets";
import { loadImage, Texture } from "./webgl/texture";
-import { defaultMsdfLabelFactory, MsdfLabelFactory, Label as MsdfLabel } from "./webgl/msdf_text";
+import { defaultMsdfLabelFactory, MsdfLabelFactory, Label as MsdfLabel, Align } from "./webgl/msdf_text";
function to_bbox(box: number[]): BBox {
@@ -133,10 +132,8 @@ export class GameInstance {
vor_shader: Shader;
image_shader: Shader;
masked_image_shader: Shader;
-
msdf_shader: Shader;
- text_factory: LabelFactory;
msdf_text_factory: MsdfLabelFactory;
planet_labels: MsdfLabel[];
ship_labels: MsdfLabel[];
@@ -166,7 +163,6 @@ export class GameInstance {
game: Game,
planets_textures: Texture[],
ship_texture: Texture,
- font_texture: Texture,
robotoMsdfTexture: Texture,
shaders: Dictionary<ShaderFactory>
) {
@@ -189,7 +185,6 @@ export class GameInstance {
this.masked_image_shader = shaders["masked_image"].create_shader(GL);
this.msdf_shader = shaders["msdf"].create_shader(GL);
- this.text_factory = defaultLabelFactory(GL, font_texture, this.image_shader);
this.msdf_text_factory = defaultMsdfLabelFactory(GL, robotoMsdfTexture, this.msdf_shader);
this.planet_labels = [];
this.ship_labels = [];
@@ -607,7 +602,6 @@ export async function set_instance(source: string): Promise<GameInstance> {
// TODO: this loading code is a mess. Please clean me up!
if (!texture_images || !shaders) {
const image_promises = [
- loadImage(assets.fontPng),
loadImage(assets.shipPng),
loadImage(assets.earthPng),
loadImage(assets.robotoMsdfPng),
@@ -666,17 +660,15 @@ export async function set_instance(source: string): Promise<GameInstance> {
}
resizeCanvasToDisplaySize(CANVAS);
- const fontTexture = Texture.fromImage(GL, texture_images[0], "font");
- const shipTexture = Texture.fromImage(GL, texture_images[1], "ship");
- const earthTexture = Texture.fromImage(GL, texture_images[2], "earth");
- const robotoMsdfTexture = Texture.fromImage(GL, texture_images[3], "robotoMsdf");
+ const shipTexture = Texture.fromImage(GL, texture_images[0], "ship");
+ const earthTexture = Texture.fromImage(GL, texture_images[1], "earth");
+ const robotoMsdfTexture = Texture.fromImage(GL, texture_images[2], "robotoMsdf");
game_instance = new GameInstance(
Game.new(source),
[earthTexture],
shipTexture,
- fontTexture,
robotoMsdfTexture,
shaders
);
diff --git a/web/pw-visualizer/src/webgl/msdf_text.ts b/web/pw-visualizer/src/webgl/msdf_text.ts
index 5bbac20..28daf42 100644
--- a/web/pw-visualizer/src/webgl/msdf_text.ts
+++ b/web/pw-visualizer/src/webgl/msdf_text.ts
@@ -4,7 +4,6 @@ import { DefaultRenderable } from "./renderer";
import { IndexBuffer, VertexBuffer } from "./buffer";
import { VertexBufferLayout, VertexArray } from "./vertexBufferLayout";
import { robotoMsdfJson } from "../assets";
-import { GlypInfo } from "./text";
export enum Align {
diff --git a/web/pw-visualizer/src/webgl/text.ts b/web/pw-visualizer/src/webgl/text.ts
deleted file mode 100644
index 1ae6f37..0000000
--- a/web/pw-visualizer/src/webgl/text.ts
+++ /dev/null
@@ -1,199 +0,0 @@
-import type { Dictionary } from "./util";
-import type { Shader, UniformMatrix3fv } from "./shader";
-import { Texture } from "./texture";
-import { DefaultRenderable } from "./renderer";
-import { IndexBuffer, VertexBuffer } from "./buffer";
-import { VertexBufferLayout, VertexArray } from "./vertexBufferLayout";
-import { fontPng } from "../assets";
-
-
-export enum Align {
- Begin,
- End,
- Middle,
-}
-
-export class GlypInfo {
- x: number;
- y: number;
- width: number;
-}
-
-export class FontInfo {
- letterHeight: number;
- spaceWidth: number;
- spacing: number;
- textureWidth: number;
- textureHeight: number;
- glyphInfos: Dictionary<GlypInfo>;
-}
-
-export class LabelFactory {
- texture: Texture;
- font: FontInfo;
- shader: Shader;
-
- constructor(gl: WebGLRenderingContext, fontTexture: Texture, font: FontInfo, shader: Shader) {
- this.texture = fontTexture;
- this.font = font;
- this.shader = shader;
- }
-
- build(gl: WebGLRenderingContext, transform?: UniformMatrix3fv): Label {
- return new Label(gl, this.shader, this.texture, this.font, transform);
- }
-}
-
-export class Label {
- inner: DefaultRenderable;
-
- font: FontInfo;
-
- constructor(gl: WebGLRenderingContext, shader: Shader, tex: Texture, font: FontInfo, transform?: UniformMatrix3fv) {
- this.font = font;
-
- const uniforms = transform ? { "u_trans": transform, "u_trans_next": transform, } : {};
- const ib = new IndexBuffer(gl, []);
- const vb_pos = new VertexBuffer(gl, []);
- const vb_tex = new VertexBuffer(gl, []);
-
- const layout_pos = new VertexBufferLayout();
- layout_pos.push(gl.FLOAT, 2, 4, "a_position");
-
- const layout_tex = new VertexBufferLayout();
- layout_tex.push(gl.FLOAT, 2, 4, "a_texCoord");
-
- const vao = new VertexArray();
- vao.addBuffer(vb_pos, layout_pos);
- vao.addBuffer(vb_tex, layout_tex);
-
- this.inner = new DefaultRenderable(ib, vao, shader, [tex], uniforms);
- }
-
- getRenderable(): DefaultRenderable {
- return this.inner;
- }
-
- setText(gl: WebGLRenderingContext, text: string, h_align = Align.Begin, v_align = Align.Begin) {
- const idxs = [];
- const verts_pos = [];
- const verts_tex = [];
-
- let xPos = 0;
-
- switch (h_align) {
- case Align.Begin:
- break;
- case Align.End:
- xPos = -1 * [...text].map(n => this.font.glyphInfos[n] ? this.font.glyphInfos[n].width : this.font.spaceWidth).reduce((a, b) => a + b, 0) / this.font.letterHeight;
- break;
- case Align.Middle:
- xPos = -1 * [...text].map(n => this.font.glyphInfos[n] ? this.font.glyphInfos[n].width : this.font.spaceWidth).reduce((a, b) => a + b, 0) / this.font.letterHeight / 2;
- break;
- }
- let yStart = 0;
- switch (v_align) {
- case Align.Begin:
- break;
- case Align.End:
- yStart = 1;
- break;
- case Align.Middle:
- yStart = 0.5;
- break;
- }
-
- let j = 0;
- for (let i = 0; i < text.length; i++) {
- const info = this.font.glyphInfos[text[i]];
- if (info) {
-
- const dx = info.width / this.font.letterHeight;
-
- // apply half-pixel correction to prevent texture bleeding
- // we should address the center of each texel, not the border
- // https://gamedev.stackexchange.com/questions/46963/how-to-avoid-texture-bleeding-in-a-texture-atlas
- const x0 = (info.x + 0.5) / this.font.textureWidth;
- const y0 = (info.y + 0.5) / this.font.textureHeight;
- const letterWidth = (info.width - 1) / this.font.textureWidth;
- const letterHeight = (this.font.letterHeight - 1) / this.font.textureHeight;
-
- verts_pos.push(xPos, yStart);
- verts_pos.push(xPos + dx, yStart);
- verts_pos.push(xPos, yStart-1);
- verts_pos.push(xPos + dx, yStart-1);
-
- verts_tex.push(x0, y0);
- verts_tex.push(x0 + letterWidth, y0);
- verts_tex.push(x0, y0 + letterHeight);
- verts_tex.push(x0 + letterWidth, y0 + letterHeight);
-
- xPos += dx;
-
- idxs.push(j+0, j+1, j+2, j+1, j+2, j+3);
- j += 4;
- } else {
- // Just move xPos
- xPos += this.font.spaceWidth / this.font.letterHeight;
- }
- }
-
- this.inner.updateIndexBuffer(gl, idxs);
- this.inner.updateVAOBuffer(gl, 0, verts_pos);
- this.inner.updateVAOBuffer(gl, 1, verts_tex);
- }
-}
-
-export function defaultLabelFactory(gl: WebGLRenderingContext, fontTexture: Texture, shader: Shader): LabelFactory {
- const fontInfo = {
- letterHeight: 8,
- spaceWidth: 8,
- spacing: -1,
- textureWidth: 64,
- textureHeight: 40,
- glyphInfos: {
- 'a': { x: 0, y: 0, width: 8, },
- 'b': { x: 8, y: 0, width: 8, },
- 'c': { x: 16, y: 0, width: 8, },
- 'd': { x: 24, y: 0, width: 8, },
- 'e': { x: 32, y: 0, width: 8, },
- 'f': { x: 40, y: 0, width: 8, },
- 'g': { x: 48, y: 0, width: 8, },
- 'h': { x: 56, y: 0, width: 8, },
- 'i': { x: 0, y: 8, width: 8, },
- 'j': { x: 8, y: 8, width: 8, },
- 'k': { x: 16, y: 8, width: 8, },
- 'l': { x: 24, y: 8, width: 8, },
- 'm': { x: 32, y: 8, width: 8, },
- 'n': { x: 40, y: 8, width: 8, },
- 'o': { x: 48, y: 8, width: 8, },
- 'p': { x: 56, y: 8, width: 8, },
- 'q': { x: 0, y: 16, width: 8, },
- 'r': { x: 8, y: 16, width: 8, },
- 's': { x: 16, y: 16, width: 8, },
- 't': { x: 24, y: 16, width: 8, },
- 'u': { x: 32, y: 16, width: 8, },
- 'v': { x: 40, y: 16, width: 8, },
- 'w': { x: 48, y: 16, width: 8, },
- 'x': { x: 56, y: 16, width: 8, },
- 'y': { x: 0, y: 24, width: 8, },
- 'z': { x: 8, y: 24, width: 8, },
- '0': { x: 16, y: 24, width: 8, },
- '1': { x: 24, y: 24, width: 8, },
- '2': { x: 32, y: 24, width: 8, },
- '3': { x: 40, y: 24, width: 8, },
- '4': { x: 48, y: 24, width: 8, },
- '5': { x: 56, y: 24, width: 8, },
- '6': { x: 0, y: 32, width: 8, },
- '7': { x: 8, y: 32, width: 8, },
- '8': { x: 16, y: 32, width: 8, },
- '9': { x: 24, y: 32, width: 8, },
- '-': { x: 32, y: 32, width: 8, },
- '*': { x: 40, y: 32, width: 8, },
- '!': { x: 48, y: 32, width: 8, },
- '?': { x: 56, y: 32, width: 8, },
- },
- };
-
- return new LabelFactory(gl, fontTexture, fontInfo, shader);
-}
generated by cgit v1.2.3 (git 2.25.1) at 2024-12-23 09:04:42 +0000