Added Light Theme

README.md

@@ -58,7 +58,7 @@
 - [ ] More tag fields edit
 - [ ] Make resizable window
 - [ ] Playlist feature
-- [ ] Light Theme
+- [x] Light Theme
 
 ### Libraries
 

src/main/kotlin/Plaudio.kt

@@ -1,6 +1,9 @@
 import androidx.compose.material.MaterialTheme
 import androidx.compose.runtime.Composable
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.snapshots.SnapshotStateList
 import androidx.compose.ui.ExperimentalComposeUiApi
+import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.input.key.Key
 import androidx.compose.ui.input.key.KeyEventType
 import androidx.compose.ui.input.key.key
@@ -13,11 +16,14 @@ import androidx.compose.ui.window.WindowState
 import androidx.compose.ui.window.application
 import core.CorePlayer
 import core.db.CoreDB
+import core.db.models.ModelAudio
+import core.db.models.ModelFolder
 import routing.routingGraph
 import ru.alexgladkov.odyssey.compose.setup.OdysseyConfiguration
 import ru.alexgladkov.odyssey.compose.setup.setNavigationContent
 import theme.ColorBox
 import theme.Fonts
+import utils.Prefs
 import utils.Tools
 import java.awt.Dimension
 import java.io.File
@@ -27,6 +33,19 @@ object CenterState {
 
     var hasAnyTextFieldFocus = false
 
+    val audioList = ArrayList<ModelAudio>().apply {
+        addAll(CoreDB.Audios.read())
+    }
+    val filteredAudioList = SnapshotStateList<ModelAudio>().apply {
+        addAll(audioList)
+    }
+    val folderList = SnapshotStateList<ModelFolder>().apply {
+        addAll(CoreDB.Folders.read())
+    }
+
+    /*states*/
+    var currentFolder = mutableStateOf(ModelFolder(childCunt = audioList.size))
+
 }
 
 @Composable
