feat: Ported MapView applet (minus labels)

src/js/jagex2/graphics/Draw2D.ts

@@ -176,6 +176,84 @@ export default class Draw2D extends Hashable {
         }
     };
 
+    static fillRectAlpha(x: number, y: number, width: number, height: number, rgb: number, alpha: number): void {
+        if (x < this.left) {
+            width -= this.left - x;
+            x = this.left;
+        }
+
+        if (y < this.top) {
+            height -= this.top - y;
+            y = this.top;
+        }
+
+        if (x + width > this.right) {
+            width = this.right - x;
+        }
+
+        if (y + height > this.bottom) {
+            height = this.bottom - y;
+        }
+
+        const invAlpha: number = 256 - alpha;
+        const r0: number = ((rgb >> 16) & 0xff) * alpha;
+        const g0: number = ((rgb >> 8) & 0xff) * alpha;
+        const b0: number = (rgb & 0xff) * alpha;
+        const step: number = this.width2d - width;
+        let offset: number = x + y * this.width2d;
+        for (let i: number = 0; i < height; i++) {
+            for (let j: number = -width; j < 0; j++) {
+                const r1: number = ((this.pixels[offset] >> 16) & 0xff) * invAlpha;
+                const g1: number = ((this.pixels[offset] >> 8) & 0xff) * invAlpha;
+                const b1: number = (this.pixels[offset] & 0xff) * invAlpha;
+                const color: number = (((r0 + r1) >> 8) << 16) + (((g0 + g1) >> 8) << 8) + ((b0 + b1) >> 8);
+                this.pixels[offset++] = color;
+            }
+            offset += step;
+        }
+    }
+
+    static fillCircle(xCenter: number, yCenter: number, yRadius: number, rgb: number, alpha: number): void {
+        const invAlpha: number = 256 - alpha;
+        const r0: number = ((rgb >> 16) & 0xff) * alpha;
+        const g0: number = ((rgb >> 8) & 0xff) * alpha;
+        const b0: number = (rgb & 0xff) * alpha;
+
+        let yStart: number = yCenter - yRadius;
+        if (yStart < 0) {
+            yStart = 0;
+        }
+
+        let yEnd: number = yCenter + yRadius;
+        if (yEnd >= this.height2d) {
+            yEnd = this.height2d - 1;
+        }
+
+        for (let y: number = yStart; y <= yEnd; y++) {
+            const midpoint: number = y - yCenter;
+            const xRadius: number = Math.sqrt(yRadius * yRadius - midpoint * midpoint) | 0;
+
+            let xStart: number = xCenter - xRadius;
+            if (xStart < 0) {
+                xStart = 0;
+            }
+
+            let xEnd: number = xCenter + xRadius;
+            if (xEnd >= this.width2d) {
+                xEnd = this.width2d - 1;
+            }
+
+            let offset: number = xStart + y * this.width2d;
+            for (let x: number = xStart; x <= xEnd; x++) {
+                const r1: number = ((this.pixels[offset] >> 16) & 0xff) * invAlpha;
+                const g1: number = ((this.pixels[offset] >> 8) & 0xff) * invAlpha;
+                const b1: number = (this.pixels[offset] & 0xff) * invAlpha;
+                const color: number = (((r0 + r1) >> 8) << 16) + (((g0 + g1) >> 8) << 8) + ((b0 + b1) >> 8);
+                this.pixels[offset++] = color;
+            }
+        }
+    }
+
     static setPixel = (x: number, y: number, color: number): void => {
         if (x < this.left || x >= this.right || y < this.top || y >= this.bottom) {
             return;

src/js/jagex2/graphics/Pix8.ts

@@ -291,4 +291,81 @@ export default class Pix8 extends Hashable {
             srcOff += srcStep;
         }
     }
+
+    clip(arg0: number, arg1: number, arg2: number, arg3: number): void {
+        try {
+            const local2: number = this.width;
+            const local5: number = this.height;
+            let local7: number = 0;
+            let local9: number = 0;
+            const local15: number = ((local2 << 16) / arg2) | 0;
+            const local21: number = ((local5 << 16) / arg3) | 0;
+            const local24: number = this.cropW;
+            const local27: number = this.cropH;
+            const local33: number = ((local24 << 16) / arg2) | 0;
+            const local39: number = ((local27 << 16) / arg3) | 0;
+            arg0 = (arg0 + (this.cropX * arg2 + local24 - 1) / local24) | 0;
+            arg1 = (arg1 + (this.cropY * arg3 + local27 - 1) / local27) | 0;
+            if ((this.cropX * arg2) % local24 != 0) {
+                local7 = (((local24 - ((this.cropX * arg2) % local24)) << 16) / arg2) | 0;
+            }
+            if ((this.cropY * arg3) % local27 != 0) {
+                local9 = (((local27 - ((this.cropY * arg3) % local27)) << 16) / arg3) | 0;
+            }
+            arg2 = ((arg2 * (this.width - (local7 >> 16))) / local24) | 0;
+            arg3 = ((arg3 * (this.height - (local9 >> 16))) / local27) | 0;
+            let local133: number = arg0 + arg1 * Draw2D.width2d;
+            let local137: number = Draw2D.width2d - arg2;
+            let local144: number;
+            if (arg1 < Draw2D.top) {
+                local144 = Draw2D.top - arg1;
+                arg3 -= local144;
+                arg1 = 0;
+                local133 += local144 * Draw2D.width2d;
+                local9 += local39 * local144;
+            }
+            if (arg1 + arg3 > Draw2D.bottom) {
+                arg3 -= arg1 + arg3 - Draw2D.bottom;
+            }
+            if (arg0 < Draw2D.left) {
+                local144 = Draw2D.left - arg0;
+                arg2 -= local144;
+                arg0 = 0;
+                local133 += local144;
+                local7 += local33 * local144;
+                local137 += local144;
+            }
+            if (arg0 + arg2 > Draw2D.right) {
+                local144 = arg0 + arg2 - Draw2D.right;
+                arg2 -= local144;
+                local137 += local144;
+            }
+            this.plot_scale(Draw2D.pixels, this.pixels, this.palette, local7, local9, local133, local137, arg2, arg3, local33, local39, local2);
+        } catch (ignore) {
+            console.log('error in sprite clipping routine');
+        }
+    }
+
+    private plot_scale(arg0: Int32Array, arg1: Int8Array, arg2: Int32Array, arg3: number, arg4: number, arg5: number, arg6: number, arg7: number, arg8: number, arg9: number, arg10: number, arg11: number): void {
+        try {
+            const local3: number = arg3;
+            for (let local6: number = -arg8; local6 < 0; local6++) {
+                const local14: number = (arg4 >> 16) * arg11;
+                for (let local17: number = -arg7; local17 < 0; local17++) {
+                    const local27: number = arg1[(arg3 >> 16) + local14];
+                    if (local27 == 0) {
+                        arg5++;
+                    } else {
+                        arg0[arg5++] = arg2[local27 & 0xff];
+                    }
+                    arg3 += arg9;
+                }
+                arg4 += arg10;
+                arg3 = local3;
+                arg5 += arg6;
+            }
+        } catch (ignore) {
+            console.log('error in plot_scale');
+        }
+    }
 }

src/js/jagex2/graphics/PixMap.ts

@@ -28,9 +28,9 @@ export default class PixMap {
         Draw2D.bind(this.pixels, this.width, this.height);
     }
 
-    draw(width: number, height: number): void {
+    draw(x: number, y: number): void {
         this.#setPixels();
-        this.ctx.putImageData(this.image, width, height);
+        this.ctx.putImageData(this.image, x, y);
     }
 
     #setPixels(): void {