2018-01-23 20:06:30 +00:00
|
|
|
/* eslint-disable no-unused-expressions */
|
|
|
|
/* global swal, axios, Dropzone */
|
2017-01-14 09:16:47 +00:00
|
|
|
|
2018-01-23 20:06:30 +00:00
|
|
|
var upload = {}
|
|
|
|
|
|
|
|
upload.isPrivate = true
|
|
|
|
upload.token = localStorage.token
|
|
|
|
upload.maxFileSize
|
2018-01-23 18:00:55 +00:00
|
|
|
// Add the album var to the upload so we can store the album id in there
|
2018-01-23 20:06:30 +00:00
|
|
|
upload.album
|
|
|
|
upload.myDropzone
|
|
|
|
|
|
|
|
upload.checkIfPublic = function () {
|
2018-01-24 15:31:23 +00:00
|
|
|
axios.get('api/check')
|
2018-01-23 20:06:30 +00:00
|
|
|
.then(response => {
|
|
|
|
upload.isPrivate = response.data.private
|
|
|
|
upload.maxFileSize = response.data.maxFileSize
|
|
|
|
upload.preparePage()
|
|
|
|
})
|
|
|
|
.catch(error => {
|
2018-01-23 20:41:28 +00:00
|
|
|
console.log(error)
|
2018-02-24 19:33:31 +00:00
|
|
|
return swal('An error occurred', 'There was an error with the request, please check the console for more information.', 'error')
|
2018-01-23 20:06:30 +00:00
|
|
|
})
|
|
|
|
}
|
|
|
|
|
|
|
|
upload.preparePage = function () {
|
2018-01-24 15:31:23 +00:00
|
|
|
if (upload.isPrivate) {
|
|
|
|
if (upload.token) {
|
|
|
|
return upload.verifyToken(upload.token, true)
|
|
|
|
} else {
|
|
|
|
document.getElementById('loginToUpload').innerText = 'Running in private mode. Log in to upload.'
|
|
|
|
document.getElementById('loginToUpload').style.display = 'inline-flex' // ???
|
|
|
|
}
|
|
|
|
} else {
|
|
|
|
return upload.prepareUpload()
|
2018-01-23 20:06:30 +00:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
upload.verifyToken = function (token, reloadOnError) {
|
|
|
|
if (reloadOnError === undefined) { reloadOnError = false }
|
|
|
|
|
2018-01-24 15:31:23 +00:00
|
|
|
axios.post('api/tokens/verify', { token: token })
|
2018-01-23 20:06:30 +00:00
|
|
|
.then(response => {
|
|
|
|
if (response.data.success === false) {
|
|
|
|
swal({
|
2018-02-24 19:33:31 +00:00
|
|
|
title: 'An error occurred',
|
2018-01-23 20:06:30 +00:00
|
|
|
text: response.data.description,
|
2018-03-19 16:51:39 +00:00
|
|
|
icon: 'error'
|
|
|
|
}).then(() => {
|
2018-01-23 20:06:30 +00:00
|
|
|
if (reloadOnError) {
|
|
|
|
localStorage.removeItem('token')
|
|
|
|
location.reload()
|
|
|
|
}
|
|
|
|
})
|
|
|
|
return
|
|
|
|
}
|
|
|
|
|
|
|
|
localStorage.token = token
|
|
|
|
upload.token = token
|
|
|
|
return upload.prepareUpload()
|
|
|
|
})
|
|
|
|
.catch(error => {
|
2018-01-23 20:41:28 +00:00
|
|
|
console.log(error)
|
2018-02-24 19:33:31 +00:00
|
|
|
return swal('An error occurred', 'There was an error with the request, please check the console for more information.', 'error')
|
2018-01-23 20:06:30 +00:00
|
|
|
})
|
|
|
|
}
|
|
|
|
|
|
|
|
upload.prepareUpload = function () {
|
|
|
|
// I think this fits best here because we need to check for a valid token before we can get the albums
|
|
|
|
if (upload.token) {
|
|
|
|
var select = document.getElementById('albumSelect')
|
|
|
|
|
|
|
|
select.addEventListener('change', () => {
|
|
|
|
upload.album = select.value
|
|
|
|
})
|
|
|
|
|
2018-01-24 15:31:23 +00:00
|
|
|
axios.get('api/albums', { headers: { token: upload.token } })
|
2018-01-23 20:06:30 +00:00
|
|
|
.then(res => {
|
|
|
|
var albums = res.data.albums
|
|
|
|
|
|
|
|
// If the user doesn't have any albums we don't really need to display
|
|
|
|
// an album selection
|
|
|
|
if (albums.length === 0) return
|
|
|
|
|
|
|
|
// Loop through the albums and create an option for each album
|
|
|
|
for (var i = 0; i < albums.length; i++) {
|
|
|
|
var opt = document.createElement('option')
|
|
|
|
opt.value = albums[i].id
|
|
|
|
opt.innerHTML = albums[i].name
|
|
|
|
select.appendChild(opt)
|
|
|
|
}
|
|
|
|
// Display the album selection
|
|
|
|
document.getElementById('albumDiv').style.display = 'block'
|
|
|
|
})
|
|
|
|
.catch(e => {
|
2018-01-23 20:41:28 +00:00
|
|
|
console.log(e)
|
2018-02-24 19:33:31 +00:00
|
|
|
return swal('An error occurred', 'There was an error with the request, please check the console for more information.', 'error')
|
2018-01-23 20:06:30 +00:00
|
|
|
})
|
|
|
|
}
|
|
|
|
|
|
|
|
var div = document.createElement('div')
|
|
|
|
div.id = 'dropzone'
|
|
|
|
div.innerHTML = 'Click here or drag and drop files'
|
|
|
|
div.style.display = 'flex'
|
|
|
|
|
|
|
|
document.getElementById('maxFileSize').innerHTML = `Maximum upload size per file is ${upload.maxFileSize}`
|
|
|
|
document.getElementById('loginToUpload').style.display = 'none'
|
|
|
|
|
|
|
|
if (upload.token === undefined) { document.getElementById('loginLinkText').innerHTML = 'Create an account and keep track of your uploads' }
|
|
|
|
|
|
|
|
document.getElementById('uploadContainer').appendChild(div)
|
|
|
|
|
|
|
|
upload.prepareDropzone()
|
|
|
|
}
|
|
|
|
|
|
|
|
upload.prepareDropzone = function () {
|
|
|
|
var previewNode = document.querySelector('#template')
|
|
|
|
previewNode.id = ''
|
|
|
|
var previewTemplate = previewNode.parentNode.innerHTML
|
|
|
|
previewNode.parentNode.removeChild(previewNode)
|
|
|
|
|
|
|
|
var dropzone = new Dropzone('div#dropzone', {
|
2018-01-24 15:31:23 +00:00
|
|
|
url: 'api/upload',
|
2018-01-23 20:06:30 +00:00
|
|
|
paramName: 'files[]',
|
|
|
|
maxFilesize: upload.maxFileSize.slice(0, -2),
|
|
|
|
parallelUploads: 2,
|
|
|
|
uploadMultiple: false,
|
|
|
|
previewsContainer: 'div#uploads',
|
|
|
|
previewTemplate: previewTemplate,
|
|
|
|
createImageThumbnails: false,
|
|
|
|
maxFiles: 1000,
|
|
|
|
autoProcessQueue: true,
|
|
|
|
headers: { token: upload.token },
|
|
|
|
init: function () {
|
|
|
|
upload.myDropzone = this
|
|
|
|
this.on('addedfile', file => {
|
|
|
|
document.getElementById('uploads').style.display = 'block'
|
|
|
|
})
|
|
|
|
// Add the selected albumid, if an album is selected, as a header
|
|
|
|
this.on('sending', (file, xhr) => {
|
|
|
|
if (upload.album) {
|
|
|
|
xhr.setRequestHeader('albumid', upload.album)
|
|
|
|
}
|
|
|
|
})
|
|
|
|
}
|
|
|
|
})
|
|
|
|
|
|
|
|
// Update the total progress bar
|
|
|
|
dropzone.on('uploadprogress', (file, progress) => {
|
|
|
|
file.previewElement.querySelector('.progress').setAttribute('value', progress)
|
|
|
|
file.previewElement.querySelector('.progress').innerHTML = `${progress}%`
|
|
|
|
})
|
|
|
|
|
|
|
|
dropzone.on('success', (file, response) => {
|
|
|
|
// Handle the responseText here. For example, add the text to the preview element:
|
|
|
|
|
|
|
|
if (response.success === false) {
|
|
|
|
var span = document.createElement('span')
|
|
|
|
span.innerHTML = response.description
|
|
|
|
file.previewTemplate.querySelector('.link').appendChild(span)
|
|
|
|
return
|
|
|
|
}
|
|
|
|
|
|
|
|
var a = document.createElement('a')
|
|
|
|
a.href = response.files[0].url
|
|
|
|
a.target = '_blank'
|
|
|
|
a.innerHTML = response.files[0].url
|
|
|
|
file.previewTemplate.querySelector('.link').appendChild(a)
|
|
|
|
|
|
|
|
file.previewTemplate.querySelector('.progress').style.display = 'none'
|
|
|
|
})
|
|
|
|
|
|
|
|
upload.prepareShareX()
|
|
|
|
}
|
|
|
|
|
|
|
|
upload.prepareShareX = function () {
|
|
|
|
if (upload.token) {
|
|
|
|
var sharexElement = document.getElementById('ShareX')
|
|
|
|
var sharexFile = `{\r\n\
|
2018-01-23 18:00:55 +00:00
|
|
|
"Name": "${location.hostname}",\r\n\
|
|
|
|
"DestinationType": "ImageUploader, FileUploader",\r\n\
|
|
|
|
"RequestType": "POST",\r\n\
|
|
|
|
"RequestURL": "${location.origin}/api/upload",\r\n\
|
|
|
|
"FileFormName": "files[]",\r\n\
|
|
|
|
"Headers": {\r\n\
|
|
|
|
"token": "${upload.token}"\r\n\
|
2017-10-06 06:40:06 +00:00
|
|
|
},\r\n\
|
2018-01-23 18:00:55 +00:00
|
|
|
"ResponseType": "Text",\r\n\
|
|
|
|
"URL": "$json:files[0].url$",\r\n\
|
|
|
|
"ThumbnailURL": "$json:files[0].url$"\r\n\
|
2018-01-23 20:06:30 +00:00
|
|
|
}`
|
|
|
|
var sharexBlob = new Blob([sharexFile], { type: 'application/octet-binary' })
|
|
|
|
sharexElement.setAttribute('href', URL.createObjectURL(sharexBlob))
|
|
|
|
sharexElement.setAttribute('download', `${location.hostname}.sxcu`)
|
|
|
|
}
|
|
|
|
}
|
2017-01-17 03:37:54 +00:00
|
|
|
|
2018-01-23 18:00:55 +00:00
|
|
|
// Handle image paste event
|
|
|
|
window.addEventListener('paste', event => {
|
2018-01-23 20:06:30 +00:00
|
|
|
var items = (event.clipboardData || event.originalEvent.clipboardData).items
|
|
|
|
for (var index in items) {
|
|
|
|
var item = items[index]
|
|
|
|
if (item.kind === 'file') {
|
|
|
|
var blob = item.getAsFile()
|
|
|
|
console.log(blob.type)
|
|
|
|
var file = new File([blob], `pasted-image.${blob.type.match(/(?:[^/]*\/)([^;]*)/)[1]}`)
|
|
|
|
file.type = blob.type
|
|
|
|
console.log(file)
|
|
|
|
upload.myDropzone.addFile(file)
|
|
|
|
}
|
|
|
|
}
|
|
|
|
})
|
|
|
|
|
|
|
|
window.onload = function () {
|
|
|
|
upload.checkIfPublic()
|
|
|
|
}
|