@@ -41,12 +60,12 @@ fun App() {
     MaterialTheme(
         typography = Fonts.typography,
         colors = MaterialTheme.colors.copy(
-            isLight = false,
+            isLight = !ColorBox.isDarkMode,
             surface = ColorBox.card,
             primary = ColorBox.primary
         )
     ) {
-        setNavigationContent(OdysseyConfiguration(backgroundColor = ColorBox.primaryDark), onApplicationFinish = {}) {
+        setNavigationContent(OdysseyConfiguration(backgroundColor = if (Prefs.isDarkMode) Color.Black else Color.White), onApplicationFinish = {}) {
             routingGraph()
         }
     }

src/main/kotlin/components/menu/CustomPopup.kt

@@ -1,7 +1,6 @@
 package components.menu
 
 import androidx.compose.animation.core.*
-import androidx.compose.foundation.background
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.interaction.MutableInteractionSource
 import androidx.compose.foundation.layout.*
@@ -12,7 +11,6 @@ import androidx.compose.material.Card
 import androidx.compose.runtime.*
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.focus.FocusManager
-import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.TransformOrigin
 import androidx.compose.ui.graphics.graphicsLayer
 import androidx.compose.ui.input.InputModeManager

src/main/kotlin/components/menu/HomeAppbarPopup.kt

@@ -1,6 +1,7 @@
 package components.menu
 
 import androidx.compose.runtime.Composable
+import utils.Prefs
 
 @Composable
 fun HomeAppbarPopup(
@@ -13,12 +14,15 @@ fun HomeAppbarPopup(
         expanded = show,
         onDismissRequest = onDismissRequest
     ) {
-        MenuItem("icons/refresh.svg","ReSync Audios (WIP)") {
+        MenuItem(if (Prefs.isDarkMode) "icons/sun.svg" else "icons/moon.svg",if (Prefs.isDarkMode) "Light Mode" else "Dark Mode") {
             callback.invoke(0)
         }
-        MenuItem("icons/info.svg","About") {
+        MenuItem("icons/refresh.svg","ReSync Audios (WIP)") {
             callback.invoke(1)
         }
+        MenuItem("icons/info.svg","About") {
+            callback.invoke(2)
+        }
     }
 
 }

src/main/kotlin/routing/ScreenHome.kt

@@ -1,10 +1,13 @@
 package routing
 
+import CenterState.audioList
+import CenterState.currentFolder
+import CenterState.filteredAudioList
+import CenterState.folderList
 import androidx.compose.runtime.*
 import androidx.compose.runtime.snapshots.SnapshotStateList
 import components.CustomScaffold
 import components.rememberCustomOCState
-import core.db.CoreDB
 import core.db.models.ModelAudio
 import core.db.models.ModelFolder
 import kotlinx.coroutines.launch
@@ -17,18 +20,6 @@ import theme.ColorBox
 @Composable
 fun ScreenHome() {
 
-    val audioList = ArrayList<ModelAudio>().apply {
-        addAll(CoreDB.Audios.read())
-    }
-    val filteredAudioList = SnapshotStateList<ModelAudio>().apply {
-        addAll(audioList)
-    }
-    val folderList = SnapshotStateList<ModelFolder>().apply {
-        addAll(CoreDB.Folders.read())
-    }
-
-    /*states*/
-    var currentFolder by remember { mutableStateOf(ModelFolder(childCunt = audioList.size)) }
     var currentSearchKeyword by remember { mutableStateOf("") }
 
     val scope = rememberCoroutineScope()
@@ -43,7 +34,7 @@ fun ScreenHome() {
         drawerBackgroundColor = ColorBox.primaryDark2,
         appbarBackgroundColor = ColorBox.primaryDark,
         appbarContent = {
-            Appbar(currentFolder, onSearchClicked = {
+            Appbar(currentFolder.value, onSearchClicked = {
                 scope.launch {
                     drawerState.close()
                     searchState.open()
@@ -59,9 +50,9 @@ fun ScreenHome() {
 
                     val newChildCount = if (isFav) folderList[1].childCunt + 1 else folderList[1].childCunt - 1
                     folderList[1] = folderList[1].copy(childCunt = newChildCount)
-                    if (currentFolder.path == "#Fav") {
-                        currentFolder = currentFolder.copy(childCunt = newChildCount)
-                        filterList(currentSearchKeyword, currentFolder, filteredAudioList, audioList)
+                    if (currentFolder.value.path == "#Fav") {
+                        currentFolder.value = currentFolder.value.copy(childCunt = newChildCount)
+                        filterList(currentSearchKeyword, currentFolder.value, filteredAudioList, audioList)
                     }
                 },
                 onEdited = { editedAudio ->
@@ -73,18 +64,18 @@ fun ScreenHome() {
         },
         onSearchContent = {
             currentSearchKeyword = it
-            filterList(currentSearchKeyword, currentFolder, filteredAudioList, audioList)
+            filterList(currentSearchKeyword, currentFolder.value, filteredAudioList, audioList)
         },
         drawerContent = {
             Drawer(
                 folders = folderList,
-                selectedFolder = currentFolder.path
+                selectedFolder = currentFolder.value.path
             ) {
                 scope.launch {
                     drawerState.close()
                 }
-                currentFolder = it
-                filterList(currentSearchKeyword, currentFolder, filteredAudioList, audioList)
+                currentFolder.value = it
+                filterList(currentSearchKeyword, currentFolder.value, filteredAudioList, audioList)
             }
         }
     )

src/main/kotlin/routing/dialogs/AudioInfoDialog.kt

@@ -1,6 +1,5 @@
 package routing.dialogs
 
-import androidx.compose.desktop.ui.tooling.preview.Preview
 import androidx.compose.foundation.background
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.*

src/main/kotlin/routing/dialogs/EditTagsDialog.kt

@@ -8,8 +8,6 @@ import androidx.compose.foundation.background
 import androidx.compose.foundation.clickable
 import androidx.compose.foundation.layout.*
 import androidx.compose.foundation.shape.RoundedCornerShape
-import androidx.compose.material.Card
-import androidx.compose.material.Chip
 import androidx.compose.material.Icon
 import androidx.compose.material.Text
 import androidx.compose.runtime.*
@@ -19,7 +17,6 @@ import androidx.compose.ui.Modifier
 import androidx.compose.ui.draw.clip
 import androidx.compose.ui.input.pointer.PointerEventType
 import androidx.compose.ui.input.pointer.onPointerEvent
-import androidx.compose.ui.input.pointer.pointerMoveFilter
 import androidx.compose.ui.layout.ContentScale
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.unit.dp

src/main/kotlin/routing/dialogs/PlayerBottomSheet.kt

@@ -241,7 +241,7 @@ fun PlayerBottomSheet(
                     Box(Modifier.size(48.dp).clip(RoundedCornerShape(50)).clickable {
                         CorePlayer.autoMute()
                     }) {
-                        MuteAnimationIcon(modifier = Modifier.size(26.dp).align(Alignment.Center), isMute = isMute.value)
+                        MuteAnimationIcon(modifier = Modifier.size(26.dp).align(Alignment.Center),color = ColorBox.text.copy(0.8f), isMute = isMute.value)
                     }
                     CustomSlider(
                         modifier = Modifier.padding(start = 4.dp,end = 16.dp).weight(1f),

src/main/kotlin/routing/sections/Appbar.kt

@@ -62,9 +62,12 @@ fun RowScope.Appbar(currentFolder : ModelFolder,onSearchClicked : () -> Unit) {
         callback = {
             when (it) {
                 0 -> {
-
+                    ColorBox.switchDarkLight()
                 }
                 1 -> {
+
+                }
+                2 -> {
                     modalController.present(AlertConfiguration(alpha = 0.6f, cornerRadius = 6)) {
                         AboutDialog {
                             modalController.popBackStack(null)

src/main/kotlin/theme/ColorBox.kt

@@ -1,13 +1,56 @@
 package theme
 
+import androidx.compose.runtime.getValue
+import androidx.compose.runtime.mutableStateOf
+import androidx.compose.runtime.setValue
 import androidx.compose.ui.graphics.Color
+import utils.Prefs
 
 object ColorBox {
 
-    val primary = Color(0xFFFFFFFF)
-    val primaryDark = Color(0xFF0c1620)
-    val primaryDark2 = Color(0xFF15212a)
-    val card = Color(0xFF152632)
-    val text = Color(0xFFFFFFFF)
+    private val NIGHT_PRIMARY = Color(0xFFFFFFFF)
+    private val NIGHT_PRIMARY_DARK = Color(0xFF0c1620)
+    private val NIGHT_PRIMARY_DARK2 = Color(0xFF15212a)
+    private val NIGHT_PRIMARY_CARD = Color(0xFF152632)
+    private val NIGHT_TEXT_COLOR = Color(0xFFFFFFFF)
+
+    private val DAY_PRIMARY = Color(0xFF0c1620)
+    private val DAY_PRIMARY_DARK = Color(0xFFFFFFFF)
+    private val DAY_PRIMARY_DARK2 = Color(0xFFFAFAFA)
+    private val DAY_PRIMARY_DARK3 = Color(0xFFF4F4F4)
+    private val DAY_TEXT_COLOR = Color(0xFF121212)
+
+    var isDarkMode by mutableStateOf(Prefs.isDarkMode)
+
+    var primary by mutableStateOf(if (Prefs.isDarkMode) NIGHT_PRIMARY else DAY_PRIMARY)
+        private set
+    var primaryDark by mutableStateOf(if (Prefs.isDarkMode) NIGHT_PRIMARY_DARK else DAY_PRIMARY_DARK)
+        private set
+    var primaryDark2 by mutableStateOf(if (Prefs.isDarkMode) NIGHT_PRIMARY_DARK2 else DAY_PRIMARY_DARK2)
+        private set
+    var card by mutableStateOf(if (Prefs.isDarkMode) NIGHT_PRIMARY_CARD else DAY_PRIMARY_DARK3)
+        private set
+    var text by mutableStateOf(if (Prefs.isDarkMode) NIGHT_TEXT_COLOR else DAY_TEXT_COLOR)
+        private set
+
+    fun switchDarkLight () {
+        if (isDarkMode) {
+            //light
+            primary = DAY_PRIMARY
+            primaryDark = DAY_PRIMARY_DARK
+            primaryDark2 = DAY_PRIMARY_DARK2
+            card = DAY_PRIMARY_DARK3
+            text = DAY_TEXT_COLOR
+        } else {
+            //dark
+            primary = NIGHT_PRIMARY
+            primaryDark = NIGHT_PRIMARY_DARK
+            primaryDark2 = NIGHT_PRIMARY_DARK2
+            card = NIGHT_PRIMARY_CARD
+            text = NIGHT_TEXT_COLOR
+        }
+        Prefs.isDarkMode = !isDarkMode
+        isDarkMode = !isDarkMode
+    }
 
 }

src/main/kotlin/utils/Prefs.kt

@@ -37,4 +37,12 @@ object Prefs {
             preferences.put("equalizerPreset",value)
         }
 
+    var isDarkMode : Boolean
+        get() {
+            return preferences.getBoolean("isDarkMode",true)
+        }
+        set(value) {
+            preferences.putBoolean("isDarkMode",value)
+        }
+
 }