Improved Example app

Example/Example.xcodeproj/project.pbxproj

@@ -3,7 +3,7 @@
 	archiveVersion = 1;
 	classes = {
 	};
-	objectVersion = 52;
+	objectVersion = 54;
 	objects = {
 
 /* Begin PBXBuildFile section */
@@ -212,7 +212,7 @@
 				GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE;
 				GCC_WARN_UNUSED_FUNCTION = YES;
 				GCC_WARN_UNUSED_VARIABLE = YES;
-				IPHONEOS_DEPLOYMENT_TARGET = 16.0;
+				IPHONEOS_DEPLOYMENT_TARGET = 17.0;
 				MTL_ENABLE_DEBUG_INFO = INCLUDE_SOURCE;
 				MTL_FAST_MATH = YES;
 				ONLY_ACTIVE_ARCH = YES;
@@ -267,7 +267,7 @@
 				GCC_WARN_UNINITIALIZED_AUTOS = YES_AGGRESSIVE;
 				GCC_WARN_UNUSED_FUNCTION = YES;
 				GCC_WARN_UNUSED_VARIABLE = YES;
-				IPHONEOS_DEPLOYMENT_TARGET = 16.0;
+				IPHONEOS_DEPLOYMENT_TARGET = 17.0;
 				MTL_ENABLE_DEBUG_INFO = NO;
 				MTL_FAST_MATH = YES;
 				SDKROOT = iphoneos;
@@ -287,16 +287,20 @@
 				DEVELOPMENT_TEAM = "";
 				ENABLE_PREVIEWS = YES;
 				INFOPLIST_FILE = Example/Resources/Info.plist;
-				IPHONEOS_DEPLOYMENT_TARGET = 16.0;
+				IPHONEOS_DEPLOYMENT_TARGET = 17.0;
 				LD_RUNPATH_SEARCH_PATHS = (
 					"$(inherited)",
 					"@executable_path/Frameworks",
 				);
 				PRODUCT_BUNDLE_IDENTIFIER = de.tiigi.YouTubePlayerKit.Example;
 				PRODUCT_NAME = "$(TARGET_NAME)";
 				PROVISIONING_PROFILE_SPECIFIER = "";
+				SUPPORTED_PLATFORMS = "iphoneos iphonesimulator macosx xros xrsimulator";
+				SUPPORTS_MACCATALYST = NO;
+				SUPPORTS_MAC_DESIGNED_FOR_IPHONE_IPAD = NO;
+				SUPPORTS_XR_DESIGNED_FOR_IPHONE_IPAD = NO;
 				SWIFT_VERSION = 5.0;
-				TARGETED_DEVICE_FAMILY = "1,2";
+				TARGETED_DEVICE_FAMILY = "1,2,7";
 			};
 			name = Debug;
 		};
@@ -310,16 +314,20 @@
 				DEVELOPMENT_TEAM = "";
 				ENABLE_PREVIEWS = YES;
 				INFOPLIST_FILE = Example/Resources/Info.plist;
-				IPHONEOS_DEPLOYMENT_TARGET = 16.0;
+				IPHONEOS_DEPLOYMENT_TARGET = 17.0;
 				LD_RUNPATH_SEARCH_PATHS = (
 					"$(inherited)",
 					"@executable_path/Frameworks",
 				);
 				PRODUCT_BUNDLE_IDENTIFIER = de.tiigi.YouTubePlayerKit.Example;
 				PRODUCT_NAME = "$(TARGET_NAME)";
 				PROVISIONING_PROFILE_SPECIFIER = "";
+				SUPPORTED_PLATFORMS = "iphoneos iphonesimulator macosx xros xrsimulator";
+				SUPPORTS_MACCATALYST = NO;
+				SUPPORTS_MAC_DESIGNED_FOR_IPHONE_IPAD = NO;
+				SUPPORTS_XR_DESIGNED_FOR_IPHONE_IPAD = NO;
 				SWIFT_VERSION = 5.0;
-				TARGETED_DEVICE_FAMILY = "1,2";
+				TARGETED_DEVICE_FAMILY = "1,2,7";
 			};
 			name = Release;
 		};

Example/Example/App.swift

@@ -1,10 +1,3 @@
-//
-//  App.swift
-//  Example
-//
-//  Created by Sven Tiigi on 20.09.21.
-//
-
 import SwiftUI
 
 // MARK: - App

Example/Example/ContentView.swift

@@ -1,10 +1,3 @@
-//
-//  ContentView.swift
-//  Example
-//
-//  Created by Sven Tiigi on 20.09.21.
-//
-
 import SwiftUI
 import YouTubePlayerKit
 
