This commit is contained in:
3
public/ts-build/app.js
Normal file
3
public/ts-build/app.js
Normal file
@@ -0,0 +1,3 @@
|
||||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
require("./core/app.js");
|
||||
26
public/ts-build/components/admin/index.js
Normal file
26
public/ts-build/components/admin/index.js
Normal file
@@ -0,0 +1,26 @@
|
||||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.initAdminSection = initAdminSection;
|
||||
const api_js_1 = require("../../services/api.js");
|
||||
const toast_js_1 = require("../../ui/toast.js");
|
||||
async function initAdminSection(guildId) {
|
||||
const section = document.getElementById('section-admin');
|
||||
if (!section)
|
||||
return;
|
||||
section.innerHTML = '<p class="muted">Lade Admin-Daten...</p>';
|
||||
try {
|
||||
const data = await api_js_1.api.settings(guildId);
|
||||
section.innerHTML = `
|
||||
<h2 class="section-title">Admin</h2>
|
||||
<div class="card">
|
||||
<p class="muted">Rohdaten (nur Admin):</p>
|
||||
<pre style="white-space:pre-wrap;max-height:320px;overflow:auto;">${JSON.stringify(data, null, 2)}</pre>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
catch (err) {
|
||||
console.error(err);
|
||||
section.innerHTML = '<div class="empty-state">Admin-Daten konnten nicht geladen werden.</div>';
|
||||
(0, toast_js_1.showToast)('Fehler beim Laden der Admin-Daten', true);
|
||||
}
|
||||
}
|
||||
93
public/ts-build/components/dashboard.js
Normal file
93
public/ts-build/components/dashboard.js
Normal file
@@ -0,0 +1,93 @@
|
||||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.initDashboardView = initDashboardView;
|
||||
const api_js_1 = require("../services/api.js");
|
||||
const store_js_1 = require("../state/store.js");
|
||||
const toast_js_1 = require("../ui/toast.js");
|
||||
const overview_js_1 = require("./overview.js");
|
||||
const index_js_1 = require("./tickets/index.js");
|
||||
const index_js_2 = require("./modules/index.js");
|
||||
const index_js_3 = require("./events/index.js");
|
||||
const index_js_4 = require("./admin/index.js");
|
||||
const settings_js_1 = require("./settings.js");
|
||||
let overviewInterval = null;
|
||||
let ticketsInterval = null;
|
||||
async function populateGuildSelect() {
|
||||
const select = document.getElementById('guildSelect');
|
||||
const cfg = (0, store_js_1.getConfig)();
|
||||
if (!select || !cfg)
|
||||
return;
|
||||
select.innerHTML = `<option>Loading...</option>`;
|
||||
try {
|
||||
const data = await api_js_1.api.guilds();
|
||||
select.innerHTML = '';
|
||||
data.guilds.forEach((g) => {
|
||||
const opt = document.createElement('option');
|
||||
opt.value = g.id;
|
||||
opt.textContent = g.name;
|
||||
if (g.id === cfg.initialGuildId)
|
||||
opt.selected = true;
|
||||
select.appendChild(opt);
|
||||
});
|
||||
const current = select.value || cfg.initialGuildId || data.guilds[0]?.id;
|
||||
(0, store_js_1.setState)({ guildId: current || undefined });
|
||||
select.value = current || '';
|
||||
}
|
||||
catch (err) {
|
||||
console.error(err);
|
||||
(0, toast_js_1.showToast)('Guilds konnten nicht geladen werden', true);
|
||||
}
|
||||
}
|
||||
function registerGuildChange() {
|
||||
const select = document.getElementById('guildSelect');
|
||||
if (!select)
|
||||
return;
|
||||
select.addEventListener('change', () => {
|
||||
const guildId = select.value;
|
||||
(0, store_js_1.setState)({ guildId });
|
||||
refreshSections();
|
||||
});
|
||||
}
|
||||
async function refreshSections() {
|
||||
const { guildId } = (0, store_js_1.getState)();
|
||||
if (!guildId)
|
||||
return;
|
||||
await (0, overview_js_1.renderOverview)(guildId);
|
||||
await (0, index_js_1.initTicketsSection)(guildId);
|
||||
await (0, index_js_2.initModulesSection)(guildId);
|
||||
await (0, settings_js_1.renderSettingsSection)(guildId);
|
||||
await (0, index_js_3.initEventsSection)(guildId);
|
||||
const cfg = (0, store_js_1.getConfig)();
|
||||
if (cfg?.isAdmin) {
|
||||
await (0, index_js_4.initAdminSection)(guildId);
|
||||
}
|
||||
}
|
||||
function setupPolling() {
|
||||
const { guildId } = (0, store_js_1.getState)();
|
||||
if (overviewInterval)
|
||||
window.clearInterval(overviewInterval);
|
||||
if (ticketsInterval)
|
||||
window.clearInterval(ticketsInterval);
|
||||
overviewInterval = window.setInterval(() => {
|
||||
const current = (0, store_js_1.getState)().guildId;
|
||||
if (current)
|
||||
(0, overview_js_1.renderOverview)(current);
|
||||
}, 10000);
|
||||
ticketsInterval = window.setInterval(() => {
|
||||
const current = (0, store_js_1.getState)().guildId;
|
||||
if (current)
|
||||
(0, index_js_1.initTicketsSection)(current);
|
||||
}, 12000);
|
||||
}
|
||||
function initDashboardView() {
|
||||
const cfg = (0, store_js_1.getConfig)();
|
||||
const logoutBtn = document.getElementById('logoutBtn');
|
||||
if (logoutBtn && cfg) {
|
||||
logoutBtn.addEventListener('click', () => (window.location.href = `${cfg.baseAuth}/logout`));
|
||||
}
|
||||
populateGuildSelect().then(() => {
|
||||
registerGuildChange();
|
||||
refreshSections();
|
||||
setupPolling();
|
||||
});
|
||||
}
|
||||
43
public/ts-build/components/events/index.js
Normal file
43
public/ts-build/components/events/index.js
Normal file
@@ -0,0 +1,43 @@
|
||||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.initEventsSection = initEventsSection;
|
||||
const api_js_1 = require("../../services/api.js");
|
||||
const toast_js_1 = require("../../ui/toast.js");
|
||||
async function initEventsSection(guildId) {
|
||||
const section = document.getElementById('section-events');
|
||||
if (!section)
|
||||
return;
|
||||
section.innerHTML = '<p class="muted">Lade Events...</p>';
|
||||
try {
|
||||
const data = await api_js_1.api.events(guildId);
|
||||
const events = data?.events || data || [];
|
||||
section.innerHTML = '<h2 class="section-title">Events</h2>';
|
||||
if (!events.length) {
|
||||
section.innerHTML += '<div class="empty-state">Keine Events geplant.</div>';
|
||||
return;
|
||||
}
|
||||
const list = document.createElement('div');
|
||||
list.className = 'ticket-list';
|
||||
events.forEach((ev) => {
|
||||
const item = document.createElement('div');
|
||||
item.className = 'ticket-item';
|
||||
item.innerHTML = `
|
||||
<div class="row" style="justify-content:space-between;">
|
||||
<div>
|
||||
<div style="font-weight:750;">${ev.title || 'Event'}</div>
|
||||
<div class="muted">${ev.date || ''}</div>
|
||||
</div>
|
||||
<span class="pill">${ev.status || 'open'}</span>
|
||||
</div>
|
||||
<div class="muted">${ev.description || ''}</div>
|
||||
`;
|
||||
list.appendChild(item);
|
||||
});
|
||||
section.appendChild(list);
|
||||
}
|
||||
catch (err) {
|
||||
console.error(err);
|
||||
section.innerHTML = '<div class="empty-state">Events konnten nicht geladen werden.</div>';
|
||||
(0, toast_js_1.showToast)('Fehler beim Laden der Events', true);
|
||||
}
|
||||
}
|
||||
59
public/ts-build/components/guildSelect.js
Normal file
59
public/ts-build/components/guildSelect.js
Normal file
@@ -0,0 +1,59 @@
|
||||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.initSelectionView = initSelectionView;
|
||||
const api_js_1 = require("../services/api.js");
|
||||
const store_js_1 = require("../state/store.js");
|
||||
const toast_js_1 = require("../ui/toast.js");
|
||||
async function initSelectionView() {
|
||||
const cfg = (0, store_js_1.getConfig)();
|
||||
const grid = document.getElementById('guildGrid');
|
||||
const logoutBtn = document.getElementById('logoutBtn');
|
||||
const userInfo = document.getElementById('userInfo');
|
||||
if (logoutBtn && cfg) {
|
||||
logoutBtn.addEventListener('click', () => {
|
||||
window.location.href = `${cfg.baseAuth}/logout`;
|
||||
});
|
||||
}
|
||||
try {
|
||||
const me = await api_js_1.api.me();
|
||||
if (userInfo && me?.user)
|
||||
userInfo.textContent = `${me.user.username}#${me.user.discriminator}`;
|
||||
}
|
||||
catch {
|
||||
// ignore
|
||||
}
|
||||
if (!grid || !cfg)
|
||||
return;
|
||||
grid.innerHTML = '<div class="muted">Lade Guilds...</div>';
|
||||
try {
|
||||
const data = await api_js_1.api.guilds();
|
||||
grid.innerHTML = '';
|
||||
(data.guilds || []).forEach((g) => {
|
||||
const card = document.createElement('div');
|
||||
card.className = 'card clickable';
|
||||
card.innerHTML = `
|
||||
<div class="row">
|
||||
<img src="${g.icon ? `https://cdn.discordapp.com/icons/${g.id}/${g.icon}.png` : 'https://cdn.discordapp.com/embed/avatars/0.png'}" alt="icon" style="width:42px;height:42px;border-radius:12px;object-fit:cover;"/>
|
||||
<div>
|
||||
<div style="font-weight:700;">${g.name}</div>
|
||||
<div class="muted">ID: ${g.id}</div>
|
||||
</div>
|
||||
</div>
|
||||
<div style="margin-top:10px;" class="pill">Zum Dashboard</div>
|
||||
`;
|
||||
card.addEventListener('click', () => {
|
||||
const qs = g.id ? `?guildId=${encodeURIComponent(g.id)}` : '';
|
||||
window.location.href = `${cfg.baseDashboard}${qs}`;
|
||||
});
|
||||
grid.appendChild(card);
|
||||
});
|
||||
if (!data.guilds?.length) {
|
||||
grid.innerHTML = '<div class="empty-state">Bot ist in keiner Guild. Bitte Bot einladen.</div>';
|
||||
}
|
||||
}
|
||||
catch (err) {
|
||||
console.error(err);
|
||||
grid.innerHTML = '<div class="empty-state">Fehler beim Laden der Guilds</div>';
|
||||
(0, toast_js_1.showToast)('Guilds konnten nicht geladen werden', true);
|
||||
}
|
||||
}
|
||||
26
public/ts-build/components/modules/dynamicVoice.js
Normal file
26
public/ts-build/components/modules/dynamicVoice.js
Normal file
@@ -0,0 +1,26 @@
|
||||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.renderDynamicVoiceModule = renderDynamicVoiceModule;
|
||||
const api_js_1 = require("../../services/api.js");
|
||||
const toast_js_1 = require("../../ui/toast.js");
|
||||
async function renderDynamicVoiceModule(guildId) {
|
||||
const container = document.getElementById('module-dynamicvoice');
|
||||
if (!container)
|
||||
return;
|
||||
container.innerHTML = '<p class="muted">Lade Dynamic Voice...</p>';
|
||||
try {
|
||||
const data = await api_js_1.api.dynamicVoice(guildId);
|
||||
const cfg = data?.config || data?.dynamicVoiceConfig || {};
|
||||
container.innerHTML = `
|
||||
<h3 class="label">Dynamic Voice</h3>
|
||||
<p class="muted">Lobby: ${cfg.lobbyChannelId || '-'}</p>
|
||||
<p class="muted">Template: ${cfg.template || '-'}</p>
|
||||
<p class="muted">User-Limit: ${cfg.userLimit ?? '-'}</p>
|
||||
`;
|
||||
}
|
||||
catch (err) {
|
||||
console.error(err);
|
||||
container.innerHTML = '<div class="empty-state">Dynamic Voice konnte nicht geladen werden.</div>';
|
||||
(0, toast_js_1.showToast)('Fehler beim Laden von Dynamic Voice', true);
|
||||
}
|
||||
}
|
||||
104
public/ts-build/components/modules/index.js
Normal file
104
public/ts-build/components/modules/index.js
Normal file
@@ -0,0 +1,104 @@
|
||||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.initModulesSection = initModulesSection;
|
||||
const api_js_1 = require("../../services/api.js");
|
||||
const toast_js_1 = require("../../ui/toast.js");
|
||||
const switch_js_1 = require("../../ui/switch.js");
|
||||
const welcome_js_1 = require("./welcome.js");
|
||||
const logging_js_1 = require("./logging.js");
|
||||
const reactionRoles_js_1 = require("./reactionRoles.js");
|
||||
const dynamicVoice_js_1 = require("./dynamicVoice.js");
|
||||
const statuspage_js_1 = require("./statuspage.js");
|
||||
const serverstats_js_1 = require("./serverstats.js");
|
||||
async function initModulesSection(guildId) {
|
||||
const section = document.getElementById('section-modules');
|
||||
if (!section)
|
||||
return;
|
||||
section.innerHTML = `
|
||||
<h2 class="section-title">Module</h2>
|
||||
<div class="card">
|
||||
<div class="module-list" id="module-toggles"></div>
|
||||
</div>
|
||||
<div class="grid" style="margin-top:16px;">
|
||||
<div class="card" id="module-welcome"></div>
|
||||
<div class="card" id="module-logging"></div>
|
||||
<div class="card" id="module-reactionroles"></div>
|
||||
<div class="card" id="module-dynamicvoice"></div>
|
||||
<div class="card" id="module-statuspage"></div>
|
||||
<div class="card" id="module-serverstats"></div>
|
||||
</div>
|
||||
`;
|
||||
await Promise.all([
|
||||
renderModuleToggles(guildId),
|
||||
(0, welcome_js_1.renderWelcomeModule)(guildId),
|
||||
(0, logging_js_1.renderLoggingModule)(guildId),
|
||||
(0, reactionRoles_js_1.renderReactionRolesModule)(guildId),
|
||||
(0, dynamicVoice_js_1.renderDynamicVoiceModule)(guildId),
|
||||
(0, statuspage_js_1.renderStatuspageModule)(guildId),
|
||||
(0, serverstats_js_1.renderServerStatsModule)(guildId)
|
||||
]);
|
||||
}
|
||||
async function renderModuleToggles(guildId) {
|
||||
const container = document.getElementById('module-toggles');
|
||||
if (!container)
|
||||
return;
|
||||
container.innerHTML = '<p class="muted">Lade Module...</p>';
|
||||
try {
|
||||
const data = await api_js_1.api.modules(guildId);
|
||||
const modules = data?.modules || data || {};
|
||||
container.innerHTML = '';
|
||||
const entries = [
|
||||
{ key: 'ticketsEnabled', label: 'Tickets', desc: 'Ticket-System aktivieren' },
|
||||
{ key: 'automodEnabled', label: 'Automod', desc: 'Moderations-Filter' },
|
||||
{ key: 'welcomeEnabled', label: 'Welcome', desc: 'Begrueßungsnachrichten' },
|
||||
{ key: 'musicEnabled', label: 'Musik', desc: 'Musiksteuerung' },
|
||||
{ key: 'levelingEnabled', label: 'Leveling', desc: 'XP/Level System' },
|
||||
{ key: 'statuspageEnabled', label: 'Statuspage', desc: 'Statusberichte' },
|
||||
{ key: 'serverStatsEnabled', label: 'Server Stats', desc: 'Stat-Channel' },
|
||||
{ key: 'birthdayEnabled', label: 'Birthday', desc: 'Geburtstagsmodul' },
|
||||
{ key: 'reactionRolesEnabled', label: 'Reaction Roles', desc: 'Selbstzuweisbare Rollen' },
|
||||
{ key: 'eventsEnabled', label: 'Events', desc: 'Event-Planung' },
|
||||
{ key: 'dynamicVoiceEnabled', label: 'Dynamic Voice', desc: 'Dynamische Voice Channels' }
|
||||
];
|
||||
entries.forEach((entry) => {
|
||||
const row = document.createElement('div');
|
||||
row.className = 'module-item';
|
||||
row.innerHTML = `
|
||||
<div class="module-meta">
|
||||
<div class="module-title">${entry.label}</div>
|
||||
<div class="module-desc">${entry.desc}</div>
|
||||
</div>
|
||||
<div class="switch ${modules[entry.key] ? 'on' : ''}" data-key="${entry.key}"></div>
|
||||
`;
|
||||
const toggle = row.querySelector('.switch');
|
||||
toggle.addEventListener('click', async () => {
|
||||
(0, switch_js_1.setSwitch)(toggle, !(0, switch_js_1.getSwitch)(toggle));
|
||||
await saveModules(guildId);
|
||||
});
|
||||
container.appendChild(row);
|
||||
});
|
||||
}
|
||||
catch (err) {
|
||||
console.error(err);
|
||||
container.innerHTML = '<div class="empty-state">Module konnten nicht geladen werden.</div>';
|
||||
(0, toast_js_1.showToast)('Fehler beim Laden der Module', true);
|
||||
}
|
||||
}
|
||||
async function saveModules(guildId) {
|
||||
const toggles = Array.from(document.querySelectorAll('#module-toggles .switch'));
|
||||
const payload = { guildId };
|
||||
toggles.forEach((t) => {
|
||||
const key = t.dataset.key;
|
||||
if (!key)
|
||||
return;
|
||||
payload[key] = t.classList.contains('on');
|
||||
});
|
||||
try {
|
||||
await api_js_1.api.saveSettings(payload);
|
||||
(0, toast_js_1.showToast)('Module gespeichert');
|
||||
}
|
||||
catch (err) {
|
||||
console.error(err);
|
||||
(0, toast_js_1.showToast)('Module speichern fehlgeschlagen', true);
|
||||
}
|
||||
}
|
||||
26
public/ts-build/components/modules/logging.js
Normal file
26
public/ts-build/components/modules/logging.js
Normal file
@@ -0,0 +1,26 @@
|
||||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.renderLoggingModule = renderLoggingModule;
|
||||
const api_js_1 = require("../../services/api.js");
|
||||
const toast_js_1 = require("../../ui/toast.js");
|
||||
async function renderLoggingModule(guildId) {
|
||||
const container = document.getElementById('module-logging');
|
||||
if (!container)
|
||||
return;
|
||||
container.innerHTML = '<p class="muted">Lade Logging...</p>';
|
||||
try {
|
||||
const data = await api_js_1.api.settings(guildId);
|
||||
const cfg = data?.settings?.loggingConfig || data?.loggingConfig || {};
|
||||
container.innerHTML = `
|
||||
<h3 class="label">Logging</h3>
|
||||
<p class="muted">Channel: ${cfg.logChannelId || '-'}</p>
|
||||
<p class="muted">Join/Leave: ${cfg.categories?.joinLeave ? 'an' : 'aus'}</p>
|
||||
<p class="muted">System: ${cfg.categories?.system ? 'an' : 'aus'}</p>
|
||||
`;
|
||||
}
|
||||
catch (err) {
|
||||
console.error(err);
|
||||
container.innerHTML = '<div class="empty-state">Logging konnte nicht geladen werden.</div>';
|
||||
(0, toast_js_1.showToast)('Fehler beim Laden von Logging', true);
|
||||
}
|
||||
}
|
||||
37
public/ts-build/components/modules/reactionRoles.js
Normal file
37
public/ts-build/components/modules/reactionRoles.js
Normal file
@@ -0,0 +1,37 @@
|
||||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.renderReactionRolesModule = renderReactionRolesModule;
|
||||
const api_js_1 = require("../../services/api.js");
|
||||
const toast_js_1 = require("../../ui/toast.js");
|
||||
async function renderReactionRolesModule(guildId) {
|
||||
const container = document.getElementById('module-reactionroles');
|
||||
if (!container)
|
||||
return;
|
||||
container.innerHTML = '<p class="muted">Lade Reaction Roles...</p>';
|
||||
try {
|
||||
const data = await api_js_1.api.reactionRoles(guildId);
|
||||
const entries = data?.entries || data?.reactionRoles || [];
|
||||
container.innerHTML = '<h3 class="label">Reaction Roles</h3>';
|
||||
if (!entries.length) {
|
||||
container.innerHTML += '<div class="empty-state">Keine Reaction Roles.</div>';
|
||||
return;
|
||||
}
|
||||
const list = document.createElement('div');
|
||||
list.className = 'ticket-list';
|
||||
entries.slice(0, 3).forEach((e) => {
|
||||
const item = document.createElement('div');
|
||||
item.className = 'ticket-item';
|
||||
item.innerHTML = `
|
||||
<div style="font-weight:750;">${e.title || e.messageId || 'Eintrag'}</div>
|
||||
<div class="muted">${e.channelId || ''}</div>
|
||||
`;
|
||||
list.appendChild(item);
|
||||
});
|
||||
container.appendChild(list);
|
||||
}
|
||||
catch (err) {
|
||||
console.error(err);
|
||||
container.innerHTML = '<div class="empty-state">Reaction Roles konnten nicht geladen werden.</div>';
|
||||
(0, toast_js_1.showToast)('Fehler beim Laden der Reaction Roles', true);
|
||||
}
|
||||
}
|
||||
27
public/ts-build/components/modules/serverstats.js
Normal file
27
public/ts-build/components/modules/serverstats.js
Normal file
@@ -0,0 +1,27 @@
|
||||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.renderServerStatsModule = renderServerStatsModule;
|
||||
const api_js_1 = require("../../services/api.js");
|
||||
const toast_js_1 = require("../../ui/toast.js");
|
||||
async function renderServerStatsModule(guildId) {
|
||||
const container = document.getElementById('module-serverstats');
|
||||
if (!container)
|
||||
return;
|
||||
container.innerHTML = '<p class="muted">Lade Server Stats...</p>';
|
||||
try {
|
||||
const data = await api_js_1.api.serverStats(guildId);
|
||||
const cfg = data?.config || data || {};
|
||||
const items = cfg.items || [];
|
||||
container.innerHTML = `
|
||||
<h3 class="label">Server Stats</h3>
|
||||
<p class="muted">Kategorie: ${cfg.categoryId || '-'}</p>
|
||||
<p class="muted">Refresh: ${cfg.refresh || '-'}m</p>
|
||||
<p class="muted">Items: ${items.length}</p>
|
||||
`;
|
||||
}
|
||||
catch (err) {
|
||||
console.error(err);
|
||||
container.innerHTML = '<div class="empty-state">Server Stats konnten nicht geladen werden.</div>';
|
||||
(0, toast_js_1.showToast)('Fehler beim Laden der Server Stats', true);
|
||||
}
|
||||
}
|
||||
27
public/ts-build/components/modules/statuspage.js
Normal file
27
public/ts-build/components/modules/statuspage.js
Normal file
@@ -0,0 +1,27 @@
|
||||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.renderStatuspageModule = renderStatuspageModule;
|
||||
const api_js_1 = require("../../services/api.js");
|
||||
const toast_js_1 = require("../../ui/toast.js");
|
||||
async function renderStatuspageModule(guildId) {
|
||||
const container = document.getElementById('module-statuspage');
|
||||
if (!container)
|
||||
return;
|
||||
container.innerHTML = '<p class="muted">Lade Statuspage...</p>';
|
||||
try {
|
||||
const data = await api_js_1.api.statuspage(guildId);
|
||||
const cfg = data?.config || data || {};
|
||||
const services = cfg.services || [];
|
||||
container.innerHTML = `
|
||||
<h3 class="label">Statuspage</h3>
|
||||
<p class="muted">Channel: ${cfg.channelId || '-'}</p>
|
||||
<p class="muted">Intervall: ${cfg.interval || '-'}m</p>
|
||||
<p class="muted">Services: ${services.length}</p>
|
||||
`;
|
||||
}
|
||||
catch (err) {
|
||||
console.error(err);
|
||||
container.innerHTML = '<div class="empty-state">Statuspage konnte nicht geladen werden.</div>';
|
||||
(0, toast_js_1.showToast)('Fehler beim Laden der Statuspage', true);
|
||||
}
|
||||
}
|
||||
26
public/ts-build/components/modules/welcome.js
Normal file
26
public/ts-build/components/modules/welcome.js
Normal file
@@ -0,0 +1,26 @@
|
||||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.renderWelcomeModule = renderWelcomeModule;
|
||||
const api_js_1 = require("../../services/api.js");
|
||||
const toast_js_1 = require("../../ui/toast.js");
|
||||
async function renderWelcomeModule(guildId) {
|
||||
const container = document.getElementById('module-welcome');
|
||||
if (!container)
|
||||
return;
|
||||
container.innerHTML = '<p class="muted">Lade Welcome...</p>';
|
||||
try {
|
||||
const data = await api_js_1.api.settings(guildId);
|
||||
const cfg = data?.settings?.welcomeConfig || data?.welcomeConfig || {};
|
||||
container.innerHTML = `
|
||||
<h3 class="label">Welcome</h3>
|
||||
<p class="muted">Channel: ${cfg.channelId || '-'}</p>
|
||||
<p class="muted">Embed Titel: ${cfg.embedTitle || '-'}</p>
|
||||
<p class="muted">Status: ${data?.settings?.welcomeEnabled ? 'aktiv' : 'inaktiv'}</p>
|
||||
`;
|
||||
}
|
||||
catch (err) {
|
||||
console.error(err);
|
||||
container.innerHTML = '<div class="empty-state">Welcome konnte nicht geladen werden.</div>';
|
||||
(0, toast_js_1.showToast)('Fehler beim Laden von Welcome', true);
|
||||
}
|
||||
}
|
||||
37
public/ts-build/components/overview.js
Normal file
37
public/ts-build/components/overview.js
Normal file
@@ -0,0 +1,37 @@
|
||||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.renderOverview = renderOverview;
|
||||
const api_js_1 = require("../services/api.js");
|
||||
const toast_js_1 = require("../ui/toast.js");
|
||||
async function renderOverview(guildId) {
|
||||
const section = document.getElementById('section-overview');
|
||||
if (!section)
|
||||
return;
|
||||
section.innerHTML = '<p class="muted">Lade Uebersicht...</p>';
|
||||
try {
|
||||
const data = await api_js_1.api.overview(guildId);
|
||||
const stats = data?.stats || {};
|
||||
section.innerHTML = `
|
||||
<h2 class="section-title">Uebersicht</h2>
|
||||
<div class="grid">
|
||||
<div class="card">
|
||||
<p class="label">Tickets offen</p>
|
||||
<p class="stat">${stats.openTickets ?? '-'}</p>
|
||||
</div>
|
||||
<div class="card">
|
||||
<p class="label">Module aktiv</p>
|
||||
<p class="stat">${stats.activeModules ?? '-'}</p>
|
||||
</div>
|
||||
<div class="card">
|
||||
<p class="label">Events geplant</p>
|
||||
<p class="stat">${stats.events ?? '-'}</p>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
catch (err) {
|
||||
console.error(err);
|
||||
section.innerHTML = '<div class="empty-state">Uebersicht konnte nicht geladen werden.</div>';
|
||||
(0, toast_js_1.showToast)('Fehler beim Laden der Uebersicht', true);
|
||||
}
|
||||
}
|
||||
26
public/ts-build/components/settings.js
Normal file
26
public/ts-build/components/settings.js
Normal file
@@ -0,0 +1,26 @@
|
||||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.renderSettingsSection = renderSettingsSection;
|
||||
const api_js_1 = require("../services/api.js");
|
||||
const toast_js_1 = require("../ui/toast.js");
|
||||
async function renderSettingsSection(guildId) {
|
||||
const section = document.getElementById('section-settings');
|
||||
if (!section)
|
||||
return;
|
||||
section.innerHTML = '<p class="muted">Lade Einstellungen...</p>';
|
||||
try {
|
||||
const data = await api_js_1.api.settings(guildId);
|
||||
const settings = data?.settings || {};
|
||||
section.innerHTML = `
|
||||
<h2 class="section-title">Einstellungen</h2>
|
||||
<div class="card">
|
||||
<pre style="white-space:pre-wrap;">${JSON.stringify(settings, null, 2)}</pre>
|
||||
</div>
|
||||
`;
|
||||
}
|
||||
catch (err) {
|
||||
console.error(err);
|
||||
section.innerHTML = '<div class="empty-state">Einstellungen konnten nicht geladen werden.</div>';
|
||||
(0, toast_js_1.showToast)('Fehler beim Laden der Einstellungen', true);
|
||||
}
|
||||
}
|
||||
42
public/ts-build/components/tickets/automations.js
Normal file
42
public/ts-build/components/tickets/automations.js
Normal file
@@ -0,0 +1,42 @@
|
||||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.renderAutomations = renderAutomations;
|
||||
const api_js_1 = require("../../services/api.js");
|
||||
const toast_js_1 = require("../../ui/toast.js");
|
||||
async function renderAutomations(guildId) {
|
||||
const container = document.getElementById('tickets-automations');
|
||||
if (!container)
|
||||
return;
|
||||
container.innerHTML = '<p class="muted">Lade Automationen...</p>';
|
||||
try {
|
||||
const data = await api_js_1.api.automations(guildId);
|
||||
const rules = data?.rules || data || [];
|
||||
if (!rules.length) {
|
||||
container.innerHTML = '<div class="empty-state">Keine Regeln angelegt.</div>';
|
||||
return;
|
||||
}
|
||||
const list = document.createElement('div');
|
||||
list.className = 'ticket-list';
|
||||
rules.forEach((r) => {
|
||||
const item = document.createElement('div');
|
||||
item.className = 'ticket-item';
|
||||
item.innerHTML = `
|
||||
<div class="row" style="justify-content:space-between;">
|
||||
<div>
|
||||
<div style="font-weight:750;">${r.name || 'Regel'}</div>
|
||||
<div class="muted">${r.condition?.type || r.condition?.status || ''}</div>
|
||||
</div>
|
||||
<span class="pill">${r.active ? 'aktiv' : 'inaktiv'}</span>
|
||||
</div>
|
||||
`;
|
||||
list.appendChild(item);
|
||||
});
|
||||
container.innerHTML = '<h3 class="label">Automationen</h3>';
|
||||
container.appendChild(list);
|
||||
}
|
||||
catch (err) {
|
||||
console.error(err);
|
||||
container.innerHTML = '<div class="empty-state">Automationen konnten nicht geladen werden.</div>';
|
||||
(0, toast_js_1.showToast)('Fehler beim Laden der Automationen', true);
|
||||
}
|
||||
}
|
||||
32
public/ts-build/components/tickets/index.js
Normal file
32
public/ts-build/components/tickets/index.js
Normal file
@@ -0,0 +1,32 @@
|
||||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.initTicketsSection = initTicketsSection;
|
||||
const list_js_1 = require("./list.js");
|
||||
const pipeline_js_1 = require("./pipeline.js");
|
||||
const sla_js_1 = require("./sla.js");
|
||||
const automations_js_1 = require("./automations.js");
|
||||
const kb_js_1 = require("./kb.js");
|
||||
async function initTicketsSection(guildId) {
|
||||
const section = document.getElementById('section-tickets');
|
||||
if (!section)
|
||||
return;
|
||||
section.innerHTML = `
|
||||
<h2 class="section-title">Tickets</h2>
|
||||
<div class="tickets-grid">
|
||||
<div class="card" id="tickets-list"></div>
|
||||
<div class="card" id="tickets-pipeline"></div>
|
||||
<div class="card" id="tickets-sla"></div>
|
||||
</div>
|
||||
<div class="grid" style="margin-top:16px;">
|
||||
<div class="card" id="tickets-automations"></div>
|
||||
<div class="card" id="tickets-kb"></div>
|
||||
</div>
|
||||
`;
|
||||
await Promise.all([
|
||||
(0, list_js_1.renderTicketList)(guildId),
|
||||
(0, pipeline_js_1.renderPipeline)(guildId),
|
||||
(0, sla_js_1.renderSla)(guildId),
|
||||
(0, automations_js_1.renderAutomations)(guildId),
|
||||
(0, kb_js_1.renderKb)(guildId)
|
||||
]);
|
||||
}
|
||||
37
public/ts-build/components/tickets/kb.js
Normal file
37
public/ts-build/components/tickets/kb.js
Normal file
@@ -0,0 +1,37 @@
|
||||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.renderKb = renderKb;
|
||||
const api_js_1 = require("../../services/api.js");
|
||||
const toast_js_1 = require("../../ui/toast.js");
|
||||
async function renderKb(guildId) {
|
||||
const container = document.getElementById('tickets-kb');
|
||||
if (!container)
|
||||
return;
|
||||
container.innerHTML = '<p class="muted">Lade Knowledge Base...</p>';
|
||||
try {
|
||||
const data = await api_js_1.api.kb(guildId);
|
||||
const entries = data?.articles || data?.kb || [];
|
||||
if (!entries.length) {
|
||||
container.innerHTML = '<div class="empty-state">Keine KB-Eintraege.</div>';
|
||||
return;
|
||||
}
|
||||
const list = document.createElement('div');
|
||||
list.className = 'ticket-list';
|
||||
entries.slice(0, 4).forEach((k) => {
|
||||
const item = document.createElement('div');
|
||||
item.className = 'ticket-item';
|
||||
item.innerHTML = `
|
||||
<div style="font-weight:750;">${k.title || 'Artikel'}</div>
|
||||
<div class="muted">${k.keywords || ''}</div>
|
||||
`;
|
||||
list.appendChild(item);
|
||||
});
|
||||
container.innerHTML = '<h3 class="label">Knowledge Base</h3>';
|
||||
container.appendChild(list);
|
||||
}
|
||||
catch (err) {
|
||||
console.error(err);
|
||||
container.innerHTML = '<div class="empty-state">KB konnte nicht geladen werden.</div>';
|
||||
(0, toast_js_1.showToast)('Fehler beim Laden der KB', true);
|
||||
}
|
||||
}
|
||||
43
public/ts-build/components/tickets/list.js
Normal file
43
public/ts-build/components/tickets/list.js
Normal file
@@ -0,0 +1,43 @@
|
||||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.renderTicketList = renderTicketList;
|
||||
const api_js_1 = require("../../services/api.js");
|
||||
const toast_js_1 = require("../../ui/toast.js");
|
||||
async function renderTicketList(guildId) {
|
||||
const container = document.getElementById('tickets-list');
|
||||
if (!container)
|
||||
return;
|
||||
container.innerHTML = '<p class="muted">Lade Tickets...</p>';
|
||||
try {
|
||||
const data = await api_js_1.api.tickets(guildId);
|
||||
const tickets = data?.tickets || [];
|
||||
if (!tickets.length) {
|
||||
container.innerHTML = '<div class="empty-state">Keine Tickets</div>';
|
||||
return;
|
||||
}
|
||||
const list = document.createElement('div');
|
||||
list.className = 'ticket-list';
|
||||
tickets.slice(0, 5).forEach((t) => {
|
||||
const item = document.createElement('div');
|
||||
item.className = 'ticket-item';
|
||||
item.innerHTML = `
|
||||
<div class="row" style="justify-content:space-between;">
|
||||
<div>
|
||||
<div style="font-weight:750;font-size:15px;">${t.title || t.id}</div>
|
||||
<div class="muted">${t.user || ''}</div>
|
||||
</div>
|
||||
<div class="ticket-status status-${t.status || 'open'}">${t.status || 'open'}</div>
|
||||
</div>
|
||||
<div class="muted">${t.description || ''}</div>
|
||||
`;
|
||||
list.appendChild(item);
|
||||
});
|
||||
container.innerHTML = '<h3 class="label">Aktuelle Tickets</h3>';
|
||||
container.appendChild(list);
|
||||
}
|
||||
catch (err) {
|
||||
console.error(err);
|
||||
container.innerHTML = '<div class="empty-state">Tickets konnten nicht geladen werden.</div>';
|
||||
(0, toast_js_1.showToast)('Fehler beim Laden der Tickets', true);
|
||||
}
|
||||
}
|
||||
37
public/ts-build/components/tickets/pipeline.js
Normal file
37
public/ts-build/components/tickets/pipeline.js
Normal file
@@ -0,0 +1,37 @@
|
||||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.renderPipeline = renderPipeline;
|
||||
const api_js_1 = require("../../services/api.js");
|
||||
const toast_js_1 = require("../../ui/toast.js");
|
||||
async function renderPipeline(guildId) {
|
||||
const container = document.getElementById('tickets-pipeline');
|
||||
if (!container)
|
||||
return;
|
||||
container.innerHTML = '<p class="muted">Lade Pipeline...</p>';
|
||||
try {
|
||||
const data = await api_js_1.api.pipeline(guildId);
|
||||
const lanes = data?.lanes || [];
|
||||
container.innerHTML = '<h3 class="label">Pipeline</h3>';
|
||||
if (!lanes.length) {
|
||||
container.innerHTML += '<div class="empty-state">Keine Pipeline-Daten</div>';
|
||||
return;
|
||||
}
|
||||
const grid = document.createElement('div');
|
||||
grid.className = 'grid';
|
||||
lanes.forEach((lane) => {
|
||||
const card = document.createElement('div');
|
||||
card.className = 'card';
|
||||
card.innerHTML = `
|
||||
<p class="label">${lane.name || 'Lane'}</p>
|
||||
<p class="stat">${lane.count ?? 0}</p>
|
||||
`;
|
||||
grid.appendChild(card);
|
||||
});
|
||||
container.appendChild(grid);
|
||||
}
|
||||
catch (err) {
|
||||
console.error(err);
|
||||
container.innerHTML = '<div class="empty-state">Pipeline konnte nicht geladen werden.</div>';
|
||||
(0, toast_js_1.showToast)('Fehler beim Laden der Pipeline', true);
|
||||
}
|
||||
}
|
||||
25
public/ts-build/components/tickets/sla.js
Normal file
25
public/ts-build/components/tickets/sla.js
Normal file
@@ -0,0 +1,25 @@
|
||||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.renderSla = renderSla;
|
||||
const api_js_1 = require("../../services/api.js");
|
||||
const toast_js_1 = require("../../ui/toast.js");
|
||||
async function renderSla(guildId) {
|
||||
const container = document.getElementById('tickets-sla');
|
||||
if (!container)
|
||||
return;
|
||||
container.innerHTML = '<p class="muted">Lade SLA...</p>';
|
||||
try {
|
||||
const data = await api_js_1.api.sla(guildId);
|
||||
const stats = data?.stats || {};
|
||||
container.innerHTML = `
|
||||
<h3 class="label">SLA</h3>
|
||||
<p class="stat">${stats.averageResponse ?? '-'}m</p>
|
||||
<p class="muted">Durchschnittliche Antwortzeit</p>
|
||||
`;
|
||||
}
|
||||
catch (err) {
|
||||
console.error(err);
|
||||
container.innerHTML = '<div class="empty-state">SLA konnte nicht geladen werden.</div>';
|
||||
(0, toast_js_1.showToast)('Fehler beim Laden der SLA', true);
|
||||
}
|
||||
}
|
||||
69
public/ts-build/core/app.js
Normal file
69
public/ts-build/core/app.js
Normal file
@@ -0,0 +1,69 @@
|
||||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
const api_js_1 = require("../services/api.js");
|
||||
const store_js_1 = require("../state/store.js");
|
||||
const navigation_js_1 = require("../ui/navigation.js");
|
||||
const toast_js_1 = require("../ui/toast.js");
|
||||
const guildSelect_js_1 = require("../components/guildSelect.js");
|
||||
const dashboard_js_1 = require("../components/dashboard.js");
|
||||
function readConfig() {
|
||||
const root = document.getElementById('app');
|
||||
if (!root)
|
||||
throw new Error('App-Container fehlt');
|
||||
const view = root.dataset.view || 'selection';
|
||||
const baseRoot = root.dataset.baseRoot || '/ucp';
|
||||
const baseDashboard = root.dataset.baseDashboard || `${baseRoot}/dashboard`;
|
||||
const baseAuth = root.dataset.baseAuth || `${baseRoot}/auth`;
|
||||
const baseApi = root.dataset.baseApi || `${baseRoot}/api`;
|
||||
const initialGuildId = root.dataset.guildId || undefined;
|
||||
const isAdmin = root.dataset.userAdmin === 'true';
|
||||
const userLabel = root.dataset.userName
|
||||
? `${root.dataset.userName}${root.dataset.userDisc ? '#' + root.dataset.userDisc : ''}`
|
||||
: undefined;
|
||||
(0, store_js_1.initConfig)({ baseRoot, baseDashboard, baseAuth, baseApi, view, initialGuildId, isAdmin, userLabel });
|
||||
}
|
||||
async function ensureAuth() {
|
||||
try {
|
||||
const me = await api_js_1.api.me();
|
||||
if (!me?.user) {
|
||||
const cfg = (0, store_js_1.getConfig)();
|
||||
window.location.href = (cfg?.baseAuth || '/auth') + '/discord';
|
||||
return null;
|
||||
}
|
||||
const userInfo = document.getElementById('userInfo');
|
||||
if (userInfo && me.user)
|
||||
userInfo.textContent = `${me.user.username}#${me.user.discriminator}`;
|
||||
(0, store_js_1.setState)({ isAdmin: !!me.user?.isAdmin, userLabel: me.user ? `${me.user.username}#${me.user.discriminator}` : undefined });
|
||||
return me;
|
||||
}
|
||||
catch (err) {
|
||||
console.error(err);
|
||||
(0, toast_js_1.showToast)('Authentifizierung fehlgeschlagen', true);
|
||||
return null;
|
||||
}
|
||||
}
|
||||
async function bootstrap() {
|
||||
readConfig();
|
||||
const cfg = (0, store_js_1.getConfig)();
|
||||
if (!cfg)
|
||||
return;
|
||||
const sidebarRoot = document.getElementById('sidebar-root');
|
||||
if (sidebarRoot)
|
||||
(0, navigation_js_1.renderSidebar)(sidebarRoot, !!cfg.isAdmin);
|
||||
if (cfg.view === 'selection') {
|
||||
(0, guildSelect_js_1.initSelectionView)();
|
||||
}
|
||||
else {
|
||||
await ensureAuth();
|
||||
(0, dashboard_js_1.initDashboardView)();
|
||||
(0, navigation_js_1.initNavigation)((section) => {
|
||||
// Sections werden innerhalb der jeweiligen Komponenten bedient
|
||||
if (section === 'admin' && !cfg.isAdmin)
|
||||
(0, toast_js_1.showToast)('Kein Admin-Recht', true);
|
||||
});
|
||||
}
|
||||
}
|
||||
bootstrap().catch((err) => {
|
||||
console.error(err);
|
||||
(0, toast_js_1.showToast)('Fehler beim Laden', true);
|
||||
});
|
||||
74
public/ts-build/services/api.js
Normal file
74
public/ts-build/services/api.js
Normal file
@@ -0,0 +1,74 @@
|
||||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.api = void 0;
|
||||
const store_js_1 = require("../state/store.js");
|
||||
function buildUrl(path, query) {
|
||||
const cfg = (0, store_js_1.getConfig)();
|
||||
const base = cfg?.baseApi || '';
|
||||
const url = new URL(path.startsWith('http') ? path : `${base}${path}`, window.location.origin);
|
||||
if (query) {
|
||||
Object.entries(query).forEach(([k, v]) => {
|
||||
if (v === undefined || v === null)
|
||||
return;
|
||||
url.searchParams.set(k, String(v));
|
||||
});
|
||||
}
|
||||
return url.toString();
|
||||
}
|
||||
async function request(path, options = {}) {
|
||||
const { query, headers, ...rest } = options;
|
||||
const url = buildUrl(path, query);
|
||||
const res = await fetch(url, {
|
||||
...rest,
|
||||
headers: {
|
||||
'Content-Type': 'application/json',
|
||||
...(headers || {})
|
||||
}
|
||||
});
|
||||
if (!res.ok) {
|
||||
const text = await res.text().catch(() => res.statusText);
|
||||
throw new Error(`Request failed: ${res.status} ${text}`);
|
||||
}
|
||||
const contentType = res.headers.get('content-type');
|
||||
if (contentType && contentType.includes('application/json')) {
|
||||
return (await res.json());
|
||||
}
|
||||
return (await res.text());
|
||||
}
|
||||
exports.api = {
|
||||
me: () => request('/me'),
|
||||
guilds: () => request('/guilds'),
|
||||
overview: (guildId) => request(`/overview`, { query: { guildId } }),
|
||||
settings: (guildId) => request(`/settings`, { query: { guildId } }),
|
||||
saveSettings: (payload) => request('/settings', { method: 'POST', body: JSON.stringify(payload) }),
|
||||
modules: (guildId) => request(`/modules`, { query: { guildId } }),
|
||||
tickets: (guildId) => request(`/tickets`, { query: { guildId } }),
|
||||
pipeline: (guildId, filter) => request(`/tickets/pipeline`, { query: { guildId, filter } }),
|
||||
sla: (guildId, range) => request(`/tickets/sla`, { query: { guildId, range } }),
|
||||
automations: (guildId) => request(`/automations`, { query: { guildId } }),
|
||||
saveAutomation: (payload) => request(payload['id'] ? `/automations/${payload['id']}` : '/automations', {
|
||||
method: payload['id'] ? 'PUT' : 'POST',
|
||||
body: JSON.stringify(payload)
|
||||
}),
|
||||
kb: (guildId) => request(`/kb`, { query: { guildId } }),
|
||||
saveKb: (payload) => request(payload['id'] ? `/kb/${payload['id']}` : '/kb', {
|
||||
method: payload['id'] ? 'PUT' : 'POST',
|
||||
body: JSON.stringify(payload)
|
||||
}),
|
||||
reactionRoles: (guildId) => request(`/reactionroles`, { query: { guildId } }),
|
||||
saveReactionRole: (payload) => request(payload.id ? `/reactionroles/${payload.id}` : '/reactionroles', {
|
||||
method: payload.id ? 'PUT' : 'POST',
|
||||
body: JSON.stringify(payload)
|
||||
}),
|
||||
events: (guildId) => request(`/events`, { query: { guildId } }),
|
||||
saveEvent: (payload) => request(payload.id ? `/events/${payload.id}` : '/events', {
|
||||
method: payload.id ? 'PUT' : 'POST',
|
||||
body: JSON.stringify(payload)
|
||||
}),
|
||||
statuspage: (guildId) => request(`/statuspage`, { query: { guildId } }),
|
||||
saveStatuspage: (payload) => request('/statuspage', { method: 'POST', body: JSON.stringify(payload) }),
|
||||
serverStats: (guildId) => request(`/serverstats`, { query: { guildId } }),
|
||||
saveServerStats: (payload) => request('/serverstats', { method: 'POST', body: JSON.stringify(payload) }),
|
||||
dynamicVoice: (guildId) => request(`/dynamicvoice`, { query: { guildId } }),
|
||||
saveDynamicVoice: (payload) => request('/dynamicvoice', { method: 'POST', body: JSON.stringify(payload) })
|
||||
};
|
||||
32
public/ts-build/state/store.js
Normal file
32
public/ts-build/state/store.js
Normal file
@@ -0,0 +1,32 @@
|
||||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.initConfig = initConfig;
|
||||
exports.getConfig = getConfig;
|
||||
exports.getState = getState;
|
||||
exports.setState = setState;
|
||||
exports.subscribe = subscribe;
|
||||
let config = null;
|
||||
let state = {};
|
||||
const listeners = new Set();
|
||||
function initConfig(next) {
|
||||
config = next;
|
||||
state = {
|
||||
guildId: next.initialGuildId,
|
||||
isAdmin: next.isAdmin,
|
||||
userLabel: next.userLabel
|
||||
};
|
||||
}
|
||||
function getConfig() {
|
||||
return config;
|
||||
}
|
||||
function getState() {
|
||||
return state;
|
||||
}
|
||||
function setState(partial) {
|
||||
state = { ...state, ...partial };
|
||||
listeners.forEach((l) => l(state));
|
||||
}
|
||||
function subscribe(listener) {
|
||||
listeners.add(listener);
|
||||
return () => listeners.delete(listener);
|
||||
}
|
||||
27
public/ts-build/ui/modal.js
Normal file
27
public/ts-build/ui/modal.js
Normal file
@@ -0,0 +1,27 @@
|
||||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.showModal = showModal;
|
||||
exports.hideModal = hideModal;
|
||||
let activeModal = null;
|
||||
let backdrop = null;
|
||||
function ensureBackdrop() {
|
||||
if (backdrop)
|
||||
return backdrop;
|
||||
backdrop = document.createElement('div');
|
||||
backdrop.className = 'modal-backdrop';
|
||||
backdrop.addEventListener('click', hideModal);
|
||||
document.body.appendChild(backdrop);
|
||||
return backdrop;
|
||||
}
|
||||
function showModal(content) {
|
||||
const bd = ensureBackdrop();
|
||||
if (!content.parentElement)
|
||||
bd.appendChild(content);
|
||||
activeModal = content;
|
||||
bd.classList.add('show');
|
||||
}
|
||||
function hideModal() {
|
||||
if (backdrop)
|
||||
backdrop.classList.remove('show');
|
||||
activeModal = null;
|
||||
}
|
||||
57
public/ts-build/ui/navigation.js
Normal file
57
public/ts-build/ui/navigation.js
Normal file
@@ -0,0 +1,57 @@
|
||||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.renderSidebar = renderSidebar;
|
||||
exports.initNavigation = initNavigation;
|
||||
const store_js_1 = require("../state/store.js");
|
||||
const defaultNav = [
|
||||
{ id: 'overview', label: 'Uebersicht', icon: '[*]' },
|
||||
{ id: 'tickets', label: 'Ticketsystem', icon: '[*]' },
|
||||
{ id: 'modules', label: 'Module', icon: '[*]' },
|
||||
{ id: 'settings', label: 'Einstellungen', icon: '[*]' },
|
||||
{ id: 'events', label: 'Events', icon: '[*]' },
|
||||
{ id: 'admin', label: 'Admin', icon: '[*]', requiresAdmin: true }
|
||||
];
|
||||
function renderSidebar(container, isAdmin) {
|
||||
container.innerHTML = '';
|
||||
const brand = document.createElement('div');
|
||||
brand.className = 'brand';
|
||||
brand.textContent = 'Papo Control';
|
||||
const nav = document.createElement('div');
|
||||
nav.className = 'nav';
|
||||
defaultNav.forEach((item) => {
|
||||
if (item.requiresAdmin && !isAdmin)
|
||||
return;
|
||||
const a = document.createElement('a');
|
||||
a.href = `#${item.id}`;
|
||||
a.dataset.target = item.id;
|
||||
a.innerHTML = `<span class="icon">${item.icon || ''}</span>${item.label}`;
|
||||
nav.appendChild(a);
|
||||
});
|
||||
container.appendChild(brand);
|
||||
container.appendChild(nav);
|
||||
}
|
||||
function initNavigation(onChange) {
|
||||
const navLinks = Array.from(document.querySelectorAll('.nav a'));
|
||||
const activate = (section) => {
|
||||
navLinks.forEach((link) => link.classList.toggle('active', link.dataset.target === section));
|
||||
document.querySelectorAll('.section').forEach((sec) => {
|
||||
sec.classList.toggle('active', sec.id === `section-${section}`);
|
||||
});
|
||||
(0, store_js_1.setState)({}); // trigger listeners for potential observers
|
||||
onChange(section);
|
||||
};
|
||||
navLinks.forEach((link) => {
|
||||
link.addEventListener('click', (e) => {
|
||||
e.preventDefault();
|
||||
const target = link.dataset.target || 'overview';
|
||||
history.replaceState(null, '', `#${target}`);
|
||||
activate(target);
|
||||
});
|
||||
});
|
||||
const initial = (location.hash || '#overview').replace('#', '');
|
||||
activate(initial);
|
||||
window.addEventListener('hashchange', () => {
|
||||
const section = (location.hash || '#overview').replace('#', '');
|
||||
activate(section);
|
||||
});
|
||||
}
|
||||
19
public/ts-build/ui/switch.js
Normal file
19
public/ts-build/ui/switch.js
Normal file
@@ -0,0 +1,19 @@
|
||||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.toggleSwitch = toggleSwitch;
|
||||
exports.getSwitch = getSwitch;
|
||||
exports.setSwitch = setSwitch;
|
||||
function toggleSwitch(el, force) {
|
||||
if (!el)
|
||||
return;
|
||||
const next = force === undefined ? !el.classList.contains('on') : force;
|
||||
el.classList.toggle('on', next);
|
||||
}
|
||||
function getSwitch(el) {
|
||||
return el?.classList.contains('on') ?? false;
|
||||
}
|
||||
function setSwitch(el, value) {
|
||||
if (!el)
|
||||
return;
|
||||
el.classList.toggle('on', value);
|
||||
}
|
||||
27
public/ts-build/ui/toast.js
Normal file
27
public/ts-build/ui/toast.js
Normal file
@@ -0,0 +1,27 @@
|
||||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
exports.showToast = showToast;
|
||||
exports.hideToast = hideToast;
|
||||
let currentTimeout = null;
|
||||
function showToast(message, isError = false, duration = 2500) {
|
||||
let toast = document.getElementById('toast-root');
|
||||
if (!toast) {
|
||||
toast = document.createElement('div');
|
||||
toast.id = 'toast-root';
|
||||
document.body.appendChild(toast);
|
||||
}
|
||||
toast.className = `toast ${isError ? 'error' : ''}`;
|
||||
toast.textContent = message;
|
||||
requestAnimationFrame(() => {
|
||||
toast?.classList.add('show');
|
||||
});
|
||||
if (currentTimeout)
|
||||
window.clearTimeout(currentTimeout);
|
||||
currentTimeout = window.setTimeout(() => hideToast(), duration);
|
||||
}
|
||||
function hideToast() {
|
||||
const toast = document.getElementById('toast-root');
|
||||
if (!toast)
|
||||
return;
|
||||
toast.classList.remove('show');
|
||||
}
|
||||
Reference in New Issue
Block a user