From e91b1da5b02ca6abf9bc4afd0d4a62789b688102 Mon Sep 17 00:00:00 2001 From: Ilion Beyst Date: Wed, 16 Nov 2022 13:00:14 +0100 Subject: [PATCH] remove old text rendering code --- web/pw-visualizer/assets/res/font.png | Bin 912 -> 0 bytes web/pw-visualizer/src/assets.ts | 2 - web/pw-visualizer/src/index.ts | 16 +- web/pw-visualizer/src/webgl/msdf_text.ts | 1 - web/pw-visualizer/src/webgl/text.ts | 199 ----------------------- 5 files changed, 4 insertions(+), 214 deletions(-) delete mode 100644 web/pw-visualizer/assets/res/font.png delete mode 100644 web/pw-visualizer/src/webgl/text.ts diff --git a/web/pw-visualizer/assets/res/font.png b/web/pw-visualizer/assets/res/font.png deleted file mode 100644 index 1724e0dd27e96c4c0977e4bf4b4939553d6e79dd..0000000000000000000000000000000000000000 GIT binary patch literal 0 HcmV?d00001 literal 912 zcmV;B18@9^P)e zSad^gZEa<4bO1wgWnpw>WFU8GbZ8()Nlj2!fese{00Q_)L_t(&-tAiLj^iK<%%Hsg zBcJa_kHi>%LfT#3Zlp@x7#m}ZXG|Bz{Sf;O1%Rh{%Z~*x^(#W<2a79D=PyACmlISqiU#=_9J~Q^Njg@gDe1Q zl$BYeBS@rW`ibmk=Feua8UVgSD?6B|CDk1+Wk?^B@m~$V#ts31TLUUPoLDU8wT<&v z9xPVjuS5YWI!h>U{PZV^QbtY-_TkhFTJV3F$25Kh`^TyQmYl!y^rQOHot0w~_DT3g zf$ua0pcfva06~#IdVacd3jw@%fItC~D4@yDWU-;_0#*amowK0KgSZ_OYt8~mqnX|U zyd6+%Q-STJxj^KfTLX+#!*2BDS$r6lF8>52PBGOi3RJ7?DvEpp1%9#rsU1d=3GVWU z9eKF^wuqy0484;_ROD42v2!0#>c=_EeW#~YE4a}OMj3)nG$LLrtoT0%z=J3U=gE*i zSEwE!L6(2#Za-b@<--LUM~Rdp1dByheAvEK-9U-z%`+7dsM4+eY##8Ad-=?*O(jFJ zjE<@q+_E?u;JnKt5=|9ld4>}Z(+AK0Gh3vb01ZE?7(9Y9{d|UJ7)6e}R@y19FBmj% zd`dO1!fv#(2o`6_5fHIdC)&Cp=SGO4#V2?~SZx*iurkb}>sEj*9s`Hcn(6C}G5T@q zcLQwLR|}o82JbfuJi!A#h0|3OsPdHG`v4=taCV58z8ps)!dy;;=u17zPGn#AuQ@o& z4)CAhqZyxNd_pNlsqv6{vk&sUw13Zk`vDq?gx$}Bq%*khQP7R|cXhcJkbB3wo~6%& z@{-Ro?nD23`u_kHh<`+8G&E060NON(C69OcQ0##0#b-Otre<$*`u!<|^vQ48ILUY> zyWDe-f3)-#iy$pv-W=L9-3QeBc`F0v0O}bM? ) { @@ -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 { // 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 { } 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; -} - -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); -}