websites/Flask-Files
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

wip

Browse source
This commit is contained in:
pika 2025-03-24 14:32:57 +01:00
parent 7823be6481
commit e99b2745bd
8 changed files with 147 additions and 894 deletions
Download patch file Download diff file Expand all files Collapse all files

75
app/static/js/browser.js
View file

@ -9,7 +9,7 @@ document.addEventListener('DOMContentLoaded', function () {
if (filesContainer && gridViewBtn && listViewBtn) {
// Set initial view based on saved preference
const savedView = localStorage.getItem('view_preference') || 'grid';
const savedView = localStorage.getItem('view_mode') || 'grid';
filesContainer.className = `files-container ${savedView}-view`;
// Highlight the correct button
@ -26,18 +26,14 @@ document.addEventListener('DOMContentLoaded', function () {
filesContainer.className = 'files-container grid-view';
gridViewBtn.classList.add('active');
listViewBtn.classList.remove('active');
// Save preference
localStorage.setItem('view_preference', 'grid');
localStorage.setItem('view_mode', 'grid');
});
listViewBtn.addEventListener('click', function () {
filesContainer.className = 'files-container list-view';
listViewBtn.classList.add('active');
gridViewBtn.classList.remove('active');
// Save preference
localStorage.setItem('view_preference', 'list');
localStorage.setItem('view_mode', 'list');
});
}
@ -281,6 +277,71 @@ document.addEventListener('DOMContentLoaded', function () {
deleteModal.classList.remove('active');
});
}
// File/folder action buttons
const setupItemActions = () => {
// Edit/rename buttons
document.querySelectorAll('.action-btn.edit').forEach(btn => {
btn.addEventListener('click', function (e) {
e.preventDefault();
e.stopPropagation();
const itemElement = this.closest('.folder-item, .file-item');
const itemId = itemElement.dataset.id;
const itemName = itemElement.querySelector('.item-name').textContent;
const isFolder = itemElement.classList.contains('folder-item');
// Set values in rename modal
const renameModal = document.getElementById('rename-modal');
const newNameInput = document.getElementById('new-name');
const itemIdInput = document.getElementById('item-id');
const itemTypeInput = document.getElementById('item-type');
if (renameModal && newNameInput && itemIdInput && itemTypeInput) {
newNameInput.value = itemName;
itemIdInput.value = itemId;
itemTypeInput.value = isFolder ? 'folder' : 'file';
// Show modal
renameModal.classList.add('active');
}
});
});
// Delete buttons
document.querySelectorAll('.action-btn.delete').forEach(btn => {
btn.addEventListener('click', function (e) {
e.preventDefault();
e.stopPropagation();
const itemElement = this.closest('.folder-item, .file-item');
const itemId = itemElement.dataset.id;
const isFolder = itemElement.classList.contains('folder-item');
// Set values in delete modal
const deleteModal = document.getElementById('delete-modal');
const deleteItemIdInput = document.getElementById('delete-item-id');
const deleteItemTypeInput = document.getElementById('delete-item-type');
if (deleteModal && deleteItemIdInput && deleteItemTypeInput) {
deleteItemIdInput.value = itemId;
deleteItemTypeInput.value = isFolder ? 'folder' : 'file';
// Update form action
const deleteForm = document.getElementById('delete-form');
if (deleteForm) {
deleteForm.action = `/files/delete/${itemId}`;
}
// Show modal
deleteModal.classList.add('active');
}
});
});
};
// Initialize item actions
setupItemActions();
});
// Browser-specific functionality

73
app/static/js/modal.js
View file

@ -5,44 +5,59 @@ document.addEventListener('DOMContentLoaded', function () {
});
function initializeModals() {
// Setup modal triggers
document.querySelectorAll('[data-toggle="modal"]').forEach(trigger => {
const targetId = trigger.getAttribute('data-target');
const targetModal = document.querySelector(targetId);
// Get all modals
const modals = document.querySelectorAll('.modal');
if (targetModal) {
trigger.addEventListener('click', function (e) {
e.preventDefault();
openModal(targetId);
// Initialize each modal
modals.forEach(modal => {
// Get close button
const closeBtn = modal.querySelector('.modal-close');
const cancelBtn = modal.querySelector('.modal-cancel');
// Close modal when close button is clicked
if (closeBtn) {
closeBtn.addEventListener('click', function () {
modal.classList.remove('active');
});
}
});
// Setup direct modal triggers (like the new folder button)
const newFolderBtn = document.getElementById('new-folder-btn');
if (newFolderBtn) {
newFolderBtn.addEventListener('click', function () {
openModal('#new-folder-modal');
});
}
// Close modal when cancel button is clicked
if (cancelBtn) {
cancelBtn.addEventListener('click', function () {
modal.classList.remove('active');
});
}
const emptyNewFolderBtn = document.getElementById('empty-new-folder-btn');
if (emptyNewFolderBtn) {
emptyNewFolderBtn.addEventListener('click', function () {
openModal('#new-folder-modal');
});
}
// Close buttons
document.querySelectorAll('.modal-close, .modal-cancel').forEach(closeBtn => {
closeBtn.addEventListener('click', function () {
const modal = this.closest('.modal');
if (modal) {
closeModal('#' + modal.id);
// Close modal when clicking outside
modal.addEventListener('click', function (e) {
if (e.target === modal) {
modal.classList.remove('active');
}
});
});
// Open modal when trigger is clicked
document.querySelectorAll('[data-modal]').forEach(trigger => {
trigger.addEventListener('click', function () {
const modalId = this.dataset.modal;
const modal = document.getElementById(modalId);
if (modal) {
modal.classList.add('active');
}
});
});
// New folder button
const newFolderBtn = document.getElementById('new-folder-btn');
if (newFolderBtn) {
newFolderBtn.addEventListener('click', function () {
const modal = document.getElementById('new-folder-modal');
if (modal) {
modal.classList.add('active');
}
});
}
// Close on background click
document.querySelectorAll('.modal').forEach(modal => {
modal.addEventListener('click', function (e) {