mirror of
https://github.com/BobbyWibowo/lolisafe.git
synced 2024-12-15 08:56:21 +00:00
32dd070e49
* Self-host all libs (including but not limited to Font Awesome icons). LICENSE files were properly included as well. * Temporarily disabling error pages. * Added "start" and "pm2" scripts. To be used with "yarn SCRIPT_NAME" or "npm run SCRIPT_NAME". * Added container for the tables in dashboard. On narrow screens, such as phones, users will then have the ability to use horizontal scroll on the tables. * Fixed various resource paths. This should now work properly when not being hosted in root domain (e.i. https://fiery.me/lolisafe/). * Before checking API, the "Running in ..." button will now say "Loading..." instead.
578 lines
18 KiB
JavaScript
578 lines
18 KiB
JavaScript
/* eslint-disable no-unused-expressions */
|
|
/* global swal, axios */
|
|
|
|
let panel = {}
|
|
|
|
panel.page
|
|
panel.username
|
|
panel.token = localStorage.token
|
|
panel.filesView = localStorage.filesView
|
|
|
|
panel.preparePage = function () {
|
|
if (!panel.token) {
|
|
window.location = 'auth'
|
|
}
|
|
panel.verifyToken(panel.token, true)
|
|
}
|
|
|
|
panel.verifyToken = function (token, reloadOnError) {
|
|
if (reloadOnError === undefined) {
|
|
reloadOnError = false
|
|
}
|
|
|
|
axios.post('api/tokens/verify', {
|
|
token: token
|
|
})
|
|
.then(function (response) {
|
|
if (response.data.success === false) {
|
|
swal({
|
|
title: 'An error ocurred',
|
|
text: response.data.description,
|
|
type: 'error'
|
|
}, function () {
|
|
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(function (error) {
|
|
console.log(error)
|
|
return swal('An error ocurred', 'There was an error with the request, please check the console for more information.', 'error')
|
|
})
|
|
}
|
|
|
|
panel.prepareDashboard = function () {
|
|
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('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 = function () {
|
|
localStorage.removeItem('token')
|
|
location.reload('.')
|
|
}
|
|
|
|
panel.getUploads = function (album = undefined, page = undefined) {
|
|
if (page === undefined) page = 0
|
|
|
|
let url = 'api/uploads/' + page
|
|
if (album !== undefined) { url = 'api/album/' + album + '/' + page }
|
|
|
|
axios.get(url).then(function (response) {
|
|
if (response.data.success === false) {
|
|
if (response.data.description === 'No token provided') return panel.verifyToken(panel.token)
|
|
else return swal('An error ocurred', response.data.description, 'error')
|
|
}
|
|
|
|
var prevPage = 0
|
|
var nextPage = page + 1
|
|
|
|
if (response.data.files.length < 25) { nextPage = page }
|
|
|
|
if (page > 0) prevPage = page - 1
|
|
|
|
panel.page.innerHTML = ''
|
|
var container = document.createElement('div')
|
|
var pagination = `<nav class="pagination is-centered">
|
|
<a class="pagination-previous" onclick="panel.getUploads(${album}, ${prevPage} )">Previous</a>
|
|
<a class="pagination-next" onclick="panel.getUploads(${album}, ${nextPage} )">Next page</a>
|
|
</nav>`
|
|
var listType = `
|
|
<div class="columns">
|
|
<div class="column">
|
|
<a class="button is-small is-outlined is-danger" title="List view" onclick="panel.setFilesView('list', ${album}, ${page})">
|
|
<span class="icon is-small">
|
|
<i class="fa icon-list-bullet"></i>
|
|
</span>
|
|
</a>
|
|
<a class="button is-small is-outlined is-danger" title="List view" onclick="panel.setFilesView('thumbs', ${album}, ${page})">
|
|
<span class="icon is-small">
|
|
<i class="fa icon-th-large"></i>
|
|
</span>
|
|
</a>
|
|
</div>
|
|
</div>`
|
|
|
|
var table, item
|
|
if (panel.filesView === 'thumbs') {
|
|
container.innerHTML = `
|
|
${pagination}
|
|
<hr>
|
|
${listType}
|
|
<div class="columns is-multiline is-mobile" id="table">
|
|
|
|
</div>
|
|
${pagination}
|
|
`
|
|
|
|
panel.page.appendChild(container)
|
|
table = document.getElementById('table')
|
|
|
|
for (item of response.data.files) {
|
|
var div = document.createElement('div')
|
|
div.className = 'column is-2'
|
|
if (item.thumb !== undefined) {
|
|
div.innerHTML = `<a href="${item.file}" target="_blank"><img src="${item.thumb}"/></a>`
|
|
} else {
|
|
div.innerHTML = `<a href="${item.file}" target="_blank"><h1 class="title">.${item.file.split('.').pop()}</h1></a>`
|
|
}
|
|
table.appendChild(div)
|
|
}
|
|
} else {
|
|
var albumOrUser = 'Album'
|
|
if (panel.username === 'root') { albumOrUser = 'User' }
|
|
|
|
container.innerHTML = `
|
|
${pagination}
|
|
<hr>
|
|
${listType}
|
|
<div class="table-container">
|
|
<table class="table is-striped is-narrow is-left">
|
|
<thead>
|
|
<tr>
|
|
<th>File</th>
|
|
<th>${albumOrUser}</th>
|
|
<th>Date</th>
|
|
<th></th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="table">
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<hr>
|
|
${pagination}
|
|
`
|
|
|
|
panel.page.appendChild(container)
|
|
table = document.getElementById('table')
|
|
|
|
for (item of response.data.files) {
|
|
var tr = document.createElement('tr')
|
|
|
|
var displayAlbumOrUser = item.album
|
|
console.log(item)
|
|
if (panel.username === 'root') {
|
|
displayAlbumOrUser = ''
|
|
if (item.username !== undefined) { displayAlbumOrUser = item.username }
|
|
}
|
|
|
|
tr.innerHTML = `
|
|
<tr>
|
|
<th><a href="${item.file}" target="_blank">${item.file}</a></th>
|
|
<th>${displayAlbumOrUser}</th>
|
|
<td>${item.date}</td>
|
|
<td>
|
|
<a class="button is-small is-danger is-outlined" title="Delete album" onclick="panel.deleteFile(${item.id})">
|
|
<span class="icon is-small">
|
|
<i class="fa icon-trash"></i>
|
|
</span>
|
|
</a>
|
|
</td>
|
|
</tr>
|
|
`
|
|
|
|
table.appendChild(tr)
|
|
}
|
|
}
|
|
})
|
|
.catch(function (error) {
|
|
console.log(error)
|
|
return swal('An error ocurred', 'There was an error with the request, please check the console for more information.', 'error')
|
|
})
|
|
}
|
|
|
|
panel.setFilesView = function (view, album, page) {
|
|
localStorage.filesView = view
|
|
panel.filesView = view
|
|
panel.getUploads(album, page)
|
|
}
|
|
|
|
panel.deleteFile = function (id) {
|
|
swal({
|
|
title: 'Are you sure?',
|
|
text: 'You wont be able to recover the file!',
|
|
type: 'warning',
|
|
showCancelButton: true,
|
|
confirmButtonColor: '#ff3860',
|
|
confirmButtonText: 'Yes, delete it!',
|
|
closeOnConfirm: false
|
|
},
|
|
function () {
|
|
axios.post('api/upload/delete', {
|
|
id: id
|
|
})
|
|
.then(function (response) {
|
|
if (response.data.success === false) {
|
|
if (response.data.description === 'No token provided') return panel.verifyToken(panel.token)
|
|
else return swal('An error ocurred', response.data.description, 'error')
|
|
}
|
|
|
|
swal('Deleted!', 'The file has been deleted.', 'success')
|
|
panel.getUploads()
|
|
})
|
|
.catch(function (error) {
|
|
console.log(error)
|
|
return swal('An error ocurred', 'There was an error with the request, please check the console for more information.', 'error')
|
|
})
|
|
}
|
|
)
|
|
}
|
|
|
|
panel.getAlbums = function () {
|
|
axios.get('api/albums').then(function (response) {
|
|
if (response.data.success === false) {
|
|
if (response.data.description === 'No token provided') return panel.verifyToken(panel.token)
|
|
else return swal('An error ocurred', response.data.description, 'error')
|
|
}
|
|
|
|
panel.page.innerHTML = ''
|
|
var container = document.createElement('div')
|
|
container.className = 'container'
|
|
container.innerHTML = `
|
|
<h2 class="subtitle">Create new album</h2>
|
|
|
|
<p class="control has-addons has-addons-centered">
|
|
<input id="albumName" class="input" type="text" placeholder="Name">
|
|
<a id="submitAlbum" class="button is-primary">Submit</a>
|
|
</p>
|
|
|
|
<h2 class="subtitle">List of albums</h2>
|
|
|
|
<table class="table is-striped is-narrow">
|
|
<thead>
|
|
<tr>
|
|
<th>Name</th>
|
|
<th>Files</th>
|
|
<th>Created At</th>
|
|
<th>Public link</th>
|
|
<th></th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="table">
|
|
</tbody>
|
|
</table>`
|
|
|
|
panel.page.appendChild(container)
|
|
var table = document.getElementById('table')
|
|
|
|
for (var item of response.data.albums) {
|
|
var tr = document.createElement('tr')
|
|
tr.innerHTML = `
|
|
<tr>
|
|
<th>${item.name}</th>
|
|
<th>${item.files}</th>
|
|
<td>${item.date}</td>
|
|
<td><a href="${item.identifier}" target="_blank">Album link</a></td>
|
|
<td>
|
|
<a class="button is-small is-primary is-outlined" title="Edit name" onclick="panel.renameAlbum(${item.id})">
|
|
<span class="icon is-small">
|
|
<i class="fa icon-pencil"></i>
|
|
</span>
|
|
</a>
|
|
<a class="button is-small is-danger is-outlined" title="Delete album" onclick="panel.deleteAlbum(${item.id})">
|
|
<span class="icon is-small">
|
|
<i class="fa icon-trash"></i>
|
|
</span>
|
|
</a>
|
|
</td>
|
|
</tr>
|
|
`
|
|
|
|
table.appendChild(tr)
|
|
}
|
|
|
|
document.getElementById('submitAlbum').addEventListener('click', function () {
|
|
panel.submitAlbum()
|
|
})
|
|
})
|
|
.catch(function (error) {
|
|
console.log(error)
|
|
return swal('An error ocurred', 'There was an error with the request, please check the console for more information.', 'error')
|
|
})
|
|
}
|
|
|
|
panel.renameAlbum = function (id) {
|
|
swal({
|
|
title: 'Rename album',
|
|
text: 'New name you want to give the album:',
|
|
type: 'input',
|
|
showCancelButton: true,
|
|
closeOnConfirm: false,
|
|
animation: 'slide-from-top',
|
|
inputPlaceholder: 'My super album'
|
|
}, function (inputValue) {
|
|
if (inputValue === false) return false
|
|
if (inputValue === '') {
|
|
swal.showInputError('You need to write something!')
|
|
return false
|
|
}
|
|
|
|
axios.post('api/albums/rename', {
|
|
id: id,
|
|
name: inputValue
|
|
})
|
|
.then(function (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 ocurred', response.data.description, 'error')
|
|
return
|
|
}
|
|
|
|
swal('Success!', 'Your album was renamed to: ' + inputValue, 'success')
|
|
panel.getAlbumsSidebar()
|
|
panel.getAlbums()
|
|
})
|
|
.catch(function (error) {
|
|
console.log(error)
|
|
return swal('An error ocurred', 'There was an error with the request, please check the console for more information.', 'error')
|
|
})
|
|
})
|
|
}
|
|
|
|
panel.deleteAlbum = function (id) {
|
|
swal({
|
|
title: 'Are you sure?',
|
|
text: "This won't delete your files, only the album!",
|
|
type: 'warning',
|
|
showCancelButton: true,
|
|
confirmButtonColor: '#ff3860',
|
|
confirmButtonText: 'Yes, delete it!',
|
|
closeOnConfirm: false
|
|
},
|
|
function () {
|
|
axios.post('api/albums/delete', {
|
|
id: id
|
|
})
|
|
.then(function (response) {
|
|
if (response.data.success === false) {
|
|
if (response.data.description === 'No token provided') return panel.verifyToken(panel.token)
|
|
else return swal('An error ocurred', response.data.description, 'error')
|
|
}
|
|
|
|
swal('Deleted!', 'Your album has been deleted.', 'success')
|
|
panel.getAlbumsSidebar()
|
|
panel.getAlbums()
|
|
})
|
|
.catch(function (error) {
|
|
console.log(error)
|
|
return swal('An error ocurred', 'There was an error with the request, please check the console for more information.', 'error')
|
|
})
|
|
}
|
|
)
|
|
}
|
|
|
|
panel.submitAlbum = function () {
|
|
axios.post('api/albums', {
|
|
name: document.getElementById('albumName').value
|
|
})
|
|
.then(function (response) {
|
|
if (response.data.success === false) {
|
|
if (response.data.description === 'No token provided') return panel.verifyToken(panel.token)
|
|
else return swal('An error ocurred', response.data.description, 'error')
|
|
}
|
|
|
|
swal('Woohoo!', 'Album was added successfully', 'success')
|
|
panel.getAlbumsSidebar()
|
|
panel.getAlbums()
|
|
})
|
|
.catch(function (error) {
|
|
console.log(error)
|
|
return swal('An error ocurred', 'There was an error with the request, please check the console for more information.', 'error')
|
|
})
|
|
}
|
|
|
|
panel.getAlbumsSidebar = function () {
|
|
axios.get('api/albums/sidebar')
|
|
.then(function (response) {
|
|
if (response.data.success === false) {
|
|
if (response.data.description === 'No token provided') return panel.verifyToken(panel.token)
|
|
else return swal('An error ocurred', response.data.description, 'error')
|
|
}
|
|
|
|
var albumsContainer = document.getElementById('albumsContainer')
|
|
albumsContainer.innerHTML = ''
|
|
|
|
if (response.data.albums === undefined) return
|
|
|
|
var li, a
|
|
for (var album of response.data.albums) {
|
|
li = document.createElement('li')
|
|
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(function (error) {
|
|
console.log(error)
|
|
return swal('An error ocurred', 'There was an error with the request, please check the console for more information.', 'error')
|
|
})
|
|
}
|
|
|
|
panel.getAlbum = function (item) {
|
|
panel.setActiveMenu(item)
|
|
panel.getUploads(item.id)
|
|
}
|
|
|
|
panel.changeToken = function () {
|
|
axios.get('api/tokens')
|
|
.then(function (response) {
|
|
if (response.data.success === false) {
|
|
if (response.data.description === 'No token provided') return panel.verifyToken(panel.token)
|
|
else return swal('An error ocurred', response.data.description, 'error')
|
|
}
|
|
|
|
panel.page.innerHTML = ''
|
|
var container = document.createElement('div')
|
|
container.className = 'container'
|
|
container.innerHTML = `
|
|
<h2 class="subtitle">Manage your token</h2>
|
|
|
|
<label class="label">Your current token:</label>
|
|
<p class="control has-addons">
|
|
<input id="token" readonly class="input is-expanded" type="text" placeholder="Your token" value="${response.data.token}">
|
|
<a id="getNewToken" class="button is-primary">Request new token</a>
|
|
</p>
|
|
`
|
|
|
|
panel.page.appendChild(container)
|
|
|
|
document.getElementById('getNewToken').addEventListener('click', function () {
|
|
panel.getNewToken()
|
|
})
|
|
})
|
|
.catch(function (error) {
|
|
console.log(error)
|
|
return swal('An error ocurred', 'There was an error with the request, please check the console for more information.', 'error')
|
|
})
|
|
}
|
|
|
|
panel.getNewToken = function () {
|
|
axios.post('api/tokens/change')
|
|
.then(function (response) {
|
|
if (response.data.success === false) {
|
|
if (response.data.description === 'No token provided') return panel.verifyToken(panel.token)
|
|
else return swal('An error ocurred', response.data.description, 'error')
|
|
}
|
|
|
|
swal({
|
|
title: 'Woohoo!',
|
|
text: 'Your token was changed successfully.',
|
|
type: 'success'
|
|
}, function () {
|
|
localStorage.token = response.data.token
|
|
location.reload()
|
|
})
|
|
})
|
|
.catch(function (error) {
|
|
console.log(error)
|
|
return swal('An error ocurred', 'There was an error with the request, please check the console for more information.', 'error')
|
|
})
|
|
}
|
|
|
|
panel.changePassword = function () {
|
|
panel.page.innerHTML = ''
|
|
var container = document.createElement('div')
|
|
container.className = 'container'
|
|
container.innerHTML = `
|
|
<h2 class="subtitle">Change your password</h2>
|
|
|
|
<label class="label">New password:</label>
|
|
<p class="control has-addons">
|
|
<input id="password" class="input is-expanded" type="password" placeholder="Your new password">
|
|
</p>
|
|
<label class="label">Confirm password:</label>
|
|
<p class="control has-addons">
|
|
<input id="passwordConfirm" class="input is-expanded" type="password" placeholder="Verify your new password">
|
|
<a id="sendChangePassword" class="button is-primary">Set new password</a>
|
|
</p>
|
|
`
|
|
|
|
panel.page.appendChild(container)
|
|
|
|
document.getElementById('sendChangePassword').addEventListener('click', function () {
|
|
if (document.getElementById('password').value === document.getElementById('passwordConfirm').value) {
|
|
panel.sendNewPassword(document.getElementById('password').value)
|
|
} else {
|
|
swal({
|
|
title: 'Password mismatch!',
|
|
text: 'Your passwords do not match, please try again.',
|
|
type: 'error'
|
|
}, function () {
|
|
panel.changePassword()
|
|
})
|
|
}
|
|
})
|
|
}
|
|
|
|
panel.sendNewPassword = function (pass) {
|
|
axios.post('api/password/change', {password: pass})
|
|
.then(function (response) {
|
|
if (response.data.success === false) {
|
|
if (response.data.description === 'No token provided') return panel.verifyToken(panel.token)
|
|
else return swal('An error ocurred', response.data.description, 'error')
|
|
}
|
|
|
|
swal({
|
|
title: 'Woohoo!',
|
|
text: 'Your password was changed successfully.',
|
|
type: 'success'
|
|
}, function () {
|
|
location.reload()
|
|
})
|
|
})
|
|
.catch(function (error) {
|
|
console.log(error)
|
|
return swal('An error ocurred', 'There was an error with the request, please check the console for more information.', 'error')
|
|
})
|
|
}
|
|
|
|
panel.setActiveMenu = function (item) {
|
|
var menu = document.getElementById('menu')
|
|
var items = menu.getElementsByTagName('a')
|
|
for (var i = 0; i < items.length; i++) { items[i].className = '' }
|
|
|
|
item.className = 'is-active'
|
|
}
|
|
|
|
window.onload = function () {
|
|
panel.preparePage()
|
|
}
|