From c8cb7c0199f9853a6843ef97085c9916f998adfb Mon Sep 17 00:00:00 2001 From: Oracle Date: Wed, 17 Jun 2026 14:56:06 +0200 Subject: [PATCH] Code cleanup --- src/pages/index.astro | 122 ++++++++++++++++++++---------------------- 1 file changed, 58 insertions(+), 64 deletions(-) diff --git a/src/pages/index.astro b/src/pages/index.astro index f4c24a8..b044879 100644 --- a/src/pages/index.astro +++ b/src/pages/index.astro @@ -124,64 +124,45 @@ const TOKEN = import.meta.env.PUBLIC_ACCESS_TOKEN || ''; } async function fetchTimes() { - var since = getSinceDate(); - var url = API_BASE + '/user/times?access_token=' + TOKEN + '&since=' + since; - var resp = await fetch(url); - if (!resp.ok) throw new Error('API error: ' + resp.status); - return resp.json(); - } + var since = getSinceDate(); + var url = API_BASE + '/user/times?access_token=' + TOKEN + '&since=' + since; + var resp = await fetch(url); + if (!resp.ok) throw new Error('API error: ' + resp.status); + return resp.json(); + } function getTodayStart() { var now = new Date(); - return new Date(now.getFullYear(), now.getMonth(), now.getDate()).getTime(); + return Date.UTC(now.getFullYear(), now.getMonth(), now.getDate()); } - function getLast30Days() { - var now = new Date(); - var monthAgo = new Date(now.getTime() - 30 * 24 * 60 * 60 * 1000); - return { now: now.getTime(), monthAgo: monthAgo.getTime() }; - } + function getWeekStart() { + var now = new Date(); + var day = now.getDay(); + var diff = now.getDate() - day + (day === 0 ? -6 : 1); + return Date.UTC(now.getFullYear(), now.getMonth(), diff); + } - function getMonthStart() { - var now = new Date(); - var monthStart = new Date(now.getFullYear(), now.getMonth(), 1); - monthStart.setHours(0, 0, 0, 0); - return monthStart.toISOString(); - } + function getMonthStart() { + var now = new Date(); + return Date.UTC(now.getFullYear(), now.getMonth(), 1); + } - function getWeekStart() { - var now = new Date(); - var day = now.getDay(); - var diff = now.getDate() - day + (day === 0 ? -6 : 1); - var monday = new Date(now.setDate(diff)); - monday.setHours(0, 0, 0, 0); - return monday.getTime(); - } + function getSinceDate() { + var now = new Date(); + return new Date(Date.UTC(now.getFullYear(), now.getMonth(), 1)).toISOString(); + } - function getSinceDate() { - var now = new Date(); - var since = new Date(now.getFullYear(), now.getMonth(), 1); - since.setHours(0, 0, 0, 0); - return since.toISOString(); - } + function utcDayKey(d) { + return d.getUTCFullYear() + '-' + String(d.getUTCMonth() + 1).padStart(2, '0') + '-' + String(d.getUTCDate()).padStart(2, '0'); + } + + function utcDayLabel(d) { + return String(d.getUTCDate()).padStart(2, '0') + '.' + String(d.getUTCMonth() + 1).padStart(2, '0'); + } function getDayKey(dateStr) { - var d = new Date(dateStr); - var y = d.getUTCFullYear(); - var m = String(d.getUTCMonth() + 1).padStart(2, '0'); - var day = String(d.getUTCDate()).padStart(2, '0'); - return y + '-' + m + '-' + day; - } - - function getDayLabel(d) { - return String(d.getDate()).padStart(2, '0') + '.' + String(d.getMonth() + 1).padStart(2, '0'); - } - - function getUTCDayKey(d) { - var y = d.getUTCFullYear(); - var m = String(d.getUTCMonth() + 1).padStart(2, '0'); - var day = String(d.getUTCDate()).padStart(2, '0'); - return y + '-' + m + '-' + day; + return utcDayKey(new Date(dateStr)); } function truncateTitle(t, max) { @@ -189,14 +170,27 @@ const TOKEN = import.meta.env.PUBLIC_ACCESS_TOKEN || ''; return t.length > max ? t.substring(0, max) + '...' : t; } + function buildChartOptions(base, colors, gradientToColor) { + return { + chart: base.chart, + theme: base.theme, + series: base.series, + stroke: base.stroke, + dataLabels: base.dataLabels, + grid: base.grid, + tooltip: base.tooltip, + colors: colors, + fill: { type: 'gradient', gradient: { shade: 'dark', gradientToColors: [gradientToColor], shadeIntensity: 1, type: 'horizontal', opacityFrom: 0.6, opacityTo: 0.2, stops: [0, 100] } } + }; + } + function renderCharts(timesData) { var todayTotal = 0; var weekTotal = 0; var monthTotal = 0; var todayStart = getTodayStart(); var weekStart = getWeekStart(); - var monthAgo = getLast30Days().monthAgo; - var monthStart = new Date(new Date().getFullYear(), new Date().getMonth(), 1).getTime(); + var monthStart = getMonthStart(); var dayMap = {}; var issuesData = {}; @@ -208,7 +202,7 @@ const TOKEN = import.meta.env.PUBLIC_ACCESS_TOKEN || ''; for (var i = 0; i < timesData.length; i++) { var entry = timesData[i]; var repoKey = entry.repository_url || (entry.issue && entry.issue.repository_url) || (entry.issue && entry.issue.repository && entry.issue.repository.full_name) || ''; - if (repoKey.indexOf('VectorSearchMedia') === -1) continue; + if (repoKey.indexOf('VectorSearchMedia') === -1) continue; var timeSec = entry.time || 0; var created = new Date(entry.created).getTime(); @@ -248,22 +242,24 @@ const TOKEN = import.meta.env.PUBLIC_ACCESS_TOKEN || ''; tooltip: { formatter: function(val) { return formatDuration(val * 3600); } } }; + var axisLabels = { style: { colors: '#a0a0b8', fontSize: '11px' } }; + var axisTicks = { show: true }; + var axisBorder = { show: true, color: 'rgba(139, 92, 246, 0.2)' }; + // Weekly chart (14 days) - var weeklyData = []; + var weeklyData = []; var weeklyLabels = []; var now = new Date(); for (var i = 13; i >= 0; i--) { var d = new Date(now); d.setDate(d.getDate() - i); - var key = getUTCDayKey(d); - var label = String(d.getUTCDate()).padStart(2, '0') + '.' + String(d.getUTCMonth() + 1).padStart(2, '0'); - weeklyLabels.push(label); - weeklyData.push((dayMap[key] || 0) / 3600); + weeklyLabels.push(utcDayLabel(d)); + weeklyData.push((dayMap[utcDayKey(d)] || 0) / 3600); } new ApexCharts(document.querySelector("#chart-weekly"), { chart: chartBase.chart, theme: chartBase.theme, - xaxis: { categories: weeklyLabels, labels: { style: { colors: '#a0a0b8', fontSize: '11px' } }, axisTicks: { show: true }, axisBorder: { show: true, color: 'rgba(139, 92, 246, 0.2)' } }, + xaxis: { categories: weeklyLabels, labels: axisLabels, axisTicks: axisTicks, axisBorder: axisBorder }, yaxis: { labels: { formatter: function(val) { return val ? val.toFixed(1) : '0'; } } }, series: [{ name: 'Hours', data: weeklyData }], stroke: chartBase.stroke, @@ -280,15 +276,13 @@ const TOKEN = import.meta.env.PUBLIC_ACCESS_TOKEN || ''; for (var i = 29; i >= 0; i--) { var d = new Date(now); d.setDate(d.getDate() - i); - var key = getUTCDayKey(d); - var label = String(d.getUTCDate()).padStart(2, '0') + '.' + String(d.getUTCMonth() + 1).padStart(2, '0'); - monthlyLabels.push(label); - monthlyData.push((dayMap[key] || 0) / 3600); + monthlyLabels.push(utcDayLabel(d)); + monthlyData.push((dayMap[utcDayKey(d)] || 0) / 3600); } new ApexCharts(document.querySelector("#chart-monthly"), { chart: chartBase.chart, theme: chartBase.theme, - xaxis: { categories: monthlyLabels, labels: { style: { colors: '#a0a0b8', fontSize: '11px' } }, axisTicks: { show: true }, axisBorder: { show: true, color: 'rgba(139, 92, 246, 0.2)' } }, + xaxis: { categories: monthlyLabels, labels: axisLabels, axisTicks: axisTicks, axisBorder: axisBorder }, yaxis: { labels: { formatter: function(val) { return val ? val.toFixed(1) : '0'; } } }, series: [{ name: 'Hours', data: monthlyData }], stroke: chartBase.stroke, @@ -307,7 +301,7 @@ const TOKEN = import.meta.env.PUBLIC_ACCESS_TOKEN || ''; theme: { mode: 'dark' }, series: [{ name: 'Hours', data: issueHours }], plotOptions: { bar: { horizontal: true, borderRadius: 4 } }, - xaxis: { categories: issueTitles, titles: issueTitles.map(truncateTitle), labels: { show: true,style: { colors: '#a0a0b8', fontSize: '11px' }, rotate: 0 }, yaxisLabel: { ShowOverflows: true } }, + xaxis: { categories: issueTitles, labels: { show: true, style: axisLabels, rotate: 0 } }, colors: ['#22c55e'], fill: { type: 'solid', opacity: 0.8 }, grid: { borderColor: 'rgba(139, 92, 246, 0.15)' }, @@ -324,7 +318,7 @@ const TOKEN = import.meta.env.PUBLIC_ACCESS_TOKEN || ''; theme: { mode: 'dark' }, series: [{ name: 'Hours', data: prHours }], plotOptions: { bar: { horizontal: true, borderRadius: 4 } }, - xaxis: { categories: prTitles, titles: prTitles.map(truncateTitle), labels: { show: true,style: { colors: '#a0a0b8', fontSize: '11px' }, rotate: 0 }, yaxisLabel: { ShowOverflows: true } }, + xaxis: { categories: prTitles, labels: { show: true, style: axisLabels, rotate: 0 } }, colors: ['#3b82f6'], fill: { type: 'solid', opacity: 0.8 }, grid: { borderColor: 'rgba(139, 92, 246, 0.15)' },