/* eslint-disable no-unused-expressions */
/* global swal, axios */
const panel = {
page: undefined,
username: undefined,
token: localStorage.token,
filesView: localStorage.filesView
}
panel.preparePage = () => {
if (!panel.token) {
window.location = 'auth'
}
panel.verifyToken(panel.token, true)
}
panel.verifyToken = (token, reloadOnError) => {
if (reloadOnError === undefined) {
reloadOnError = false
}
axios.post('api/tokens/verify', {
token: token
})
.then(response => {
if (response.data.success === false) {
swal({
title: 'An error occurred',
text: response.data.description,
icon: 'error'
}).then(() => {
if (reloadOnError) {
localStorage.removeItem('token')
location.location = 'auth'
}
})
return
}
axios.defaults.headers.common.token = token
localStorage.token = token
panel.token = token
panel.username = response.data.username
return panel.prepareDashboard()
})
.catch(err => {
console.log(err)
return swal('An error occurred', 'There was an error with the request, please check the console for more information.', 'error')
})
}
panel.prepareDashboard = () => {
panel.page = document.getElementById('page')
document.getElementById('auth').style.display = 'none'
document.getElementById('dashboard').style.display = 'block'
document.getElementById('itemUploads').addEventListener('click', function () {
panel.setActiveMenu(this)
})
document.getElementById('itemManageGallery').addEventListener('click', function () {
panel.setActiveMenu(this)
})
document.getElementById('itemFileLength').addEventListener('click', function () {
panel.setActiveMenu(this)
})
document.getElementById('itemTokens').addEventListener('click', function () {
panel.setActiveMenu(this)
})
document.getElementById('itemPassword').addEventListener('click', function () {
panel.setActiveMenu(this)
})
document.getElementById('itemLogout').innerHTML = `Logout ( ${panel.username} )`
panel.getAlbumsSidebar()
}
panel.logout = () => {
localStorage.removeItem('token')
location.reload('.')
}
panel.closeModal = () => {
document.getElementById('modal').className = 'modal'
}
panel.isLoading = (element, state) => {
if (!element) { return }
if (state && !element.className.includes(' is-loading')) {
element.className += ' is-loading'
} else if (!state && element.className.includes(' is-loading')) {
element.className = element.className.replace(' is-loading', '')
}
}
panel.getUploads = (album, page, element) => {
if (element) { panel.isLoading(element, true) }
if (page === undefined) { page = 0 }
let url = 'api/uploads/' + page
if (album !== undefined) { url = 'api/album/' + album + '/' + page }
axios.get(url).then(response => {
if (response.data.success === false) {
if (response.data.description === 'No token provided') {
return panel.verifyToken(panel.token)
} else {
return swal('An error occurred', response.data.description, 'error')
}
}
let prevPage = 0
let nextPage = page + 1
if (response.data.files.length < 25) { nextPage = page }
if (page > 0) { prevPage = page - 1 }
const pagination = `
`
const listType = `
`
if (panel.filesView === 'thumbs') {
panel.page.innerHTML = `
${pagination}
${listType}
${pagination}
`
const table = document.getElementById('table')
for (const item of response.data.files) {
const div = document.createElement('div')
let displayAlbumOrUser = item.album
if (panel.username === 'root') {
displayAlbumOrUser = ''
if (item.username !== undefined) { displayAlbumOrUser = item.username }
}
div.className = 'image-container column is-narrow'
if (item.thumb !== undefined) {
div.innerHTML = ` `
} else {
div.innerHTML = `.${item.file.split('.').pop()} `
}
div.innerHTML += `
${item.name}
${displayAlbumOrUser ? `${displayAlbumOrUser} – ` : ''}${item.size}
`
table.appendChild(div)
}
} else {
let albumOrUser = 'Album'
if (panel.username === 'root') { albumOrUser = 'User' }
panel.page.innerHTML = `
${pagination}
${listType}
File
${albumOrUser}
Size
Date
${pagination}
`
const table = document.getElementById('table')
for (const item of response.data.files) {
const tr = document.createElement('tr')
let displayAlbumOrUser = item.album
if (panel.username === 'root') {
displayAlbumOrUser = ''
if (item.username !== undefined) { displayAlbumOrUser = item.username }
}
tr.innerHTML = `
${item.file}
${displayAlbumOrUser}
${item.size}
${item.date}
`
table.appendChild(tr)
if (item.thumb) {
tr.addEventListener('click', function (event) {
document.getElementById('modalImage').src = item.thumb
document.getElementById('modal').className += ' is-active'
})
}
}
}
})
.catch(err => {
console.log(err)
return swal('An error occurred', 'There was an error with the request, please check the console for more information.', 'error')
})
}
panel.setFilesView = (view, album, page, element) => {
localStorage.filesView = view
panel.filesView = view
panel.getUploads(album, page, element)
}
panel.deleteFile = (id, album, page) => {
swal({
title: 'Are you sure?',
text: 'You won\'t be able to recover the file!',
icon: 'warning',
dangerMode: true,
buttons: {
cancel: true,
confirm: {
text: 'Yes, delete it!',
closeModal: false
}
}
}).then(value => {
if (!value) { return }
axios.post('api/upload/delete', {
id: id
})
.then(response => {
if (response.data.success === false) {
if (response.data.description === 'No token provided') {
return panel.verifyToken(panel.token)
} else {
return swal('An error occurred', response.data.description, 'error')
}
}
swal('Deleted!', 'The file has been deleted.', 'success')
panel.getUploads(album, page)
})
.catch(err => {
console.log(err)
return swal('An error occurred', 'There was an error with the request, please check the console for more information.', 'error')
})
})
}
panel.getAlbums = () => {
axios.get('api/albums').then(response => {
if (response.data.success === false) {
if (response.data.description === 'No token provided') {
return panel.verifyToken(panel.token)
} else {
return swal('An error occurred', response.data.description, 'error')
}
}
panel.page.innerHTML = `
Create new album
List of albums
Name
Files
Created At
Public link
`
const table = document.getElementById('table')
for (const item of response.data.albums) {
const tr = document.createElement('tr')
tr.innerHTML = `
${item.name}
${item.files}
${item.date}
${item.identifier}
`
table.appendChild(tr)
}
document.getElementById('submitAlbum').addEventListener('click', function () {
panel.submitAlbum(this)
})
})
.catch(err => {
console.log(err)
return swal('An error occurred', 'There was an error with the request, please check the console for more information.', 'error')
})
}
panel.renameAlbum = id => {
swal({
title: 'Rename album',
text: 'New name you want to give the album:',
icon: 'info',
content: {
element: 'input',
attributes: {
placeholder: 'My super album'
}
},
buttons: {
cancel: true,
confirm: {
closeModal: false
}
}
}).then(value => {
if (!value) { return swal.close() }
axios.post('api/albums/rename', {
id: id,
name: value
})
.then(response => {
if (response.data.success === false) {
if (response.data.description === 'No token provided') { return panel.verifyToken(panel.token) } else if (response.data.description === 'Name already in use') { swal.showInputError('That name is already in use!') } else { swal('An error occurred', response.data.description, 'error') }
return
}
swal('Success!', 'Your album was renamed to: ' + value, 'success')
panel.getAlbumsSidebar()
panel.getAlbums()
})
.catch(err => {
console.log(err)
return swal('An error occurred', 'There was an error with the request, please check the console for more information.', 'error')
})
})
}
panel.deleteAlbum = id => {
swal({
title: 'Are you sure?',
text: 'This won\'t delete your files, only the album!',
icon: 'warning',
dangerMode: true,
buttons: {
cancel: true,
confirm: {
text: 'Yes, delete it!',
closeModal: false
}
}
}).then(value => {
if (!value) { return }
axios.post('api/albums/delete', {
id: id
})
.then(response => {
if (response.data.success === false) {
if (response.data.description === 'No token provided') {
return panel.verifyToken(panel.token)
} else {
return swal('An error occurred', response.data.description, 'error')
}
}
swal('Deleted!', 'Your album has been deleted.', 'success')
panel.getAlbumsSidebar()
panel.getAlbums()
})
.catch(err => {
console.log(err)
return swal('An error occurred', 'There was an error with the request, please check the console for more information.', 'error')
})
})
}
panel.submitAlbum = element => {
panel.isLoading(element, true)
axios.post('api/albums', {
name: document.getElementById('albumName').value
})
.then(async response => {
panel.setLoading(element, false)
if (response.data.success === false) {
if (response.data.description === 'No token provided') {
return panel.verifyToken(panel.token)
} else {
return swal('An error occurred', response.data.description, 'error')
}
}
swal('Woohoo!', 'Album was added successfully', 'success')
panel.getAlbumsSidebar()
panel.getAlbums()
})
.catch(err => {
console.log(err)
panel.setLoading(element, false)
return swal('An error occurred', 'There was an error with the request, please check the console for more information.', 'error')
})
}
panel.getAlbumsSidebar = () => {
axios.get('api/albums/sidebar')
.then(response => {
if (response.data.success === false) {
if (response.data.description === 'No token provided') {
return panel.verifyToken(panel.token)
} else {
return swal('An error occurred', response.data.description, 'error')
}
}
const albumsContainer = document.getElementById('albumsContainer')
albumsContainer.innerHTML = ''
if (response.data.albums === undefined) { return }
for (const album of response.data.albums) {
const li = document.createElement('li')
const a = document.createElement('a')
a.id = album.id
a.innerHTML = album.name
a.addEventListener('click', function () {
panel.getAlbum(this)
})
li.appendChild(a)
albumsContainer.appendChild(li)
}
})
.catch(err => {
console.log(err)
return swal('An error occurred', 'There was an error with the request, please check the console for more information.', 'error')
})
}
panel.getAlbum = item => {
panel.setActiveMenu(item)
panel.getUploads(item.id)
}
panel.changeFileLength = () => {
axios.get('api/filelength/config')
.then(response => {
if (response.data.success === false) {
if (response.data.description === 'No token provided') {
return panel.verifyToken(panel.token)
} else {
return swal('An error occurred', response.data.description, 'error')
}
}
panel.page.innerHTML = `
Preferred file name length
Your current file name length:
Default file name length is ${response.data.config.default} characters. ${response.data.config.userChangeable ? `Range allowed for user is ${response.data.config.min} to ${response.data.config.max} characters.` : 'Changing file name length is disabled at the moment.'}
`
document.getElementById('setFileLength').addEventListener('click', function () {
panel.setFileLength(document.getElementById('fileLength').value, this)
})
})
.catch(err => {
console.log(err)
return swal('An error occurred', 'There was an error with the request, please check the console for more information.', 'error')
})
}
panel.setFileLength = (fileLength, element) => {
panel.isLoading(element, true)
axios.post('api/filelength/change', { fileLength })
.then(response => {
panel.isLoading(element, false)
if (response.data.success === false) {
if (response.data.description === 'No token provided') {
return panel.verifyToken(panel.token)
} else {
return swal('An error occurred', response.data.description, 'error')
}
}
swal({
title: 'Woohoo!',
text: 'Your file length was successfully changed.',
icon: 'success'
}).then(() => {
location.reload()
})
})
.catch(err => {
console.log(err)
panel.isLoading(element, false)
return swal('An error occurred', 'There was an error with the request, please check the console for more information.', 'error')
})
}
panel.changeToken = () => {
axios.get('api/tokens')
.then(response => {
if (response.data.success === false) {
if (response.data.description === 'No token provided') {
return panel.verifyToken(panel.token)
} else {
return swal('An error occurred', response.data.description, 'error')
}
}
panel.page.innerHTML = `
Manage your token
`
document.getElementById('getNewToken').addEventListener('click', function () {
panel.getNewToken(this)
})
})
.catch(err => {
console.log(err)
return swal('An error occurred', 'There was an error with the request, please check the console for more information.', 'error')
})
}
panel.getNewToken = element => {
panel.isLoading(element, true)
axios.post('api/tokens/change')
.then(response => {
panel.isLoading(element, false)
if (response.data.success === false) {
if (response.data.description === 'No token provided') {
return panel.verifyToken(panel.token)
} else {
return swal('An error occurred', response.data.description, 'error')
}
}
swal({
title: 'Woohoo!',
text: 'Your token was successfully changed.',
icon: 'success'
}).then(() => {
localStorage.token = response.data.token
location.reload()
})
})
.catch(err => {
console.log(err)
panel.isLoading(element, false)
return swal('An error occurred', 'There was an error with the request, please check the console for more information.', 'error')
})
}
panel.changePassword = () => {
panel.page.innerHTML = `
Change your password
`
document.getElementById('sendChangePassword').addEventListener('click', function () {
if (document.getElementById('password').value === document.getElementById('passwordConfirm').value) {
panel.sendNewPassword(document.getElementById('password').value, this)
} else {
swal({
title: 'Password mismatch!',
text: 'Your passwords do not match, please try again.',
icon: 'error'
}).then(() => {
panel.changePassword()
})
}
})
}
panel.sendNewPassword = (pass, element) => {
panel.isLoading(element, true)
axios.post('api/password/change', { password: pass })
.then(response => {
panel.isLoading(element, false)
if (response.data.success === false) {
if (response.data.description === 'No token provided') {
return panel.verifyToken(panel.token)
} else {
return swal('An error occurred', response.data.description, 'error')
}
}
swal({
title: 'Woohoo!',
text: 'Your password was successfully changed.',
icon: 'success'
}).then(() => {
location.reload()
})
})
.catch(err => {
console.log(err)
panel.isLoading(element, false)
return swal('An error occurred', 'There was an error with the request, please check the console for more information.', 'error')
})
}
panel.setActiveMenu = item => {
const menu = document.getElementById('menu')
const items = menu.getElementsByTagName('a')
for (let i = 0; i < items.length; i++) {
items[i].className = ''
}
item.className = 'is-active'
}
window.onload = () => {
// Add 'no-touch' class to non-touch devices
if (!('ontouchstart' in document.documentElement)) {
document.documentElement.className += ' no-touch'
}
panel.preparePage()
}