get correct pixels

mayakarabula · May 2, 2023 · 693d66d · 693d66d
1 parent 5b886da
commit 693d66d
Show file tree

Hide file tree

Showing 2 changed files with 38 additions and 22 deletions.
diff --git a/src/devices/screen.ts b/src/devices/screen.ts
@@ -1,4 +1,5 @@
 import { PEEK2, POKE2, Uxn } from '../uxn';
+import { draw, set_zoom } from '../uxnemu';
 
 export const WIDTH = 64 * 8;
 export const HEIGHT = 40 * 8;
@@ -141,7 +142,7 @@ function screen_resize(p: UxnScreen, width: number, height: number) {
   console.log('resize', p);
 }
 
-function screen_redraw(p: UxnScreen) {
+export function screen_redraw(p: UxnScreen) {
   let i,
     size = p.width * p.height,
     palette = new Array(4).fill(0);
@@ -160,7 +161,7 @@ function screen_redraw(p: UxnScreen) {
   p.fg.changed = p.bg.changed = 0;
 }
 
-function clamp(val: number, min: number, max: number) {
+export function clamp(val: number, min: number, max: number) {
   return val >= min ? (val <= max ? val : max) : min;
 }
 
@@ -265,4 +266,6 @@ export function screen_deo(ram: number[], d: number[], port: number) {
       break;
     }
   }
+
+  draw()
 }
diff --git a/src/uxnemu.ts b/src/uxnemu.ts
@@ -1,8 +1,10 @@
 import {
+  clamp,
   HEIGHT,
   screen_dei,
   screen_deo,
   screen_palette,
+  screen_redraw,
   uxn_screen,
   WIDTH
 } from './devices/screen';
@@ -91,31 +93,40 @@ export function uxn_deo(u: Uxn, addr: number): void {
   }
 }
 
-function draw() {
-  const canvas = document.getElementById('canvas') as HTMLCanvasElement;
+let canvas: HTMLCanvasElement;
+let ctx: CanvasRenderingContext2D | null;
 
-  canvas.width = uxn_screen.width;
-  canvas.height = uxn_screen.height;
+export function set_zoom (scale: number) {
+  zoom = clamp(scale, 1, 3);
+  console.log({ scale, zoom })
+}
+
+export function draw() {
+  if (uxn_screen.bg.changed || uxn_screen.fg.changed) {
+    screen_redraw(uxn_screen)
+  }
+
+  if (!canvas) {
+    canvas = document.getElementById('canvas') as HTMLCanvasElement;
+  }
+
+  canvas.width = (uxn_screen.width) * zoom;
+  canvas.height = (uxn_screen.height) * zoom;
 
   if (canvas) {
-    const ctx = canvas.getContext('2d');
+    if (!ctx) {
+      ctx = canvas.getContext('2d');
+    }
+
+    console.log(uxn_screen)
 
     if (ctx) {
-      for (let x = 0; x < WIDTH; x++) {
-        for (let y = 0; y < HEIGHT; y++) {
-          if (uxn_screen.bg.pixels[x + y * WIDTH]) {
-            ctx.fillStyle = `#${uxn_screen.palette[
-              uxn_screen.bg.pixels[x + y * WIDTH]
-            ].toString(16)}`;
-            ctx.fillRect(x, y, 1, 1);
-          }
-
-          if (uxn_screen.fg.pixels[x + y * WIDTH]) {
-            ctx.fillStyle = `#${uxn_screen.palette[
-              uxn_screen.fg.pixels[x + y * WIDTH]
-            ].toString(16)}`;
-            ctx.fillRect(x, y, 1, 1);
-          }
+      ctx.scale(zoom, zoom)
+
+      for (let x = 0; x < uxn_screen.width; x++) {
+        for (let y = 0; y < uxn_screen.height; y++) {
+          ctx.fillStyle = `#${uxn_screen.pixels[x + y * uxn_screen.width].toString(16)}`;
+          ctx.fillRect(x, y, 1, 1);
         }
       }
     }
@@ -129,6 +140,8 @@ function main(): number {
     return emu_error('Boot', 'Failed');
   }
 
+  set_zoom((window.innerWidth / 1280));
+
   if (!system_load(u)) {
     return emu_error('Load', 'Failed');
   }