/macos/plac/Views/PlaybackBar.swift at 041b7f558869f7ea96e524eee9664d0bead925eb

// Copyright 2025 Shota FUJI
//
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at
//
// http://www.apache.org/licenses/LICENSE-2.0
//
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.
//
// SPDX-License-Identifier: Apache-2.0

import OSLog
import RoonKit
import SwiftUI

struct PlaybackBar: View {
	@Environment(ZoneDataModel.self) var model: ZoneDataModel

	@State private var isPerformingAction = false

	private var zone: TransportService.Zone? {
		model.zone
	}

	var body: some View {
		@Bindable var model = model

		VStack(alignment: .leading, spacing: 14) {
			HStack(spacing: 8) {
				if let imageKey = zone?.nowPlaying?.imageKey {
					Artwork(imageKey: imageKey, width: 96, height: 96)
						.frame(width: 48, height: 48)
				}

				VStack(alignment: .leading, spacing: 2) {
					let line1 = zone?.nowPlaying?.doubleLine.line1 ?? " "
					let line2 = zone?.nowPlaying?.doubleLine.line2 ?? " "

					Text(line1)
						.font(.headline)
						.lineLimit(1)

					Text(line2)
						.font(.subheadline)
						.lineLimit(1)
				}
				.frame(maxWidth: .infinity, alignment: .leading)
			}

			HStack(spacing: 20) {
				HStack {
					Button {
						Task {
							await performAction(.previous)
						}
					} label: {
						Label("Previous", systemImage: "backward.end.fill")
					}
					.font(.title3)
					.disabled(isPerformingAction)
					.disabled(!(zone?.isPreviousAllowed ?? false))

					ZStack {
						Button {
							Task {
								await performAction(.pause)
							}
						} label: {
							Label("Pause", systemImage: "pause.fill")
						}
						.font(.title)
						.disabled(isPerformingAction)
						.disabled(!(zone?.isPauseAllowed ?? false))
						.opacity(zone?.state != .playing ? 0 : 1)

						Button {
							Task {
								await performAction(.play)
							}
						} label: {
							Label("Play", systemImage: "play.fill")
						}
						.font(.title)
						.disabled(isPerformingAction)
						.disabled(!(zone?.isPlayAllowed ?? false))
						.opacity(zone?.state == .playing ? 0 : 1)
					}

					Button {
						Task {
							await performAction(.next)
						}
					} label: {
						Label("Next", systemImage: "forward.end.fill")
					}
					.font(.title3)
					.disabled(isPerformingAction)
					.disabled(!(zone?.isNextAllowed ?? false))
				}
				.labelStyle(.iconOnly)
				.buttonStyle(.borderless)

				if let length = model.zone?.nowPlaying?.length, length > 0,
					let zone = zone
				{
					// Adding step parameter results in messy and broken-look UI on macOS.
					// The tick marks might work for less ticks (up to 10,) but it's completely
					// broken on this kind of usage; they are too dense to the point it renders
					// like visual glitch, and some ticks are skipped. I'd call it broken.
					// Fortunately, in this usecase, eliminating `step: 1.0` is acceptable because
					// we're casting to `Int64` anyway. So, even when SwiftUI uses steps less than
					// 1, fractional part will be ignored and end experience will be similar to
					// `step: 1.0`.
					Slider(
						value: $model.seek,
						in: 0.0...Float(length),
						onEditingChanged: { editing in
							if editing {
								model.suppressSeekUpdates = true
							} else {
								Task {
									do {
										let msg = try await model.conn.request(
											try Moo(
												seek: .init(zoneID: zone.id, seconds: Int64(model.seek))
											),
											timeout: .seconds(2)
										)

										_ = try TransportService.SeekResponse(msg)
									} catch {
										Logger().warning("Failed to seek: \(error)")
									}

									// If we resume accepting seek change events before seek request,
									// there is a chance incoming seek change "resets" seekbar position
									// then seek request updates seek then an event after that moves
									// seekbar position. From user's perspective, this is "seekbar
									// jumps to previous position then jumps again to the dragged
									// position". That's not good UX.
									model.suppressSeekUpdates = false
								}
							}
						}
					) {
						// Label for screen readers.
						Text("Playback position")
					}
					.labelsHidden()
					.disabled(!(zone.isSeekAllowed ?? false))
					.frame(maxWidth: .infinity)
				} else {
					Spacer()
				}

				if model.zones.count > 0 && zone != nil {
					Picker("Zone", selection: $model.zone) {
						ForEach(model.zones) { (zone: TransportService.Zone) in
							Text(zone.displayName).tag(zone)
						}
					}
					.scaledToFit()
				}
			}
		}
		.padding([.horizontal], 12)
		.padding([.vertical], 10)
	}

