diff mrjunejune/src/tools/file_converter/index.js @ 93:be91a73d801a

[MrJuneJune] Updated my website.
author June Park <parkjune1995@gmail.com>
date Fri, 02 Jan 2026 18:02:22 -0800
parents
children
line wrap: on
line diff
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/mrjunejune/src/tools/file_converter/index.js	Fri Jan 02 18:02:22 2026 -0800
@@ -0,0 +1,114 @@
+async function convertImageToWebP()
+{
+  const input = document.getElementById('imageInput');
+  const btn = document.getElementById('convertImageBtn');
+  const loading = document.getElementById('imageLoading');
+  const result = document.getElementById('imageResult');
+  const message = document.getElementById('imageMessage');
+  const download = document.getElementById('imageDownload');
+
+  if (!input.files || !input.files[0])
+  {
+    alert('Please select an image file first');
+    return;
+  }
+
+  const file = input.files[0];
+
+  // Show loading state
+  btn.disabled = true;
+  loading.classList.add('show');
+  result.classList.remove('show', 'success', 'error');
+  download.style.display = 'none';
+
+  try {
+    const response = await fetch('/api/convert/image-to-webp', {
+      method: 'POST',
+      body: file,
+      headers: {
+        'Content-Type': file.type
+      }
+    });
+
+    loading.classList.remove('show');
+    result.classList.add('show');
+
+    if (response.ok) {
+      const data = await response.json();
+
+      download.href = data.download_url;
+      download.download = file.name.replace(/\.[^/.]+$/, '') + '.webp';
+      download.style.display = 'inline-block';
+
+      message.textContent = 'Conversion successful! Link expires in ' + data.expires + '.';
+      result.classList.add('success');
+    } else {
+      const text = await response.text();
+      message.textContent = 'Conversion failed: ' + text;
+      result.classList.add('error');
+    }
+  } catch (error) {
+    loading.classList.remove('show');
+    result.classList.add('show', 'error');
+    message.textContent = 'Error: ' + error.message;
+  } finally {
+    btn.disabled = false;
+  }
+}
+
+async function convertVideoToMP4() {
+  const input = document.getElementById('videoInput');
+  const btn = document.getElementById('convertVideoBtn');
+  const loading = document.getElementById('videoLoading');
+  const result = document.getElementById('videoResult');
+  const message = document.getElementById('videoMessage');
+  const download = document.getElementById('videoDownload');
+
+  if (!input.files || !input.files[0]) {
+    alert('Please select a video file first');
+    return;
+  }
+
+  const file = input.files[0];
+
+  // Show loading state
+  btn.disabled = true;
+  loading.classList.add('show');
+  result.classList.remove('show', 'success', 'error');
+  download.style.display = 'none';
+
+  try {
+    const response = await fetch('/api/convert/video-to-mp4', {
+      method: 'POST',
+      body: file,
+      headers: {
+        'Content-Type': file.type
+      }
+    });
+
+    loading.classList.remove('show');
+    result.classList.add('show');
+
+    if (response.ok) {
+      const data = await response.json();
+
+      download.href = data.download_url;
+      download.download = file.name.replace(/\.[^/.]+$/, '') + '.mp4';
+      download.style.display = 'inline-block';
+
+      message.textContent = 'Conversion successful! Link expires in ' + data.expires + '.';
+      result.classList.add('success');
+    } else {
+      const text = await response.text();
+      message.textContent = 'Conversion failed: ' + text;
+      result.classList.add('error');
+    }
+  } catch (error) {
+    loading.classList.remove('show');
+    result.classList.add('show', 'error');
+    message.textContent = 'Error: ' + error.message;
+  } finally {
+    btn.disabled = false;
+  }
+}
+