Mirror/filesafe
1
0
Fork 0
mirror of https://github.com/BobbyWibowo/lolisafe.git synced 2025-01-08 12:51:34 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Updates

Browse Source 
* Updated Bulma to 0.6.2. Text will look slightly bigger in general now. I may change that in the future.

* Updated SweetAlert to 2.1.0.

* A bunch of other updates to make it compatible with the updated Bulma and SweetAlert.
This commit is contained in:
Bobby Wibowo 2018-03-19 23:51:39 +07:00
parent 288795c6e3
commit c96f5b0a33
No known key found for this signature in database
GPG Key ID: 51C3A1E1E22D26CF
13 changed files with 415 additions and 337 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
pages/album.html
View File

@ -5,15 +5,14 @@
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta name="description" content="A pomf-like file uploading service that doesn't suck."> <meta name="description" content="A pomf-like file uploading service that doesn't suck.">
<meta name="keywords" content="upload,lolisafe,file,images,hosting,bobby,fiery"> <meta name="keywords" content="upload,lolisafe,file,images,hosting,bobby,fiery">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>safe.fiery.me &#8211; A small safe worth protecting.</title> <title>safe.fiery.me &#8211; A small safe worth protecting.</title>
<!-- Stylesheets and scripts --> <!-- Stylesheets and scripts -->
<link rel="stylesheet" type="text/css" href="libs/bulma/bulma.min.css"> <link rel="stylesheet" type="text/css" href="libs/bulma/bulma.min.css?v=V2RnA3Mwhh">
<link rel="stylesheet" type="text/css" href="libs/sweetalert/sweetalert.min.css">
<link rel="stylesheet" type="text/css" href="css/style.css"> <link rel="stylesheet" type="text/css" href="css/style.css">
<script type="text/javascript" src="libs/sweetalert/sweetalert.min.js"></script> <script type="text/javascript" src="libs/sweetalert/sweetalert.min.js?v=V2RnA3Mwhh"></script>
<script type="text/javascript" src="libs/axios/axios.min.js"></script> <script type="text/javascript" src="libs/axios/axios.min.js"></script>
<script type="text/javascript" src="js/album.js"></script> <script type="text/javascript" src="js/album.js"></script>

49
pages/auth.html
View File

@ -5,16 +5,15 @@
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta name="description" content="A pomf-like file uploading service that doesn't suck."> <meta name="description" content="A pomf-like file uploading service that doesn't suck.">
<meta name="keywords" content="upload,lolisafe,file,images,hosting,bobby,fiery"> <meta name="keywords" content="upload,lolisafe,file,images,hosting,bobby,fiery">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>safe.fiery.me &#8211; A small safe worth protecting.</title> <title>safe.fiery.me &#8211; A small safe worth protecting.</title>
<!-- Stylesheets and scripts --> <!-- Stylesheets and scripts -->
<link rel="stylesheet" type="text/css" href="libs/bulma/bulma.min.css"> <link rel="stylesheet" type="text/css" href="libs/bulma/bulma.min.css?v=V2RnA3Mwhh">
<link rel="stylesheet" type="text/css" href="libs/sweetalert/sweetalert.min.css">
<link rel="stylesheet" type="text/css" href="libs/fontello/fontello.css"> <link rel="stylesheet" type="text/css" href="libs/fontello/fontello.css">
<link rel="stylesheet" type="text/css" href="css/style.css"> <link rel="stylesheet" type="text/css" href="css/style.css">
<script type="text/javascript" src="libs/sweetalert/sweetalert.min.js"></script> <script type="text/javascript" src="libs/sweetalert/sweetalert.min.js?v=V2RnA3Mwhh"></script>
<script type="text/javascript" src="libs/axios/axios.min.js"></script> <script type="text/javascript" src="libs/axios/axios.min.js"></script>
<script type="text/javascript" src="js/auth.js"></script> <script type="text/javascript" src="js/auth.js"></script>
@ -64,33 +63,35 @@
<section id='login' class="hero is-fullheight"> <section id='login' class="hero is-fullheight">
<div class="hero-body"> <div class="hero-body">
<div class="container"> <div class="container">
<div class="columns is-centered">
<div class="column is-one-quarter is-hidden-mobile"></div>
<div class="column">
<h1 class="title"> <h1 class="title">
Dashboard Access Dashboard Access
</h1> </h1>
<h2 class="subtitle"> <h2 class="subtitle">
Login or register Login or register
</h2> </h2>
<div class="columns"> <div class="field">
<div class="column"> <div class="control">
<p class="control"> <input id="user" class="input" type="text" onkeypress="page.onkeypress(event, this)" placeholder="Your username">
<input id='user' class="input" type="text" placeholder="Your username">
</p>
<p class="control">
<input id='pass' class="input" type="password" placeholder="Your password">
</p>
<p class="control has-addons is-pulled-right">
<a class="button" id='registerBtn' onclick="page.do('register')">
<span>Register</span>
</a>
<a class="button" id='loginBtn' onclick="page.do('login')">
<span>Log in</span>
</a>
</p>
</div> </div>
<div class="column is-hidden-mobile"></div> </div>
<div class="column is-hidden-mobile"></div> <div class="field">
<div class="control">
<input id="pass" class="input" type="password" onkeypress="page.onkeypress(event, this)" placeholder="Your password">
</div>
</div>
<div class="field is-grouped is-grouped-right">
<div class="control">
<a id="registerBtn" class="button" onclick="page.do('register')">Register</a>
</div>
<div class="control">
<a id="loginBtn" class="button" onclick="page.do('login')">Log in</a>
</div>
</div>
</div>
<div class="column is-one-quarter is-hidden-mobile"></div>
</div> </div>
</div> </div>
</div> </div>

