nanovgjs 0.1.0

package/nanovg.js

@@ -0,0 +1,3205 @@
+const NVG_CCW = 1;
+const NVG_CW = 2;
+
+const NVG_INIT_COMMANDS_SIZE = 256;
+const NVG_INIT_POINTS_SIZE = 128;
+const NVG_INIT_PATHS_SIZE = 16;
+const NVG_INIT_VERTS_SIZE = 256;
+
+const NVG_VERTEX_SIZEOF = 16;
+
+const NVG_SOLID = 1;
+const NVG_HOLE = 2;
+
+const NVG_BUTT = 0;
+const NVG_ROUND = 1;
+const NVG_SQUARE = 2;
+const NVG_BEVEL = 3;
+const NVG_MITER = 4;
+
+const NVG_ALIGN_LEFT = 1 << 0;
+const NVG_ALIGN_CENTER = 1 << 1;
+const NVG_ALIGN_RIGHT = 1 << 2;
+const NVG_ALIGN_TOP = 1 << 3;
+const NVG_ALIGN_MIDDLE = 1 << 4;
+const NVG_ALIGN_BOTTOM = 1 << 5;
+const NVG_ALIGN_BASELINE = 1 << 6;
+
+const NVG_ZERO = 1 << 0;
+const NVG_ONE = 1 << 1;
+const NVG_SRC_COLOR = 1 << 2;
+const NVG_ONE_MINUS_SRC_COLOR = 1 << 3;
+const NVG_DST_COLOR = 1 << 4;
+const NVG_ONE_MINUS_DST_COLOR = 1 << 5;
+const NVG_SRC_ALPHA = 1 << 6;
+const NVG_ONE_MINUS_SRC_ALPHA = 1 << 7;
+const NVG_DST_ALPHA = 1 << 8;
+const NVG_ONE_MINUS_DST_ALPHA = 1 << 9;
+const NVG_SRC_ALPHA_SATURATE = 1 << 10;
+
+const NVG_SOURCE_OVER = 0;
+const NVG_SOURCE_IN = 1;
+const NVG_SOURCE_OUT = 2;
+const NVG_ATOP = 3;
+const NVG_DESTINATION_OVER = 4;
+const NVG_DESTINATION_IN = 5;
+const NVG_DESTINATION_OUT = 6;
+const NVG_DESTINATION_ATOP = 7;
+const NVG_LIGHTER = 8;
+const NVG_COPY = 9;
+const NVG_XOR = 10;
+
+const NVG_IMAGE_GENERATE_MIPMAPS = 1 << 0;
+const NVG_IMAGE_REPEATX = 1 << 1;
+const NVG_IMAGE_REPEATY = 1 << 2;
+const NVG_IMAGE_FLIPY = 1 << 3;
+const NVG_IMAGE_PREMULTIPLIED = 1 << 4;
+const NVG_IMAGE_NEAREST = 1 << 5;
+
+const NVG_MAX_STATES = 32;
+
+const NVG_TEXTURE_ALPHA = 1;
+const NVG_TEXTURE_RGBA = 2;
+
+const NVG_PT_CORNER = 1;
+const NVG_PT_LEFT = 2;
+const NVG_PT_BEVEL = 4;
+const NVG_PR_INNERBEVEL = 8;
+
+const NVG_MOVETO = 0;
+const NVG_LINETO = 1;
+const NVG_BEZIERTO = 2;
+const NVG_CLOSE = 3;
+const NVG_WINDING = 4;
+
+const NVG_INIT_FONTIMAGE_SIZE = 512;
+const NVG_MAX_FONTIMAGE_SIZE = 2048;
+const NVG_MAX_FONTIMAGES = 4;
+
+const FONS_ZERO_TOPLEFT = 1;
+const FONS_ZERO_BOTTOMLEFT = 2;
+
+const NVG_PI = Math.PI;
+
+const NVG_KAPPA90 = 0.5522847493;
+
+function NVG_NOTUSED(v) {
+    for (;;) {
+        console.log(v)
+        console.log(1 ? 0 : ((v)))
+        if (1 ? 0 : ((v))) {
+            break;
+        }
+    }
+}  
+
+class NVGvertex {
+    constructor(buffer, byteOffset) {
+        this.buffer = buffer;
+        this.byteOffset = byteOffset;
+        this.float32Array = new Float32Array(buffer, byteOffset*NVG_VERTEX_SIZEOF, 4);
+    }
+
+    set x(value) { this.float32Array[0] = value; }
+    get x() { return this.float32Array[0]; }
+    set y(value) { this.float32Array[1] = value; }
+    get y() { return this.float32Array[1]; }
+    set u(value) { this.float32Array[2] = value; }
+    get u() { return this.float32Array[2]; }
+    set v(value) { this.float32Array[3] = value; }
+    get v() { return this.float32Array[3]; }
+}
+
+class NVGcolor {
+    constructor(r = 0, g = 0, b = 0, a = 0) {
+        this.rgba = new Float32Array(4);
+        
+        this.r = r;
+        this.g = g;
+        this.b = b;
+        this.a = a;
+    }
+
+    get r() { return this.rgba[0]; }
+    get g() { return this.rgba[1]; }
+    get b() { return this.rgba[2]; }
+    get a() { return this.rgba[3]; }
+    
+    set r(value) { this.rgba[0] = value; }
+    set g(value) { this.rgba[1] = value; }
+    set b(value) { this.rgba[2] = value; }
+    set a(value) { this.rgba[3] = value; }
+
+    static nvgRGB(r, g, b) {
+        return this.nvgRGBA(r, g, b, 255);
+    }
+    
+    static nvgRGBf(r, g, b) {
+        return this.nvgRGBAf(r, g, b, 1.0);
+    }
+    
+    static nvgRGBA(r, g, b, a) {
+        return new NVGcolor(parseFloat(r) / 255.0, parseFloat(g) / 255.0, parseFloat(b) / 255.0, parseFloat(a) / 255.0);
+    }
+    
+    static nvgRGBAf(r, g, b, a) {
+        return new NVGcolor(r, g, b, a);
+    }
+
+    static nvgHSLA(h, s, l, a) {
+        let m1, m2;
+        const col = new NVGcolor();
+        h = nvg__modf(h, 1.0);
+        if (h < 0.0) h += 1.0;
+        s = nvg__clampf(s, 0.0, 1.0);
+        l = nvg__clampf(l, 0.0, 1.0);
+        m2 = l <= 0.5 ? l * (1 + s) : l + s - l * s;
+        m1 = 2 * l - m2;
+        col.r = nvg__clampf(nvg__hue(h + 1.0 / 3.0, m1, m2), 0.0, 1.0);
+        col.g = nvg__clampf(nvg__hue(h, m1, m2), 0.0, 1.0);
+        col.b = nvg__clampf(nvg__hue(h - 1.0 / 3.0, m1, m2), 0.0, 1.0);
+        col.a = a / 255.0;
+        return col;
+    }
+    
+    static nvgTransRGBA(c, a) {
+        c.a = a / 255.0;
+        return c;
+    }
+      
+    static nvgTransRGBAf(c, a) {
+        c.a = a;
+        return c;
+    }
+      
+    static nvgLerpRGBA(c0, c1, u) {
+        const cint = new NVGcolor();
+        u = nvg__clampf(u, 0.0, 1.0);
+        const oneminu = 1.0 - u;
+        for (let i = 0; i < 4; i++) {
+          cint.rgba[i] = c0.rgba[i] * oneminu + c1.rgba[i] * u;
+        }
+        return cint;
+    }
+      
+    static nvgHSL(h, s, l) {
+        return this.nvgHSLA(h, s, l, 255);
+    }
+}
+
+class NVGpaint {
+    constructor(_array = new Float32Array(18)) {
+        this.image = 0;
+        this.xform = new Float32Array(_array.subarray(0, 6));
+        this.extent = new Float32Array(_array.subarray(6, 8));
+        this._radius = new Float32Array(_array.subarray(8, 9));
+        this._feather = new Float32Array(_array.subarray(9, 10));
+        this.innerColor = new NVGcolor(new Float32Array(_array.subarray(10, 14)));
+        this.outerColor = new NVGcolor(new Float32Array(_array.subarray(14, 18)));
+    }
+    get radius() { return this._radius[0]; }
+    set radius(value) { this._radius[0] = value; }
+    get feather() { return this._feather[0]; }
+    set feather(value) { this._feather[0] = value; }
+}
+
+class NVGpoint {
+    constructor() {
+        this.x = 0;
+        this.y = 0;
+        this.dx = 0;
+        this.dy = 0;
+        this.len = 0;
+        this.dmx = 0;
+        this.dmy = 0;
+        this.flags = 0;
+    }
+}
+
+class NVGscissor {
+    constructor() {
+        this.xform = new Array(6).fill(0);
+        this.extent = new Array(2).fill(0);
+        this.enabled = false;
+    }
+}
+
+class NVGstate {
+    constructor() {
+        this.compositeOperation = new NVGcompositeOperationState();
+        this.shapeAntiAlias = 0;
+        this.fill = new NVGpaint();
+        this.stroke = new NVGpaint();
+        this.strokeWidth = 0;
+        this.miterLimit = 0;
+        this.lineJoin = 0;
+        this.lineCap = 0;
+        this.alpha = 0;
+        this.xform = new Array(6).fill(0);
+        this.scissor = new NVGscissor();
+        this.fontSize = 0;
+        this.letterSpacing = 0;
+        this.lineHeight = 0;
+        this.fontBlur = 0;
+        this.textAlign = 0;
+        this.fontId = 0;
+    }
+}
+
+class NVGcompositeOperationState {
+    constructor(srcRGB, dstRGB, srcAlpha, dstAlpha) {
+        this.srcRGB = srcRGB;
+        this.dstRGB = dstRGB;
+        this.srcAlpha = srcAlpha;
+        this.dstAlpha = dstAlpha;
+    }
+}
+
+class NVGglyphPosition {
+    constructor(str, x, minx, maxx) {
+        this.str = str;
+        this.x = x;
+        this.minx = minx;
+        this.maxx = maxx;
+    }
+}
+
+class NVGtextRow {
+    constructor(start, end, next, width, minx, maxx) {
+        this.start = start;
+        this.end = end;
+        this.next = next;
+        this.width = width;
+        this.minx = minx;
+        this.maxx = maxx;
+    }
+}
+
+class NVGpath {
+    constructor() {
+        this.first = 0;
+        this.count = 0;
+        this.closed = false;
+        this.nbevel = 0;
+        this.fill = [];
+        this.nfill = 0;
+        this.stroke = [];
+        this.nstroke = 0;
+        this.winding = 0;
+        this.convex = 0;
+    }
+}  
+
+class NVGparams {
+    constructor() {
+        this.userPtr = null;
+        this.edgeAntiAlias = 0;
+        this.renderCreate = null;
+        this.renderCreateTexture = null;
+        this.renderDeleteTexture = null;
+        this.renderUpdateTexture = null;
+        this.renderGetTextureSize = null;
+        this.renderViewport = null;
+        this.renderCancel = null;
+        this.renderFlush = null;
+        this.renderFill = null;
+        this.renderStroke = null;
+        this.renderTriangles = null;
+        this.renderDelete = null;
+    }
+}
+  
+class NVGpathCache {
+    constructor() {
+        this.points = [];
+        this.npoints = 0;
+        this.cpoints = 0;
+        this.paths = [];
+        this.npaths = 0;
+        this.cpaths = 0;
+        this.verts = new ArrayBuffer();
+        this.nverts = 0;
+        this.cverts = 0;
+        this.bounds = new Array(4);
+        this.pverts = [];
+    }
+}
+  
+class FONScontext {
+    constructor(params = {}) {
+        this.width = params.width || NVG_INIT_FONTIMAGE_SIZE;
+        this.height = params.height || NVG_INIT_FONTIMAGE_SIZE;
+        this.flags = params.flags || FONS_ZERO_TOPLEFT;
+        this.fonts = [];
+        this.fontsByName = new Map();
+        this.state = {
+            size: 16,
+            spacing: 0,
+            blur: 0,
+            align: FONS_ALIGN_LEFT | FONS_ALIGN_BASELINE,
+            font: FONS_INVALID,
+        };
+        this.cursorX = 1;
+        this.cursorY = 1;
+        this.rowH = 0;
+        this.dirty = true;
+        this.textureData = new Uint8Array(this.width * this.height);
+        this.canvas = null;
+        this.ctx2d = null;
+        this.scratchCanvas = null;
+        this.scratchCtx = null;
+        this._initCanvases();
+    }
+
+    _initCanvases() {
+        if (typeof document === "undefined") return;
+        this.canvas = document.createElement("canvas");
+        this.canvas.width = this.width;
+        this.canvas.height = this.height;
+        this.ctx2d = this.canvas.getContext("2d", { willReadFrequently: true });
+        this.scratchCanvas = document.createElement("canvas");
+        this.scratchCanvas.width = 256;
+        this.scratchCanvas.height = 256;
+        this.scratchCtx = this.scratchCanvas.getContext("2d", { willReadFrequently: true });
+    }
+
+    resize(width, height) {
+        this.width = width;
+        this.height = height;
+        this.cursorX = 1;
+        this.cursorY = 1;
+        this.rowH = 0;
+        this.textureData = new Uint8Array(width * height);
+        this.dirty = true;
+        if (this.canvas) {
+            this.canvas.width = width;
+            this.canvas.height = height;
+        }
+        for (const font of this.fonts) {
+            font.glyphs.clear();
+        }
+    }
+
+    addFont(name, source) {
+        const id = this.fonts.length;
+        const family = `NVGFont_${id}_${String(name || "font").replace(/[^A-Za-z0-9_]/g, "_")}`;
+        const font = {
+            id,
+            name,
+            family,
+            glyphs: new Map(),
+            loaded: false,
+            loading: null,
+        };
+
+        if (typeof FontFace !== "undefined") {
+            try {
+                const face = source instanceof ArrayBuffer
+                    ? new FontFace(family, source)
+                    : new FontFace(family, `url("${source}")`);
+                font.face = face;
+                font.loading = face.load()
+                    .then((loadedFace) => {
+                        if (typeof document !== "undefined" && document.fonts) {
+                            document.fonts.add(loadedFace);
+                        }
+                        font.loaded = true;
+                        font.glyphs.clear();
+                        return loadedFace;
+                    })
+                    .catch(() => {
+                        font.loaded = false;
+                        return null;
+                    });
+            } catch (err) {
+                font.loaded = false;
+            }
+        } else {
+            font.loaded = true;
+        }
+
+        this.fonts.push(font);
+        if (name != null) {
+            this.fontsByName.set(name, id);
+        }
+        return id;
+    }
+
+    findFont(name) {
+        if (name == null) return FONS_INVALID;
+        return this.fontsByName.has(name) ? this.fontsByName.get(name) : FONS_INVALID;
+    }
+
+    allocRect(w, h) {
+        if (w + 2 > this.width || h + 2 > this.height) return null;
+        if (this.cursorX + w + 1 > this.width) {
+            this.cursorX = 1;
+            this.cursorY += this.rowH + 1;
+            this.rowH = 0;
+        }
+        if (this.cursorY + h + 1 > this.height) return null;
+        const rect = { x: this.cursorX, y: this.cursorY, w, h };
+        this.cursorX += w + 1;
+        this.rowH = Math.max(this.rowH, h);
+        return rect;
+    }
+}
+
+const FONS_INVALID = -1;
+const FONS_ALIGN_LEFT = 1 << 0;
+const FONS_ALIGN_CENTER = 1 << 1;
+const FONS_ALIGN_RIGHT = 1 << 2;
+const FONS_ALIGN_TOP = 1 << 3;
+const FONS_ALIGN_MIDDLE = 1 << 4;
+const FONS_ALIGN_BOTTOM = 1 << 5;
+const FONS_ALIGN_BASELINE = 1 << 6;
+
+function nvg__buildFontCSS(font, size) {
+    const family = font && font.family ? font.family : "sans-serif";
+    return `${Math.max(1, size)}px "${family}"`;
+}
+
+function nvg__ensureScratchCanvas(fs, w, h) {
+    if (!fs.scratchCanvas || !fs.scratchCtx) return false;
+    if (fs.scratchCanvas.width < w) fs.scratchCanvas.width = nvg__maxi(w, fs.scratchCanvas.width * 2);
+    if (fs.scratchCanvas.height < h) fs.scratchCanvas.height = nvg__maxi(h, fs.scratchCanvas.height * 2);
+    return true;
+}
+
+function nvg__resolveTextEnd(string, end) {
+    if (typeof string !== "string") return "";
+    if (typeof end === "number") return string.substring(0, end);
+    if (typeof end === "string") {
+        const idx = string.indexOf(end);
+        return idx >= 0 ? string.substring(0, idx) : string;
+    }
+    return string;
+}
+
+function nvg__getJsFont(ctx, fontId) {
+    if (!ctx.fs || fontId == null || fontId < 0 || fontId >= ctx.fs.fonts.length) return null;
+    return ctx.fs.fonts[fontId];
+}
+
+function nvg__measureTextWidth(ctx2d, text) {
+    if (!ctx2d || text.length === 0) return 0;
+    return ctx2d.measureText(text).width;
+}
+
+function nvg__computeTextStartX(align, x, width) {
+    if (align & NVG_ALIGN_RIGHT) return x - width;
+    if (align & NVG_ALIGN_CENTER) return x - width * 0.5;
+    return x;
+}
+
+function nvg__computeTextBaselineY(align, y, metrics) {
+    if (align & NVG_ALIGN_TOP) return y + metrics.ascender;
+    if (align & NVG_ALIGN_MIDDLE) return y + (metrics.ascender + metrics.descender) * 0.5;
+    if (align & NVG_ALIGN_BOTTOM) return y + metrics.descender;
+    return y;
+}
+
+function nvg__getFontVerticalMetrics(ctx2d, size) {
+    const metrics = ctx2d ? ctx2d.measureText("Mg") : null;
+    const ascender = metrics && metrics.actualBoundingBoxAscent ? metrics.actualBoundingBoxAscent : size * 0.8;
+    const descender = metrics && metrics.actualBoundingBoxDescent ? -metrics.actualBoundingBoxDescent : -size * 0.2;
+    const lineh = ascender - descender;
+    return { ascender, descender, lineh };
+}
+
+function nvg__ensureGlyph(ctx, font, size, blur, codepoint) {
+    const fs = ctx.fs;
+    if (!fs || !font || !fs.scratchCtx) return null;
+    if (!font.loaded) return null;
+
+    const key = `${size}:${blur}:${codepoint}`;
+    if (font.glyphs.has(key)) {
+        return font.glyphs.get(key);
+    }
+
+    const ch = String.fromCodePoint(codepoint);
+    const measureCtx = fs.scratchCtx;
+    measureCtx.setTransform(1, 0, 0, 1, 0, 0);
+    measureCtx.font = nvg__buildFontCSS(font, size);
+    measureCtx.textAlign = "left";
+    measureCtx.textBaseline = "alphabetic";
+
+    const metrics = measureCtx.measureText(ch);
+    const left = metrics.actualBoundingBoxLeft ?? 0;
+    const right = metrics.actualBoundingBoxRight ?? metrics.width;
+    const ascent = metrics.actualBoundingBoxAscent ?? size * 0.8;
+    const descent = metrics.actualBoundingBoxDescent ?? size * 0.2;
+    const glyphW = Math.max(1, Math.ceil(left + right));
+    const glyphH = Math.max(1, Math.ceil(ascent + descent));
+    const pad = Math.max(2, Math.ceil(blur) + 2);
+    const drawW = glyphW + pad * 2;
+    const drawH = glyphH + pad * 2;
+
+    nvg__ensureScratchCanvas(fs, drawW, drawH);
+    const scratch = fs.scratchCtx;
+    scratch.setTransform(1, 0, 0, 1, 0, 0);
+    scratch.clearRect(0, 0, fs.scratchCanvas.width, fs.scratchCanvas.height);
+    scratch.font = nvg__buildFontCSS(font, size);
+    scratch.textAlign = "left";
+    scratch.textBaseline = "alphabetic";
+    scratch.fillStyle = "#fff";
+    scratch.fillText(ch, pad + left, pad + ascent);
+
+    let rect = fs.allocRect(drawW, drawH);
+    if (!rect) {
+        if (!nvg__allocTextAtlas(ctx)) return null;
+        rect = fs.allocRect(drawW, drawH);
+        if (!rect) return null;
+    }
+
+    const imageData = scratch.getImageData(0, 0, drawW, drawH).data;
+    for (let sy = 0; sy < drawH; sy++) {
+        for (let sx = 0; sx < drawW; sx++) {
+            const srcIndex = (sy * drawW + sx) * 4 + 3;
+            const dstIndex = (rect.y + sy) * fs.width + (rect.x + sx);
+            fs.textureData[dstIndex] = imageData[srcIndex];
+        }
+    }
+    fs.dirty = true;
+
+    const glyph = {
+        advance: metrics.width,
+        left: -left - pad + 1,
+        top: -ascent - pad + 1,
+        right: glyphW - left + pad - 1,
+        bottom: descent + pad - 1,
+        x: rect.x,
+        y: rect.y,
+        w: drawW,
+        h: drawH,
+        s0: (rect.x + 1) / fs.width,
+        t0: (rect.y + 1) / fs.height,
+        s1: (rect.x + drawW - 1) / fs.width,
+        t1: (rect.y + drawH - 1) / fs.height,
+    };
+    font.glyphs.set(key, glyph);
+    return glyph;
+}
+
+function nvg__flushTextTexture(ctx) {
+    const fs = ctx.fs;
+    if (!fs || !fs.dirty) return;
+    const fontImage = ctx.fontImages[ctx.fontImageIdx];
+    if (fontImage === 0) return;
+    ctx.params.renderUpdateTexture(ctx.params.userPtr, fontImage, 0, 0, fs.width, fs.height, fs.textureData);
+    fs.dirty = false;
+}
+
+function nvg__allocTextAtlas(ctx) {
+    let iw = 0;
+    let ih = 0;
+    nvg__flushTextTexture(ctx);
+    if (ctx.fontImageIdx >= NVG_MAX_FONTIMAGES - 1) return 0;
+    if (ctx.fontImages[ctx.fontImageIdx + 1] !== 0) {
+        [iw, ih] = ctx.nvgImageSize(ctx.fontImages[ctx.fontImageIdx + 1]);
+    } else {
+        [iw, ih] = ctx.nvgImageSize(ctx.fontImages[ctx.fontImageIdx]);
+        if (iw > ih) ih *= 2;
+        else iw *= 2;
+        if (iw > NVG_MAX_FONTIMAGE_SIZE || ih > NVG_MAX_FONTIMAGE_SIZE) {
+            iw = ih = NVG_MAX_FONTIMAGE_SIZE;
+        }
+        ctx.fontImages[ctx.fontImageIdx + 1] = ctx.params.renderCreateTexture(ctx.params.userPtr, NVG_TEXTURE_ALPHA, iw, ih, 0, null);
+    }
+    ctx.fontImageIdx++;
+    if (ctx.fs) {
+        ctx.fs.resize(iw, ih);
+    }
+    return 1;
+}
+
+function nvg__renderText(ctx, verts, nverts) {
+    if (nverts <= 0) return;
+    const state = nvg__getState(ctx);
+    const paint = nvg__clonePaint(state.fill);
+    paint.image = ctx.fontImages[ctx.fontImageIdx];
+    paint.innerColor.a *= state.alpha;
+    paint.outerColor.a *= state.alpha;
+    ctx.params.renderTriangles(ctx.params.userPtr, paint, state.compositeOperation, state.scissor, verts, nverts, ctx.fringeWidth);
+    ctx.drawCallCount++;
+    ctx.textTriCount += nverts / 3;
+}
+
+function fonsDeleteInternal(fs) {
+    if (!fs) return;
+    fs.fonts = [];
+    fs.fontsByName = new Map();
+    fs.canvas = null;
+    fs.ctx2d = null;
+    fs.scratchCanvas = null;
+    fs.scratchCtx = null;
+}
+  
+class NVGcontext {
+    constructor() {
+        this.params = new NVGparams();
+        this.commands = null;
+        this.ccommands = 0;
+        this.ncommands = 0;
+        this.commandx = 0;
+        this.commandy = 0;
+        this.states = Array.from({ length: NVG_MAX_STATES }, () => new NVGstate());
+        this.nstates = 0;
+        this.cache = new NVGpathCache();
+        this.tessTol = 0;
+        this.distTol = 0;
+        this.fringeWidth = 0;
+        this.devicePxRatio = 0;
+        this.fs = null;
+        this.fontImages = new Array(NVG_MAX_FONTIMAGES).fill(0);
+        this.fontImageIdx = 0;
+        this.drawCallCount = 0;
+        this.fillTriCount = 0;
+        this.strokeTriCount = 0;
+        this.textTriCount = 0;
+    }
+  
+    nvgBeginFrame(windowWidth, windowHeight, devicePixelRatio) {
+        this.nstates = 0;
+        this.nvgSave();
+        this.nvgReset();
+
+        nvg__setDevicePixelRatio(this, devicePixelRatio);
+
+        this.params.renderViewport(this.params.userPtr, windowWidth, windowHeight, devicePixelRatio);
+
+        this.drawCallCount = 0;
+        this.fillTriCount = 0;
+        this.strokeTriCount = 0;
+        this.textTriCount = 0;
+    }
+  
+    nvgCancelFrame() {
+        this.params.renderCancel(this.params.userPtr);
+    }
+  
+    nvgEndFrame() {
+        this.params.renderFlush(this);
+        if (this.fontImageIdx != 0) {
+            let fontImage = this.fontImages[this.fontImageIdx];
+            this.fontImages[this.fontImageIdx] = 0;
+            let i, j, iw, ih;
+            if (fontImage == 0)
+                return;
+            [iw, ih] = this.nvgImageSize(fontImage);
+            for (i = j = 0; i < this.fontImageIdx; i++) {
+                if (this.fontImages[i] != 0) {
+                    let nw, nh;
+                    let image = this.fontImages[i];
+                    this.fontImages[i] = 0;
+                    [nw, nh] = this.nvgImageSize(image);
+                    if (nw < iw || nh < ih)
+                        this.nvgDeleteImage(image);
+                    else
+                        this.fontImages[j++] = image;
+                }
+            }
+            this.fontImages[j] = this.fontImages[0];
+            this.fontImages[0] = fontImage;
+            this.fontImageIdx = 0;
+        }
+    }
+  
+    nvgSave() {
+        const ctx = this;
+        if (ctx.nstates >= NVG_MAX_STATES)
+		    return;
+        if (ctx.nstates > 0)
+            ctx.states[ctx.nstates] = nvg__cloneState(ctx.states[ctx.nstates - 1]);
+        ctx.nstates++;
+    }
+  
+    nvgRestore() {
+        if (this.nstates <= 1)
+		return;
+	    this.nstates--;
+    }
+  
+    nvgReset() {
+        const ctx = this;
+        const state = new NVGstate();
+        ctx.states[ctx.nstates - 1] = state;
+        
+        nvg__setPaintColor(state.fill, NVGcolor.nvgRGBA(255,255,255,255));
+        nvg__setPaintColor(state.stroke, NVGcolor.nvgRGBA(0,0,0,255));
+        state.compositeOperation = nvg__compositeOperationState(NVG_SOURCE_OVER);
+        state.shapeAntiAlias = 1;
+        state.strokeWidth = 1.0;
+        state.miterLimit = 10.0;
+        state.lineCap = NVG_BUTT;
+        state.lineJoin = NVG_MITER;
+        state.alpha = 1.0;
+        nvgTransformIdentity(state.xform);
+    
+        state.scissor.extent[0] = -1.0;
+        state.scissor.extent[1] = -1.0;
+    
+        state.fontSize = 16.0;
+        state.letterSpacing = 0.0;
+        state.lineHeight = 1.0;
+        state.fontBlur = 0.0;
+        state.textAlign = NVG_ALIGN_LEFT | NVG_ALIGN_BASELINE;
+        state.fontId = 0;
+    }
+  
+    nvgShapeAntiAlias(enabled)
+    {
+        const state = nvg__getState(this);
+        state.shapeAntiAlias = enabled;
+    }
+
+    nvgStrokeWidth(width) {
+        const state = nvg__getState(this);
+        state.strokeWidth = width;
+    }
+  
+    nvgMiterLimit(limit)
+    {
+        const state = nvg__getState(this);
+        state.miterLimit = limit;
+    }
+
+    nvgLineCap(cap)
+    {
+        const state = nvg__getState(this);
+        state.lineCap = cap;
+    }
+
+    nvgLineJoin(join)
+    {
+        const state = nvg__getState(this);
+        state.lineJoin = join;
+    }
+
+    nvgGlobalAlpha(alpha)
+    {
+        const state = nvg__getState(this);
+        state.alpha = alpha;
+    }
+    
+    nvgTransform(a, b, c, d, e, f)
+    {
+        const state = nvg__getState(this);
+        let t = [ a, b, c, d, e, f ];
+        nvgTransformPremultiply(state.xform, t);
+    }
+
+    nvgResetTransform()
+    {
+        const state = nvg__getState(this);
+        nvgTransformIdentity(state.xform);
+    }
+
+    nvgTranslate(x, y)
+    {
+        const state = nvg__getState(this);
+        let t = [];
+        nvgTransformTranslate(t, x,y);
+        nvgTransformPremultiply(state.xform, t);
+    }
+    
+    nvgRotate(angle)
+    {
+        const state = nvg__getState(this);
+        let t = [];
+        nvgTransformRotate(t, angle);
+        nvgTransformPremultiply(state.xform, t);
+    }
+    
+    nvgSkewX(angle)
+    {
+        const state = nvg__getState(this);
+        let t = [];
+        nvgTransformSkewX(t, angle);
+        nvgTransformPremultiply(state.xform, t);
+    }
+
+    nvgBeginPath()
+    {
+        this.ncommands = 0;
+        nvg__clearPathCache(this);
+    }
+
+    nvgMoveTo(x, y) {
+        let vals = [ NVG_MOVETO, x, y ];
+        nvg__appendCommands(this, vals, NVG_COUNTOF(vals));
+    }
+  
+    nvgLineTo(x, y) {
+        let vals = [ NVG_LINETO, x, y ];
+	    nvg__appendCommands(this, vals, NVG_COUNTOF(vals));
+    }
+  
+    nvgBezierTo(c1x, c1y, c2x, c2y, x, y) {
+        let vals = [ NVG_BEZIERTO, c1x, c1y, c2x, c2y, x, y ];
+        nvg__appendCommands(this, vals, NVG_COUNTOF(vals));
+    }
+  
+    nvgQuadTo(cx, cy, x, y) {
+        let x0 = this.commandx;
+        let y0 = this.commandy;
+        let vals = [ NVG_BEZIERTO,
+            x0 + 2.0/3.0*(cx - x0), y0 + 2.0/3.0*(cy - y0),
+            x + 2.0/3.0*(cx - x), y + 2.0/3.0*(cy - y),
+            x, y ];
+        nvg__appendCommands(this, vals, NVG_COUNTOF(vals));
+    }
+  
+    nvgArcTo(x1, y1, x2, y2, radius) {
+        let x0 = this.commandx;
+        let y0 = this.commandy;
+        let dx0, dy0, dx1, dy1, a, d, cx, cy, a0, a1;
+        let dir;
+
+        if (this.ncommands === 0) {
+            return;
+        }
+
+        if (
+            nvg__ptEquals(x0, y0, x1, y1, this.distTol) ||
+            nvg__ptEquals(x1, y1, x2, y2, this.distTol) ||
+            nvg__distPtSeg(x1, y1, x0, y0, x2, y2) < this.distTol * this.distTol ||
+            radius < this.distTol
+        ) {
+            this.nvgLineTo(x1, y1);
+            return;
+        }
+
+        dx0 = x0 - x1;
+        dy0 = y0 - y1;
+        dx1 = x2 - x1;
+        dy1 = y2 - y1;
+        [dx0, dy0] = nvg__normalizeXY(dx0, dy0);
+        [dx1, dy1] = nvg__normalizeXY(dx1, dy1);
+        a = nvg__acosf(dx0 * dx1 + dy0 * dy1);
+        d = radius / Math.tan(a / 2.0);
+
+        if (d > 10000.0) {
+            this.nvgLineTo(x1, y1);
+            return;
+        }
+
+        if (nvg__cross(dx0, dy0, dx1, dy1) > 0.0) {
+            cx = x1 + dx0 * d + dy0 * radius;
+            cy = y1 + dy0 * d + -dx0 * radius;
+            a0 = nvg__atan2f(dx0, -dy0);
+            a1 = nvg__atan2f(-dx1, dy1);
+            dir = NVG_CW;
+        } else {
+            cx = x1 + dx0 * d + -dy0 * radius;
+            cy = y1 + dy0 * d + dx0 * radius;
+            a0 = nvg__atan2f(-dx0, dy0);
+            a1 = nvg__atan2f(dx1, -dy1);
+            dir = NVG_CCW;
+        }
+
+        this.nvgArc(cx, cy, radius, a0, a1, dir);
+    }
+  
+    nvgClosePath() {
+        let vals = [ NVG_CLOSE ];
+	    nvg__appendCommands(this, vals, NVG_COUNTOF(vals));
+    }
+  
+    nvgPathWinding(dir) {
+        let vals = [ NVG_WINDING, dir ];
+	    nvg__appendCommands(this, vals, NVG_COUNTOF(vals));
+    }
+  
+    nvgArc(cx, cy, r, a0, a1, dir) {
+        let a = 0, da = 0, hda = 0, kappa = 0;
+        let dx = 0, dy = 0, x = 0, y = 0, tanx = 0, tany = 0;
+        let px = 0, py = 0, ptanx = 0, ptany = 0;
+        let vals = [];
+        let ndivs, nvals;
+        let move = this.ncommands > 0 ? NVG_LINETO : NVG_MOVETO;
+
+        da = a1 - a0;
+        if (dir === NVG_CW) {
+            if (Math.abs(da) >= Math.PI * 2) {
+            da = Math.PI * 2;
+            } else {
+            while (da < 0.0) da += Math.PI * 2;
+            }
+        } else {
+            if (Math.abs(da) >= Math.PI * 2) {
+            da = -Math.PI * 2;
+            } else {
+            while (da > 0.0) da -= Math.PI * 2;
+            }
+        }
+
+        ndivs = Math.max(1, Math.min(Math.floor(Math.abs(da) / (Math.PI * 0.5) + 0.5), 5));
+        hda = (da / ndivs) / 2.0;
+        kappa = Math.abs(4.0 / 3.0 * (1.0 - Math.cos(hda)) / Math.sin(hda));
+
+        if (dir === NVG_CCW)
+            kappa = -kappa;
+
+        nvals = 0;
+        for (let i = 0; i <= ndivs; i++) {
+            a = a0 + da * (i / ndivs);
+            dx = Math.cos(a);
+            dy = Math.sin(a);
+            x = cx + dx * r;
+            y = cy + dy * r;
+            tanx = -dy * r * kappa;
+            tany = dx * r * kappa;
+
+            if (i === 0) {
+                vals[nvals++] = move;
+                vals[nvals++] = x;
+                vals[nvals++] = y;
+            } else {
+                vals[nvals++] = NVG_BEZIERTO;
+                vals[nvals++] = px + ptanx;
+                vals[nvals++] = py + ptany;
+                vals[nvals++] = x - tanx;
+                vals[nvals++] = y - tany;
+                vals[nvals++] = x;
+                vals[nvals++] = y;
+            }
+            px = x;
+            py = y;
+            ptanx = tanx;
+            ptany = tany;
+        }
+
+        nvg__appendCommands(this, vals, nvals);
+    }
+  
+    nvgRect(x, y, w, h) {
+        let vals = [
+            NVG_MOVETO, x,y,
+            NVG_LINETO, x,y+h,
+            NVG_LINETO, x+w,y+h,
+            NVG_LINETO, x+w,y,
+            NVG_CLOSE
+        ];
+        nvg__appendCommands(this, vals, NVG_COUNTOF(vals));
+    }
+  
+    nvgRoundedRect(x, y, w, h, r) {
+        this.nvgRoundedRectVarying(x, y, w, h, r, r, r, r);
+    }
+
+    nvgRoundedRectVarying(x, y, w, h, radTopLeft, radTopRight, radBottomRight, radBottomLeft) {
+        if (radTopLeft < 0.1 && radTopRight < 0.1 && radBottomRight < 0.1 && radBottomLeft < 0.1) {
+            this.nvgRect(x, y, w, h);
+            return;
+        } else {
+            let halfw = Math.abs(w) * 0.5;
+            let halfh = Math.abs(h) * 0.5;
+            let rxBL = Math.min(radBottomLeft, halfw) * Math.sign(w);
+            let ryBL = Math.min(radBottomLeft, halfh) * Math.sign(h);
+            let rxBR = Math.min(radBottomRight, halfw) * Math.sign(w);
+            let ryBR = Math.min(radBottomRight, halfh) * Math.sign(h);
+            let rxTR = Math.min(radTopRight, halfw) * Math.sign(w);
+            let ryTR = Math.min(radTopRight, halfh) * Math.sign(h);
+            let rxTL = Math.min(radTopLeft, halfw) * Math.sign(w);
+            let ryTL = Math.min(radTopLeft, halfh) * Math.sign(h);
+            let vals = [
+                NVG_MOVETO, x, y + ryTL,
+                NVG_LINETO, x, y + h - ryBL,
+                NVG_BEZIERTO, x, y + h - ryBL * (1 - NVG_KAPPA90), x + rxBL * (1 - NVG_KAPPA90), y + h, x + rxBL, y + h,
+                NVG_LINETO, x + w - rxBR, y + h,
+                NVG_BEZIERTO, x + w - rxBR * (1 - NVG_KAPPA90), y + h, x + w, y + h - ryBR * (1 - NVG_KAPPA90), x + w, y + h - ryBR,
+                NVG_LINETO, x + w, y + ryTR,
+                NVG_BEZIERTO, x + w, y + ryTR * (1 - NVG_KAPPA90), x + w - rxTR * (1 - NVG_KAPPA90), y, x + w - rxTR, y,
+                NVG_LINETO, x + rxTL, y,
+                NVG_BEZIERTO, x + rxTL * (1 - NVG_KAPPA90), y, x, y + ryTL * (1 - NVG_KAPPA90), x, y + ryTL,
+                NVG_CLOSE
+            ];
+            nvg__appendCommands(this, vals, vals.length);
+        }
+    }
+  
+    nvgEllipse(cx, cy, rx, ry) {
+        let vals = [
+            NVG_MOVETO, cx-rx, cy,
+            NVG_BEZIERTO, cx-rx, cy+ry*NVG_KAPPA90, cx-rx*NVG_KAPPA90, cy+ry, cx, cy+ry,
+            NVG_BEZIERTO, cx+rx*NVG_KAPPA90, cy+ry, cx+rx, cy+ry*NVG_KAPPA90, cx+rx, cy,
+            NVG_BEZIERTO, cx+rx, cy-ry*NVG_KAPPA90, cx+rx*NVG_KAPPA90, cy-ry, cx, cy-ry,
+            NVG_BEZIERTO, cx-rx*NVG_KAPPA90, cy-ry, cx-rx, cy-ry*NVG_KAPPA90, cx-rx, cy,
+            NVG_CLOSE
+        ];
+        nvg__appendCommands(this, vals, NVG_COUNTOF(vals));
+    }
+  
+    nvgCircle(cx, cy, r) {
+        this.nvgEllipse(cx, cy, r, r);
+    }
+
+    //nvgDebugDumpPathCache() {
+    //    let path, i, j;
+    //    console.log("Dumping %d cached paths\n", this.cache.npaths);
+    //    for (i = 0; i < this.cache.npaths; i++) {
+    //        path = this.cache.paths[i];
+    //        console.log(" - Path %d\n", i);
+    //        if (path.nfill) {
+    //            console.log("   - fill: %d\n", path.nfill);
+    //            for (j = 0; j < path.nfill; j++)
+    //                console.log("%f\t%f\n", path.fill[j].x, path.fill[j].y);
+    //        }
+    //        if (path.nstroke > 0) {
+    //            console.log("   - stroke: %d\n", path.nstroke);
+    //            for (j = 0; j < path.nstroke; j++)
+    //                console.log("%f\t%f\n", path.stroke[j].x, path.stroke[j].y);
+    //        }
+    //    }
+    //}
+
+    nvgDebugDumpPathCache() {
+        let path, i, j;
+        console.log("Dumping %d cached paths\n", this.cache.npaths);
+        for (i = 0; i < this.cache.npaths; i++) {
+            path = this.cache.paths[i];
+            console.log(" - Path %d\n", i);
+            if (path.nfill) {
+                console.log("   - fill: %d\n", path.nfill);
+                for (j = 0; j < path.nfill; j=j+4)
+                    console.log("%f\t%f\n", path.fill[j], path.fill[j+1]);
+            }
+            if (path.nstroke > 0) {
+                console.log("   - stroke: %d\n", path.nstroke);
+                for (j = 0; j < path.nstroke; j=j+4)
+                    console.log("%f\t%f\n", path.stroke[j], path.stroke[j+1]);
+            }
+        }
+    }
+  
+    nvgFill() {
+        const state = nvg__getState(this);
+        let path;
+        let fillPaint = nvg__clonePaint(state.fill);
+        let i;
+
+        nvg__flattenPaths(this);
+        if (this.params.edgeAntiAlias && state.shapeAntiAlias)
+            nvg__expandFill(this, this.fringeWidth, NVG_MITER, 2.4);
+        else
+            nvg__expandFill(this, 0.0, NVG_MITER, 2.4);
+     
+        fillPaint.innerColor.a *= state.alpha;
+        fillPaint.outerColor.a *= state.alpha;
+
+        this.params.renderFill(
+            this.params.userPtr,
+            fillPaint,
+            state.compositeOperation,
+            state.scissor,
+            this.fringeWidth,
+            this.cache.bounds,
+            this.cache.paths,
+            this.cache.npaths
+        );
+
+        for (i = 0; i < this.cache.npaths; i++) {
+            path = this.cache.paths[i];
+            this.fillTriCount += path.nfill - 2;
+            this.fillTriCount += path.nstroke - 2;
+            this.drawCallCount += 2;
+        }
+    }
+  
+    nvgStroke() {
+        const state = nvg__getState(this);
+        const cache = this.cache;
+
+        this.drawCallCount++;
+        this.strokeTriCount = 0;
+
+        let scale = nvg__getAverageScale(state.xform);
+        let strokeWidth = nvg__clampf(state.strokeWidth * scale, 0.0, 200.0);
+
+        let strokePaint = new NVGpaint();
+        
+        strokePaint.xform.set(state.stroke.xform);
+        strokePaint.extent.set(state.stroke.extent);
+        strokePaint.radius = state.stroke.radius;
+        strokePaint.feather = state.stroke.feather;
+        strokePaint.image = state.stroke.image;
+
+        strokePaint.innerColor = NVGcolor.nvgRGBAf(
+            state.stroke.innerColor.r,
+            state.stroke.innerColor.g,
+            state.stroke.innerColor.b,
+            state.stroke.innerColor.a
+        );
+        strokePaint.outerColor = NVGcolor.nvgRGBAf(
+            state.stroke.outerColor.r,
+            state.stroke.outerColor.g,
+            state.stroke.outerColor.b,
+            state.stroke.outerColor.a
+        );
+
+        if (strokeWidth < this.fringeWidth) {
+            let alpha = nvg__clampf(strokeWidth / this.fringeWidth, 0.0, 1.0);
+            strokePaint.innerColor.a *= alpha * alpha;
+            strokePaint.outerColor.a *= alpha * alpha;
+            strokeWidth = this.fringeWidth;
+        }
+
+        strokePaint.innerColor.a *= state.alpha;
+        strokePaint.outerColor.a *= state.alpha;
+
+        nvg__flattenPaths(this);
+        if (cache.npaths === 0) return;
+
+        const fringe = this.params.edgeAntiAlias && state.shapeAntiAlias ? this.fringeWidth : 0.0;
+
+        nvg__expandStroke(
+            this,
+            strokeWidth * 0.5,
+            fringe,
+            state.lineCap,
+            state.lineJoin,
+            state.miterLimit
+        );
+
+        this.params.renderStroke(
+            this.params.userPtr,
+            strokePaint,
+            state.compositeOperation,
+            state.scissor,
+            this.fringeWidth,
+            strokeWidth,
+            cache.paths,
+            cache.npaths
+        );
+
+        for (let i = 0; i < cache.npaths; i++) {
+            const path = cache.paths[i];
+            if (path.nstroke >= 3) {
+                this.strokeTriCount += path.nstroke;
+            }
+        }
+    }
+  
+    nvgCreateFont(name, filename) {
+        if (!this.fs || name == null || filename == null) return FONS_INVALID;
+        return this.fs.addFont(name, filename);
+    }
+
+    nvgCreateFontAtIndex(name, filename, fontIndex) {
+        NVG_NOTUSED(fontIndex);
+        return this.nvgCreateFont(name, filename);
+    }
+
+    nvgCreateFontMem(name, data, ndata, freeData) {
+        NVG_NOTUSED(ndata);
+        NVG_NOTUSED(freeData);
+        if (!this.fs || name == null || data == null) return FONS_INVALID;
+        let buffer = data;
+        if (ArrayBuffer.isView(data)) {
+            buffer = data.buffer.slice(data.byteOffset, data.byteOffset + data.byteLength);
+        }
+        return this.fs.addFont(name, buffer);
+    }
+
+    nvgCreateFontMemAtIndex(name, data, ndata, freeData, fontIndex) {
+        NVG_NOTUSED(fontIndex);
+        return this.nvgCreateFontMem(name, data, ndata, freeData);
+    }
+
+    nvgFindFont(name) {
+        if (name == null) return -1;
+        return this.fs ? this.fs.findFont(name) : FONS_INVALID;
+    }
+
+    nvgAddFallbackFontId(baseFont, fallbackFont)
+    {
+        NVG_NOTUSED(baseFont);
+        NVG_NOTUSED(fallbackFont);
+        return 1;
+    }
+
+    nvgAddFallbackFont(baseFont, fallbackFont)
+    {
+        return this.nvgAddFallbackFontId(this.nvgFindFont(baseFont), this.nvgFindFont(fallbackFont));
+    }
+
+    nvgResetFallbackFontsId(baseFont)
+    {
+        NVG_NOTUSED(baseFont);
+    }
+
+    nvgResetFallbackFonts(baseFont)
+    {
+        this.nvgResetFallbackFontsId(this.nvgFindFont(baseFont));
+    }
+    
+    nvgFontSize(size) {
+        const state = nvg__getState(this);
+	    state.fontSize = size;
+    }
+    
+    nvgFontBlur(size) {
+        const state = nvg__getState(this);
+	    state.fontBlur = size;
+    }
+    
+    nvgTextLetterSpacing(spacing) {
+        const state = nvg__getState(this);
+        state.letterSpacing = spacing;
+    }
+    
+    nvgTextLineHeight(lineHeight) {
+        const state = nvg__getState(this);
+        state.lineHeight = lineHeight;
+    }
+    
+    nvgTextAlign(align) {
+        const state = nvg__getState(this);
+        state.textAlign = align;
+    }
+    
+    nvgFontFaceId(font) {
+        const state = nvg__getState(this);
+        state.fontId = font;
+    }
+    
+    nvgFontFace(font) {
+        const state = nvg__getState(this);
+        state.fontId = this.nvgFindFont(font);
+    }      
+    
+    nvgText(x, y, string, end) {
+        const state = nvg__getState(this);
+        const text = nvg__resolveTextEnd(string, end);
+        const font = nvg__getJsFont(this, state.fontId);
+        if (!font || text.length === 0 || !this.fs || !this.fs.scratchCtx) return x;
+
+        const scale = nvg__getFontScale(state) * this.devicePxRatio;
+        const invscale = 1.0 / scale;
+        const drawSize = state.fontSize * scale;
+        const measureCtx = this.fs.scratchCtx;
+        measureCtx.font = nvg__buildFontCSS(font, drawSize);
+
+        let width = 0;
+        for (const ch of text) {
+            width += nvg__measureTextWidth(measureCtx, ch) + state.letterSpacing * scale;
+        }
+        if (text.length > 0) width -= state.letterSpacing * scale;
+
+        const verticalMetrics = nvg__getFontVerticalMetrics(measureCtx, drawSize);
+        let penX = nvg__computeTextStartX(state.textAlign, x * scale, width);
+        const penY = nvg__computeTextBaselineY(state.textAlign, y * scale, verticalMetrics);
+        const verts = nvg__allocTempVerts(this, Math.max(2, text.length) * 6);
+        if (verts == null) return x;
+        let nverts = 0;
+
+        for (const ch of text) {
+            const glyph = nvg__ensureGlyph(this, font, drawSize, state.fontBlur * scale, ch.codePointAt(0));
+            if (!glyph) {
+                penX += nvg__measureTextWidth(measureCtx, ch) + state.letterSpacing * scale;
+                continue;
+            }
+
+            const x0 = penX + glyph.left;
+            const y0 = penY + glyph.top;
+            const x1 = penX + glyph.right;
+            const y1 = penY + glyph.bottom;
+            const c0 = nvgTransformPoint(state.xform, x0 * invscale, y0 * invscale);
+            const c1 = nvgTransformPoint(state.xform, x1 * invscale, y0 * invscale);
+            const c2 = nvgTransformPoint(state.xform, x1 * invscale, y1 * invscale);
+            const c3 = nvgTransformPoint(state.xform, x0 * invscale, y1 * invscale);
+
+            const base = nverts * 4;
+            const view = new Float32Array(verts, nverts * NVG_VERTEX_SIZEOF, 24);
+            view.set([
+                c0[0], c0[1], glyph.s0, glyph.t0,
+                c2[0], c2[1], glyph.s1, glyph.t1,
+                c1[0], c1[1], glyph.s1, glyph.t0,
+                c0[0], c0[1], glyph.s0, glyph.t0,
+                c3[0], c3[1], glyph.s0, glyph.t1,
+                c2[0], c2[1], glyph.s1, glyph.t1,
+            ]);
+            nverts += 6;
+            penX += glyph.advance + state.letterSpacing * scale;
+        }
+
+        nvg__flushTextTexture(this);
+        nvg__renderText(this, verts, nverts);
+        return penX * invscale;
+    }      
+    
+    nvgTextBox(x, y, breakRowWidth, string, end) {
+        const state = nvg__getState(this);
+        const text = nvg__resolveTextEnd(string, end);
+        if (text.length === 0) return;
+
+        const widthInfo = { value: 0 };
+        const ascInfo = { value: 0 };
+        const descInfo = { value: 0 };
+        const lineInfo = { value: 0 };
+        const oldAlign = state.textAlign;
+        const halign = state.textAlign & (NVG_ALIGN_LEFT | NVG_ALIGN_CENTER | NVG_ALIGN_RIGHT);
+        const valign = state.textAlign & (NVG_ALIGN_TOP | NVG_ALIGN_MIDDLE | NVG_ALIGN_BOTTOM | NVG_ALIGN_BASELINE);
+        this.nvgTextMetrics(ascInfo, descInfo, lineInfo);
+        state.textAlign = NVG_ALIGN_LEFT | valign;
+
+        const words = text.split(/\s+/);
+        let line = "";
+        for (const word of words) {
+            const candidate = line.length === 0 ? word : `${line} ${word}`;
+            widthInfo.value = this.nvgTextBounds(0, 0, candidate, null, null);
+            if (line.length > 0 && widthInfo.value > breakRowWidth) {
+                let dx = 0;
+                const lineWidth = this.nvgTextBounds(0, 0, line, null, null);
+                if (halign & NVG_ALIGN_CENTER) dx = breakRowWidth * 0.5 - lineWidth * 0.5;
+                else if (halign & NVG_ALIGN_RIGHT) dx = breakRowWidth - lineWidth;
+                this.nvgText(x + dx, y, line, null);
+                y += lineInfo.value * state.lineHeight;
+                line = word;
+            } else {
+                line = candidate;
+            }
+        }
+        if (line.length > 0) {
+            let dx = 0;
+            const lineWidth = this.nvgTextBounds(0, 0, line, null, null);
+            if (halign & NVG_ALIGN_CENTER) dx = breakRowWidth * 0.5 - lineWidth * 0.5;
+            else if (halign & NVG_ALIGN_RIGHT) dx = breakRowWidth - lineWidth;
+            this.nvgText(x + dx, y, line, null);
+        }
+        state.textAlign = oldAlign;
+    }
+      
+    nvgTextMetrics(ascender, descender, lineh) {
+        const state = nvg__getState(this);
+        const scale = nvg__getFontScale(state) * this.devicePxRatio;
+        const invscale = 1.0 / scale;
+
+        const font = nvg__getJsFont(this, state.fontId);
+        if (!font || !this.fs || !this.fs.scratchCtx) return;
+
+        const measureCtx = this.fs.scratchCtx;
+        measureCtx.font = nvg__buildFontCSS(font, state.fontSize * scale);
+        const metrics = nvg__getFontVerticalMetrics(measureCtx, state.fontSize * scale);
+        if (typeof ascender === "object" && ascender) ascender.value = metrics.ascender * invscale;
+        if (typeof descender === "object" && descender) descender.value = metrics.descender * invscale;
+        if (typeof lineh === "object" && lineh) lineh.value = metrics.lineh * invscale;
+    }
+
+    nvgTextBounds(x, y, string, end, bounds) {
+        const state = nvg__getState(this);
+        const text = nvg__resolveTextEnd(string, end);
+        const font = nvg__getJsFont(this, state.fontId);
+        if (!font || !this.fs || !this.fs.scratchCtx) {
+            if (bounds) bounds.splice(0, bounds.length, 0, 0, 0, 0);
+            return 0;
+        }
+        const scale = nvg__getFontScale(state) * this.devicePxRatio;
+        const invscale = 1.0 / scale;
+        const measureCtx = this.fs.scratchCtx;
+        measureCtx.font = nvg__buildFontCSS(font, state.fontSize * scale);
+
+        let width = 0;
+        for (const ch of text) {
+            width += nvg__measureTextWidth(measureCtx, ch) + state.letterSpacing * scale;
+        }
+        if (text.length > 0) width -= state.letterSpacing * scale;
+        const metrics = nvg__getFontVerticalMetrics(measureCtx, state.fontSize * scale);
+        const baselineY = nvg__computeTextBaselineY(state.textAlign, y * scale, metrics);
+        const startX = nvg__computeTextStartX(state.textAlign, x * scale, width) * invscale;
+        if (bounds) {
+            bounds[0] = startX;
+            bounds[1] = (baselineY - metrics.ascender) * invscale;
+            bounds[2] = startX + width * invscale;
+            bounds[3] = (baselineY - metrics.descender) * invscale;
+        }
+        return width * invscale;
+    }
+
+    nvgTextGlyphPositions(x, y, string, end, positions, maxPositions) {
+        const state = nvg__getState(this);
+        const text = nvg__resolveTextEnd(string, end);
+        const font = nvg__getJsFont(this, state.fontId);
+        if (!font || !this.fs || !this.fs.scratchCtx || !positions || maxPositions <= 0) return 0;
+
+        const scale = nvg__getFontScale(state) * this.devicePxRatio;
+        const invscale = 1.0 / scale;
+        const measureCtx = this.fs.scratchCtx;
+        measureCtx.font = nvg__buildFontCSS(font, state.fontSize * scale);
+
+        let penX = nvg__computeTextStartX(state.textAlign, x * scale, 0);
+        let n = 0;
+        for (const ch of text) {
+            if (n >= maxPositions) break;
+            const glyphWidth = nvg__measureTextWidth(measureCtx, ch);
+            positions[n] = {
+                str: ch,
+                x: penX * invscale,
+                minx: penX * invscale,
+                maxx: (penX + glyphWidth) * invscale
+            };
+            penX += glyphWidth + state.letterSpacing * scale;
+            n++;
+        }
+        return n;
+    }
+
+    nvgTextBreakLines(string, end, breakRowWidth, rows, maxRows) {
+        const state = nvg__getState(this);
+        const text = nvg__resolveTextEnd(string, end);
+        const font = nvg__getJsFont(this, state.fontId);
+        if (!font || !this.fs || !this.fs.scratchCtx || !rows || maxRows <= 0) return 0;
+
+        const scale = nvg__getFontScale(state) * this.devicePxRatio;
+        const invscale = 1.0 / scale;
+        const measureCtx = this.fs.scratchCtx;
+        measureCtx.font = nvg__buildFontCSS(font, state.fontSize * scale);
+
+        const pushRow = (segment, nextIndex, outIndex) => {
+            const width = this.nvgTextBounds(0, 0, segment, null, null);
+            const rowText = segment.replace(/\s+$/g, "");
+            const rowWidth = this.nvgTextBounds(0, 0, rowText, null, null);
+            rows[outIndex] = {
+                start: rowText,
+                end: rowText,
+                next: nextIndex,
+                width: rowWidth,
+                minx: 0,
+                maxx: rowWidth
+            };
+            return width;
+        };
+
+        let count = 0;
+        let i = 0;
+        while (i < text.length && count < maxRows) {
+            if (text[i] === "\n") {
+                rows[count++] = { start: "", end: "", next: i + 1, width: 0, minx: 0, maxx: 0 };
+                i++;
+                continue;
+            }
+
+            let lineStart = i;
+            let lastBreak = -1;
+            let j = i;
+            let lineWidth = 0;
+
+            while (j < text.length) {
+                const ch = text[j];
+                if (ch === "\n") break;
+                const advance = (nvg__measureTextWidth(measureCtx, ch) + state.letterSpacing * scale) * invscale;
+                if (/\s/.test(ch)) lastBreak = j;
+                if (j > lineStart && lineWidth + advance > breakRowWidth) {
+                    if (lastBreak >= lineStart) {
+                        j = lastBreak + 1;
+                    }
+                    break;
+                }
+                lineWidth += advance;
+                j++;
+            }
+
+            const segment = text.slice(lineStart, j);
+            pushRow(segment, j < text.length && text[j] === "\n" ? j + 1 : j, count);
+            count++;
+
+            i = j;
+            while (i < text.length && text[i] === "\n") break;
+            while (i < text.length && i > lineStart && /\s/.test(text[i]) && text[i] !== "\n") i++;
+            if (j < text.length && text[j] === "\n") i = j + 1;
+        }
+        return count;
+    }
+
+    nvgTextBoxBounds(x, y, breakRowWidth, string, end, bounds) {
+        const state = nvg__getState(this);
+        const text = nvg__resolveTextEnd(string, end);
+        const asc = { value: 0 };
+        const desc = { value: 0 };
+        const lineh = { value: 0 };
+        this.nvgTextMetrics(asc, desc, lineh);
+
+        const lines = text.split("\n");
+        let maxWidth = 0;
+        let yy = y;
+        const oldAlign = state.textAlign;
+        state.textAlign = (state.textAlign & (NVG_ALIGN_LEFT | NVG_ALIGN_CENTER | NVG_ALIGN_RIGHT)) | NVG_ALIGN_TOP;
+
+        for (const rawLine of lines) {
+            const words = rawLine.length ? rawLine.split(/\s+/) : [""];
+            let line = "";
+            if (rawLine.trim().length === 0) {
+                yy += lineh.value * state.lineHeight;
+                continue;
+            }
+            for (const word of words) {
+                const candidate = line.length === 0 ? word : `${line} ${word}`;
+                const candidateWidth = this.nvgTextBounds(x, yy, candidate, null, null);
+                if (line.length > 0 && candidateWidth > breakRowWidth) {
+                    maxWidth = Math.max(maxWidth, this.nvgTextBounds(x, yy, line, null, null));
+                    yy += lineh.value * state.lineHeight;
+                    line = word;
+                } else {
+                    line = candidate;
+                }
+            }
+            maxWidth = Math.max(maxWidth, this.nvgTextBounds(x, yy, line, null, null));
+            yy += lineh.value * state.lineHeight;
+        }
+
+        state.textAlign = oldAlign;
+        if (bounds) {
+            bounds[0] = x;
+            bounds[1] = y;
+            bounds[2] = x + Math.max(maxWidth, breakRowWidth > 0 ? Math.min(maxWidth, breakRowWidth) : maxWidth);
+            bounds[3] = yy;
+        }
+        return maxWidth;
+    }
+    
+    nvgCreateImage(filename, imageFlags) {
+        let w, h, n, image;
+        let img;
+        stbi_set_unpremultiply_on_load(1); // TODO: stbi_set_unpremultiply_on_load
+        stbi_convert_iphone_png_to_rgb(1); // TODO: stbi_convert_iphone_png_to_rgb
+        img = stbi_load(filename, w, h, n, 4);
+        if (img == null) {
+    //		console.log(`Failed to load ${filename} - ${stbi_failure_reason()}\n`);
+            return 0;
+        }
+        image = this.nvgCreateImageRGBA(w, h, imageFlags, img);
+        stbi_image_free(img); // TODO: stbi_image_free
+        return image;
+    }
+    
+    nvgCreateImageMem(imageFlags, data, ndata)
+    {
+        let w, h, n, image;
+        let img = stbi_load_from_memory(data, ndata, w, h, n, 4); // TODO: stbi_load_from_memory
+        if (img == null) {
+    //		console.log(`Failed to load ${filename} - ${stbi_failure_reason()}\n`);
+            return 0;
+        }
+        image = this.nvgCreateImageRGBA(w, h, imageFlags, img);
+        stbi_image_free(img); // TODO: stbi_image_free
+        return image;
+    }
+    
+    nvgCreateImageRGBA(w, h, imageFlags, data) {
+        return this.params.renderCreateTexture(this.params.userPtr, NVG_TEXTURE_RGBA, w, h, imageFlags, data);
+    }
+    
+    nvgUpdateImage(image, data) {
+        const [w, h] = this.nvgImageSize(image);
+        this.params.renderUpdateTexture(this.params.userPtr, image, 0,0, w,h, data);
+    }
+    
+    nvgImageSize(image) {
+        const size = this.params.renderGetTextureSize(this.params.userPtr, image);
+        if (Array.isArray(size))
+            return size;
+        if (size && typeof size === "object")
+            return [size.width ?? 0, size.height ?? 0];
+        return [0, 0];
+    }
+    
+    nvgDeleteImage(image) {
+        this.params.renderDeleteTexture(this.params.userPtr, image);
+    }
+    
+    nvgLinearGradient(sx, sy, ex, ey, icol, ocol) {
+        var p = {
+            xform: new Array(6),
+            extent: new Array(2),
+            radius: 0.0,
+            feather: 0.0,
+            innerColor: icol,
+            outerColor: ocol
+        };
+        var dx, dy, d;
+        var large = 1e5;
+        
+        dx = ex - sx;
+        dy = ey - sy;
+        d = Math.sqrt(dx * dx + dy * dy);
+        if (d > 0.0001) {
+            dx /= d;
+            dy /= d;
+        } else {
+            dx = 0;
+            dy = 1;
+        }
+    
+        p.xform[0] = dy;
+        p.xform[1] = -dx;
+        p.xform[2] = dx;
+        p.xform[3] = dy;
+        p.xform[4] = sx - dx * large;
+        p.xform[5] = sy - dy * large;
+    
+        p.extent[0] = large;
+        p.extent[1] = large + d * 0.5;
+    
+        p.feather = Math.max(1.0, d);
+    
+        return p;
+    }
+  
+    nvgRadialGradient(cx, cy, inr, outr, icol, ocol) {
+        var p = {
+            xform: new Array(6),
+            extent: new Array(2),
+            radius: (inr + outr) * 0.5,
+            feather: 0.0,
+            innerColor: icol,
+            outerColor: ocol
+        };
+        var f = outr - inr;
+        
+        p.xform[0] = 1.0;
+        p.xform[1] = 0.0;
+        p.xform[2] = 0.0;
+        p.xform[3] = 1.0;
+        
+        p.xform[4] = cx;
+        p.xform[5] = cy;
+        
+        p.extent[0] = p.radius;
+        p.extent[1] = p.radius;
+        
+        p.feather = Math.max(1.0, f);
+        
+        return p;
+    }
+
+    nvgBoxGradient(x, y, w, h, r, f, icol, ocol) {
+        var p = {
+            xform: new Array(6),
+            extent: new Array(2),
+            radius: r,
+            feather: 0.0,
+            innerColor: icol,
+            outerColor: ocol
+        };
+
+        p.xform[0] = 1.0;
+        p.xform[1] = 0.0;
+        p.xform[2] = 0.0;
+        p.xform[3] = 1.0;
+        p.xform[4] = x + w * 0.5;
+        p.xform[5] = y + h * 0.5;
+
+        p.extent[0] = w * 0.5;
+        p.extent[1] = h * 0.5;
+
+        p.feather = Math.max(1.0, f);
+
+        return p;
+    }
+  
+    nvgImagePattern(cx, cy, w, h, angle, image, alpha) {
+        const p = new NVGpaint();
+        nvgTransformRotate(p.xform, angle);
+        p.xform[4] = cx;
+        p.xform[5] = cy;
+
+        p.extent[0] = w;
+        p.extent[1] = h;
+        p.image = image;
+        p.innerColor = NVGcolor.nvgRGBAf(1.0, 1.0, 1.0, alpha);
+        p.outerColor = NVGcolor.nvgRGBAf(1.0, 1.0, 1.0, alpha);
+
+        return p;
+    }
+
+    nvgScissor(x, y, w, h) {
+        const state = nvg__getState(this);
+
+        w = Math.max(0.0, w);
+        h = Math.max(0.0, h);
+
+        nvgTransformIdentity(state.scissor.xform);
+        state.scissor.xform[4] = x + w * 0.5;
+        state.scissor.xform[5] = y + h * 0.5;
+        nvgTransformMultiply(state.scissor.xform, state.xform);
+
+        state.scissor.extent[0] = w * 0.5;
+        state.scissor.extent[1] = h * 0.5;
+    }
+  
+    nvgIntersectScissor(x, y, w, h) {
+        const state = nvg__getState(this);
+        let pxform = new Array(6);
+        let invxorm = new Array(6);
+        let rect = new Array(4);
+        let ex, ey, tex, tey;
+
+        if (state.scissor.extent[0] < 0) {
+            this.nvgScissor(x, y, w, h);
+            return;
+        }
+
+        pxform = state.scissor.xform.slice();
+        ex = state.scissor.extent[0];
+        ey = state.scissor.extent[1];
+        nvgTransformInverse(invxorm, state.xform);
+        nvgTransformMultiply(pxform, invxorm);
+        tex = ex * Math.abs(pxform[0]) + ey * Math.abs(pxform[2]);
+        tey = ex * Math.abs(pxform[1]) + ey * Math.abs(pxform[3]);
+
+        nvg__isectRects(rect, pxform[4] - tex, pxform[5] - tey, tex * 2, tey * 2, x, y, w, h);
+
+        this.nvgScissor(rect[0], rect[1], rect[2], rect[3]);
+    }
+  
+    nvgResetScissor() {
+        const state = nvg__getState(this);
+        state.scissor.xform.fill(0);
+        state.scissor.extent[0] = -1.0;
+        state.scissor.extent[1] = -1.0;
+    }
+
+    nvgGlobalCompositeOperation(op)
+    {
+        const state = nvg__getState(this);
+        state.compositeOperation = nvg__compositeOperationState(op);
+    }
+
+    nvgGlobalCompositeBlendFunc(sfactor, dfactor)
+    {
+        this.nvgGlobalCompositeBlendFuncSeparate(sfactor, dfactor, sfactor, dfactor);
+    }
+
+    nvgGlobalCompositeBlendFuncSeparate(srcRGB, dstRGB, srcAlpha, dstAlpha)
+    {
+        const op = new NVGcompositeOperationState(srcRGB, dstRGB, srcAlpha, dstAlpha);
+        op.srcRGB = srcRGB;
+        op.dstRGB = dstRGB;
+        op.srcAlpha = srcAlpha;
+        op.dstAlpha = dstAlpha;
+
+        const state = nvg__getState(this);
+        state.compositeOperation = op;
+    }
+
+    nvgSkewY(angle)
+    {
+        const state = nvg__getState(this);
+        let t = [];
+        nvgTransformSkewY(t, angle);
+        nvgTransformPremultiply(state.xform, t);
+    }
+
+    nvgScale(x, y)
+    {
+        const state = nvg__getState(this);
+        let t = [];
+        nvgTransformScale(t, x,y);
+        nvgTransformPremultiply(state.xform, t);
+    }
+
+    nvgCurrentTransform(xform) {
+        const state = nvg__getState(this);
+        if (xform == null) return;
+        xform.set(state.xform);
+    }      
+  
+    nvgStrokeColor(color) {
+        const state = nvg__getState(this);
+	    nvg__setPaintColor(state.stroke, color);
+    }
+
+    nvgStrokePaint(paint) {
+        const state = nvg__getState(this);
+        state.stroke = paint;
+        nvgTransformMultiply(state.stroke.xform, state.xform);
+    }
+
+    nvgFillColor(color) {
+        const state = nvg__getState(this);
+	    nvg__setPaintColor(state.fill, color);
+    }
+    
+    nvgFillPaint(paint) {
+        const state = nvg__getState(this);
+        state.fill = paint;
+        nvgTransformMultiply(state.fill.xform, state.xform);
+    }
+    
+}
+
+// TODO:
+
+function nvg__getState(ctx) {
+    return ctx.states[ctx.nstates - 1];
+}  
+
+function nvg__cloneColor(color) {
+    const clone = new NVGcolor();
+    clone.rgba.set(color.rgba);
+    return clone;
+}
+
+function nvg__clonePaint(paint) {
+    const clone = new NVGpaint();
+    clone.image = paint.image;
+    clone.xform.set(paint.xform);
+    clone.extent.set(paint.extent);
+    clone.radius = paint.radius;
+    clone.feather = paint.feather;
+    clone.innerColor = nvg__cloneColor(paint.innerColor);
+    clone.outerColor = nvg__cloneColor(paint.outerColor);
+    return clone;
+}
+
+function nvg__cloneScissor(scissor) {
+    const clone = new NVGscissor();
+    clone.xform = scissor.xform.slice();
+    clone.extent = scissor.extent.slice();
+    clone.enabled = scissor.enabled;
+    return clone;
+}
+
+function nvg__cloneCompositeOperation(op) {
+    return new NVGcompositeOperationState(op.srcRGB, op.dstRGB, op.srcAlpha, op.dstAlpha);
+}
+
+function nvg__cloneState(state) {
+    const clone = new NVGstate();
+    clone.compositeOperation = nvg__cloneCompositeOperation(state.compositeOperation);
+    clone.shapeAntiAlias = state.shapeAntiAlias;
+    clone.fill = nvg__clonePaint(state.fill);
+    clone.stroke = nvg__clonePaint(state.stroke);
+    clone.strokeWidth = state.strokeWidth;
+    clone.miterLimit = state.miterLimit;
+    clone.lineJoin = state.lineJoin;
+    clone.lineCap = state.lineCap;
+    clone.alpha = state.alpha;
+    clone.xform = state.xform.slice();
+    clone.scissor = nvg__cloneScissor(state.scissor);
+    clone.fontSize = state.fontSize;
+    clone.letterSpacing = state.letterSpacing;
+    clone.lineHeight = state.lineHeight;
+    clone.fontBlur = state.fontBlur;
+    clone.textAlign = state.textAlign;
+    clone.fontId = state.fontId;
+    return clone;
+}
+
+function nvgCreateInternal(params) {
+    const fontParams = {};
+    let ctx = new NVGcontext();
+    ctx.params = params;
+    ctx.fontImages = [];
+    ctx.commands = new Float32Array(NVG_INIT_COMMANDS_SIZE);
+    ctx.ncommands = 0;
+    ctx.ccommands = NVG_INIT_COMMANDS_SIZE;
+    ctx.cache = null;
+    ctx.fs = null;
+    ctx.fontImageIdx = 0;
+  
+    if (ctx.params == null) return null;
+  
+    for (let i = 0; i < NVG_MAX_FONTIMAGES; i++) {
+        ctx.fontImages[i] = 0;
+    }
+  
+    ctx.cache = nvg__allocPathCache();
+    if (ctx.cache == null) return null;
+  
+    ctx.nvgSave();
+    ctx.nvgReset();
+  
+    nvg__setDevicePixelRatio(ctx, 1.0);
+  
+    if (ctx.params.renderCreate(ctx.params.userPtr) === 0) return null;
+  
+    Object.assign(fontParams, {
+        width: NVG_INIT_FONTIMAGE_SIZE,
+        height: NVG_INIT_FONTIMAGE_SIZE,
+        flags: FONS_ZERO_TOPLEFT,
+        renderCreate: null,
+        renderUpdate: null,
+        renderDraw: null,
+        renderDelete: null,
+        userPtr: null
+    });
+    ctx.fs = new FONScontext(fontParams);
+    if (ctx.fs == null) return null;
+  
+    ctx.fontImages[0] = ctx.params.renderCreateTexture(ctx.params.userPtr, NVG_TEXTURE_ALPHA, fontParams.width, fontParams.height, 0, null);
+    if (ctx.fontImages[0] === 0) return null;
+    ctx.fontImageIdx = 0;
+  
+    return ctx;
+}
+
+function nvgInternalParams(ctx) {
+    return ctx.params;
+}  
+
+function nvgDeleteInternal(ctx) {
+    if (ctx == null) return;
+  
+    if (ctx.commands != null) {
+        ctx.commands = null;
+    }
+  
+    if (ctx.cache != null) {
+        nvg__deletePathCache(ctx.cache);
+    }
+  
+    if (ctx.fs != null) {
+        fonsDeleteInternal(ctx.fs);
+    }
+  
+    for (let i = 0; i < NVG_MAX_FONTIMAGES; i++) {
+        if (ctx.fontImages[i] != 0) {
+            ctx.nvgDeleteImage(ctx.fontImages[i]);
+            ctx.fontImages[i] = 0;
+        }
+    }
+  
+    if (ctx.params.renderDelete != null) {
+        ctx.params.renderDelete(ctx.params.userPtr);
+    }
+  
+    ctx = null;
+}  
+
+function nvg__setDevicePixelRatio(ctx, ratio)
+{
+    ratio = Number(ratio.toFixed(2));
+	ctx.tessTol = 0.25 / ratio;
+	ctx.distTol = 0.01 / ratio;
+	ctx.fringeWidth = 1.0 / ratio;
+	ctx.devicePxRatio = ratio;
+}
+
+function nvgRGB(r, g, b) { return NVGcolor.nvgRGB(r, g, b); }
+function nvgRGBf(r, g, b) { return NVGcolor.nvgRGBf(r, g, b); }
+function nvgRGBA(r, g, b, a) { return NVGcolor.nvgRGBA(r, g, b, a); }
+function nvgRGBAf(r, g, b, a) { return NVGcolor.nvgRGBAf(r, g, b, a); }
+function nvgTransRGBA(c, a) { return NVGcolor.nvgTransRGBA(c, a); }
+function nvgTransRGBAf(c, a) { return NVGcolor.nvgTransRGBAf(c, a); }
+function nvgLerpRGBA(c0, c1, u) { return NVGcolor.nvgLerpRGBA(c0, c1, u); }
+function nvgHSL(h, s, l) { return NVGcolor.nvgHSL(h, s, l); }
+function nvgHSLA(h, s, l, a) { return NVGcolor.nvgHSLA(h, s, l, a); }
+
+function nvg__compositeOperationState(op) {
+    let sfactor, dfactor;
+  
+    switch(op)
+    {
+        case NVG_SOURCE_OVER:{
+            sfactor = NVG_ONE;
+            dfactor = NVG_ONE_MINUS_SRC_ALPHA;
+            break;
+        }
+        case NVG_SOURCE_IN: {
+            sfactor = NVG_DST_ALPHA;
+            dfactor = NVG_ZERO;
+            break;
+        }
+        case NVG_SOURCE_OUT: {
+            sfactor = NVG_ONE_MINUS_DST_ALPHA;
+            dfactor = NVG_ZERO;
+            break;
+        }
+        case NVG_ATOP: {
+            sfactor = NVG_DST_ALPHA;
+            dfactor = NVG_ONE_MINUS_SRC_ALPHA;
+            break;
+        }
+        case NVG_DESTINATION_OVER: {
+            sfactor = NVG_ONE_MINUS_DST_ALPHA;
+            dfactor = NVG_ONE;
+            break;
+        }
+        case NVG_DESTINATION_IN: {
+            sfactor = NVG_ZERO;
+            dfactor = NVG_SRC_ALPHA;
+            break;
+        }
+        case NVG_DESTINATION_OUT: {
+            sfactor = NVG_ZERO;
+            dfactor = NVG_ONE_MINUS_SRC_ALPHA;
+            break;
+        }
+        case NVG_DESTINATION_ATOP: {
+            sfactor = NVG_ONE_MINUS_DST_ALPHA;
+            dfactor = NVG_SRC_ALPHA;
+            break;
+        }
+        case NVG_LIGHTER: {
+            sfactor = NVG_ONE;
+            dfactor = NVG_ONE;
+            break;
+        }
+        case NVG_COPY: {
+            sfactor = NVG_ONE;
+            dfactor = NVG_ZERO;
+            break;
+        }
+        case NVG_XOR: {
+            sfactor = NVG_ONE_MINUS_DST_ALPHA;
+            dfactor = NVG_ONE_MINUS_SRC_ALPHA;
+            break;
+        }
+        default: {
+            sfactor = NVG_ONE;
+            dfactor = NVG_ZERO;
+            break;
+        }
+    }
+  
+    const state = new NVGcompositeOperationState(sfactor, dfactor, sfactor, dfactor);
+    return state;
+}
+
+function nvg__hue(h, m1, m2)
+{
+	if (h < 0) h += 1;
+	if (h > 1) h -= 1;
+	if (h < 1.0/6.0)
+		return m1 + (m2 - m1) * h * 6.0;
+	else if (h < 3.0/6.0)
+		return m2;
+	else if (h < 4.0/6.0)
+		return m1 + (m2 - m1) * (2.0/3.0 - h) * 6.0;
+	return m1;
+}
+
+function fmodf(a, b) {
+    return ((a % b) + b) % b;
+}
+
+function nvg__modf(a, b) {
+    return fmodf(a, b);
+}
+
+function nvg__clampf(a, mn, mx) { 
+    return a < mn ? mn : (a > mx ? mx : a); 
+}
+
+function nvg__sqrtf(a) { return Math.sqrt(a); }
+function nvg__sinf(a) { return Math.sin(a); }
+function nvg__cosf(a) { return Math.cos(a); }
+function nvg__tanf(a) { return Math.tan(a); }
+function nvg__atan2f(a, b) { return Math.atan2(a, b); }
+function nvg__acosf(a) { return Math.acos(a); }
+function nvg__mini(a, b) { return a < b ? a : b; }
+function nvg__maxi(a, b) { return a > b ? a : b; }
+function nvg__clampi(a, mn, mx) { return a < mn ? mn : (a > mx ? mx : a); }
+function nvg__absf(a) { return a >= 0.0 ? a : -a; }
+function nvg__signf(a) { return a >= 0.0 ? 1.0 : -1.0; }
+function nvg__cross(dx0, dy0, dx1, dy1) { return dx1 * dy0 - dx0 * dy1; }
+
+function nvg__isectRects(dst, ax, ay, aw, ah, bx, by, bw, bh) {
+    let minx = Math.max(ax, bx);
+    let miny = Math.max(ay, by);
+    let maxx = Math.min(ax + aw, bx + bw);
+    let maxy = Math.min(ay + ah, by + bh);
+    dst[0] = minx;
+    dst[1] = miny;
+    dst[2] = Math.max(0.0, maxx - minx);
+    dst[3] = Math.max(0.0, maxy - miny);
+}
+
+function nvgTransformInverse(inv, t) {
+    let invdet, det = t[0] * t[3] - t[2] * t[1];
+    if (det > -1e-6 && det < 1e-6) {
+      nvgTransformIdentity(inv);
+      return 0;
+    }
+    invdet = 1.0 / det;
+    inv[0] = t[3] * invdet;
+    inv[2] = -t[2] * invdet;
+    inv[4] = (t[2] * t[5] - t[3] * t[4]) * invdet;
+    inv[1] = -t[1] * invdet;
+    inv[3] = t[0] * invdet;
+    inv[5] = (t[1] * t[4] - t[0] * t[5]) * invdet;
+    return 1;
+}
+
+function nvgTransformIdentity(t) {
+    t[0] = 1.0; t[1] = 0.0;
+    t[2] = 0.0; t[3] = 1.0;
+    t[4] = 0.0; t[5] = 0.0;
+}
+
+function nvgTransformTranslate(t, tx, ty) {
+    t[0] = 1.0; t[1] = 0.0;
+    t[2] = 0.0; t[3] = 1.0;
+    t[4] = tx; t[5] = ty;
+}
+  
+function nvgTransformScale(t, sx, sy) {
+    t[0] = sx; t[1] = 0.0;
+    t[2] = 0.0; t[3] = sy;
+    t[4] = 0.0; t[5] = 0.0;
+}
+  
+function nvgTransformRotate(t, a) {
+    var cs = Math.cos(a), sn = Math.sin(a);
+    t[0] = cs; t[1] = sn;
+    t[2] = -sn; t[3] = cs;
+    t[4] = 0.0; t[5] = 0.0;
+}
+  
+function nvgTransformSkewX(t, a) {
+    t[0] = 1.0; t[1] = 0.0;
+    t[2] = Math.tan(a); t[3] = 1.0;
+    t[4] = 0.0; t[5] = 0.0;
+}
+  
+function nvgTransformSkewY(t, a) {
+    t[0] = 1.0; t[1] = Math.tan(a);
+    t[2] = 0.0; t[3] = 1.0;
+    t[4] = 0.0; t[5] = 0.0;
+}
+
+function nvgTransformMultiply(t, s) {
+    var t0 = t[0] * s[0] + t[1] * s[2];
+    var t2 = t[2] * s[0] + t[3] * s[2];
+    var t4 = t[4] * s[0] + t[5] * s[2] + s[4];
+    t[1] = t[0] * s[1] + t[1] * s[3];
+    t[3] = t[2] * s[1] + t[3] * s[3];
+    t[5] = t[4] * s[1] + t[5] * s[3] + s[5];
+    t[0] = t0;
+    t[2] = t2;
+    t[4] = t4;
+}  
+  
+function nvgTransformPremultiply(t, s) {
+    const s2 = s.slice(0);
+    nvgTransformMultiply(s2, t);
+    if (typeof t.set === "function")
+        t.set(s2);
+    else
+        for (let i = 0; i < 6; i++) t[i] = s2[i];
+}  
+
+function nvg__setPaintColor(p, color) {
+    p.xform = new Array(6).fill(0);
+    p.extent = new Array(2).fill(0);
+    p.radius = 0.0;
+    p.feather = 0.0;
+    p.innerColor = new NVGcolor();
+    p.outerColor = new NVGcolor();
+    p.image = 0;
+	nvgTransformIdentity(p.xform);
+	p.feather = 1.0;
+	p.innerColor = color;
+	p.outerColor = color;
+}
+  
+function nvg__appendCommands(ctx, vals, nvals) {
+    const state = nvg__getState(ctx);
+    let i;
+  
+    if (ctx.ncommands + nvals > ctx.ccommands) {
+        let commands;
+        let ccommands = ctx.ncommands + nvals + Math.floor(ctx.ccommands / 2);
+        commands = new Float32Array(ccommands);
+        commands.set(ctx.commands);
+        ctx.commands = commands;
+        ctx.ccommands = ccommands;
+    }
+  
+    if (vals[0] !== NVG_CLOSE && vals[0] !== NVG_WINDING) {
+        ctx.commandx = vals[nvals - 2];
+        ctx.commandy = vals[nvals - 1];
+    }
+  
+    i = 0;
+    while (i < nvals) {
+        let cmd = vals[i];
+        switch (cmd) {
+            case NVG_MOVETO:{
+                [vals[i + 1], vals[i + 2]] = nvgTransformPoint(state.xform, vals[i + 1], vals[i + 2]);
+                i += 3;
+                break;
+            }
+            case NVG_LINETO:
+                [vals[i + 1], vals[i + 2]] = nvgTransformPoint(state.xform, vals[i + 1], vals[i + 2]);
+                i += 3;
+                break;
+            case NVG_BEZIERTO:
+                [vals[i + 1], vals[i + 2]] = nvgTransformPoint(state.xform, vals[i + 1], vals[i + 2]);
+                [vals[i + 3], vals[i + 4]] = nvgTransformPoint(state.xform, vals[i + 3], vals[i + 4]);
+                [vals[i + 5], vals[i + 6]] = nvgTransformPoint(state.xform, vals[i + 5], vals[i + 6]);
+                i += 7;
+                break;
+            case NVG_CLOSE:
+                i++;
+                break;
+            case NVG_WINDING:
+                i += 2;
+                break;
+            default:
+                i++;
+                break;
+        }
+    }
+    
+
+    //ctx.commands.set(ctx.commands[ctx.ncommands], ctx.ncommands);
+    ctx.commands.set(vals, ctx.ncommands);
+    ctx.ncommands += nvals;
+}
+
+function nvgTransformPoint(t, sx, sy) {
+    return [
+        sx * t[0] + sy * t[2] + t[4],
+        sx * t[1] + sy * t[3] + t[5],
+    ];
+}  
+
+function nvgDegToRad(deg) {
+    return (deg / 180.0) * Math.PI;
+}
+  
+function nvgRadToDeg(rad) {
+    return (rad / Math.PI) * 180.0;
+}  
+
+function NVG_COUNTOF(arr) {
+    return arr.length;
+}  
+
+function nvg__ptEquals(x1, y1, x2, y2, tol)
+{
+	let dx = x2 - x1;
+	let dy = y2 - y1;
+	return dx*dx + dy*dy < tol*tol;
+}
+
+function nvg__triarea2(ax, ay, bx, by, cx, cy)
+{
+	let abx = bx - ax;
+	let aby = by - ay;
+	let acx = cx - ax;
+	let acy = cy - ay;
+	return acx*aby - abx*acy;
+}
+
+function nvg__polyArea(pts, npts) {
+    var i;
+    var area = 0;
+    for (i = 2; i < npts; i++) {
+        var a = pts[0];
+        var b = pts[i - 1];
+        var c = pts[i];
+        area += nvg__triarea2(a.x, a.y, b.x, b.y, c.x, c.y);
+    }
+    return area * 0.5;
+}
+
+function nvg__polyReverse(pts, npts) {
+    var tmp;
+    var i = 0, j = npts - 1;
+    while (i < j) {
+        tmp = pts[i];
+        pts[i] = pts[j];
+        pts[j] = tmp;
+        i++;
+        j--;
+    }
+}
+
+function nvg__polyReverseRange(points, first, npts) {
+    let i = 0;
+    let j = npts - 1;
+    while (i < j) {
+        const a = first + i;
+        const b = first + j;
+        const tmp = points[a];
+        points[a] = points[b];
+        points[b] = tmp;
+        i++;
+        j--;
+    }
+}
+  
+
+function nvg__distPtSeg(x, y, px, py, qx, qy)
+{
+	let pqx, pqy, dx, dy, d, t;
+	pqx = qx-px;
+	pqy = qy-py;
+	dx = x-px;
+	dy = y-py;
+	d = pqx*pqx + pqy*pqy;
+	t = pqx*dx + pqy*dy;
+	if (d > 0) t /= d;
+	if (t < 0) t = 0;
+	else if (t > 1) t = 1;
+	dx = px + t*pqx - x;
+	dy = py + t*pqy - y;
+	return dx*dx + dy*dy;
+}
+
+function nvg__normalize(x, y)
+{
+	const d = Math.sqrt(x * x + y * y);
+    if (d > 1e-6) {
+        const id = 1.0 / d;
+        x *= id;
+        y *= id;
+	}
+	return d;
+}
+
+function nvg__normalizeXY(x, y) {
+    const d = nvg__sqrtf(x * x + y * y);
+    if (d > 1e-6) {
+        const id = 1.0 / d;
+        x *= id;
+        y *= id;
+    }
+    return [x, y, d];
+}
+
+function nvg__normalize_(pt)
+{
+	const d = Math.sqrt(pt.dx * pt.dx + pt.dy * pt.dy);
+    if (d > 1e-6) {
+        const id = 1.0 / d;
+        pt.dx *= id;
+        pt.dy *= id;
+    }
+    return d;
+}
+
+function nvg__deletePathCache(c)
+{
+	if (c == null) return;
+	if (c != null) c = null;
+}
+
+function nvg__allocPathCache()
+{
+	let c = new NVGpathCache();
+	if (c == null) goto_path_cache_error();
+
+    c.points = new Array(NVG_INIT_POINTS_SIZE);
+    if (!c.points) goto_path_cache_error();
+    c.npoints = 0;
+    c.cpoints = NVG_INIT_POINTS_SIZE;
+
+    c.paths = new Array(NVG_INIT_PATHS_SIZE);
+    if (!c.paths) goto_path_cache_error();
+    c.npaths = 0;
+    c.cpaths = NVG_INIT_PATHS_SIZE;
+
+    c.verts = new ArrayBuffer(NVG_INIT_VERTS_SIZE);
+    if (!c.verts) goto_path_cache_error();
+    c.nverts = 0;
+    c.cverts = NVG_INIT_VERTS_SIZE;
+
+	return c;
+}
+
+function goto_path_cache_error()
+{
+	nvg__deletePathCache(c);
+	return null;
+}
+
+function nvg__minf(a, b) { return a < b ? a : b; }
+function nvg__maxf(a, b) { return a > b ? a : b; }
+
+function nvg__flattenPaths(ctx) {
+    let cache = ctx.cache;
+    let last;
+    let p0;
+    let p1;
+    let pts;
+    let path;
+    let i, j;
+    let cp1;
+    let cp2;
+    let p;
+    let area;
+  
+    if (cache.npaths > 0)
+      return;
+  
+    i = 0;
+    while (i < ctx.ncommands) {
+        let cmd = ctx.commands[i];
+        switch (cmd) {
+            case NVG_MOVETO:
+                nvg__addPath(ctx);
+                p = ctx.commands.slice(i + 1, i + 3);
+                nvg__addPoint(ctx, p[0], p[1], NVG_PT_CORNER);
+                i += 3;
+                break;
+            case NVG_LINETO:
+                p = ctx.commands.slice(i + 1, i + 3);
+                nvg__addPoint(ctx, p[0], p[1], NVG_PT_CORNER);
+                i += 3;
+                break;
+            case NVG_BEZIERTO:
+                last = nvg__lastPoint(ctx);
+                if (last != null) {
+                    cp1 = ctx.commands.slice(i + 1, i + 3);
+                    cp2 = ctx.commands.slice(i + 3, i + 5);
+                    p = ctx.commands.slice(i + 5, i + 7);
+                    nvg__tesselateBezier(
+                    ctx,
+                    last.x,
+                    last.y,
+                    cp1[0],
+                    cp1[1],
+                    cp2[0],
+                    cp2[1],
+                    p[0],
+                    p[1],
+                    0,
+                    NVG_PT_CORNER
+                    );
+                }
+                i += 7;
+                break;
+            case NVG_CLOSE:
+                nvg__closePath(ctx);
+                i++;
+                break;
+            case NVG_WINDING:
+                nvg__pathWinding(ctx, ctx.commands[i + 1]);
+                i += 2;
+                break;
+            default:
+                i++;
+                break;
+        }
+    }
+    cache.bounds[0] = cache.bounds[1] = 1e6;
+    cache.bounds[2] = cache.bounds[3] = -1e6;
+  
+    for (j = 0; j < cache.npaths; j++) {
+        path = cache.paths[j];
+        pts = ctx.cache.points.slice(path.first, path.first + path.count);
+
+        p0 = pts[path.count - 1];
+        p1 = pts[0];
+        if (nvg__ptEquals(p0.x, p0.y, p1.x, p1.y, ctx.distTol)) {
+            path.count--;
+            p0 = pts[path.count - 1];
+            path.closed = 1;
+        }
+
+        if (path.count > 2) {
+            area = nvg__polyArea(pts, path.count);
+            if (path.winding === NVG_CCW && area < 0.0) {
+                nvg__polyReverseRange(ctx.cache.points, path.first, path.count);
+                pts = ctx.cache.points.slice(path.first, path.first + path.count);
+            }
+            if (path.winding === NVG_CW && area > 0.0) {
+                nvg__polyReverseRange(ctx.cache.points, path.first, path.count);
+                pts = ctx.cache.points.slice(path.first, path.first + path.count);
+            }
+        }
+
+        p0 = pts[path.count - 1];
+        p1 = pts[0];
+
+        for (i = 0; i < path.count; i++) {
+            p0.dx = p1.x - p0.x;
+            p0.dy = p1.y - p0.y;
+            p0.len = nvg__normalize_(p0);
+            cache.bounds[0] = nvg__minf(cache.bounds[0], p0.x);
+            cache.bounds[1] = nvg__minf(cache.bounds[1], p0.y);
+            cache.bounds[2] = nvg__maxf(cache.bounds[2], p0.x);
+            cache.bounds[3] = nvg__maxf(cache.bounds[3], p0.y);
+            p0 = p1;
+            p1 = pts[i + 1];
+        }
+    }
+}
+
+/*function nvg__addPath(ctx) {
+    console.log(`nvg__addPath()`)
+    let path = new NVGpath();
+    if (ctx.cache.npaths + 1 > ctx.cache.cpaths) {
+        const cpaths = ctx.cache.npaths + 1 + Math.floor(ctx.cache.cpaths / 2);
+        const paths = new Array(cpaths);
+        for (let i = 0; i < ctx.cache.paths.length; i++) {
+            paths[i] = ctx.cache.paths[i];
+        }
+        ctx.cache.paths = paths;
+        ctx.cache.cpaths = cpaths;
+    }
+    //path = ctx.cache.paths[ctx.cache.npaths];
+    console.log(path)
+    path.first = ctx.cache.npoints;
+    path.winding = NVG_CCW;
+    ctx.cache.npaths++;
+    ctx.cache.paths.push(path);
+    console.log("ctx.cache.npaths: "+ctx.cache.npaths)
+}*/
+
+function nvg__addPath(ctx) {
+    const cache = ctx.cache;
+    if (cache.npaths + 1 > cache.cpaths) {
+        const cpaths = cache.npaths + 1 + Math.floor(cache.cpaths / 2);
+        const paths = new Array(cpaths);
+        paths.set(cache.paths);
+        cache.paths = paths;
+        cache.cpaths = cpaths;
+    }
+    const path = new NVGpath();
+    //const path = cache.paths[cache.npaths];
+    path.first = cache.npoints;
+    path.winding = NVG_CCW;
+    cache.npaths = cache.npaths + 1;
+    cache.paths[cache.npaths-1] = path;
+}
+
+  
+function nvg__lastPoint(ctx) {
+    if (ctx.cache.npoints > 0) {
+        return ctx.cache.points[ctx.cache.npoints - 1];
+    }
+    return null;
+}
+  
+function nvg__addPoint(ctx, x, y, flags) {
+    const path = nvg__lastPath(ctx);
+    let pt = new NVGpoint();
+    if (path == null) return;
+  
+    if (path.count > 0 && ctx.cache.npoints > 0) {
+        pt = nvg__lastPoint(ctx);
+        if (nvg__ptEquals(pt.x, pt.y, x, y, ctx.distTol)) {
+            pt.flags |= flags;
+            return;
+        }
+    }
+  
+    if (ctx.cache.npoints + 1 > ctx.cache.cpoints) {
+        const cpoints = ctx.cache.npoints + 1 + Math.floor(ctx.cache.cpoints / 2);
+        const points = new Array(cpoints);
+        for (let i = 0; i < ctx.cache.points.length; i++) {
+            points[i] = ctx.cache.points[i];
+        }
+        ctx.cache.points = points;
+        ctx.cache.cpoints = cpoints;
+    }
+  
+    pt = new NVGpoint();
+    pt.x = x;
+    pt.y = y;
+    pt.flags = flags;
+  
+    ctx.cache.points[ctx.cache.npoints] = pt;
+    ctx.cache.npoints++;
+    path.count = path.count + 1;
+}  
+
+function nvg__clearPathCache(ctx)
+{
+	ctx.cache.npoints = 0;
+	ctx.cache.npaths = 0;
+}
+
+function nvg__lastPath(ctx) {
+    if (ctx.cache.npaths > 0) {
+      return ctx.cache.paths[ctx.cache.npaths - 1];
+    }
+    return null;
+}
+
+function nvg__closePath(ctx) {
+    const path = nvg__lastPath(ctx);
+    if (path == null) return;
+    path.closed = 1;
+}  
+
+function nvg__tesselateBezier(ctx, x1, y1, x2, y2, x3, y3, x4, y4, level, type) {
+    var x12, y12, x23, y23, x34, y34, x123, y123, x234, y234, x1234, y1234;
+    var dx, dy, d2, d3;
+  
+    if (level > 10) return;
+  
+    x12 = (x1 + x2) * 0.5;
+    y12 = (y1 + y2) * 0.5;
+    x23 = (x2 + x3) * 0.5;
+    y23 = (y2 + y3) * 0.5;
+    x34 = (x3 + x4) * 0.5;
+    y34 = (y3 + y4) * 0.5;
+    x123 = (x12 + x23) * 0.5;
+    y123 = (y12 + y23) * 0.5;
+  
+    dx = x4 - x1;
+    dy = y4 - y1;
+    d2 = Math.abs((x2 - x4) * dy - (y2 - y4) * dx);
+    d3 = Math.abs((x3 - x4) * dy - (y3 - y4) * dx);
+  
+    if ((d2 + d3) * (d2 + d3) < ctx.tessTol * (dx * dx + dy * dy)) {
+        nvg__addPoint(ctx, x4, y4, type);
+        return;
+    }
+  
+    x234 = (x23 + x34) * 0.5;
+    y234 = (y23 + y34) * 0.5;
+    x1234 = (x123 + x234) * 0.5;
+    y1234 = (y123 + y234) * 0.5;
+  
+    nvg__tesselateBezier(ctx, x1, y1, x12, y12, x123, y123, x1234, y1234, level + 1, 0);
+    nvg__tesselateBezier(ctx, x1234, y1234, x234, y234, x34, y34, x4, y4, level + 1, type);
+}  
+
+function nvg__pathWinding(ctx, winding)
+{
+	const path = nvg__lastPath(ctx);
+	if (path == null) return;
+	path.winding = winding;
+}
+
+function nvg__calculateJoins(ctx, w, lineJoin, miterLimit) {
+    var cache = ctx.cache;
+    var i, j;
+    var iw = 0.0;
+  
+    if (w > 0.0) {
+        iw = 1.0 / w;
+    }
+  
+    for (i = 0; i < cache.npaths; i++) {
+        var path = cache.paths[i];
+        var pts = cache.points.slice(path.first, path.first + path.count);
+        var p0 = pts[path.count - 1];
+        var p1 = pts[0];
+        var nleft = 0;
+    
+        path.nbevel = 0;
+    
+        for (j = 0; j < path.count; j++) {
+            var dlx0 = p0.dy;
+            var dly0 = -p0.dx;
+            var dlx1 = p1.dy;
+            var dly1 = -p1.dx;
+            p1.dmx = (dlx0 + dlx1) * 0.5;
+            p1.dmy = (dly0 + dly1) * 0.5;
+            var dmr2 = p1.dmx * p1.dmx + p1.dmy * p1.dmy;
+            if (dmr2 > 0.000001) {
+                var scale = 1.0 / dmr2;
+                if (scale > 600.0) {
+                    scale = 600.0;
+                }
+                p1.dmx *= scale;
+                p1.dmy *= scale;
+            }
+    
+            p1.flags = (p1.flags & NVG_PT_CORNER) ? NVG_PT_CORNER : 0;
+    
+            var cross = p1.dx * p0.dy - p0.dx * p1.dy;
+            if (cross > 0.0) {
+                nleft++;
+                p1.flags |= NVG_PT_LEFT;
+            }
+    
+            var limit = nvg__maxf(1.01, nvg__minf(p0.len, p1.len) * iw);
+            if (dmr2 * limit * limit < 1.0) {
+                p1.flags |= NVG_PR_INNERBEVEL;
+            }
+    
+            if (p1.flags & NVG_PT_CORNER) {
+                if (dmr2 * miterLimit * miterLimit < 1.0 || lineJoin == NVG_BEVEL || lineJoin == NVG_ROUND) {
+                    p1.flags |= NVG_PT_BEVEL;
+                }
+            }
+    
+            if ((p1.flags & (NVG_PT_BEVEL | NVG_PR_INNERBEVEL)) !== 0) {
+                path.nbevel++;
+            }            
+    
+            p0 = p1;
+            p1 = pts[j + 1];
+        }
+    
+        path.convex = (nleft === path.count) ? 1 : 0;
+    }
+}
+
+function nvg__expandFill(ctx, w, lineJoin, miterLimit) {
+    let cache = ctx.cache;
+    let aa = ctx.fringeWidth;
+    let fringe = w > 0.0;
+
+    nvg__calculateJoins(ctx, w, lineJoin, miterLimit);
+  
+    let cverts = 0;
+    for (let i = 0; i < cache.npaths; i++) {
+        let path = cache.paths[i];
+        cverts += path.count + path.nbevel + 1;
+        if (fringe) cverts += (path.count + path.nbevel * 5 + 1) * 2;
+    }
+
+    let verts = nvg__allocTempVerts(ctx, cverts);
+    if (verts == null) return 0;
+    
+    let convex = cache.npaths === 1 && cache.paths[0].convex;
+    let dst = 0;
+  
+    for (let i = 0; i < cache.npaths; i++) {
+        let path = cache.paths[i];
+        let pts = cache.points.slice(path.first, path.first + path.count);
+        let woff = 0.5 * aa;
+        
+        path.fillOffset = dst;
+    
+        if (fringe) {
+            let p0 = pts[path.count - 1];
+            let p1 = pts[0];
+            
+            for (let j = 0; j < path.count; ++j) {
+                if (p1.flags & NVG_PT_BEVEL) {
+                    let dlx0 = p0.dy;
+                    let dly0 = -p0.dx;
+                    let dlx1 = p1.dy;
+                    let dly1 = -p1.dx;
+                    
+                    if (p1.flags & NVG_PT_LEFT) {
+                        let vtx = new NVGvertex(verts, dst++);
+                        nvg__vset(vtx, p1.x + p1.dmx * woff, p1.y + p1.dmy * woff, 0.5, 1);
+                    } else {
+                        let vtx0 = new NVGvertex(verts, dst++);
+                        nvg__vset(vtx0, p1.x + dlx0 * woff, p1.y + dly0 * woff, 0.5, 1);
+                        let vtx1 = new NVGvertex(verts, dst++);
+                        nvg__vset(vtx1, p1.x + dlx1 * woff, p1.y + dly1 * woff, 0.5, 1);
+                    }
+                } else {
+                    let vtx = new NVGvertex(verts, dst++);
+                    nvg__vset(vtx, p1.x + p1.dmx * woff, p1.y + p1.dmy * woff, 0.5, 1);
+                }
+                p0 = p1;
+                p1 = pts[j + 1];
+            }
+        } else {
+            for (let j = 0; j < path.count; ++j) {
+                let vtx = new NVGvertex(verts, dst++);
+                nvg__vset(vtx, pts[j].x, pts[j].y, 0.5, 1);
+            }
+        }
+    
+        path.nfill = dst - path.fillOffset;
+        
+        let fillStart = path.fillOffset * 4;
+        let fillCount = path.nfill * 4;
+        let vertsView = new Float32Array(verts, path.fillOffset * NVG_VERTEX_SIZEOF, path.nfill * 4);
+        path.fill = new Float32Array(fillCount);
+        path.fill.set(vertsView);
+    
+        if (fringe) {
+            path.strokeOffset = dst;
+            path.nstroke = dst - path.strokeOffset;
+            
+            let strokeView = new Float32Array(verts, path.strokeOffset * NVG_VERTEX_SIZEOF, path.nstroke * 4);
+            path.stroke = new Float32Array(path.nstroke * 4);
+            path.stroke.set(strokeView);
+        }
+    }
+  
+    return 1;
+}
+
+function nvg__getAverageScale(t)
+{
+	let sx = Math.sqrt(t[0]*t[0] + t[2]*t[2]);
+	let sy = Math.sqrt(t[1]*t[1] + t[3]*t[3]);
+	return (sx + sy) * 0.5;
+}
+
+function nvg__getFontScale(state)
+{
+	return nvg__minf(nvg__quantize(nvg__getAverageScale(state.xform), 0.01), 4.0);
+}
+
+function nvg__quantize(a, d)
+{
+	return Math.round(a / d) * d;
+}
+
+function nvg__allocTempVerts(ctx, nverts) {
+    //if (nverts > ctx.cache.cverts) {
+        var cverts = (nverts + 0xff) & ~0xff;
+        var new_verts = new ArrayBuffer(cverts * NVG_VERTEX_SIZEOF);
+        //TODO: resize due to realloc
+        ctx.cache.verts = new_verts;
+        ctx.cache.cverts = cverts;
+    //}
+  
+    return ctx.cache.verts;
+}
+
+/*function nvg__vsetCore(ctx, verts, vtx, x, y, u, v) {
+    //console.log("x: " + x + " y: " + y + " vtx: " + vtx)
+    var vertexOffset = vtx * (NVG_VERTEX_SIZEOF / Float32Array.BYTES_PER_ELEMENT);
+
+    ctx.cache.verts[vertexOffset] = x;
+    ctx.cache.verts[vertexOffset + 1] = y;
+    ctx.cache.verts[vertexOffset + 2] = u;
+    ctx.cache.verts[vertexOffset + 3] = v;
+
+    verts = ctx.cache.verts;
+    //verts[vtx] = {x, y, u, v};
+}*/
+
+function nvg__vsetCore(ctx, verts, vtx, x, y, u, v) {
+    let vert = new NVGvertex(ctx.cache.verts, vtx);
+    vert.x = x;
+    vert.y = y;
+    vert.u = u;
+    vert.v = v;
+}
+
+//function nvg__vsetCore(ctx, verts, vtx, x, y, u, v) {
+//    console.log("v: " + x + " y: " + y + " vtx: " + vtx)
+//    verts[vtx] = {x, y, u, v};
+//    ctx.cache.verts[vtx] = verts[vtx];
+//    //console.log(ctx.cache.verts)
+//}
+
+// Other functions
+//function fmodf(a, b) {
+//    return a % b;
+//}
+
+
+function nvg__expandStroke(ctx, w, fringe, lineCap, lineJoin, miterLimit) {
+    let cache = ctx.cache;
+    let aa = fringe; // ctx.fringeWidth
+    let u0 = 0.0, u1 = 1.0;
+    let ncap = nvg__curveDivs(w, Math.PI, ctx.tessTol);
+
+    w += aa * 0.5;
+
+    if (aa === 0.0) {
+        u0 = 0.5;
+        u1 = 0.5;
+    }
+
+    nvg__calculateJoins(ctx, w, lineJoin, miterLimit);
+
+    let cverts = 0;
+    for (let i = 0; i < cache.npaths; i++) {
+        let path = cache.paths[i];
+        let loop = path.closed ? 1 : 0;
+        if (lineJoin === NVG_ROUND)
+            cverts += (path.count + path.nbevel * (ncap + 2) + 1) * 2;
+        else
+            cverts += (path.count + path.nbevel * 5 + 1) * 2;
+        if (loop === 0) {
+            if (lineCap === NVG_ROUND) {
+                cverts += (ncap * 2 + 2) * 2;
+            } else {
+                cverts += (3 + 3) * 2;
+            }
+        }
+    }
+
+    let verts = nvg__allocTempVerts(ctx, cverts);
+    if (verts === null) return 0;
+
+    let dst = 0;
+    for (let i = 0; i < cache.npaths; i++) {
+        let path = cache.paths[i];
+        let pts = cache.points.slice(path.first, path.first + path.count);
+        let p0, p1;
+        let s, e, loop;
+        let dx, dy;
+
+        path.fill = null;
+        path.nfill = 0;
+
+        loop = path.closed ? 1 : 0;
+        path.strokeOffset = dst;
+
+        if (loop) {
+            p0 = pts[path.count - 1];
+            p1 = pts[0];
+            s = 0;
+            e = path.count;
+        } else {
+            p0 = pts[0];
+            p1 = pts[1];
+            s = 1;
+            e = path.count - 1;
+        }
+
+        if (loop === 0) {
+            dx = p1.x - p0.x;
+            dy = p1.y - p0.y;
+            ({ x: dx, y: dy } = nvg__normalize_xy(dx, dy));
+            if (lineCap === NVG_BUTT)
+                dst = nvg__buttCapStart(ctx, verts, dst, p0, dx, dy, w, -aa * 0.5, aa, u0, u1);
+            else if (lineCap === NVG_SQUARE)
+                dst = nvg__buttCapStart(ctx, verts, dst, p0, dx, dy, w, w - aa, aa, u0, u1);
+            else if (lineCap === NVG_ROUND)
+                dst = nvg__roundCapStart(ctx, verts, dst, p0, dx, dy, w, ncap, aa, u0, u1);
+        }
+
+        for (let j = s; j < e; ++j) {
+            if ((p1.flags & (NVG_PT_BEVEL | NVG_PR_INNERBEVEL)) !== 0) {
+                if (lineJoin === NVG_ROUND) {
+                    dst = nvg__roundJoin(ctx, verts, dst, p0, p1, w, w, u0, u1, ncap, aa);
+                } else {
+                    dst = nvg__bevelJoin(ctx, verts, dst, p0, p1, w, w, u0, u1, aa);
+                }
+            } else {
+                nvg__vsetCore(ctx, verts, dst++, p1.x + (p1.dmx * w), p1.y + (p1.dmy * w), u0, 1);
+                nvg__vsetCore(ctx, verts, dst++, p1.x - (p1.dmx * w), p1.y - (p1.dmy * w), u1, 1);
+            }
+            p0 = p1;
+            p1 = pts[j + 1];
+        }
+
+        if (loop) {
+            let first0 = new NVGvertex(verts, path.strokeOffset);
+            let first1 = new NVGvertex(verts, path.strokeOffset + 1);
+            nvg__vsetCore(ctx, verts, dst++, first0.x, first0.y, u0, 1);
+            nvg__vsetCore(ctx, verts, dst++, first1.x, first1.y, u1, 1);
+        } else {
+            dx = p1.x - p0.x;
+            dy = p1.y - p0.y;
+            ({ x: dx, y: dy } = nvg__normalize_xy(dx, dy));
+            if (lineCap === NVG_BUTT)
+                dst = nvg__buttCapEnd(ctx, verts, dst, p1, dx, dy, w, -aa * 0.5, aa, u0, u1);
+            else if (lineCap === NVG_SQUARE)
+                dst = nvg__buttCapEnd(ctx, verts, dst, p1, dx, dy, w, w - aa, aa, u0, u1);
+            else if (lineCap === NVG_ROUND)
+                dst = nvg__roundCapEnd(ctx, verts, dst, p1, dx, dy, w, ncap, aa, u0, u1);
+        }
+
+        path.nstroke = dst - path.strokeOffset;
+
+        let strokeView = new Float32Array(verts, path.strokeOffset * NVG_VERTEX_SIZEOF, path.nstroke * 4);
+        path.stroke = new Float32Array(path.nstroke * 4);
+        path.stroke.set(strokeView);
+    }
+
+    return 1;
+}
+
+function nvg__curveDivs(r, arc, tol) {
+    let da = Math.acos(r / (r + tol)) * 2.0;
+    return Math.max(2, Math.ceil(arc / da));
+}
+
+function nvg__normalize_xy(x, y) {
+    let d = Math.sqrt(x * x + y * y);
+    if (d > 1e-6) {
+        let id = 1.0 / d;
+        x *= id;
+        y *= id;
+    }
+    return { x, y, d };
+}
+
+function nvg__buttCapStart(ctx, verts, dst, p, dx, dy, w, d, aa, u0, u1) {
+    let px = p.x - dx * d;
+    let py = p.y - dy * d;
+    let dlx = dy;
+    let dly = -dx;
+    nvg__vsetCore(ctx, verts, dst++, px + dlx * w - dx * aa, py + dly * w - dy * aa, u0, 0);
+    nvg__vsetCore(ctx, verts, dst++, px - dlx * w - dx * aa, py - dly * w - dy * aa, u1, 0);
+    nvg__vsetCore(ctx, verts, dst++, px + dlx * w, py + dly * w, u0, 1);
+    nvg__vsetCore(ctx, verts, dst++, px - dlx * w, py - dly * w, u1, 1);
+    return dst;
+}
+
+function nvg__buttCapEnd(ctx, verts, dst, p, dx, dy, w, d, aa, u0, u1) {
+    let px = p.x + dx * d;
+    let py = p.y + dy * d;
+    let dlx = dy;
+    let dly = -dx;
+    nvg__vsetCore(ctx, verts, dst++, px + dlx * w, py + dly * w, u0, 1);
+    nvg__vsetCore(ctx, verts, dst++, px - dlx * w, py - dly * w, u1, 1);
+    nvg__vsetCore(ctx, verts, dst++, px + dlx * w + dx * aa, py + dly * w + dy * aa, u0, 0);
+    nvg__vsetCore(ctx, verts, dst++, px - dlx * w + dx * aa, py - dly * w + dy * aa, u1, 0);
+    return dst;
+}
+
+function nvg__roundCapStart(ctx, verts, dst, p, dx, dy, w, ncap, aa, u0, u1) {
+    let px = p.x;
+    let py = p.y;
+    let dlx = dy;
+    let dly = -dx;
+    for (let i = 0; i < ncap; i++) {
+        let a = i / (ncap - 1) * Math.PI;
+        let ax = Math.cos(a) * w;
+        let ay = Math.sin(a) * w;
+        nvg__vsetCore(ctx, verts, dst++, px - dlx * ax - dx * ay, py - dly * ax - dy * ay, u0, 1);
+        nvg__vsetCore(ctx, verts, dst++, px, py, 0.5, 1);
+    }
+    nvg__vsetCore(ctx, verts, dst++, px + dlx * w, py + dly * w, u0, 1);
+    nvg__vsetCore(ctx, verts, dst++, px - dlx * w, py - dly * w, u1, 1);
+    return dst;
+}
+
+function nvg__roundCapEnd(ctx, verts, dst, p, dx, dy, w, ncap, aa, u0, u1) {
+    let px = p.x;
+    let py = p.y;
+    let dlx = dy;
+    let dly = -dx;
+    nvg__vsetCore(ctx, verts, dst++, px + dlx * w, py + dly * w, u0, 1);
+    nvg__vsetCore(ctx, verts, dst++, px - dlx * w, py - dly * w, u1, 1);
+    for (let i = 0; i < ncap; i++) {
+        let a = i / (ncap - 1) * Math.PI;
+        let ax = Math.cos(a) * w;
+        let ay = Math.sin(a) * w;
+        nvg__vsetCore(ctx, verts, dst++, px, py, 0.5, 1);
+        nvg__vsetCore(ctx, verts, dst++, px - dlx * ax + dx * ay, py - dly * ax + dy * ay, u0, 1);
+    }
+    return dst;
+}
+
+function nvg__roundJoin(ctx, verts, dst, p0, p1, lw, rw, lu, ru, ncap, fringe) {
+    let dlx0 = p0.dy;
+    let dly0 = -p0.dx;
+    let dlx1 = p1.dy;
+    let dly1 = -p1.dx;
+
+    if (p1.flags & NVG_PT_LEFT) {
+        let lx0, ly0, lx1, ly1, a0, a1;
+        let result = nvg__chooseBevel(p1.flags & NVG_PR_INNERBEVEL, p0, p1, lw);
+        lx0 = result.x0; ly0 = result.y0; lx1 = result.x1; ly1 = result.y1;
+        a0 = Math.atan2(-dly0, -dlx0);
+        a1 = Math.atan2(-dly1, -dlx1);
+        if (a1 > a0) a1 -= Math.PI * 2;
+
+        nvg__vsetCore(ctx, verts, dst++, lx0, ly0, lu, 1);
+        nvg__vsetCore(ctx, verts, dst++, p1.x - dlx0 * rw, p1.y - dly0 * rw, ru, 1);
+
+        let n = Math.max(2, Math.min(Math.ceil(((a0 - a1) / Math.PI) * ncap), ncap));
+        for (let i = 0; i < n; i++) {
+            let u = i / (n - 1);
+            let a = a0 + u * (a1 - a0);
+            let rx = p1.x + Math.cos(a) * rw;
+            let ry = p1.y + Math.sin(a) * rw;
+            nvg__vsetCore(ctx, verts, dst++, p1.x, p1.y, 0.5, 1);
+            nvg__vsetCore(ctx, verts, dst++, rx, ry, ru, 1);
+        }
+
+        nvg__vsetCore(ctx, verts, dst++, lx1, ly1, lu, 1);
+        nvg__vsetCore(ctx, verts, dst++, p1.x - dlx1 * rw, p1.y - dly1 * rw, ru, 1);
+    } else {
+        let rx0, ry0, rx1, ry1, a0, a1;
+        let result = nvg__chooseBevel(p1.flags & NVG_PR_INNERBEVEL, p0, p1, -rw);
+        rx0 = result.x0; ry0 = result.y0; rx1 = result.x1; ry1 = result.y1;
+        a0 = Math.atan2(dly0, dlx0);
+        a1 = Math.atan2(dly1, dlx1);
+        if (a1 < a0) a1 += Math.PI * 2;
+
+        nvg__vsetCore(ctx, verts, dst++, p1.x + dlx0 * rw, p1.y + dly0 * rw, lu, 1);
+        nvg__vsetCore(ctx, verts, dst++, rx0, ry0, ru, 1);
+
+        let n = Math.max(2, Math.min(Math.ceil(((a1 - a0) / Math.PI) * ncap), ncap));
+        for (let i = 0; i < n; i++) {
+            let u = i / (n - 1);
+            let a = a0 + u * (a1 - a0);
+            let lx = p1.x + Math.cos(a) * lw;
+            let ly = p1.y + Math.sin(a) * lw;
+            nvg__vsetCore(ctx, verts, dst++, lx, ly, lu, 1);
+            nvg__vsetCore(ctx, verts, dst++, p1.x, p1.y, 0.5, 1);
+        }
+
+        nvg__vsetCore(ctx, verts, dst++, p1.x + dlx1 * rw, p1.y + dly1 * rw, lu, 1);
+        nvg__vsetCore(ctx, verts, dst++, rx1, ry1, ru, 1);
+    }
+    return dst;
+}
+
+function nvg__bevelJoin(ctx, verts, dst, p0, p1, lw, rw, lu, ru, fringe) {
+    let rx0, ry0, rx1, ry1;
+    let lx0, ly0, lx1, ly1;
+    let dlx0 = p0.dy;
+    let dly0 = -p0.dx;
+    let dlx1 = p1.dy;
+    let dly1 = -p1.dx;
+
+    if (p1.flags & NVG_PT_LEFT) {
+        let result = nvg__chooseBevel(p1.flags & NVG_PR_INNERBEVEL, p0, p1, lw);
+        lx0 = result.x0; ly0 = result.y0; lx1 = result.x1; ly1 = result.y1;
+
+        nvg__vsetCore(ctx, verts, dst++, lx0, ly0, lu, 1);
+        nvg__vsetCore(ctx, verts, dst++, p1.x - dlx0 * rw, p1.y - dly0 * rw, ru, 1);
+
+        if (p1.flags & NVG_PT_BEVEL) {
+            nvg__vsetCore(ctx, verts, dst++, lx0, ly0, lu, 1);
+            nvg__vsetCore(ctx, verts, dst++, p1.x - dlx0 * rw, p1.y - dly0 * rw, ru, 1);
+
+            nvg__vsetCore(ctx, verts, dst++, lx1, ly1, lu, 1);
+            nvg__vsetCore(ctx, verts, dst++, p1.x - dlx1 * rw, p1.y - dly1 * rw, ru, 1);
+        } else {
+            rx0 = p1.x - p1.dmx * rw;
+            ry0 = p1.y - p1.dmy * rw;
+
+            nvg__vsetCore(ctx, verts, dst++, p1.x, p1.y, 0.5, 1);
+            nvg__vsetCore(ctx, verts, dst++, p1.x - dlx0 * rw, p1.y - dly0 * rw, ru, 1);
+
+            nvg__vsetCore(ctx, verts, dst++, rx0, ry0, ru, 1);
+            nvg__vsetCore(ctx, verts, dst++, rx0, ry0, ru, 1);
+
+            nvg__vsetCore(ctx, verts, dst++, p1.x, p1.y, 0.5, 1);
+            nvg__vsetCore(ctx, verts, dst++, p1.x - dlx1 * rw, p1.y - dly1 * rw, ru, 1);
+        }
+
+        nvg__vsetCore(ctx, verts, dst++, lx1, ly1, lu, 1);
+        nvg__vsetCore(ctx, verts, dst++, p1.x - dlx1 * rw, p1.y - dly1 * rw, ru, 1);
+    } else {
+        let result = nvg__chooseBevel(p1.flags & NVG_PR_INNERBEVEL, p0, p1, -rw);
+        rx0 = result.x0; ry0 = result.y0; rx1 = result.x1; ry1 = result.y1;
+
+        nvg__vsetCore(ctx, verts, dst++, p1.x + dlx0 * lw, p1.y + dly0 * lw, lu, 1);
+        nvg__vsetCore(ctx, verts, dst++, rx0, ry0, ru, 1);
+
+        if (p1.flags & NVG_PT_BEVEL) {
+            nvg__vsetCore(ctx, verts, dst++, p1.x + dlx0 * lw, p1.y + dly0 * lw, lu, 1);
+            nvg__vsetCore(ctx, verts, dst++, rx0, ry0, ru, 1);
+
+            nvg__vsetCore(ctx, verts, dst++, p1.x + dlx1 * lw, p1.y + dly1 * lw, lu, 1);
+            nvg__vsetCore(ctx, verts, dst++, rx1, ry1, ru, 1);
+        } else {
+            lx0 = p1.x + p1.dmx * lw;
+            ly0 = p1.y + p1.dmy * lw;
+
+            nvg__vsetCore(ctx, verts, dst++, p1.x + dlx0 * lw, p1.y + dly0 * lw, lu, 1);
+            nvg__vsetCore(ctx, verts, dst++, p1.x, p1.y, 0.5, 1);
+
+            nvg__vsetCore(ctx, verts, dst++, lx0, ly0, lu, 1);
+            nvg__vsetCore(ctx, verts, dst++, lx0, ly0, lu, 1);
+
+            nvg__vsetCore(ctx, verts, dst++, p1.x + dlx1 * lw, p1.y + dly1 * lw, lu, 1);
+            nvg__vsetCore(ctx, verts, dst++, p1.x, p1.y, 0.5, 1);
+        }
+
+        nvg__vsetCore(ctx, verts, dst++, p1.x + dlx1 * lw, p1.y + dly1 * lw, lu, 1);
+        nvg__vsetCore(ctx, verts, dst++, rx1, ry1, ru, 1);
+    }
+
+    return dst;
+}
+
+function nvg__chooseBevel(bevel, p0, p1, w) {
+    if (bevel) {
+        return {
+            x0: p1.x + p0.dy * w,
+            y0: p1.y - p0.dx * w,
+            x1: p1.x + p1.dy * w,
+            y1: p1.y - p1.dx * w
+        };
+    } else {
+        return {
+            x0: p1.x + p1.dmx * w,
+            y0: p1.y + p1.dmy * w,
+            x1: p1.x + p1.dmx * w,
+            y1: p1.y + p1.dmy * w
+        };
+    }
+}