From 5d56feca4cb2523e3f9fdfc81829fcca07d2556c Mon Sep 17 00:00:00 2001
From: Federico Matias Claros Garcia <federicoclarosv.15@gmail.com>
Date: Thu, 16 Jan 2025 10:18:28 -0300
Subject: [PATCH] Added open .md file from disk

---
 public/index.html |  1 +
 public/js/main.js | 25 +++++++++++++++++++++++++
 2 files changed, 26 insertions(+)

diff --git a/public/index.html b/public/index.html
index c5a1630..40ca457 100644
--- a/public/index.html
+++ b/public/index.html
@@ -39,6 +39,7 @@
             <div id="reset-button"><a href="#">Reset</a></div>
             <div id="copy-button"><a href="#">Copy</a></div>
             <div id="sync-button"><input type="checkbox" id="sync-scroll-checkbox"><label for="sync-scroll-checkbox">Sync scroll</label></div>
+            <div id="open-folder-button" ><a href="#">Open File</a></div>
         </div>
         <div id="github"><a href="https://github.com/tanabe/markdown-live-preview"><img src="image/GitHub-Mark-Light-32px.webp"></a></div>
     </header>
diff --git a/public/js/main.js b/public/js/main.js
index d15ef4a..8825e3f 100644
--- a/public/js/main.js
+++ b/public/js/main.js
@@ -117,6 +117,23 @@ This web site is using ${"`"}markedjs/marked${"`"}.
         document.querySelector('#output').innerHTML = sanitized;
     };
 
+    // Open markdown file from disk and render it
+    let call_file_browser = () => {
+        let fb = document.createElement("input");
+        fb.type = 'file';
+        fb.accept = '.md';
+
+        fb.onchange = () => {
+            let fr = new FileReader();
+            fr.onload = () => {
+                editor.setValue(fr.result);
+                editor.focus();
+            }
+            fr.readAsText(fb.files[0]); // the first file selected is read.
+        }
+        fb.click();
+    }
+
     // Reset input text
     let reset = () => {
         let changed = editor.getValue() != defaultInput;
@@ -219,6 +236,13 @@ This web site is using ${"`"}markedjs/marked${"`"}.
         });
     };
 
+    let setupOpenFileButton = (editor) => {
+        document.querySelector("#open-folder-button").addEventListener('click', (event) => {
+            event.preventDefault();
+            call_file_browser();
+        });
+    };
+
     // ----- local state -----
 
     let loadLastContent = () => {
@@ -253,6 +277,7 @@ This web site is using ${"`"}markedjs/marked${"`"}.
     }
     setupResetButton();
     setupCopyButton(editor);
+    setupOpenFileButton();
 
     let scrollBarSettings = loadScrollBarSettings() || false;
     initScrollBarSync(scrollBarSettings);