	private func performAction(_ action: TransportService.ControlAction) async {
		guard let zone = zone else {
			return
		}

		isPerformingAction = true

		do {
			let msg = try await model.conn.request(
				try Moo(control: .init(zoneID: zone.id, control: action)),
				timeout: .seconds(5)
			)

			_ = try TransportService.ControlResponse(msg)
		} catch {
			Logger().warning("Failed to send control message: \(error)")
		}

		isPerformingAction = false
	}
}

// MARK: - Previews

private actor MockServer: Communicatable {
	var position: Int64 = 0
	var length: Int64 = 120

	var messages: AsyncStream<Moo> {
		AsyncStream { stream in
			Task {
				do {
					while true {
						try Task.checkCancellation()
						try await Task.sleep(for: .seconds(1))

						position += 1
						if position > length {
							position = 0
						}

						let body = """
								{
									"zones_seek_changed": [
										{
											"zone_id": "0-foo",
											"seek_position": \(String(position, radix: 10))
										}
									]
								}
							"""

						stream.yield(
							Moo(
								verb: "CONTINUE",
								service: "idk",
								headers: [
									"Content-Type": "application/json",
									"Content-Length": String(body.utf8.count, radix: 10),
								],
								body: body.data(using: .utf8)!
							)
						)
					}
				} catch {
					stream.finish()
				}
			}
		}
	}

	func request(_ msg: consuming Moo) async throws -> Moo {
		try await request(msg: msg, timeout: nil)
	}

	func request(_ msg: consuming Moo, timeout: ContinuousClock.Instant.Duration)
		async throws -> Moo
	{
		try await request(msg: msg, timeout: timeout)
	}

	fileprivate enum MockRequestError: Error {
		case unsupportedMessage
		case invalidRequest
	}

	private func request(
		msg: Moo,
		timeout: ContinuousClock.Instant.Duration? = nil
	) async throws -> Moo {
		switch msg.service {
		case "\(TransportService.id)/subscribe_zones":
			let body = """
				{
					"zones": [
						{
							"zone_id": "0-foo",
							"display_name": "Foo",
							"outputs": [
								{
									"output_id": "foo-out1",
									"display_name": "Foo Output #1",
									"volume": {
										"type": "number",
										"min": 0,
										"max": 100,
										"step": 1,
										"value": 50,
										"is_muted": false
									}
								},
								{
									"output_id": "foo-out2",
									"display_name": "Foo Output #2",
									"volume": {
										"type": "incremental"
									}
								}
							],
							"now_playing": {
								"seek_position": \(String(position, radix: 10)),
								"length": \(String(length, radix: 10)),
								"one_line": {
									"line1": "A song"
								},
								"two_line": {
									"line1": "A song",
									"line2": "That's it"
								},
								"three_line": {
									"line1": "A song",
									"line2": "Really, that's it"
								}
							},
							"state": "playing",
							"is_previous_allowed": true,
							"is_next_allowed": false,
							"is_pause_allowed": true,
							"is_play_allowed": true,
							"is_seek_allowed": true
						},
						{
							"zone_id": "1-bar",
							"display_name": "Bar",
							"outputs": [],
							"state": "stopped"
						}
					]
				}
				"""

			return Moo(
				verb: "COMPLETE",
				service: "Subscribed",
				headers: [
					"Content-Type": "application/json",
					"Content-Length": String(body.utf8.count, radix: 10),
				],
				body: body.data(using: .utf8)!
			)
		case "\(TransportService.id)/seek":
			let res = try msg.json(type: TransportService.SeekRequest.self)

			position = res.seconds

			return Moo(verb: "COMPLETE", service: "Success")
		default:
			throw MockRequestError.unsupportedMessage
		}
	}

	func send(_ msg: consuming Moo) async throws {
		// No-op
	}
}

#Preview {
	let model = ZoneDataModel(conn: MockServer())

	PlaybackBar()
		.environment(model)
		.task {
			do {
				try await model.watchChanges()
			} catch {
				print(error)
			}
		}
}