Initial commit

This commit is contained in:
Artem Mamonov
2025-02-06 02:36:10 +01:00
commit acf9b43671
24 changed files with 1946 additions and 0 deletions

116
static/index.html Normal file
View File

@@ -0,0 +1,116 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Album Manager</title>
<link rel="stylesheet" href="/static/style.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css" integrity="sha512-HfPclDlQUkcjYlZPzfdEftS5HkVU/LN8pPwqcSeCjJ83JGnVcqt7FYVgVkxGWMPN9IasvZp+hqQjW1FB2FYlnQ==" crossorigin="anonymous" referrerpolicy="no-referrer" />
</head>
<body>
<div class="container">
<header>
<h1>Cloud Drive</h1>
<div class="progress-bar">
<div id="progress" style="width: 70%;">70.2 GB of 100 GB</div>
</div>
</header>
<div class="main-content">
<aside>
<button id="add-project" class="btn">+ Add Project</button>
<nav>
<ul>
<li id="projects-tab">Projects</li>
<li>Expiring</li>
<li>Archived Projects</li>
</ul>
</nav>
</aside>
<!-- Update the login form to only show if the user is not logged in -->
<section class="content">
<form id="login-form" style="display: none;">
<h2>Login</h2>
<div>
<label for="username">Username:</label>
<input type="text" id="username" name="username" required>
</div>
<div>
<label for="password">Password:</label>
<input type="password" id="password" name="password" required>
</div>
<button type="submit">Login</button>
</form>
<table id="album-table" style="display:none;">
<thead>
<tr>
<th>Project</th>
<th>Shoot Date</th>
<th>Expires</th>
<th>Likes</th>
<th>Link to Project</th>
</tr>
</thead>
<tbody id="project-list">
<!-- Project items will be dynamically populated here -->
</tbody>
</table>
<div id="album-view" style="display:none;">
<div id="album-header">
<button id="back-to-projects" class="btn">Back to Projects</button>
<h2 id="album-name"></h2>
<button id="upload-button" class="btn">Upload</button>
</div>
<input type="file" id="file-input" multiple style="display:none;">
<div id="image-gallery"></div>
<div id="progress-bar" class="progress-bar">
<div id="upload-progress"></div>
</div>
</div>
</section>
</div>
</div>
<div id="modal" class="modal">
<span id="close-modal">&times;</span>
<div id="modal-content"></div>
<div id="modal-prev" class="modal-nav">&#10094;</div>
<div id="modal-next" class="modal-nav">&#10095;</div>
</div>
<!-- Add Project Modal -->
<div id="add-project-modal" class="modal">
<div class="modal-content">
<span class="close">&times;</span>
<h2>Add New Project</h2>
<form id="add-project-form">
<label for="name">Project Name</label>
<input type="text" id="name" name="name" required>
<label for="password">Password (optional)</label>
<input type="password" id="password" name="password">
<label>
<input type="checkbox" id="watermarked" name="watermarked">
Watermarked
</label>
<label>
<input type="checkbox" id="allow_comments" name="allow_comments">
Allow Comments
</label>
<label>
<input type="checkbox" id="allow_favourite" name="allow_favourite">
Allow Favourite
</label>
<label>
<input type="checkbox" id="allow_downloads" name="allow_downloads">
Allow Downloads
</label>
<button type="submit">Create Project</button>
</form>
</div>
</div>
<script src="/static/script.js"></script>
</body>
</html>