📄 ${fileItem.file.name}
${formatSize(fileItem.file.size)}
等待上传...
`;
fileList.appendChild(div);
});
}
```
--------------------------------
### Format File Size
Source: https://github.com/yohann0617/tg-disk/blob/master/static/upload.html
Converts bytes into a human-readable format (B, KB, MB, GB).
```javascript
function formatSize(bytes) {
if (bytes < 1024) return bytes + ' B';
if (bytes < 1024 * 1024) return (bytes / 1024).toFixed(2) + ' KB';
if (bytes < 1024 * 1024 * 1024) return (bytes / (1024 * 1024)).toFixed(2) + ' MB';
return (bytes / (1024 * 1024 * 1024)).toFixed(2) + ' GB';
}
```
--------------------------------
### Handle Drag and Drop Events
Source: https://github.com/yohann0617/tg-disk/blob/master/static/upload.html
Attaches event listeners to the drop zone for click, dragover, dragleave, and drop events. Handles file selection via click and drag-and-drop.
```javascript
dropZone.addEventListener("click", () => fileInput.click());
dropZone.addEventListener("dragover", e => {
e.preventDefault();
dropZone.classList.add("dragover");
});
dropZone.addEventListener("dragleave", () => dropZone.classList.remove("dragover"));
dropZone.addEventListener("drop", e => {
e.preventDefault();
dropZone.classList.remove("dragover");
handleFiles(e.dataTransfer.files);
});
fileInput.addEventListener("change", () => handleFiles(fileInput.files));
```
--------------------------------
### Display Upload Results Modal
Source: https://github.com/yohann0617/tg-disk/blob/master/static/upload.html
Generates and displays a modal with download links for uploaded files in various formats (direct link, URL, HTML, Markdown, BBCode). It populates a container with formatted results and includes copy-to-clipboard functionality for each link type.
```javascript
function showResultModal(list) {
const container = document.getElementById("result-links");
container.innerHTML = "";
list.forEach((file, index) => {
const html = `