bugfixes & stability improvements

README.md

@@ -34,7 +34,8 @@ Shortcut | Action
 `Ctrl + B` | Fold/unfold the sidebar
 `Ctrl + R` | Toggle spellcheck
 `Ctrl + D` | Open preview of the active file
-`Ctrl + T` | Cycle through themes
+`Ctrl + T` | Next theme
+`Ctrl + Shift + T` | Previous theme
 `Ctrl + Plus / Minus` | Change font size
 `Ctrl + Shift + Plus / Minus` | Change sidebar size
 `Ctrl + ] / [` | Change font weight

src-tauri/tauri.conf.json

@@ -8,7 +8,7 @@
   },
   "package": {
     "productName": "leto",
-    "version": "1.4.0"
+    "version": "1.5.0"
   },
   "tauri": {
     "allowlist": {

web/src/canvas.js

@@ -166,7 +166,7 @@ export default class Canvas {
     this.#saveUndoState();
 
     this.#selectedCards.forEach(card => {
-      var index = card.getAttribute('data-index');
+      var index = parseInt(card.getAttribute('data-index'), 10);
       this.#cards.splice(index, 1);
       this.#previews.splice(index, 1);
       card.remove();
@@ -419,7 +419,7 @@ export default class Canvas {
         this.#updateCard(card);
       });
     }
-    
+
     if (this.#draggedItem.classList.contains('card')) this.#updateCard(this.#draggedItem);
     this.#previousCursorPosition = cursorPosition;
 
@@ -680,7 +680,7 @@ export default class Canvas {
   }
 
   #updateCard(card, isNew = false) {
-    var index = card.getAttribute('data-index');
+    var index = parseInt(card.getAttribute('data-index'));
     this.#cards[index].position = this.#getPosition(card);
     this.#cards[index].width = parseInt(card.style.width, 10);
 
@@ -710,16 +710,20 @@ export default class Canvas {
     if (this.#isLoading) return;
     if (this.#isSaving) {
       this.#savePending = true;
+      return;
     }
     this.#isSaving = true;
     const configObject = { cards: this.#cards, arrows: this.#arrows, scale: this.#canvasScale, position: this.#canvasPosition };
-    await writeTextFile(leto.directory.activeFile, JSON.stringify(configObject, null, 2));
+
+    var jsonText = JSON.stringify(configObject, null, 2);
+
+    await writeTextFile(leto.directory.activeFile, jsonText);
 
     var isValidJSON = false;
     while (!isValidJSON) {
       var savedText = await readTextFile(leto.directory.activeFile);
-      isValidJSON = this.#isValidJSON(savedText);
-      if (!isValidJSON) await writeTextFile(leto.directory.activeFile, JSON.stringify(configObject, null, 2));
+      isValidJSON = savedText === jsonText;
+      if (!isValidJSON) await writeTextFile(leto.directory.activeFile, jsonText);
     }
 
     this.#isSaving = false;
@@ -730,11 +734,14 @@ export default class Canvas {
   }
 
   async load(file) {
+    if (this.#isSaving) return;
+
     this.#isSavingUndoState = false;
     this.#isLoading = true;
     this.#cards = [];
     this.#arrows = [];
     this.#previews = [];
+    this.#draggedItem = null;
     canvas.innerHTML = '';
 
     var fileJson = await readTextFile(leto.directory.activeFile);
@@ -848,15 +855,6 @@ export default class Canvas {
   #intersectCards(from, fromSize, to, toSize) {
     return !(to.x > from.x + fromSize.x || to.x + toSize.x < from.x || to.y > from.y + fromSize.y || to.y + toSize.y < from.y);
   }
-
-  #isValidJSON(text) {
-    try {
-      (JSON.parse(text));
-    } catch(e) {
-      return false;
-    }
-    return true;
-  }
 }
 
 class Card {

web/src/directory.js

@@ -35,11 +35,11 @@ export default class Directory {
   setActiveFile(path, save = true) {
     if (this.#isLoading) return;
     this.#isLoading = true;
-    
+
     if (this.activeFile != path)
       this.#previousActiveFile = this.activeFile;
     this.activeFile = path;
-    this.tryOpenActiveFile();
+    this.#tryOpenActiveFile();
     if (save) leto.config.save();
   }
 
@@ -52,7 +52,7 @@ export default class Directory {
     this.#removeActiveFile();
   }
 
-  async tryOpenActiveFile() {
+  async #tryOpenActiveFile() {  
     editor.disabled = true;
     editor.style.display = 'none';
     try {
@@ -88,9 +88,9 @@ export default class Directory {
       imageDisplay.style.display = 'none';
       canvas.style.display = 'block';
       editor.value = '';
-      this.#isLoading = false;
       leto.handleEditorInput();
-      leto.canvas.load(this.activeFile);
+      await leto.canvas.load(this.activeFile);
+      this.#isLoading = false;
     } else {
       imageDisplay.setAttribute('src', '');
       imageDisplay.style.display = 'none';
@@ -142,7 +142,10 @@ export default class Directory {
     }
 
     leto.explorer.showFileTree(directories, this.activeDirectory);
-    if (this.activeFile) leto.explorer.highlightSelectedFile(this.activeFile);
+    if (this.activeFile) {
+      leto.explorer.highlightSelectedFile(this.activeFile);
+      this.setActiveFile(this.activeFile);
+    }
   }
 
   async #getDirectories() {
@@ -232,7 +235,7 @@ export default class Directory {
     this.activeFile = newFile;
     leto.explorer.pendingRename = newFile;
     this.tryDisplayActiveDirectory();
-    this.tryOpenActiveFile();
+    this.#tryOpenActiveFile();
   }
 
   async createImageFromPaste(contents) {
@@ -266,7 +269,7 @@ export default class Directory {
 
     leto.explorer.pendingRename = newFile;
     this.tryDisplayActiveDirectory();
-    this.tryOpenActiveFile();
+    this.#tryOpenActiveFile();
   }
 
   async copyActiveImage() {
@@ -302,7 +305,7 @@ export default class Directory {
     var previousLinkToFile = leto.explorer.getUniqueLink(filePath);
 
     await this.tryDisplayActiveDirectory();
-    await this.tryOpenActiveFile();
+    await this.#tryOpenActiveFile();
 
     leto.edit.renameLinks(previousLinkToFile, newFile);
   }
@@ -324,7 +327,7 @@ export default class Directory {
     leto.explorer.updateFolderPath(oldPath, newPath);
 
     this.tryDisplayActiveDirectory();
-    this.tryOpenActiveFile();
+    this.#tryOpenActiveFile();
   }
 
   async moveTo(oldPath, newPath) {
@@ -351,7 +354,7 @@ export default class Directory {
     if (!isFile) leto.explorer.updateFolderPath(oldPath);
 
     this.tryDisplayActiveDirectory();
-    this.tryOpenActiveFile();
+    this.#tryOpenActiveFile();
   }
 
   moveToTrash(path) {

web/src/leto.js

@@ -16,8 +16,6 @@ import Render from './render.js';
 import Canvas from './canvas.js';
 import QuickOpen from './quickopen.js';
 
-const { appWindow } = window.__TAURI__.window;
-
 const editor = document.getElementById('text-editor');
 
 class Leto {
@@ -55,10 +53,4 @@ class Leto {
 }
 
 globalThis.leto = new Leto();
-leto.config.load();
-
-await appWindow.onFocusChanged(({ payload: hasFocused }) => {
-  leto.contextMenu.hide();
-  leto.focused = hasFocused;
-  if (hasFocused) leto.directory.tryOpenActiveFile();
-});
+leto.config.load();

web/src/quickopen.js

@@ -120,8 +120,8 @@ export default class QuickOpen {
 
   #getFileDisplayName(path) {
     var symbol = "";
-    if (path.endsWith('.png') || path.endsWith('.jpg') || path.endsWith('.gif')) symbol = "● ";
-    if (path.endsWith('.lea')) symbol = "▲ ";
+    if (path.endsWith('.png') || path.endsWith('.jpg') || path.endsWith('.gif')) symbol = "○ ";
+    if (path.endsWith('.lea')) symbol = "△ ";
     path = this.#removeRootPath(path).replace(/\.[^/.]+$/, '');
     var name = symbol + path.replace(/^.*[\\\/]/, '');
     var path = path.substring(0, path.lastIndexOf('\\'))

web/src/renderwindow.js

@@ -26,7 +26,6 @@ const themes = [
   'perlin',
   'dart',
   'glass',
-  'brick',
   'beetle'
 ];
 

web/src/shortcuts.js

@@ -99,6 +99,7 @@ export default class Shortcuts {
       else if (e.ctrlKey && e.shiftKey && e.code === 'KeyF') leto.windowManager.toggleFullscreen();
       else if (e.ctrlKey && !e.shiftKey && e.code === 'KeyB') leto.windowManager.toggleSidebar();
       else if (e.ctrlKey && !e.shiftKey && e.code === 'KeyT') leto.windowManager.setNextTheme();
+      else if (e.ctrlKey && e.shiftKey && e.code === 'KeyT') leto.windowManager.setPreviousTheme();
       else if (e.ctrlKey && !e.shiftKey && e.code === 'KeyQ') leto.windowManager.closeWindow();
       else if (e.ctrlKey && e.shiftKey && e.code === 'KeyQ') leto.windowManager.closeAllWindows();
       else if (e.ctrlKey && !e.shiftKey && e.code === 'KeyM') leto.windowManager.minimizeWindow();

web/src/window.js

@@ -19,7 +19,6 @@ const themes = [
   'perlin',
   'dart',
   'glass',
-  'brick',
   'beetle'
 ];
 
@@ -198,6 +197,7 @@ export default class Window {
   setTheme(theme, save = true) {
     this.currentTheme = theme ?? 0;
     if (theme >= themes.length) this.currentTheme = 0;
+    if (theme < 0) this.currentTheme = themes.length - 1;
     invoke(this.currentTheme == 2 || this.currentTheme == 7 ? 'add_blur' : 'remove_blur', {  label: "main" });
     themeSelector.value = this.currentTheme;
     document.getElementById('theme-link').setAttribute('href', `themes/${themes[this.currentTheme]}.css`);
@@ -207,6 +207,10 @@ export default class Window {
   setNextTheme() {
     this.setTheme(parseInt(this.currentTheme) + 1)
   }
+
+  setPreviousTheme() {
+    this.setTheme(parseInt(this.currentTheme) - 1)
+  }
 
   populateThemes() {
     for (var i = 0; i < themes.length; i++) {

web/styles/main.css

@@ -37,7 +37,6 @@ main {
     overflow: hidden;
     box-shadow: 0 0 calc(var(--shadow) * 20) var(--divider-color);
     background: var(--editor-background-color);
-    border: var(--border) solid var(--divider-color);
     border-left: calc(1px - var(--shadow)) solid var(--divider-color);
 }
 

web/themes/beetle.css

@@ -1,6 +1,6 @@
 :root {
     --editor-background-color: #2e2e2e;
-    --editor-code-background-color: #292929;
+    --editor-code-background-color: #222222;
     --editor-text-color: #cecece;
     --editor-accent-color: #8ec1b3;
     --editor-muted-color: #4e4e4e;
@@ -14,6 +14,6 @@
     --sidebar-file-color: #7a7a7a;
     --sidebar-selection-color: #4b4b4b;
 
+    --divider-color: #373737;
     --shadow: 0px;
-    --border: 3px;
 }