1- //
2- // ContentView.swift
3- // Example
4- //
5- // Created by Sven Tiigi on 20.09.21.
6- //
7-
81import SwiftUI
92import YouTubePlayerKit
103
@@ -13,16 +6,29 @@ import YouTubePlayerKit
136/// The ContentView
147struct ContentView {
158
16- /// All ο£Ώ WWDC Keynotes
17- private let wwdcKeynotes : [ WWDCKeynote ] = WWDCKeynote . all. sorted ( by: > )
9+ /// All ο£Ώ WWDC Keynotes.
10+ private let wwdcKeynotes = WWDCKeynote . all. sorted ( by: > )
11+
12+ /// The selected WWDC keynote.
13+ @State
14+ private var selectedKeynote : WWDCKeynote ? = . wwdc2023
1815
19- /// The YouTube Player
16+ /// The YouTube Player.
2017 @StateObject
2118 private var youTubePlayer = YouTubePlayer (
22- source: . url( WWDCKeynote . wwdc2022. youTubeURL)
19+ source: . url( WWDCKeynote . wwdc2023. youTubeURL) ,
20+ configuration: . init(
21+ fullscreenMode: {
22+ #if os(macOS) || os(visionOS)
23+ . web
24+ #else
25+ . system
26+ #endif
27+ } ( )
28+ )
2329 )
2430
25- /// The color scheme
31+ /// The color scheme.
2632 @Environment ( \. colorScheme)
2733 private var colorScheme
2834
@@ -32,60 +38,95 @@ struct ContentView {
3238
3339extension ContentView : View {
3440
35- /// The content and behavior of the view
41+ /// The content and behavior of the view.
3642 var body : some View {
37- NavigationView {
38- ScrollView {
39- YouTubePlayerView (
40- self . youTubePlayer,
41- placeholderOverlay: {
42- ProgressView ( )
43- }
44- )
45- . frame ( height: 220 )
46- . background ( Color ( . systemBackground) )
47- . shadow (
48- color: . black. opacity ( 0.1 ) ,
49- radius: 46 ,
50- x: 0 ,
51- y: 15
43+ Group {
44+ #if os(macOS)
45+ self . macOSBody
46+ #elseif os(visionOS)
47+ self . visionOSBody
48+ #else
49+ self . iOSBody
50+ #endif
51+ }
52+ . onChange ( of: self . selectedKeynote) { _, keynote in
53+ guard let keynote else {
54+ return self . youTubePlayer. stop ( )
55+ }
56+ self . youTubePlayer. cue ( source: . url( keynote. youTubeURL) )
57+ }
58+ }
59+
60+ }
61+
62+ // MARK: - Player
63+
64+ private extension ContentView {
65+
66+ /// The content and behavior of the YouTube player view.
67+ var playerView : some View {
68+ YouTubePlayerView ( self . youTubePlayer) { state in
69+ switch state {
70+ case . idle:
71+ ProgressView ( )
72+ case . ready:
73+ EmptyView ( )
74+ case . error:
75+ Label (
76+ " An error occurred. " ,
77+ systemImage: " xmark.circle.fill "
5278 )
53- VStack ( spacing: 20 ) {
54- ForEach ( self . wwdcKeynotes) { wwdcKeynote in
55- Button (
56- action: {
57- self . youTubePlayer. source = . url( wwdcKeynote. youTubeURL)
58- } ,
59- label: {
79+ . foregroundStyle ( . red)
80+ }
81+ }
82+ }
83+
84+ }
85+
86+ // MARK: - iOS
87+
88+ #if os(iOS)
89+ private extension ContentView {
90+
91+ /// The content and behavior of the view for the iOS platform.
92+ var iOSBody : some View {
93+ NavigationStack {
94+ ScrollView {
95+ LazyVStack (
96+ spacing: 20 ,
97+ pinnedViews: [ . sectionHeaders]
98+ ) {
99+ Section {
100+ ForEach ( self . wwdcKeynotes) { keynote in
101+ Button {
102+ self . selectedKeynote = keynote
103+ } label: {
60104 YouTubePlayerView (
61105 . init(
62- source: . url( wwdcKeynote . youTubeURL)
106+ source: . url( keynote . youTubeURL)
63107 )
64108 )
65109 . disabled ( true )
66110 . frame ( height: 150 )
67111 . background ( Color ( . systemBackground) )
68112 . cornerRadius ( 12 )
69113 }
70- )
114+ . padding ( . horizontal)
115+ }
116+ } header: {
117+ self . playerView
118+ . frame ( height: 220 )
119+ . background ( Color ( . systemBackground) )
120+ . shadow (
121+ color: . black. opacity ( 0.1 ) ,
122+ radius: 46 ,
123+ x: 0 ,
124+ y: 15
125+ )
71126 }
72127 }
73- . padding ( )
74128 }
75- . navigationBarTitle ( " ο£Ώ WWDC Keynotes " )
76- . navigationBarItems (
77- trailing: Link (
78- destination: URL (
79- string: " https://github.com/SvenTiigi/YouTubePlayerKit "
80- ) !,
81- label: {
82- Image (
83- systemName: " play.rectangle.fill "
84- )
85- . imageScale ( . large)
86- }
87- )
88- )
129+ . navigationTitle ( " ο£Ώ WWDC Keynotes " )
89130 . background (
90131 Color (
91132 self . colorScheme == . dark
@@ -95,8 +136,61 @@ extension ContentView: View {
95136 )
96137 . scrollContentBackground ( . hidden)
97138 }
98- . edgesIgnoringSafeArea ( . bottom)
99- . navigationViewStyle ( StackNavigationViewStyle ( ) )
139+ . ignoresSafeArea ( edges: . bottom)
140+ }
141+
142+ }
143+ #endif
144+
145+ // MARK: - visionOS
146+
147+ #if os(visionOS)
148+ private extension ContentView {
149+
150+ /// The content and behavior of the view for the visionOS platform.
151+ var visionOSBody : some View {
152+ NavigationSplitView {
153+ List ( self . wwdcKeynotes, selection: self . $selectedKeynote) { wwdcKeynote in
154+ Text ( String ( wwdcKeynote. year) )
155+ . tag ( wwdcKeynote)
156+ }
157+ . listStyle ( . sidebar)
158+ . navigationTitle ( " ο£Ώ WWDC Keynotes " )
159+ } detail: {
160+ self . playerView
161+ . clipShape (
162+ RoundedRectangle (
163+ cornerRadius: 16 ,
164+ style: . continuous
165+ )
166+ )
167+ . padding ( )
168+ . toolbar ( . hidden)
169+ }
170+ }
171+
172+ }
173+ #endif
174+
175+ // MARK: - macOS
176+
177+ #if os(macOS)
178+ private extension ContentView {
179+
180+ /// The content and behavior of the view for the macOS platform.
181+ var macOSBody : some View {
182+ NavigationSplitView {
183+ List ( self . wwdcKeynotes, selection: self . $selectedKeynote) { wwdcKeynote in
184+ Text ( String ( wwdcKeynote. year) )
185+ . tag ( wwdcKeynote)
186+ }
187+ . listStyle ( . sidebar)
188+ . navigationTitle ( " ο£Ώ WWDC Keynotes " )
189+ } detail: {
190+ self . playerView
191+ . toolbar ( . hidden)
192+ }
100193 }
101194
102195}
196+ #endif
0 commit comments