Simon/quizify
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

modified: app.py

Browse Source 
modified:   templates/quiz.html
This commit is contained in:
Simon
2025-11-14 23:48:01 +01:00
parent 8abd857864
commit 1457557dea
2 changed files with 12 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
app.py
View File

@@ -55,13 +55,11 @@ def similarity(a, b):
def clean_title(title): def clean_title(title):
# Entfernt alles in () oder [] # Entfernt alles in () oder []
title = re.sub(r"(\s*[\(\[][^)\]]*[\)\]])", "", title) title = re.sub(r"(\s*[\(\[][^)\]]*[\)\]])", "", title)
# Vereinheitliche und entferne alle Arten von Apostrophen und Anführungszeichen # Entferne alle Arten von Apostrophen, Backticks und Anführungszeichen
title = title.replace("'", "").replace("'", "").replace("'", "").replace("`", "") title = title.replace("'", "").replace("'", "").replace("'", "").replace("`", "")
title = title.replace('"', '').replace("„", '').replace(""", '').replace(""", '').replace("«", '').replace("»", '') title = title.replace('"', '').replace("„", '').replace(""", '').replace(""", '').replace("´", "")
# Entferne weitere Sonderzeichen die Probleme machen können # Entferne weitere problematische Sonderzeichen
title = title.replace("´", "").replace("′", "").replace("ʹ", "") title = title.replace("–", "-").replace("—", "-").replace("…", "...")
# Entferne doppelte Leerzeichen
title = re.sub(r'\s+', ' ', title)
return title.strip() return title.strip()
def get_all_playlist_tracks(sp, playlist_id): def get_all_playlist_tracks(sp, playlist_id):
@@ -250,13 +248,9 @@ def check_answer():
game_mode = data.get('game_mode', 'artist') game_mode = data.get('game_mode', 'artist')
playlist_id = data.get('playlist_id') playlist_id = data.get('playlist_id')
# Speichere die originale Antwort für die Anzeige
display_answer = correct_answer
if game_mode == 'title': if game_mode == 'title':
guess = clean_title(guess) guess = clean_title(guess)
correct_answer = clean_title(correct_answer) correct_answer = clean_title(correct_answer)
display_answer = clean_title(display_answer) # Auch für die Anzeige bereinigen
if game_mode == 'year': if game_mode == 'year':
is_correct = guess == correct_answer is_correct = guess == correct_answer
@@ -270,7 +264,7 @@ def check_answer():
return { return {
"correct": is_correct, "correct": is_correct,
"correct_answer": display_answer "correct_answer": correct_answer
} }
@app.route("/play_track", methods=["POST"]) @app.route("/play_track", methods=["POST"])

42
templates/quiz.html
View File

