feat: add selecting and deleting comics [#66]

README.md

@@ -33,3 +33,5 @@ To achieve these goals, the project will:
 
 
 # Credits
+
+[Reshot](https://www.reshot.com/free-svg-icons/) - for toolbar icons.

androidVariant/src/main/java/org/comixedproject/variant/android/view/HomeView.kt

@@ -36,14 +36,20 @@ import org.comixedproject.variant.android.view.comics.ComicBookView
 import org.comixedproject.variant.android.view.reading.ReadingView
 import org.comixedproject.variant.android.view.server.ServerView
 import org.comixedproject.variant.android.view.settings.SettingsView
+import org.comixedproject.variant.platform.Log
 import org.comixedproject.variant.viewmodel.VariantViewModel
 import org.koin.androidx.compose.koinViewModel
 
+private const val TAG = "HomeView"
+
 @Composable
 fun HomeView() {
     val variantViewModel: VariantViewModel = koinViewModel()
     var currentDestination by remember { mutableStateOf(AppDestination.COMICS) }
     val coroutineScope = rememberCoroutineScope()
+    val comicBookList by variantViewModel.comicBookList.collectAsState()
+    val selectionMode by variantViewModel.selectionMode.collectAsState()
+    val selectionList by variantViewModel.selectionList.collectAsState()
     val comicBook by variantViewModel.comicBook.collectAsState()
 
     Scaffold(
@@ -72,8 +78,29 @@ fun HomeView() {
                         )
                     } else {
                         ComicBookView(
-                            onReadComicBook = { comicBook ->
-                                variantViewModel.readComicBook(comicBook)
+                            comicBookList,
+                            selectionMode,
+                            selectionList,
+                            onSetSelectionMode = {
+                                Log.info(TAG, "Setting selection mode: ${it}")
+                                variantViewModel.setSelectMode(it)
+                            },
+                            onComicBookClicked = { comicBook ->
+                                if (selectionMode) {
+                                    Log.info(
+                                        TAG,
+                                        "Toggling comic book selection: ${comicBook.path}"
+                                    )
+                                    variantViewModel.updateSelectionList(comicBook.path)
+                                } else {
+                                    Log.info(TAG, "Reading comic book: ${comicBook.filename}")
+                                    variantViewModel.readComicBook(comicBook)
+                                }
+                            },
+                            onDeleteComics = {
+                                coroutineScope.launch(Dispatchers.IO) {
+                                    variantViewModel.deleteSelections()
+                                }
                             },
                             modifier = Modifier.padding(padding)
                         )

androidVariant/src/main/java/org/comixedproject/variant/android/view/comics/ComicBookListItemView.kt

@@ -1,8 +1,10 @@
 package org.comixedproject.variant.android.view.comics
 
 import android.graphics.BitmapFactory
+import androidx.compose.foundation.ExperimentalFoundationApi
 import androidx.compose.foundation.Image
-import androidx.compose.foundation.clickable
+import androidx.compose.foundation.border
+import androidx.compose.foundation.combinedClickable
 import androidx.compose.foundation.layout.Column
 import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.material3.CardDefaults
@@ -17,10 +19,12 @@ import androidx.compose.runtime.remember
 import androidx.compose.runtime.rememberCoroutineScope
 import androidx.compose.runtime.setValue
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.graphics.asImageBitmap
 import androidx.compose.ui.res.painterResource
 import androidx.compose.ui.text.style.TextOverflow
 import androidx.compose.ui.tooling.preview.Preview
+import androidx.compose.ui.unit.dp
 import kotlinx.coroutines.Dispatchers
 import kotlinx.coroutines.launch
 import org.comixedproject.variant.adaptor.ArchiveAPI
@@ -33,23 +37,34 @@ import org.comixedproject.variant.platform.Log
 
 private val TAG = "ComicBookListItemView"
 
+@OptIn(ExperimentalFoundationApi::class)
 @Composable
 fun ComicBookListItemView(
     comicBook: ComicBook,
+    selected: Boolean,
     onClick: (ComicBook) -> Unit,
     modifier: Modifier = Modifier
 ) {
     var coverContent by remember { mutableStateOf<ByteArray?>(null) }
     val coroutineScope = rememberCoroutineScope()
+    val borderWidth = when (selected) {
+        true -> 5.dp
+        false -> 0.dp
+    }
 
     ElevatedCard(
         colors = CardDefaults.cardColors(containerColor = colorScheme.surface),
         modifier = modifier
             .fillMaxWidth()
+            .border(borderWidth, Color.Red)
     ) {
         val title = MetadataAPI.displayableTitle(comicBook)
 
-        Column(modifier = Modifier.clickable(onClick = { onClick(comicBook) })) {
+        Column(
+            modifier = Modifier.combinedClickable(
+                onClick = { onClick(comicBook) }
+            )
+        ) {
             comicBook.pages.firstOrNull()?.let { cover ->
                 if (coverContent == null) {
                     Image(
@@ -91,5 +106,21 @@ fun ComicBookListItemView(
 @Composable
 @Preview
 fun ComicBookListItemViewPreview() {
-    VariantTheme { ComicBookListItemView(comicBook = COMIC_BOOK_LIST.get(0), onClick = {}) }
+    VariantTheme {
+        ComicBookListItemView(
+            comicBook = COMIC_BOOK_LIST.get(0),
+            false,
+            onClick = {})
+    }
+}
+
+@Composable
+@Preview
+fun ComicBookListItemViewSelectedPreview() {
+    VariantTheme {
+        ComicBookListItemView(
+            comicBook = COMIC_BOOK_LIST.get(0),
+            true,
+            onClick = {})
+    }
 }

androidVariant/src/main/java/org/comixedproject/variant/android/view/comics/ComicBookListView.kt

@@ -41,6 +41,7 @@ private val TAG = "ComicBookListView"
 @Composable
 fun ComicBookListView(
     comicBookList: List<ComicBook>,
+    selectionList: List<String>,
     onClick: (ComicBook) -> Unit,
     modifier: Modifier = Modifier
 ) {
@@ -61,11 +62,13 @@ fun ComicBookListView(
                         items(comicBookList) { comicBook ->
                             ComicBookListItemView(
                                 comicBook,
-                                onClick = { onClick(it) },
-                                modifier = Modifier.padding(padding)
+                                selectionList.contains(comicBook.path),
+                                onClick = { onClick(it) }
                             )
                         }
-                    })
+                    },
+                    modifier = modifier.padding(padding)
+                )
             }
         }, modifier = modifier.padding(8.dp)
     )
@@ -75,6 +78,6 @@ fun ComicBookListView(
 @Preview
 fun ComicBookListViewPreview() {
     VariantTheme {
-        ComicBookListView(COMIC_BOOK_LIST, onClick = {})
+        ComicBookListView(COMIC_BOOK_LIST, emptyList(), onClick = {})
     }
 }

androidVariant/src/main/java/org/comixedproject/variant/android/view/comics/ComicBookView.kt

@@ -18,28 +18,105 @@
 
 package org.comixedproject.variant.android.view.comics
 
+import androidx.compose.foundation.layout.padding
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.Delete
+import androidx.compose.material3.BottomAppBar
+import androidx.compose.material3.Icon
+import androidx.compose.material3.IconButton
+import androidx.compose.material3.Scaffold
 import androidx.compose.runtime.Composable
-import androidx.compose.runtime.collectAsState
-import androidx.compose.runtime.getValue
 import androidx.compose.ui.Modifier
+import androidx.compose.ui.res.painterResource
+import androidx.compose.ui.res.stringResource
 import androidx.compose.ui.tooling.preview.Preview
+import org.comixedproject.variant.android.COMIC_BOOK_LIST
+import org.comixedproject.variant.android.R
 import org.comixedproject.variant.android.VariantTheme
 import org.comixedproject.variant.model.library.ComicBook
-import org.comixedproject.variant.viewmodel.VariantViewModel
-import org.koin.androidx.compose.koinViewModel
+import org.comixedproject.variant.platform.Log
 
 private val TAG = "ComicBookView"
 
 @Composable
-fun ComicBookView(onReadComicBook: (ComicBook) -> Unit, modifier: Modifier = Modifier) {
-    val variantViewModel: VariantViewModel = koinViewModel()
-    val comicBookList by variantViewModel.comicBookList.collectAsState()
+fun ComicBookView(
+    comicBookList: List<ComicBook>,
+    selectionMode: Boolean,
+    selectionList: List<String>,
+    onSetSelectionMode: (Boolean) -> Unit,
+    onComicBookClicked: (ComicBook) -> Unit,
+    onDeleteComics: () -> Unit,
+    modifier: Modifier = Modifier
+) {
+    Scaffold(
+        content = { padding ->
+            ComicBookListView(
+                comicBookList,
+                selectionList,
+                onClick = { onComicBookClicked(it) },
+                modifier = modifier.padding(padding)
+            )
+        },
+        bottomBar = {
+            BottomAppBar(
+                actions = {
+                    if (selectionMode) {
+                        IconButton(onClick = { onSetSelectionMode(false) }) {
+                            Icon(
+                                painterResource(id = R.drawable.ic_selection_mode_on),
+                                contentDescription = stringResource(R.string.markReadLabel)
+                            )
+                        }
+                    } else {
+                        IconButton(onClick = { onSetSelectionMode(true) }) {
+                            Icon(
+                                painterResource(id = R.drawable.ic_selection_mode_off),
+                                contentDescription = stringResource(R.string.markReadLabel)
+                            )
+                        }
+                    }
+                    if (!selectionList.isEmpty()) {
+                        IconButton(enabled = !selectionList.isEmpty(), onClick = {
+                            Log.info(TAG, "Deleting ${selectionList.size} comic book(s)")
+                            onDeleteComics()
+                        }) {
+                            Icon(
+                                Icons.Filled.Delete,
+                                contentDescription = stringResource(R.string.deleteSelectionsLabel)
+                            )
+                        }
+                    }
 
-    ComicBookListView(comicBookList, onClick = { onReadComicBook(it) }, modifier = modifier)
+                }
+            )
+        }
+    )
 }
 
 @Composable
 @Preview
 fun ComicBookViewPreview() {
-    VariantTheme { ComicBookView(onReadComicBook = { }) }
+    VariantTheme {
+        ComicBookView(
+            COMIC_BOOK_LIST,
+            false,
+            emptyList(),
+            onSetSelectionMode = { _ -> },
+            onComicBookClicked = { _ -> },
+            onDeleteComics = { })
+    }
+}
+
+@Composable
+@Preview
+fun ComicBookViewWithSelectionsPreview() {
+    VariantTheme {
+        ComicBookView(
+            COMIC_BOOK_LIST,
+            true,
+            listOf(COMIC_BOOK_LIST.get(0).path),
+            onSetSelectionMode = { _ -> },
+            onComicBookClicked = { _ -> },
+            onDeleteComics = { })
+    }
 }

androidVariant/src/main/res/drawable-anydpi/ic_selection_mode_off.xml

@@ -0,0 +1,17 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="22"
+    android:viewportHeight="12"
+    android:tint="#333333"
+    android:alpha="0.6">
+  <group android:scaleY="0.54545456"
+      android:translateY="2.7272727">
+    <path
+        android:fillColor="#FF000000"
+        android:pathData="M12,6a6,6 0,1 0,-6 6A6.006,6.006 0,0 0,12 6Z"/>
+    <path
+        android:fillColor="#FF000000"
+        android:pathData="M18,2H11.736a6.957,6.957 0,0 1,0.969 2H18a2,2 0,0 1,0 4H12.705a6.957,6.957 0,0 1,-0.969 2H18a4,4 0,0 0,0 -8Z"/>
+  </group>
+</vector>

androidVariant/src/main/res/drawable-anydpi/ic_selection_mode_on.xml

@@ -0,0 +1,17 @@
+<vector xmlns:android="http://schemas.android.com/apk/res/android"
+    android:width="24dp"
+    android:height="24dp"
+    android:viewportWidth="22"
+    android:viewportHeight="12"
+    android:tint="#333333"
+    android:alpha="0.6">
+  <group android:scaleY="0.54545456"
+      android:translateY="2.7272727">
+    <path
+        android:fillColor="#FF000000"
+        android:pathData="M16,0a6,6 0,1 0,6 6A6.006,6.006 0,0 0,16 0Z"/>
+    <path
+        android:fillColor="#FF000000"
+        android:pathData="M4,4H9.3a6.957,6.957 0,0 1,0.969 -2H4a4,4 0,0 0,0 8h6.264A6.957,6.957 0,0 1,9.3 8H4A2,2 0,0 1,4 4Z"/>
+  </group>
+</vector>

androidVariant/src/main/res/values/strings.xml

@@ -16,4 +16,7 @@
     <string name="previousPageLabel">Go to the previous page.</string>
     <string name="nextPageLabel">Go to the next page.</string>
     <string name="stopReadingLabel">Stop reading comic book.</string>
+    <string name="markReadLabel">Mark selected comics as read.</string>
+    <string name="markUnreadLabel">Mark selected comics as unread.</string>
+    <string name="deleteSelectionsLabel">Delete selected comics from device.</string>
 </resources>

iosVariant/iosVariant/Assets.xcassets/Contents.json

@@ -3,4 +3,4 @@
     "author" : "xcode",
     "version" : 1
   }
-}
+}

iosVariant/iosVariant/Assets.xcassets/selection_mode_off.imageset/Contents.json

@@ -0,0 +1,21 @@
+{
+  "images" : [
+    {
+      "filename" : "reshot-icon-off-switch-TQVBLRMESW-1772e.svg",
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}

iosVariant/iosVariant/Assets.xcassets/selection_mode_on.imageset/Contents.json

@@ -0,0 +1,21 @@
+{
+  "images" : [
+    {
+      "filename" : "reshot-icon-on-switch-S253U8PFKM-f8513.svg",
+      "idiom" : "universal",
+      "scale" : "1x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "2x"
+    },
+    {
+      "idiom" : "universal",
+      "scale" : "3x"
+    }
+  ],
+  "info" : {
+    "author" : "xcode",
+    "version" : 1
+  }
+}