Reorganize toolbars placement

This commit is contained in:
Arkadiusz Fal
2022-02-04 18:38:29 +01:00
parent 249c7ca7fa
commit 9868a2ef01
9 changed files with 197 additions and 152 deletions

View File

@@ -53,7 +53,43 @@ struct PlaylistsView: View {
}
var body: some View {
PlayerControlsView {
PlayerControlsView(toolbar: {
HStack {
HStack {
newPlaylistButton
.offset(x: -10)
if currentPlaylist != nil {
editPlaylistButton
}
}
if !model.isEmpty {
Spacer()
}
HStack {
if model.isEmpty {
Text("No Playlists")
.foregroundColor(.secondary)
} else {
selectPlaylistButton
.transaction { t in t.animation = .none }
}
}
Spacer()
if currentPlaylist != nil {
HStack(spacing: 0) {
playButton
shuffleButton
}
.offset(x: 10)
}
}
.padding(.horizontal)
}) {
SignInRequiredView(title: "Playlists") {
VStack {
#if os(tvOS)
@@ -72,6 +108,7 @@ struct PlaylistsView: View {
Spacer()
#else
VerticalCells(items: items)
.environment(\.scrollViewBottomPadding, 70)
#endif
}
.environment(\.currentPlaylistID, currentPlaylist?.id)
@@ -79,6 +116,18 @@ struct PlaylistsView: View {
}
}
}
.onAppear {
model.load()
}
.onChange(of: accounts.current) { _ in
model.load(force: true)
}
.onChange(of: selectedPlaylistID) { _ in
resource?.load()
}
.onChange(of: model.reloadPlaylists) { _ in
resource?.load()
}
#if os(tvOS)
.fullScreenCover(isPresented: $showingNewPlaylist, onDismiss: selectCreatedPlaylist) {
PlaylistFormView(playlist: $createdPlaylist)
@@ -88,74 +137,25 @@ struct PlaylistsView: View {
PlaylistFormView(playlist: $editedPlaylist)
.environmentObject(accounts)
}
.focusScope(focusNamespace)
#else
.background(
EmptyView()
.sheet(isPresented: $showingNewPlaylist, onDismiss: selectCreatedPlaylist) {
PlaylistFormView(playlist: $createdPlaylist)
.environmentObject(accounts)
}
)
.background(
EmptyView()
.sheet(isPresented: $showingEditPlaylist, onDismiss: selectEditedPlaylist) {
PlaylistFormView(playlist: $editedPlaylist)
.environmentObject(accounts)
}
)
.background(
EmptyView()
.sheet(isPresented: $showingNewPlaylist, onDismiss: selectCreatedPlaylist) {
PlaylistFormView(playlist: $createdPlaylist)
.environmentObject(accounts)
}
)
.background(
EmptyView()
.sheet(isPresented: $showingEditPlaylist, onDismiss: selectEditedPlaylist) {
PlaylistFormView(playlist: $editedPlaylist)
.environmentObject(accounts)
}
)
#endif
.toolbar {
#if os(iOS)
ToolbarItemGroup(placement: .bottomBar) {
Group {
if model.isEmpty {
Text("No Playlists")
.foregroundColor(.secondary)
} else {
selectPlaylistButton
.transaction { t in t.animation = .none }
}
Spacer()
if currentPlaylist != nil {
HStack(spacing: 10) {
playButton
shuffleButton
}
Spacer()
}
HStack(spacing: 2) {
newPlaylistButton
if currentPlaylist != nil {
editPlaylistButton
}
}
}
}
#endif
}
#if os(tvOS)
.focusScope(focusNamespace)
#endif
.onAppear {
model.load()
resource?.load()
}
.onChange(of: accounts.current) { _ in
model.load(force: true)
}
.onChange(of: selectedPlaylistID) { _ in
resource?.load()
}
.onChange(of: model.reloadPlaylists) { _ in
resource?.load()
}
#if os(iOS)
.navigationBarTitleDisplayMode(RefreshControl.navigationBarTitleDisplayMode)
.navigationBarTitleDisplayMode(RefreshControl.navigationBarTitleDisplayMode)
#endif
}
@@ -261,7 +261,7 @@ struct PlaylistsView: View {
}
} label: {
Text(currentPlaylist?.title ?? "Select playlist")
.frame(maxWidth: 140, alignment: .leading)
.frame(maxWidth: 140, alignment: .center)
}
#endif
}
@@ -272,16 +272,17 @@ struct PlaylistsView: View {
self.showingEditPlaylist = true
}) {
HStack(spacing: 8) {
Image(systemName: "slider.horizontal.3")
Text("Edit")
Image(systemName: "rectangle.and.pencil.and.ellipsis")
}
}
}
var newPlaylistButton: some View {
Button(action: { self.showingNewPlaylist = true }) {
HStack(spacing: 8) {
HStack(spacing: 0) {
Image(systemName: "plus")
.padding(8)
.contentShape(Rectangle())
#if os(tvOS)
Text("New Playlist")
#endif
@@ -294,6 +295,8 @@ struct PlaylistsView: View {
player.play(items.compactMap(\.video))
} label: {
Image(systemName: "play")
.padding(8)
.contentShape(Rectangle())
}
}
@@ -302,6 +305,8 @@ struct PlaylistsView: View {
player.play(items.compactMap(\.video), shuffling: true)
} label: {
Image(systemName: "shuffle")
.padding(8)
.contentShape(Rectangle())
}
}