Skip to content

Commit

Permalink
Increase song overlay menu buttons size
Browse files Browse the repository at this point in the history
  • Loading branch information
@toasterofbread
toasterofbread committed Jul 31, 2024
1 parent c4bbb83 commit a9f2fa3
Showing 1 changed file with 117 additions and 90 deletions.
207 changes: 117 additions & 90 deletions ...commonMain/kotlin/com/toasterofbread/spmp/ui/layout/nowplaying/overlay/MainOverlayMenu.kt
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,12 +3,14 @@ package com.toasterofbread.spmp.ui.layout.nowplaying.overlay
import LocalPlayerState
import androidx.compose.animation.Crossfade
import androidx.compose.animation.core.Animatable
import androidx.compose.animation.core.AnimationVector1D
import androidx.compose.foundation.background
import androidx.compose.foundation.clickable
import androidx.compose.foundation.interaction.MutableInteractionSource
import androidx.compose.foundation.layout.*
import androidx.compose.foundation.rememberScrollState
import androidx.compose.foundation.shape.CircleShape
import androidx.compose.foundation.shape.RoundedCornerShape
import androidx.compose.foundation.text.KeyboardActions
import androidx.compose.foundation.text.KeyboardOptions
import androidx.compose.foundation.verticalScroll
Expand All @@ -18,15 +20,16 @@ import androidx.compose.material3.*
import androidx.compose.runtime.*
import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.graphics.ImageBitmap
import androidx.compose.ui.graphics.Shape
import androidx.compose.ui.text.input.ImeAction
import androidx.compose.ui.unit.Dp
import androidx.compose.ui.unit.dp
import dev.toastbits.composekit.utils.composable.OnChangedEffect
import com.toasterofbread.spmp.model.mediaitem.MEDIA_ITEM_RELATED_CONTENT_ICON
import com.toasterofbread.spmp.model.mediaitem.artist.Artist
import com.toasterofbread.spmp.model.mediaitem.db.observePlayCount
import com.toasterofbread.spmp.model.mediaitem.enums.MediaItemType
import com.toasterofbread.spmp.model.mediaitem.song.Song
import com.toasterofbread.spmp.platform.download.PlayerDownloadManager
Expand Down Expand Up @@ -63,7 +66,7 @@ class MainPlayerOverlayMenu(

val song_artists: List<Artist>? by song.Artists.observe(player.database)

val download_progress = remember { Animatable(0f) }
val download_progress: Animatable<Float, AnimationVector1D> = remember { Animatable(0f) }
var download_progress_target: Float by remember { mutableStateOf(0f) }
var download_status: DownloadStatus? by remember { mutableStateOf(null) }

Expand Down Expand Up @@ -128,8 +131,28 @@ class MainPlayerOverlayMenu(
}

var song_title: String? by song.observeActiveTitle()

var edited_song_title by remember(song) { mutableStateOf(song_title ?: "") }

Row(Modifier.fillMaxWidth(), horizontalArrangement = Arrangement.spacedBy(10.dp, Alignment.End)) {
Box(
button_modifier.clickable {
edited_song_title = song.Title.get(player.database) ?: ""
},
contentAlignment = Alignment.Center
) {
Icon(Icons.Filled.Refresh, null, tint = button_colour)
}

Box(
button_modifier.clickable {
song.CustomTitle.set(edited_song_title, player.database)
},
contentAlignment = Alignment.Center
) {
Icon(Icons.Filled.Done, null, tint = button_colour)
}
}

OutlinedTextField(
edited_song_title,
onValueChange = { text ->
Expand Down Expand Up @@ -161,114 +184,118 @@ class MainPlayerOverlayMenu(
.appTextField()
)

Row(Modifier.fillMaxWidth(), horizontalArrangement = Arrangement.spacedBy(10.dp, Alignment.End)) {
Box(
button_modifier.clickable {
edited_song_title = song.Title.get(player.database) ?: ""
},
contentAlignment = Alignment.Center
) {
Icon(Icons.Filled.Refresh, null, tint = button_colour)
}
// Spacer(Modifier.fillMaxHeight().weight(1f))

Box(
button_modifier.clickable {
song.CustomTitle.set(edited_song_title, player.database)
},
contentAlignment = Alignment.Center
) {
Icon(Icons.Filled.Done, null, tint = button_colour)
}
}
// val play_count: Int = song.observePlayCount(player.context) ?: 0
// Text(getString("mediaitem_play_count_\$x_short").replace("\$x", play_count.toString()))

MenuButtons(getSong, download_status, download_progress, Modifier.fillMaxSize().weight(1f))
}
}

Spacer(Modifier.fillMaxHeight().weight(1f))
@Composable
private fun MenuButtons(
getSong: () -> Song?,
download_status: DownloadStatus?,
download_progress: Animatable<Float, AnimationVector1D>,
modifier: Modifier = Modifier
) {
val player: PlayerState = LocalPlayerState.current

val play_count: Int = song.observePlayCount(player.context) ?: 0
Text(getString("mediaitem_play_count_\$x_short").replace("\$x", play_count.toString()))
val button_content_colour: Color = player.theme.on_accent

Row(
Modifier.fillMaxWidth(),
horizontalArrangement = Arrangement.SpaceEvenly
Row(
modifier.fillMaxWidth(),
horizontalArrangement = Arrangement.spacedBy(5.dp, Alignment.CenterHorizontally),
verticalAlignment = Alignment.CenterVertically
) {
val button_shape: Shape = RoundedCornerShape(15.dp)
val button_modifier: Modifier =
Modifier
.aspectRatio(1f)
.fillMaxSize()
.weight(1f)
.background(player.theme.accent, button_shape)
.clip(button_shape)

Box(
button_modifier
.clickable {
setPlayerOverlayMenu(
SongThemePlayerOverlayMenu(
requestColourPicker,
onColourSelected
)
)
},
contentAlignment = Alignment.Center
) {
Icon(Icons.Filled.Palette, null, tint = button_content_colour)
}

Box(
button_modifier
.clickable {
setPlayerOverlayMenu(getLyricsMenu())
},
contentAlignment = Alignment.Center
) {
Icon(Icons.Filled.MusicNote, null, tint = button_content_colour)
}

val related_endpoint = player.context.ytapi.SongRelatedContent.implementedOrNull()
if (related_endpoint != null) {
Box(
button_modifier
.clickable {
setPlayerOverlayMenu(
SongThemePlayerOverlayMenu(
requestColourPicker,
onColourSelected
)
)
.clickable(
remember { MutableInteractionSource() },
null
) {
setPlayerOverlayMenu(RelatedContentPlayerOverlayMenu(related_endpoint))
},
contentAlignment = Alignment.Center
) {
Icon(Icons.Filled.Palette, null, tint = button_colour)
Icon(MEDIA_ITEM_RELATED_CONTENT_ICON, null, tint = button_content_colour)
}
}

Box(button_modifier, contentAlignment = Alignment.Center) {
Box(
button_modifier
Modifier
.align(Alignment.Center)
.fillMaxSize()
.clickable {
setPlayerOverlayMenu(getLyricsMenu())
val song: Song = getSong() ?: return@clickable
if (download_status?.status != DownloadStatus.Status.FINISHED && download_status?.status != DownloadStatus.Status.ALREADY_FINISHED) {
player.onSongDownloadRequested(song)
}
},
contentAlignment = Alignment.Center
) {
Icon(Icons.Filled.MusicNote, null, tint = button_colour)
}

val related_endpoint = player.context.ytapi.SongRelatedContent.implementedOrNull()
if (related_endpoint != null) {
Box(
button_modifier
.clickable(
remember { MutableInteractionSource() },
null
) {
setPlayerOverlayMenu(RelatedContentPlayerOverlayMenu(related_endpoint))
},
contentAlignment = Alignment.Center
) {
Icon(MEDIA_ITEM_RELATED_CONTENT_ICON, null, tint = button_colour)
}
}

Box(contentAlignment = Alignment.Center) {
Box(
button_modifier
.align(Alignment.Center)
.fillMaxSize()
.clickable {
val song: Song = getSong() ?: return@clickable
if (download_status?.status != DownloadStatus.Status.FINISHED && download_status?.status != DownloadStatus.Status.ALREADY_FINISHED) {
player.onSongDownloadRequested(song)
}
},
contentAlignment = Alignment.Center
) {
Icon(Icons.Filled.Download, null, Modifier.align(Alignment.Center), tint = button_colour)
Crossfade(
when (download_status?.status) {
DownloadStatus.Status.PAUSED -> Icons.Filled.Pause
DownloadStatus.Status.FINISHED, DownloadStatus.Status.ALREADY_FINISHED -> Icons.Filled.Done
DownloadStatus.Status.CANCELLED -> Icons.Filled.Cancel
else -> null
}
) { icon ->
if (icon != null) {
val offset = button_size * 0.2f
Icon(icon, null,
Modifier
.size(10.dp)
.offset(offset, offset)
.background(button_colour, CircleShape), tint = player.theme.accent)
}
Icon(Icons.Filled.Download, null, Modifier.align(Alignment.Center), tint = button_content_colour)
Crossfade(
when (download_status?.status) {
DownloadStatus.Status.PAUSED -> Icons.Filled.Pause
DownloadStatus.Status.FINISHED, DownloadStatus.Status.ALREADY_FINISHED -> Icons.Filled.Done
DownloadStatus.Status.CANCELLED -> Icons.Filled.Cancel
else -> null
}
) { icon ->
if (icon != null) {
Icon(icon, null,
Modifier
.size(10.dp)
.offset(9.dp, 9.dp)
.background(button_content_colour, CircleShape), tint = player.theme.accent)
}
}
}

if (download_status?.status == DownloadStatus.Status.DOWNLOADING || download_status?.status == DownloadStatus.Status.PAUSED) {
CircularProgressIndicator(download_progress.value, Modifier.size(button_size), color = button_colour, strokeWidth = 2.dp)
}
if (download_status?.status == DownloadStatus.Status.DOWNLOADING || download_status?.status == DownloadStatus.Status.PAUSED) {
CircularProgressIndicator({ download_progress.value }, Modifier.fillMaxSize(), color = button_content_colour, strokeWidth = 2.dp)
}
}
}
}
}
}

0 comments on commit a9f2fa3

Please sign in to comment.