@tolokoban/tgd
Version:
ToloGameDev library for WebGL2
42 lines • 4.04 kB
JavaScript
import { TgdColor } from "./../../../color/index.js";
import { tgdLoadCanvasFromSvg } from "./../../../loader/index.js";
import { TgdTexture2D } from "./../../../texture/index.js";
import { RED, GREEN, BLUE } from "./consts.js";
const SIZE = 128;
export async function createTipsTexture(context, { size = SIZE, red = RED, green = GREEN, blue = BLUE } = {}) {
const canvas = await tgdLoadCanvasFromSvg(makeTipsSVG(size, red, green, blue));
const texture = new TgdTexture2D(context, {
name: `Gizmo tip (${size})`,
params: {
magFilter: "LINEAR",
minFilter: "LINEAR",
},
load: canvas,
});
return texture;
}
function makeTipsSVG(size, red, green, blue) {
return `<svg xmlns="http://www.w3.org/2000/svg" width="${3 * size}" height="${2 * size}" viewBox="0 0 ${3 * size} ${2 * size}">
<style>
text {
font: bold ${(80 * size) / 128}px sans-serif;
dominant-baseline: middle;
text-anchor: middle;
transform: translateY(${(8 * size) / 128}px);
}
</style>
${[red, green, blue].map((color, index) => {
const x = (0.5 + index) * size;
const y1 = size * 0.5;
const y2 = y1 + size;
const r1 = (55 * size) / 128;
const r2 = (50 * size) / 128;
const stroke = (8 * size) / 128;
const back = TgdColor.fromString(color).alphaMul(0.25).toString();
return `<circle fill="${color}" cx="${x}" cy="${y1}" r="${r1}" />
<text fill="#000" x="${x}" y="${y1}">${"XYZ".charAt(index)}</text>
<circle stroke="${color}" fill="${back}" stroke-width="${stroke}" cx="${x}" cy="${y2}" r="${r2}"/>`;
})}
</svg>`;
}
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGlwcy5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9wYWludGVyL2dpem1vL3BhaW50ZXJzL3RpcHMudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFFBQVEsRUFBRSxNQUFNLFlBQVksQ0FBQTtBQUVyQyxPQUFPLEVBQUUsb0JBQW9CLEVBQUUsTUFBTSxhQUFhLENBQUE7QUFDbEQsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGNBQWMsQ0FBQTtBQUMzQyxPQUFPLEVBQUUsR0FBRyxFQUFFLEtBQUssRUFBRSxJQUFJLEVBQUUsTUFBTSxVQUFVLENBQUE7QUFFM0MsTUFBTSxJQUFJLEdBQUcsR0FBRyxDQUFBO0FBZ0JoQixNQUFNLENBQUMsS0FBSyxVQUFVLGlCQUFpQixDQUNuQyxPQUFtQixFQUNuQixFQUFFLElBQUksR0FBRyxJQUFJLEVBQUUsR0FBRyxHQUFHLEdBQUcsRUFBRSxLQUFLLEdBQUcsS0FBSyxFQUFFLElBQUksR0FBRyxJQUFJLEtBQTJCLEVBQUU7SUFFakYsTUFBTSxNQUFNLEdBQUcsTUFBTSxvQkFBb0IsQ0FBQyxXQUFXLENBQUMsSUFBSSxFQUFFLEdBQUcsRUFBRSxLQUFLLEVBQUUsSUFBSSxDQUFDLENBQUMsQ0FBQTtJQUM5RSxNQUFNLE9BQU8sR0FBRyxJQUFJLFlBQVksQ0FBQyxPQUFPLEVBQUU7UUFDdEMsSUFBSSxFQUFFLGNBQWMsSUFBSSxHQUFHO1FBQzNCLE1BQU0sRUFBRTtZQUNKLFNBQVMsRUFBRSxRQUFRO1lBQ25CLFNBQVMsRUFBRSxRQUFRO1NBQ3RCO1FBQ0QsSUFBSSxFQUFFLE1BQU07S0FDZixDQUFDLENBQUE7SUFDRixPQUFPLE9BQU8sQ0FBQTtBQUNsQixDQUFDO0FBRUQsU0FBUyxXQUFXLENBQUMsSUFBWSxFQUFFLEdBQVcsRUFBRSxLQUFhLEVBQUUsSUFBWTtJQUN2RSxPQUFPLGtEQUFrRCxDQUFDLEdBQUcsSUFBSSxhQUM3RCxDQUFDLEdBQUcsSUFDUixrQkFBa0IsQ0FBQyxHQUFHLElBQUksSUFBSSxDQUFDLEdBQUcsSUFBSTs7O2lCQUd6QixDQUFDLEVBQUUsR0FBRyxJQUFJLENBQUMsR0FBRyxHQUFHOzs7NEJBR04sQ0FBQyxDQUFDLEdBQUcsSUFBSSxDQUFDLEdBQUcsR0FBRzs7O0VBRzFDLENBQUMsR0FBRyxFQUFFLEtBQUssRUFBRSxJQUFJLENBQUMsQ0FBQyxHQUFHLENBQUMsQ0FBQyxLQUFLLEVBQUUsS0FBSyxFQUFFLEVBQUU7UUFDdEMsTUFBTSxDQUFDLEdBQUcsQ0FBQyxHQUFHLEdBQUcsS0FBSyxDQUFDLEdBQUcsSUFBSSxDQUFBO1FBQzlCLE1BQU0sRUFBRSxHQUFHLElBQUksR0FBRyxHQUFHLENBQUE7UUFDckIsTUFBTSxFQUFFLEdBQUcsRUFBRSxHQUFHLElBQUksQ0FBQTtRQUNwQixNQUFNLEVBQUUsR0FBRyxDQUFDLEVBQUUsR0FBRyxJQUFJLENBQUMsR0FBRyxHQUFHLENBQUE7UUFDNUIsTUFBTSxFQUFFLEdBQUcsQ0FBQyxFQUFFLEdBQUcsSUFBSSxDQUFDLEdBQUcsR0FBRyxDQUFBO1FBQzVCLE1BQU0sTUFBTSxHQUFHLENBQUMsQ0FBQyxHQUFHLElBQUksQ0FBQyxHQUFHLEdBQUcsQ0FBQTtRQUMvQixNQUFNLElBQUksR0FBRyxRQUFRLENBQUMsVUFBVSxDQUFDLEtBQUssQ0FBQyxDQUFDLFFBQVEsQ0FBQyxJQUFJLENBQUMsQ0FBQyxRQUFRLEVBQUUsQ0FBQTtRQUNqRSxPQUFPLGlCQUFpQixLQUFLLFNBQVMsQ0FBQyxTQUFTLEVBQUUsUUFBUSxFQUFFO3VCQUN6QyxDQUFDLFFBQVEsRUFBRSxLQUFLLEtBQUssQ0FBQyxNQUFNLENBQUMsS0FBSyxDQUFDO2tCQUN4QyxLQUFLLFdBQVcsSUFBSSxtQkFBbUIsTUFBTSxTQUFTLENBQUMsU0FBUyxFQUFFLFFBQVEsRUFBRSxLQUFLLENBQUE7SUFDbkcsQ0FBQyxDQUFDO09BQ0ssQ0FBQTtBQUNQLENBQUMifQ==