Release 0.7.13-alpha

Changelog.md

@@ -1,7 +1,17 @@
+# 0.7.13-alpha:
+Changes:
+- changed file MIME type from text/plain to application/lightningbeam to prevent editor woes on Linux
+
+Bugfixes:
+- Port several live fixes to version control
+- Fix opening files on macOS
+- Improve rendering speed by 10x or more when multiple layers are present
+
 # 0.7.12-alpha:
 New features:
 - Add "New Window" command
 - Enable files to be opened with Lightningbeam
+
 Bugfixes:
 - Fix error when an object is deleted from a frame
 - Fix parent references being lost

src-tauri/src/lib.rs

@@ -126,17 +126,15 @@ fn handle_file_associations(app: AppHandle, files: Vec<PathBuf>) {
 pub fn run() {
     let pkg_name = env!("CARGO_PKG_NAME").to_string();
     tauri::Builder::default()
+      .manage(Mutex::new(AppState::default()))
       .setup(|app| {
-          {
-            app.manage(Mutex::new(AppState::default()));
-          }
         #[cfg(any(windows, target_os = "linux"))] // Windows/Linux needs different handling from macOS
         {
           let mut files = Vec::new();
 
           // NOTICE: `args` may include URL protocol (`your-app-protocol://`)
           // or arguments (`--`) if your app supports them.
-            // files may aslo be passed as `file://path/to/file`
+          // files may also be passed as `file://path/to/file`
           for maybe_file in std::env::args().skip(1) {
             // skip flags like -f or --flag
             if maybe_file.starts_with('-') {
@@ -199,12 +197,21 @@ pub fn run() {
         |app, event| {
           #[cfg(any(target_os = "macos", target_os = "ios"))]
           if let tauri::RunEvent::Opened { urls } = event {
+            let app = app.clone();
             let files = urls
               .into_iter()
               .filter_map(|url| url.to_file_path().ok())
+              .map(|f| {
+                let file = f.to_string_lossy().replace('\\', "\\\\"); // escape backslash
+                format!("\"{file}\"",) // wrap in quotes for JS array
+              })
               .collect::<Vec<_>>();
   
-              handle_file_associations(app.clone(), files);
+            tauri::async_runtime::spawn(async move {
+              for path in files {
+                create_window(app.clone(), Some(path)).await;
+              }
+            });
           }
         },
       );

src-tauri/tauri.conf.json

@@ -1,7 +1,7 @@
 {
   "$schema": "https://schema.tauri.app/config/2",
   "productName": "Lightningbeam",
-  "version": "0.7.12-alpha",
+  "version": "0.7.13-alpha",
   "identifier": "org.lightningbeam.core",
   "build": {
     "frontendDist": "../src"
@@ -52,7 +52,7 @@
         "ext": [
           "beam"
         ],
-        "mimeType": "text/plain"
+        "mimeType": "application/lightningbeam"
       }
     ]
   }

src/icon.js

@@ -3,27 +3,42 @@ class Icon {
         this.url = url;
         this.svgContent = '';
         this.svgLoaded = false;
-        this.load()
+        this.cacheCanvas = null; // Offscreen canvas for caching
+        this.cacheContext = null;
+        this.cacheColor = null;
+        this.load();
     }
 
     async load() {
-        return fetch(this.url)
+        try {
-            .then(response => response.text())
+            const response = await fetch(this.url);
-            .then(svgContent => {
+            this.svgContent = await response.text();
-                this.svgContent = svgContent;
             this.svgLoaded = true;
-            })
+        } catch (error) {
-            .catch(error => {
             console.error('Error loading SVG:', error);
             this.svgLoaded = false;
-            });
+        }
     }
 
     render(ctx, x, y, w, h, color) {
-        if (this.svgLoaded) {
+        if (!this.svgLoaded) return; // Do nothing if SVG is not loaded
-            ctx.fillStyle = color
+
-            ctx.drawSvg(this.svgContent, x, y, w, h)
+        if (!this.cacheCanvas || this.cacheCanvas.width !== w || this.cacheCanvas.height !== h || this.cacheColor !== color) {
+            // Create or update the offscreen canvas for caching
+            this.cacheCanvas = document.createElement('canvas');
+            this.cacheCanvas.width = w;
+            this.cacheCanvas.height = h;
+            this.cacheContext = this.cacheCanvas.getContext('2d');
+
+            // Draw the SVG onto the offscreen canvas
+            this.cacheContext.clearRect(0, 0, w, h); // Clear previous contents
+            this.cacheContext.fillStyle = color;
+            this.cacheColor = color
+            this.cacheContext.drawSvg(this.svgContent, 0, 0, w, h);
         }
+
+        // Draw the cached result onto the main canvas
+        ctx.drawImage(this.cacheCanvas, x, y);
     }
 }
 

src/main.js

@@ -93,7 +93,7 @@ function forwardConsole(fnName, dest) {
     const stackLines = error.stack.split("\n");
 
     let message = args.join(" ");  // Join all arguments into a single string
-    const location = stackLines[1].match(/([a-zA-Z0-9_-]+\.js:\d+)/);
+    const location = stackLines.length>1 ? stackLines[1].match(/([a-zA-Z0-9_-]+\.js:\d+)/) : stackLines.toString();
 
     if (fnName === "error") {
       // Send the full stack trace for errors
@@ -350,7 +350,6 @@ let context = {
 let config = {
   shortcuts: {
     playAnimation: " ",
-    // undo: "<ctrl>+z"
     undo: "<mod>z",
     redo: "<mod>Z",
     new: "<mod>n",
@@ -379,6 +378,7 @@ let config = {
   recentFiles: [],
   scrollSpeed: 1,
   debug: false,
+  reopenLastSession: false
 };
 
 function getShortcut(shortcut) {
@@ -421,14 +421,9 @@ async function saveConfig() {
 }
 
 async function addRecentFile(filePath) {
-  if (!config.recentFiles.includes(filePath)) {
+  config.recentFiles = [filePath, ...config.recentFiles.filter(file => file !== filePath)].slice(0, 10);
-    config.recentFiles.unshift(filePath);
-    if (config.recentFiles.length > 10) {
-      config.recentFiles = config.recentFiles.slice(0, 10);
-    }
   await saveConfig(config);
 }
-}
 
 // Pointers to all objects
 let pointerList = {};
@@ -1327,6 +1322,7 @@ let actions = {
       for (let frameObj of action.selectedFrames) {
         let layer = object.layers[frameObj.layer];
         let frame = layer.frames[frameObj.frameNum];
+        if (frameObj) {
           frameBuffer.push({
             frame: frame,
             frameNum: frameObj.frameNum,
@@ -1334,6 +1330,7 @@ let actions = {
           });
           layer.deleteFrame(frame.idx, undefined, frameObj.replacementUuid);
         }
+      }
       for (let frameObj of frameBuffer) {
         const layer_idx = frameObj.layer + action.offset.layers;
         let layer = object.layers[layer_idx];
@@ -1448,6 +1445,7 @@ let actions = {
       let serializableShapes = [];
       let serializableObjects = [];
       let bbox;
+      const frame = context.activeObject.currentFrame
       for (let shape of context.shapeselection) {
         serializableShapes.push(shape.idx);
         if (bbox == undefined) {
@@ -1457,6 +1455,7 @@ let actions = {
         }
       }
       for (let object of context.selection) {
+        if (object.idx in frame.keys) {
           serializableObjects.push(object.idx);
           // TODO: rotated bbox
           if (bbox == undefined) {
@@ -1465,6 +1464,7 @@ let actions = {
             growBoundingBox(bbox, object.bbox());
           }
         }
+      }
       context.shapeselection = [];
       context.selection = [];
       let action = {
@@ -1472,7 +1472,7 @@ let actions = {
         objects: serializableObjects,
         groupUuid: uuidv4(),
         parent: context.activeObject.idx,
-        frame: context.activeObject.currentFrame.idx,
+        frame: frame.idx,
         layer: context.activeObject.activeLayer.idx,
         position: {
           x: (bbox.x.min + bbox.x.max) / 2,
@@ -2637,7 +2637,6 @@ class Layer extends Widget {
           ctx.setTransform(transform)
         }
       }
-    }
       if (this.activeShape) {
         this.activeShape.draw(cxt)
       }
@@ -2648,6 +2647,7 @@ class Layer extends Widget {
         }
       }
     }
+  }
   bbox() {
     let bbox = super.bbox()
     const frameInfo = this.getFrameValue(this.frameNum);
@@ -2965,10 +2965,11 @@ class BaseShape {
     ctx.lineCap = "round";
 
     // Create a repeating pattern for indicating selected shapes
-    let patternCanvas = document.createElement('canvas');
+    if (!this.patternCanvas) {
-    patternCanvas.width = 2;
+      this.patternCanvas = document.createElement('canvas');
-    patternCanvas.height = 2;
+      this.patternCanvas.width = 2;
-    let patternCtx = patternCanvas.getContext('2d');
+      this.patternCanvas.height = 2;
+      let patternCtx = this.patternCanvas.getContext('2d');
       // Draw the pattern:
       // black,       transparent,
       // transparent, white
@@ -2978,7 +2979,8 @@ class BaseShape {
       patternCtx.clearRect(0, 1, 1, 1);
       patternCtx.fillStyle = 'white';
       patternCtx.fillRect(1, 1, 1, 1);
-    let pattern = ctx.createPattern(patternCanvas, 'repeat'); // repeat the pattern across the canvas
+    }
+    let pattern = ctx.createPattern(this.patternCanvas, 'repeat'); // repeat the pattern across the canvas
 
     // for (let region of this.regions) {
     //   // if (region.filled) continue;
@@ -4114,9 +4116,11 @@ class GraphicsObject extends Widget {
     for (let layer of this.layers) {
       layer.children = layer.children.filter(child => child.idx !== idx);
       for (let frame of layer.frames) {
+        if (frame) {
           delete frame[idx];
         }
       }
+    }
     // this.children.splice(this.children.indexOf(childObject), 1);
   }
   addLayer(layer) {
@@ -5069,6 +5073,19 @@ async function setupVideoExport(ext, path, canvas, exportContext) {
 
   // audioEncoder.configure(audioConfig)
 
+  async function finishEncoding() {
+    const progressText = document.getElementById('progressText');
+    progressText.innerText = 'Finalizing...';
+    const progressBar = document.getElementById('progressBar');
+    progressBar.value = 100;
+    await videoEncoder.flush();
+    muxer.finalize();
+    await writeFile(path, new Uint8Array(target.buffer));
+    const modal = document.getElementById('progressModal');
+    modal.style.display = 'none';
+    document.querySelector("body").style.cursor = "default";
+  }
+
   const processFrame = async (currentFrame) => {
     if (currentFrame < root.maxFrame) {
       // Update progress bar
@@ -5971,7 +5988,7 @@ function stage() {
             for (let child of context.selection) {
               if (!context.activeObject.currentFrame) continue;
               if (!context.activeObject.currentFrame.keys) continue;
-              if (!child.idx in context.activeObject.currentFrame.keys) continue;
+              if (!(child.idx in context.activeObject.currentFrame.keys)) continue;
               context.activeObject.currentFrame.keys[child.idx].x +=
                 mouse.x - context.lastMouse.x;
               context.activeObject.currentFrame.keys[child.idx].y +=
@@ -6729,10 +6746,14 @@ function outliner(object = undefined) {
 async function startup() {
   await loadConfig();
   createNewFileDialog(_newFile, _open, config);
-  if (!window.openedFiles) {
+  if (!window.openedFiles?.length) {
+    if (config.reopenLastSession && config.recentFiles?.length) {
+      _open(config.recentFiles[0])
+    } else {
       showNewFileDialog(config);
     }
   }
+}
 
 startup();
 
@@ -7896,6 +7917,11 @@ async function renderMenu() {
         enabled: false,
         action: () => {},
       },
+      {
+        text: "Close Window",
+        enabled: true,
+        action: quit,
+      },
       {
         text: "Quit Lightningbeam",
         enabled: true,