diff --git a/app/src/main/java/app/myzel394/alibi/ui/components/CustomRecordingNotificationsScreen/atoms/EditNotificationInput.kt b/app/src/main/java/app/myzel394/alibi/ui/components/CustomRecordingNotificationsScreen/atoms/EditNotificationInput.kt new file mode 100644 index 0000000..1ae7f19 --- /dev/null +++ b/app/src/main/java/app/myzel394/alibi/ui/components/CustomRecordingNotificationsScreen/atoms/EditNotificationInput.kt @@ -0,0 +1,181 @@ +package app.myzel394.alibi.ui.components.CustomRecordingNotificationsScreen.atoms + +import androidx.compose.animation.core.animateFloatAsState +import androidx.compose.animation.core.tween +import androidx.compose.foundation.Image +import androidx.compose.foundation.background +import androidx.compose.foundation.layout.Arrangement +import androidx.compose.foundation.layout.Box +import androidx.compose.foundation.layout.Column +import androidx.compose.foundation.layout.Row +import androidx.compose.foundation.layout.height +import androidx.compose.foundation.layout.padding +import androidx.compose.foundation.layout.size +import androidx.compose.foundation.shape.CircleShape +import androidx.compose.foundation.shape.RoundedCornerShape +import androidx.compose.foundation.text.BasicTextField +import androidx.compose.foundation.text.KeyboardOptions +import androidx.compose.material.icons.Icons +import androidx.compose.material.icons.filled.Circle +import androidx.compose.material3.Icon +import androidx.compose.material3.MaterialTheme +import androidx.compose.material3.Text +import androidx.compose.material3.TextField +import androidx.compose.runtime.Composable +import androidx.compose.runtime.getValue +import androidx.compose.runtime.mutableStateOf +import androidx.compose.runtime.remember +import androidx.compose.runtime.setValue +import androidx.compose.ui.Alignment +import androidx.compose.ui.Modifier +import androidx.compose.ui.draw.alpha +import androidx.compose.ui.draw.clip +import androidx.compose.ui.graphics.Color +import androidx.compose.ui.graphics.ColorFilter +import androidx.compose.ui.graphics.SolidColor +import androidx.compose.ui.graphics.toArgb +import androidx.compose.ui.res.painterResource +import androidx.compose.ui.res.stringResource +import androidx.compose.ui.text.font.FontWeight +import androidx.compose.ui.text.input.ImeAction +import androidx.compose.ui.text.input.KeyboardType +import androidx.compose.ui.unit.dp +import app.myzel394.alibi.R +import app.myzel394.alibi.ui.effects.rememberForceUpdate +import com.maxkeppeler.sheets.input.models.InputText +import java.time.Duration +import java.time.LocalDateTime +import java.time.Period + +@Composable +fun EditNotificationInput( + modifier: Modifier = Modifier, + showOngoing: Boolean, + title: String, + description: String, + onShowOngoingChange: (Boolean) -> Unit, + onTitleChange: (String) -> Unit, + onDescriptionChange: (String) -> Unit, +) { + var ongoingStartTime by remember { mutableStateOf(LocalDateTime.now()) } + + val secondaryColor = MaterialTheme.colorScheme.onSurface.copy(alpha = 0.6f) + + Row( + modifier = Modifier + .clip(MaterialTheme.shapes.medium) + .background(MaterialTheme.colorScheme.surfaceVariant.copy(alpha = 0.6f)) + .padding(16.dp) + .then(modifier), + verticalAlignment = Alignment.Top, + horizontalArrangement = Arrangement.spacedBy(16.dp), + ) { + val headlineSize = 22.dp + + Box( + modifier = Modifier + .size(headlineSize) + .clip(CircleShape) + .background(MaterialTheme.colorScheme.secondary) + .padding(1.dp), + ) { + Image( + painter = painterResource(id = R.drawable.launcher_foreground), + contentDescription = null, + colorFilter = ColorFilter.tint(MaterialTheme.colorScheme.onPrimary), + ) + } + Column( + horizontalAlignment = Alignment.Start, + verticalArrangement = Arrangement.spacedBy(16.dp), + ) { + Row( + verticalAlignment = Alignment.CenterVertically, + horizontalArrangement = Arrangement.spacedBy(6.dp), + modifier = Modifier.height(headlineSize), + ) { + Text( + stringResource(R.string.app_name), + style = MaterialTheme.typography.bodySmall, + color = secondaryColor, + ) + if (showOngoing) { + Icon( + Icons.Default.Circle, + contentDescription = null, + tint = secondaryColor, + modifier = Modifier + .size(8.dp) + ) + + val fakeAlpha = rememberForceUpdate() + val formattedTime = { + val difference = + Duration.between( + ongoingStartTime, + LocalDateTime.now(), + ) + val minutes = difference.toMinutes() + val seconds = difference.minusMinutes(minutes).seconds + + "${if (minutes < 10) "0$minutes" else minutes}:${if (seconds < 10) "0$seconds" else seconds}" + } + Text( + formattedTime(), + modifier = Modifier.alpha(fakeAlpha), + style = MaterialTheme.typography.bodySmall, + color = secondaryColor, + ) + } + } + Column( + verticalArrangement = Arrangement.spacedBy(6.dp), + ) { + BasicTextField( + value = title, + onValueChange = onTitleChange, + textStyle = MaterialTheme.typography.titleMedium.copy( + fontWeight = FontWeight.Bold, + color = MaterialTheme.colorScheme.onSurfaceVariant, + ), + cursorBrush = SolidColor(MaterialTheme.colorScheme.onSurfaceVariant), + singleLine = true, + keyboardOptions = KeyboardOptions( + keyboardType = KeyboardType.Text, + imeAction = ImeAction.Next, + ), + ) + BasicTextField( + value = description, + onValueChange = onDescriptionChange, + textStyle = MaterialTheme.typography.bodyMedium.copy( + fontWeight = FontWeight.Bold, + color = MaterialTheme.colorScheme.onSurfaceVariant, + ), + cursorBrush = SolidColor(MaterialTheme.colorScheme.onSurfaceVariant), + singleLine = true, + keyboardOptions = KeyboardOptions( + keyboardType = KeyboardType.Text, + imeAction = ImeAction.Done, + ), + ) + } + Row( + horizontalArrangement = Arrangement.spacedBy(16.dp), + ) { + Text( + stringResource(R.string.ui_audioRecorder_action_delete_label), + color = MaterialTheme.colorScheme.secondary, + fontSize = MaterialTheme.typography.bodyMedium.fontSize, + fontWeight = FontWeight.Bold, + ) + Text( + stringResource(R.string.ui_audioRecorder_action_pause_label), + color = MaterialTheme.colorScheme.secondary, + fontSize = MaterialTheme.typography.bodyMedium.fontSize, + fontWeight = FontWeight.Bold, + ) + } + } + } +} \ No newline at end of file diff --git a/app/src/main/java/app/myzel394/alibi/ui/effects/force-update.kt b/app/src/main/java/app/myzel394/alibi/ui/effects/force-update.kt new file mode 100644 index 0000000..be81a62 --- /dev/null +++ b/app/src/main/java/app/myzel394/alibi/ui/effects/force-update.kt @@ -0,0 +1,23 @@ +package app.myzel394.alibi.ui.effects + +import androidx.compose.runtime.Composable +import androidx.compose.runtime.LaunchedEffect +import androidx.compose.runtime.getValue +import androidx.compose.runtime.mutableStateOf +import androidx.compose.runtime.saveable.rememberSaveable +import androidx.compose.runtime.setValue +import kotlinx.coroutines.delay + +@Composable +fun rememberForceUpdate( + time: Long = 100L, +): Float { + var tickTack by rememberSaveable { mutableStateOf(1f) } + + LaunchedEffect(tickTack) { + delay(time) + tickTack = if (tickTack == 1f) 0.99f else 1f + } + + return tickTack +} \ No newline at end of file diff --git a/app/src/main/java/app/myzel394/alibi/ui/screens/CustomRecordingNotificationsScreen.kt b/app/src/main/java/app/myzel394/alibi/ui/screens/CustomRecordingNotificationsScreen.kt index 908b4db..3dd8bcd 100644 --- a/app/src/main/java/app/myzel394/alibi/ui/screens/CustomRecordingNotificationsScreen.kt +++ b/app/src/main/java/app/myzel394/alibi/ui/screens/CustomRecordingNotificationsScreen.kt @@ -38,6 +38,7 @@ import app.myzel394.alibi.R import app.myzel394.alibi.dataStore import app.myzel394.alibi.db.AppSettings import app.myzel394.alibi.ui.SUPPORTS_DARK_MODE_NATIVELY +import app.myzel394.alibi.ui.components.CustomRecordingNotificationsScreen.atoms.EditNotificationInput import app.myzel394.alibi.ui.components.CustomRecordingNotificationsScreen.atoms.LandingElement import app.myzel394.alibi.ui.components.SettingsScreen.atoms.BitrateTile import app.myzel394.alibi.ui.components.SettingsScreen.atoms.CustomNotificationTile @@ -91,10 +92,24 @@ fun CustomRecordingNotificationsScreen( .nestedScroll(scrollBehavior.nestedScrollConnection) ) { padding -> if (settings.notificationSettings == null) { - LandingElement( + } + Box( + modifier = Modifier + .padding(padding) + .padding(vertical = 64.dp) + ) { + EditNotificationInput( modifier = Modifier - .padding(padding), + .fillMaxWidth() + .padding(horizontal = 16.dp), + showOngoing = true, + title = "Alibi", + description = "test", + onShowOngoingChange = {}, + onTitleChange = {}, + onDescriptionChange = {}, ) + } } } \ No newline at end of file