brushed up

.gitignore

@@ -5,3 +5,4 @@ node_modules
 dist
 .cache
 .idea/
+.DS_Store

Dockerfile

@@ -0,0 +1,17 @@
+FROM node:22-alpine AS build
+
+WORKDIR /app
+
+COPY package*.json ./
+RUN npm ci
+
+COPY . .
+RUN npm run build
+
+FROM nginx:alpine
+
+COPY --from=build /app/dist /usr/share/nginx/html
+
+EXPOSE 80
+
+CMD ["nginx", "-g", "daemon off;"]

css/style.css

@@ -1,14 +1,27 @@
 html {
+  color: #222;
   background: rgb(249,235,213);
   font-size: 1em;
   line-height: 1.4;
   overflow: hidden;
 }
 
+canvas {
+  color: black;
+}
+
+a {
+  font: 13px monospace, sans-serif;
+  color: black;
+  position: fixed;
+  left: 10px;
+  bottom: 10px;
+}
+
 #console {
   font: 13px monospace, sans-serif;
   padding: 5px;
-  color: black;
+  color: #222;
   background:  rgb(255,241,219);
   position: fixed;
   right: 1px;
@@ -18,6 +31,7 @@ html {
   border: 2px solid darkgray;
   border-radius: 10px;
   z-index: 0;
+  overflow: auto;
 }
 
 #help{
@@ -45,7 +59,7 @@ html {
 #log{
     font: 13px monospace, sans-serif;
     padding: 5px;
-    color: black;
+    color: #222;
     background:  rgb(255,241,219);
     position: fixed;
     right: 1px;

index.html

@@ -28,6 +28,7 @@ moving_pillars(5, 10,1, false);
       </textarea>
   </label>
 </div>
+<a href="https://git.sanderhautvast.nl/sander/szpakowski-lang">https://git.sanderhautvast.nl/sander/szpakowski-lang</a>
 
 <span id="help" style="visibility: hidden"></span>
 

js/app.js

@@ -10,8 +10,7 @@ import {interpret} from "./interpreter.js";
   canvas.clearRect(0, 0, width, height);
   canvas.lineWidth = 2;
   canvas.globalAlpha = 1;
-    canvas.strokeStyle = 'black';
+  canvas.strokeStyle = '#000';
-    canvas.fillStyle = 'black';
   canvas_element.width = width;
   canvas_element.height = height;
 
@@ -71,10 +70,14 @@ import {interpret} from "./interpreter.js";
   }
 
   function refresh() {
+    canvas.beginPath();
+    canvas.lineWidth = 1.8;
+    canvas.moveTo(0, 0);
     script = command_input_element.value;
     try {
       canvas.clearRect(0, 0, width, height);
       interpret({canvas: canvas, x: tx, y: ty, angle: tangle, unit: 10, width: width, height: height}, script);
+      canvas.stroke();
     } catch (e) {
       document.getElementById('log').innerHTML = e;
     }
@@ -142,6 +145,6 @@ import {interpret} from "./interpreter.js";
   }
   //main
   refresh();
-  })
+})
 ();
 

js/interpreter.js

@@ -133,7 +133,6 @@ export function interpret(init_env, code) {
       tx = x * unit;
       ty = y * unit;
       tangle = 0;
-      canvas.beginPath();
       canvas.moveTo(x0 + tx, y0 + ty);
     },
 
@@ -141,7 +140,6 @@ export function interpret(init_env, code) {
       tx += distance * unit * Math.cos(tangle);
       ty += distance * unit * Math.sin(tangle);
       canvas.lineTo(x0 + tx, y0 + ty);
-      canvas.stroke();
     },
 
     turn: (degrees) => {