48
pages/dashboard.html
View File

@ -5,17 +5,16 @@
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta name="description" content="A pomf-like file uploading service that doesn't suck."> <meta name="description" content="A pomf-like file uploading service that doesn't suck.">
<meta name="keywords" content="upload,lolisafe,file,images,hosting,bobby,fiery"> <meta name="keywords" content="upload,lolisafe,file,images,hosting,bobby,fiery">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>safe.fiery.me &#8211; A small safe worth protecting.</title> <title>safe.fiery.me &#8211; A small safe worth protecting.</title>
<!-- Stylesheets and scripts --> <!-- Stylesheets and scripts -->
<link rel="stylesheet" type="text/css" href="libs/bulma/bulma.min.css"> <link rel="stylesheet" type="text/css" href="libs/bulma/bulma.min.css?v=V2RnA3Mwhh">
<link rel="stylesheet" type="text/css" href="libs/sweetalert/sweetalert.min.css">
<link rel="stylesheet" type="text/css" href="libs/fontello/fontello.css"> <link rel="stylesheet" type="text/css" href="libs/fontello/fontello.css">
<link rel="stylesheet" type="text/css" href="css/style.css"> <link rel="stylesheet" type="text/css" href="css/style.css">
<link rel="stylesheet" type="text/css" href="css/dashboard.css"> <link rel="stylesheet" type="text/css" href="css/dashboard.css">
<script type="text/javascript" src="libs/sweetalert/sweetalert.min.js"></script> <script type="text/javascript" src="libs/sweetalert/sweetalert.min.js?v=V2RnA3Mwhh"></script>
<script type="text/javascript" src="libs/axios/axios.min.js"></script> <script type="text/javascript" src="libs/axios/axios.min.js"></script>
<script type="text/javascript" src="js/dashboard.js"></script> <script type="text/javascript" src="js/dashboard.js"></script>
@ -73,39 +72,58 @@
</section> </section>
<section id='dashboard' class="section"> <section id="dashboard" class="section">
<div id="panel" class="container"> <div id="panel" class="container">
<h1 class="title">Dashboard</h1>
<h2 class="subtitle">A simple <strong>dashboard</strong>, to sort your uploaded stuff</h2> <h1 class="title">
Dashboard
</h1>
<h1 class="subtitle">
A simple <strong>dashboard</strong>, to sort your uploaded stuff
</h1>
<hr> <hr>
<div class="columns"> <div class="columns">
<div class="column is-3"> <div class="column is-one-quarter">
<aside class="menu" id="menu"> <aside class="menu" id="menu">
<p class="menu-label">General</p> <p class="menu-label">General</p>
<ul class="menu-list"> <ul class="menu-list">
<li><a href=".">Frontpage</a></li> <li>
<li><a id="itemUploads" onclick="panel.getUploads()">Uploads</a></li> <a href=".">Frontpage</a>
</li>
<li>
<a id="itemUploads" onclick="panel.getUploads()">Uploads</a>
</li>
</ul> </ul>
<p class="menu-label">Albums</p> <p class="menu-label">Albums</p>
<ul class="menu-list"> <ul class="menu-list">
<li><a id="itemManageGallery" onclick="panel.getAlbums()">Manage your albums</a></li> <li>
<a id="itemManageGallery" onclick="panel.getAlbums()">Manage your albums</a>
</li>
<li> <li>
<ul id='albumsContainer'></ul> <ul id='albumsContainer'></ul>
</li> </li>
</ul> </ul>
<p class="menu-label">Administration</p> <p class="menu-label">Administration</p>
<ul class="menu-list"> <ul class="menu-list">
<li><a id="itemTokens" onclick="panel.changeToken()">Change your token</a></li> <li>
<li><a id="itemPassword" onclick="panel.changePassword()">Change your password</a></li> <a id="itemTokens" onclick="panel.changeToken()">Change your token</a>
<li><a id="itemLogout"onclick="panel.logout()">Logout</a></li> </li>
<li>
<a id="itemPassword" onclick="panel.changePassword()">Change your password</a>
</li>
<li>
<a id="itemLogout" onclick="panel.logout()">Logout</a>
</li>
</ul> </ul>
</aside> </aside>
</div> </div>
<div class="column has-text-centered" id='page'> <div class="column has-text-centered is-third-quarters" id='page'>
<img src="images/logo.png"> <img src="images/logo.png">
</div> </div>
</div> </div>
</div> </div>
</section> </section>

