/** * OxiCloud Shared Resources Page * Manages the display and interaction with shared files and folders */ // Authentication check function function checkAuthentication() { // Names of variables from auth.js const TOKEN_KEY = 'oxicloud_token'; const TOKEN_EXPIRY_KEY = 'oxicloud_token_expiry'; const USER_DATA_KEY = 'oxicloud_user'; const token = localStorage.getItem(TOKEN_KEY); const tokenExpiry = localStorage.getItem(TOKEN_EXPIRY_KEY); if (!token || !tokenExpiry || new Date(tokenExpiry) < new Date()) { // No token or expired token window.location.href = '/login'; return; } // Display username in notification if available const userData = JSON.parse(localStorage.getItem(USER_DATA_KEY) || '{}'); if (userData.username) { console.log(`Authenticated as ${userData.username}`); } } document.addEventListener('DOMContentLoaded', async () => { // Initialize i18n await initializeI18n(); // Wait a moment for translations to fully load setTimeout(() => { // Manually translate all elements with data-i18n attribute if (window.i18n && window.i18n.translatePage) { window.i18n.translatePage(); } }, 500); // Elements const sharedItemsList = document.getElementById('shared-items-list'); const emptySharedState = document.getElementById('empty-shared-state'); const filterType = document.getElementById('filter-type'); const sortBy = document.getElementById('sort-by'); const sharedSearch = document.getElementById('shared-search'); const sharedSearchBtn = document.getElementById('shared-search-btn'); const goToFilesBtn = document.getElementById('go-to-files'); // Share dialog elements const shareDialog = document.getElementById('share-dialog'); const shareDialogCloseBtn = shareDialog.querySelector('.close-dialog-btn'); const shareDialogIcon = document.getElementById('share-dialog-icon'); const shareDialogName = document.getElementById('share-dialog-name'); const shareLinkUrl = document.getElementById('share-link-url'); const copyLinkBtn = document.getElementById('copy-link-btn'); const enablePassword = document.getElementById('enable-password'); const sharePassword = document.getElementById('share-password'); const generatePasswordBtn = document.getElementById('generate-password'); const enableExpiration = document.getElementById('enable-expiration'); const shareExpiration = document.getElementById('share-expiration'); const permissionRead = document.getElementById('permission-read'); const permissionWrite = document.getElementById('permission-write'); const permissionReshare = document.getElementById('permission-reshare'); const updateShareBtn = document.getElementById('update-share-btn'); const removeShareBtn = document.getElementById('remove-share-btn'); // Notification dialog elements const notificationDialog = document.getElementById('share-notification-dialog'); const notificationCloseBtn = notificationDialog.querySelector('.close-dialog-btn'); const notifyDialogIcon = document.getElementById('notify-dialog-icon'); const notifyDialogName = document.getElementById('notify-dialog-name'); const notificationEmail = document.getElementById('notification-email'); const notificationMessage = document.getElementById('notification-message'); const sendNotificationBtn = document.getElementById('send-notification-btn'); // Notification banner const notificationBanner = document.getElementById('notification-banner'); const notificationBannerMessage = document.getElementById('notification-message'); const closeNotificationBtn = document.getElementById('close-notification'); // Current state let currentSharedItem = null; let allSharedItems = []; let filteredItems = []; // Initialize the page loadSharedItems(); // Event listeners filterType.addEventListener('change', filterAndSortItems); sortBy.addEventListener('change', filterAndSortItems); sharedSearchBtn.addEventListener('click', filterAndSortItems); sharedSearch.addEventListener('keyup', (e) => { if (e.key === 'Enter') filterAndSortItems(); }); goToFilesBtn.addEventListener('click', () => window.location.href = '/'); // Check authentication before loading checkAuthentication(); // Share dialog event listeners shareDialogCloseBtn.addEventListener('click', () => closeShareDialog()); copyLinkBtn.addEventListener('click', copyShareLink); enablePassword.addEventListener('change', () => { sharePassword.disabled = !enablePassword.checked; if (enablePassword.checked) sharePassword.focus(); }); generatePasswordBtn.addEventListener('click', generatePassword); enableExpiration.addEventListener('change', () => { shareExpiration.disabled = !enableExpiration.checked; if (enableExpiration.checked) shareExpiration.focus(); }); updateShareBtn.addEventListener('click', updateSharedItem); removeShareBtn.addEventListener('click', removeSharedItem); // Notification dialog event listeners notificationCloseBtn.addEventListener('click', () => closeNotificationDialog()); sendNotificationBtn.addEventListener('click', sendNotification); // Notification banner event listeners closeNotificationBtn.addEventListener('click', () => { notificationBanner.classList.remove('active'); }); /** * Loads all shared items and displays them */ function loadSharedItems() { // Get shared links from storage allSharedItems = getSharedLinks(); // Display items filterAndSortItems(); } /** * Filters and sorts the shared items based on current filters */ function filterAndSortItems() { const type = filterType.value; const sort = sortBy.value; const searchTerm = sharedSearch.value.toLowerCase(); // Filter items filteredItems = allSharedItems.filter(item => { // Filter by type if (type !== 'all' && item.type !== type) return false; // Filter by search term const nameMatch = item.name.toLowerCase().includes(searchTerm); return nameMatch; }); // Sort items filteredItems.sort((a, b) => { if (sort === 'name') { return a.name.localeCompare(b.name); } else if (sort === 'date') { return new Date(b.dateShared) - new Date(a.dateShared); } else if (sort === 'expiration') { // Handle null expiration dates (items without expiration come last) if (!a.expiration && !b.expiration) return 0; if (!a.expiration) return 1; if (!b.expiration) return -1; return new Date(a.expiration) - new Date(b.expiration); } return 0; }); // Display filtered and sorted items displaySharedItems(); } /** * Displays the filtered and sorted shared items */ function displaySharedItems() { // Clear the list sharedItemsList.innerHTML = ''; // Show empty state if no items if (filteredItems.length === 0) { emptySharedState.style.display = 'flex'; document.querySelector('.shared-list-container').style.display = 'none'; return; } // Hide empty state and show table emptySharedState.style.display = 'none'; document.querySelector('.shared-list-container').style.display = 'block'; // Add items to the list filteredItems.forEach(item => { const row = document.createElement('tr'); // Icon and name const nameCell = document.createElement('td'); nameCell.className = 'shared-item-name'; const icon = document.createElement('span'); icon.className = 'item-icon'; icon.textContent = item.type === 'file' ? '📄' : '📁'; const name = document.createElement('span'); name.textContent = item.name; nameCell.appendChild(icon); nameCell.appendChild(name); // Type const typeCell = document.createElement('td'); typeCell.textContent = item.type === 'file' ? translate('shared_typeFile', 'File') : translate('shared_typeFolder', 'Folder'); // Date shared const dateCell = document.createElement('td'); dateCell.textContent = formatDate(item.dateShared); // Expiration const expirationCell = document.createElement('td'); expirationCell.textContent = item.expiration ? formatDate(item.expiration) : translate('shared_noExpiration', 'No expiration'); // Permissions const permissionsCell = document.createElement('td'); const permissions = []; if (item.permissions.read) permissions.push(translate('share_permissionRead', 'Read')); if (item.permissions.write) permissions.push(translate('share_permissionWrite', 'Write')); if (item.permissions.reshare) permissions.push(translate('share_permissionReshare', 'Reshare')); permissionsCell.textContent = permissions.join(', '); // Password const passwordCell = document.createElement('td'); passwordCell.textContent = item.password ? translate('shared_hasPassword', 'Yes') : translate('shared_noPassword', 'No'); // Actions const actionsCell = document.createElement('td'); actionsCell.className = 'shared-item-actions'; // Edit button const editBtn = document.createElement('button'); editBtn.className = 'action-btn edit-btn'; editBtn.innerHTML = '✏️'; editBtn.title = translate('shared_editShare', 'Edit Share'); editBtn.addEventListener('click', () => openShareDialog(item)); // Notify button const notifyBtn = document.createElement('button'); notifyBtn.className = 'action-btn notify-btn'; notifyBtn.innerHTML = '📧'; notifyBtn.title = translate('shared_notifyShare', 'Notify Someone'); notifyBtn.addEventListener('click', () => openNotificationDialog(item)); // Copy link button const copyBtn = document.createElement('button'); copyBtn.className = 'action-btn copy-btn'; copyBtn.innerHTML = '📋'; copyBtn.title = translate('shared_copyLink', 'Copy Link'); copyBtn.addEventListener('click', () => { navigator.clipboard.writeText(item.url) .then(() => showNotification(translate('shared_linkCopied', 'Link copied to clipboard!'))) .catch(err => showNotification(translate('shared_linkCopyFailed', 'Failed to copy link'), 'error')); }); // Remove button const removeBtn = document.createElement('button'); removeBtn.className = 'action-btn remove-btn'; removeBtn.innerHTML = '🗑️'; removeBtn.title = translate('shared_removeShare', 'Remove Share'); removeBtn.addEventListener('click', () => { currentSharedItem = item; removeSharedItem(); }); actionsCell.appendChild(editBtn); actionsCell.appendChild(notifyBtn); actionsCell.appendChild(copyBtn); actionsCell.appendChild(removeBtn); // Add cells to row row.appendChild(nameCell); row.appendChild(typeCell); row.appendChild(dateCell); row.appendChild(expirationCell); row.appendChild(permissionsCell); row.appendChild(passwordCell); row.appendChild(actionsCell); // Add row to table sharedItemsList.appendChild(row); }); } /** * Opens the share dialog for the given item */ function openShareDialog(item) { currentSharedItem = item; // Set dialog content shareDialogIcon.textContent = item.type === 'file' ? '📄' : '📁'; shareDialogName.textContent = item.name; shareLinkUrl.value = item.url; // Set permissions permissionRead.checked = item.permissions.read; permissionWrite.checked = item.permissions.write; permissionReshare.checked = item.permissions.reshare; // Set password enablePassword.checked = !!item.password; sharePassword.disabled = !enablePassword.checked; sharePassword.value = item.password || ''; // Set expiration enableExpiration.checked = !!item.expiration; shareExpiration.disabled = !enableExpiration.checked; shareExpiration.value = item.expiration ? new Date(item.expiration).toISOString().split('T')[0] : ''; // Show dialog shareDialog.classList.add('active'); } /** * Closes the share dialog */ function closeShareDialog() { shareDialog.classList.remove('active'); currentSharedItem = null; } /** * Opens the notification dialog for the given item */ function openNotificationDialog(item) { currentSharedItem = item; // Set dialog content notifyDialogIcon.textContent = item.type === 'file' ? '📄' : '📁'; notifyDialogName.textContent = item.name; notificationEmail.value = ''; notificationMessage.value = ''; // Show dialog notificationDialog.classList.add('active'); } /** * Closes the notification dialog */ function closeNotificationDialog() { notificationDialog.classList.remove('active'); currentSharedItem = null; } /** * Copies the current share link to clipboard */ function copyShareLink() { navigator.clipboard.writeText(shareLinkUrl.value) .then(() => showNotification(translate('shared_linkCopied', 'Link copied to clipboard!'))) .catch(err => showNotification(translate('shared_linkCopyFailed', 'Failed to copy link'), 'error')); } /** * Generates a random password for the share */ function generatePassword() { const chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789!@#$%^&*'; let password = ''; for (let i = 0; i < 12; i++) { password += chars.charAt(Math.floor(Math.random() * chars.length)); } sharePassword.value = password; enablePassword.checked = true; sharePassword.disabled = false; } /** * Updates the current shared item with new settings */ function updateSharedItem() { if (!currentSharedItem) return; // Get updated settings const permissions = { read: permissionRead.checked, write: permissionWrite.checked, reshare: permissionReshare.checked }; const password = enablePassword.checked ? sharePassword.value : null; const expiration = enableExpiration.checked ? shareExpiration.value : null; // Update the shared link updateSharedLink(currentSharedItem.id, { permissions, password, expiration: expiration ? new Date(expiration).toISOString() : null }); // Reload items and close dialog loadSharedItems(); closeShareDialog(); // Show notification showNotification(translate('shared_itemUpdated', 'Share settings updated successfully')); } /** * Removes the current shared item */ function removeSharedItem() { if (!currentSharedItem) return; // Remove the shared link removeSharedLink(currentSharedItem.id); // Reload items and close dialog if open loadSharedItems(); closeShareDialog(); // Show notification showNotification(translate('shared_itemRemoved', 'Share removed successfully')); } /** * Sends a notification email for the current shared item */ function sendNotification() { if (!currentSharedItem) return; const email = notificationEmail.value.trim(); const message = notificationMessage.value.trim(); // Validate email if (!email || !validateEmail(email)) { showNotification(translate('shared_invalidEmail', 'Please enter a valid email address'), 'error'); return; } // Send notification sendShareNotification(currentSharedItem.id, email, message) .then(() => { closeNotificationDialog(); showNotification(translate('shared_notificationSent', 'Notification sent successfully')); }) .catch(error => { showNotification(translate('shared_notificationFailed', 'Failed to send notification'), 'error'); }); } /** * Shows a notification banner with the given message */ function showNotification(message, type = 'success') { notificationBannerMessage.textContent = message; notificationBanner.className = 'notification-banner active ' + type; // Auto-hide after 5 seconds setTimeout(() => { notificationBanner.classList.remove('active'); }, 5000); } /** * Validates an email address */ function validateEmail(email) { const re = /^[^\s@]+@[^\s@]+\.[^\s@]+$/; return re.test(email); } /** * Formats a date string to a user-friendly format */ function formatDate(dateString) { const options = { year: 'numeric', month: 'short', day: 'numeric' }; return new Date(dateString).toLocaleDateString(undefined, options); } });