107 lines
4.1 KiB
JavaScript
107 lines
4.1 KiB
JavaScript
var fileobj;
|
|
function file_dropped(e)
|
|
{
|
|
e.preventDefault();
|
|
fileobj = e.dataTransfer.files[0];
|
|
filename = e.dataTransfer.files[0].name;
|
|
upload_file(fileobj,filename);
|
|
}
|
|
|
|
function file_explorer() {
|
|
document.getElementById('uploadfile').click();
|
|
document.getElementById('uploadfile').onchange = function()
|
|
{
|
|
fileobj = document.getElementById('uploadfile').files[0];
|
|
filename = document.getElementById('uploadfile').files[0].name;
|
|
upload_file(fileobj,filename);
|
|
};
|
|
}
|
|
|
|
function copytoclipboard()
|
|
{
|
|
var elm = document.getElementById("divresponse");
|
|
var selection = window.getSelection();
|
|
var range = document.createRange();
|
|
range.selectNodeContents(elm);
|
|
selection.removeAllRanges();
|
|
selection.addRange(range);
|
|
document.execCommand("Copy");
|
|
}
|
|
|
|
function upload_file(file_obj, file_name)
|
|
{
|
|
const divresponse = document.getElementById('divresponse');
|
|
divresponse.innerHTML = "Uploading file...";
|
|
|
|
const copyToClipboard = document.getElementById('copytoclipboard');
|
|
copyToClipboard.style.visibility = "hidden";
|
|
|
|
const progressContainer = document.getElementById('progress-container');
|
|
|
|
// Update progress bar
|
|
const progressBar = document.getElementById('progress-bar');
|
|
progressBar.value = 0;
|
|
const progressText = document.getElementById('progress-text');
|
|
progressText.innerText = "0%";
|
|
progressContainer.style.display = ''; // <- become visible by style
|
|
|
|
const request = async () => {
|
|
// Create XMLHttpRequest for progress tracking
|
|
const xhr = new XMLHttpRequest();
|
|
|
|
|
|
// Track upload progress
|
|
xhr.upload.addEventListener('progress', function(e) {
|
|
if (e.lengthComputable) {
|
|
const percentComplete = Math.round((e.loaded / e.total) * 100);
|
|
|
|
if (progressBar && progressText) {
|
|
progressBar.value = percentComplete;
|
|
progressText.innerText = percentComplete + '%';
|
|
}
|
|
}
|
|
});
|
|
|
|
// Handle completion
|
|
xhr.addEventListener('load', function() {
|
|
if (xhr.status === 200) {
|
|
divresponse.innerHTML = xhr.responseText;
|
|
progressContainer.style.display = 'none';
|
|
copyToClipboard.style.visibility = 'visible';
|
|
|
|
if (xhr.responseText.startsWith("http")) {
|
|
var fturl = document.getElementsByTagName("fturl");
|
|
Array.from(fturl).forEach(tag => tag.innerHTML = xhr.responseText);
|
|
}
|
|
} else {
|
|
divresponse.innerHTML = "Upload failed. Please try again.";
|
|
}
|
|
});
|
|
|
|
// Handle errors
|
|
xhr.addEventListener('error', function() {
|
|
progressContainer.style.display = 'none';
|
|
divresponse.innerHTML = "Upload failed. Please try again.";
|
|
});
|
|
|
|
// Setup and send request
|
|
xhr.open('PUT', '/index.php?name=' + encodeURIComponent(file_name));
|
|
xhr.send(file_obj);
|
|
}
|
|
request();
|
|
}
|
|
|
|
function change_color_ondrag(event)
|
|
{
|
|
if (event === "ondragenter")
|
|
{
|
|
var element = document.getElementById('dragzone');
|
|
element.classList.add("dragover");
|
|
}
|
|
else if (event === "ondragleave")
|
|
{
|
|
var element = document.getElementById('dragzone');
|
|
element.classList.remove("dragover");
|
|
}
|
|
}
|