mirror of
https://github.com/diced/zipline.git
synced 2025-05-16 22:40:56 +02:00
259 lines
No EOL
14 KiB
Text
Executable file
259 lines
No EOL
14 KiB
Text
Executable file
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<%- include('./partials/head') %>
|
|
<link rel="icon" href="<%=config.meta.favicon%>" type="image/png">
|
|
<title><%= config.meta.title %> - Dashboard</title>
|
|
</head>
|
|
|
|
<body>
|
|
<div class="text-light">
|
|
<input type="radio" id="home-tab" name="tabs" class="tab-locator" hidden checked />
|
|
<input type="radio" id="stats-tab" name="tabs" class="tab-locator" hidden />
|
|
<input type="radio" id="urls-tab" name="tabs" class="tab-locator" hidden />
|
|
<input type="radio" id="notes-tab" name="tabs" class="tab-locator" hidden />
|
|
<input type="radio" id="images-tab" name="tabs" class="tab-locator" hidden />
|
|
<% if (user.administrator) { %>
|
|
<input type="radio" id="users-tab" name="tabs" class="tab-locator" hidden />
|
|
<% } %>
|
|
<ul class="tab tab-block" style="border:none;">
|
|
<li class="tab-item text-light"><label for="home-tab"><a><i class="icon icon-apps"></i> Home</a></label>
|
|
</li>
|
|
<li class="tab-item text-light" id="updateStatistics"><label for="stats-tab"><a><i
|
|
class="icon icon-message"></i> Statistics</a></label></li>
|
|
<li class="tab-item text-light" id="updateShortens"><label for="urls-tab"><a><i class="icon icon-link"></i>
|
|
URLS</a></label></li>
|
|
<li class="tab-item text-light" id="updateNotes"><label for="notes-tab"><a><i class="icon icon-copy"></i>
|
|
Notes</a></label></li>
|
|
<li class="tab-item text-light" id="updateImages"><label for="images-tab"><a><i class="icon icon-photo"></i>
|
|
Images</a></label></li>
|
|
<% if (user.administrator) { %>
|
|
<li class="tab-item text-light"><label for="users-tab"><a><i class="icon icon-people"></i> Users</a></label>
|
|
</li>
|
|
<% } %>
|
|
</ul>
|
|
|
|
<div class="tabs">
|
|
<div class="tab-content" style="margin: 50px;">
|
|
<div class="card bg-dark" style="border-color: #303742;">
|
|
<div class="card-header">
|
|
<div class="card-title h5">Welcome back, <%=user.username%>!</div>
|
|
<% if (user.username === "administrator") { %>
|
|
<div class="card-subtitle text-gray"><b>This account is not designed for general usage, only to
|
|
create a user for uploading, and other administrator duties.</b></div>
|
|
<% } else { %>
|
|
<div class="card-subtitle text-gray">You have <b><%=images.length%></b> images.</div>
|
|
<% } %>
|
|
</div>
|
|
<div class="card-body">
|
|
<% if (user.username !== "administrator") { %>
|
|
<div class="card-title h5">Token</div>
|
|
<div class="container">
|
|
<div class="columns">
|
|
<div class="column col-6">
|
|
<button style="margin-top:12px;width:100%" type="button"
|
|
class="btn btn-primary input-group-btn" id="copyToken"
|
|
onclick="copyToken('<%=user.token%>')">Copy Token</button>
|
|
</div>
|
|
<div class="column col-6">
|
|
<button style="margin-top:12px;width:100%" type="button"
|
|
class="btn btn-primary input-group-btn" id="regenToken"
|
|
onclick="regenToken('<%=user.id%>')">Regen Token</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="card-title h5">Update your profile</div>
|
|
<form>
|
|
<label class="form-label" for="usernameSave">Username</label>
|
|
<input class="form-input" type="text" id="usernameSave" name="username"
|
|
placeholder="Username">
|
|
<label class="form-label" for="passwordSave">Password</label>
|
|
<input class="form-input" type="password" id="passwordSave" name="password"
|
|
placeholder="Password">
|
|
</form>
|
|
<% } %>
|
|
</div>
|
|
<div class="card-footer">
|
|
<% if (user.username === "administrator") { %>
|
|
<a href="/logout" style="margin-top:12px;width:100%" type="button"
|
|
class="btn btn-error input-group-btn">Logout</a>
|
|
<% } else { %>
|
|
<div class="container">
|
|
<div class="columns">
|
|
<div class="column col-6">
|
|
<button style="margin-top:12px;width:100%" type="button"
|
|
class="btn btn-primary input-group-btn"
|
|
onclick="saveUser('<%=user.id%>')">Update</button>
|
|
</div>
|
|
<div class="column col-6">
|
|
<a href="/logout" style="margin-top:12px;width:100%" type="button"
|
|
class="btn btn-error input-group-btn">Logout</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<% } %>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="tab-content" style="margin:50px;">
|
|
<h3>Statistics</h3>
|
|
<h5 id="statsDescription"></h5>
|
|
<div class="container">
|
|
<div class="columns">
|
|
<div class="column col-6">
|
|
<div class="card bg-dark" style="border-color: #303742; margin:12px;">
|
|
<div class="card-header">
|
|
<div class="card-title h5">Leaderboard (Image)</div>
|
|
</div>
|
|
<div class="card-body">
|
|
<table class="table">
|
|
<thead>
|
|
<tr>
|
|
<th scope="col">#</th>
|
|
<th scope="col">Username</th>
|
|
<th scope="col">Images</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="statsLeaderboardImages">
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="column col-6">
|
|
<div class="card bg-dark" style="border-color: #303742; margin:12px;">
|
|
<div class="card-header">
|
|
<div class="card-title h5">Leaderboard (Views)</div>
|
|
</div>
|
|
<div class="card-body">
|
|
<table class="table">
|
|
<thead>
|
|
<tr>
|
|
<th scope="col">#</th>
|
|
<th scope="col">Username</th>
|
|
<th scope="col">Views</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="statsLeaderboardImageViews">
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="tab-content" style="margin:50px;">
|
|
<h3>Shorten a URL</h3>
|
|
<form>
|
|
<div class="form-group">
|
|
<label class="form-label" for="urlToShorten">Name</label>
|
|
<input class="form-input" type="text" id="urlToShorten" placeholder="URL">
|
|
</div>
|
|
|
|
<button type="button" class="btn btn-primary" id="shortenURL"
|
|
onclick="shortURL('<%=user.token%>', document.getElementById('urlToShorten').value)"
|
|
style="width:100%;">Shorten</button>
|
|
</form>
|
|
<h3 style="margin-top:5px;">Your Shortens</h3>
|
|
<table class="table" style="margin:12px;">
|
|
<thead>
|
|
<tr>
|
|
<th scope="col">ID</th>
|
|
<th scope="col">Origin</th>
|
|
<th scope="col">Shortened</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody id="shortensTableShortens">
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<div class="tab-content" style="margin:50px;">
|
|
<h3>Create a Note</h3>
|
|
<p>Comming Soon!</p>
|
|
</div>
|
|
<div class="tab-content" style="margin:50px;">
|
|
<h3>Your Images</h3>
|
|
<div id="emptyImages"></div>
|
|
<div class="container" style="padding:12px;">
|
|
<div class="container">
|
|
<div id="typexImages" class="columns">
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<ul class="pagination" style="justify-content: center;margin:12px;" id="typexImagePagination">
|
|
|
|
</ul>
|
|
</div>
|
|
<div class="tab-content" style="margin:50px;">
|
|
<div class="container">
|
|
<button class="btn btn-primary"
|
|
onclick="document.getElementById('modal-create-user').classList.add('active')">Create new
|
|
user</button>
|
|
<div class="modal" id="modal-create-user">
|
|
<a href="#close" class="modal-overlay" aria-label="Close"></a>
|
|
<div class="modal-container bg-dark">
|
|
<div class="modal-header">
|
|
<a href="#close" class="btn btn-clear float-right" aria-label="Close"></a>
|
|
<div class="modal-title text-light h5">Create new user</div>
|
|
</div>
|
|
<div class="modal-body">
|
|
<div class="content">
|
|
<form>
|
|
<label class="form-label" for="username">Username</label>
|
|
<input class="form-input" type="text" id="username" name="username"
|
|
placeholder="Username">
|
|
<label class="form-label" for="password">Password</label>
|
|
<input class="form-input" type="password" id="password" name="password"
|
|
placeholder="Password">
|
|
<label class="form-switch">
|
|
<input type="checkbox" id="administrator">
|
|
<i class="form-icon"></i> Administrator
|
|
</label>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button class="btn btn-primary" id="addUser" type="button">Create</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="columns">
|
|
<% for (let b = 0; b < users.length; b++) { let u = users[b]; let imgs = userImages[b]; %>
|
|
<div class="column col-4">
|
|
<div class="card bg-dark" style="border-color: #303742; margin:12px;">
|
|
<div class="card-header">
|
|
<div class="card-title h5"><%=u.username%> <button class="btn btn-error btn-sm"
|
|
onclick="deleteSpecificUser('<%=u.id%>', '<%=u.username%>')">Delete</button>
|
|
</div>
|
|
<div class="card-subtitle text-gray">
|
|
<%=u.administrator ? 'Administrator' : 'User'%>
|
|
</div>
|
|
</div>
|
|
<div class="card-body">
|
|
<b>ID: </b> <%=u.id%><br>
|
|
<b>Images: </b> <%=imgs%>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<%}%>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js"
|
|
integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN"
|
|
crossorigin="anonymous"></script>
|
|
<script src="//cdn.jsdelivr.net/npm/sweetalert2@9/dist/sweetalert2.min.js"></script>
|
|
<script src="/public/js/dashboard.js"></script>
|
|
<script>
|
|
document.getElementById('createUserButton').addEventListener("click", ()
|
|
=> { document.getElementById("modal-create-user").classList.add("active") })
|
|
</script>
|
|
</body>
|
|
|
|
</html> |