a.tolmachev
319 lines
11 KiB
JavaScript
319 lines
11 KiB
JavaScript
var settingsSession = null;
|
|
|
|
function settingsWorkspaceId() {
|
|
var workspace = window.getCurrentWorkspace ? window.getCurrentWorkspace() : null;
|
|
return workspace ? workspace.id : null;
|
|
}
|
|
|
|
function initials(displayName, email) {
|
|
var source = displayName || email || 'Crank';
|
|
return source
|
|
.split(/\s+/)
|
|
.filter(Boolean)
|
|
.slice(0, 2)
|
|
.map(function(part) { return part.charAt(0).toUpperCase(); })
|
|
.join('') || 'CR';
|
|
}
|
|
|
|
function setStatus(id, text, isError) {
|
|
var node = document.getElementById(id);
|
|
if (!node) return;
|
|
node.textContent = text || '';
|
|
node.style.color = text
|
|
? (isError ? 'var(--red)' : 'var(--green)')
|
|
: 'var(--text-muted)';
|
|
}
|
|
|
|
function titleCaseRole(role) {
|
|
return String(role || 'viewer').replace(/^\w/, function(character) {
|
|
return character.toUpperCase();
|
|
});
|
|
}
|
|
|
|
function populateCurrentSession(session) {
|
|
var summary = document.getElementById('settings-session-summary');
|
|
if (!summary) {
|
|
return;
|
|
}
|
|
|
|
if (!(session && session.user)) {
|
|
summary.textContent = 'Session details are unavailable. Use Log out to revoke the current browser session.';
|
|
return;
|
|
}
|
|
|
|
var membership = null;
|
|
if (Array.isArray(session.memberships)) {
|
|
membership = session.memberships.find(function(item) {
|
|
return item.workspace && item.workspace.id === session.current_workspace_id;
|
|
}) || session.memberships[0] || null;
|
|
}
|
|
|
|
var workspaceLabel = membership && membership.workspace
|
|
? (membership.workspace.display_name || membership.workspace.slug || membership.workspace.id)
|
|
: 'current workspace';
|
|
var roleLabel = membership ? titleCaseRole(membership.role) : 'Viewer';
|
|
summary.textContent = session.user.email + ' · ' + roleLabel + ' in ' + workspaceLabel + '. Use Log out to revoke the current browser session.';
|
|
}
|
|
|
|
function populateProfile(session) {
|
|
if (!session || !session.user) {
|
|
return;
|
|
}
|
|
|
|
var user = session.user;
|
|
document.getElementById('profile-avatar').textContent = initials(user.display_name, user.email);
|
|
document.getElementById('profile-display-name').textContent = user.display_name || 'Operator';
|
|
document.getElementById('profile-email').textContent = user.email || '';
|
|
|
|
var firstName = document.getElementById('field-firstname');
|
|
var email = document.getElementById('field-email');
|
|
if (firstName) {
|
|
firstName.value = user.display_name || '';
|
|
}
|
|
if (email) {
|
|
email.value = user.email || '';
|
|
}
|
|
|
|
populateCurrentSession(session);
|
|
}
|
|
|
|
async function loadProfile() {
|
|
if (!window.CrankAuth || !window.CrankApi) {
|
|
return;
|
|
}
|
|
|
|
settingsSession = await window.CrankAuth.fetchSession(true);
|
|
populateProfile(settingsSession);
|
|
}
|
|
|
|
function bindProfileSave() {
|
|
var button = document.getElementById('settings-profile-save-btn');
|
|
if (!button || button.dataset.bound === 'true') {
|
|
return;
|
|
}
|
|
button.dataset.bound = 'true';
|
|
|
|
button.addEventListener('click', async function() {
|
|
var original = button.textContent;
|
|
button.disabled = true;
|
|
button.textContent = 'Saving…';
|
|
setStatus('settings-profile-status', '', false);
|
|
|
|
try {
|
|
var session = await window.CrankApi.updateProfile({
|
|
display_name: document.getElementById('field-firstname').value.trim(),
|
|
email: document.getElementById('field-email').value.trim(),
|
|
});
|
|
settingsSession = session;
|
|
if (window.CrankAuth && typeof window.CrankAuth.replaceSession === 'function') {
|
|
window.CrankAuth.replaceSession(session);
|
|
}
|
|
populateProfile(session);
|
|
setStatus('settings-profile-status', 'Profile saved.', false);
|
|
button.textContent = 'Saved ✓';
|
|
} catch (error) {
|
|
setStatus('settings-profile-status', error.message || 'Failed to save profile', true);
|
|
button.textContent = original;
|
|
} finally {
|
|
setTimeout(function() {
|
|
button.disabled = false;
|
|
button.textContent = original;
|
|
}, 1200);
|
|
}
|
|
});
|
|
}
|
|
|
|
function bindPasswordSave() {
|
|
var button = document.getElementById('settings-password-save-btn');
|
|
if (!button || button.dataset.bound === 'true') {
|
|
return;
|
|
}
|
|
button.dataset.bound = 'true';
|
|
|
|
button.addEventListener('click', async function() {
|
|
var currentPassword = document.getElementById('security-current-password').value;
|
|
var newPassword = document.getElementById('security-new-password').value;
|
|
var confirmPassword = document.getElementById('security-confirm-password').value;
|
|
|
|
if (newPassword !== confirmPassword) {
|
|
setStatus('settings-password-status', 'New password and confirmation do not match.', true);
|
|
return;
|
|
}
|
|
|
|
var original = button.textContent;
|
|
button.disabled = true;
|
|
button.textContent = 'Saving…';
|
|
setStatus('settings-password-status', '', false);
|
|
|
|
try {
|
|
await window.CrankApi.changePassword({
|
|
current_password: currentPassword,
|
|
new_password: newPassword,
|
|
});
|
|
document.getElementById('security-current-password').value = '';
|
|
document.getElementById('security-new-password').value = '';
|
|
document.getElementById('security-confirm-password').value = '';
|
|
setStatus('settings-password-status', 'Password updated.', false);
|
|
button.textContent = 'Saved ✓';
|
|
} catch (error) {
|
|
setStatus('settings-password-status', error.message || 'Failed to change password', true);
|
|
button.textContent = original;
|
|
} finally {
|
|
setTimeout(function() {
|
|
button.disabled = false;
|
|
button.textContent = original;
|
|
}, 1200);
|
|
}
|
|
});
|
|
}
|
|
|
|
function injectLanguageSwitcher() {
|
|
var profileSection = document.getElementById('section-profile');
|
|
if (!profileSection) {
|
|
return;
|
|
}
|
|
|
|
var cardBody = profileSection.querySelector('.section-card-body');
|
|
if (!cardBody) {
|
|
return;
|
|
}
|
|
|
|
fetch('html/fragments/lang-switcher.html')
|
|
.then(function(response) { return response.text(); })
|
|
.then(function(html) {
|
|
var saveRow = cardBody.querySelector('div[style*="justify-content:flex-end"]');
|
|
if (saveRow) {
|
|
saveRow.insertAdjacentHTML('beforebegin', html);
|
|
} else {
|
|
cardBody.insertAdjacentHTML('beforeend', html);
|
|
}
|
|
if (typeof applyLang === 'function') {
|
|
applyLang();
|
|
}
|
|
});
|
|
}
|
|
|
|
function bindSectionNavigation() {
|
|
var navItems = document.querySelectorAll('.settings-nav-item[data-section]');
|
|
navItems.forEach(function (button) {
|
|
button.addEventListener('click', function () {
|
|
navItems.forEach(function (item) { item.classList.remove('active'); });
|
|
this.classList.add('active');
|
|
var target = document.getElementById('section-' + this.dataset.section);
|
|
if (target) {
|
|
target.scrollIntoView({ behavior: 'smooth', block: 'start' });
|
|
}
|
|
});
|
|
});
|
|
|
|
var initialSection = window.location.hash ? window.location.hash.slice(1) : 'profile';
|
|
var initialButton = document.querySelector('.settings-nav-item[data-section="' + initialSection + '"]')
|
|
|| document.querySelector('.settings-nav-item[data-section="profile"]');
|
|
if (initialButton) {
|
|
setTimeout(function () { initialButton.click(); }, 50);
|
|
}
|
|
|
|
var observer = new IntersectionObserver(function (entries) {
|
|
entries.forEach(function (entry) {
|
|
if (!entry.isIntersecting) {
|
|
return;
|
|
}
|
|
var section = entry.target.id.replace('section-', '');
|
|
document.querySelectorAll('.settings-nav-item[data-section]').forEach(function (button) {
|
|
button.classList.toggle('active', button.dataset.section === section);
|
|
});
|
|
});
|
|
}, { threshold: 0.3 });
|
|
|
|
document.querySelectorAll('[id^="section-"]').forEach(function (section) {
|
|
if (section.style.display !== 'none') {
|
|
observer.observe(section);
|
|
}
|
|
});
|
|
}
|
|
|
|
async function loadWorkspaceSettings() {
|
|
if (!window.CrankApi || !window.whenWorkspacesReady) {
|
|
return;
|
|
}
|
|
|
|
await window.whenWorkspacesReady();
|
|
var workspace = window.getCurrentWorkspace ? window.getCurrentWorkspace() : null;
|
|
if (!workspace) {
|
|
return;
|
|
}
|
|
|
|
try {
|
|
var record = await window.CrankApi.getWorkspace(workspace.id);
|
|
var item = record.workspace;
|
|
var settings = item.settings || {};
|
|
|
|
document.getElementById('settings-ws-slug').value = item.slug || '';
|
|
document.getElementById('settings-ws-display-name').value = item.display_name || '';
|
|
document.getElementById('settings-ws-description').value = settings.description || '';
|
|
document.getElementById('settings-ws-timezone').value = settings.timezone || 'UTC';
|
|
document.getElementById('settings-ws-protocol').value = settings.default_protocol || 'rest';
|
|
|
|
document.querySelectorAll('#section-workspace .lang-btn').forEach(function (button) {
|
|
button.classList.toggle('active', button.dataset.lang === (settings.language || (localStorage.getItem('crank_lang') || 'en')));
|
|
});
|
|
|
|
var saveButton = document.getElementById('settings-ws-save-btn');
|
|
if (saveButton.dataset.bound === 'true') {
|
|
return;
|
|
}
|
|
saveButton.dataset.bound = 'true';
|
|
|
|
saveButton.addEventListener('click', async function () {
|
|
var saveButton = this;
|
|
var original = saveButton.textContent;
|
|
saveButton.disabled = true;
|
|
saveButton.textContent = 'Saving…';
|
|
|
|
try {
|
|
await window.CrankApi.updateWorkspace(item.id, {
|
|
slug: document.getElementById('settings-ws-slug').value.trim(),
|
|
display_name: document.getElementById('settings-ws-display-name').value.trim(),
|
|
settings: {
|
|
description: document.getElementById('settings-ws-description').value.trim(),
|
|
timezone: document.getElementById('settings-ws-timezone').value,
|
|
default_protocol: document.getElementById('settings-ws-protocol').value,
|
|
language: localStorage.getItem('crank_lang') || 'en',
|
|
color: (workspace.settings && workspace.settings.color) || '#0d9488',
|
|
},
|
|
});
|
|
|
|
if (window.refreshWorkspaces) {
|
|
var workspaces = await window.refreshWorkspaces();
|
|
var updated = workspaces.find(function (entry) { return entry.id === item.id; });
|
|
if (updated && window.setCurrentWorkspace) {
|
|
await window.setCurrentWorkspace(updated);
|
|
}
|
|
}
|
|
|
|
saveButton.textContent = 'Saved ✓';
|
|
} catch (error) {
|
|
if (window.CrankUi) {
|
|
window.CrankUi.error(error.message || 'Failed to save workspace settings', 'Workspace save failed');
|
|
}
|
|
saveButton.textContent = original;
|
|
} finally {
|
|
setTimeout(function () {
|
|
saveButton.disabled = false;
|
|
saveButton.textContent = original;
|
|
}, 1200);
|
|
}
|
|
});
|
|
} catch (_error) {
|
|
}
|
|
}
|
|
|
|
document.addEventListener('DOMContentLoaded', function () {
|
|
injectLanguageSwitcher();
|
|
bindSectionNavigation();
|
|
loadProfile();
|
|
bindProfileSave();
|
|
bindPasswordSave();
|
|
loadWorkspaceSettings();
|
|
});
|