imgpaste/script.js

74 lines
1.6 KiB
JavaScript

dropzone = document.getElementById('dropzone');
filetypes = ['image/png', 'image/jpeg', 'image/gif'];
dropzone.addEventListener('dragover', function(e) {
e.preventDefault();
dropzone_toggle("on");
});
dropzone.addEventListener('dragleave', function(e) {
dropzone_toggle("off");
});
dropzone.addEventListener('mousedown', function(e) {
dropzone_toggle("on");
});
dropzone.addEventListener('mouseup', function(e) {
dropzone_toggle("off");
});
dropzone.addEventListener('click', function(e) {
input = document.createElement('input');
input.type = 'file';
input.click();
input.onchange = function(e) {
file = e.target.files[0];
if(filetypes.includes(file.type)) {
upload(e.target.files[0]);
}
}
});
dropzone.addEventListener('drop', function(e) {
e.preventDefault();
dropzone_toggle("off");
file = e.dataTransfer.files[0];
if(filetypes.includes(file.type)) {
upload(e.dataTransfer.files[0]);
}
});
function dropzone_toggle(state) {
if(state == "on") {
dropzone.classList.remove('inactive');
dropzone.classList.add('active');
} else if(state == "off") {
dropzone.classList.remove('active');
dropzone.classList.add('inactive');
}
}
function upload(file) {
const data = new FormData();
data.append('upload', file)
fetch('upload.php', {
method: 'POST',
body: data
}).then(response => {
response.json().then(parsedValue => {
filename = parsedValue['filename'];
datadir = parsedValue['datadir'];
openUploadedFile(datadir, filename);
})
});
};
function openUploadedFile(datadir, filename) {
window.open(window.location.href + datadir + '/' + filename, '_self');
};