@@ -13,16 +6,29 @@ import YouTubePlayerKit
 /// The ContentView
 struct ContentView {
 
-    /// All  WWDC Keynotes
-    private let wwdcKeynotes: [WWDCKeynote] = WWDCKeynote.all.sorted(by: >)
+    /// All  WWDC Keynotes.
+    private let wwdcKeynotes = WWDCKeynote.all.sorted(by: >)
+
+    /// The selected WWDC keynote.
+    @State
+    private var selectedKeynote: WWDCKeynote? = .wwdc2023
 
-    /// The YouTube Player
+    /// The YouTube Player.
     @StateObject
     private var youTubePlayer = YouTubePlayer(
-        source: .url(WWDCKeynote.wwdc2022.youTubeURL)
+        source: .url(WWDCKeynote.wwdc2023.youTubeURL),
+        configuration: .init(
+            fullscreenMode: {
+                #if os(macOS) || os(visionOS)
+                .web
+                #else
+                .system
+                #endif
+            }()
+        )
     )
 
-    /// The color scheme
+    /// The color scheme.
     @Environment(\.colorScheme)
     private var colorScheme
 
@@ -32,60 +38,95 @@ struct ContentView {
 
 extension ContentView: View {
 
-    /// The content and behavior of the view
+    /// The content and behavior of the view.
     var body: some View {
-        NavigationView {
-            ScrollView {
-                YouTubePlayerView(
-                    self.youTubePlayer,
-                    placeholderOverlay: {
-                        ProgressView()
-                    }
-                )
-                .frame(height: 220)
-                .background(Color(.systemBackground))
-                .shadow(
-                    color: .black.opacity(0.1),
-                    radius: 46,
-                    x: 0,
-                    y: 15
+        Group {
+            #if os(macOS)
+            self.macOSBody
+            #elseif os(visionOS)
+            self.visionOSBody
+            #else
+            self.iOSBody
+            #endif
+        }
+        .onChange(of: self.selectedKeynote) { _, keynote in
+            guard let keynote else {
+                return self.youTubePlayer.stop()
+            }
+            self.youTubePlayer.cue(source: .url(keynote.youTubeURL))
+        }
+    }
+
+}
+
+// MARK: - Player
+
+private extension ContentView {
+
+    /// The content and behavior of the YouTube player view.
+    var playerView: some View {
+        YouTubePlayerView(self.youTubePlayer) { state in
+            switch state {
+            case .idle:
+                ProgressView()
+            case .ready:
+                EmptyView()
+            case .error:
+                Label(
+                    "An error occurred.",
+                    systemImage: "xmark.circle.fill"
                 )
-                VStack(spacing: 20) {
-                    ForEach(self.wwdcKeynotes) { wwdcKeynote in
-                        Button(
-                            action: {
-                                self.youTubePlayer.source = .url(wwdcKeynote.youTubeURL)
-                            },
-                            label: {
+                .foregroundStyle(.red)
+            }
+        }
+    }
+
+}
+
+// MARK: - iOS
+
+#if os(iOS)
+private extension ContentView {
+
+    /// The content and behavior of the view for the iOS platform.
+    var iOSBody: some View {
+        NavigationStack {
+            ScrollView {
+                LazyVStack(
+                    spacing: 20,
+                    pinnedViews: [.sectionHeaders]
+                ) {
+                    Section {
+                        ForEach(self.wwdcKeynotes) { keynote in
+                            Button {
+                                self.selectedKeynote = keynote
+                            } label: {
                                 YouTubePlayerView(
                                     .init(
-                                        source: .url(wwdcKeynote.youTubeURL)
+                                        source: .url(keynote.youTubeURL)
                                     )
                                 )
                                 .disabled(true)
                                 .frame(height: 150)
                                 .background(Color(.systemBackground))
                                 .cornerRadius(12)
                             }
-                        )
+                            .padding(.horizontal)
+                        }
+                    } header: {
+                        self.playerView
+                            .frame(height: 220)
+                            .background(Color(.systemBackground))
+                            .shadow(
+                                color: .black.opacity(0.1),
+                                radius: 46,
+                                x: 0,
+                                y: 15
+                            )
                     }
                 }
-                .padding()
             }
-            .navigationBarTitle(" WWDC Keynotes")
-            .navigationBarItems(
-                trailing: Link(
-                    destination: URL(
-                        string: "https://github.com/SvenTiigi/YouTubePlayerKit"
-                    )!,
-                    label: {
-                        Image(
-                            systemName: "play.rectangle.fill"
-                        )
-                        .imageScale(.large)
-                    }
-                )
-            )
+            .navigationTitle(" WWDC Keynotes")
             .background(
                 Color(
                     self.colorScheme == .dark
@@ -95,8 +136,61 @@ extension ContentView: View {
             )
             .scrollContentBackground(.hidden)
         }
-        .edgesIgnoringSafeArea(.bottom)
-        .navigationViewStyle(StackNavigationViewStyle())
+        .ignoresSafeArea(edges: .bottom)
+    }
+
+}
+#endif
+
+// MARK: - visionOS
+
+#if os(visionOS)
+private extension ContentView {
+
+    /// The content and behavior of the view for the visionOS platform.
+    var visionOSBody: some View {
+        NavigationSplitView {
+            List(self.wwdcKeynotes, selection: self.$selectedKeynote) { wwdcKeynote in
+                Text(String(wwdcKeynote.year))
+                    .tag(wwdcKeynote)
+            }
+            .listStyle(.sidebar)
+            .navigationTitle(" WWDC Keynotes")
+        } detail: {
+            self.playerView
+                .clipShape(
+                    RoundedRectangle(
+                        cornerRadius: 16,
+                        style: .continuous
+                    )
+                )
+                .padding()
+                .toolbar(.hidden)
+        }
+    }
+
+}
+#endif
+
+// MARK: - macOS
+
+#if os(macOS)
+private extension ContentView {
+
+    /// The content and behavior of the view for the macOS platform.
+    var macOSBody: some View {
+        NavigationSplitView {
+            List(self.wwdcKeynotes, selection: self.$selectedKeynote) { wwdcKeynote in
+                Text(String(wwdcKeynote.year))
+                    .tag(wwdcKeynote)
+            }
+            .listStyle(.sidebar)
+            .navigationTitle(" WWDC Keynotes")
+        } detail: {
+            self.playerView
+                .toolbar(.hidden)
+        }
     }
 
 }
+#endif