Add QR code, Add MODT customisation
This commit is contained in:
@@ -6,6 +6,7 @@
|
||||
<title>Send.it - File Ready</title>
|
||||
<script src="https://cdn.tailwindcss.com"></script>
|
||||
<link rel="icon" type="image/x-icon" href="/static/favicon.ico">
|
||||
<script src="https://cdnjs.cloudflare.com/ajax/libs/qrcodejs/1.0.0/qrcode.min.js"></script>
|
||||
<style>
|
||||
* {
|
||||
border-radius: 0 !important;
|
||||
@@ -107,7 +108,7 @@
|
||||
<div class="section-label mb-1">Download_Link:</div>
|
||||
<div class="flex">
|
||||
<input id="res-url" readonly class="input-text">
|
||||
<button onclick="copy('res-url')" class="border-l-0">COPY</button>
|
||||
<button onclick="copy('res-url')" class="border-l-0 pl-1 pr-1">COPY</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -116,7 +117,15 @@
|
||||
<div class="section-label mb-1 text-red-600">Deletion_Link <span class="text-gray-400 normal-case">(private)</span>:</div>
|
||||
<div class="flex">
|
||||
<input id="res-del" readonly class="input-text" style="color:#cc0000;">
|
||||
<button onclick="copy('res-del')" class="border-l-0">COPY</button>
|
||||
<button onclick="copy('res-del')" class="border-l-0 pl-1 pr-1">COPY</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
<button id="qr-btn" onclick="toggleQR()" class="pl-1 pr-1">Show_QR</button>
|
||||
|
||||
<div id="qr-container" class="mt-3 hidden border-2 border-black p-4 flex justify-center">
|
||||
<div id="qr-code"></div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@@ -126,11 +135,13 @@
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<!-- Footer -->
|
||||
<div class="w-full mt-3 flex justify-between items-center">
|
||||
<span class="text-[10px] font-black uppercase text-gray-400">A_Service_By_Brammie15</span>
|
||||
<span class="text-[10px] font-black text-gray-400">{{ .MODT }}</span>
|
||||
<div class="flex gap-4">
|
||||
<a href="/static/TOS.txt" class="nav-link">TOS</a>
|
||||
<a href="/admin" class="nav-link">SUDO</a>
|
||||
@@ -153,6 +164,25 @@
|
||||
|
||||
document.getElementById("res-url").value = `${base}/api/files/view/${downloadKey}`;
|
||||
document.getElementById("res-del").value = `${base}/api/files/delete/${deleteKey}`;
|
||||
|
||||
const downloadURL = `${base}/api/files/view/${downloadKey}`;
|
||||
|
||||
// Generate QR code
|
||||
new QRCode(document.getElementById("qr-code"), {
|
||||
text: downloadURL,
|
||||
width: 160,
|
||||
height: 160
|
||||
});
|
||||
|
||||
function toggleQR() {
|
||||
const container = document.getElementById("qr-container");
|
||||
const btn = document.getElementById("qr-btn");
|
||||
|
||||
const isHidden = container.classList.contains("hidden");
|
||||
|
||||
container.classList.toggle("hidden");
|
||||
btn.textContent = isHidden ? "Hide_QR" : "Show_QR";
|
||||
}
|
||||
</script>
|
||||
|
||||
</body>
|
||||
|
||||
@@ -138,6 +138,15 @@
|
||||
|
||||
<form method="POST" action="/config">
|
||||
|
||||
<div class="box mb-6">
|
||||
<div class="section-title">General_Settings</div>
|
||||
|
||||
<div class="row">
|
||||
<label>Site_MODT</label>
|
||||
<input type="text" name="site_modt" value="{{.MODT}}">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- UPLOAD SETTINGS -->
|
||||
<div class="box mb-6">
|
||||
<div class="section-title">Upload_Control</div>
|
||||
|
||||
@@ -122,7 +122,7 @@
|
||||
</div>
|
||||
|
||||
<div class="w-full mt-3 flex justify-between items-center">
|
||||
<span class="text-[10px] font-black uppercase text-gray-400">A_Service_By_Brammie15</span>
|
||||
<span class="text-[10px] font-black text-gray-400">{{.MODT}}</span>
|
||||
<div class="flex gap-4">
|
||||
<a href="/static/TOS.txt" class="nav-link">TOS</a>
|
||||
<a href="/admin" class="nav-link">SUDO</a>
|
||||
|
||||
@@ -281,7 +281,7 @@
|
||||
|
||||
<!-- Footer -->
|
||||
<div class="w-full mt-3 flex justify-between items-center">
|
||||
<span class="text-[10px] font-black uppercase text-gray-400">A_Service_By_Brammie15</span>
|
||||
<span class="text-[10px] font-black text-gray-400">{{.MODT}}</span>
|
||||
<div class="flex gap-4">
|
||||
<a href="/static/TOS.txt" class="nav-link">TOS</a>
|
||||
<a href="/admin" class="nav-link">SUDO</a>
|
||||
@@ -289,188 +289,6 @@
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<script>
|
||||
const zone = document.getElementById('drop-zone');
|
||||
const input = document.getElementById('fileInput');
|
||||
const uploadBtn = document.getElementById('uploadBtn');
|
||||
const cancelBtn = document.getElementById('cancelBtn');
|
||||
|
||||
const progressText = document.getElementById("progress-text");
|
||||
const statsText = document.getElementById("stats-text");
|
||||
const speedText = document.getElementById("speed-text");
|
||||
const etaText = document.getElementById("eta-text");
|
||||
const progressBar = document.getElementById("progress-bar");
|
||||
const progressContainer = document.getElementById("progress-container");
|
||||
|
||||
let currentXhr = null;
|
||||
|
||||
function formatBytes(bytes, decimals = 2) {
|
||||
if (bytes === 0) return '0 Bytes';
|
||||
const k = 1024;
|
||||
const dm = decimals < 0 ? 0 : decimals;
|
||||
const sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB'];
|
||||
const i = Math.floor(Math.log(bytes) / Math.log(k));
|
||||
return parseFloat((bytes / Math.pow(k, i)).toFixed(dm)) + ' ' + sizes[i];
|
||||
}
|
||||
|
||||
function formatTime(seconds) {
|
||||
if (!isFinite(seconds) || seconds < 0) return "--:--";
|
||||
const h = Math.floor(seconds / 3600);
|
||||
const m = Math.floor((seconds % 3600) / 60);
|
||||
const s = Math.floor(seconds % 60);
|
||||
return [
|
||||
h > 0 ? h : null,
|
||||
(h > 0 ? m.toString().padStart(2, '0') : m),
|
||||
s.toString().padStart(2, '0')
|
||||
].filter(x => x !== null).join(':');
|
||||
}
|
||||
|
||||
zone.onclick = () => input.click();
|
||||
|
||||
zone.ondragover = (e) => {
|
||||
e.preventDefault();
|
||||
zone.classList.add('active');
|
||||
};
|
||||
zone.ondragleave = () => zone.classList.remove('active');
|
||||
|
||||
zone.ondrop = (e) => {
|
||||
e.preventDefault();
|
||||
zone.classList.remove('active');
|
||||
if (e.dataTransfer.files.length) {
|
||||
input.files = e.dataTransfer.files;
|
||||
input.dispatchEvent(new Event('change'));
|
||||
}
|
||||
};
|
||||
|
||||
input.onchange = () => {
|
||||
if (input.files.length) {
|
||||
showFiles(input.files);
|
||||
uploadBtn.disabled = false;
|
||||
} else {
|
||||
uploadBtn.disabled = true;
|
||||
}
|
||||
};
|
||||
|
||||
function showFiles(fileList) {
|
||||
const files = Array.from(fileList || []);
|
||||
if (files.length === 0) return;
|
||||
const total = files.reduce((acc, f) => acc + f.size, 0);
|
||||
if (files.length === 1) {
|
||||
document.getElementById('dz-text').innerText =
|
||||
`${files[0].name} [${formatBytes(files[0].size)}]`;
|
||||
} else {
|
||||
document.getElementById('dz-text').innerText =
|
||||
`${files.length} FILES [${formatBytes(total)}] — will be zipped`;
|
||||
}
|
||||
}
|
||||
|
||||
uploadBtn.onclick = () => {
|
||||
if (!input.files.length) return;
|
||||
if (input.files.length === 1) {
|
||||
handleUploadSingle(input.files[0]);
|
||||
} else {
|
||||
handleUploadMulti(input.files);
|
||||
}
|
||||
};
|
||||
|
||||
cancelBtn.onclick = (e) => {
|
||||
e.stopPropagation();
|
||||
if (currentXhr) {
|
||||
currentXhr.abort();
|
||||
alert("Upload cancelled.");
|
||||
location.reload();
|
||||
}
|
||||
};
|
||||
|
||||
function commonFormData() {
|
||||
const fd = new FormData();
|
||||
fd.append("once", document.getElementById("once").checked ? "true" : "false");
|
||||
const hours = parseInt(document.getElementById("duration").value, 10);
|
||||
fd.append("duration", hours);
|
||||
return fd;
|
||||
}
|
||||
|
||||
function startUploadUI() {
|
||||
uploadBtn.disabled = true;
|
||||
uploadBtn.innerText = "UPLOADING...";
|
||||
cancelBtn.classList.remove('hidden');
|
||||
progressContainer.classList.remove("hidden");
|
||||
progressText.classList.remove("hidden");
|
||||
statsText.classList.remove("hidden");
|
||||
}
|
||||
|
||||
function setupXHRHandlers(xhr) {
|
||||
let startTime = Date.now();
|
||||
|
||||
xhr.upload.onprogress = (e) => {
|
||||
if (e.lengthComputable) {
|
||||
const percent = Math.round((e.loaded / e.total) * 100);
|
||||
progressBar.style.width = percent + "%";
|
||||
progressText.innerText = percent + "%";
|
||||
|
||||
const elapsedSeconds = (Date.now() - startTime) / 1000;
|
||||
if (elapsedSeconds > 0) {
|
||||
const bytesPerSecond = e.loaded / elapsedSeconds;
|
||||
const remainingBytes = e.total - e.loaded;
|
||||
const secondsRemaining = remainingBytes / bytesPerSecond;
|
||||
speedText.innerText = formatBytes(bytesPerSecond) + "/S";
|
||||
etaText.innerText = formatTime(secondsRemaining);
|
||||
}
|
||||
}
|
||||
};
|
||||
|
||||
xhr.onload = () => {
|
||||
if (xhr.status >= 200 && xhr.status < 300) {
|
||||
try {
|
||||
const data = JSON.parse(xhr.responseText);
|
||||
if (data.error) throw new Error(data.error);
|
||||
window.location.href = "/f/" + data.view_key;
|
||||
} catch (err) {
|
||||
console.error("Invalid response:", xhr.responseText);
|
||||
alert("Server error");
|
||||
}
|
||||
} else {
|
||||
alert("Upload failed");
|
||||
}
|
||||
};
|
||||
|
||||
xhr.onerror = () => {
|
||||
if (xhr.statusText !== "abort") {
|
||||
alert("Upload failed");
|
||||
location.reload();
|
||||
}
|
||||
};
|
||||
}
|
||||
|
||||
function handleUploadSingle(file) {
|
||||
startUploadUI();
|
||||
const fd = commonFormData();
|
||||
fd.append("file", file);
|
||||
const xhr = new XMLHttpRequest();
|
||||
currentXhr = xhr;
|
||||
setupXHRHandlers(xhr);
|
||||
xhr.open("POST", "/api/files/upload");
|
||||
xhr.send(fd);
|
||||
}
|
||||
|
||||
function handleUploadMulti(fileList) {
|
||||
startUploadUI();
|
||||
const fd = commonFormData();
|
||||
Array.from(fileList).forEach(f => fd.append("files", f));
|
||||
const xhr = new XMLHttpRequest();
|
||||
currentXhr = xhr;
|
||||
setupXHRHandlers(xhr);
|
||||
xhr.open("POST", "/api/files/upload-multi");
|
||||
xhr.send(fd);
|
||||
}
|
||||
|
||||
function copy(id) {
|
||||
const el = document.getElementById(id);
|
||||
el.select();
|
||||
document.execCommand('copy');
|
||||
}
|
||||
</script>
|
||||
|
||||
<script src="/static/js/upload.js"></script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user