feat: add biome, fix format and lint (#19)

Author: hauserkristof

.vscode/settings.json

@@ -0,0 +1,13 @@
+{
+  "editor.defaultFormatter": "biomejs.biome",
+  "editor.formatOnSave": true,
+  "[javascript]": {
+    "editor.defaultFormatter": "biomejs.biome"
+  },
+  "[typescript]": {
+    "editor.defaultFormatter": "biomejs.biome"
+  },
+  "[react]": {
+    "editor.defaultFormatter": "biomejs.biome"
+  }
+}

biome.json

@@ -0,0 +1,34 @@
+{
+  "$schema": "https://biomejs.dev/schemas/1.9.4/schema.json",
+  "vcs": {
+    "enabled": false,
+    "clientKind": "git",
+    "useIgnoreFile": false
+  },
+  "files": {
+    "ignoreUnknown": false,
+    "ignore": [
+      "web/scripts/alpine-3.10.4.js"
+    ]
+  },
+  "formatter": {
+    "enabled": true,
+    "indentStyle": "space",
+    "lineWidth": 120,
+    "indentWidth": 4
+  },
+  "linter": {
+    "enabled": true,
+    "rules": {
+      "recommended": true,
+      "complexity": {
+        "useLiteralKeys": "info"
+      }
+    }
+  },
+  "javascript": {
+    "formatter": {
+      "quoteStyle": "double"
+    }
+  }
+}

web/scripts/dragdrop.js

@@ -1,6 +1,5 @@
-
 export class DropTarget {
-    constructor (elm, callback) {
+    constructor(elm, callback) {
         this.elm = elm;
         this.callback = callback;
 
@@ -9,7 +8,7 @@ export class DropTarget {
             (e) => {
                 e.preventDefault();
             },
-            false
+            false,
         );
 
         elm.addEventListener(
@@ -18,7 +17,7 @@ export class DropTarget {
                 e.preventDefault();
                 e.dataTransfer.dropEffect = "move";
             },
-            false
+            false,
         );
 
         elm.addEventListener(
@@ -32,7 +31,7 @@ export class DropTarget {
                     callback(files);
                 }
             },
-            false
+            false,
         );
     }
 }

web/scripts/libgingerbread.js

@@ -9,11 +9,11 @@ export class LibGingerbread {
     }
 
     static async new() {
-        if (this.wasm_module == null) {
-            this.wasm_module = await ZigWASM.compile(this.wasm_src);
+        if (LibGingerbread.wasm_module == null) {
+            LibGingerbread.wasm_module = await ZigWASM.compile(LibGingerbread.wasm_src);
         }
 
-        return new this(await ZigWASM.new(this.wasm_module));
+        return new LibGingerbread(await ZigWASM.new(LibGingerbread.wasm_module));
     }
 
     conversion_start() {
@@ -50,5 +50,4 @@ export class LibGingerbread {
     conversion_add_drill(x, y, d, scale_factor) {
         this.zig.exports.conversion_add_drill(x, y, d, scale_factor);
     }
-
 }

web/scripts/main.js

@@ -212,11 +212,7 @@ class Design {
             if (this.preview_layout === "both") {
                 cvs.draw_image_two_up(await layer.get_preview_bitmap(), side);
             } else if (this.preview_layout.endsWith("-spread")) {
-                cvs.draw_image_n_up(
-                    await layer.get_preview_bitmap(),
-                    i,
-                    layers.length
-                );
+                cvs.draw_image_n_up(await layer.get_preview_bitmap(), i, layers.length);
             } else {
                 cvs.draw_image(await layer.get_preview_bitmap());
             }
@@ -231,26 +227,12 @@ class Design {
 
         cvs.clear();
 
-        if (
-            this.preview_layout === "front" ||
-            this.preview_layout === "front-spread" ||
-            this.preview_layout === "both"
-        ) {
-            await this.draw_layers(
-                ["EdgeCuts", "FCu", "FMask", "FSilkS", "Drill"],
-                "left"
-            );
+        if (this.preview_layout === "front" || this.preview_layout === "front-spread" || this.preview_layout === "both") {
+            await this.draw_layers(["EdgeCuts", "FCu", "FMask", "FSilkS", "Drill"], "left");
         }
 
-        if (
-            this.preview_layout === "back" ||
-            this.preview_layout === "back-spread" ||
-            this.preview_layout === "both"
-        ) {
-            await this.draw_layers(
-                ["EdgeCuts", "BCu", "BMask", "BSilkS", "Drill"],
-                "right"
-            );
+        if (this.preview_layout === "back" || this.preview_layout === "back-spread" || this.preview_layout === "both") {
+            await this.draw_layers(["EdgeCuts", "BCu", "BMask", "BSilkS", "Drill"], "right");
         }
     }
 
@@ -268,36 +250,24 @@ class Design {
 
         for (const layer of this.layers) {
             switch (layer.type) {
-                case "raster":
+                case "raster": {
                     const bm = await layer.get_raster_bitmap();
                     const imgdata = await yak.ImageData_from_ImageBitmap(bm);
-                    gingerbread.conversion_add_raster_layer(
-                        layer.number,
-                        this.trace_scale_factor,
-                        imgdata
-                    );
+                    gingerbread.conversion_add_raster_layer(layer.number, this.trace_scale_factor, imgdata);
                     break;
+                }
                 case "vector":
                     for (const path of layer.get_paths()) {
                         gingerbread.conversion_start_poly();
                         for (const pt of path) {
-                            gingerbread.conversion_add_poly_point(
-                                pt[0],
-                                pt[1],
-                                this.dpmm
-                            );
+                            gingerbread.conversion_add_poly_point(pt[0], pt[1], this.dpmm);
                         }
                         gingerbread.conversion_end_poly(layer.number, 1, false);
                     }
                     break;
                 case "drill":
                     for (const circle of layer.get_circles()) {
-                        gingerbread.conversion_add_drill(
-                            circle.cx.baseVal.value,
-                            circle.cy.baseVal.value,
-                            circle.r.baseVal.value * 2,
-                            this.dpmm
-                        );
+                        gingerbread.conversion_add_drill(circle.cx.baseVal.value, circle.cy.baseVal.value, circle.r.baseVal.value * 2, this.dpmm);
                     }
                     break;
                 default:
@@ -307,10 +277,10 @@ class Design {
 
         const footprint = gingerbread.conversion_finish();
 
-        if (method == "clipboard") {
+        if (method === "clipboard") {
             navigator.clipboard.writeText(footprint);
         } else {
-            let file = new File([footprint], "design.kicad_pcb");
+            const file = new File([footprint], "design.kicad_pcb");
             yak.initiateDownload(file);
         }
     }
@@ -352,26 +322,16 @@ class Layer {
 
     async get_preview_bitmap() {
         if (!this.bitmap) {
-            this.bitmap = await yak.createImageBitmap(
-                this.svg,
-                this.design.constructor.preview_width
-            );
+            this.bitmap = await yak.createImageBitmap(this.svg, this.design.constructor.preview_width);
             if (this.is_mask) {
-                this.bitmap = await yak.ImageBitmap_inverse_mask(
-                    this.bitmap,
-                    await this.design.edge_cuts.get_preview_bitmap(),
-                    this.color
-                );
+                this.bitmap = await yak.ImageBitmap_inverse_mask(this.bitmap, await this.design.edge_cuts.get_preview_bitmap(), this.color);
             }
         }
         return this.bitmap;
     }
 
     async get_raster_bitmap() {
-        return await yak.createImageBitmap(
-            this.svg,
-            this.design.raster_width
-        );
+        return await yak.createImageBitmap(this.svg, this.design.raster_width);
     }
 
     *get_paths() {
@@ -391,10 +351,7 @@ async function load_design_file(file) {
         cvs = new PreviewCanvas(document.getElementById("preview-canvas"));
     }
 
-    const svg_doc = new DOMParser().parseFromString(
-        await file.text(),
-        "image/svg+xml"
-    );
+    const svg_doc = new DOMParser().parseFromString(await file.text(), "image/svg+xml");
 
     design = new Design(cvs, svg_doc);
 
@@ -433,7 +390,7 @@ document.addEventListener("alpine:init", () => {
         async export_design(method) {
             this.exporting = true;
             await this.design.export(method);
-            this.exporting = 'done';
+            this.exporting = "done";
             window.setTimeout(() => {
                 this.exporting = false;
             }, 3000);