| |
| document.addEventListener('DOMContentLoaded', function() { |
| let video1File = null; |
| let video2File = null; |
| let outputBlob = null; |
| let ffmpeg = null; |
|
|
| const video1Input = document.getElementById('video1'); |
| const video2Input = document.getElementById('video2'); |
| const joinBtn = document.getElementById('joinBtn'); |
| const downloadBtn = document.getElementById('downloadBtn'); |
| const progressContainer = document.getElementById('progressContainer'); |
| const progressFill = document.getElementById('progressFill'); |
| const statusText = document.getElementById('statusText'); |
| const previewSection = document.getElementById('previewSection'); |
| const previewVideo = document.getElementById('previewVideo'); |
| const errorDiv = document.getElementById('errorDiv'); |
| const info1 = document.getElementById('info1'); |
| const info2 = document.getElementById('info2'); |
| const input1Container = document.getElementById('input1Container'); |
| const input2Container = document.getElementById('input2Container'); |
|
|
| |
| |
| }); |
|
|
| |
| function showError(message, element = document.getElementById('errorDiv')) { |
| element.textContent = message; |
| element.classList.add('active'); |
| setTimeout(() => { |
| element.classList.remove('active'); |
| }, 5000); |
| } |
|
|
| function updateProgress(percentage, status) { |
| const progressFill = document.getElementById('progressFill'); |
| const statusText = document.getElementById('statusText'); |
| |
| progressFill.style.width = percentage + '%'; |
| progressFill.textContent = percentage + '%'; |
| statusText.textContent = status; |
| } |
|
|
| function formatFileSize(bytes) { |
| if (bytes === 0) return '0 Bytes'; |
| const k = 1024; |
| const sizes = ['Bytes', 'KB', 'MB', 'GB']; |
| const i = Math.floor(Math.log(bytes) / Math.log(k)); |
| return Math.round(bytes / Math.pow(k, i) * 100) / 100 + ' ' + sizes[i]; |
| } |
|
|
| |
| export { showError, updateProgress, formatFileSize }; |