4
pages/faq.html
View File

@ -5,12 +5,12 @@
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta name="description" content="A pomf-like file uploading service that doesn't suck."> <meta name="description" content="A pomf-like file uploading service that doesn't suck.">
<meta name="keywords" content="upload,lolisafe,file,images,hosting,bobby,fiery"> <meta name="keywords" content="upload,lolisafe,file,images,hosting,bobby,fiery">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>safe.fiery.me &#8211; A small safe worth protecting.</title> <title>safe.fiery.me &#8211; A small safe worth protecting.</title>
<!-- Stylesheets and scripts --> <!-- Stylesheets and scripts -->
<link rel="stylesheet" type="text/css" href="libs/bulma/bulma.min.css"> <link rel="stylesheet" type="text/css" href="libs/bulma/bulma.min.css?v=V2RnA3Mwhh">
<link rel="stylesheet" type="text/css" href="css/style.css"> <link rel="stylesheet" type="text/css" href="css/style.css">
<!-- Open Graph tags --> <!-- Open Graph tags -->

9
pages/home.html
View File

@ -5,15 +5,14 @@
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta name="description" content="A pomf-like file uploading service that doesn't suck."> <meta name="description" content="A pomf-like file uploading service that doesn't suck.">
<meta name="keywords" content="upload,lolisafe,file,images,hosting,bobby,fiery"> <meta name="keywords" content="upload,lolisafe,file,images,hosting,bobby,fiery">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>safe.fiery.me &#8211; A small safe worth protecting.</title> <title>safe.fiery.me &#8211; A small safe worth protecting.</title>
<!-- Stylesheets and scripts --> <!-- Stylesheets and scripts -->
<link rel="stylesheet" type="text/css" href="libs/bulma/bulma.min.css"> <link rel="stylesheet" type="text/css" href="libs/bulma/bulma.min.css?v=V2RnA3Mwhh">
<link rel="stylesheet" type="text/css" href="libs/sweetalert/sweetalert.min.css">
<link rel="stylesheet" type="text/css" href="css/style.css"> <link rel="stylesheet" type="text/css" href="css/style.css">
<script type="text/javascript" src="libs/sweetalert/sweetalert.min.js"></script> <script type="text/javascript" src="libs/sweetalert/sweetalert.min.js?v=V2RnA3Mwhh"></script>
<script type="text/javascript" src="libs/dropzone/dropzone.min.js"></script> <script type="text/javascript" src="libs/dropzone/dropzone.min.js"></script>
<script type="text/javascript" src="libs/axios/axios.min.js"></script> <script type="text/javascript" src="libs/axios/axios.min.js"></script>
<script type="text/javascript" src="js/home.js"></script> <script type="text/javascript" src="js/home.js"></script>
@ -95,7 +94,7 @@
<h3 class="subtitle"><a href="auth" id="loginLinkText"></a></h3> <h3 class="subtitle"><a href="auth" id="loginLinkText"></a></h3>
<h3 id="links"> <h3 id="links">
<a href="https://fiery.me" class="is-danger">Home</a><span>|</span><a href="https://blog.fiery.me" class="is-danger">Blog</a><span>|</span><a id="ShareX" href="https://safe.fiery.me/sharex.txt">ShareX</a><span>|</span><a href="faq" class="is-danger">FAQ</a><span>|</span><a href="auth" class="is-danger">Dashboard</a><span>|</span><a href="https://github.com/BobbyWibowo/lolisafe" target="_blank" class="is-danger">View on GitHub</a> <a href="https://fiery.me" class="is-danger">Home</a><span>|</span><a href="https://blog.fiery.me" class="is-danger">Blog</a><span>|</span><a id="ShareX" href="https://safe.fiery.me/sharex.txt">ShareX</a><span>|</span><a href="faq" class="is-danger">FAQ</a><span>|</span><a href="auth" class="is-danger">Dashboard</a><span>|</span><a href="https://github.com/BobbyWibowo/lolisafe" target="_blank" class="is-danger">GitHub</a>
</h3> </h3>
</div> </div>

