Compare commits

...

47 Commits

Author SHA1 Message Date
Hördle Bot
25680a19b6 Bump version to 0.1.6.34 2025-12-14 14:24:48 +01:00
Hördle Bot
fb3e4c10dd Version-Anzeige: Neuesten Git-Tag statt Commit-Hash verwenden 2025-12-14 14:24:42 +01:00
Hördle Bot
b7293a4614 Fix: Update API route for loading cover images
- Changed the method of loading cover images to use the API route instead of directly from the filesystem.
- This aligns with the existing approach for audio playback and improves consistency across the application.
2025-12-14 14:12:45 +01:00
Hördle Bot
830e91fdff Bump version to 0.1.6.33 2025-12-14 14:11:07 +01:00
Hördle Bot
bc95af8027 Cover-Bilder über API-Route laden statt direkt aus Dateisystem 2025-12-14 14:11:02 +01:00
Hördle Bot
56461fe0bb Bump version to 0.1.6.31 2025-12-07 13:17:03 +01:00
Hördle Bot
989654f62e Fix: Waveform-Editor verwendet jetzt API-Route statt statischen Pfad
- WaveformEditor verwendet /api/audio/... statt /uploads/...
- Gleicher Pfad wie beim Abspielen aus der Liste
- Behebt Problem, dass neu hochgeladene Dateien nicht im Waveform-Editor bearbeitbar waren
2025-12-07 13:16:32 +01:00
Hördle Bot
bf9fbe37c0 Bump version to 0.1.6.30 2025-12-07 13:04:23 +01:00
Hördle Bot
c83dc7a5e5 Fix: Cache-Control-Header für Waveform-Editor API-Route hinzugefügt
- API-Route sendet jetzt explizite No-Cache-Header
- Frontend-Fetch verwendet cache: 'no-store'
- Behebt Problem, dass neu hochgeladene Dateien erst nach Container-Neustart bearbeitbar waren
2025-12-07 13:03:43 +01:00
Hördle Bot
7999d63e6d Fix: Versteckte Specials werden nicht mehr in Navigationsleiste angezeigt 2025-12-07 12:40:50 +01:00
Hördle Bot
2bf21fd75f feat: improve Gotify variable extraction in backup script
- Enhanced the loading of Gotify variables from the .env file by adding checks for existing values.
- Ensured that only non-empty and non-comment lines are processed for GOTIFY_URL and GOTIFY_APP_TOKEN.
2025-12-07 10:30:37 +01:00
Hördle Bot
e48d823c92 feat: enhance Gotify notification handling in backup script
- Added loading of environment variables from a .env file.
- Extracted Gotify configuration from docker-compose.yml if not set.
- Improved notification sending with success and error messages based on curl exit codes.
- Ensured Gotify notifications are only sent if properly configured.
2025-12-07 10:29:09 +01:00
Hördle Bot
84822e79ca feat: add Gotify notifications for Restic backup status
- Implemented a function to send notifications via Gotify for backup success, warnings, and failures.
- Notifications include details such as date and commit information.
- Added checks for Gotify configuration and fallback for JSON encoding.
2025-12-07 10:23:19 +01:00
Hördle Bot
17856ef09b Bump version to 0.1.6.28 2025-12-07 10:11:06 +01:00
Hördle Bot
fb833a7976 Fix: Waveform Editor lädt nicht für Titel ohne vollständige Song-Daten
- Filtere Songs ohne vollständige Song-Daten (song, filename) in CurateSpecialEditor
- Füge defensive Prüfungen hinzu bevor WaveformEditor gerendert wird
- Filtere unvollständige Songs bereits auf API-Ebene in curator/specials/[id]
- Verhindert Fehler wenn Songs ohne filename oder song-Objekt geladen werden
2025-12-07 10:07:43 +01:00
Hördle Bot
a4e61de53f chore: bump version to 0.1.6.27 2025-12-06 21:58:29 +01:00
Hördle Bot
73c1c1cf89 fix: restore accidentally deleted admin specials editor page 2025-12-06 21:58:27 +01:00
Hördle Bot
83e1281079 fix: restore deleted curator implementation files 2025-12-06 21:50:59 +01:00
Hördle Bot
2e1f1e599b chore: bump version to 0.1.6.26 2025-12-06 15:39:15 +01:00
Hördle Bot
71c4e2509f feat(admin): add danger zone buttons for resetting ratings and activations
- Added reset all user ratings button to admin danger zone
- Added reset all activations button to admin danger zone
- Created API endpoints: /api/admin/reset-ratings and /api/admin/reset-activations
- Removed old non-localized routes: /app/admin, /app/curator
- Removed unused page.module.css
- All admin functionality now uses localized routes (/[locale]/admin)
2025-12-06 15:38:46 +01:00
Hördle Bot
9cef1c78d3 ... 2025-12-06 14:26:52 +01:00
Hördle Bot
6741eeb7fa feat: Album-Cover-Anzeige in Titelliste mit Tooltip hinzugefügt
- Neue Spalte 'Cover' in der Curator-Titelliste zeigt an, ob ein Album-Cover vorhanden ist
- Tooltip zeigt das Cover-Bild beim Hovern über die Cover-Spalte
- Übersetzungen für DE und EN hinzugefügt
2025-12-06 14:24:00 +01:00
Hördle Bot
71b8e98f23 feat: add hidden flag to specials 2025-12-06 01:35:01 +01:00
Hördle Bot
bc2c0bad59 Bump version to 0.1.6.24 2025-12-06 00:36:02 +01:00
Hördle Bot
812d6ff10d Add timeline display below waveform in waveform editor 2025-12-06 00:36:00 +01:00
Hördle Bot
aed300b1bb Bump version to 0.1.6.23 2025-12-05 23:55:24 +01:00
Hördle Bot
e93b3b9096 Keep playback cursor visible when pausing in waveform editor 2025-12-05 23:55:21 +01:00
Hördle Bot
cdd2ff15d5 Bump version to 0.1.6.22 2025-12-05 22:25:41 +01:00
Hördle Bot
adcfbfa811 Fix pause functionality for waveform editor playback buttons 2025-12-05 22:25:39 +01:00
Hördle Bot
0cdfe90476 Bump version to 0.1.6.21 2025-12-05 22:06:44 +01:00
Hördle Bot
1715ca02ed Remove duplicate back button from curator special editor 2025-12-05 22:06:42 +01:00
Hördle Bot
ece3991d37 Bump version to 0.1.6.20 2025-12-05 21:57:36 +01:00
Hördle Bot
fa3b64f490 Add 'Play Full Title' button to waveform editor 2025-12-05 21:57:34 +01:00
Hördle Bot
fa6f1097dd Bump version to 0.1.6.19 2025-12-05 21:48:00 +01:00
Hördle Bot
d2ec0119ce Fix waveform editor: show end marker for last segment and fix play full section stop functionality 2025-12-05 21:47:57 +01:00
Hördle Bot
8914c552cd Bump version to 0.1.6.18 2025-12-05 21:33:44 +01:00
Hördle Bot
d816422419 Update song list start time after saving changes in waveform editor 2025-12-05 21:33:41 +01:00
Hördle Bot
da777ffcf3 Bump version to 0.1.6.17 2025-12-05 20:56:29 +01:00
Hördle Bot
0d806daf66 Add JSON validation for unlock steps in admin specials management with tooltip error display 2025-12-05 20:56:27 +01:00
Hördle Bot
616cfec3e7 Bump version to 0.1.6.16 2025-12-05 20:41:40 +01:00
Hördle Bot
ac12e45393 Fix curator specials page: resolve redirect loop and add missing translations 2025-12-05 20:41:38 +01:00
Hördle Bot
223eb62973 Bump version to 0.1.6.15 2025-12-05 20:13:31 +01:00
Hördle Bot
dc4bdd36c7 Fix textarea alignment: add box-sizing border-box to prevent overflow 2025-12-05 20:13:27 +01:00
Hördle Bot
136f881252 Bump version to 0.1.6.14 2025-12-05 18:43:15 +01:00
Hördle Bot
fd11048f2c Fix daily puzzle selection: always select from songs with minimum activations 2025-12-05 18:43:09 +01:00
Hördle Bot
c1b448639e Add logo generation scripts and favicon base image 2025-12-05 12:26:54 +01:00
Hördle Bot
97021f016b Add logo files (SVG and PNG) with white background and hördle.de text 2025-12-05 12:26:15 +01:00
42 changed files with 2069 additions and 1902 deletions

1
.gitignore vendored
View File

@@ -54,3 +54,4 @@ next-env.d.ts
docker-compose.yml
scripts/scrape-bahn-expert-statements.js
docs/bahn-expert-statements.txt
/public/logos.zip

View File

