import SwiftUI // MARK: - Visualizer Settings (Mitsuha Infinity parity + advanced physics) class VisualizerSettings: ObservableObject { static let shared = VisualizerSettings() // General @Published var enabled: Bool { didSet { save("vis_enabled", enabled) } } @Published var nowPlayingEnabled: Bool { didSet { save("vis_nowplaying", nowPlayingEnabled) } } @Published var miniPlayerEnabled: Bool { didSet { save("vis_miniplayer", miniPlayerEnabled) } } @Published var style: Style { didSet { save("vis_style", style.rawValue) } } @Published var numberOfPoints: Int { didSet { save("vis_points", numberOfPoints) } } @Published var sensitivity: Double { didSet { save("vis_sensitivity", sensitivity) } } @Published var fps: Double { didSet { save("vis_fps", fps) } } @Published var realAudioAnalysis: Bool { didSet { save("vis_real_fft", realAudioAnalysis) } } @Published var dynamicGainEnabled: Bool { didSet { save("vis_dynamic_gain", dynamicGainEnabled) } } // Wave @Published var waveOffsetTop: Double { didSet { save("vis_wave_offset", waveOffsetTop) } } // Bar @Published var barSpacing: Double { didSet { save("vis_bar_spacing", barSpacing) } } @Published var barCornerRadius: Double { didSet { save("vis_bar_radius", barCornerRadius) } } // Line @Published var lineThickness: Double { didSet { save("vis_line_thick", lineThickness) } } // Color @Published var colorMode: ColorMode { didSet { save("vis_color", colorMode.rawValue) } } @Published var alpha: Double { didSet { save("vis_alpha", alpha) } } @Published var customColor: Color = .pink // Advanced Physics @Published var viscosity: Double { didSet { save("vis_viscosity", viscosity) } } @Published var frequencyCutoff: Int { didSet { save("vis_freq_cutoff", frequencyCutoff) } } @Published var baseMultiplier: Double { didSet { save("vis_base_mult", baseMultiplier) } } @Published var depthOffset: Double { didSet { save("vis_depth_offset", depthOffset) } } @Published var depthOpacity: Double { didSet { save("vis_depth_opacity", depthOpacity) } } @Published var idleAmplitude: Double { didSet { save("vis_idle_amp", idleAmplitude) } } @Published var waveStrokeThickness: Double { didSet { save("vis_wave_stroke", waveStrokeThickness) } } // Layout @Published var nowPlayingHeightPct: Double { didSet { save("vis_np_height", nowPlayingHeightPct) } } @Published var miniPlayerHeight: Double { didSet { save("vis_mini_height", miniPlayerHeight) } } // Mini Player overrides @Published var miniOpacity: Double { didSet { save("vis_mini_opacity", miniOpacity) } } @Published var miniAmplitude: Double { didSet { save("vis_mini_amplitude", miniAmplitude) } } @Published var miniIdleAmplitude: Double { didSet { save("vis_mini_idle", miniIdleAmplitude) } } @Published var miniDepthOffset: Double { didSet { save("vis_mini_depth", miniDepthOffset) } } @Published var miniDepthOpacity: Double { didSet { save("vis_mini_depth_opacity", miniDepthOpacity) } } // Now Playing overrides @Published var npAmplitude: Double { didSet { save("vis_np_amplitude", npAmplitude) } } @Published var npBaseLift: Double { didSet { save("vis_np_baselift", npBaseLift) } } enum Style: String, CaseIterable { case wave = "Wave" case bar = "Bar" case line = "Line" } enum ColorMode: String, CaseIterable { case dynamic = "Dynamic" case albumArt = "Album Art" case siri = "Siri" case custom = "Custom" } private init() { let d = UserDefaults.standard enabled = d.object(forKey: "vis_enabled") as? Bool ?? true nowPlayingEnabled = d.object(forKey: "vis_nowplaying") as? Bool ?? true miniPlayerEnabled = d.object(forKey: "vis_miniplayer") as? Bool ?? true style = Style(rawValue: d.string(forKey: "vis_style") ?? "") ?? .wave numberOfPoints = { let v = d.integer(forKey: "vis_points"); return v > 0 ? v : 10 }() sensitivity = { let v = d.double(forKey: "vis_sensitivity"); return v > 0 ? v : 1.5 }() fps = { let v = d.double(forKey: "vis_fps"); return v > 0 ? v : 60.0 }() realAudioAnalysis = d.object(forKey: "vis_real_fft") as? Bool ?? true dynamicGainEnabled = d.object(forKey: "vis_dynamic_gain") as? Bool ?? true waveOffsetTop = d.double(forKey: "vis_wave_offset") barSpacing = { let v = d.double(forKey: "vis_bar_spacing"); return v > 0 ? v : 5.0 }() barCornerRadius = d.double(forKey: "vis_bar_radius") lineThickness = { let v = d.double(forKey: "vis_line_thick"); return v > 0 ? v : 5.0 }() colorMode = ColorMode(rawValue: d.string(forKey: "vis_color") ?? "") ?? .dynamic alpha = { let v = d.double(forKey: "vis_alpha"); return v > 0 ? v : 0.6 }() // Advanced viscosity = { let v = d.double(forKey: "vis_viscosity"); return v > 0 ? v : 0.25 }() frequencyCutoff = { let v = d.integer(forKey: "vis_freq_cutoff"); return v > 0 ? v : 80 }() baseMultiplier = { let v = d.double(forKey: "vis_base_mult"); return v > 0 ? v : 40.0 }() depthOffset = { let v = d.double(forKey: "vis_depth_offset"); return v > 0 ? v : 15.0 }() depthOpacity = { let v = d.double(forKey: "vis_depth_opacity"); return v > 0 ? v : 0.2 }() idleAmplitude = { let v = d.double(forKey: "vis_idle_amp"); return v > 0 ? v : 0.03 }() waveStrokeThickness = { let v = d.double(forKey: "vis_wave_stroke"); return v > 0 ? v : 1.5 }() // Layout nowPlayingHeightPct = { let v = d.double(forKey: "vis_np_height"); return v > 0 ? v : 0.50 }() miniPlayerHeight = { let v = d.double(forKey: "vis_mini_height"); return v > 0 ? v : 48.0 }() // Mini Player miniOpacity = d.object(forKey: "vis_mini_opacity") as? Double ?? 0.5 miniAmplitude = { let v = d.double(forKey: "vis_mini_amplitude"); return v > 0 ? v : 0.7 }() miniIdleAmplitude = { let v = d.double(forKey: "vis_mini_idle"); return v > 0 ? v : 0.03 }() miniDepthOffset = d.object(forKey: "vis_mini_depth") as? Double ?? 8.0 miniDepthOpacity = d.object(forKey: "vis_mini_depth_opacity") as? Double ?? 0.2 // Now Playing npAmplitude = { let v = d.double(forKey: "vis_np_amplitude"); return v > 0 ? v : 0.45 }() npBaseLift = d.object(forKey: "vis_np_baselift") as? Double ?? 130.0 } var effectiveFPS: Double { ProcessInfo.processInfo.isLowPowerModeEnabled ? min(fps, 24) : fps } private func save(_ key: String, _ value: Any) { // Debounce: update local var instantly for UI, delay disk write pendingSaves[key] = value saveTask?.cancel() saveTask = Task { [weak self] in try? await Task.sleep(nanoseconds: 500_000_000) guard !Task.isCancelled else { return } if let pending = self?.pendingSaves { for (k, v) in pending { UserDefaults.standard.set(v, forKey: k) } self?.pendingSaves.removeAll() } } } private var pendingSaves: [String: Any] = [:] private var saveTask: Task? } // MARK: - Wave State Cache (shared between mini player and DI for morph continuity) /// Single source of truth for compact visualizer levels. /// Both MiniPlayerBar and DynamicIslandView seed from here on appear, /// so the wave doesn't reset to idle when matchedGeometryEffect transitions between them. final class WaveStateCache { static let shared = WaveStateCache() var compactLevels: [Float] = [] private init() {} } // MARK: - Level Box /// Per-instance mutable render state. Zero @Published properties → no observation warnings. fileprivate final class VisualizerLevelBox: ObservableObject { var displayLevels: [Float] = [] var peakFollower: Float = 0.01 var levelHistoryBuf: [[Float]] = [] var historyWriteIdx: Int = 0 var wobblePhaseOffset: Double = 0 var lastTickTime: CFTimeInterval = 0 } // MARK: - Main Visualizer View struct MitsuhaVisualizerView: View { var previewLevels: [Float]? = nil let isPlaying: Bool var isSongLoaded: Bool = true let accentColor: Color var compact: Bool = false @ObservedObject var settings = VisualizerSettings.shared @ObservedObject var albumColors = AlbumColorExtractor.shared @StateObject private var box = VisualizerLevelBox() private static let historySize = 16 var body: some View { // TimelineView(.animation) fires on every animation frame as long as the // view is on screen. It is NOT gated on isPlaying — it runs during pause, // during fade animations, during sheet presentations, always. // Levels are polled directly inside the Canvas via AudioPlayer.shared.currentLevels() // which is nonisolated(unsafe) — safe to call from any thread with no actor hopping. // This eliminates every @ObservedObject dependency chain failure mode. TimelineView(.animation) { timeline in if settings.enabled { Canvas { context, size in // timeline.date changes every frame — SwiftUI must re-execute this closure. let t = timeline.date.timeIntervalSinceReferenceDate let rawLevels: [Float] = isPlaying ? (previewLevels ?? AudioPlayer.shared.currentLevels()) : Array(repeating: Float(0), count: max(settings.numberOfPoints, 1)) updateDisplayLevels(newRawLevels: rawLevels) updateWobblePhase(t: t) let pts = box.displayLevels.isEmpty ? Array(repeating: Float(settings.idleAmplitude), count: settings.numberOfPoints) : box.displayLevels guard pts.count >= 2 else { return } switch settings.style { case .wave: drawWave(ctx: context, size: size, levels: pts, continuousTime: box.wobblePhaseOffset) case .bar: drawBars(ctx: context, size: size, levels: pts) case .line: drawLine(ctx: context, size: size, levels: pts) } } .opacity(isPlaying ? 1.0 : (isSongLoaded ? 0.35 : 1.0)) .animation(isSongLoaded ? .easeInOut(duration: 0.6) : nil, value: isPlaying) .onAppear { let cached = compact ? WaveStateCache.shared.compactLevels : [] box.displayLevels = cached.isEmpty ? Array(repeating: Float(settings.idleAmplitude), count: settings.numberOfPoints) : cached } } } } // MARK: - Wobble Phase private func updateWobblePhase(t: Double) { if box.lastTickTime > 0 { let delta = t - box.lastTickTime box.wobblePhaseOffset += min(delta, 0.1) } box.lastTickTime = t } // MARK: - Temporal Smoothing & Log Binning @discardableResult private func updateDisplayLevels(newRawLevels: [Float]) -> Bool { let count = settings.numberOfPoints guard count > 0, !newRawLevels.isEmpty else { return false } let sens = Float(settings.sensitivity) let isPreProcessed = AudioPlayer.shared.isUsingOfflineVis var targetLevels: [Float] if isPreProcessed { // Offline vis frames are already normalized (peak ≈ 0.8) and log-binned. // Only apply sensitivity for user control — no baseMultiplier needed. if newRawLevels.count == count { targetLevels = newRawLevels.map { min(1.0, $0 * sens) } } else { // Resample to match display point count via linear interpolation targetLevels = (0.. 0 ? (sum / Float(countInBand)) : 0 let eqBoost: Float = 1.0 + (Float(i) / Float(count)) * 3.5 targetLevels[i] = min(1.0, averageInBand * Float(settings.baseMultiplier) * sens * eqBoost) } } // Temporal Smoothing — delta-time based so it's frame-rate independent. // Use elapsed time since last tick to compute smoothFactor rather than // assuming a fixed fps — this prevents lag when running at 60/120fps. let dt = Float(max(box.lastTickTime > 0 ? min(CACurrentMediaTime() - box.lastTickTime, 0.1) : 1.0/60.0, 0.001)) // viscosity 0.05 = very slow, 1.0 = instant. Scale by 60*dt so behaviour // at 60fps matches the original fpsScale=1 viscosity settings. let smoothFactor = min(Float(settings.viscosity) * 60.0 * dt, 1.0) // ── Dynamic Gain / Peak Follower ───────────────────────────────────── let frameMax = targetLevels.max() ?? 0.0 if frameMax > box.peakFollower { box.peakFollower = box.peakFollower + (frameMax - box.peakFollower) * 0.3 } else { box.peakFollower = max(box.peakFollower * 0.997, 0.005) } if settings.dynamicGainEnabled { let normFactor = Float(1.0) / max(box.peakFollower, 0.005) targetLevels = targetLevels.map { min($0 * normFactor, 1.0) } } if box.displayLevels.count != count { box.displayLevels = targetLevels } else { for i in 0.. Path { var p = Path() guard points.count >= 2 else { return p } for i in 0..<(points.count - 1) { let p0 = i > 0 ? points[i - 1] : points[0] let p1 = points[i] let p2 = points[i + 1] let p3 = i < points.count - 2 ? points[i + 2] : p2 let cp1 = CGPoint( x: p1.x + (p2.x - p0.x) * curveTension, y: p1.y + (p2.y - p0.y) * curveTension ) let cp2 = CGPoint( x: p2.x - (p3.x - p1.x) * curveTension, y: p2.y - (p3.y - p1.y) * curveTension ) p.addCurve(to: p2, control1: cp1, control2: cp2) } return p } /// Full curve path with moveTo — used for strokes private func strokeableCurve(_ points: [CGPoint]) -> Path { var p = Path() guard points.count >= 2 else { return p } p.move(to: points[0]) for i in 0..<(points.count - 1) { let p0 = i > 0 ? points[i - 1] : points[0] let p1 = points[i] let p2 = points[i + 1] let p3 = i < points.count - 2 ? points[i + 2] : p2 let cp1 = CGPoint( x: p1.x + (p2.x - p0.x) * curveTension, y: p1.y + (p2.y - p0.y) * curveTension ) let cp2 = CGPoint( x: p2.x - (p3.x - p1.x) * curveTension, y: p2.y - (p3.y - p1.y) * curveTension ) p.addCurve(to: p2, control1: cp1, control2: cp2) } return p } // MARK: - Wave private func drawWave(ctx: GraphicsContext, size: CGSize, levels: [Float], continuousTime: Double) { let w = size.width let h = size.height let idleVal = CGFloat(compact ? settings.miniIdleAmplitude : settings.idleAmplitude) guard levels.count >= 2 else { return } let count = levels.count let spacing = w / CGFloat(count - 1) let now = continuousTime let baseLift: CGFloat = compact ? 0 : CGFloat(settings.npBaseLift) let offset = compact ? 0 : CGFloat(settings.waveOffsetTop) let baseline = h - baseLift - offset let ampScale: CGFloat = compact ? CGFloat(settings.miniAmplitude) : CGFloat(settings.npAmplitude) var points = levels.enumerated().map { i, lev -> CGPoint in let x = CGFloat(i) * spacing let baseAmp = CGFloat(lev) let organicWobble = CGFloat(sin(now * 3.0 + (Double(i) * 0.8)) * 0.03) let totalAmp = max(idleVal, baseAmp + organicWobble) return CGPoint(x: x, y: baseline - (totalAmp * h * ampScale)) } // ── Endpoint Anchoring (improvement #13) ──────────────────────────── // Pin first and last points exactly to baseline so the wave cleanly // rises from and returns to the horizon — matching the original tweak. points[0] = CGPoint(x: 0, y: baseline) points[count - 1] = CGPoint(x: w, y: baseline) // ── Layer 1: Temporal depth ghost (improvement #11) ────────────────── // Use the oldest ring-buffer frame (~250ms ago) for the shadow wave, // matching the original's 0.25s dispatch_after delay exactly. let ctxDepthOffset = compact ? CGFloat(settings.miniDepthOffset) : CGFloat(settings.depthOffset) let ctxDepthOpacity = compact ? settings.miniDepthOpacity : settings.depthOpacity let ghostLevels: [Float] let histFull = box.levelHistoryBuf.count >= MitsuhaVisualizerView.historySize if histFull { ghostLevels = box.levelHistoryBuf[box.historyWriteIdx] } else { ghostLevels = box.levelHistoryBuf.first ?? Array(repeating: 0, count: count) } let ghostCount = max(ghostLevels.count, 2) var depthPts = (0.. CGPoint in // Sample the ghost frame at the same normalised position let srcF = Float(i) / Float(count - 1) * Float(ghostCount - 1) let lo = min(Int(srcF), ghostCount - 1) let hi = min(lo + 1, ghostCount - 1) let frac = CGFloat(srcF - Float(lo)) let ghostLev = CGFloat(ghostLevels[lo]) * (1 - frac) + CGFloat(ghostLevels[hi]) * frac let ghostAmp = max(idleVal, ghostLev) let x = CGFloat(i) * spacing return CGPoint(x: x, y: baseline - (ghostAmp * h * ampScale) + ctxDepthOffset + 5) } // Anchor ghost endpoints too depthPts[0] = CGPoint(x: 0, y: baseline + ctxDepthOffset) depthPts[count - 1] = CGPoint(x: w, y: baseline + ctxDepthOffset) let depthCurve = smoothCurve(depthPts) var depthFill = Path() depthFill.move(to: CGPoint(x: 0, y: h)) depthFill.addLine(to: depthPts[0]) depthFill.addPath(depthCurve) depthFill.addLine(to: CGPoint(x: w, y: h)) depthFill.closeSubpath() ctx.fill(depthFill, with: .color(strokeColor.opacity(ctxDepthOpacity))) // Layer 2: Main fill — gradient from wave crest to true bottom let curve = smoothCurve(points) var fill = Path() fill.move(to: CGPoint(x: 0, y: h)) fill.addLine(to: points[0]) fill.addPath(curve) fill.addLine(to: CGPoint(x: w, y: h)) fill.closeSubpath() let isSiri = settings.colorMode == .siri if isSiri { ctx.fill(fill, with: .linearGradient( Gradient(colors: fillColors), startPoint: CGPoint(x: 0, y: 0), endPoint: CGPoint(x: w, y: 0) )) } else { ctx.fill(fill, with: .linearGradient( Gradient(colors: fillColors), startPoint: CGPoint(x: w / 2, y: baseline - h * 0.3), endPoint: CGPoint(x: w / 2, y: h) )) } // Layer 3: Stroke line ctx.stroke(strokeableCurve(points), with: .color(strokeColor), lineWidth: CGFloat(settings.waveStrokeThickness)) } // MARK: - Bars private func drawBars(ctx: GraphicsContext, size: CGSize, levels: [Float]) { let w = size.width let h = size.height let count = levels.count guard count > 0 else { return } let baseLift: CGFloat = compact ? 0 : CGFloat(settings.npBaseLift) let offset = compact ? 0 : CGFloat(settings.waveOffsetTop) let baseline = h - baseLift - offset let ampScale: CGFloat = compact ? CGFloat(settings.miniAmplitude) : CGFloat(settings.npAmplitude) let gap = CGFloat(settings.barSpacing) let cr = CGFloat(settings.barCornerRadius) let totalGapSpace = gap * CGFloat(count - 1) let barW = max(1, (w - totalGapSpace) / CGFloat(count)) let isSiri = settings.colorMode == .siri for i in 0..= 2 else { return } let spacing = w / CGFloat(levels.count - 1) let thick = CGFloat(settings.lineThickness) let isSiri = settings.colorMode == .siri let baseLift: CGFloat = compact ? 0 : CGFloat(settings.npBaseLift) let offset = compact ? 0 : CGFloat(settings.waveOffsetTop) let centerY = compact ? h * 0.5 : h - baseLift - offset let ampMult: CGFloat = compact ? CGFloat(settings.miniAmplitude) * 0.5 : CGFloat(settings.npAmplitude) * 0.55 let points = levels.enumerated().map { i, lev -> CGPoint in let dir: CGFloat = i % 2 == 0 ? -1 : 1 let amp = CGFloat(lev) * (h * ampMult) return CGPoint(x: CGFloat(i) * spacing, y: centerY + (dir * amp)) } let curve = strokeableCurve(points) let strokeStyle = StrokeStyle(lineWidth: thick, lineCap: .round, lineJoin: .round) // Glow ctx.stroke(curve, with: .color(strokeColor.opacity(0.3)), style: StrokeStyle(lineWidth: thick + 6, lineCap: .round, lineJoin: .round)) // Core line if isSiri { ctx.stroke(curve, with: .linearGradient( Gradient(colors: fillColors), startPoint: CGPoint(x: 0, y: centerY), endPoint: CGPoint(x: w, y: centerY) ), style: strokeStyle) } else { ctx.stroke(curve, with: .color(strokeColor), style: strokeStyle) } } } // MARK: - Compact Visualizer (for mini player) struct CompactVisualizerView: View { let isPlaying: Bool var isSongLoaded: Bool = true let accentColor: Color let height: CGFloat var body: some View { MitsuhaVisualizerView( isPlaying: isPlaying, isSongLoaded: isSongLoaded, accentColor: accentColor, compact: true ) .frame(height: height) } } // MARK: - Visualizer Settings View struct VisualizerSettingsView: View { @ObservedObject var settings = VisualizerSettings.shared @Environment(\.dismiss) private var dismiss private let pink = Color(red: 1.0, green: 0.176, blue: 0.333) var body: some View { NavigationStack { Form { Section { Toggle("Enabled", isOn: $settings.enabled).tint(pink) Toggle("Now Playing Screen", isOn: $settings.nowPlayingEnabled).tint(pink).disabled(!settings.enabled) Toggle("Mini Player", isOn: $settings.miniPlayerEnabled).tint(pink).disabled(!settings.enabled) } header: { Text("VISUALIZER") } footer: { Text("Master toggle disables all visualizers. Individual toggles control each location.") } Section { Picker("Style", selection: $settings.style) { ForEach(VisualizerSettings.Style.allCases, id: \.self) { Text($0.rawValue).tag($0) } }.pickerStyle(.segmented) sliderRow("Number of points", value: $settings.numberOfPoints, range: 4...24, step: 1) } header: { Text("STYLE") } footer: { Text("Points control how many data points the wave is built from. Fewer points = bigger, rounder ocean swells. More points = detailed, ripply surface. 8–12 is a good starting point.") } if settings.style == .wave { Section { sliderRowDouble("Stroke thickness", value: $settings.waveStrokeThickness, range: 0.5...5.0, step: 0.5, format: "%.1f") } header: { Text("WAVE") } footer: { Text("The white line on top of the wave fill. At 0.5, barely visible. At 3+, a bold outline.") } } if settings.style == .bar { Section { sliderRowDouble("Bar spacing", value: $settings.barSpacing, range: 0...20, step: 1, format: "%.0f") sliderRowDouble("Corner radius", value: $settings.barCornerRadius, range: 0...15, step: 1, format: "%.0f") } header: { Text("BAR") } footer: { Text("Spacing controls the gap between bars. Corner radius rounds the bar tops — at 0 they're sharp rectangles, at 15 they're rounded pills.") } } if settings.style == .line { Section { sliderRowDouble("Line thickness", value: $settings.lineThickness, range: 1...12, step: 0.5, format: "%.1f") } header: { Text("LINE") } footer: { Text("How thick the oscillating line is. Includes an automatic glow effect that scales with thickness.") } } Section { Picker("Color", selection: $settings.colorMode) { ForEach(VisualizerSettings.ColorMode.allCases, id: \.self) { Text($0.rawValue).tag($0) } }.pickerStyle(.segmented) sliderRowDouble("Color alpha", value: $settings.alpha, range: 0.1...1.0, step: 0.05, format: "%.2f") if settings.colorMode == .custom { ColorPicker("Wave Color", selection: $settings.customColor) } } header: { Text("COLOR") } footer: { switch settings.colorMode { case .dynamic: Text("Uses the app's accent color.") case .albumArt: Text("Extracts dominant and secondary colors from the current album cover. The wave changes color with every song.") case .siri: Text("Rainbow gradient (pink → green → cyan → purple → white) applied horizontally across the wave.") case .custom: Text("Pick any color with the color picker above.") } } Section { NavigationLink { NowPlayingVisSettingsView(settings: settings) } label: { HStack { Image(systemName: "play.rectangle.fill").foregroundColor(pink).frame(width: 28) Text("Now Playing") Spacer() Text("\(Int(settings.npAmplitude * 100))% amp").font(.caption).foregroundColor(.gray) } } NavigationLink { MiniPlayerVisSettingsView(settings: settings) } label: { HStack { Image(systemName: "rectangle.bottomhalf.filled").foregroundColor(pink).frame(width: 28) Text("Mini Player") Spacer() Text("\(Int(settings.miniAmplitude * 100))% amp").font(.caption).foregroundColor(.gray) } } } header: { Text("PER-VIEW SETTINGS") } footer: { Text("Each view has its own amplitude, depth, idle, and layout controls. Tap to configure individually.") } Section { sliderRowDouble("Viscosity", value: $settings.viscosity, range: 0.05...1.0, step: 0.05, format: "%.2f") sliderRow("Frequency cutoff", value: $settings.frequencyCutoff, range: 40...200, step: 10) sliderRowDouble("Base multiplier", value: $settings.baseMultiplier, range: 10.0...100.0, step: 5.0, format: "%.0f") sliderRowDouble("Sensitivity", value: $settings.sensitivity, range: 0.1...4.0, step: 0.1, format: "%.1f") sliderRowDouble("FPS", value: $settings.fps, range: 15...60, step: 1, format: "%.0f") Toggle("Real Audio Analysis", isOn: $settings.realAudioAnalysis).tint(pink) Toggle("Dynamic Gain", isOn: $settings.dynamicGainEnabled).tint(pink) } header: { Text("SHARED / ADVANCED") } footer: { Text("Viscosity controls how quickly the wave reacts. 0.15–0.25 = heavy liquid. 0.5 = responsive. 0.8+ = snappy EQ.\n\nSensitivity multiplies incoming audio. Base multiplier is a second gain stage for FFT.\n\nDynamic Gain automatically normalises the wave amplitude across loud and quiet tracks — keeps the wave full on soft passages without clipping on loud ones.\n\nFPS drops to 24 in Low Power Mode.") } // Presets Section { Button(action: applyDeepOcean) { HStack { Image(systemName: "water.waves").foregroundColor(.cyan) VStack(alignment: .leading) { Text("Deep Ocean Swell").foregroundColor(.white) Text("Slow, massive rolling waves").font(.caption2).foregroundColor(.gray) } } } Button(action: applyReactiveEQ) { HStack { Image(systemName: "waveform").foregroundColor(.green) VStack(alignment: .leading) { Text("Reactive EQ").foregroundColor(.white) Text("Detailed, fast response").font(.caption2).foregroundColor(.gray) } } } Button(action: applySubtleAmbient) { HStack { Image(systemName: "moonphase.waning.crescent").foregroundColor(.purple) VStack(alignment: .leading) { Text("Subtle Ambient").foregroundColor(.white) Text("Gentle, transparent shimmer").font(.caption2).foregroundColor(.gray) } } } Button(action: applyHeavyMercury) { HStack { Image(systemName: "drop.fill").foregroundColor(.gray) VStack(alignment: .leading) { Text("Heavy Liquid Mercury").foregroundColor(.white) Text("Dense, weighty metallic flow").font(.caption2).foregroundColor(.gray) } } } } header: { Text("PRESETS") } footer: { Text("Apply a preset to set multiple sliders at once. You can fine-tune afterwards.") } Section { Button("Reset to Defaults", role: .destructive) { resetDefaults() } } } .navigationTitle("Visualizer") .navigationBarTitleDisplayMode(.inline) .toolbar { ToolbarItem(placement: .navigationBarTrailing) { Button("Done") { dismiss() }.foregroundColor(pink) } } } } // MARK: - Presets private func applyDeepOcean() { settings.numberOfPoints = 6; settings.viscosity = 0.15; settings.sensitivity = 2.0 settings.npAmplitude = 0.8; settings.depthOffset = 30; settings.frequencyCutoff = 50 } private func applyReactiveEQ() { settings.numberOfPoints = 20; settings.viscosity = 0.7; settings.sensitivity = 1.5 settings.npAmplitude = 0.5; settings.depthOffset = 5; settings.frequencyCutoff = 150 } private func applySubtleAmbient() { settings.numberOfPoints = 8; settings.viscosity = 0.20; settings.sensitivity = 1.0 settings.npAmplitude = 0.25; settings.alpha = 0.3; settings.idleAmplitude = 0.05 } private func applyHeavyMercury() { settings.numberOfPoints = 10; settings.viscosity = 0.12; settings.sensitivity = 2.5 settings.baseMultiplier = 60; settings.npAmplitude = 0.6; settings.depthOffset = 20 } // MARK: - Slider Helpers func sliderRow(_ label: String, value: Binding, range: ClosedRange, step: Int) -> some View { VStack(alignment: .leading, spacing: 4) { Text(label).font(.body) HStack { Slider(value: Binding(get: { Double(value.wrappedValue) }, set: { value.wrappedValue = Int($0) }), in: Double(range.lowerBound)...Double(range.upperBound), step: Double(step)).tint(pink) Text("\(value.wrappedValue)").foregroundColor(.gray).frame(width: 44, alignment: .trailing) } } } func sliderRowDouble(_ label: String, value: Binding, range: ClosedRange, step: Double, format: String) -> some View { VStack(alignment: .leading, spacing: 4) { Text(label).font(.body) HStack { Slider(value: value, in: range, step: step).tint(pink) Text(String(format: format, value.wrappedValue)).foregroundColor(.gray).frame(width: 44, alignment: .trailing) } } } var previewLevels: [Float] { (0..<30).map { Float(0.2 + 0.5 * sin(Float($0) * 0.4)) } } private func resetDefaults() { settings.enabled = true; settings.nowPlayingEnabled = true; settings.miniPlayerEnabled = true settings.style = .wave; settings.numberOfPoints = 10; settings.sensitivity = 1.5 settings.fps = 60; settings.realAudioAnalysis = true; settings.dynamicGainEnabled = true settings.waveOffsetTop = 0 settings.barSpacing = 5; settings.barCornerRadius = 0; settings.lineThickness = 5 settings.colorMode = .dynamic; settings.alpha = 0.6; settings.viscosity = 0.25 settings.frequencyCutoff = 80; settings.baseMultiplier = 40.0 settings.depthOffset = 15.0; settings.depthOpacity = 0.2; settings.idleAmplitude = 0.03 settings.waveStrokeThickness = 1.5; settings.nowPlayingHeightPct = 0.50; settings.miniPlayerHeight = 48.0 settings.miniOpacity = 0.5; settings.miniAmplitude = 0.7; settings.miniIdleAmplitude = 0.03 settings.miniDepthOffset = 8.0; settings.miniDepthOpacity = 0.2 settings.npAmplitude = 0.45; settings.npBaseLift = 130.0 } } // MARK: - Now Playing Sub-Settings struct NowPlayingVisSettingsView: View { @ObservedObject var settings: VisualizerSettings private let pink = Color(red: 1.0, green: 0.176, blue: 0.333) var body: some View { Form { Section { VStack(alignment: .leading, spacing: 4) { Text("Screen height %").font(.body) HStack { Slider(value: $settings.nowPlayingHeightPct, in: 0.2...0.8, step: 0.05).tint(pink) Text("\(Int(settings.nowPlayingHeightPct * 100))%").foregroundColor(.gray).frame(width: 52, alignment: .trailing) } } sd("Amplitude", value: $settings.npAmplitude, range: 0.1...1.5, step: 0.05, format: "%.2f") sd("Base lift (from bottom)", value: $settings.npBaseLift, range: 0...300, step: 5, format: "%.0f pt") sd("Wave offset (top)", value: $settings.waveOffsetTop, range: -100...300, step: 5, format: "%.0f") } header: { Text("LAYOUT & AMPLITUDE") } footer: { Text("Screen height controls how much of the Now Playing screen the visualizer fills. At 50%, it covers the bottom half. At 70%, it reaches behind the album art.\n\nAmplitude controls how tall wave peaks are. At 0.45, peaks reach about halfway. Push to 0.8+ for dramatic waves. Drop to 0.2 for a subtle accent.\n\nBase lift moves the wave baseline up from the very bottom of the screen. At 130 (default), the wave sits above the transport controls. Set to 0 for the absolute bottom edge.\n\nWave offset adds additional vertical shift on top of base lift. Use negative values to push down, positive to push up.") } Section { sd("Depth offset", value: $settings.depthOffset, range: 0...50, step: 1, format: "%.0f") sd("Depth opacity", value: $settings.depthOpacity, range: 0.0...0.5, step: 0.05, format: "%.2f") sd("Idle amplitude", value: $settings.idleAmplitude, range: 0.0...0.15, step: 0.005, format: "%.3f") } header: { Text("DEPTH & IDLE") } footer: { Text("Depth offset controls how far below the main wave the shadow layer is drawn. At 15, there's visible parallax. At 0, they overlap. At 40+, the shadow looks like a distant reflection.\n\nDepth opacity sets how visible the shadow wave is. At 0.2, it's subtle. At 0, invisible.\n\nIdle amplitude is the minimum wave height during quiet moments. Prevents the wave from going completely flat. At 0.03, there's always gentle surface tension.") } Section { ZStack { Color.black MitsuhaVisualizerView(previewLevels: previewLevels, isPlaying: true, accentColor: pink) } .frame(height: 180).listRowInsets(EdgeInsets()).listRowBackground(Color.black) } header: { Text("PREVIEW") } } .navigationTitle("Now Playing").navigationBarTitleDisplayMode(.inline) } private var previewLevels: [Float] { (0..<30).map { Float(0.2 + 0.5 * sin(Float($0) * 0.4)) } } private func sd(_ label: String, value: Binding, range: ClosedRange, step: Double, format: String) -> some View { VStack(alignment: .leading, spacing: 4) { Text(label).font(.body) HStack { Slider(value: value, in: range, step: step).tint(pink) Text(String(format: format, value.wrappedValue)).foregroundColor(.gray).frame(width: 52, alignment: .trailing) } } } } // MARK: - Mini Player Sub-Settings struct MiniPlayerVisSettingsView: View { @ObservedObject var settings: VisualizerSettings private let pink = Color(red: 1.0, green: 0.176, blue: 0.333) var body: some View { Form { Section { sd("Height (points)", value: $settings.miniPlayerHeight, range: 24...80, step: 4, format: "%.0f pt") sd("Amplitude", value: $settings.miniAmplitude, range: 0.1...2.0, step: 0.05, format: "%.2f") sd("Opacity", value: $settings.miniOpacity, range: 0.1...1.0, step: 0.05, format: "%.2f") } header: { Text("LAYOUT & AMPLITUDE") } footer: { Text("Height is the actual size of the mini player visualizer frame in points. Larger values give the wave more room.\n\nAmplitude is higher than Now Playing by default (0.7) because the mini player is much smaller. Push to 1.5+ if you want the wave to fill the entire height.\n\nOpacity controls transparency behind the mini player controls. At 0.5, the wave is visible but song title and buttons are readable. At 1.0, fully opaque. At 0.2, a subtle shimmer.") } Section { sd("Depth offset", value: $settings.miniDepthOffset, range: 0...30, step: 1, format: "%.0f") sd("Depth opacity", value: $settings.miniDepthOpacity, range: 0.0...0.5, step: 0.05, format: "%.2f") sd("Idle amplitude", value: $settings.miniIdleAmplitude, range: 0.0...0.15, step: 0.005, format: "%.3f") } header: { Text("DEPTH & IDLE") } footer: { Text("Depth offset controls the shadow wave distance. Keep lower than Now Playing since the mini player is smaller — 8 is a good default.\n\nIdle amplitude prevents the wave from flatlining during quiet moments.") } Section { ZStack { Color(white: 0.12) MitsuhaVisualizerView(previewLevels: previewLevels, isPlaying: true, accentColor: pink, compact: true) .frame(height: settings.miniPlayerHeight) .opacity(settings.miniOpacity) HStack(spacing: 12) { RoundedRectangle(cornerRadius: 4).fill(Color.gray.opacity(0.3)).frame(width: 40, height: 40) VStack(alignment: .leading, spacing: 2) { Text("Song Title").font(.system(size: 14, weight: .medium)).foregroundColor(.white) Text("Artist").font(.system(size: 12)).foregroundColor(.gray) } Spacer() Image(systemName: "pause.fill").foregroundColor(.white) Image(systemName: "forward.fill").foregroundColor(.white) }.padding(.horizontal, 12) } .frame(height: 64).listRowInsets(EdgeInsets()).listRowBackground(Color(white: 0.12)) } header: { Text("PREVIEW") } } .navigationTitle("Mini Player").navigationBarTitleDisplayMode(.inline) } private var previewLevels: [Float] { (0..<30).map { Float(0.2 + 0.5 * sin(Float($0) * 0.4)) } } private func sd(_ label: String, value: Binding, range: ClosedRange, step: Double, format: String) -> some View { VStack(alignment: .leading, spacing: 4) { Text(label).font(.body) HStack { Slider(value: value, in: range, step: step).tint(pink) Text(String(format: format, value.wrappedValue)).foregroundColor(.gray).frame(width: 52, alignment: .trailing) } } } }