crossmate

PuzzleScoreboard.swift (17245B)

---

 import SwiftUI
 
 struct PuzzleScoreboard: View {
     @Bindable var session: PlayerSession
     let roster: PlayerRoster
     var layout: Layout = .vertical
     /// Sends a broadcast nudge to the other players. `nil` hides the button.
     var onNudge: (() async -> Void)? = nil
     /// When the next nudge becomes allowed (the send cooldown's end), or `nil`
     /// if a nudge is allowed right now.
     var nudgeReadyAt: () -> Date? = { nil }
     @Environment(PlayerPreferences.self) private var preferences
     /// Briefly swaps the nudge capsule for a "Nudge Sent" confirmation.
     @State private var showNudgeSent = false
     /// The send-cooldown deadline that dims the button, stamped synchronously on
     /// tap (`tapTime + nudgeCooldown`) so it exists at render time — the
     /// coordinator stamps its own copy asynchronously, too late for this view.
     /// `cooldownWatch` clears it at the deadline to un-dim; seeded from the
     /// coordinator on appear so the dimming survives a view rebuild mid-cooldown.
     @State private var nudgeDeadline: Date?
 
     enum Layout {
         /// Side-panel style: stacked rows under a "Players" heading.
         case vertical
         /// Paged-header style: a horizontally scrollable strip of player
         /// chips, sized to scroll past two players when more arrive.
         case horizontal
     }
 
     private struct Score: Identifiable {
         let authorID: String?
         let name: String
         let color: PlayerColor?
         let filledCount: Int
 
         var id: String { authorID ?? "unattributed" }
     }
 
     private var fillableCellCount: Int {
         session.puzzle.cells.reduce(0) { count, row in
             count + row.filter { !$0.isBlock }.count
         }
     }
 
     private var filledCellCount: Int {
         var count = 0
         for r in 0..<session.puzzle.height {
             for c in 0..<session.puzzle.width {
                 guard !session.puzzle.cells[r][c].isBlock else { continue }
                 if !session.game.squares[r][c].entry.isEmpty {
                     count += 1
                 }
             }
         }
         return count
     }
 
     private var revealedSquareCount: Int {
         var count = 0
         for r in 0..<session.puzzle.height {
             for c in 0..<session.puzzle.width {
                 guard !session.puzzle.cells[r][c].isBlock else { continue }
                 if session.game.squares[r][c].mark.isRevealed {
                     count += 1
                 }
             }
         }
         return count
     }
 
     private var remainingCount: Int {
         max(0, fillableCellCount - filledCellCount)
     }
 
     private var remainingPhrase: String {
         switch remainingCount {
         case 0:
             return "no squares to go"
         case 1:
             return "1 square to go"
         default:
             return "\(remainingCount) squares to go"
         }
     }
 
     private var revealedPhrase: String {
         switch revealedSquareCount {
         case 0:
             return "No squares revealed"
         case 1:
             return "1 square revealed"
         default:
             return "\(revealedSquareCount) squares revealed"
         }
     }
 
     private var progressText: String {
         if revealedSquareCount > 0 {
             return "\(revealedPhrase), \(remainingPhrase)"
         }
         switch remainingCount {
         case 0:
             return "No squares to go"
         case 1:
             return "1 square to go"
         default:
             return "\(remainingCount) squares to go"
         }
     }
 
     private var scores: [Score] {
         var counts: [String?: Int] = [:]
         for r in 0..<session.puzzle.height {
             for c in 0..<session.puzzle.width {
                 guard !session.puzzle.cells[r][c].isBlock else { continue }
                 let square = session.game.squares[r][c]
                 guard !square.entry.isEmpty, !square.mark.isRevealed else { continue }
                 counts[normalizedAuthorID(square.letterAuthorID), default: 0] += 1
             }
         }
 
         let entries = roster.entries
         let usesLocalFallback = entries.isEmpty
         let entryByAuthorID = Dictionary(uniqueKeysWithValues: entries.map { ($0.authorID, $0) })
         let rosterAuthorIDs = Set(entries.map(\.authorID))
 
         let rosterScores: [Score]
         if usesLocalFallback {
             rosterScores = [
                 Score(
                     authorID: nil,
                     name: preferences.name,
                     color: preferences.color,
                     filledCount: counts[nil] ?? 0
                 )
             ]
         } else {
             rosterScores = entries.map { entry in
                 Score(
                     authorID: entry.authorID,
                     name: entry.name,
                     color: entry.color,
                     filledCount: counts[entry.authorID] ?? 0
                 )
             }
         }
 
         let extraScores = counts.compactMap { authorID, count -> Score? in
             if let authorID, rosterAuthorIDs.contains(authorID) {
                 return nil
             }
             if authorID == nil && usesLocalFallback {
                 return nil
             }
             if let authorID, let entry = entryByAuthorID[authorID] {
                 return Score(authorID: authorID, name: entry.name, color: entry.color, filledCount: count)
             }
             if authorID == nil {
                 // A `nil` author key only arises with remote players present
                 // (see `normalizedAuthorID`): an authorless square, e.g. a cell
                 // sealed to the solution at completion before its author's
                 // letter arrived. It belongs to no player, so drop it rather
                 // than tallying an "Unattributed" entry.
                 return nil
             }
             return Score(authorID: authorID, name: "Player", color: nil, filledCount: count)
         }
 
         return ParticipantSummaries.sortedByScore(
             rosterScores + extraScores,
             score: \.filledCount,
             name: \.name,
             id: \.id
         )
     }
 
     private func normalizedAuthorID(_ authorID: String?) -> String? {
         guard let authorID else {
             return roster.entries.contains(where: { !$0.isLocal }) ? nil : roster.localAuthorID
         }
         return authorID
     }
 
     private var showsNudgeButton: Bool {
         onNudge != nil
             && !session.mutator.isCompleted
             && roster.entries.contains(where: { !$0.isLocal })
     }
 
     var body: some View {
         Group {
             switch layout {
             case .vertical:
                 verticalBody
             case .horizontal:
                 horizontalBody
             }
         }
         .onAppear { if nudgeDeadline == nil { nudgeDeadline = nudgeReadyAt() } }
         .task(id: nudgeDeadline) { await cooldownWatch() }
     }
 
     /// Sleeps until `nudgeDeadline`, then clears it so the button un-dims on its
     /// own. Re-runs whenever `nudgeDeadline` changes — a fresh nudge or the view
     /// re-appearing mid-cooldown — and no-ops when none is pending. Re-checks the
     /// deadline is unchanged before clearing so a nudge fired during the sleep
     /// isn't cut short.
     private func cooldownWatch() async {
         guard let deadline = nudgeDeadline else { return }
         let delay = deadline.timeIntervalSinceNow
         if delay > 0 {
             try? await Task.sleep(for: .seconds(delay))
         }
         if nudgeDeadline == deadline { nudgeDeadline = nil }
     }
 
     private var verticalBody: some View {
         VStack(alignment: .leading, spacing: 12) {
             verticalHeading
 
             VStack(alignment: .leading, spacing: 6) {
                 ForEach(scores) { score in
                     scoreRow(score)
                 }
 
                 Text(progressText)
                     .font(.footnote)
                     .foregroundStyle(.secondary)
                     .padding(.top, 10)
                     .frame(maxWidth: .infinity, alignment: .center)
             }
         }
         .padding(.horizontal, 18)
         .padding(.vertical, 14)
         .frame(maxWidth: .infinity, alignment: .leading)
     }
 
     private var horizontalBody: some View {
         // The heading/nudge capsule pins to the leading edge and the score
         // chips flow after it, wrapping leading-to-trailing onto new lines.
         // The whole [heading | chips] group hugs its content and centres in
         // the band, so it grows outward from the middle as players arrive,
         // while the rows inside stay leading-aligned. A vertical ScrollView
         // absorbs the overflow when enough players wrap past the slim band,
         // rather than letting it spill into the toolbar above. Filling the
         // band's height (rather than pinning a fixed height) keeps the strip
         // inside whatever space the header yields as Dynamic Type grows.
         //
         // `.bottom` scroll anchor rests a short strip (the common 2–3 player
         // case) against the bottom of the band, matching the title/credits
         // pages, yet still scrolls up from the bottom once the rows overflow.
         ScrollView(.vertical, showsIndicators: false) {
             HStack(alignment: .center, spacing: 18) {
                 playersHeading
                 FlowLayout(alignment: .leading, spacing: 18, lineSpacing: 8) {
                     ForEach(scores) { score in
                         scoreChip(score)
                     }
                 }
             }
             .frame(maxWidth: .infinity)
             .padding(.horizontal, 18)
             .padding(.vertical, 4)
         }
         .frame(maxHeight: .infinity)
         .defaultScrollAnchor(.bottom)
         // The scoreboard is the least important text in the band, so cap its
         // type scaling a few steps below the top: past xLarge it stops growing
         // rather than forcing the chips to wrap further and the band to keep
         // eating into the grid.
         .dynamicTypeSize(...DynamicTypeSize.xLarge)
     }
 
     /// The vertical (side-panel) heading. With more horizontal room to spare,
     /// "Players" stays a plain leading heading and the nudge action lives in a
     /// separate accent-coloured capsule button, vertically centred on the
     /// trailing side. The button is omitted entirely when there's no one to nudge.
     @ViewBuilder
     private var verticalHeading: some View {
         HStack(spacing: 8) {
             Text("Players")
                 .font(.headline)
             if showsNudgeButton {
                 Spacer(minLength: 8)
                 nudgeButton
             }
         }
     }
 
     /// The trailing nudge capsule used by `verticalHeading`. Wrapped in a ZStack
     /// with the "Nudge Sent" confirmation and cross-faded with opacity, so the
     /// heading reserves the capsule's footprint and nothing shifts on tap.
     private var nudgeButton: some View {
         // The capsule and confirmation are cross-faded in a ZStack so the
         // heading reserves the capsule's footprint and nothing shifts on tap.
         // The cooldown un-dim is driven by `cooldownWatch` (see `body`).
         ZStack(alignment: .trailing) {
             Button {
                 sendNudge()
             } label: {
                 nudgeCapsule
             }
             .buttonStyle(.plain)
             .disabled(isNudgeDisabled)
             .accessibilityLabel("Nudge Players")
             .opacity(showNudgeSent ? 0 : 1)
             .accessibilityHidden(showNudgeSent)
 
             Text("Nudge Sent")
                 .font(.footnote.weight(.semibold))
                 .foregroundStyle(.secondary)
                 .opacity(showNudgeSent ? 1 : 0)
                 .accessibilityHidden(!showNudgeSent)
         }
     }
 
     private var nudgeCapsule: some View {
         HStack(spacing: 5) {
             Image(systemName: "hand.wave")
             Text("Nudge")
         }
         .font(.footnote.weight(.semibold))
         .padding(.horizontal, 12)
         .padding(.vertical, 4)
         .nudgeGlass(isLabeled: true)
     }
 
     /// The horizontal (paged-header) heading. With little vertical room, the
     /// "Players" heading itself *is* the nudge button — a tinted capsule carrying
     /// the wave symbol and the title that, on tap, swaps to a brief "Nudge Sent"
     /// confirmation. Otherwise it falls back to a plain heading.
     @ViewBuilder
     private var playersHeading: some View {
         if showsNudgeButton {
             // Keep both the capsule and the confirmation laid out in a ZStack
             // and cross-fade with opacity, so the header always reserves the
             // capsule's exact footprint — the score chips below never shift. The
             // cooldown un-dim is driven by `cooldownWatch` (see `body`).
             ZStack {
                 Button {
                     sendNudge()
                 } label: {
                     playersCapsule
                 }
                 .buttonStyle(.plain)
                 .disabled(isNudgeDisabled)
                 .accessibilityLabel("Nudge Players")
                 .opacity(showNudgeSent ? 0 : 1)
                 .accessibilityHidden(showNudgeSent)
 
                 Text("Nudge Sent")
                     .font(.footnote.weight(.semibold))
                     .foregroundStyle(.primary)
                     .opacity(showNudgeSent ? 1 : 0)
                     .accessibilityHidden(!showNudgeSent)
             }
         } else {
             // No one to nudge (a solo game, or no peers have joined yet): the
             // plain, non-button heading. It centres against the chip row on its
             // own, so it needs no padding — the capsule's footprint is taller,
             // but the chips centre against the tallest element either way.
             Text("Players")
                 .font(.subheadline.weight(.semibold))
         }
     }
 
     /// The nudge button is disabled mid-confirmation and during the send
     /// cooldown (a pending `nudgeDeadline`).
     private var isNudgeDisabled: Bool {
         showNudgeSent || nudgeDeadline != nil
     }
 
     /// Fires the nudge and flashes the "Nudge Sent" confirmation in the header
     /// for a couple of seconds before restoring the button. Arms the cooldown
     /// deadline synchronously (`cooldownWatch` clears it) so the button dims with
     /// the tap regardless of how the actual send fans out.
     private func sendNudge() {
         if let onNudge {
             Task { await onNudge() }
         }
         nudgeDeadline = Date().addingTimeInterval(SessionCoordinator.nudgeCooldown)
         withAnimation(.easeInOut(duration: 0.25)) { showNudgeSent = true }
         Task {
             try? await Task.sleep(for: .seconds(3))
             withAnimation(.easeInOut(duration: 0.25)) { showNudgeSent = false }
         }
     }
 
     private var playersCapsule: some View {
         HStack(spacing: 5) {
             Image(systemName: "hand.wave")
             Text("Players")
         }
         .font(.footnote.weight(.semibold))
         .padding(.horizontal, 12)
         .padding(.vertical, 4)
         // Real `glassEffect` casts its own ambient shadow that clips untidily
         // against the band edge on this flat white header, so the capsule
         // imitates glass rather than using the system material: a translucent
         // white fill brightens the capsule off the header and the hairline rim
         // below supplies the lit glass edge, with no shadow. (The iPad side
         // panel keeps real glass via `nudgeCapsule`/`nudgeGlass`, where the
         // shadow has room to sit.)
         .background(Color.white.opacity(0.6), in: Capsule())
         // A rim bright along the top, fading dark along the bottom, reads as a
         // curved glass edge — defining the button without flattening it into a
         // plain outline.
         .overlay {
             Capsule()
                 .strokeBorder(
                     LinearGradient(
                         colors: [.white.opacity(0.4), .black.opacity(0.14)],
                         startPoint: .top,
                         endPoint: .bottom
                     ),
                     lineWidth: 0.75
                 )
         }
     }
 
     private func scoreChip(_ score: Score) -> some View {
         HStack(spacing: 6) {
             Circle()
                 .fill(score.color?.tint ?? Color.secondary)
                 .frame(width: 8, height: 8)
             Text(score.name)
                 .font(.subheadline)
                 .lineLimit(1)
             Text("\(score.filledCount)")
                 .font(.subheadline.monospacedDigit().weight(.semibold))
         }
         .accessibilityElement(children: .combine)
     }
 
     private func scoreRow(_ score: Score) -> some View {
         HStack(spacing: 8) {
             Circle()
                 .fill(score.color?.tint ?? Color.secondary)
                 .frame(width: 8, height: 8)
             Text(score.name)
                 .font(.subheadline)
                 .lineLimit(1)
             Spacer(minLength: 8)
             Text("\(score.filledCount)")
                 .font(.subheadline.monospacedDigit().weight(.semibold))
         }
         .accessibilityElement(children: .combine)
     }
 }