security: fix vulnerabilities 1-7 from security audit

- Fix #1: Share handler IDOR - enforce owner check on share operations
- Fix #2: list_files_query IDOR - bind folder queries to authenticated user
- Fix #3: Dedup handler IDOR - restrict dedup operations to file owner
- Fix #4: Trash handler OptionalAuthUser - require full AuthUser
- Fix #5: Error info leakage - sanitize 500 error responses
- Fix #6: Chunked upload IDOR - bind upload sessions to user_id,
  add verify_session_owner() check on all session operations
- Fix #7: CSP unsafe-inline removal - migrate all inline scripts,
  styles and event handlers to external files, tighten CSP to
  script-src 'self'; style-src 'self'

New files:
  - static/js/core/theme-init.js (render-blocking theme init)
  - static/js/core/sw-register.js (service worker registration)
  - static/css/views/device-verify.css (extracted inline styles)
  - static/js/views/device-verify/device-verify.js (extracted inline script)
This commit is contained in:
Dionisio
2026-03-05 13:15:34 +01:00
parent fdbb2bf60a
commit b503e08384
38 changed files with 870 additions and 1008 deletions
+18 -18
View File
@@ -4,7 +4,7 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>OxiCloud — Admin Panel</title>
<script>if(localStorage.getItem('oxicloud_theme')==='dark')document.documentElement.setAttribute('data-theme','dark');</script>
<script src="/js/core/theme-init.js"></script>
<script src="/js/core/icons.js" defer></script>
<script src="/js/core/formatters.js" defer></script>
<script src="/js/core/csrf.js" defer></script>
@@ -41,9 +41,9 @@
<div id="main-content">
<div class="admin-tabs">
<button class="admin-tab active" onclick="switchTab('dashboard',this)"><i class="fas fa-chart-pie"></i> Dashboard</button>
<button class="admin-tab" onclick="switchTab('users',this)"><i class="fas fa-users"></i> Users</button>
<button class="admin-tab" onclick="switchTab('oidc',this)"><i class="fas fa-key"></i> SSO / OIDC</button>
<button class="admin-tab active" id="tab-btn-dashboard"><i class="fas fa-chart-pie"></i> Dashboard</button>
<button class="admin-tab" id="tab-btn-users"><i class="fas fa-users"></i> Users</button>
<button class="admin-tab" id="tab-btn-oidc"><i class="fas fa-key"></i> SSO / OIDC</button>
</div>
<div id="tab-dashboard" class="tab-content active">
@@ -79,7 +79,7 @@
</div>
<div class="toggle-row toggle-row-strong">
<label><i class="fas fa-user-plus icon-muted-right"></i> Allow public self-registration</label>
<label class="switch"><input type="checkbox" id="ds-registration" checked onchange="toggleRegistration(this.checked)"><span class="slider"></span></label>
<label class="switch"><input type="checkbox" id="ds-registration" checked><span class="slider"></span></label>
</div>
<div class="warning" id="registration-warning"><i class="fas fa-exclamation-triangle"></i> Public registration is disabled. Only admins can create new users.</div>
</div>
@@ -87,7 +87,7 @@
<div id="tab-users" class="tab-content">
<div class="admin-card">
<h2 class="h2-space-between"><span><i class="fas fa-users-cog"></i> User Management</span><button class="btn btn-primary" onclick="openCreateUserModal()"><i class="fas fa-user-plus"></i> Create User</button></h2>
<h2 class="h2-space-between"><span><i class="fas fa-users-cog"></i> User Management</span><button class="btn btn-primary" id="btn-create-user"><i class="fas fa-user-plus"></i> Create User</button></h2>
<div class="table-wrap">
<table>
<thead>
@@ -107,8 +107,8 @@
<div class="pagination">
<span id="users-info">—</span>
<div class="flex-gap-6">
<button class="btn btn-sm btn-secondary" id="prev-btn" onclick="prevPage()" disabled><i class="fas fa-chevron-left"></i> Prev</button>
<button class="btn btn-sm btn-secondary" id="next-btn" onclick="nextPage()">Next <i class="fas fa-chevron-right"></i></button>
<button class="btn btn-sm btn-secondary" id="prev-btn" disabled><i class="fas fa-chevron-left"></i> Prev</button>
<button class="btn btn-sm btn-secondary" id="next-btn">Next <i class="fas fa-chevron-right"></i></button>
</div>
</div>
</div>
@@ -132,7 +132,7 @@
<small>OpenID Connect issuer URL of your identity provider</small>
</div>
<div class="oidc-discover-wrap">
<button class="btn btn-secondary btn-sm" id="discover-btn" onclick="testConnection()"><i class="fas fa-search"></i> Auto-discover</button>
<button class="btn btn-secondary btn-sm" id="discover-btn"><i class="fas fa-search"></i> Auto-discover</button>
</div>
<div id="discovery-result"></div>
<div class="form-group">
@@ -146,7 +146,7 @@
</div>
<div class="form-group">
<label>Callback URL <small class="small-muted">(register in your IdP)</small></label>
<div class="readonly-field"><span id="callback-url">—</span><button onclick="copyCallback()" title="Copy"><i class="fas fa-copy"></i></button></div>
<div class="readonly-field"><span id="callback-url">—</span><button id="btn-copy-callback" title="Copy"><i class="fas fa-copy"></i></button></div>
</div>
<details>
<summary><i class="fas fa-sliders-h summary-icon-right"></i> Advanced Settings</summary>
@@ -170,8 +170,8 @@
<div class="warning" id="password-warning"><i class="fas fa-exclamation-triangle"></i> This will prevent ALL password-based logins!</div>
</details>
<div class="oidc-actions">
<button class="btn btn-secondary" onclick="testConnection()"><i class="fas fa-vial"></i> Test</button>
<button class="btn btn-primary" id="save-btn" onclick="saveOidcSettings()"><i class="fas fa-save"></i> Save</button>
<button class="btn btn-secondary" id="btn-test-oidc"><i class="fas fa-vial"></i> Test</button>
<button class="btn btn-primary" id="save-btn"><i class="fas fa-save"></i> Save</button>
</div>
<div id="oidc-status" class="alert"></div>
</div>
@@ -195,8 +195,8 @@
<small>Set to 0 for unlimited</small>
</div>
<div class="modal-actions">
<button class="btn btn-secondary" onclick="closeQuotaModal()">Cancel</button>
<button class="btn btn-primary" onclick="saveQuota()"><i class="fas fa-save"></i> Save</button>
<button class="btn btn-secondary" id="btn-close-quota">Cancel</button>
<button class="btn btn-primary" id="btn-save-quota"><i class="fas fa-save"></i> Save</button>
</div>
</div>
</div>
@@ -235,8 +235,8 @@
</div>
<div id="cu-error" class="alert alert-no-margin"></div>
<div class="modal-actions">
<button class="btn btn-secondary" onclick="closeCreateUserModal()">Cancel</button>
<button class="btn btn-primary" id="cu-submit" onclick="submitCreateUser()"><i class="fas fa-user-plus"></i> Create</button>
<button class="btn btn-secondary" id="btn-close-create-user">Cancel</button>
<button class="btn btn-primary" id="cu-submit"><i class="fas fa-user-plus"></i> Create</button>
</div>
</div>
</div>
@@ -253,8 +253,8 @@
</div>
<div id="rp-error" class="alert alert-no-margin"></div>
<div class="modal-actions">
<button class="btn btn-secondary" onclick="closeResetPasswordModal()">Cancel</button>
<button class="btn btn-primary" id="rp-submit" onclick="submitResetPassword()"><i class="fas fa-save"></i> Reset</button>
<button class="btn btn-secondary" id="btn-close-reset-pw">Cancel</button>
<button class="btn btn-primary" id="rp-submit"><i class="fas fa-save"></i> Reset</button>
</div>
</div>
</div>
+2
View File
@@ -20,3 +20,5 @@ html[dir='rtl'] .fa-sign-out-alt {
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}
/* Utility: hide elements without inline style="" (CSP-safe) */
.hidden { display: none; }
+5
View File
@@ -40,6 +40,11 @@
display: none;
}
.dropzone-icon {
font-size: 32px;
margin-bottom: 10px;
}
.dropzone.active {
border-color: #ff5e3a;
background-color: rgba(255, 94, 58, 0.05);
+5
View File
@@ -95,3 +95,8 @@
[data-theme="dark"] .upload-dropdown-item i {
color: #94a3b8;
}
.upload-caret {
margin-left: 4px;
font-size: 12px;
}
+2
View File
@@ -61,6 +61,8 @@
align-items: center;
border-bottom: 1px solid rgba(255,255,255,0.07);
margin-bottom: 8px;
text-decoration: none;
color: inherit;
}
.logo {
+89
View File
@@ -0,0 +1,89 @@
/* device-verify.css — stand-alone styles for the device authorization page */
:root {
--primary: #2563eb;
--primary-hover: #1d4ed8;
--danger: #dc2626;
--danger-hover: #b91c1c;
--success: #16a34a;
--bg: #f8fafc;
--card: #ffffff;
--text: #1e293b;
--muted: #64748b;
--border: #e2e8f0;
--radius: 12px;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
background: var(--bg);
color: var(--text);
display: flex;
justify-content: center;
align-items: center;
min-height: 100vh;
padding: 1rem;
}
.card {
background: var(--card);
border-radius: var(--radius);
box-shadow: 0 4px 24px rgba(0,0,0,0.08);
padding: 2.5rem;
max-width: 440px;
width: 100%;
}
.logo { text-align: center; margin-bottom: 1.5rem; }
.logo h1 { font-size: 1.5rem; font-weight: 700; }
.logo span { color: var(--primary); }
h2 { font-size: 1.15rem; margin-bottom: 0.5rem; }
p.subtitle { color: var(--muted); font-size: 0.9rem; margin-bottom: 1.5rem; }
label { display: block; font-weight: 600; font-size: 0.85rem; margin-bottom: 0.4rem; }
input[type="text"] {
width: 100%;
padding: 0.75rem 1rem;
font-size: 1.4rem;
letter-spacing: 0.15em;
text-align: center;
text-transform: uppercase;
border: 2px solid var(--border);
border-radius: 8px;
outline: none;
transition: border-color 0.2s;
}
input[type="text"]:focus { border-color: var(--primary); }
.device-info {
background: #f1f5f9;
border-radius: 8px;
padding: 1rem;
margin: 1rem 0;
}
.device-info .row { display: flex; justify-content: space-between; margin-bottom: 0.3rem; }
.device-info .label { color: var(--muted); font-size: 0.85rem; }
.device-info .value { font-weight: 600; font-size: 0.85rem; }
.actions { display: flex; gap: 0.75rem; margin-top: 1.25rem; }
button {
flex: 1;
padding: 0.75rem;
border: none;
border-radius: 8px;
font-size: 0.95rem;
font-weight: 600;
cursor: pointer;
transition: background 0.2s;
}
.btn-approve { background: var(--primary); color: #fff; }
.btn-approve:hover { background: var(--primary-hover); }
.btn-deny { background: var(--danger); color: #fff; }
.btn-deny:hover { background: var(--danger-hover); }
button:disabled { opacity: 0.5; cursor: not-allowed; }
.status {
text-align: center;
padding: 1rem;
border-radius: 8px;
margin-top: 1rem;
font-weight: 600;
}
.status.success { background: #dcfce7; color: var(--success); }
.status.denied { background: #fef2f2; color: var(--danger); }
.status.error { background: #fef2f2; color: var(--danger); }
.error-text { color: var(--danger); font-size: 0.85rem; margin-top: 0.5rem; }
.hidden { display: none !important; }
+10 -201
View File
@@ -4,97 +4,7 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>OxiCloud — Authorize Device</title>
<style>
:root {
--primary: #2563eb;
--primary-hover: #1d4ed8;
--danger: #dc2626;
--danger-hover: #b91c1c;
--success: #16a34a;
--bg: #f8fafc;
--card: #ffffff;
--text: #1e293b;
--muted: #64748b;
--border: #e2e8f0;
--radius: 12px;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
body {
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
background: var(--bg);
color: var(--text);
display: flex;
justify-content: center;
align-items: center;
min-height: 100vh;
padding: 1rem;
}
.card {
background: var(--card);
border-radius: var(--radius);
box-shadow: 0 4px 24px rgba(0,0,0,0.08);
padding: 2.5rem;
max-width: 440px;
width: 100%;
}
.logo { text-align: center; margin-bottom: 1.5rem; }
.logo h1 { font-size: 1.5rem; font-weight: 700; }
.logo span { color: var(--primary); }
h2 { font-size: 1.15rem; margin-bottom: 0.5rem; }
p.subtitle { color: var(--muted); font-size: 0.9rem; margin-bottom: 1.5rem; }
label { display: block; font-weight: 600; font-size: 0.85rem; margin-bottom: 0.4rem; }
input[type="text"] {
width: 100%;
padding: 0.75rem 1rem;
font-size: 1.4rem;
letter-spacing: 0.15em;
text-align: center;
text-transform: uppercase;
border: 2px solid var(--border);
border-radius: 8px;
outline: none;
transition: border-color 0.2s;
}
input[type="text"]:focus { border-color: var(--primary); }
.device-info {
background: #f1f5f9;
border-radius: 8px;
padding: 1rem;
margin: 1rem 0;
display: none;
}
.device-info .row { display: flex; justify-content: space-between; margin-bottom: 0.3rem; }
.device-info .label { color: var(--muted); font-size: 0.85rem; }
.device-info .value { font-weight: 600; font-size: 0.85rem; }
.actions { display: flex; gap: 0.75rem; margin-top: 1.25rem; }
button {
flex: 1;
padding: 0.75rem;
border: none;
border-radius: 8px;
font-size: 0.95rem;
font-weight: 600;
cursor: pointer;
transition: background 0.2s;
}
.btn-approve { background: var(--primary); color: #fff; }
.btn-approve:hover { background: var(--primary-hover); }
.btn-deny { background: var(--danger); color: #fff; }
.btn-deny:hover { background: var(--danger-hover); }
button:disabled { opacity: 0.5; cursor: not-allowed; }
.status {
text-align: center;
padding: 1rem;
border-radius: 8px;
margin-top: 1rem;
font-weight: 600;
display: none;
}
.status.success { display: block; background: #dcfce7; color: var(--success); }
.status.denied { display: block; background: #fef2f2; color: var(--danger); }
.status.error { display: block; background: #fef2f2; color: var(--danger); }
.error-text { color: var(--danger); font-size: 0.85rem; margin-top: 0.5rem; display: none; }
</style>
<link rel="stylesheet" href="/css/views/device-verify.css">
</head>
<body>
<div class="card">
@@ -108,9 +18,9 @@
<p class="subtitle">Enter the code displayed on your WebDAV/CalDAV client to grant access.</p>
<label for="user-code">Device Code</label>
<input type="text" id="user-code" placeholder="ABCD-1234" maxlength="9" autocomplete="off" autofocus />
<div id="error-text" class="error-text"></div>
<div id="error-text" class="error-text hidden"></div>
<div id="device-info" class="device-info">
<div id="device-info" class="device-info hidden">
<div class="row">
<span class="label">Client</span>
<span class="value" id="info-client">—</span>
@@ -121,124 +31,23 @@
</div>
</div>
<div class="actions" id="action-buttons" style="display:none;">
<button class="btn-deny" id="btn-deny" onclick="handleAction('deny')">Deny</button>
<button class="btn-approve" id="btn-approve" onclick="handleAction('approve')">Approve</button>
<div class="actions hidden" id="action-buttons">
<button class="btn-deny" id="btn-deny">Deny</button>
<button class="btn-approve" id="btn-approve">Approve</button>
</div>
</div>
<!-- Step 2: Result -->
<div id="status-success" class="status success">
<div id="status-success" class="status success hidden">
Device authorized successfully! You can close this page.
</div>
<div id="status-denied" class="status denied">
<div id="status-denied" class="status denied hidden">
Authorization denied. The client will not receive access.
</div>
<div id="status-error" class="status error" id="status-error-msg"></div>
<div id="status-error" class="status error hidden"></div>
</div>
<script src="/js/core/csrf.js"></script>
<script>
const API_BASE = window.location.origin;
const codeInput = document.getElementById('user-code');
const deviceInfo = document.getElementById('device-info');
const actionButtons = document.getElementById('action-buttons');
const errorText = document.getElementById('error-text');
let debounceTimer = null;
let currentCode = '';
// Pre-fill from URL query param (?code=ABCD-1234)
const params = new URLSearchParams(window.location.search);
if (params.get('code')) {
codeInput.value = params.get('code');
lookupCode(params.get('code'));
}
// Auto-insert hyphen and lookup on input
codeInput.addEventListener('input', (e) => {
let val = e.target.value.toUpperCase().replace(/[^A-Z0-9\-]/g, '');
// Auto-insert hyphen after 4 chars
if (val.length === 4 && !val.includes('-')) {
val = val + '-';
}
e.target.value = val;
errorText.style.display = 'none';
// Debounce lookup
clearTimeout(debounceTimer);
if (val.length >= 9) {
debounceTimer = setTimeout(() => lookupCode(val), 300);
} else {
deviceInfo.style.display = 'none';
actionButtons.style.display = 'none';
}
});
async function lookupCode(code) {
try {
const resp = await fetch(`${API_BASE}/api/auth/device/verify?code=${encodeURIComponent(code)}`, {
credentials: 'same-origin'
});
if (resp.status === 401) {
showError('You must be logged in to authorize a device. Please log in first.');
return;
}
if (!resp.ok) throw new Error('Lookup failed');
const data = await resp.json();
if (data.valid) {
currentCode = code;
document.getElementById('info-client').textContent = data.client_name || 'Unknown';
document.getElementById('info-scopes').textContent = data.scopes || 'all';
deviceInfo.style.display = 'block';
actionButtons.style.display = 'flex';
errorText.style.display = 'none';
} else {
deviceInfo.style.display = 'none';
actionButtons.style.display = 'none';
showError('Code not found or expired. Please check and try again.');
}
} catch (err) {
showError('Failed to verify code. Please try again.');
}
}
async function handleAction(action) {
const btnApprove = document.getElementById('btn-approve');
const btnDeny = document.getElementById('btn-deny');
btnApprove.disabled = true;
btnDeny.disabled = true;
try {
const resp = await fetch(`${API_BASE}/api/auth/device/verify`, {
method: 'POST',
credentials: 'same-origin',
headers: { 'Content-Type': 'application/json', ...getCsrfHeaders() },
body: JSON.stringify({ user_code: currentCode, action: action })
});
if (!resp.ok) {
const err = await resp.json().catch(() => ({}));
throw new Error(err.message || 'Action failed');
}
document.getElementById('step-code').style.display = 'none';
if (action === 'approve') {
document.getElementById('status-success').style.display = 'block';
} else {
document.getElementById('status-denied').style.display = 'block';
}
} catch (err) {
btnApprove.disabled = false;
btnDeny.disabled = false;
showError(err.message || 'Failed to process action.');
}
}
function showError(msg) {
errorText.textContent = msg;
errorText.style.display = 'block';
}
</script>
<script src="/js/views/device-verify/device-verify.js"></script>
</body>
</html>
+13 -21
View File
@@ -5,7 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title data-i18n="app.title">OxiCloud</title>
<!-- Apply saved theme immediately to prevent flash of light mode -->
<script>if(localStorage.getItem('oxicloud_theme')==='dark')document.documentElement.setAttribute('data-theme','dark');</script>
<script src="/js/core/theme-init.js"></script>
<!-- Styles -->
<link rel="stylesheet" href="/css/main.css">
@@ -47,22 +47,14 @@
<script defer src="/js/app/bootstrap.js"></script>
<!-- Service Worker Registration -->
<script>
if ('serviceWorker' in navigator) {
window.addEventListener('load', () => {
navigator.serviceWorker.register('/sw.js')
.then(reg => console.log('Service Worker registered successfully'))
.catch(err => console.log('Service Worker registration failed:', err));
});
}
</script>
<script defer src="/js/core/sw-register.js"></script>
</head>
<body>
<!-- Mobile sidebar overlay -->
<div class="sidebar-overlay" id="sidebar-overlay"></div>
<!-- Sidebar -->
<div class="sidebar" id="sidebar">
<a href="/" class="logo-container" style="text-decoration:none;color:inherit;">
<a href="/" class="logo-container">
<div class="logo">
<svg viewBox="0 0 500 500">
@@ -127,7 +119,7 @@
<div class="notif-wrapper" id="notif-wrapper">
<button class="notif-bell-btn" id="notif-bell-btn" title="Notifications">
<i class="fas fa-bell"></i>
<span class="notif-badge" id="notif-badge" style="display:none">0</span>
<span class="notif-badge hidden" id="notif-badge">0</span>
</button>
<div class="notif-panel" id="notif-panel">
<div class="notif-panel-header">
@@ -157,7 +149,7 @@
<div class="user-menu-email" id="user-menu-email">user@oxicloud.app</div>
</div>
</div>
<div class="user-menu-role-badge" id="user-menu-role-badge" style="display:none">
<div class="user-menu-role-badge hidden" id="user-menu-role-badge">
<span class="role-badge role-badge-admin"><i class="fas fa-shield-alt"></i> Admin</span>
</div>
<div class="user-menu-storage">
@@ -171,7 +163,7 @@
<div class="user-menu-storage-text" id="user-menu-storage-text">0% used</div>
</div>
<div class="user-menu-divider"></div>
<button class="user-menu-item user-menu-admin" id="user-menu-admin" style="display:none">
<button class="user-menu-item user-menu-admin hidden" id="user-menu-admin">
<i class="fas fa-cogs"></i>
<span data-i18n="user_menu.admin_panel">Admin panel</span>
</button>
@@ -179,7 +171,7 @@
<i class="fas fa-user-circle"></i>
<span data-i18n="user_menu.profile">My profile</span>
</button>
<div class="user-menu-divider" id="user-menu-admin-divider" style="display:none"></div>
<div class="user-menu-divider hidden" id="user-menu-admin-divider"></div>
<button class="user-menu-item" id="user-menu-theme">
<i class="fas fa-moon"></i>
<span data-i18n="user_menu.appearance">Appearance</span>
@@ -210,7 +202,7 @@
<button class="btn btn-primary" id="upload-btn">
<i class="fas fa-cloud-upload-alt"></i>
<span data-i18n="actions.upload">Upload</span>
<i class="fas fa-caret-down" style="margin-left: 4px; font-size: 12px;"></i>
<i class="fas fa-caret-down upload-caret"></i>
</button>
<div class="upload-dropdown-menu" id="upload-dropdown-menu">
<button class="upload-dropdown-item" id="upload-files-btn">
@@ -240,10 +232,10 @@
</div>
<div class="dropzone" id="dropzone">
<i class="fas fa-cloud-upload-alt" style="font-size: 32px; margin-bottom: 10px;"></i>
<i class="fas fa-cloud-upload-alt dropzone-icon"></i>
<p data-i18n="dropzone.drag_files">Drag files here or click to select</p>
<input type="file" id="file-input" style="display: none;" multiple>
<input type="file" id="folder-input" style="display: none;" webkitdirectory directory multiple>
<input type="file" id="file-input" class="hidden" multiple>
<input type="file" id="folder-input" class="hidden" webkitdirectory directory multiple>
<div class="upload-progress">
<div class="progress-bar">
<div class="progress-fill"></div>
@@ -263,7 +255,7 @@
</div>
<!-- List View (hidden by default) -->
<div class="files-list-view" id="files-list-view" style="display: none;">
<div class="files-list-view hidden" id="files-list-view">
<div class="list-header">
<div class="list-header-checkbox"><input type="checkbox" id="select-all-checkbox" title="Select all"></div>
<div data-i18n="files.name">Name</div>
@@ -330,6 +322,6 @@
</div>
<!-- Upload Progress Toast (hidden – driven by notification bell) -->
<div class="upload-toast" id="upload-toast" style="display:none"></div>
<div class="upload-toast hidden" id="upload-toast"></div>
</body>
</html>
+8
View File
@@ -0,0 +1,8 @@
// Service Worker registration — runs after page load.
if ('serviceWorker' in navigator) {
window.addEventListener('load', function () {
navigator.serviceWorker.register('/sw.js')
.then(function () { /* registered */ })
.catch(function (err) { console.log('Service Worker registration failed:', err); });
});
}
+3
View File
@@ -0,0 +1,3 @@
// Apply saved theme immediately (render-blocking) to prevent FOUC.
// This file MUST be loaded without "defer" or "async".
if(localStorage.getItem('oxicloud_theme')==='dark')document.documentElement.setAttribute('data-theme','dark');
+25
View File
@@ -407,3 +407,28 @@ function showAccessDenied() {
}
init();
/* ── Event-listener wiring (replaces inline onclick/onchange) ── */
document.getElementById('tab-btn-dashboard').addEventListener('click', function(){ switchTab('dashboard', this); });
document.getElementById('tab-btn-users').addEventListener('click', function(){ switchTab('users', this); });
document.getElementById('tab-btn-oidc').addEventListener('click', function(){ switchTab('oidc', this); });
document.getElementById('ds-registration').addEventListener('change', function(){ toggleRegistration(this.checked); });
document.getElementById('btn-create-user').addEventListener('click', openCreateUserModal);
document.getElementById('prev-btn').addEventListener('click', prevPage);
document.getElementById('next-btn').addEventListener('click', nextPage);
document.getElementById('discover-btn').addEventListener('click', testConnection);
document.getElementById('btn-copy-callback').addEventListener('click', copyCallback);
document.getElementById('btn-test-oidc').addEventListener('click', testConnection);
document.getElementById('save-btn').addEventListener('click', saveOidcSettings);
document.getElementById('btn-close-quota').addEventListener('click', closeQuotaModal);
document.getElementById('btn-save-quota').addEventListener('click', saveQuota);
document.getElementById('btn-close-create-user').addEventListener('click', closeCreateUserModal);
document.getElementById('cu-submit').addEventListener('click', submitCreateUser);
document.getElementById('btn-close-reset-pw').addEventListener('click', closeResetPasswordModal);
document.getElementById('rp-submit').addEventListener('click', submitResetPassword);
@@ -0,0 +1,109 @@
// device-verify.js — Extracted from inline <script> in device-verify.html
(function () {
'use strict';
var API_BASE = window.location.origin;
var codeInput = document.getElementById('user-code');
var deviceInfo = document.getElementById('device-info');
var actionButtons = document.getElementById('action-buttons');
var errorText = document.getElementById('error-text');
var btnApprove = document.getElementById('btn-approve');
var btnDeny = document.getElementById('btn-deny');
var debounceTimer = null;
var currentCode = '';
// Pre-fill from URL query param (?code=ABCD-1234)
var params = new URLSearchParams(window.location.search);
if (params.get('code')) {
codeInput.value = params.get('code');
lookupCode(params.get('code'));
}
// Auto-insert hyphen and lookup on input
codeInput.addEventListener('input', function (e) {
var val = e.target.value.toUpperCase().replace(/[^A-Z0-9\-]/g, '');
// Auto-insert hyphen after 4 chars
if (val.length === 4 && val.indexOf('-') === -1) {
val = val + '-';
}
e.target.value = val;
errorText.classList.add('hidden');
// Debounce lookup
clearTimeout(debounceTimer);
if (val.length >= 9) {
debounceTimer = setTimeout(function () { lookupCode(val); }, 300);
} else {
deviceInfo.classList.add('hidden');
actionButtons.classList.add('hidden');
}
});
// Wire up approve / deny buttons (replaces inline onclick)
btnApprove.addEventListener('click', function () { handleAction('approve'); });
btnDeny.addEventListener('click', function () { handleAction('deny'); });
async function lookupCode(code) {
try {
var resp = await fetch(API_BASE + '/api/auth/device/verify?code=' + encodeURIComponent(code), {
credentials: 'same-origin'
});
if (resp.status === 401) {
showError('You must be logged in to authorize a device. Please log in first.');
return;
}
if (!resp.ok) throw new Error('Lookup failed');
var data = await resp.json();
if (data.valid) {
currentCode = code;
document.getElementById('info-client').textContent = data.client_name || 'Unknown';
document.getElementById('info-scopes').textContent = data.scopes || 'all';
deviceInfo.classList.remove('hidden');
actionButtons.classList.remove('hidden');
errorText.classList.add('hidden');
} else {
deviceInfo.classList.add('hidden');
actionButtons.classList.add('hidden');
showError('Code not found or expired. Please check and try again.');
}
} catch (_err) {
showError('Failed to verify code. Please try again.');
}
}
async function handleAction(action) {
btnApprove.disabled = true;
btnDeny.disabled = true;
try {
var resp = await fetch(API_BASE + '/api/auth/device/verify', {
method: 'POST',
credentials: 'same-origin',
headers: Object.assign({ 'Content-Type': 'application/json' }, getCsrfHeaders()),
body: JSON.stringify({ user_code: currentCode, action: action })
});
if (!resp.ok) {
var err = await resp.json().catch(function () { return {}; });
throw new Error(err.message || 'Action failed');
}
document.getElementById('step-code').classList.add('hidden');
if (action === 'approve') {
document.getElementById('status-success').classList.remove('hidden');
} else {
document.getElementById('status-denied').classList.remove('hidden');
}
} catch (err) {
btnApprove.disabled = false;
btnDeny.disabled = false;
showError(err.message || 'Failed to process action.');
}
}
function showError(msg) {
errorText.textContent = msg;
errorText.classList.remove('hidden');
}
})();
+3
View File
@@ -134,3 +134,6 @@ async function changePassword(e) {
}
init();
/* Wire up form handler (replaces inline onsubmit) */
document.getElementById('password-form').addEventListener('submit', changePassword);
+5 -5
View File
@@ -5,7 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title data-i18n="app.title">OxiCloud - Login</title>
<!-- Apply saved theme immediately to prevent flash of light mode -->
<script>if(localStorage.getItem('oxicloud_theme')==='dark')document.documentElement.setAttribute('data-theme','dark');</script>
<script src="/js/core/theme-init.js"></script>
<!-- Styles -->
<link rel="stylesheet" href="/css/main.css">
@@ -20,7 +20,7 @@
<body>
<div class="auth-container">
<!-- Language Selector Panel - Shown first on fresh install -->
<div class="auth-panel language-selector-panel" id="language-panel" style="display: none;">
<div class="auth-panel language-selector-panel hidden" id="language-panel">
<div class="auth-logo">
<div class="auth-logo-icon">
<svg viewBox="0 0 500 500">
@@ -54,7 +54,7 @@
<button type="button" class="auth-button" id="language-continue">Continue</button>
</div>
<div class="auth-panel" id="login-panel" style="display: none;">
<div class="auth-panel hidden" id="login-panel">
<div class="auth-logo">
<div class="auth-logo-icon">
<svg viewBox="0 0 500 500">
@@ -97,7 +97,7 @@
</form>
<!-- SSO / OIDC login section (hidden by default, shown dynamically) -->
<div id="oidc-login-section" style="display: none;">
<div id="oidc-login-section" class="hidden">
<div class="auth-divider" id="auth-divider">
<span data-i18n="auth.or">or</span>
</div>
@@ -118,7 +118,7 @@
</div>
</div>
<div class="auth-panel" id="register-panel" style="display: none;">
<div class="auth-panel hidden" id="register-panel">
<div class="auth-logo">
<div class="auth-logo-icon">
<svg viewBox="0 0 500 500">
+2 -2
View File
@@ -4,7 +4,7 @@
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>OxiCloud — My Profile</title>
<script>if(localStorage.getItem('oxicloud_theme')==='dark')document.documentElement.setAttribute('data-theme','dark');</script>
<script src="/js/core/theme-init.js"></script>
<script src="/js/core/icons.js" defer></script>
<script src="/js/core/csrf.js" defer></script>
<link rel="stylesheet" href="/css/main.css">
@@ -96,7 +96,7 @@
<div class="profile-card" id="password-section">
<h2><i class="fas fa-key"></i> Change Password</h2>
<form id="password-form" onsubmit="return changePassword(event)">
<form id="password-form">
<div class="form-group">
<label for="current-password">Current Password</label>
<input type="password" id="current-password" required autocomplete="current-password">