1 files changed, 49 insertions, 13 deletions

diff --git a/src/static/main.js b/src/static/main.js
index f3f4f71..68d36ad 100644
--- a/src/static/main.js
+++ b/src/static/main.js
@@ -1,41 +1,77 @@
 const convertButton = document.getElementById("convert-button");
 const uploadButton = document.getElementById("upload-button");
 const markdownInput = document.getElementById("markdown");
+const imageInput = document.getElementById("image");
+const mdFileInput = document.getElementById("md-file");
 
-function sourceForm(event) {
-  const sourceElement = event.detail?.elt;
-  if (!sourceElement) {
-    return null;
+document.body.addEventListener("htmx:beforeRequest", (event) => {
+  const elt = event.detail?.elt;
+  if (!elt) {
+    return;
   }
-  return sourceElement.closest("form");
-}
 
-document.body.addEventListener("htmx:beforeRequest", (event) => {
-  const form = sourceForm(event);
-  if (form?.id === "convert-form" && convertButton) {
+  if (elt.id === "convert-form" && convertButton) {
     convertButton.disabled = true;
     convertButton.textContent = "generating...";
   }
 
-  if (form?.id === "upload-form" && uploadButton) {
+  if (elt.id === "upload-button" && uploadButton) {
     uploadButton.disabled = true;
     uploadButton.textContent = "uploading...";
   }
 });
 
 document.body.addEventListener("htmx:afterRequest", (event) => {
-  const form = sourceForm(event);
-  if (form?.id === "convert-form" && convertButton) {
+  const elt = event.detail?.elt;
+  if (!elt) {
+    return;
+  }
+
+  if (elt.id === "convert-form" && convertButton) {
     convertButton.disabled = false;
     convertButton.textContent = "generate pdf";
   }
 
-  if (form?.id === "upload-form" && uploadButton) {
+  if (elt.id === "upload-button" && uploadButton) {
     uploadButton.disabled = false;
     uploadButton.textContent = "upload image";
   }
 });
 
+if (mdFileInput) {
+  mdFileInput.addEventListener("change", () => {
+    const file = mdFileInput.files?.[0];
+
+    if (file) {
+      const reader = new FileReader();
+      reader.onload = (e) => {
+        if (markdownInput) {
+          markdownInput.value = /** @type {string} */ (e.target.result);
+          markdownInput.readOnly = true;
+        }
+        if (imageInput) {
+          imageInput.disabled = true;
+        }
+        if (uploadButton) {
+          uploadButton.disabled = true;
+        }
+      };
+      reader.readAsText(file);
+    } else {
+      if (markdownInput) {
+        markdownInput.value = "";
+        markdownInput.readOnly = false;
+      }
+      if (imageInput) {
+        imageInput.disabled = false;
+      }
+      if (uploadButton) {
+        uploadButton.disabled = false;
+      }
+    }
+  });
+}
+
 document.body.addEventListener("click", (event) => {
   const target = event.target;
   if (!(target instanceof HTMLElement)) {