Implement persistence

Author: octref

jsconfig.json

@@ -1,6 +1,7 @@
 {
   "compilerOptions": {
     "target": "es2015",
-    "module": "commonjs"
+    "module": "commonjs",
+    "moduleResolution": "node"
   }
 }

package.json

@@ -27,7 +27,8 @@
     "vscode": "^1.32.0"
   },
   "activationEvents": [
-    "onCommand:polacode.activate"
+    "onCommand:polacode.activate",
+    "onWebviewPanel:polacode"
   ],
   "main": "./src/extension",
   "contributes": {

src/extension.js

@@ -16,15 +16,26 @@ const P_TITLE = 'Polacode 📸'
  */
 function activate(context) {
   const htmlPath = path.resolve(context.extensionPath, 'webview/index.html')
-  const indexUri = vscode.Uri.file(htmlPath)
 
   let lastUsedImageUri = vscode.Uri.file(path.resolve(homedir(), 'Desktop/code.png'))
   let panel
 
+  vscode.window.registerWebviewPanelSerializer('polacode', {
+    async deserializeWebviewPanel(panel, state) {
+      panel = panel
+      panel.webview.html = getHtmlContent(htmlPath)
+      panel.webview.postMessage({
+        type: 'restore',
+        innerHTML: state.innerHTML,
+      })
+    }
+  })
+
   vscode.commands.registerCommand('polacode.activate', () => {
     panel = vscode.window.createWebviewPanel('polacode', P_TITLE, 2, {
       enableScripts: true,
-      localResourceRoots: [vscode.Uri.file(path.join(context.extensionPath, 'webview'))]
+      localResourceRoots: [vscode.Uri.file(path.join(context.extensionPath, 'webview'))],
+      // retainContextWhenHidden: true
     })
 
     panel.webview.html = getHtmlContent(htmlPath)

webview/index.js

@@ -5,6 +5,12 @@
   const snippetContainerNode = document.getElementById('snippet-container')
   const obturateur = document.getElementById('save')
 
+  snippetContainerNode.style.opacity = '1'
+  const oldState = vscode.getState();
+  if (oldState && oldState.innerHTML) {
+    snippetNode.innerHTML = oldState.innerHTML
+  }
+
   const getInitialHtml = fontFamily => {
     const cameraWithFlashEmoji = String.fromCodePoint(128248)
     const monoFontStack = `${fontFamily},SFMono-Regular,Consolas,DejaVu Sans Mono,Ubuntu Mono,Liberation Mono,Menlo,Courier,monospace`
@@ -106,6 +112,8 @@
     } else {
       snippetNode.innerHTML = innerHTML
     }
+
+    vscode.setState({ innerHTML })
   })
 
   obturateur.addEventListener('click', () => {
@@ -158,6 +166,7 @@
 
         const initialHtml = getInitialHtml(fontFamily)
         snippetNode.innerHTML = initialHtml
+        vscode.setState({ innerHTML: initialHtml })
 
         // update backdrop color, using bgColor from last pasted snippet
         // cannot deduce from initialHtml since it's always using Nord color
@@ -167,9 +176,10 @@
           snippetContainerNode.style.background = 'none'
         }
 
-        snippetContainerNode.style.opacity = '1'
       } else if (e.data.type === 'update') {
         document.execCommand('paste')
+      } else if (e.data.type === 'restore') {
+        snippetNode.innerHTML = e.data.innerHTML
       }
     }
   })