asdasd
This commit is contained in:
126
custom/apps/boersenchecker/assets/boersenchecker-native.js
Normal file
126
custom/apps/boersenchecker/assets/boersenchecker-native.js
Normal file
@@ -0,0 +1,126 @@
|
||||
(function () {
|
||||
'use strict';
|
||||
|
||||
function toPartialUrl(input, fallbackView) {
|
||||
const url = new URL(input, window.location.origin);
|
||||
if (!url.searchParams.has('view') && fallbackView) {
|
||||
url.searchParams.set('view', fallbackView);
|
||||
}
|
||||
url.searchParams.set('partial', '1');
|
||||
return url;
|
||||
}
|
||||
|
||||
async function fetchHtml(url, options) {
|
||||
const response = await fetch(url.toString(), {
|
||||
credentials: 'same-origin',
|
||||
headers: {
|
||||
Accept: 'text/html',
|
||||
'X-Requested-With': 'XMLHttpRequest'
|
||||
},
|
||||
...options
|
||||
});
|
||||
|
||||
if (!response.ok) {
|
||||
throw new Error(`HTTP ${response.status}`);
|
||||
}
|
||||
|
||||
return response.text();
|
||||
}
|
||||
|
||||
function enhanceHost(host, state) {
|
||||
host.querySelectorAll('a[href]').forEach((link) => {
|
||||
const href = link.getAttribute('href') || '';
|
||||
if (!href.startsWith('/apps/boersenchecker')) {
|
||||
return;
|
||||
}
|
||||
|
||||
link.addEventListener('click', (event) => {
|
||||
event.preventDefault();
|
||||
state.load(href);
|
||||
});
|
||||
});
|
||||
|
||||
host.querySelectorAll('form').forEach((form) => {
|
||||
form.addEventListener('submit', async (event) => {
|
||||
event.preventDefault();
|
||||
|
||||
const method = String(form.getAttribute('method') || 'get').toUpperCase();
|
||||
const action = form.getAttribute('action') || state.currentUrl.toString();
|
||||
const formData = new FormData(form);
|
||||
const url = toPartialUrl(action, state.defaultView);
|
||||
|
||||
try {
|
||||
if (method === 'GET') {
|
||||
const next = new URL(url.toString());
|
||||
next.search = '';
|
||||
next.searchParams.set('partial', '1');
|
||||
for (const [key, value] of formData.entries()) {
|
||||
next.searchParams.append(key, String(value));
|
||||
}
|
||||
await state.load(next.toString());
|
||||
return;
|
||||
}
|
||||
|
||||
const html = await fetchHtml(url, {
|
||||
method,
|
||||
body: formData
|
||||
});
|
||||
state.render(html, url);
|
||||
} catch (error) {
|
||||
state.renderError(error);
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
window.initBoersencheckerApp = function initBoersencheckerApp(host, options) {
|
||||
if (!(host instanceof HTMLElement)) {
|
||||
return;
|
||||
}
|
||||
|
||||
const entryRoute = String(options?.entryRoute || '/apps/boersenchecker/index.php');
|
||||
const defaultView = String(options?.defaultView || 'overview');
|
||||
|
||||
const state = {
|
||||
defaultView,
|
||||
currentUrl: toPartialUrl(entryRoute, defaultView),
|
||||
async load(targetUrl) {
|
||||
const url = toPartialUrl(targetUrl, defaultView);
|
||||
this.currentUrl = url;
|
||||
host.innerHTML = '<div class="window-app-loading"><p>Börsenchecker wird geladen...</p></div>';
|
||||
try {
|
||||
const html = await fetchHtml(url);
|
||||
this.render(html, url);
|
||||
} catch (error) {
|
||||
this.renderError(error);
|
||||
}
|
||||
},
|
||||
render(html, url) {
|
||||
this.currentUrl = url;
|
||||
host.innerHTML = html;
|
||||
enhanceHost(host, this);
|
||||
if (typeof window.initBoersencheckerCharts === 'function') {
|
||||
try {
|
||||
window.initBoersencheckerCharts(host);
|
||||
} catch (error) {
|
||||
const message = error instanceof Error ? error.message : 'Chart-Initialisierung fehlgeschlagen.';
|
||||
const statusNode = host.querySelector('[data-bc-chart-status]');
|
||||
const chartNode = host.querySelector('[data-bc-chart]');
|
||||
if (statusNode instanceof HTMLElement) {
|
||||
statusNode.textContent = message;
|
||||
}
|
||||
if (chartNode instanceof HTMLElement) {
|
||||
chartNode.innerHTML = `<div class="muted">${message}</div>`;
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
renderError(error) {
|
||||
const message = error instanceof Error ? error.message : 'Börsenchecker konnte nicht geladen werden.';
|
||||
host.innerHTML = `<div class="window-app-error-state"><p>${message}</p></div>`;
|
||||
}
|
||||
};
|
||||
|
||||
state.load(entryRoute);
|
||||
};
|
||||
})();
|
||||
402
custom/apps/boersenchecker/assets/boersenchecker.css
Normal file
402
custom/apps/boersenchecker/assets/boersenchecker.css
Normal file
@@ -0,0 +1,402 @@
|
||||
.bc-page {
|
||||
--bc-accent: var(--brand-accent);
|
||||
--bc-accent-strong: var(--brand-accent-2);
|
||||
--bc-ink: var(--text);
|
||||
--bc-text: var(--text);
|
||||
--bc-muted: var(--muted);
|
||||
--bc-line: var(--line);
|
||||
--bc-panel: rgba(255, 255, 255, 0.78);
|
||||
--bc-panel-soft: rgba(248, 252, 252, 0.92);
|
||||
--bc-positive: #137333;
|
||||
--bc-negative: #c62828;
|
||||
color: var(--bc-text);
|
||||
}
|
||||
|
||||
.bc-frame {
|
||||
height: 100%;
|
||||
min-height: 0;
|
||||
}
|
||||
|
||||
.bc-sidebar {
|
||||
gap: 0;
|
||||
}
|
||||
|
||||
.bc-brand {
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
|
||||
.bc-nav-list {
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.bc-nav-button {
|
||||
text-decoration: none;
|
||||
}
|
||||
|
||||
.bc-nav-button strong {
|
||||
display: block;
|
||||
margin-bottom: 4px;
|
||||
}
|
||||
|
||||
.bc-main {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
.bc-panel-shell {
|
||||
max-width: 1280px;
|
||||
}
|
||||
|
||||
.bc-hero {
|
||||
align-items: flex-start;
|
||||
}
|
||||
|
||||
.bc-pill-row {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.bc-pill {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
min-height: 36px;
|
||||
padding: 8px 14px;
|
||||
border-radius: 999px;
|
||||
border: 1px solid color-mix(in srgb, var(--bc-accent) 34%, transparent);
|
||||
background: color-mix(in srgb, var(--bc-accent) 10%, white);
|
||||
color: var(--bc-text);
|
||||
font-size: 0.86rem;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.bc-page {
|
||||
display: grid;
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
.bc-text {
|
||||
color: var(--bc-muted);
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.bc-section-head {
|
||||
display: flex;
|
||||
align-items: start;
|
||||
justify-content: space-between;
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
.bc-section-title {
|
||||
margin: 0;
|
||||
font-size: 1.45rem;
|
||||
line-height: 1.15;
|
||||
}
|
||||
|
||||
.bc-section-head p,
|
||||
.bc-section-copy {
|
||||
color: var(--bc-muted);
|
||||
margin: 8px 0 0;
|
||||
}
|
||||
|
||||
.bc-form-card,
|
||||
.bc-panel,
|
||||
.bc-stat,
|
||||
.bc-chart-card,
|
||||
.bc-position-row {
|
||||
border: 1px solid var(--bc-line);
|
||||
border-radius: 22px;
|
||||
background: var(--bc-panel);
|
||||
box-shadow: 0 10px 24px rgba(1, 22, 32, 0.06);
|
||||
}
|
||||
|
||||
.bc-form-card,
|
||||
.bc-panel,
|
||||
.bc-chart-card {
|
||||
padding: 18px;
|
||||
}
|
||||
|
||||
.bc-stat {
|
||||
padding: 16px;
|
||||
}
|
||||
|
||||
.bc-field-label {
|
||||
font-size: 0.85rem;
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.08em;
|
||||
color: var(--bc-muted);
|
||||
}
|
||||
|
||||
.bc-tabs {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 10px;
|
||||
}
|
||||
|
||||
.bc-button,
|
||||
.bc-tabs a,
|
||||
.bc-page button,
|
||||
.bc-page input,
|
||||
.bc-page select,
|
||||
.bc-page textarea {
|
||||
font: inherit;
|
||||
}
|
||||
|
||||
.bc-button {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border: 1px solid transparent;
|
||||
border-radius: 16px;
|
||||
padding: 12px 16px;
|
||||
cursor: pointer;
|
||||
text-decoration: none;
|
||||
transition: 160ms ease;
|
||||
}
|
||||
|
||||
.bc-button:hover {
|
||||
transform: translateY(-1px);
|
||||
}
|
||||
|
||||
.bc-button--tab {
|
||||
background: rgba(255, 255, 255, 0.94);
|
||||
color: var(--bc-ink);
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.bc-button--tab-active {
|
||||
background: linear-gradient(135deg, var(--bc-accent), var(--brand-accent-3));
|
||||
color: #fff7fb;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.bc-button--primary {
|
||||
background: linear-gradient(135deg, var(--bc-accent), var(--brand-accent-3));
|
||||
color: #fff7fb;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.bc-button--secondary {
|
||||
background: rgba(255, 255, 255, 0.94);
|
||||
color: var(--bc-ink);
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.bc-button--ghost {
|
||||
background: color-mix(in srgb, var(--bc-accent) 14%, transparent);
|
||||
border-color: color-mix(in srgb, var(--bc-accent) 34%, transparent);
|
||||
color: var(--bc-accent);
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.bc-actions {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.bc-alert {
|
||||
padding: 16px 18px;
|
||||
border-radius: 20px;
|
||||
border: 1px solid transparent;
|
||||
}
|
||||
|
||||
.bc-alert--error {
|
||||
background: rgba(127, 29, 29, 0.28);
|
||||
border-color: rgba(252, 165, 165, 0.24);
|
||||
color: #fecaca;
|
||||
}
|
||||
|
||||
.bc-alert--success {
|
||||
background: rgba(6, 78, 59, 0.28);
|
||||
border-color: rgba(134, 239, 172, 0.24);
|
||||
color: #bbf7d0;
|
||||
}
|
||||
|
||||
.bc-toolbar,
|
||||
.bc-overview-grid,
|
||||
.bc-card-grid {
|
||||
display: grid;
|
||||
gap: 14px;
|
||||
}
|
||||
|
||||
.bc-toolbar {
|
||||
grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
|
||||
}
|
||||
|
||||
.bc-overview-grid {
|
||||
grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
|
||||
}
|
||||
|
||||
.bc-card-grid {
|
||||
grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
|
||||
}
|
||||
|
||||
.bc-stat-value {
|
||||
margin-top: 8px;
|
||||
font-size: 1.42rem;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.bc-chart-shell {
|
||||
position: relative;
|
||||
min-height: 360px;
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
.bc-chart-svg {
|
||||
width: 100%;
|
||||
height: 340px;
|
||||
display: block;
|
||||
}
|
||||
|
||||
.bc-chart-path {
|
||||
fill: none;
|
||||
stroke: var(--bc-accent);
|
||||
stroke-width: 3;
|
||||
stroke-linecap: round;
|
||||
stroke-linejoin: round;
|
||||
filter: drop-shadow(0 12px 24px color-mix(in srgb, var(--bc-accent) 18%, transparent));
|
||||
}
|
||||
|
||||
.bc-chart-area {
|
||||
fill: url(#bc-chart-fill);
|
||||
}
|
||||
|
||||
.bc-chart-grid line {
|
||||
stroke: rgba(16, 33, 43, 0.08);
|
||||
stroke-dasharray: 4 6;
|
||||
}
|
||||
|
||||
.bc-range-list {
|
||||
display: flex;
|
||||
gap: 10px;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.bc-range-button {
|
||||
border: 1px solid color-mix(in srgb, var(--bc-accent) 26%, transparent);
|
||||
background: rgba(255, 255, 255, 0.76);
|
||||
color: var(--bc-text);
|
||||
padding: 8px 12px;
|
||||
border-radius: 999px;
|
||||
cursor: pointer;
|
||||
transition: transform .18s ease, background .18s ease, border-color .18s ease;
|
||||
}
|
||||
|
||||
.bc-range-button:hover,
|
||||
.bc-range-button[aria-pressed="true"] {
|
||||
transform: translateY(-1px);
|
||||
background: color-mix(in srgb, var(--bc-accent) 18%, transparent);
|
||||
border-color: color-mix(in srgb, var(--bc-accent) 42%, transparent);
|
||||
}
|
||||
|
||||
.bc-panel-fade {
|
||||
animation: bcPanelFade .35s ease;
|
||||
}
|
||||
|
||||
@keyframes bcPanelFade {
|
||||
from { opacity: 0; transform: translateY(8px) scale(.99); }
|
||||
to { opacity: 1; transform: translateY(0) scale(1); }
|
||||
}
|
||||
|
||||
.bc-position-list {
|
||||
display: grid;
|
||||
gap: 14px;
|
||||
}
|
||||
|
||||
.bc-position-row {
|
||||
display: grid;
|
||||
grid-template-columns: minmax(0, 1.8fr) repeat(4, minmax(96px, .72fr));
|
||||
gap: 14px;
|
||||
align-items: center;
|
||||
padding: 16px 18px;
|
||||
}
|
||||
|
||||
.bc-performance {
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.bc-performance.is-positive {
|
||||
color: var(--bc-positive);
|
||||
}
|
||||
|
||||
.bc-performance.is-negative {
|
||||
color: var(--bc-negative);
|
||||
}
|
||||
|
||||
.bc-pill-soft {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
width: fit-content;
|
||||
padding: 6px 10px;
|
||||
border-radius: 999px;
|
||||
background: color-mix(in srgb, var(--bc-accent) 10%, transparent);
|
||||
color: var(--bc-text);
|
||||
font-size: .85rem;
|
||||
}
|
||||
|
||||
.bc-table-shell {
|
||||
overflow: auto;
|
||||
border-radius: 18px;
|
||||
border: 1px solid var(--bc-line);
|
||||
}
|
||||
|
||||
.bc-table {
|
||||
width: 100%;
|
||||
border-collapse: collapse;
|
||||
}
|
||||
|
||||
.bc-table th,
|
||||
.bc-table td {
|
||||
padding: 10px 12px;
|
||||
text-align: left;
|
||||
border-bottom: 1px solid rgba(255,255,255,0.06);
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.bc-table thead {
|
||||
background: rgba(255,255,255,0.04);
|
||||
}
|
||||
|
||||
.bc-page .setup-field {
|
||||
display: grid;
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
.bc-page input,
|
||||
.bc-page select,
|
||||
.bc-page textarea {
|
||||
width: 100%;
|
||||
border: 1px solid var(--bc-line);
|
||||
border-radius: 14px;
|
||||
padding: 10px 12px;
|
||||
background: var(--surface-strong);
|
||||
color: var(--bc-text);
|
||||
}
|
||||
|
||||
.bc-page input::placeholder,
|
||||
.bc-page textarea::placeholder {
|
||||
color: color-mix(in srgb, var(--bc-muted) 70%, transparent);
|
||||
}
|
||||
|
||||
.bc-page a {
|
||||
color: inherit;
|
||||
}
|
||||
|
||||
.bc-page .muted {
|
||||
color: var(--bc-muted);
|
||||
}
|
||||
|
||||
@media (max-width: 980px) {
|
||||
.bc-frame {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.bc-hero-top {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
|
||||
.bc-position-row {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
175
custom/apps/boersenchecker/assets/boersenchecker.js
Normal file
175
custom/apps/boersenchecker/assets/boersenchecker.js
Normal file
@@ -0,0 +1,175 @@
|
||||
(function () {
|
||||
'use strict';
|
||||
|
||||
function initBoersencheckerCharts(root) {
|
||||
const scope = root instanceof Element ? root : document;
|
||||
const app = scope.matches?.('[data-bc-home]') ? scope : scope.querySelector('[data-bc-home]');
|
||||
if (!app || app.dataset.bcChartBound === '1') return;
|
||||
app.dataset.bcChartBound = '1';
|
||||
|
||||
const chartShell = app.querySelector('[data-bc-chart]');
|
||||
const instrumentSelect = app.querySelector('[data-bc-instrument]');
|
||||
const instrumentNameNode = app.querySelector('[data-bc-instrument-name]');
|
||||
const instrumentMetaNode = app.querySelector('[data-bc-instrument-meta]');
|
||||
const rangeButtons = Array.from(app.querySelectorAll('[data-range]'));
|
||||
const statusNode = app.querySelector('[data-bc-chart-status]');
|
||||
const summaryNode = app.querySelector('[data-bc-chart-summary]');
|
||||
const endpoint = app.getAttribute('data-bc-chart-endpoint') || app.getAttribute('data-chart-endpoint') || '';
|
||||
const instrumentsScript = app.querySelector('[data-bc-instruments-json]');
|
||||
const instrumentMap = new Map();
|
||||
|
||||
if (instrumentsScript?.textContent) {
|
||||
try {
|
||||
const items = JSON.parse(instrumentsScript.textContent);
|
||||
if (Array.isArray(items)) {
|
||||
items.forEach((item) => instrumentMap.set(String(item.instrument_id), item));
|
||||
}
|
||||
} catch (_error) {}
|
||||
}
|
||||
|
||||
let activeRange = '1m';
|
||||
let currentPayload = null;
|
||||
|
||||
function pointsForRange(payload, range) {
|
||||
if (!payload) return [];
|
||||
const daily = payload.daily || [];
|
||||
const weekly = payload.weekly || [];
|
||||
const monthly = payload.monthly || [];
|
||||
switch (range) {
|
||||
case '1d': return daily.slice(-2);
|
||||
case '5d': return daily.slice(-5);
|
||||
case '1m': return daily.slice(-22);
|
||||
case '3m': return daily.slice(-66);
|
||||
case '6m': return weekly.slice(-26);
|
||||
case '1y': return weekly.slice(-52);
|
||||
case '5y': return monthly.slice(-60);
|
||||
default: return daily.slice(-22);
|
||||
}
|
||||
}
|
||||
|
||||
function renderChart(points) {
|
||||
if (!chartShell) return;
|
||||
chartShell.classList.remove('bc-panel-fade');
|
||||
void chartShell.offsetWidth;
|
||||
chartShell.classList.add('bc-panel-fade');
|
||||
|
||||
if (!points || points.length === 0) {
|
||||
chartShell.innerHTML = '<div class="muted">Keine Chartdaten verfuegbar.</div>';
|
||||
return;
|
||||
}
|
||||
|
||||
const values = points.map((point) => Number(point.close || 0));
|
||||
const min = Math.min(...values);
|
||||
const max = Math.max(...values);
|
||||
const width = 920;
|
||||
const height = 340;
|
||||
const paddingX = 24;
|
||||
const paddingY = 28;
|
||||
const usableWidth = width - paddingX * 2;
|
||||
const usableHeight = height - paddingY * 2;
|
||||
const spread = max - min || 1;
|
||||
|
||||
const coords = points.map((point, index) => {
|
||||
const x = paddingX + (usableWidth * index / Math.max(points.length - 1, 1));
|
||||
const y = paddingY + usableHeight - ((Number(point.close || 0) - min) / spread) * usableHeight;
|
||||
return { x, y };
|
||||
});
|
||||
|
||||
const path = coords.map((coord, index) => `${index === 0 ? 'M' : 'L'}${coord.x.toFixed(2)},${coord.y.toFixed(2)}`).join(' ');
|
||||
const area = `${path} L${coords[coords.length - 1].x.toFixed(2)},${height - paddingY} L${coords[0].x.toFixed(2)},${height - paddingY} Z`;
|
||||
const grid = [0, 1, 2, 3].map((step) => {
|
||||
const y = paddingY + (usableHeight * step / 3);
|
||||
return `<line x1="${paddingX}" y1="${y}" x2="${width - paddingX}" y2="${y}"></line>`;
|
||||
}).join('');
|
||||
|
||||
chartShell.innerHTML = `
|
||||
<svg class="bc-chart-svg" viewBox="0 0 ${width} ${height}" preserveAspectRatio="none">
|
||||
<defs>
|
||||
<linearGradient id="bc-chart-fill" x1="0" y1="0" x2="0" y2="1">
|
||||
<stop offset="0%" stop-color="rgba(94,234,212,0.32)"></stop>
|
||||
<stop offset="100%" stop-color="rgba(94,234,212,0.02)"></stop>
|
||||
</linearGradient>
|
||||
</defs>
|
||||
<g class="bc-chart-grid">${grid}</g>
|
||||
<path class="bc-chart-area" d="${area}"></path>
|
||||
<path class="bc-chart-path" d="${path}"></path>
|
||||
</svg>
|
||||
`;
|
||||
|
||||
const first = values[0];
|
||||
const last = values[values.length - 1];
|
||||
const delta = last - first;
|
||||
const percent = first !== 0 ? (delta / first) * 100 : 0;
|
||||
if (summaryNode) {
|
||||
summaryNode.textContent = `${last.toFixed(2)} | ${delta >= 0 ? '+' : ''}${delta.toFixed(2)} (${percent.toFixed(2)}%)`;
|
||||
}
|
||||
}
|
||||
|
||||
async function loadChart() {
|
||||
const instrumentId = instrumentSelect ? instrumentSelect.value : '';
|
||||
if (!instrumentId || !endpoint) {
|
||||
if (statusNode) statusNode.textContent = 'Keine Aktie fuer den Chart ausgewaehlt.';
|
||||
if (summaryNode) summaryNode.textContent = '-';
|
||||
if (chartShell) chartShell.innerHTML = '<div class="muted">Keine Chartdaten verfuegbar.</div>';
|
||||
return;
|
||||
}
|
||||
if (statusNode) statusNode.textContent = 'Chartdaten werden geladen...';
|
||||
try {
|
||||
const response = await fetch(`${endpoint}${endpoint.includes('?') ? '&' : '?'}instrument_id=${encodeURIComponent(instrumentId)}`, {
|
||||
credentials: 'same-origin',
|
||||
headers: { Accept: 'application/json' }
|
||||
});
|
||||
const responseText = await response.text();
|
||||
let payload = null;
|
||||
try {
|
||||
payload = JSON.parse(responseText);
|
||||
} catch (_error) {
|
||||
const preview = responseText.trim().slice(0, 160);
|
||||
throw new Error(preview !== '' ? `Chart-API liefert kein JSON: ${preview}` : 'Chart-API liefert kein JSON.');
|
||||
}
|
||||
if (!payload.ok) {
|
||||
throw new Error(payload.message || 'Chartdaten konnten nicht geladen werden.');
|
||||
}
|
||||
currentPayload = payload;
|
||||
renderChart(pointsForRange(payload, activeRange));
|
||||
if (statusNode) {
|
||||
const sourceLabel = payload.source_label || payload.source || 'Lokale Kurshistorie';
|
||||
const instrumentRef = payload.symbol || payload.isin || '';
|
||||
statusNode.textContent = instrumentRef
|
||||
? `Quelle: ${sourceLabel} | ${instrumentRef}`
|
||||
: `Quelle: ${sourceLabel}`;
|
||||
}
|
||||
} catch (error) {
|
||||
currentPayload = null;
|
||||
if (chartShell) {
|
||||
chartShell.innerHTML = `<div class="muted">${error instanceof Error ? error.message : 'Chartdaten konnten nicht geladen werden.'}</div>`;
|
||||
}
|
||||
if (statusNode) statusNode.textContent = 'Fehler beim Laden der Chartdaten.';
|
||||
}
|
||||
}
|
||||
|
||||
rangeButtons.forEach((button) => {
|
||||
button.addEventListener('click', () => {
|
||||
activeRange = button.getAttribute('data-range') || '1m';
|
||||
rangeButtons.forEach((item) => item.setAttribute('aria-pressed', item === button ? 'true' : 'false'));
|
||||
renderChart(pointsForRange(currentPayload, activeRange));
|
||||
});
|
||||
});
|
||||
|
||||
if (instrumentSelect) {
|
||||
instrumentSelect.addEventListener('change', () => {
|
||||
const meta = instrumentMap.get(String(instrumentSelect.value));
|
||||
if (meta) {
|
||||
if (instrumentNameNode) instrumentNameNode.textContent = meta.instrument_name || 'Keine Aktie ausgewaehlt';
|
||||
if (instrumentMetaNode) instrumentMetaNode.textContent = `${meta.symbol || ''} · ${meta.isin || '-'}`;
|
||||
}
|
||||
loadChart();
|
||||
});
|
||||
}
|
||||
|
||||
loadChart();
|
||||
}
|
||||
|
||||
window.initBoersencheckerCharts = initBoersencheckerCharts;
|
||||
initBoersencheckerCharts(document);
|
||||
})();
|
||||
Reference in New Issue
Block a user