Add animations to popups, points, songs, the winner and the tabs (#48)

Popups fade in while growing and close the reverse way, with the backdrop
fading along. The winner gets confetti, bouncing pictures and a score graph
that draws itself from the left. Filtered statistics cards and search rows
fade in, the tabs slide in from their side, and every button bounces on hover
and click (ButtonBounce, now added to all buttons).

In the player list the score pops on every point, the first point flashes the
row, and a player on match point glows with a "Match point!" tag. A song
starting fades in the title, flashes its row (kept across list rebuilds) and
pops the play button.

Common/anim.gd holds the helpers. A saved "Reduce animations" switch in
Settings turns all movement off; the tests use it. The flash colours are
theme colours (Palette first_point, match_point, flash) in every theme.

Closes #48

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

quiz/PlayerRow.tscn

@@ -41,6 +41,14 @@ vertical_alignment = 1
 clip_text = true
 text_overrun_behavior = 3
 
+[node name="MatchPointTag" type="Label" parent="HBoxContainer"]
+unique_name_in_owner = true
+visible = false
+layout_mode = 2
+theme_type_variation = &"HighlightMedium"
+text = "Match point!"
+vertical_alignment = 1
+
 [node name="Score" type="Label" parent="HBoxContainer"]
 unique_name_in_owner = true
 custom_minimum_size = Vector2(40, 0)

quiz/music_list_panel.gd

@@ -1,12 +1,18 @@
 class_name MusicListPanel
 extends PanelContainer
-## The list of songs in the playlist, one row per song.
+## The list of songs in the playlist, one row per song. A song's row flashes when the
+## song starts playing and when it is answered.
 
 ## Emitted when the row of song number [param song_no] is clicked.
 
 signal song_clicked(song_no: int)
 
 var _song_list_object: PackedScene = preload("res://quiz/SongRow.tscn")
+# Whether each song was playing and answered when the list was last shown, so a row
+# can flash when its song starts or is answered
+var _last_state: Dictionary = {}
+# When each flash ends, in msec, so a flash goes on when the list is shown again
+var _flash_ends: Dictionary = {}
 
 @onready var _rows: VBoxContainer = %MusicList
 
@@ -15,6 +21,7 @@ var _song_list_object: PackedScene = preload("res://quiz/SongRow.tscn")
 func refresh() -> void:
 	Settings.delete_children(_rows)
 	var songs: Array[SongObject] = Playlist.get_playlist()
+	var state: Dictionary = {}
 	for i: int in songs.size():
 		var s: SongObject = songs[i]
 		var new_song_list_object: SongRow = _song_list_object.instantiate()
@@ -22,6 +29,17 @@ func refresh() -> void:
 		new_song_list_object.index = i
 		new_song_list_object.gui_input.connect(_on_row_input.bind(s.song_number))
 		_rows.add_child(new_song_list_object)
+		state[s] = [s.is_playing, s.is_answered]
+		# Only songs that were listed before flash, not a whole list loaded at once
+		if _last_state.has(s) && _last_state[s] != state[s] \
+				&& (s.is_playing || s.is_answered):
+			_flash_ends[s] = Time.get_ticks_msec() + int(Anim.SLOW * 1000)
+		var left: float = (_flash_ends.get(s, 0) - Time.get_ticks_msec()) / 1000.0
+		if left > 0:
+			Anim.flash(new_song_list_object, get_theme_color(&"flash", &"Palette"), left)
+		else:
+			_flash_ends.erase(s)
+	_last_state = state
 
 
 func _on_row_input(event: InputEvent, song_no: int) -> void:

quiz/now_playing.gd

@@ -1,10 +1,16 @@
 class_name NowPlaying
 extends VBoxContainer
-## The soundtrack and song that are playing, in large text at the top of the quiz.
+## The soundtrack and song that are playing, in large text at the top of the quiz. They
+## fade in when they change.
 
 
 ## Shows [param soundtrack_title] and [param song_title]. The playlist hides them as
 ## question marks until the answer is shown.
 func show_song(soundtrack_title: String, song_title: String) -> void:
+	var changed: bool = $SoundtrackLabel.text != soundtrack_title \
+			|| $SongLabel.text != song_title
 	$SoundtrackLabel.text = soundtrack_title
 	$SongLabel.text = song_title
+	# A new song, or the answer being shown, fades in
+	if changed:
+		Anim.fade_in(self, Anim.SLOW)

quiz/player_row.gd

@@ -2,6 +2,9 @@ class_name PlayerRow
 extends PanelContainer
 ## One player in the player list: their name, points and character, and buttons for
 ## giving and taking points. Clicking the character picks another one.
+##
+## The score pops when it changes. The first point of a game makes the row flash, and a
+## player one point from winning glows and says "Match point!" until that changes.
 
 signal change_character_clicked
 signal player_removed
@@ -15,6 +18,7 @@ var list_index: int
 
 @onready var player_name_field: Label = %Name
 @onready var score_label: Label = %Score
+@onready var match_point_tag: Label = %MatchPointTag
 @onready var character_frame: PanelContainer = %CharacterFrame
 @onready var add_button: Button = %AddPoint
 @onready var minus_button: Button = %RemovePoint
@@ -29,6 +33,9 @@ func _ready() -> void:
 	minus_button.set_shortcut(create_button_shortcut(list_index, true))
 	character.pressed.connect(change_character)
 	remove_player.pressed.connect(func() -> void: player_removed.emit())
+	player_object.player_point_given.connect(_on_score_changed)
+	player_object.player_point_taken.connect(_on_score_changed)
+	player_object.first_point_triggered.connect(_on_first_point)
 	character.mouse_entered.connect(_set_character_hovered.bind(true))
 	character.mouse_exited.connect(_set_character_hovered.bind(false))
 	# Rows take turns being lighter and darker, like the other lists
@@ -81,6 +88,36 @@ func set_player_character() -> void:
 
 func update_score() -> void:
 	score_label.text = str(player_object.player_score)
+	_show_match_point(is_match_point())
+
+
+## Whether the player is one point from winning. A prepared quiz has no winning score.
+func is_match_point() -> bool:
+	return !Settings.is_prepared_quiz() && Settings.winning_score > 1 \
+			&& player_object.player_score == Settings.winning_score - 1
+
+
+func _on_score_changed() -> void:
+	Anim.pop(score_label)
+
+
+func _on_first_point() -> void:
+	Anim.flash(self, get_theme_color(&"first_point", &"Palette"), Anim.SLOW * 2)
+	Anim.pop(score_label, 1.8, Anim.SLOW)
+
+
+# The glow and the tag show while the player is on match point
+func _show_match_point(on: bool) -> void:
+	var glow: Node = get_node_or_null("Pulse")
+	if on == match_point_tag.visible && on == (glow != null):
+		return
+	match_point_tag.visible = on
+	if glow != null:
+		glow.queue_free()
+		glow.name = "PulseEnding"
+	if on:
+		Anim.pulse(self, get_theme_color(&"match_point", &"Palette"))
+		Anim.pop(match_point_tag, 1.4, Anim.SLOW)
 
 
 func _set_character_hovered(hovered: bool) -> void: