3 files changed, 36 insertions, 16 deletions

diff --git a/_wui/awwan.ts b/_wui/awwan.ts
index 21ec343..af79369 100644
--- a/_wui/awwan.ts
+++ b/_wui/awwan.ts
@@ -36,6 +36,8 @@ const ID_OUTPUT = "output";
 
 const MAX_FILE_SIZE = 1000000; // 1MiB
 
+const STORAGE_KEY_VFS_WIDTH = "vfs_width";
+
 interface ExecRequestInterface {
   mode: string;
   script: string;
@@ -154,6 +156,8 @@ export class Awwan {
   private _posy: number = 0;
 
   constructor() {
+    renderHtml();
+
     let el: HTMLElement | null;
 
     el = document.getElementById(ID_AWWAN_NAV_LEFT);
@@ -325,6 +329,12 @@ export class Awwan {
         this._posy = 0;
       });
     }
+
+    // Restore state from local storage.
+    const vfsWidth = localStorage.getItem(STORAGE_KEY_VFS_WIDTH);
+    if (vfsWidth) {
+      this.setVfsWidth(parseInt(vfsWidth, 10));
+    }
   }
 
   onHashChange(hash: string) {
@@ -781,21 +791,25 @@ export class Awwan {
     if (this.comNavLeft.clientWidth <= 300) {
       return false;
     }
-    let width = this.comNavLeft.clientWidth - diff;
+    const width = this.comNavLeft.clientWidth - diff;
+    this.setVfsWidth(width);
+    localStorage.setItem(STORAGE_KEY_VFS_WIDTH, `${width}`);
+    return true;
+  }
+
+  private setVfsWidth(width: number) {
     this.comNavLeft.style.width = `${width}px`;
     width += 30;
     this.comNavRight.style.width = `calc(100% - ${width}px)`;
-    return true;
   }
 
   private resizeVfsRight(diff: number) {
     if (this.comNavRight.clientWidth <= 500) {
       return false;
     }
-    let width = this.comNavLeft.clientWidth + diff;
-    this.comNavLeft.style.width = `${width}px`;
-    width += 30;
-    this.comNavRight.style.width = `calc(100% - ${width}px)`;
+    const width = this.comNavLeft.clientWidth + diff;
+    this.setVfsWidth(width);
+    localStorage.setItem(STORAGE_KEY_VFS_WIDTH, `${width}`);
     return true;
   }
 
diff --git a/_wui/main.js b/_wui/main.js
index c5c217c..0aa5543 100644
--- a/_wui/main.js
+++ b/_wui/main.js
@@ -479,6 +479,7 @@ var awwan = (() => {
   var ID_OUTPUT_WRAPPER = "output_wrapper";
   var ID_OUTPUT = "output";
   var MAX_FILE_SIZE = 1e6;
+  var STORAGE_KEY_VFS_WIDTH = "vfs_width";
   function renderHtml() {
     const el = document.createElement("div");
     el.classList.add("awwan");
@@ -541,6 +542,7 @@ var awwan = (() => {
       this.orgContent = "";
       this._posx = 0;
       this._posy = 0;
+      renderHtml();
       let el;
       el = document.getElementById(ID_AWWAN_NAV_LEFT);
       if (el) {
@@ -688,6 +690,10 @@ var awwan = (() => {
           this._posy = 0;
         });
       }
+      const vfsWidth = localStorage.getItem(STORAGE_KEY_VFS_WIDTH);
+      if (vfsWidth) {
+        this.setVfsWidth(parseInt(vfsWidth, 10));
+      }
     }
     onHashChange(hash) {
       if (hash === "") {
@@ -1074,20 +1080,23 @@ var awwan = (() => {
       if (this.comNavLeft.clientWidth <= 300) {
         return false;
       }
-      let width = this.comNavLeft.clientWidth - diff;
+      const width = this.comNavLeft.clientWidth - diff;
+      this.setVfsWidth(width);
+      localStorage.setItem(STORAGE_KEY_VFS_WIDTH, `${width}`);
+      return true;
+    }
+    setVfsWidth(width) {
       this.comNavLeft.style.width = `${width}px`;
       width += 30;
       this.comNavRight.style.width = `calc(100% - ${width}px)`;
-      return true;
     }
     resizeVfsRight(diff) {
       if (this.comNavRight.clientWidth <= 500) {
         return false;
       }
-      let width = this.comNavLeft.clientWidth + diff;
-      this.comNavLeft.style.width = `${width}px`;
-      width += 30;
-      this.comNavRight.style.width = `calc(100% - ${width}px)`;
+      const width = this.comNavLeft.clientWidth + diff;
+      this.setVfsWidth(width);
+      localStorage.setItem(STORAGE_KEY_VFS_WIDTH, `${width}`);
       return true;
     }
     doResizeEditor(ev) {
@@ -1127,7 +1136,6 @@ var awwan = (() => {
   };
 
   // _wui/main.ts
-  renderHtml();
   var awwan = new Awwan();
   awwan.onHashChange(window.location.hash);
 })();
diff --git a/_wui/main.ts b/_wui/main.ts
index 85e64a5..b6f27ab 100644
--- a/_wui/main.ts
+++ b/_wui/main.ts
@@ -1,9 +1,7 @@
 // SPDX-FileCopyrightText: 2021 M. Shulhan <ms@kilabit.info>
 // SPDX-License-Identifier: GPL-3.0-or-later
 
-import { renderHtml, Awwan } from "./awwan";
-
-renderHtml();
+import { Awwan } from "./awwan";
 
 const awwan = new Awwan();