52
public/css/style.css
View File

@ -78,6 +78,7 @@ section#home div#uploads { margin-bottom: 25px; }
PANEL PANEL
------------------ */ ------------------ */
/*
section#login input, section#login p.control a.button { section#login input, section#login p.control a.button {
border-left: 0px; border-left: 0px;
border-top: 0px; border-top: 0px;
@ -89,7 +90,7 @@ section#login input, section#login p.control a.button {
section#login p.control a.button { margin-left: 10px; } section#login p.control a.button { margin-left: 10px; }
section#login p.control a#loginBtn { border-right: 0px; } section#login p.control a#loginBtn { border-right: 0px; }
section#login p.control a#registerBtn { border-left: 0px; } section#login p.control a#registerBtn { border-left: 0px; }
*/
section#auth, section#dashboard { display: none } section#auth, section#dashboard { display: none }
section#auth input { background: rgba(0, 0, 0, 0); } section#auth input { background: rgba(0, 0, 0, 0); }
@ -138,11 +139,11 @@ a:hover {
color: #3daee9; color: #3daee9;
} }
section#home h3#links span { #home #links span {
color: #898b8d; color: #898b8d;
} }
section#home #b { #home #b {
width: 200px; width: 200px;
height: 200px; height: 200px;
border-radius: 100%; border-radius: 100%;
@ -155,3 +156,48 @@ hr {
.table-container { .table-container {
overflow-x: auto; overflow-x: auto;
} }
/*
.textarea, .input {
border-width: 2px;
}
*/
#login .input {
border-top: 0;
border-right: 0;
border-left: 0;
border-radius: 0;
padding-right: calc(0.75em + 1px);
padding-left: calc(0.75em + 1px);
}
#login .control .button {
border-radius: 0;
}
.input.is-active, .input.is-focused, .input:active, .input:focus, .textarea.is-active, .textarea.is-focused, .textarea:active, .textarea:focus {
border-color: #2980b9;
}
.button.is-danger {
background-color: #da4453;
}
.button.is-danger.is-hovered, .button.is-danger:hover {
background-color: #3daee9;
}
/*
.table.is-striped tbody tr:not(.is-selected):nth-child(2n) {
background-color: #383c41;
}
*/
.table.is-hoverable tbody tr:not(.is-selected):hover {
background-color: #4d4d4d;
}
.table td, .table th {
vertical-align: middle;
}