@@ -27,7 +27,9 @@ COPY . .
RUN if [ -n "$APP_VERSION" ]; then \
echo "$APP_VERSION" > /tmp/version.txt; \
else \
(git describe --tags --always 2>/dev/null || \
(git describe --tags --exact-match 2>/dev/null || \
git describe --tags --abbrev=0 2>/dev/null || \
git tag --sort=-version:refname | head -1 2>/dev/null || \
(grep -o '"version": "[^"]*"' package.json 2>/dev/null | cut -d'"' -f4 | sed 's/^/v/') || \
echo "dev") > /tmp/version.txt; \
fi && \

View File

@@ -73,7 +73,9 @@ export default async function GenrePage({ params }: PageProps) {
// Sort
genres.sort((a, b) => getLocalizedValue(a.name, locale).localeCompare(getLocalizedValue(b.name, locale)));
const specials = await prisma.special.findMany();
const specials = await prisma.special.findMany({
where: { hidden: false },
});
specials.sort((a, b) => getLocalizedValue(a.name, locale).localeCompare(getLocalizedValue(b.name, locale)));
const now = new Date();

View File

@@ -15,6 +15,7 @@ interface Special {
launchDate?: string;
endDate?: string;
curator?: string;
hidden?: boolean;
_count?: {
songs: number;
};
@@ -115,18 +116,22 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
const [newSpecialSubtitle, setNewSpecialSubtitle] = useState({ de: '', en: '' });
const [newSpecialMaxAttempts, setNewSpecialMaxAttempts] = useState(7);
const [newSpecialUnlockSteps, setNewSpecialUnlockSteps] = useState('[2,4,7,11,16,30,60]');
const [newSpecialUnlockStepsError, setNewSpecialUnlockStepsError] = useState<string | null>(null);
const [newSpecialLaunchDate, setNewSpecialLaunchDate] = useState('');
const [newSpecialEndDate, setNewSpecialEndDate] = useState('');
const [newSpecialCurator, setNewSpecialCurator] = useState('');
const [newSpecialHidden, setNewSpecialHidden] = useState(false);
const [editingSpecialId, setEditingSpecialId] = useState<number | null>(null);
const [editSpecialName, setEditSpecialName] = useState({ de: '', en: '' });
const [editSpecialSubtitle, setEditSpecialSubtitle] = useState({ de: '', en: '' });
const [editSpecialMaxAttempts, setEditSpecialMaxAttempts] = useState(7);
const [editSpecialUnlockSteps, setEditSpecialUnlockSteps] = useState('[2,4,7,11,16,30,60]');
const [editSpecialUnlockStepsError, setEditSpecialUnlockStepsError] = useState<string | null>(null);
const [editSpecialLaunchDate, setEditSpecialLaunchDate] = useState('');
const [editSpecialEndDate, setEditSpecialEndDate] = useState('');
const [editSpecialCurator, setEditSpecialCurator] = useState('');
const [editSpecialHidden, setEditSpecialHidden] = useState(false);
// News state
const [news, setNews] = useState<News[]>([]);
@@ -239,6 +244,25 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
}
};
// Validate JSON for unlock steps
const validateUnlockSteps = (value: string): string | null => {
if (!value.trim()) {
return t('unlockStepsRequired');
}
try {
const parsed = JSON.parse(value);
if (!Array.isArray(parsed)) {
return t('unlockStepsMustBeArray');
}
if (parsed.some((item: any) => typeof item !== 'number' || item < 1)) {
return t('unlockStepsMustBePositiveNumbers');
}
return null;
} catch (e) {
return t('unlockStepsInvalidJson');
}
};
const handleLogout = () => {
localStorage.removeItem('hoerdle_admin_auth');
setIsAuthenticated(false);
@@ -352,6 +376,15 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
const handleCreateSpecial = async (e: React.FormEvent) => {
e.preventDefault();
if (!newSpecialName.de.trim() && !newSpecialName.en.trim()) return;
// Validate unlock steps
const unlockStepsError = validateUnlockSteps(newSpecialUnlockSteps);
if (unlockStepsError) {
setNewSpecialUnlockStepsError(unlockStepsError);
return;
}
setNewSpecialUnlockStepsError(null);
const res = await fetch('/api/specials', {
method: 'POST',
headers: getAuthHeaders(),
@@ -363,6 +396,7 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
launchDate: newSpecialLaunchDate || null,
endDate: newSpecialEndDate || null,
curator: newSpecialCurator || null,
hidden: newSpecialHidden,
}),
});
if (res.ok) {
@@ -370,12 +404,15 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
setNewSpecialSubtitle({ de: '', en: '' });
setNewSpecialMaxAttempts(7);
setNewSpecialUnlockSteps('[2,4,7,11,16,30,60]');
setNewSpecialUnlockStepsError(null);
setNewSpecialLaunchDate('');
setNewSpecialEndDate('');
setNewSpecialCurator('');
setNewSpecialHidden(false);
fetchSpecials();
} else {
alert('Failed to create special');
const errorData = await res.json().catch(() => ({}));
alert(errorData.error || 'Failed to create special');
}
};
@@ -455,13 +492,24 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
setEditSpecialSubtitle(special.subtitle ? (typeof special.subtitle === 'string' ? { de: special.subtitle, en: special.subtitle } : special.subtitle) : { de: '', en: '' });
setEditSpecialMaxAttempts(special.maxAttempts);
setEditSpecialUnlockSteps(special.unlockSteps);
setEditSpecialUnlockStepsError(null);
setEditSpecialLaunchDate(special.launchDate ? new Date(special.launchDate).toISOString().split('T')[0] : '');
setEditSpecialEndDate(special.endDate ? new Date(special.endDate).toISOString().split('T')[0] : '');
setEditSpecialCurator(special.curator || '');
setEditSpecialHidden(special.hidden || false);
};
const saveEditedSpecial = async () => {
if (editingSpecialId === null) return;
// Validate unlock steps
const unlockStepsError = validateUnlockSteps(editSpecialUnlockSteps);
if (unlockStepsError) {
setEditSpecialUnlockStepsError(unlockStepsError);
return;
}
setEditSpecialUnlockStepsError(null);
const res = await fetch('/api/specials', {
method: 'PUT',
headers: getAuthHeaders(),
@@ -474,13 +522,16 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
launchDate: editSpecialLaunchDate || null,
endDate: editSpecialEndDate || null,
curator: editSpecialCurator || null,
hidden: editSpecialHidden,
}),
});
if (res.ok) {
setEditingSpecialId(null);
setEditSpecialUnlockStepsError(null);
fetchSpecials();
} else {
alert('Failed to update special');
const errorData = await res.json().catch(() => ({}));
alert(errorData.error || 'Failed to update special');
}
};
@@ -1300,8 +1351,38 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
<input type="number" placeholder={t('maxAttempts')} value={newSpecialMaxAttempts} onChange={e => setNewSpecialMaxAttempts(Number(e.target.value))} className="form-input" min={1} style={{ width: '80px' }} />
</div>
<div style={{ display: 'flex', flexDirection: 'column' }}>
<label style={{ fontSize: '0.75rem', color: '#666' }}>{t('unlockSteps')}</label>
<input type="text" placeholder={t('unlockSteps')} value={newSpecialUnlockSteps} onChange={e => setNewSpecialUnlockSteps(e.target.value)} className="form-input" style={{ width: '200px' }} />
<label style={{ fontSize: '0.75rem', color: '#666', display: 'flex', alignItems: 'center', gap: '0.25rem' }}>
{t('unlockSteps')}
{newSpecialUnlockStepsError && (
<span
title={newSpecialUnlockStepsError}
style={{
color: '#ef4444',
cursor: 'help',
fontSize: '0.875rem'
}}
>
</span>
)}
</label>
<input
type="text"
placeholder={t('unlockSteps')}
value={newSpecialUnlockSteps}
onChange={e => {
const value = e.target.value;
setNewSpecialUnlockSteps(value);
const error = validateUnlockSteps(value);
setNewSpecialUnlockStepsError(error);
}}
className="form-input"
title={newSpecialUnlockStepsError || undefined}
style={{
width: '200px',
borderColor: newSpecialUnlockStepsError ? '#ef4444' : undefined
}}
/>
</div>
<div style={{ display: 'flex', flexDirection: 'column' }}>
<label style={{ fontSize: '0.75rem', color: '#666' }}>{t('launchDate')}</label>
@@ -1315,7 +1396,30 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
<label style={{ fontSize: '0.75rem', color: '#666' }}>{t('curator')}</label>
<input type="text" placeholder={t('curator')} value={newSpecialCurator} onChange={e => setNewSpecialCurator(e.target.value)} className="form-input" />
</div>
<button type="submit" className="btn-primary" style={{ height: '38px' }}>{t('addSpecial')}</button>
<div style={{ display: 'flex', flexDirection: 'column' }}>
<label style={{ fontSize: '0.75rem', color: '#666', visibility: 'hidden' }}>Hidden</label>
<label style={{ display: 'flex', alignItems: 'center', gap: '0.25rem', height: '38px', cursor: 'pointer' }}>
<input
type="checkbox"
checked={newSpecialHidden}
onChange={e => setNewSpecialHidden(e.target.checked)}
style={{ width: '1rem', height: '1rem' }}
/>
Hidden
</label>
</div>
<button
type="submit"
className="btn-primary"
style={{
height: '38px',
opacity: newSpecialUnlockStepsError ? 0.5 : 1,
cursor: newSpecialUnlockStepsError ? 'not-allowed' : 'pointer'
}}
disabled={!!newSpecialUnlockStepsError}
>
{t('addSpecial')}
</button>
</div>
</form>
<div style={{ display: 'flex', flexWrap: 'wrap', gap: '0.5rem' }}>
@@ -1333,7 +1437,7 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
}}
>
<span>
{getLocalizedValue(special.name, activeTab)} ({special._count?.songs || 0})
{special.hidden && <span title="Hidden from navigation">👁🗨</span>} {getLocalizedValue(special.name, activeTab)} ({special._count?.songs || 0})
</span>
{special.subtitle && (
<span
@@ -1379,8 +1483,37 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
<input type="number" value={editSpecialMaxAttempts} onChange={e => setEditSpecialMaxAttempts(Number(e.target.value))} className="form-input" min={1} style={{ width: '80px' }} />
</div>
<div style={{ display: 'flex', flexDirection: 'column' }}>
<label style={{ fontSize: '0.75rem', color: '#666' }}>{t('unlockSteps')}</label>
<input type="text" value={editSpecialUnlockSteps} onChange={e => setEditSpecialUnlockSteps(e.target.value)} className="form-input" style={{ width: '200px' }} />
<label style={{ fontSize: '0.75rem', color: '#666', display: 'flex', alignItems: 'center', gap: '0.25rem' }}>
{t('unlockSteps')}
{editSpecialUnlockStepsError && (
<span
title={editSpecialUnlockStepsError}
style={{
color: '#ef4444',
cursor: 'help',
fontSize: '0.875rem'
}}
>
</span>
)}
</label>
<input
type="text"
value={editSpecialUnlockSteps}
onChange={e => {
const value = e.target.value;
setEditSpecialUnlockSteps(value);
const error = validateUnlockSteps(value);
setEditSpecialUnlockStepsError(error);
}}
className="form-input"
title={editSpecialUnlockStepsError || undefined}
style={{
width: '200px',
borderColor: editSpecialUnlockStepsError ? '#ef4444' : undefined
}}
/>
</div>
<div style={{ display: 'flex', flexDirection: 'column' }}>
<label style={{ fontSize: '0.75rem', color: '#666' }}>{t('launchDate')}</label>
@@ -1394,7 +1527,30 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
<label style={{ fontSize: '0.75rem', color: '#666' }}>{t('curator')}</label>
<input type="text" value={editSpecialCurator} onChange={e => setEditSpecialCurator(e.target.value)} className="form-input" />
</div>
<button onClick={saveEditedSpecial} className="btn-primary" style={{ height: '38px' }}>{t('save')}</button>
<div style={{ display: 'flex', flexDirection: 'column' }}>
<label style={{ fontSize: '0.75rem', color: '#666', visibility: 'hidden' }}>Hidden</label>
<label style={{ display: 'flex', alignItems: 'center', gap: '0.25rem', height: '38px', cursor: 'pointer' }}>
<input
type="checkbox"
checked={editSpecialHidden}
onChange={e => setEditSpecialHidden(e.target.checked)}
style={{ width: '1rem', height: '1rem' }}
/>
Hidden
</label>
</div>
<button
onClick={saveEditedSpecial}
className="btn-primary"
style={{
height: '38px',
opacity: editSpecialUnlockStepsError ? 0.5 : 1,
cursor: editSpecialUnlockStepsError ? 'not-allowed' : 'pointer'
}}
disabled={!!editSpecialUnlockStepsError}
>
{t('save')}
</button>
<button onClick={() => setEditingSpecialId(null)} className="btn-secondary" style={{ height: '38px' }}>{t('cancel')}</button>
</div>
</div>
@@ -2172,6 +2328,7 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
<p style={{ marginBottom: '1rem', color: '#666' }}>
These actions are destructive and cannot be undone.
</p>
<div style={{ display: 'flex', gap: '1rem', flexWrap: 'wrap' }}>
<button
onClick={async () => {
if (window.confirm('⚠️ WARNING: This will delete ALL data from the database (Songs, Genres, Specials, Puzzles) and re-import songs from the uploads folder.\n\nExisting genres and specials will be LOST and must be recreated manually.\n\nAre you sure you want to proceed?')) {
@@ -2205,7 +2362,83 @@ export default function AdminPage({ params }: { params: { locale: string } }) {
Rebuild Database
</button>
<button
onClick={async () => {
if (window.confirm('⚠️ WARNING: This will reset ALL user ratings for all songs to 0.\n\nThis action cannot be undone.\n\nAre you sure you want to proceed?')) {
try {
setMessage('Resetting all ratings...');
const res = await fetch('/api/admin/reset-ratings', {
method: 'POST',
headers: getAuthHeaders()
});
if (res.ok) {
const data = await res.json();
alert(data.message);
fetchSongs();
setMessage('');
} else {
alert('Failed to reset ratings. Check server logs.');
setMessage('Reset failed.');
}
} catch (e) {
console.error(e);
alert('Reset failed due to network error.');
setMessage('');
}
}
}}
style={{
padding: '0.75rem 1.5rem',
background: '#f59e0b',
color: 'white',
border: 'none',
borderRadius: '0.25rem',
cursor: 'pointer',
fontWeight: 'bold'
}}
>
🔄 Reset All User Ratings
</button>
<button
onClick={async () => {
if (window.confirm('⚠️ WARNING: This will delete ALL daily puzzles (activations) from the database.\n\nThis means all songs will show 0 activations.\n\nThis action cannot be undone.\n\nAre you sure you want to proceed?')) {
try {
setMessage('Resetting all activations...');
const res = await fetch('/api/admin/reset-activations', {
method: 'POST',
headers: getAuthHeaders()
});
if (res.ok) {
const data = await res.json();
alert(data.message);
fetchSongs();
fetchDailyPuzzles();
setMessage('');
} else {
alert('Failed to reset activations. Check server logs.');
setMessage('Reset failed.');
}
} catch (e) {
console.error(e);
alert('Reset failed due to network error.');
setMessage('');
}
}
}}
style={{
padding: '0.75rem 1.5rem',
background: '#f59e0b',
color: 'white',
border: 'none',
borderRadius: '0.25rem',
cursor: 'pointer',
fontWeight: 'bold'
}}
>
🔄 Reset All Activations
</button>
</div>
</div>
</div>
);

View File

@@ -1,7 +1,9 @@
'use client';
import CuratorSpecialsPage from '@/app/curator/specials/page';
import CuratorSpecialsClient from '@/app/curator/specials/CuratorSpecialsClient';
export default CuratorSpecialsPage;
export default function CuratorSpecialsPage() {
return <CuratorSpecialsClient />;
}

View File

@@ -43,7 +43,9 @@ export default async function Home({
const genres = await prisma.genre.findMany({
where: { active: true },
});
const specials = await prisma.special.findMany();
const specials = await prisma.special.findMany({
where: { hidden: false },
});
// Sort in memory
genres.sort((a, b) => getLocalizedValue(a.name, locale).localeCompare(getLocalizedValue(b.name, locale)));

View File

@@ -86,6 +86,7 @@ export default async function SpecialPage({ params }: PageProps) {
specials.sort((a, b) => getLocalizedValue(a.name, locale).localeCompare(getLocalizedValue(b.name, locale)));
const activeSpecials = specials.filter(s => {
if (s.hidden) return false;
const sStarted = !s.launchDate || s.launchDate <= now;
const sEnded = s.endDate && s.endDate < now;
return sStarted && !sEnded;

View File

@@ -1,14 +0,0 @@
import type { Metadata } from "next";
export const metadata: Metadata = {
title: "Hördle Admin Dashboard",
description: "Admin dashboard for managing songs and daily puzzles",
};
export default function AdminLayout({
children,
}: {
children: React.ReactNode;
}) {
return <>{children}</>;
}

File diff suppressed because it is too large Load Diff

View File

@@ -17,9 +17,11 @@ export default function SpecialEditorPage() {
const [special, setSpecial] = useState<CurateSpecial | null>(null);
const [loading, setLoading] = useState(true);
useEffect(() => {
const fetchSpecial = async () => {
const fetchSpecial = async (showLoading = true) => {
try {
if (showLoading) {
setLoading(true);
}
const res = await fetch(`/api/specials/${specialId}`);
if (res.ok) {
const data = await res.json();
@@ -28,11 +30,14 @@ export default function SpecialEditorPage() {
} catch (error) {
console.error('Error fetching special:', error);
} finally {
if (showLoading) {
setLoading(false);
}
}
};
fetchSpecial();
useEffect(() => {
fetchSpecial(true);
}, [specialId]);
const handleSaveStartTime = async (songId: number, startTime: number) => {
@@ -46,6 +51,9 @@ export default function SpecialEditorPage() {
const errorText = await res.text().catch(() => res.statusText || 'Unknown error');
console.error('Error updating special song (admin):', res.status, errorText);
throw new Error(`Failed to save start time: ${errorText}`);
} else {
// Reload special data to update the start time in the song list
await fetchSpecial(false);
}
};

View File

@@ -0,0 +1,23 @@
import { NextRequest, NextResponse } from 'next/server';
import { PrismaClient } from '@prisma/client';
const prisma = new PrismaClient();
export async function POST(req: NextRequest) {
try {
// Delete all daily puzzles (activations)
const result = await prisma.dailyPuzzle.deleteMany({});
return NextResponse.json({
success: true,
message: `Successfully deleted ${result.count} daily puzzles (activations)`,
count: result.count,
});
} catch (error) {
console.error('Error resetting activations:', error);
return NextResponse.json(
{ error: 'Failed to reset activations' },
{ status: 500 }
);
}
}

View File

@@ -0,0 +1,28 @@
import { NextRequest, NextResponse } from 'next/server';
import { PrismaClient } from '@prisma/client';
const prisma = new PrismaClient();
export async function POST(req: NextRequest) {
try {
// Reset all song ratings to 0
const result = await prisma.song.updateMany({
data: {
averageRating: 0,
ratingCount: 0,
},
});
return NextResponse.json({
success: true,
message: `Successfully reset ratings for ${result.count} songs`,
count: result.count,
});
} catch (error) {
console.error('Error resetting ratings:', error);
return NextResponse.json(
{ error: 'Failed to reset ratings' },
{ status: 500 }
);
}
}

View File

@@ -0,0 +1,95 @@
import { NextRequest, NextResponse } from 'next/server';
import { stat } from 'fs/promises';
import { createReadStream } from 'fs';
import path from 'path';
export async function GET(
request: NextRequest,
{ params }: { params: Promise<{ filename: string }> }
) {
try {
const { filename } = await params;
// Security: Prevent path traversal attacks
// Allow alphanumeric, hyphens, underscores, and dots for image filenames
// Support common image formats: jpg, jpeg, png, gif, webp
const safeFilenamePattern = /^[a-zA-Z0-9_\-\.]+\.(jpg|jpeg|png|gif|webp)$/i;
if (!safeFilenamePattern.test(filename)) {
return new NextResponse('Invalid filename', { status: 400 });
}
// Additional check: ensure no path separators
if (filename.includes('/') || filename.includes('\\') || filename.includes('..')) {
return new NextResponse('Invalid filename', { status: 400 });
}
const filePath = path.join(process.cwd(), 'public/uploads/covers', filename);
// Security: Verify the resolved path is still within covers directory
const coversDir = path.join(process.cwd(), 'public/uploads/covers');
const resolvedPath = path.resolve(filePath);
if (!resolvedPath.startsWith(coversDir)) {
return new NextResponse('Forbidden', { status: 403 });
}
const stats = await stat(filePath);
const fileSize = stats.size;
// Determine content type based on file extension
const ext = filename.toLowerCase().split('.').pop();
const contentTypeMap: Record<string, string> = {
'jpg': 'image/jpeg',
'jpeg': 'image/jpeg',
'png': 'image/png',
'gif': 'image/gif',
'webp': 'image/webp',
};
const contentType = contentTypeMap[ext || ''] || 'image/jpeg';
const stream = createReadStream(filePath);
// Convert Node stream to Web stream
const readable = new ReadableStream({
start(controller) {
let isClosed = false;
stream.on('data', (chunk: any) => {
if (isClosed) return;
try {
controller.enqueue(chunk);
} catch (e) {
isClosed = true;
stream.destroy();
}
});
stream.on('end', () => {
if (isClosed) return;
isClosed = true;
controller.close();
});
stream.on('error', (err: any) => {
if (isClosed) return;
isClosed = true;
controller.error(err);
});
},
cancel() {
stream.destroy();
}
});
return new NextResponse(readable, {
status: 200,
headers: {
'Content-Length': fileSize.toString(),
'Content-Type': contentType,
'Cache-Control': 'public, max-age=3600, must-revalidate',
},
});
} catch (error) {
console.error('Error serving cover image:', error);
return new NextResponse('Internal Server Error', { status: 500 });
}
}

View File

@@ -1,9 +1,14 @@
import { NextRequest, NextResponse } from 'next/server';
import { PrismaClient } from '@prisma/client';
import { requireStaffAuth } from '@/lib/auth';
import { access } from 'fs/promises';
import path from 'path';
const prisma = new PrismaClient();
// Mark route as dynamic to prevent caching
export const dynamic = 'force-dynamic';
export async function GET(
request: NextRequest,
{ params }: { params: Promise<{ id: string }> }
@@ -52,7 +57,41 @@ export async function GET(
return NextResponse.json({ error: 'Special not found' }, { status: 404 });
}
return NextResponse.json(special);
// Filtere Songs ohne vollständige Song-Daten und prüfe Datei-Existenz
// Dies verhindert Fehler im Frontend, wenn Songs gelöscht wurden, Daten fehlen
// oder Dateien noch nicht im Container verfügbar sind (Volume Mount Delay)
const uploadsDir = path.join(process.cwd(), 'public/uploads');
const filteredSongs = await Promise.all(
special.songs
.filter(ss => ss.song && ss.song.filename)
.map(async (ss) => {
const filePath = path.join(uploadsDir, ss.song.filename);
try {
// Prüfe ob Datei existiert und zugänglich ist
await access(filePath);
return ss;
} catch (error) {
// Datei existiert nicht oder ist nicht zugänglich
console.warn(`[API] Song file not available: ${ss.song.filename} (may be syncing)`);
return null;
}
})
);
// Entferne null-Werte (Songs ohne verfügbare Dateien)
const availableSongs = filteredSongs.filter((ss): ss is typeof special.songs[0] => ss !== null);
return NextResponse.json({
...special,
songs: availableSongs,
}, {
headers: {
'Cache-Control': 'no-store, no-cache, must-revalidate, proxy-revalidate',
'Pragma': 'no-cache',
'Expires': '0',
},
});
}

View File

@@ -43,18 +43,20 @@ export async function PUT(
try {
const { id } = await params;
const specialId = parseInt(id);
const { name, maxAttempts, unlockSteps, launchDate, endDate, curator } = await request.json();
const { name, maxAttempts, unlockSteps, launchDate, endDate, curator, hidden } = await request.json();
const updateData: any = {};
if (name !== undefined) updateData.name = name;
if (maxAttempts !== undefined) updateData.maxAttempts = maxAttempts;
if (unlockSteps !== undefined) updateData.unlockSteps = typeof unlockSteps === 'string' ? unlockSteps : JSON.stringify(unlockSteps);
if (launchDate !== undefined) updateData.launchDate = launchDate ? new Date(launchDate) : null;
if (endDate !== undefined) updateData.endDate = endDate ? new Date(endDate) : null;
if (curator !== undefined) updateData.curator = curator || null;
if (hidden !== undefined) updateData.hidden = Boolean(hidden);
const special = await prisma.special.update({
where: { id: specialId },
data: {
name,
maxAttempts,
unlockSteps: typeof unlockSteps === 'string' ? unlockSteps : JSON.stringify(unlockSteps),
launchDate: launchDate ? new Date(launchDate) : null,
endDate: endDate ? new Date(endDate) : null,
curator: curator || null,
}
data: updateData
});
return NextResponse.json(special);

View File

@@ -35,11 +35,26 @@ export async function POST(request: Request) {
const authError = await requireAdminAuth(request as any);
if (authError) return authError;
const { name, subtitle, maxAttempts = 7, unlockSteps = '[2,4,7,11,16,30,60]', launchDate, endDate, curator } = await request.json();
const { name, subtitle, maxAttempts = 7, unlockSteps = '[2,4,7,11,16,30,60]', launchDate, endDate, curator, hidden = false } = await request.json();
if (!name) {
return NextResponse.json({ error: 'Name is required' }, { status: 400 });
}
// Validate unlockSteps JSON
if (unlockSteps) {
try {
const parsed = JSON.parse(unlockSteps);
if (!Array.isArray(parsed)) {
return NextResponse.json({ error: 'Unlock steps must be a JSON array' }, { status: 400 });
}
if (parsed.some((item: any) => typeof item !== 'number' || item < 1)) {
return NextResponse.json({ error: 'All unlock step values must be positive numbers' }, { status: 400 });
}
} catch (e) {
return NextResponse.json({ error: 'Invalid JSON format for unlock steps. Please use an array of numbers, e.g. [2,4,7,11,16,30,60]' }, { status: 400 });
}
}
// Ensure name is stored as JSON
const nameData = typeof name === 'string' ? { de: name, en: name } : name;
const subtitleData = subtitle ? (typeof subtitle === 'string' ? { de: subtitle, en: subtitle } : subtitle) : null;
@@ -53,6 +68,7 @@ export async function POST(request: Request) {
launchDate: launchDate ? new Date(launchDate) : null,
endDate: endDate ? new Date(endDate) : null,
curator: curator || null,
hidden: Boolean(hidden),
},
});
return NextResponse.json(special);
@@ -76,11 +92,26 @@ export async function PUT(request: Request) {
const authError = await requireAdminAuth(request as any);
if (authError) return authError;
const { id, name, subtitle, maxAttempts, unlockSteps, launchDate, endDate, curator } = await request.json();
const { id, name, subtitle, maxAttempts, unlockSteps, launchDate, endDate, curator, hidden } = await request.json();
if (!id) {
return NextResponse.json({ error: 'ID required' }, { status: 400 });
}
// Validate unlockSteps JSON if provided
if (unlockSteps !== undefined) {
try {
const parsed = JSON.parse(unlockSteps);
if (!Array.isArray(parsed)) {
return NextResponse.json({ error: 'Unlock steps must be a JSON array' }, { status: 400 });
}
if (parsed.some((item: any) => typeof item !== 'number' || item < 1)) {
return NextResponse.json({ error: 'All unlock step values must be positive numbers' }, { status: 400 });
}
} catch (e) {
return NextResponse.json({ error: 'Invalid JSON format for unlock steps. Please use an array of numbers, e.g. [2,4,7,11,16,30,60]' }, { status: 400 });
}
}
const updateData: any = {};
if (name) updateData.name = typeof name === 'string' ? { de: name, en: name } : name;
if (subtitle !== undefined) updateData.subtitle = subtitle ? (typeof subtitle === 'string' ? { de: subtitle, en: subtitle } : subtitle) : null;
@@ -89,6 +120,7 @@ export async function PUT(request: Request) {
if (launchDate !== undefined) updateData.launchDate = launchDate ? new Date(launchDate) : null;
if (endDate !== undefined) updateData.endDate = endDate ? new Date(endDate) : null;
if (curator !== undefined) updateData.curator = curator || null;
if (hidden !== undefined) updateData.hidden = Boolean(hidden);
const updated = await prisma.special.update({
where: { id: Number(id) },

View File

@@ -22,6 +22,7 @@ interface Song {
filename: string;
createdAt: string;
releaseYear: number | null;
coverImage: string | null;
activations?: number;
puzzles?: any[];
genres: Genre[];
@@ -128,6 +129,7 @@ export default function CuratorPageClient() {
const [itemsPerPage, setItemsPerPage] = useState(10);
const [playingSongId, setPlayingSongId] = useState<number | null>(null);
const [audioElement, setAudioElement] = useState<HTMLAudioElement | null>(null);
const [hoveredCoverSongId, setHoveredCoverSongId] = useState<number | null>(null);
// Comments state
const [comments, setComments] = useState<CuratorComment[]>([]);
@@ -1613,7 +1615,7 @@ export default function CuratorPageClient() {
</div>
)}
<div style={{ overflowX: 'auto' }}>
<div style={{ overflowX: 'auto', position: 'relative' }}>
<table
style={{
width: '100%',
@@ -1663,6 +1665,7 @@ export default function CuratorPageClient() {
>
{t('columnYear')} {sortField === 'releaseYear' && (sortDirection === 'asc' ? '↑' : '↓')}
</th>
<th style={{ padding: '0.5rem' }}>{t('columnCover')}</th>
<th style={{ padding: '0.5rem' }}>{t('columnGenresSpecials')}</th>
<th
style={{ padding: '0.5rem', cursor: 'pointer' }}
@@ -1683,7 +1686,17 @@ export default function CuratorPageClient() {
{t('columnRating')} {sortField === 'averageRating' && (sortDirection === 'asc' ? '↑' : '↓')}
</th>
<th style={{ padding: '0.5rem' }}>{t('columnExcludeGlobal')}</th>
<th style={{ padding: '0.5rem' }}>{t('columnActions')}</th>
<th
style={{
padding: '0.5rem',
position: 'sticky',
right: 0,
backgroundColor: 'white',
zIndex: 10,
}}
>
{t('columnActions')}
</th>
</tr>
</thead>
<tbody>
@@ -1698,12 +1711,13 @@ export default function CuratorPageClient() {
const isSelected = selectedSongIds.has(song.id);
const rowBackgroundColor = isSelected ? '#eff6ff' : 'white';
return (
<tr
key={song.id}
style={{
borderBottom: '1px solid #f3f4f6',
backgroundColor: isSelected ? '#eff6ff' : 'transparent',
backgroundColor: rowBackgroundColor,
}}
>
<td style={{ padding: '0.5rem' }}>
@@ -1778,6 +1792,48 @@ export default function CuratorPageClient() {
'-'
)}
</td>
<td
style={{
padding: '0.5rem',
textAlign: 'center',
position: 'relative',
cursor: song.coverImage ? 'pointer' : 'default'
}}
onMouseEnter={() => song.coverImage && setHoveredCoverSongId(song.id)}
onMouseLeave={() => setHoveredCoverSongId(null)}
>
{song.coverImage ? '✓' : '-'}
{hoveredCoverSongId === song.id && song.coverImage && (
<div
style={{
position: 'absolute',
top: '100%',
left: '50%',
transform: 'translateX(-50%)',
marginTop: '0.5rem',
zIndex: 1000,
padding: '0.5rem',
background: 'white',
border: '1px solid #d1d5db',
borderRadius: '0.5rem',
boxShadow: '0 4px 6px -1px rgba(0, 0, 0, 0.1)',
pointerEvents: 'none',
}}
>
<img
src={`/api/covers/${song.coverImage}`}
alt={`Cover für ${song.title}`}
style={{
width: '200px',
height: '200px',
objectFit: 'cover',
borderRadius: '0.25rem',
display: 'block',
}}
/>
</div>
)}
</td>
<td style={{ padding: '0.5rem' }}>
{isEditing ? (
<div style={{ display: 'flex', flexDirection: 'column', gap: '0.25rem' }}>
@@ -1965,6 +2021,10 @@ export default function CuratorPageClient() {
style={{
padding: '0.5rem',
whiteSpace: 'nowrap',
position: 'sticky',
right: 0,
backgroundColor: rowBackgroundColor,
zIndex: 10,
}}
>
{isEditing ? (
@@ -1980,6 +2040,7 @@ export default function CuratorPageClient() {
border: 'none',
borderRadius: '0.25rem',
cursor: 'pointer',
whiteSpace: 'nowrap',
}}
>
💾
@@ -1993,6 +2054,7 @@ export default function CuratorPageClient() {
border: 'none',
borderRadius: '0.25rem',
cursor: 'pointer',
whiteSpace: 'nowrap',
}}
>

View File

@@ -0,0 +1,156 @@
'use client';
import { useEffect, useState } from 'react';
import { useRouter, usePathname } from 'next/navigation';
import { useLocale, useTranslations } from 'next-intl';
import { Link } from '@/lib/navigation';
import { getCuratorAuthHeaders } from '@/lib/curatorAuth';
import { getLocalizedValue } from '@/lib/i18n';
interface CuratorSpecial {
id: number;
name: string | { de?: string; en?: string };
songCount: number;
}
export default function CuratorSpecialsClient() {
const router = useRouter();
const pathname = usePathname();
const urlLocale = pathname?.split('/')[1] as 'de' | 'en' | undefined;
const intlLocale = useLocale() as 'de' | 'en';
const locale: 'de' | 'en' = urlLocale === 'de' || urlLocale === 'en' ? urlLocale : intlLocale;
const t = useTranslations('Curator');
const [specials, setSpecials] = useState<CuratorSpecial[]>([]);
const [loading, setLoading] = useState(true);
const [error, setError] = useState<string | null>(null);
useEffect(() => {
const fetchSpecials = async () => {
try {
setLoading(true);
const res = await fetch('/api/curator/specials', {
headers: getCuratorAuthHeaders(),
});
if (!res.ok) {
if (res.status === 403) {
setError(t('specialForbidden'));
} else {
setError('Failed to load specials');
}
return;
}
const data = await res.json();
setSpecials(data);
} catch (e) {
setError('Failed to load specials');
} finally {
setLoading(false);
}
};
fetchSpecials();
}, [t]);
if (loading) {
return (
<div style={{ maxWidth: '960px', margin: '2rem auto', padding: '1rem' }}>
<p>{t('loading')}</p>
</div>
);
}
if (error) {
return (
<div style={{ maxWidth: '960px', margin: '2rem auto', padding: '1rem' }}>
<p style={{ color: 'red' }}>{error}</p>
<Link
href="/curator"
style={{
display: 'inline-block',
marginTop: '1rem',
padding: '0.5rem 1rem',
background: '#6b7280',
color: 'white',
textDecoration: 'none',
borderRadius: '0.375rem',
fontSize: '0.9rem',
}}
>
{t('backToDashboard') || 'Back to Dashboard'}
</Link>
</div>
);
}
return (
<div style={{ maxWidth: '960px', margin: '2rem auto', padding: '1rem' }}>
<header style={{ marginBottom: '2rem' }}>
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
<h1 style={{ fontSize: '1.75rem', marginBottom: '0.25rem' }}>
{t('curateSpecialsTitle') || 'Curate Specials'}
</h1>
<Link
href="/curator"
style={{
padding: '0.5rem 1rem',
background: '#6b7280',
color: 'white',
textDecoration: 'none',
borderRadius: '0.375rem',
fontSize: '0.9rem',
}}
>
{t('backToDashboard') || 'Back to Dashboard'}
</Link>
</div>
</header>
{specials.length === 0 ? (
<div style={{ padding: '2rem', textAlign: 'center', color: '#666' }}>
<p>{t('noSpecialsAssigned') || 'No specials assigned to you.'}</p>
</div>
) : (
<div style={{ display: 'flex', flexDirection: 'column', gap: '1rem' }}>
{specials.map((special) => (
<Link
key={special.id}
href={`/curator/specials/${special.id}`}
style={{
display: 'block',
padding: '1.5rem',
background: '#f9fafb',
border: '1px solid #e5e7eb',
borderRadius: '0.5rem',
textDecoration: 'none',
color: 'inherit',
transition: 'all 0.2s',
}}
onMouseEnter={(e) => {
e.currentTarget.style.background = '#f3f4f6';
e.currentTarget.style.borderColor = '#d1d5db';
}}
onMouseLeave={(e) => {
e.currentTarget.style.background = '#f9fafb';
e.currentTarget.style.borderColor = '#e5e7eb';
}}
>
<div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
<div>
<h2 style={{ fontSize: '1.25rem', marginBottom: '0.5rem', color: '#111827' }}>
{getLocalizedValue(special.name, locale)}
</h2>
<p style={{ fontSize: '0.875rem', color: '#6b7280' }}>
{special.songCount} {special.songCount === 1 ? 'song' : 'songs'}
</p>
</div>
<div style={{ fontSize: '1.5rem', color: '#10b981' }}></div>
</div>
</Link>
))}
</div>
)}
</div>
);
}

View File

@@ -25,12 +25,14 @@ export default function CuratorSpecialEditorPage() {
const [loading, setLoading] = useState(true);
const [error, setError] = useState<string | null>(null);
useEffect(() => {
const fetchSpecial = async () => {
const fetchSpecial = async (showLoading = true) => {
try {
if (showLoading) {
setLoading(true);
}
const res = await fetch(`/api/curator/specials/${specialId}`, {
headers: getCuratorAuthHeaders(),
cache: 'no-store',
});
if (res.status === 403) {
setError(t('specialForbidden'));
@@ -45,12 +47,15 @@ export default function CuratorSpecialEditorPage() {
} catch (e) {
setError('Failed to load special');
} finally {
if (showLoading) {
setLoading(false);
}
}
};
useEffect(() => {
if (specialId) {
fetchSpecial();
fetchSpecial(true);
}
}, [specialId, t]);
@@ -67,6 +72,9 @@ export default function CuratorSpecialEditorPage() {
setError(t('specialForbidden'));
} else if (!res.ok) {
setError('Failed to save changes');
} else {
// Reload special data to update the start time in the song list
await fetchSpecial(false);
}
};

View File

@@ -1,141 +0,0 @@
.page {
--background: #fafafa;
--foreground: #fff;
--text-primary: #000;
--text-secondary: #666;
--button-primary-hover: #383838;
--button-secondary-hover: #f2f2f2;
--button-secondary-border: #ebebeb;
display: flex;
min-height: 100vh;
align-items: center;
justify-content: center;
font-family: var(--font-geist-sans);
background-color: var(--background);
}
.main {
display: flex;
min-height: 100vh;
width: 100%;
max-width: 800px;
flex-direction: column;
align-items: flex-start;
justify-content: space-between;
background-color: var(--foreground);
padding: 120px 60px;
}
.intro {
display: flex;
flex-direction: column;
align-items: flex-start;
text-align: left;
gap: 24px;
}
.intro h1 {
max-width: 320px;
font-size: 40px;
font-weight: 600;
line-height: 48px;
letter-spacing: -2.4px;
text-wrap: balance;
color: var(--text-primary);
}
.intro p {
max-width: 440px;
font-size: 18px;
line-height: 32px;
text-wrap: balance;
color: var(--text-secondary);
}
.intro a {
font-weight: 500;
color: var(--text-primary);
}
.ctas {
display: flex;
flex-direction: row;
width: 100%;
max-width: 440px;
gap: 16px;
font-size: 14px;
}
.ctas a {
display: flex;
justify-content: center;
align-items: center;
height: 40px;
padding: 0 16px;
border-radius: 128px;
border: 1px solid transparent;
transition: 0.2s;
cursor: pointer;
width: fit-content;
font-weight: 500;
}
a.primary {
background: var(--text-primary);
color: var(--background);
gap: 8px;
}
a.secondary {
border-color: var(--button-secondary-border);
}
/* Enable hover only on non-touch devices */
@media (hover: hover) and (pointer: fine) {
a.primary:hover {
background: var(--button-primary-hover);
border-color: transparent;
}
a.secondary:hover {
background: var(--button-secondary-hover);
border-color: transparent;
}
}
@media (max-width: 600px) {
.main {
padding: 48px 24px;
}
.intro {
gap: 16px;
}
.intro h1 {
font-size: 32px;
line-height: 40px;
letter-spacing: -1.92px;
}
}
@media (prefers-color-scheme: dark) {
.logo {
filter: invert();
}
.page {
--background: #000;
--foreground: #000;
--text-primary: #ededed;
--text-secondary: #999;
--button-primary-hover: #ccc;
--button-secondary-hover: #1a1a1a;
--button-secondary-border: #1a1a1a;
}
}

View File

@@ -62,11 +62,14 @@ export default function CurateSpecialEditor({
saveChangesLabel = '💾 Save Changes',
savedLabel = '✓ Saved',
}: CurateSpecialEditorProps) {
// Filtere Songs ohne vollständige Song-Daten (song, song.filename)
const validSongs = special.songs.filter(ss => ss.song && ss.song.filename);
const [selectedSongId, setSelectedSongId] = useState<number | null>(
special.songs.length > 0 ? special.songs[0].songId : null
validSongs.length > 0 ? validSongs[0].songId : null
);
const [pendingStartTime, setPendingStartTime] = useState<number | null>(
special.songs.length > 0 ? special.songs[0].startTime : null
validSongs.length > 0 ? validSongs[0].startTime : null
);
const [hasUnsavedChanges, setHasUnsavedChanges] = useState(false);
const [saving, setSaving] = useState(false);
@@ -77,7 +80,7 @@ export default function CurateSpecialEditor({
const unlockSteps = JSON.parse(special.unlockSteps);
const totalDuration = unlockSteps[unlockSteps.length - 1];
const selectedSpecialSong = special.songs.find(ss => ss.songId === selectedSongId) ?? null;
const selectedSpecialSong = validSongs.find(ss => ss.songId === selectedSongId) ?? null;
const handleStartTimeChange = (newStartTime: number) => {
setPendingStartTime(newStartTime);
@@ -98,19 +101,6 @@ export default function CurateSpecialEditor({
return (
<div style={{ padding: '2rem', maxWidth: '1200px', margin: '0 auto' }}>
<div style={{ marginBottom: '2rem' }}>
<button
onClick={onBack}
style={{
padding: '0.5rem 1rem',
background: '#e5e7eb',
border: 'none',
borderRadius: '0.5rem',
cursor: 'pointer',
marginBottom: '1rem'
}}
>
{backLabel}
</button>
<h1 style={{ fontSize: '2rem', fontWeight: 'bold' }}>
{headerPrefix} {specialName}
</h1>
@@ -124,7 +114,7 @@ export default function CurateSpecialEditor({
</p>
</div>
{special.songs.length === 0 ? (
{validSongs.length === 0 ? (
<div style={{ padding: '2rem', background: '#f3f4f6', borderRadius: '0.5rem', textAlign: 'center' }}>
<p>{noSongsHint}</p>
<p style={{ fontSize: '0.875rem', color: '#666', marginTop: '0.5rem' }}>
@@ -138,7 +128,7 @@ export default function CurateSpecialEditor({
Select Song to Curate
</h2>
<div style={{ display: 'grid', gridTemplateColumns: 'repeat(auto-fill, minmax(250px, 1fr))', gap: '1rem' }}>
{special.songs.map(ss => (
{validSongs.map(ss => (
<div
key={ss.songId}
onClick={() => {
@@ -165,7 +155,7 @@ export default function CurateSpecialEditor({
</div>
</div>
{selectedSpecialSong && (
{selectedSpecialSong && selectedSpecialSong.song && selectedSpecialSong.song.filename ? (
<div>
<h2 style={{ fontSize: '1.25rem', fontWeight: 'bold', marginBottom: '1rem' }}>
Curate: {selectedSpecialSong.song.title}
@@ -194,7 +184,7 @@ export default function CurateSpecialEditor({
</button>
</div>
<WaveformEditor
audioUrl={`/uploads/${selectedSpecialSong.song.filename}`}
audioUrl={`/api/audio/${selectedSpecialSong.song.filename}`}
startTime={pendingStartTime ?? selectedSpecialSong.startTime}
duration={totalDuration}
unlockSteps={unlockSteps}
@@ -202,7 +192,13 @@ export default function CurateSpecialEditor({
/>
</div>
</div>
)}
) : selectedSpecialSong ? (
<div style={{ padding: '2rem', background: '#fee2e2', borderRadius: '0.5rem', textAlign: 'center' }}>
<p style={{ color: '#991b1b', fontWeight: 'bold' }}>
Fehler: Song-Daten unvollständig. Bitte wählen Sie einen anderen Song.
</p>
</div>
) : null}
</div>
)}
</div>

View File

@@ -681,7 +681,8 @@ export default function Game({ dailyPuzzle, genre = null, isSpecial = false, max
fontFamily: 'inherit',
resize: 'vertical',
marginBottom: '0.5rem',
display: 'block' // Ensure block display for proper alignment
display: 'block',
boxSizing: 'border-box' // Ensure padding and border are included in width
}}
disabled={commentSending}
/>

View File

@@ -12,10 +12,14 @@ interface WaveformEditorProps {
export default function WaveformEditor({ audioUrl, startTime, duration, unlockSteps, onStartTimeChange }: WaveformEditorProps) {
const canvasRef = useRef<HTMLCanvasElement>(null);
const timelineRef = useRef<HTMLCanvasElement>(null);
const [audioBuffer, setAudioBuffer] = useState<AudioBuffer | null>(null);
const [audioDuration, setAudioDuration] = useState(0);
const [isPlaying, setIsPlaying] = useState(false);
const [playingSegment, setPlayingSegment] = useState<number | null>(null);
const [isPlayingFullTitle, setIsPlayingFullTitle] = useState(false);
const [pausedPosition, setPausedPosition] = useState<number | null>(null); // Position when paused
const [pausedType, setPausedType] = useState<'selection' | 'title' | null>(null); // Type of playback that was paused
const [zoom, setZoom] = useState(1); // 1 = full view, higher = zoomed in
const [viewOffset, setViewOffset] = useState(0); // Offset in seconds for panning
const [playbackPosition, setPlaybackPosition] = useState<number | null>(null); // Current playback position in seconds
@@ -55,6 +59,80 @@ export default function WaveformEditor({ audioUrl, startTime, duration, unlockSt
};
}, [audioUrl]);
// Draw timeline
useEffect(() => {
if (!audioDuration || !timelineRef.current) return;
const timeline = timelineRef.current;
const ctx = timeline.getContext('2d');
if (!ctx) return;
const width = timeline.width;
const height = timeline.height;
// Calculate visible range based on zoom and offset (same as waveform)
const visibleDuration = audioDuration / zoom;
const visibleStart = Math.max(0, Math.min(viewOffset, audioDuration - visibleDuration));
const visibleEnd = Math.min(audioDuration, visibleStart + visibleDuration);
// Clear timeline
ctx.fillStyle = '#ffffff';
ctx.fillRect(0, 0, width, height);
// Draw border
ctx.strokeStyle = '#e5e7eb';
ctx.lineWidth = 1;
ctx.strokeRect(0, 0, width, height);
// Calculate appropriate time interval based on visible duration
let timeInterval = 1; // Start with 1 second
if (visibleDuration > 60) timeInterval = 10;
else if (visibleDuration > 30) timeInterval = 5;
else if (visibleDuration > 10) timeInterval = 2;
else if (visibleDuration > 5) timeInterval = 1;
else if (visibleDuration > 1) timeInterval = 0.5;
else timeInterval = 0.1;
// Draw time markers
ctx.strokeStyle = '#9ca3af';
ctx.lineWidth = 1;
ctx.fillStyle = '#374151';
ctx.font = '10px sans-serif';
ctx.textAlign = 'center';
ctx.textBaseline = 'top';
const startTimeMarker = Math.floor(visibleStart / timeInterval) * timeInterval;
for (let time = startTimeMarker; time <= visibleEnd; time += timeInterval) {
const timePx = ((time - visibleStart) / visibleDuration) * width;
if (timePx >= 0 && timePx <= width) {
// Draw tick mark
ctx.beginPath();
ctx.moveTo(timePx, 0);
ctx.lineTo(timePx, height);
ctx.stroke();
// Draw time label
const timeLabel = time.toFixed(timeInterval < 1 ? 1 : 0);
ctx.fillText(`${timeLabel}s`, timePx, 2);
}
}
// Draw current playback position if playing
if (playbackPosition !== null) {
const playbackPx = ((playbackPosition - visibleStart) / visibleDuration) * width;
if (playbackPx >= 0 && playbackPx <= width) {
ctx.strokeStyle = '#10b981';
ctx.lineWidth = 2;
ctx.beginPath();
ctx.moveTo(playbackPx, 0);
ctx.lineTo(playbackPx, height);
ctx.stroke();
}
}
}, [audioDuration, zoom, viewOffset, playbackPosition]);
useEffect(() => {
if (!audioBuffer || !canvasRef.current) return;
@@ -133,6 +211,24 @@ export default function WaveformEditor({ audioUrl, startTime, duration, unlockSt
cumulativeTime = step;
});
// Draw end marker for the last segment (at startTime + duration)
const endTime = startTime + duration;
const endPx = ((endTime - visibleStart) / visibleDuration) * width;
if (endPx >= 0 && endPx <= width) {
ctx.beginPath();
ctx.moveTo(endPx, 0);
ctx.lineTo(endPx, height);
ctx.stroke();
// Draw "End" label
ctx.setLineDash([]);
ctx.fillStyle = '#ef4444';
ctx.font = 'bold 12px sans-serif';
ctx.fillText('End', endPx + 3, 15);
ctx.setLineDash([5, 5]);
}
ctx.setLineDash([]);
// Draw hover preview (semi-transparent)
@@ -215,11 +311,21 @@ export default function WaveformEditor({ audioUrl, startTime, duration, unlockSt
setHoverPreviewTime(null);
};
const stopPlayback = () => {
const stopPlayback = (savePosition = false) => {
if (savePosition && playbackPosition !== null) {
// Save current position for resume
setPausedPosition(playbackPosition);
// Keep playbackPosition visible (don't set to null) so cursor stays visible
} else {
// Clear paused position if stopping completely
setPausedPosition(null);
setPausedType(null);
setPlaybackPosition(null);
}
sourceRef.current?.stop();
setIsPlaying(false);
setPlayingSegment(null);
setPlaybackPosition(null);
setIsPlayingFullTitle(false);
if (animationFrameRef.current) {
cancelAnimationFrame(animationFrameRef.current);
animationFrameRef.current = null;
@@ -287,30 +393,119 @@ export default function WaveformEditor({ audioUrl, startTime, duration, unlockSt
const handlePlayFull = () => {
if (!audioBuffer || !audioContextRef.current) return;
if (isPlaying) {
// If full selection playback is already playing, pause it
if (isPlaying && playingSegment === null && !isPlayingFullTitle) {
stopPlayback(true); // Save position
setPausedType('selection');
return;
}
// Stop any current playback (segment, full selection, or full title)
stopPlayback();
} else {
// Determine start position (resume from pause or start from beginning)
const resumePosition = pausedType === 'selection' && pausedPosition !== null
? pausedPosition
: startTime;
const remainingDuration = resumePosition >= startTime + duration
? 0
: (startTime + duration) - resumePosition;
if (remainingDuration <= 0) {
// Already finished, reset
setPausedPosition(null);
setPausedType(null);
return;
}
// Start full selection playback
const source = audioContextRef.current.createBufferSource();
source.buffer = audioBuffer;
source.connect(audioContextRef.current.destination);
playbackStartTimeRef.current = audioContextRef.current.currentTime;
playbackOffsetRef.current = startTime;
playbackOffsetRef.current = resumePosition;
source.start(0, startTime, duration);
source.start(0, resumePosition, remainingDuration);
sourceRef.current = source;
setIsPlaying(true);
setPlaybackPosition(startTime);
setPlayingSegment(null);
setIsPlayingFullTitle(false);
setPausedPosition(null);
setPausedType(null);
setPlaybackPosition(resumePosition);
source.onended = () => {
setIsPlaying(false);
setPlayingSegment(null);
setIsPlayingFullTitle(false);
setPlaybackPosition(null);
setPausedPosition(null);
setPausedType(null);
if (animationFrameRef.current) {
cancelAnimationFrame(animationFrameRef.current);
animationFrameRef.current = null;
}
};
};
const handlePlayFullTitle = () => {
if (!audioBuffer || !audioContextRef.current) return;
// If full title playback is already playing, pause it
if (isPlaying && isPlayingFullTitle) {
stopPlayback(true); // Save position
setPausedType('title');
return;
}
// Stop any current playback (segment, full selection, or full title)
stopPlayback();
// Determine start position (resume from pause or start from beginning)
const resumePosition = pausedType === 'title' && pausedPosition !== null
? pausedPosition
: 0;
const remainingDuration = resumePosition >= audioDuration
? 0
: audioDuration - resumePosition;
if (remainingDuration <= 0) {
// Already finished, reset
setPausedPosition(null);
setPausedType(null);
return;
}
// Start full title playback (from resumePosition to audioDuration)
const source = audioContextRef.current.createBufferSource();
source.buffer = audioBuffer;
source.connect(audioContextRef.current.destination);
playbackStartTimeRef.current = audioContextRef.current.currentTime;
playbackOffsetRef.current = resumePosition;
source.start(0, resumePosition, remainingDuration);
sourceRef.current = source;
setIsPlaying(true);
setPlayingSegment(null);
setIsPlayingFullTitle(true);
setPausedPosition(null);
setPausedType(null);
setPlaybackPosition(resumePosition);
source.onended = () => {
setIsPlaying(false);
setPlayingSegment(null);
setIsPlayingFullTitle(false);
setPlaybackPosition(null);
setPausedPosition(null);
setPausedType(null);
if (animationFrameRef.current) {
cancelAnimationFrame(animationFrameRef.current);
animationFrameRef.current = null;
}
};
};
const handleZoomIn = () => setZoom(prev => Math.min(prev * 1.5, 10));
@@ -371,6 +566,7 @@ export default function WaveformEditor({ audioUrl, startTime, duration, unlockSt
)}
</div>
<div style={{ position: 'relative' }}>
<canvas
ref={canvasRef}
width={800}
@@ -383,9 +579,25 @@ export default function WaveformEditor({ audioUrl, startTime, duration, unlockSt
height: 'auto',
cursor: 'pointer',
border: '1px solid #e5e7eb',
borderRadius: '0.5rem'
borderRadius: '0.5rem 0.5rem 0 0',
display: 'block'
}}
/>
<canvas
ref={timelineRef}
width={800}
height={30}
style={{
width: '100%',
height: '30px',
border: '1px solid #e5e7eb',
borderTop: 'none',
borderRadius: '0 0 0.5rem 0.5rem',
display: 'block',
background: '#ffffff'
}}
/>
</div>
{/* Playback Controls */}
<div style={{ marginTop: '1rem', display: 'flex', gap: '1rem', alignItems: 'center', flexWrap: 'wrap' }}>
@@ -401,7 +613,29 @@ export default function WaveformEditor({ audioUrl, startTime, duration, unlockSt
fontWeight: 'bold'
}}
>
{isPlaying && playingSegment === null ? '⏸ Pause' : '▶ Play Full Selection'}
{isPlaying && playingSegment === null && !isPlayingFullTitle
? '⏸ Pause'
: (pausedType === 'selection' && pausedPosition !== null
? '▶ Resume'
: '▶ Play Full Selection')}
</button>
<button
onClick={handlePlayFullTitle}
style={{
padding: '0.5rem 1rem',
background: '#10b981',
color: 'white',
border: 'none',
borderRadius: '0.5rem',
cursor: 'pointer',
fontWeight: 'bold'
}}
>
{isPlaying && isPlayingFullTitle
? '⏸ Pause'
: (pausedType === 'title' && pausedPosition !== null
? '▶ Resume'
: '▶ Play Full Title')}
</button>
<div style={{ fontSize: '0.875rem', color: '#666' }}>

88
docs/TESTING.md Normal file
View File

@@ -0,0 +1,88 @@
# Integration Testing
Hördle uses [Playwright](https://playwright.dev/) for end-to-end (E2E) integration testing. These tests ensure that critical flows like gameplay, authentication, and admin management function correctly across different browsers.
## Prerequisites
Ensure you have the Playwright browsers installed:
```bash
npx playwright install
```
## Running Tests
### Headless Mode (CI/CLI)
To run all tests in headless mode (Chromium, Firefox, WebKit):
```bash
npm run test:e2e
```
### UI Mode (Interactive)
To run tests with a UI to inspect traces and watch execution:
```bash
npm run test:e2e:ui
```
### Specific Test File
To run a specific test file:
```bash
npx playwright test tests/gameplay.spec.ts
```
### Specific Project (Browser)
To run tests only on a specific browser (e.g., Chromium):
```bash
npx playwright test --project=chromium
```
## Configuration
The Playwright configuration is located in `playwright.config.ts`. It sets up the base URL (default: `http://localhost:3000`) and the web server command to start the app if it's not running.
### Environment Variables
* **`ADMIN_PASSWORD`**: The tests assume the admin password is `'admin123'`.
* In `app/api/admin/login/route.ts`, the login logic has been enhanced to check if `ADMIN_PASSWORD` is a bcrypt hash (starts with `$2b$`) or plain text.
* For local testing, you can set `ADMIN_PASSWORD="admin123"` in your `.env` or `.env.local` (though the default fallback in the code also handles this).
* **Curator Credentials**: The mock Curator login page (`app/[locale]/curator/page.tsx`) mocks validation for testing.
* Username: `elpatron`
* Password: `example_password`
## Test Structure
Tests are located in the `tests/` directory:
* **`auth.spec.ts`**: Verifies public access and admin login flows.
* **`admin.spec.ts`**: Checks the Admin Dashboard, including access protection and visibility of sections (Dashboard, Daily Puzzles, etc.).
* **`curator.spec.ts`**: Verifies the Curator login form and authentication flows (valid/invalid credentials).
* **`gameplay.spec.ts`**: Tests the core game loop: loading the game, playing audio, interaction with the prompt, and submitting a guess.
## Troubleshooting & Known Issues
### Next.js Development Overlay (`nextjs-portal`)
In development mode (`npm run dev`), Next.js injects an overlay (`<nextjs-portal>`) for hot reloading feedback. This overlay can sometimes intercept clicks intended for UI elements, causing tests to fail with "element is not clickable" or timeout errors.
**Solution:**
We inject a CSS style in the `beforeEach` hook of our tests to hide this overlay:
```typescript
test.beforeEach(async ({ page }) => {
await page.addStyleTag({ content: 'nextjs-portal, #nextjs-dev-overlay, [data-nextjs-dev-overlay] { display: none !important; }' });
});
```
### WebKit (Safari) Stability
WebKit can be slower or more sensitive to timing in some environments. If tests fail on WebKit but pass on other browsers:
1. Try increasing the timeout in `playwright.config.ts`.
2. Use `await page.waitForTimeout(500)` or specific assertions like `await expect(page).toHaveURL(...)` to allow for transition times, as implemented in `tests/admin.spec.ts`.

View File

@@ -29,9 +29,7 @@ export async function getOrCreateDailyPuzzle(genre: Genre | null = null) {
const allSongs = await prisma.song.findMany({
where: whereClause,
include: {
puzzles: {
where: { genreId: genreId }
},
puzzles: true, // Load ALL puzzles, not just for this genre (to use total activations)
},
});
@@ -40,28 +38,24 @@ export async function getOrCreateDailyPuzzle(genre: Genre | null = null) {
return null;
}
// Calculate weights
const weightedSongs = allSongs.map(song => ({
// Find songs with the minimum number of activations (all puzzles, not just for this genre)
// Only select from songs with the fewest activations to ensure fair distribution
const songsWithActivations = allSongs.map(song => ({
song,
weight: 1.0 / (song.puzzles.length + 1),
activations: song.puzzles.length,
}));
// Calculate total weight
const totalWeight = weightedSongs.reduce((sum, item) => sum + item.weight, 0);
// Find minimum activations
const minActivations = Math.min(...songsWithActivations.map(item => item.activations));
// Pick a random song based on weights using cumulative weights
// This ensures proper distribution and handles edge cases
let random = Math.random() * totalWeight;
let selectedSong = weightedSongs[weightedSongs.length - 1].song; // Fallback to last song
// Filter to only songs with minimum activations
const songsWithMinActivations = songsWithActivations
.filter(item => item.activations === minActivations)
.map(item => item.song);
let cumulativeWeight = 0;
for (const item of weightedSongs) {
cumulativeWeight += item.weight;
if (random <= cumulativeWeight) {
selectedSong = item.song;
break;
}
}
// Randomly select from songs with minimum activations
const randomIndex = Math.floor(Math.random() * songsWithMinActivations.length);
const selectedSong = songsWithMinActivations[randomIndex];
// Create the daily puzzle
try {
@@ -141,7 +135,7 @@ export async function getOrCreateSpecialPuzzle(special: Special) {
song: {
include: {
puzzles: {
where: { specialId: special.id }
where: { specialId: special.id } // For specials, only count puzzles within this special
}
}
}
@@ -150,25 +144,25 @@ export async function getOrCreateSpecialPuzzle(special: Special) {
if (specialSongs.length === 0) return null;
// Calculate weights
const weightedSongs = specialSongs.map(specialSong => ({
// Find songs with the minimum number of activations within this special
// Note: For specials, we only count puzzles within the special (not all puzzles),
// since specials are curated, separate lists
const songsWithActivations = specialSongs.map(specialSong => ({
specialSong,
weight: 1.0 / (specialSong.song.puzzles.length + 1),
activations: specialSong.song.puzzles.length,
}));
const totalWeight = weightedSongs.reduce((sum, item) => sum + item.weight, 0);
let random = Math.random() * totalWeight;
let selectedSpecialSong = weightedSongs[weightedSongs.length - 1].specialSong; // Fallback to last song
// Find minimum activations
const minActivations = Math.min(...songsWithActivations.map(item => item.activations));
// Pick a random song based on weights using cumulative weights
let cumulativeWeight = 0;
for (const item of weightedSongs) {
cumulativeWeight += item.weight;
if (random <= cumulativeWeight) {
selectedSpecialSong = item.specialSong;
break;
}
}
// Filter to only songs with minimum activations
const songsWithMinActivations = songsWithActivations
.filter(item => item.activations === minActivations)
.map(item => item.specialSong);
// Randomly select from songs with minimum activations
const randomIndex = Math.floor(Math.random() * songsWithMinActivations.length);
const selectedSpecialSong = songsWithMinActivations[randomIndex];
try {
dailyPuzzle = await prisma.dailyPuzzle.create({

View File

@@ -149,6 +149,10 @@
"subtitle": "Untertitel",
"maxAttempts": "Max. Versuche",
"unlockSteps": "Freischalt-Schritte",
"unlockStepsRequired": "Freischalt-Schritte sind erforderlich",
"unlockStepsInvalidJson": "Ungültiges JSON-Format. Bitte verwende ein Array von Zahlen, z.B. [2,4,7,11,16,30,60]",
"unlockStepsMustBeArray": "Freischalt-Schritte müssen ein Array sein",
"unlockStepsMustBePositiveNumbers": "Alle Werte müssen positive Zahlen sein",
"launchDate": "Startdatum",
"endDate": "Enddatum",
"curator": "Kurator",
@@ -227,6 +231,7 @@
"columnTitle": "Titel",
"columnArtist": "Artist",
"columnYear": "Jahr",
"columnCover": "Cover",
"columnGenresSpecials": "Genres / Specials",
"columnAdded": "Hinzugefügt",
"columnActivations": "Aktivierungen",
@@ -279,11 +284,13 @@
"batchUpdateError": "Fehler: {error}",
"batchUpdateNetworkError": "Netzwerkfehler bei der Batch-Aktualisierung",
"backToDashboard": "Zurück zum Dashboard",
"loading": "Laden...",
"curateSpecialsButton": "Specials kuratieren",
"curateSpecialsTitle": "Deine Specials kuratieren",
"curateSpecialsDescription": "Hier kannst du die Startzeiten der Songs in deinen zugewiesenen Specials für das Rätsel feinjustieren.",
"noSpecialPermissions": "Dir sind keine Specials zugeordnet.",
"noSpecialsInScope": "Keine Specials zum Kuratieren vorhanden.",
"noSpecialsAssigned": "Dir sind keine Specials zugeordnet.",
"curateSpecialSongCount": "{count, plural, one {# Song} other {# Songs}} in diesem Special",
"curateSpecialOpen": "Öffnen",
"specialForbidden": "Du darfst dieses Special nicht bearbeiten.",

View File

@@ -149,6 +149,10 @@
"subtitle": "Subtitle",
"maxAttempts": "Max Attempts",
"unlockSteps": "Unlock Steps",
"unlockStepsRequired": "Unlock steps are required",
"unlockStepsInvalidJson": "Invalid JSON format. Please use an array of numbers, e.g. [2,4,7,11,16,30,60]",
"unlockStepsMustBeArray": "Unlock steps must be an array",
"unlockStepsMustBePositiveNumbers": "All values must be positive numbers",
"launchDate": "Launch Date",
"endDate": "End Date",
"curator": "Curator",
@@ -227,6 +231,7 @@
"columnTitle": "Title",
"columnArtist": "Artist",
"columnYear": "Year",
"columnCover": "Cover",
"columnGenresSpecials": "Genres / Specials",
"columnAdded": "Added",
"columnActivations": "Activations",
@@ -279,11 +284,13 @@
"batchUpdateError": "Error: {error}",
"batchUpdateNetworkError": "Network error during batch update",
"backToDashboard": "Back to dashboard",
"loading": "Loading...",
"curateSpecialsButton": "Curate Specials",
"curateSpecialsTitle": "Curate your Specials",
"curateSpecialsDescription": "Here you can fine-tune the start times of the songs in your assigned specials for the puzzle.",
"noSpecialPermissions": "You do not have any specials assigned to you.",
"noSpecialsInScope": "No specials available for you to curate.",
"noSpecialsAssigned": "No specials assigned to you.",
"curateSpecialSongCount": "{count, plural, one {# song} other {# songs}} in this special",
"curateSpecialOpen": "Open",
"specialForbidden": "You are not allowed to edit this special.",

View File

@@ -1,6 +1,6 @@
{
"name": "hoerdle",
"version": "0.1.6.13",
"version": "0.1.6.34",
"private": true,
"scripts": {
"dev": "next dev",

View File

@@ -0,0 +1,20 @@
-- RedefineTables
PRAGMA defer_foreign_keys=ON;
PRAGMA foreign_keys=OFF;
CREATE TABLE "new_Special" (
"id" INTEGER NOT NULL PRIMARY KEY AUTOINCREMENT,
"name" JSONB NOT NULL,
"subtitle" JSONB,
"maxAttempts" INTEGER NOT NULL DEFAULT 7,
"unlockSteps" TEXT NOT NULL,
"createdAt" DATETIME NOT NULL DEFAULT CURRENT_TIMESTAMP,
"launchDate" DATETIME,
"endDate" DATETIME,
"curator" TEXT,
"hidden" BOOLEAN NOT NULL DEFAULT false
);
INSERT INTO "new_Special" ("createdAt", "curator", "endDate", "id", "launchDate", "maxAttempts", "name", "subtitle", "unlockSteps") SELECT "createdAt", "curator", "endDate", "id", "launchDate", "maxAttempts", "name", "subtitle", "unlockSteps" FROM "Special";
DROP TABLE "Special";
ALTER TABLE "new_Special" RENAME TO "Special";
PRAGMA foreign_keys=ON;
PRAGMA defer_foreign_keys=OFF;

View File

@@ -47,6 +47,7 @@ model Special {
launchDate DateTime?
endDate DateTime?
curator String?
hidden Boolean @default(false)
songs SpecialSong[]
puzzles DailyPuzzle[]
news News[]

BIN
public/favicon-base.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 563 KiB

BIN
public/logo-1024.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 437 KiB

BIN
public/logo-128.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 11 KiB

BIN
public/logo-256.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 37 KiB

BIN
public/logo-512.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 124 KiB

19
public/logo-large.svg Normal file

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 507 KiB

19
public/logo.svg Normal file

File diff suppressed because one or more lines are too long

After

Width:  |  Height:  |  Size: 142 KiB

View File

@@ -9,6 +9,79 @@ if [ -f "$HOME/.restic-env" ]; then
. "$HOME/.restic-env"
fi
# Extract Gotify variables from .env file if not set (ignore comments and empty lines)
if [ -z "$GOTIFY_URL" ] && [ -f ".env" ]; then
GOTIFY_URL=$(grep -v '^#' .env | grep -v '^$' | grep '^GOTIFY_URL=' | head -1 | cut -d'=' -f2- | tr -d '"' | tr -d "'" | xargs || echo "")
fi
if [ -z "$GOTIFY_APP_TOKEN" ] && [ -f ".env" ]; then
GOTIFY_APP_TOKEN=$(grep -v '^#' .env | grep -v '^$' | grep '^GOTIFY_APP_TOKEN=' | head -1 | cut -d'=' -f2- | tr -d '"' | tr -d "'" | xargs || echo "")
fi
# Extract Gotify variables from docker-compose.yml if not set
if [ -z "$GOTIFY_URL" ] && [ -f "docker-compose.yml" ]; then
GOTIFY_URL=$(grep -oP 'GOTIFY_URL=\K[^\s]+' docker-compose.yml | head -1 | tr -d '"' | tr -d "'" || echo "")
fi
if [ -z "$GOTIFY_APP_TOKEN" ] && [ -f "docker-compose.yml" ]; then
GOTIFY_APP_TOKEN=$(grep -oP 'GOTIFY_APP_TOKEN=\K[^\s]+' docker-compose.yml | head -1 | tr -d '"' | tr -d "'" || echo "")
fi
# Function to send Gotify notification
send_gotify_notification() {
local title="$1"
local message="$2"
local priority="${3:-5}"
# Check if Gotify is configured
if [ -z "$GOTIFY_URL" ] || [ -z "$GOTIFY_APP_TOKEN" ]; then
echo "⚠️ Gotify not configured (GOTIFY_URL or GOTIFY_APP_TOKEN not set), skipping notification"
return 0
fi
echo "📢 Sending Gotify notification..."
# Send notification (fire and forget, don't fail on error)
# Use jq if available for proper JSON encoding, otherwise use simple approach
if command -v jq >/dev/null 2>&1; then
local json_payload
json_payload=$(jq -n \
--arg title "$title" \
--arg message "$message" \
--argjson priority "$priority" \
'{title: $title, message: $message, priority: $priority}')
local curl_exit_code=0
curl -sSf -X POST "${GOTIFY_URL}/message?token=${GOTIFY_APP_TOKEN}" \
-H "Content-Type: application/json" \
-d "$json_payload" \
>/dev/null 2>&1 || curl_exit_code=$?
if [ $curl_exit_code -eq 0 ]; then
echo "✅ Gotify notification sent successfully"
else
echo "⚠️ Failed to send Gotify notification (curl exit code: $curl_exit_code)"
fi
else
# Fallback: simple JSON encoding (replace " with \" and newlines with \n)
local escaped_title escaped_message
escaped_title=$(echo "$title" | sed 's/"/\\"/g')
escaped_message=$(echo "$message" | sed 's/"/\\"/g' | sed ':a;N;$!ba;s/\n/\\n/g')
local curl_exit_code=0
curl -sSf -X POST "${GOTIFY_URL}/message?token=${GOTIFY_APP_TOKEN}" \
-H "Content-Type: application/json" \
-d "{\"title\":\"${escaped_title}\",\"message\":\"${escaped_message}\",\"priority\":${priority}}" \
>/dev/null 2>&1 || curl_exit_code=$?
if [ $curl_exit_code -eq 0 ]; then
echo "✅ Gotify notification sent successfully"
else
echo "⚠️ Failed to send Gotify notification (curl exit code: $curl_exit_code)"
fi
fi
}
echo "💾 Creating Restic backup..."
if ! command -v restic >/dev/null 2>&1; then
@@ -71,12 +144,32 @@ restic -r "$RESTIC_REPO" backup \
if [ $RESTIC_EXIT_CODE -eq 0 ]; then
echo "✅ Restic backup completed successfully"
# Send success notification
send_gotify_notification \
"Hördle Backup: Erfolgreich" \
"Restic Backup wurde erfolgreich abgeschlossen.\nDatum: ${CURRENT_DATE}\nCommit: ${CURRENT_COMMIT_SHORT}" \
5
exit 0
elif [ $RESTIC_EXIT_CODE -eq 3 ]; then
echo "⚠️ Restic backup completed with warnings (some files could not be read), continuing..."
# Send warning notification
send_gotify_notification \
"Hördle Backup: Mit Warnungen" \
"Restic Backup wurde mit Warnungen abgeschlossen (einige Dateien konnten nicht gelesen werden).\nDatum: ${CURRENT_DATE}\nCommit: ${CURRENT_COMMIT_SHORT}" \
7
exit 0
else
echo "⚠️ Restic backup failed (exit code: $RESTIC_EXIT_CODE), continuing deployment..."
# Send error notification
send_gotify_notification \
"Hördle Backup: Fehlgeschlagen" \
"Restic Backup ist fehlgeschlagen (Exit Code: ${RESTIC_EXIT_CODE}).\nDatum: ${CURRENT_DATE}\nCommit: ${CURRENT_COMMIT_SHORT}" \
9
exit 0
fi

View File

@@ -0,0 +1,47 @@
const sharp = require('sharp');
const fs = require('fs');
const path = require('path');
async function convertSvgToPng(svgPath, pngPath, size) {
try {
const svgBuffer = fs.readFileSync(svgPath);
await sharp(svgBuffer, {
density: 300 // High DPI for better quality
})
.resize(size, size, {
fit: 'contain',
background: { r: 255, g: 255, b: 255, alpha: 0 } // Transparent background
})
.png()
.toFile(pngPath);
console.log(`✅ Created ${pngPath} (${size}x${size})`);
} catch (error) {
console.error(`❌ Error converting ${svgPath}:`, error.message);
}
}
async function main() {
const publicDir = path.join(__dirname, '..', 'public');
// Convert logo.svg to various PNG sizes
const logoPath = path.join(publicDir, 'logo.svg');
if (fs.existsSync(logoPath)) {
await convertSvgToPng(logoPath, path.join(publicDir, 'logo-512.png'), 512);
await convertSvgToPng(logoPath, path.join(publicDir, 'logo-256.png'), 256);
await convertSvgToPng(logoPath, path.join(publicDir, 'logo-128.png'), 128);
}
// Convert logo-large.svg to larger PNG sizes
const logoLargePath = path.join(publicDir, 'logo-large.svg');
if (fs.existsSync(logoLargePath)) {
await convertSvgToPng(logoLargePath, path.join(publicDir, 'logo-1024.png'), 1024);
await convertSvgToPng(logoLargePath, path.join(publicDir, 'logo-512.png'), 512);
}
console.log('\n✨ Logo conversion complete!');
}
main();

View File

@@ -0,0 +1,138 @@
const sharp = require('sharp');
const fs = require('fs');
const path = require('path');
async function createLogoWithText(faviconPath, outputPath, size) {
try {
// Load and resize favicon - smaller to leave room for text
const faviconSize = Math.floor(size * 0.65);
const faviconBuffer = await sharp(faviconPath)
.resize(faviconSize, faviconSize, {
fit: 'contain',
background: { r: 255, g: 255, b: 255, alpha: 0 }
})
.toBuffer();
// Create SVG with favicon and text
const textSize = Math.floor(size * 0.12);
const iconY = Math.floor(size * 0.10); // Logo higher up
const textY = Math.floor(size * 0.92); // Text further down
const iconX = Math.floor((size - faviconSize) / 2);
const svg = `<?xml version="1.0" encoding="UTF-8"?>
<svg width="${size}" height="${size}" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- White background -->
<rect width="${size}" height="${size}" fill="#ffffff"/>
<image href="data:image/png;base64,${faviconBuffer.toString('base64')}"
x="${iconX}"
y="${iconY}"
width="${faviconSize}"
height="${faviconSize}"/>
<text x="${size / 2}" y="${textY}"
font-family="system-ui, -apple-system, sans-serif"
font-size="${textSize}"
font-weight="bold"
fill="#000000"
text-anchor="middle"
letter-spacing="-0.5">
hördle.de
</text>
</svg>`;
// Convert SVG to PNG with white background
await sharp(Buffer.from(svg))
.resize(size, size)
.png()
.toFile(outputPath);
console.log(`✅ Created ${path.basename(outputPath)} (${size}x${size})`);
} catch (error) {
console.error(`❌ Error creating ${outputPath}:`, error.message);
}
}
async function createSVGLogo(faviconPath, outputPath, size) {
try {
// Load and resize favicon - smaller to leave room for text
const faviconSize = Math.floor(size * 0.65);
const faviconBuffer = await sharp(faviconPath)
.resize(faviconSize, faviconSize, {
fit: 'contain',
background: { r: 255, g: 255, b: 255, alpha: 0 }
})
.toBuffer();
// Create SVG with favicon and text
const textSize = Math.floor(size * 0.12);
const iconY = Math.floor(size * 0.10); // Logo higher up
const textY = Math.floor(size * 0.92); // Text further down
const iconX = Math.floor((size - faviconSize) / 2);
const svg = `<?xml version="1.0" encoding="UTF-8"?>
<svg width="${size}" height="${size}" viewBox="0 0 ${size} ${size}" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- White background covering entire image -->
<rect width="${size}" height="${size}" fill="#ffffff"/>
<image href="data:image/png;base64,${faviconBuffer.toString('base64')}"
x="${iconX}"
y="${iconY}"
width="${faviconSize}"
height="${faviconSize}"/>
<text x="${size / 2}" y="${textY}"
font-family="system-ui, -apple-system, sans-serif"
font-size="${textSize}"
font-weight="bold"
fill="#000000"
text-anchor="middle"
letter-spacing="-0.5">
hördle.de
</text>
</svg>`;
fs.writeFileSync(outputPath, svg);
console.log(`✅ Created ${path.basename(outputPath)} (${size}x${size} SVG)`);
} catch (error) {
console.error(`❌ Error creating ${outputPath}:`, error.message);
}
}
async function main() {
const faviconPath = path.join(__dirname, '..', 'app', 'favicon.ico');
const publicDir = path.join(__dirname, '..', 'public');
if (!fs.existsSync(faviconPath)) {
console.error('❌ Favicon not found at', faviconPath);
return;
}
// Extract favicon to PNG first for processing
const tempFavicon = path.join(publicDir, 'favicon-temp.png');
const faviconBuffer = fs.readFileSync(faviconPath);
// Convert ICO to PNG
await sharp(faviconBuffer)
.resize(1024, 1024, { fit: 'contain' })
.png()
.toFile(tempFavicon);
console.log('✅ Extracted favicon to PNG\n');
// Create SVG logo
await createSVGLogo(tempFavicon, path.join(publicDir, 'logo.svg'), 512);
await createSVGLogo(tempFavicon, path.join(publicDir, 'logo-large.svg'), 1024);
// Create PNG logos with text in various sizes
await createLogoWithText(tempFavicon, path.join(publicDir, 'logo-128.png'), 128);
await createLogoWithText(tempFavicon, path.join(publicDir, 'logo-256.png'), 256);
await createLogoWithText(tempFavicon, path.join(publicDir, 'logo-512.png'), 512);
await createLogoWithText(tempFavicon, path.join(publicDir, 'logo-1024.png'), 1024);
// Clean up temp file
if (fs.existsSync(tempFavicon)) {
fs.unlinkSync(tempFavicon);
}
console.log('\n✨ Logo creation complete!');
}
main();

View File

@@ -0,0 +1,120 @@
const sharp = require('sharp');
const fs = require('fs');
const path = require('path');
async function createLogoWithText(faviconPath, outputPath, size, includeText = true) {
try {
const favicon = await sharp(faviconPath)
.resize(size * 0.7, size * 0.7, {
fit: 'contain',
background: { r: 255, g: 255, b: 255, alpha: 0 }
})
.toBuffer();
// Create SVG with favicon and text
const textSize = Math.floor(size * 0.15);
const spacing = Math.floor(size * 0.05);
const iconSize = Math.floor(size * 0.7);
const iconY = Math.floor(includeText ? size * 0.25 : size * 0.5);
const textY = Math.floor(size * 0.85);
// For now, we'll create a composite image
// First, create the favicon part
const svg = includeText ? `
<svg width="${size}" height="${size}" xmlns="http://www.w3.org/2000/svg">
<defs>
<pattern id="faviconPattern" x="0" y="0" width="1" height="1">
<image href="data:image/png;base64,${favicon.toString('base64')}"
x="${(size - iconSize) / 2}"
y="${iconY - iconSize / 2}"
width="${iconSize}"
height="${iconSize}"/>
</pattern>
</defs>
<rect width="${size}" height="${size}" fill="url(#faviconPattern)"/>
<text x="${size / 2}" y="${textY}"
font-family="system-ui, -apple-system, sans-serif"
font-size="${textSize}"
font-weight="bold"
fill="#000000"
text-anchor="middle"
letter-spacing="-0.5">
Hördle
</text>
</svg>
` : `
<svg width="${size}" height="${size}" xmlns="http://www.w3.org/2000/svg">
<image href="data:image/png;base64,${favicon.toString('base64')}"
x="${(size - iconSize) / 2}"
y="${(size - iconSize) / 2}"
width="${iconSize}"
height="${iconSize}"/>
</svg>
`;
// Convert SVG to PNG
await sharp(Buffer.from(svg))
.png()
.toFile(outputPath);
console.log(`✅ Created ${outputPath} (${size}x${size})`);
} catch (error) {
console.error(`❌ Error creating ${outputPath}:`, error.message);
}
}
async function main() {
const faviconPath = path.join(__dirname, '..', 'app', 'favicon.ico');
const publicDir = path.join(__dirname, '..', 'public');
if (!fs.existsSync(faviconPath)) {
console.error('❌ Favicon not found at', faviconPath);
return;
}
// Extract favicon to PNG first
const tempFavicon = path.join(publicDir, 'favicon-temp.png');
const faviconBuffer = fs.readFileSync(faviconPath);
// Convert ICO to PNG
await sharp(faviconBuffer)
.resize(1024, 1024, { fit: 'contain' })
.png()
.toFile(tempFavicon);
console.log('✅ Extracted favicon to PNG');
// Create logos with text in various sizes
await createLogoWithText(tempFavicon, path.join(publicDir, 'logo-128.png'), 128);
await createLogoWithText(tempFavicon, path.join(publicDir, 'logo-256.png'), 256);
await createLogoWithText(tempFavicon, path.join(publicDir, 'logo-512.png'), 512);
await createLogoWithText(tempFavicon, path.join(publicDir, 'logo-1024.png'), 1024);
// Create SVG version
const faviconPng = await sharp(faviconBuffer)
.resize(512, 512, { fit: 'contain' })
.png()
.toBuffer();
const svgContent = `<?xml version="1.0" encoding="UTF-8"?>
<svg width="512" height="512" viewBox="0 0 512 512" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<defs>
<image id="faviconImg" href="data:image/png;base64,${faviconPng.toString('base64')}" width="358" height="358" x="77" y="77"/>
</defs>
<use href="#faviconImg"/>
<text x="256" y="430" font-family="system-ui, -apple-system, sans-serif" font-size="48" font-weight="bold" fill="#000000" text-anchor="middle" letter-spacing="-0.5">
Hördle
</text>
</svg>`;
fs.writeFileSync(path.join(publicDir, 'logo.svg'), svgContent);
console.log('✅ Created logo.svg');
// Clean up temp file
fs.unlinkSync(tempFavicon);
console.log('\n✨ Logo creation complete!');
}
main();

View File

@@ -63,8 +63,10 @@ fi
./scripts/backup-restic.sh
# Nur neueste Version holen (shallow fetch), vollständiges Repo ist im Deployment nicht nötig
echo "📥 Fetching latest commit (shallow clone) from git..."
git fetch --prune --tags --depth=1 origin master
# Wichtig: Tags müssen vollständig geholt werden für Version-Anzeige
echo "📥 Fetching latest commit and all tags from git..."
git fetch --prune --tags origin master
git fetch --tags origin
git reset --hard origin/master
# Prüfe und erstelle/repariere Netzwerk falls nötig