@@ -218,19 +218,6 @@
// translations für JS verfügbar machen // translations für JS verfügbar machen
const i18n = {{ translations|tojson }}; const i18n = {{ translations|tojson }};
// Funktion zum Bereinigen von Titeln (entfernt Sonderzeichen)
function cleanTitle(title) {
// Entfernt alles in () oder []
title = title.replace(/(\s*[\(\[][^)\]]*[\)\]])/g, '');
// Entferne alle Arten von Apostrophen und Anführungszeichen
title = title.replace(/['\'\'`]/g, '').replace(/["„"""«»]/g, '');
// Entferne weitere Sonderzeichen
title = title.replace(/[´′ʹ]/g, '');
// Entferne doppelte Leerzeichen
title = title.replace(/\s+/g, ' ');
return title.trim();
}
// Wird aufgerufen, wenn Spotify Web Playback SDK geladen ist // Wird aufgerufen, wenn Spotify Web Playback SDK geladen ist
window.onSpotifyWebPlaybackSDKReady = () => { window.onSpotifyWebPlaybackSDKReady = () => {
const token = '{{ access_token }}'; const token = '{{ access_token }}';
@@ -314,7 +301,7 @@
document.getElementById('question-text').innerText = i18n.question_artist; document.getElementById('question-text').innerText = i18n.question_artist;
document.getElementById('answerInput').placeholder = i18n.input_artist; document.getElementById('answerInput').placeholder = i18n.input_artist;
} else if (currentGameMode === 'title') { } else if (currentGameMode === 'title') {
correctAnswer = cleanTitle("{{ track.name }}"); // Bereinige den Titel correctAnswer = "{{ track.name }}";
document.getElementById('question-text').innerText = i18n.question_title; document.getElementById('question-text').innerText = i18n.question_title;
document.getElementById('answerInput').placeholder = i18n.input_title; document.getElementById('answerInput').placeholder = i18n.input_title;
} else if (currentGameMode === 'year') { } else if (currentGameMode === 'year') {
@@ -367,14 +354,10 @@
data.results.forEach(result => { data.results.forEach(result => {
const item = document.createElement('div'); const item = document.createElement('div');
item.className = 'search-item'; item.className = 'search-item';
// Zeige den bereinigten Namen im Autocomplete (wenn im title-Modus) item.innerHTML = `<strong>${result.name}</strong> - ${result.artist}`;
const displayName = currentGameMode === 'title' ? cleanTitle(result.name) : result.name;
item.innerHTML = `<strong>${displayName}</strong> - ${result.artist}`;
item.onclick = function() { item.onclick = function() {
// Setze den bereinigten Wert ins Eingabefeld document.getElementById('answerInput').value =
const valueToSet = currentGameMode === 'artist' ? result.artist : currentGameMode === 'artist' ? result.artist : result.name;
currentGameMode === 'title' ? cleanTitle(result.name) : result.name;
document.getElementById('answerInput').value = valueToSet;
resultsContainer.style.display = 'none'; resultsContainer.style.display = 'none';
}; };
resultsContainer.appendChild(item); resultsContainer.appendChild(item);
@@ -388,14 +371,9 @@
} }
function checkAnswer() { function checkAnswer() {
let guess = document.getElementById('answerInput').value; const guess = document.getElementById('answerInput').value;
if (!guess) return; if (!guess) return;
// Bereinige die Eingabe im title-Modus
if (currentGameMode === 'title') {
guess = cleanTitle(guess);
}
fetch('/check_answer', { fetch('/check_answer', {
method: 'POST', method: 'POST',
headers: { 'Content-Type': 'application/json' }, headers: { 'Content-Type': 'application/json' },
@@ -411,19 +389,13 @@
const resultContainer = document.getElementById('resultContainer'); const resultContainer = document.getElementById('resultContainer');
resultContainer.style.display = 'block'; resultContainer.style.display = 'block';
// Bereinige die Antwort für die Anzeige im title-Modus
let displayAnswer = data.correct_answer;
if (currentGameMode === 'title') {
displayAnswer = cleanTitle(displayAnswer);
}
if (data.correct) { if (data.correct) {
resultContainer.className = 'result-container correct'; resultContainer.className = 'result-container correct';
resultContainer.innerHTML = `<h3>${i18n.correct}</h3>`; resultContainer.innerHTML = `<h3>${i18n.correct}</h3>`;
} else { } else {
resultContainer.className = 'result-container incorrect'; resultContainer.className = 'result-container incorrect';
resultContainer.innerHTML = `<h3>${i18n.wrong}</h3> resultContainer.innerHTML = `<h3>${i18n.wrong}</h3>
<p>${i18n.right_answer} <strong>${displayAnswer}</strong></p>`; <p>${i18n.right_answer} <strong>${data.correct_answer}</strong></p>`;
} }
// Song-Infos ergänzen // Song-Infos ergänzen
@@ -431,7 +403,7 @@
<div style="margin-top:20px; padding:20px; background:rgba(15,20,35,0.8); border-radius:15px; border:1px solid rgba(29,185,84,0.3);"> <div style="margin-top:20px; padding:20px; background:rgba(15,20,35,0.8); border-radius:15px; border:1px solid rgba(29,185,84,0.3);">
<img src="{{ track.album.images[0].url }}" alt="Cover" style="width:120px; height:120px; border-radius:12px; margin-bottom:15px; box-shadow:0 4px 15px rgba(0,0,0,0.5);"><br> <img src="{{ track.album.images[0].url }}" alt="Cover" style="width:120px; height:120px; border-radius:12px; margin-bottom:15px; box-shadow:0 4px 15px rgba(0,0,0,0.5);"><br>
<div style="text-align:left; display:inline-block; margin-top:10px;"> <div style="text-align:left; display:inline-block; margin-top:10px;">
<p style="margin:8px 0;"><strong style="color:#1DB954;">${i18n.song || 'Song'}:</strong> <span style="color:#e0e0e0;">${currentGameMode === 'title' ? displayAnswer : '{{ track.name }}'}</span></p> <p style="margin:8px 0;"><strong style="color:#1DB954;">${i18n.song || 'Song'}:</strong> <span style="color:#e0e0e0;">{{ track.name }}</span></p>
<p style="margin:8px 0;"><strong style="color:#1DB954;">${i18n.artist || 'Artist'}:</strong> <span style="color:#e0e0e0;">{{ track.artists[0].name }}</span></p> <p style="margin:8px 0;"><strong style="color:#1DB954;">${i18n.artist || 'Artist'}:</strong> <span style="color:#e0e0e0;">{{ track.artists[0].name }}</span></p>
<p style="margin:8px 0;"><strong style="color:#1DB954;">${i18n.album || 'Album'}:</strong> <span style="color:#e0e0e0;">{{ track.album.name }}</span></p> <p style="margin:8px 0;"><strong style="color:#1DB954;">${i18n.album || 'Album'}:</strong> <span style="color:#e0e0e0;">{{ track.album.name }}</span></p>
<p style="margin:8px 0;"><strong style="color:#1DB954;">${i18n.year || 'Year'}:</strong> <span style="color:#e0e0e0;">{{ track.album.release_date[:4] }}</span></p> <p style="margin:8px 0;"><strong style="color:#1DB954;">${i18n.year || 'Year'}:</strong> <span style="color:#e0e0e0;">{{ track.album.release_date[:4] }}</span></p>