6
public/js/auth.js
View File

@ -31,6 +31,12 @@ page.do = function (dest) {
}) })
} }
page.onkeypress = function (event, element) {
event = event || window.event
if (!event) return
if (event.keyCode === 13 || event.which === 13) return this.do('login')
}
page.verify = function () { page.verify = function () {
page.token = localStorage.token page.token = localStorage.token
if (page.token === undefined) return if (page.token === undefined) return

175
public/js/dashboard.js
View File

@ -28,8 +28,8 @@ panel.verifyToken = function (token, reloadOnError) {
swal({ swal({
title: 'An error occurred', title: 'An error occurred',
text: response.data.description, text: response.data.description,
type: 'error' icon: 'error'
}, function () { }).then(() => {
if (reloadOnError) { if (reloadOnError) {
localStorage.removeItem('token') localStorage.removeItem('token')
location.location = 'auth' location.location = 'auth'
@ -100,12 +100,12 @@ panel.getUploads = function (album = undefined, page = undefined) {
if (page > 0) prevPage = page - 1 if (page > 0) prevPage = page - 1
panel.page.innerHTML = '' var pagination = `
var container = document.createElement('div') <nav class="pagination is-centered">
var pagination = `<nav class="pagination is-centered">
<a class="pagination-previous" onclick="panel.getUploads(${album}, ${prevPage} )">Previous</a> <a class="pagination-previous" onclick="panel.getUploads(${album}, ${prevPage} )">Previous</a>
<a class="pagination-next" onclick="panel.getUploads(${album}, ${nextPage} )">Next page</a> <a class="pagination-next" onclick="panel.getUploads(${album}, ${nextPage} )">Next page</a>
</nav>` </nav>
`
var listType = ` var listType = `
<div class="columns"> <div class="columns">
<div class="column"> <div class="column">
@ -120,11 +120,12 @@ panel.getUploads = function (album = undefined, page = undefined) {
</span> </span>
</a> </a>
</div> </div>
</div>` </div>
`
var table, item var table, item
if (panel.filesView === 'thumbs') { if (panel.filesView === 'thumbs') {
container.innerHTML = ` panel.page.innerHTML = `
${pagination} ${pagination}
<hr> <hr>
${listType} ${listType}
@ -134,7 +135,6 @@ panel.getUploads = function (album = undefined, page = undefined) {
${pagination} ${pagination}
` `
panel.page.appendChild(container)
table = document.getElementById('table') table = document.getElementById('table')
for (item of response.data.files) { for (item of response.data.files) {
@ -151,12 +151,12 @@ panel.getUploads = function (album = undefined, page = undefined) {
var albumOrUser = 'Album' var albumOrUser = 'Album'
if (panel.username === 'root') { albumOrUser = 'User' } if (panel.username === 'root') { albumOrUser = 'User' }
container.innerHTML = ` panel.page.innerHTML = `
${pagination} ${pagination}
<hr> <hr>
${listType} ${listType}
<div class="table-container"> <div class="table-container">
<table class="table is-striped is-narrow is-left"> <table class="table is-narrow is-fullwidth is-hoverable">
<thead> <thead>
<tr> <tr>
<th>File</th> <th>File</th>
@ -173,7 +173,6 @@ panel.getUploads = function (album = undefined, page = undefined) {
${pagination} ${pagination}
` `
panel.page.appendChild(container)
table = document.getElementById('table') table = document.getElementById('table')
for (item of response.data.files) { for (item of response.data.files) {
@ -221,13 +220,17 @@ panel.deleteFile = function (id) {
swal({ swal({
title: 'Are you sure?', title: 'Are you sure?',
text: 'You wont be able to recover the file!', text: 'You wont be able to recover the file!',
type: 'warning', icon: 'warning',
showCancelButton: true, dangerMode: true,
confirmButtonColor: '#ff3860', buttons: {
confirmButtonText: 'Yes, delete it!', cancel: true,
closeOnConfirm: false confirm: {
}, text: 'Yes, delete it!',
function () { closeModal: false
}
}
}).then(value => {
if (!value) return
axios.post('api/upload/delete', { axios.post('api/upload/delete', {
id: id id: id
}) })
@ -244,8 +247,7 @@ panel.deleteFile = function (id) {
console.log(error) console.log(error)
return swal('An error occurred', 'There was an error with the request, please check the console for more information.', 'error') return swal('An error occurred', 'There was an error with the request, please check the console for more information.', 'error')
}) })
} })
)
} }
panel.getAlbums = function () { panel.getAlbums = function () {
@ -255,20 +257,22 @@ panel.getAlbums = function () {
else return swal('An error occurred', response.data.description, 'error') else return swal('An error occurred', response.data.description, 'error')
} }
panel.page.innerHTML = '' panel.page.innerHTML = `
var container = document.createElement('div')
container.className = 'container'
container.innerHTML = `
<h2 class="subtitle">Create new album</h2> <h2 class="subtitle">Create new album</h2>
<p class="control has-addons has-addons-centered"> <div class="field has-addons has-addons-centered">
<div class="control is-expanded">
<input id="albumName" class="input" type="text" placeholder="Name"> <input id="albumName" class="input" type="text" placeholder="Name">
</div>
<div class="control">
<a id="submitAlbum" class="button is-primary">Submit</a> <a id="submitAlbum" class="button is-primary">Submit</a>
</p> </div>
</div>
<h2 class="subtitle">List of albums</h2> <h2 class="subtitle">List of albums</h2>
<table class="table is-striped is-narrow"> <div class="table-container">
<table class="table is-narrow is-fullwidth is-hoverable">
<thead> <thead>
<tr> <tr>
<th>Name</th> <th>Name</th>
@ -280,9 +284,10 @@ panel.getAlbums = function () {
</thead> </thead>
<tbody id="table"> <tbody id="table">
</tbody> </tbody>
</table>` </table>
</div>
`
panel.page.appendChild(container)
var table = document.getElementById('table') var table = document.getElementById('table')
for (var item of response.data.albums) { for (var item of response.data.albums) {
@ -292,7 +297,7 @@ panel.getAlbums = function () {
<th>${item.name}</th> <th>${item.name}</th>
<th>${item.files}</th> <th>${item.files}</th>
<td>${item.date}</td> <td>${item.date}</td>
<td><a href="${item.identifier}" target="_blank">Album link</a></td> <td><a href="${item.identifier}" target="_blank">${item.identifier}</a></td>
<td> <td>
<a class="button is-small is-primary is-outlined" title="Edit name" onclick="panel.renameAlbum(${item.id})"> <a class="button is-small is-primary is-outlined" title="Edit name" onclick="panel.renameAlbum(${item.id})">
<span class="icon is-small"> <span class="icon is-small">
@ -325,21 +330,24 @@ panel.renameAlbum = function (id) {
swal({ swal({
title: 'Rename album', title: 'Rename album',
text: 'New name you want to give the album:', text: 'New name you want to give the album:',
type: 'input', icon: 'info',
showCancelButton: true, content: {
closeOnConfirm: false, element: 'input',
animation: 'slide-from-top', attributes: {
inputPlaceholder: 'My super album' placeholder: 'My super album'
}, function (inputValue) {
if (inputValue === false) return false
if (inputValue === '') {
swal.showInputError('You need to write something!')
return false
} }
},
buttons: {
cancel: true,
confirm: {
closeModal: false
}
}
}).then(value => {
if (!value) return swal.close()
axios.post('api/albums/rename', { axios.post('api/albums/rename', {
id: id, id: id,
name: inputValue name: value
}) })
.then(function (response) { .then(function (response) {
if (response.data.success === false) { if (response.data.success === false) {
@ -349,7 +357,7 @@ panel.renameAlbum = function (id) {
return return
} }
swal('Success!', 'Your album was renamed to: ' + inputValue, 'success') swal('Success!', 'Your album was renamed to: ' + value, 'success')
panel.getAlbumsSidebar() panel.getAlbumsSidebar()
panel.getAlbums() panel.getAlbums()
}) })
@ -363,14 +371,18 @@ panel.renameAlbum = function (id) {
panel.deleteAlbum = function (id) { panel.deleteAlbum = function (id) {
swal({ swal({
title: 'Are you sure?', title: 'Are you sure?',
text: "This won't delete your files, only the album!", text: 'This won\'t delete your files, only the album!',
type: 'warning', icon: 'warning',
showCancelButton: true, dangerMode: true,
confirmButtonColor: '#ff3860', buttons: {
confirmButtonText: 'Yes, delete it!', cancel: true,
closeOnConfirm: false confirm: {
}, text: 'Yes, delete it!',
function () { closeModal: false
}
}
}).then(value => {
if (!value) return
axios.post('api/albums/delete', { axios.post('api/albums/delete', {
id: id id: id
}) })
@ -388,8 +400,7 @@ panel.deleteAlbum = function (id) {
console.log(error) console.log(error)
return swal('An error occurred', 'There was an error with the request, please check the console for more information.', 'error') return swal('An error occurred', 'There was an error with the request, please check the console for more information.', 'error')
}) })
} })
)
} }
panel.submitAlbum = function () { panel.submitAlbum = function () {
@ -459,21 +470,22 @@ panel.changeToken = function () {
else return swal('An error occurred', response.data.description, 'error') else return swal('An error occurred', response.data.description, 'error')
} }
panel.page.innerHTML = '' panel.page.innerHTML = `
var container = document.createElement('div')
container.className = 'container'
container.innerHTML = `
<h2 class="subtitle">Manage your token</h2> <h2 class="subtitle">Manage your token</h2>
<div class="field">
<label class="label">Your current token:</label> <label class="label">Your current token:</label>
<p class="control has-addons"> <div class="field has-addons">
<input id="token" readonly class="input is-expanded" type="text" placeholder="Your token" value="${response.data.token}"> <div class="control is-expanded">
<input id="token" readonly class="input" type="text" placeholder="Your token" value="${response.data.token}">
</div>
<div class="control">
<a id="getNewToken" class="button is-primary">Request new token</a> <a id="getNewToken" class="button is-primary">Request new token</a>
</p> </div>
</div>
</div>
` `
panel.page.appendChild(container)
document.getElementById('getNewToken').addEventListener('click', function () { document.getElementById('getNewToken').addEventListener('click', function () {
panel.getNewToken() panel.getNewToken()
}) })
@ -495,8 +507,8 @@ panel.getNewToken = function () {
swal({ swal({
title: 'Woohoo!', title: 'Woohoo!',
text: 'Your token was changed successfully.', text: 'Your token was changed successfully.',
type: 'success' icon: 'success'
}, function () { }).then(() => {
localStorage.token = response.data.token localStorage.token = response.data.token
location.reload() location.reload()
}) })
@ -508,25 +520,28 @@ panel.getNewToken = function () {
} }
panel.changePassword = function () { panel.changePassword = function () {
panel.page.innerHTML = '' panel.page.innerHTML = `
var container = document.createElement('div')
container.className = 'container'
container.innerHTML = `
<h2 class="subtitle">Change your password</h2> <h2 class="subtitle">Change your password</h2>
<div class="field">
<label class="label">New password:</label> <label class="label">New password:</label>
<p class="control has-addons"> <div class="control">
<input id="password" class="input is-expanded" type="password" placeholder="Your new password"> <input id="password" class="input" type="password" placeholder="Your new password">
</p> </div>
</div>
<div class="field">
<label class="label">Confirm password:</label> <label class="label">Confirm password:</label>
<p class="control has-addons"> <div class="field has-addons">
<div class="control is-expanded">
<input id="passwordConfirm" class="input is-expanded" type="password" placeholder="Verify your new password"> <input id="passwordConfirm" class="input is-expanded" type="password" placeholder="Verify your new password">
</div>
<div class="control">
<a id="sendChangePassword" class="button is-primary">Set new password</a> <a id="sendChangePassword" class="button is-primary">Set new password</a>
</p> </div>
</div>
</div>
` `
panel.page.appendChild(container)
document.getElementById('sendChangePassword').addEventListener('click', function () { document.getElementById('sendChangePassword').addEventListener('click', function () {
if (document.getElementById('password').value === document.getElementById('passwordConfirm').value) { if (document.getElementById('password').value === document.getElementById('passwordConfirm').value) {
panel.sendNewPassword(document.getElementById('password').value) panel.sendNewPassword(document.getElementById('password').value)
@ -534,8 +549,8 @@ panel.changePassword = function () {
swal({ swal({
title: 'Password mismatch!', title: 'Password mismatch!',
text: 'Your passwords do not match, please try again.', text: 'Your passwords do not match, please try again.',
type: 'error' icon: 'error'
}, function () { }).then(() => {
panel.changePassword() panel.changePassword()
}) })
} }
@ -553,8 +568,8 @@ panel.sendNewPassword = function (pass) {
swal({ swal({
title: 'Woohoo!', title: 'Woohoo!',
text: 'Your password was changed successfully.', text: 'Your password was changed successfully.',
type: 'success' icon: 'success'
}, function () { }).then(() => {
location.reload() location.reload()
}) })
}) })

4
public/js/home.js
View File

@ -45,8 +45,8 @@ upload.verifyToken = function (token, reloadOnError) {
swal({ swal({
title: 'An error occurred', title: 'An error occurred',
text: response.data.description, text: response.data.description,
type: 'error' icon: 'error'
}, () => { }).then(() => {
if (reloadOnError) { if (reloadOnError) {
localStorage.removeItem('token') localStorage.removeItem('token')
location.reload() location.reload()

2
public/libs/bulma/bulma.min.css vendored
View File

File diff suppressed because one or more lines are too long

5
public/libs/sweetalert/sweetalert.min.css vendored
View File

File diff suppressed because one or more lines are too long

2
public/libs/sweetalert/sweetalert.min.js vendored
View File

File diff suppressed because one or more lines are too long

5
views/album.handlebars
View File

@ -5,15 +5,14 @@
<meta charset="utf-8" /> <meta charset="utf-8" />
<meta name="description" content="A pomf-like file uploading service that doesn't suck."> <meta name="description" content="A pomf-like file uploading service that doesn't suck.">
<meta name="keywords" content="upload,lolisafe,file,images,hosting,bobby,fiery"> <meta name="keywords" content="upload,lolisafe,file,images,hosting,bobby,fiery">
<meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>{{ title }}</title> <title>{{ title }}</title>
<!-- Stylesheets and scripts --> <!-- Stylesheets and scripts -->
<link rel="stylesheet" type="text/css" href="../libs/bulma/bulma.min.css"> <link rel="stylesheet" type="text/css" href="../libs/bulma/bulma.min.css">
<link rel="stylesheet" type="text/css" href="../libs/sweetalert/sweetalert.min.css">
<link rel="stylesheet" type="text/css" href="../css/style.css"> <link rel="stylesheet" type="text/css" href="../css/style.css">
<script type="text/javascript" src="../libs/sweetalert/sweetalert.min.js"></script> <script type="text/javascript" src="../libs/sweetalert/sweetalert.min.js?v=V2RnA3Mwhh"></script>
<script type="text/javascript" src="../libs/axios/axios.min.js"></script> <script type="text/javascript" src="../libs/axios/axios.min.js"></script>
<!-- Open Graph tags --> <!-- Open Graph tags -->