232 lines
No EOL
9.9 KiB
HTML
232 lines
No EOL
9.9 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en" data-theme="{{ theme_preference or 'system' }}">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>{% block title %}Flask Files{% endblock %}</title>
|
|
|
|
<!-- Bootstrap CSS -->
|
|
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/css/bootstrap.min.css">
|
|
|
|
<!-- Font Awesome -->
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css">
|
|
|
|
<!-- Custom CSS -->
|
|
<link rel="stylesheet" href="{{ url_for('static', filename='css/styles.css') }}">
|
|
<link rel="stylesheet" href="{{ url_for('static', filename='css/custom.css') }}">
|
|
<link rel="stylesheet" href="{{ url_for('static', filename='css/modal.css') }}">
|
|
<link rel="stylesheet" href="{{ url_for('static', filename='css/context-menu.css') }}">
|
|
|
|
<!-- Classless CSS Framework -->
|
|
<!-- <link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/digitallytailored/classless@latest/classless.min.css"> -->
|
|
|
|
<!-- Custom CSS -->
|
|
<link rel="stylesheet" href="{{ url_for('static', filename='css/custom.css') }}">
|
|
<link rel="stylesheet" href="{{ url_for('static', filename='css/styles.css') }}">
|
|
<link rel="stylesheet" href="{{ url_for('static', filename='css/modal.css') }}">
|
|
<link rel="stylesheet" href="{{ url_for('static', filename='css/context-menu.css') }}">
|
|
|
|
<!-- Font Awesome Icons -->
|
|
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
|
|
|
|
{% block extra_css %}{% endblock %}
|
|
<!-- JavaScript -->
|
|
|
|
{% block extra_js %}{% endblock %}
|
|
</head>
|
|
|
|
<body>
|
|
{% if current_user.is_authenticated %}
|
|
<!-- Global drop zone overlay - hidden by default -->
|
|
<div id="global-dropzone" class="global-dropzone">
|
|
<div class="dropzone-content">
|
|
<div class="dropzone-icon">
|
|
<i class="fas fa-cloud-upload-alt fa-3x"></i>
|
|
</div>
|
|
<h3>Drop Files to Upload</h3>
|
|
<p>Files will be instantly uploaded to current folder</p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Global upload progress toast -->
|
|
<div id="upload-toast" class="upload-toast">
|
|
<div class="upload-toast-header">
|
|
<i class="fas fa-cloud-upload-alt"></i>
|
|
<span>Uploading Files</span>
|
|
<button id="upload-toast-close" class="upload-toast-close">×</button>
|
|
</div>
|
|
<div class="upload-toast-body">
|
|
<div class="upload-toast-progress-info">
|
|
<span id="upload-toast-file">Processing...</span>
|
|
<span id="upload-toast-percentage">0%</span>
|
|
</div>
|
|
<div class="upload-toast-progress-bar-container">
|
|
<div id="upload-toast-progress-bar" class="upload-toast-progress-bar"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
{% endif %}
|
|
|
|
<!-- Navigation -->
|
|
<nav class="navbar navbar-expand-md navbar-dark bg-dark fixed-top">
|
|
<div class="container">
|
|
<a class="navbar-brand" href="{{ url_for('dashboard.index') }}">
|
|
<i class="fas fa-folder-open mr-2"></i>
|
|
Flask Files
|
|
</a>
|
|
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarContent">
|
|
<span class="navbar-toggler-icon"></span>
|
|
</button>
|
|
|
|
<div class="collapse navbar-collapse" id="navbarContent">
|
|
<ul class="navbar-nav ml-auto">
|
|
{% if current_user.is_authenticated %}
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="{{ url_for('dashboard.index') }}">
|
|
<i class="fas fa-tachometer-alt mr-1"></i> Dashboard
|
|
</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="{{ url_for('files.browser') }}">
|
|
<i class="fas fa-folder mr-1"></i> My Files
|
|
</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="{{ url_for('files.upload') }}">
|
|
<i class="fas fa-upload mr-1"></i> Upload
|
|
</a>
|
|
</li>
|
|
{% if current_user.is_admin %}
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="{{ url_for('admin.index') }}">
|
|
<i class="fas fa-cog mr-1"></i> Admin
|
|
</a>
|
|
</li>
|
|
{% endif %}
|
|
<li class="nav-item dropdown">
|
|
<a class="nav-link dropdown-toggle" href="#" id="userDropdown" data-toggle="dropdown">
|
|
<i class="fas fa-user-circle mr-1"></i> {{ current_user.username }}
|
|
</a>
|
|
<div class="dropdown-menu dropdown-menu-right">
|
|
<a class="dropdown-item" href="{{ url_for('auth.profile') }}">
|
|
<i class="fas fa-id-card mr-2"></i> Profile
|
|
</a>
|
|
<div class="dropdown-divider"></div>
|
|
<a class="dropdown-item" href="{{ url_for('auth.logout') }}">
|
|
<i class="fas fa-sign-out-alt mr-2"></i> Logout
|
|
</a>
|
|
</div>
|
|
</li>
|
|
{% else %}
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="{{ url_for('auth.login') }}">
|
|
<i class="fas fa-sign-in-alt mr-1"></i> Login
|
|
</a>
|
|
</li>
|
|
<li class="nav-item">
|
|
<a class="nav-link" href="{{ url_for('auth.register') }}">
|
|
<i class="fas fa-user-plus mr-1"></i> Register
|
|
</a>
|
|
</li>
|
|
{% endif %}
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
<!-- Flash Messages -->
|
|
<div class="container mt-4">
|
|
{% with messages = get_flashed_messages(with_categories=true) %}
|
|
{% if messages %}
|
|
{% for category, message in messages %}
|
|
<div class="alert alert-{{ category if category != 'message' else 'info' }} alert-dismissible fade show">
|
|
{{ message }}
|
|
<button type="button" class="close" data-dismiss="alert">×</button>
|
|
</div>
|
|
{% endfor %}
|
|
{% endif %}
|
|
{% endwith %}
|
|
</div>
|
|
|
|
<!-- Main Content -->
|
|
<main role="main" class="container mt-3">
|
|
{% block content %}{% endblock %}
|
|
</main>
|
|
|
|
<!-- Footer -->
|
|
<footer class="footer mt-auto py-3 bg-light">
|
|
<div class="container text-center">
|
|
<span class="text-muted">© 2023 Flask Files. All rights reserved.</span>
|
|
</div>
|
|
</footer>
|
|
|
|
<!-- Add this right before the closing </body> tag -->
|
|
<div id="upload-overlay" class="upload-overlay">
|
|
<div class="upload-modal">
|
|
<div class="upload-header">
|
|
<h3><i class="fas fa-cloud-upload-alt"></i> Upload Files</h3>
|
|
<button class="close-upload" id="close-upload-btn">×</button>
|
|
</div>
|
|
|
|
<div class="upload-body">
|
|
<div class="upload-dropzone" id="dropzone">
|
|
<i class="fas fa-cloud-upload-alt upload-icon"></i>
|
|
<p>Drag & drop files or folders here</p>
|
|
<p>or</p>
|
|
<div class="upload-buttons">
|
|
<label class="btn primary">
|
|
<i class="fas fa-file"></i> Select Files
|
|
<input type="file" id="file-upload" multiple style="display: none">
|
|
</label>
|
|
<label class="btn">
|
|
<i class="fas fa-folder"></i> Select Folder
|
|
<input type="file" id="folder-upload" webkitdirectory directory multiple
|
|
style="display: none">
|
|
</label>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="upload-list" id="upload-list">
|
|
<h4>Upload Queue</h4>
|
|
<div class="upload-items" id="upload-items"></div>
|
|
</div>
|
|
|
|
<div class="upload-progress-overall">
|
|
<div class="progress-label">
|
|
<span>Overall Progress</span>
|
|
<span id="upload-percentage">0%</span>
|
|
</div>
|
|
<div class="progress-bar-container">
|
|
<div class="progress-bar" id="total-progress-bar" style="width: 0%"></div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="upload-footer">
|
|
<button class="btn" id="cancel-upload-btn">Cancel</button>
|
|
<button class="btn primary" id="start-upload-btn">Start Upload</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Common JS file with shared functions -->
|
|
<script src="{{ url_for('static', filename='js/common.js') }}"></script>
|
|
<script src="{{ url_for('static', filename='js/theme.js') }}"></script>
|
|
<script src="{{ url_for('static', filename='js/context-menu.js') }}"></script>
|
|
|
|
{% if current_user.is_authenticated %}
|
|
<script src="{{ url_for('static', filename='js/quick-upload.js') }}"></script>
|
|
{% endif %}
|
|
|
|
<!-- JavaScript -->
|
|
<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
|
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/js/bootstrap.bundle.min.js"></script>
|
|
|
|
<!-- Custom JavaScript -->
|
|
<script src="{{ url_for('static', filename='js/main.js') }}"></script>
|
|
|
|
{% block scripts %}{% endblock %}
|
|
</body>
|
|
|
|
</html> |