Mercurial

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

Find changesets by keywords (author, files, the commit message), revision number or hash, or revset expression.
[MrJuneJune] Updated my website.
author June Park <parkjune1995@gmail.com>
date Fri, 02 Jan 2026 18:02:22 -0800
parents
children
comparison
equal deleted inserted replaced
92:655ea0b661fd 93:be91a73d801a
1 async function convertImageToWebP()
2 {
3 const input = document.getElementById('imageInput');
4 const btn = document.getElementById('convertImageBtn');
5 const loading = document.getElementById('imageLoading');
6 const result = document.getElementById('imageResult');
7 const message = document.getElementById('imageMessage');
8 const download = document.getElementById('imageDownload');
9
10 if (!input.files || !input.files[0])
11 {
12 alert('Please select an image file first');
13 return;
14 }
15
16 const file = input.files[0];
17
18 // Show loading state
19 btn.disabled = true;
20 loading.classList.add('show');
21 result.classList.remove('show', 'success', 'error');
22 download.style.display = 'none';
23
24 try {
25 const response = await fetch('/api/convert/image-to-webp', {
26 method: 'POST',
27 body: file,
28 headers: {
29 'Content-Type': file.type
30 }
31 });
32
33 loading.classList.remove('show');
34 result.classList.add('show');
35
36 if (response.ok) {
37 const data = await response.json();
38
39 download.href = data.download_url;
40 download.download = file.name.replace(/\.[^/.]+$/, '') + '.webp';
41 download.style.display = 'inline-block';
42
43 message.textContent = 'Conversion successful! Link expires in ' + data.expires + '.';
44 result.classList.add('success');
45 } else {
46 const text = await response.text();
47 message.textContent = 'Conversion failed: ' + text;
48 result.classList.add('error');
49 }
50 } catch (error) {
51 loading.classList.remove('show');
52 result.classList.add('show', 'error');
53 message.textContent = 'Error: ' + error.message;
54 } finally {
55 btn.disabled = false;
56 }
57 }
58
59 async function convertVideoToMP4() {
60 const input = document.getElementById('videoInput');
61 const btn = document.getElementById('convertVideoBtn');
62 const loading = document.getElementById('videoLoading');
63 const result = document.getElementById('videoResult');
64 const message = document.getElementById('videoMessage');
65 const download = document.getElementById('videoDownload');
66
67 if (!input.files || !input.files[0]) {
68 alert('Please select a video file first');
69 return;
70 }
71
72 const file = input.files[0];
73
74 // Show loading state
75 btn.disabled = true;
76 loading.classList.add('show');
77 result.classList.remove('show', 'success', 'error');
78 download.style.display = 'none';
79
80 try {
81 const response = await fetch('/api/convert/video-to-mp4', {
82 method: 'POST',
83 body: file,
84 headers: {
85 'Content-Type': file.type
86 }
87 });
88
89 loading.classList.remove('show');
90 result.classList.add('show');
91
92 if (response.ok) {
93 const data = await response.json();
94
95 download.href = data.download_url;
96 download.download = file.name.replace(/\.[^/.]+$/, '') + '.mp4';
97 download.style.display = 'inline-block';
98
99 message.textContent = 'Conversion successful! Link expires in ' + data.expires + '.';
100 result.classList.add('success');
101 } else {
102 const text = await response.text();
103 message.textContent = 'Conversion failed: ' + text;
104 result.classList.add('error');
105 }
106 } catch (error) {
107 loading.classList.remove('show');
108 result.classList.add('show', 'error');
109 message.textContent = 'Error: ' + error.message;
110 } finally {
111 btn.disabled = false;
112 }
113 }
114