More work on notebook bottom views

2026-03-11 08:54:26 +00:00 · 2023-05-08 22:24:03 +08:00 · 2023-05-08 22:24:03 +08:00 · 0091d5c42a
commit 0091d5c42a
parent dc7c992ed2
6 changed files with 145 additions and 154 deletions
--- a/android/Omnivore/app/src/main/java/app/omnivore/omnivore/ui/components/LabelsSelectionSheet.kt
+++ b/android/Omnivore/app/src/main/java/app/omnivore/omnivore/ui/components/LabelsSelectionSheet.kt
@ -42,7 +42,6 @@ fun WebReaderLabelsSelectionSheet(viewModel: WebReaderViewModel) {

  val modalBottomSheetState = rememberModalBottomSheetState(
    ModalBottomSheetValue.HalfExpanded,
-    confirmStateChange = { it != ModalBottomSheetValue.Hidden }
  )

  if (isActive) {
--- a/android/Omnivore/app/src/main/java/app/omnivore/omnivore/ui/notebook/NotebookView.kt
+++ b/android/Omnivore/app/src/main/java/app/omnivore/omnivore/ui/notebook/NotebookView.kt
@ -3,12 +3,7 @@ package app.omnivore.omnivore.ui.notebook
 import android.content.ClipData
 import android.content.ClipboardManager
 import android.content.Context
-import android.content.Intent
-import android.os.Bundle
-import androidx.activity.ComponentActivity
 import androidx.activity.compose.LocalOnBackPressedDispatcherOwner
-import androidx.activity.compose.setContent
-import androidx.activity.viewModels
 import androidx.compose.foundation.*
 import androidx.compose.foundation.layout.*
 import androidx.compose.foundation.shape.RoundedCornerShape
@ -37,73 +32,14 @@ import androidx.compose.ui.res.colorResource
 import androidx.compose.ui.text.TextStyle
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.unit.sp
-import app.omnivore.omnivore.MainActivity
 import app.omnivore.omnivore.R
 import app.omnivore.omnivore.persistence.entities.SavedItemWithLabelsAndHighlights
 import app.omnivore.omnivore.ui.library.*
-import app.omnivore.omnivore.ui.theme.OmnivoreTheme
-import com.google.accompanist.systemuicontroller.rememberSystemUiController
-import dagger.hilt.android.AndroidEntryPoint
 import dev.jeziellago.compose.markdowntext.MarkdownText
 import kotlinx.coroutines.launch
-import android.util.Log
-import androidx.compose.ui.platform.LocalDensity
 import app.omnivore.omnivore.persistence.entities.Highlight
-import kotlin.math.roundToInt

-@AndroidEntryPoint
-class NotebookActivity: ComponentActivity() {
-    val viewModel: NotebookViewModel by viewModels()

-    override fun onCreate(savedInstanceState: Bundle?) {
-        super.onCreate(savedInstanceState)
-        val savedItemId = intent.getStringExtra("SAVED_ITEM_ID")
-
-        setContent {
-            val systemUiController = rememberSystemUiController()
-            val useDarkIcons = !isSystemInDarkTheme()
-
-            DisposableEffect(systemUiController, useDarkIcons) {
-                systemUiController.setSystemBarsColor(
-                    color = Color.Black,
-                    darkIcons = false
-                )
-
-                onDispose {}
-            }
-
-            OmnivoreTheme {
-                Box(
-                    modifier = Modifier
-                        .fillMaxSize()
-                        // .background(color = Color.Black)
-                ) {
-                    savedItemId?.let {
-                        NotebookView(
-                            savedItemId = savedItemId,
-                            viewModel = viewModel
-                        )
-                    }
-                }
-                }
-            }
-        }
-
-//        // animate the view up when keyboard appears
-//        WindowCompat.setDecorFitsSystemWindows(window, false)
-//        val rootView = findViewById<View>(android.R.id.content).rootView
-//        ViewCompat.setOnApplyWindowInsetsListener(rootView) { _, insets ->
-//            val imeHeight = insets.getInsets(WindowInsetsCompat.Type.ime()).bottom
-//            rootView.setPadding(0, 0, 0, imeHeight)
-//            insets
-//        }
-//    }
-
-    private fun startMainActivity() {
-        val intent = Intent(this, MainActivity::class.java)
-        this.startActivity(intent)
-    }
-}

 fun notebookMD(notes: List<Highlight>, highlights: List<Highlight>): String {
    var result = ""
--- a/android/Omnivore/app/src/main/java/app/omnivore/omnivore/ui/reader/AnnotationEditView.kt
+++ b/android/Omnivore/app/src/main/java/app/omnivore/omnivore/ui/reader/AnnotationEditView.kt
@ -1,5 +1,6 @@
 package app.omnivore.omnivore.ui.reader

+import android.content.ClipData
 import android.content.DialogInterface
 import android.os.Bundle
 import android.view.LayoutInflater
@ -8,6 +9,10 @@ import android.view.ViewGroup
 import androidx.compose.foundation.background
 import androidx.compose.foundation.layout.*
 import androidx.compose.foundation.shape.RoundedCornerShape
+import androidx.compose.foundation.verticalScroll
+import androidx.compose.material.icons.Icons
+import androidx.compose.material.icons.filled.ArrowBack
+import androidx.compose.material.icons.filled.MoreVert
 import androidx.compose.material3.*
 import androidx.compose.runtime.Composable
 import androidx.compose.runtime.LaunchedEffect
@ -22,7 +27,11 @@ import androidx.compose.ui.platform.ComposeView
 import androidx.compose.ui.platform.ViewCompositionStrategy
 import androidx.compose.ui.unit.dp
 import androidx.fragment.app.DialogFragment
+import app.omnivore.omnivore.ui.notebook.ArticleNotes
+import app.omnivore.omnivore.ui.notebook.HighlightsList
+import app.omnivore.omnivore.ui.notebook.notebookMD
 import app.omnivore.omnivore.ui.theme.OmnivoreTheme
+import kotlinx.coroutines.launch

 class AnnotationEditFragment : DialogFragment() {
  private var onSave: (String) -> Unit = {}
@ -54,7 +63,7 @@ class AnnotationEditFragment : DialogFragment() {
            initialAnnotation,
            onSave,
            onCancel,
-            dismissAction = { dismiss() }
+         //    dismissAction = { dismiss() }
          )
        }
      }
@ -73,62 +82,96 @@ fun AnnotationEditView(
  initialAnnotation: String,
  onSave: (String) -> Unit,
  onCancel: () -> Unit,
-  dismissAction: () -> Unit = {}
 ) {
  val annotation = remember { mutableStateOf(initialAnnotation) }
  val focusRequester = FocusRequester()

-  Column(
-    modifier = Modifier
-      .clip(RoundedCornerShape(4.dp))
-      .background(MaterialTheme.colorScheme.background)
-      .padding(8.dp),
-  ) {
-    Column(
-      modifier = Modifier.padding(16.dp),
-      horizontalAlignment = Alignment.CenterHorizontally,
-    ) {
-      Row {
-        TextButton(
-          onClick = {
+  Scaffold(
+    topBar = {
+      TopAppBar(
+        title = { Text("Notebook") },
+        colors = TopAppBarDefaults.topAppBarColors(
+          containerColor = MaterialTheme.colorScheme.background
+        ),
+        navigationIcon = {
+          IconButton(onClick = {
            onCancel()
-            dismissAction()
+          }) {
+            Icon(
+              imageVector = Icons.Filled.ArrowBack,
+              modifier = Modifier,
+              contentDescription = "Back",
+            )
          }
-        ) {
-          Text("Cancel")
-        }
-
-        Spacer(modifier = Modifier.weight(1.0F))
-
-        Text(text = "Note")
-
-        Spacer(modifier = Modifier.weight(1.0F))
-
-        TextButton(
-          onClick = {
-            onSave(annotation.value)
-            dismissAction()
+        },
+        actions = {
+          TextButton(
+            onClick = {
+              onSave(annotation.value)
+            }
+          ) {
+            Text("Save")
          }
-        ) {
-          Text("Save")
        }
-      }
-
-      Spacer(modifier = Modifier.height(8.dp))
-
+      )
+    }
+  ) { paddingValues ->
+    Column(
+      modifier = Modifier
+        .padding(paddingValues)
+        .fillMaxSize()
+    ) {
      TextField(
        value = annotation.value,
        onValueChange = { annotation.value = it },
        modifier = Modifier
-          .width(IntrinsicSize.Max)
-          .height(IntrinsicSize.Max)
-          .weight(1.0F)
          .focusRequester(focusRequester)
+          .fillMaxSize()
      )
+    }
+  }
+}
+//
+//    Column(
+//      modifier = Modifier.padding(16.dp),
+//      horizontalAlignment = Alignment.CenterHorizontally,
+//    ) {
+//      Row {
+//        TextButton(
+//          onClick = {
+//            onCancel()
+//            dismissAction()
+//          }
+//        ) {
+//          Text("Cancel")
+//        }
+//
+//        Spacer(modifier = Modifier.weight(1.0F))
+//
+//        Text(text = "Note")
+//
+//        Spacer(modifier = Modifier.weight(1.0F))
+//
+//        TextButton(
+//          onClick = {
+//            onSave(annotation.value)
+//            dismissAction()
+//          }
+//        ) {
+//          Text("Save")
+//        }
+//      }
+//
+//      Spacer(modifier = Modifier.height(8.dp))
+//
+//
+//
+//      Spacer(modifier = Modifier.height(16.dp))

-      LaunchedEffect(Unit) {
-        focusRequester.requestFocus()
-      }
+//
+//      LaunchedEffect(Unit) {
+//        focusRequester.requestFocus()
+//      }

 //      Row {
 //        Spacer(modifier = Modifier.weight(0.1F))
@ -142,8 +185,7 @@ fun AnnotationEditView(
 //        )
 //        Spacer(modifier = Modifier.weight(0.1F))
 //      }
-    }
-
-    Spacer(modifier = Modifier.height(16.dp))
-  }
-}
+//    }
+//
+// // }
+//}
--- a/android/Omnivore/app/src/main/java/app/omnivore/omnivore/ui/reader/ReaderPreferencesView.kt
+++ b/android/Omnivore/app/src/main/java/app/omnivore/omnivore/ui/reader/ReaderPreferencesView.kt
@ -49,6 +49,7 @@ fun ReaderPreferencesView(webReaderViewModel: WebReaderViewModel) {
  Column(
    modifier = Modifier
      .padding(horizontal = 15.dp)
+      .padding(vertical = 35.dp)
      .verticalScroll(rememberScrollState())
  ) {
    Row(
--- a/android/Omnivore/app/src/main/java/app/omnivore/omnivore/ui/reader/WebReader.kt
+++ b/android/Omnivore/app/src/main/java/app/omnivore/omnivore/ui/reader/WebReader.kt
@ -30,7 +30,6 @@ import java.util.*
@SuppressLint("SetJavaScriptEnabled")
@Composable
 fun WebReader(
-  preferences: WebPreferences,
  styledContent: String,
  webReaderViewModel: WebReaderViewModel
 ) {
--- a/android/Omnivore/app/src/main/java/app/omnivore/omnivore/ui/reader/WebReaderLoadingContainer.kt
+++ b/android/Omnivore/app/src/main/java/app/omnivore/omnivore/ui/reader/WebReaderLoadingContainer.kt
@ -121,7 +121,7 @@ fun WebReaderLoadingContainer(slug: String? = null, requestID: String? = null,
  val onBackPressedDispatcher = LocalOnBackPressedDispatcherOwner.current?.onBackPressedDispatcher

  var isMenuExpanded by remember { mutableStateOf(false) }
-  var bottomSheetState by remember { mutableStateOf(app.omnivore.omnivore.ui.reader.BottomSheetState.NONE)}
+  var bottomSheetState by remember { mutableStateOf(BottomSheetState.NONE) }

  val currentThemeKey = webReaderViewModel.currentThemeKey.observeAsState()
  val currentTheme = Themes.values().find { it.themeKey == currentThemeKey.value }
@ -147,11 +147,18 @@ fun WebReaderLoadingContainer(slug: String? = null, requestID: String? = null,
  } ?: null

  val modalBottomSheetState = rememberModalBottomSheetState(
-    ModalBottomSheetValue.Hidden,
+    initialValue = ModalBottomSheetValue.Hidden,
  )

  val themeTintColor = Color(currentTheme?.foregroundColor ?: 0xFFFFFFFF)

+  annotation?.let {
+    bottomSheetState = BottomSheetState.HIGHLIGHTNOTE
+    coroutineScope.launch {
+      modalBottomSheetState.animateTo(ModalBottomSheetValue.Expanded)
+    }
+  }
+
  ModalBottomSheetLayout(
    modifier = Modifier
      .statusBarsPadding(),
@ -172,7 +179,27 @@ fun WebReaderLoadingContainer(slug: String? = null, requestID: String? = null,
          }
        }
        BottomSheetState.HIGHLIGHTNOTE -> {
-
+          annotation?.let { annotation ->
+            BottomSheetUI(title = "Note") {
+              AnnotationEditView(
+                initialAnnotation = annotation,
+                onSave = {
+                  webReaderViewModel.saveAnnotation(it)
+                  coroutineScope.launch {
+                    modalBottomSheetState.hide()
+                    bottomSheetState = BottomSheetState.NONE
+                  }
+                },
+                onCancel = {
+                  webReaderViewModel.cancelAnnotationEdit()
+                  coroutineScope.launch {
+                    modalBottomSheetState.hide()
+                    bottomSheetState = BottomSheetState.NONE
+                  }
+                }
+              )
+            }
+          }
        }
        BottomSheetState.NONE -> {

@ -215,9 +242,9 @@ fun WebReaderLoadingContainer(slug: String? = null, requestID: String? = null,
            }
            webReaderParams?.let {
              IconButton(onClick = {
-                bottomSheetState = BottomSheetState.NOTEBOOK
                coroutineScope.launch {
-                  modalBottomSheetState.show()
+                  bottomSheetState = BottomSheetState.NOTEBOOK
+                  modalBottomSheetState.animateTo(ModalBottomSheetValue.Expanded)
                }
              }) {
                Icon(
@ -228,9 +255,9 @@ fun WebReaderLoadingContainer(slug: String? = null, requestID: String? = null,
              }
            }
            IconButton(onClick = {
-              bottomSheetState = BottomSheetState.PREFERENCES
              coroutineScope.launch {
-                modalBottomSheetState.show()
+                bottomSheetState = BottomSheetState.PREFERENCES
+                modalBottomSheetState.animateTo(ModalBottomSheetValue.HalfExpanded)
              }
            }) {
              Icon(
@ -239,52 +266,39 @@ fun WebReaderLoadingContainer(slug: String? = null, requestID: String? = null,
                tint = themeTintColor
              )
            }
-            IconButton(onClick = { isMenuExpanded = true }) {
-              Icon(
-                painter = painterResource(id = R.drawable.dots_horizontal),
-                contentDescription = null,
-                tint = themeTintColor
-              )
-              if (isMenuExpanded) {
-                webReaderParams?.let { params ->
-                  SavedItemContextMenu(
-                    isExpanded = isMenuExpanded,
-                    isArchived = params.item.isArchived,
-                    onDismiss = { isMenuExpanded = false },
-                    actionHandler = {
-                      webReaderViewModel.handleSavedItemAction(
-                        params.item.savedItemId,
-                        it
-                      )
-                    }
-                  )
+              IconButton(onClick = { isMenuExpanded = true }) {
+                Icon(
+                  painter = painterResource(id = R.drawable.dots_horizontal),
+                  contentDescription = null,
+                  tint = themeTintColor
+                )
+                if (isMenuExpanded) {
+                  webReaderParams?.let { params ->
+                    SavedItemContextMenu(
+                      isExpanded = isMenuExpanded,
+                      isArchived = params.item.isArchived,
+                      onDismiss = { isMenuExpanded = false },
+                      actionHandler = {
+                        webReaderViewModel.handleSavedItemAction(
+                          params.item.savedItemId,
+                          it
+                        )
+                      }
+                    )
+                  }
                }
              }
-            }
          },
        )
      }
    ) { paddingValues ->
          if (styledContent != null) {
            WebReader(
-              preferences = webReaderViewModel.storedWebPreferences(isSystemInDarkTheme()),
              styledContent = styledContent,
              webReaderViewModel = webReaderViewModel
            )
          }

-          if (annotation != null) {
-            AnnotationEditView(
-              initialAnnotation = annotation!!,
-              onSave = {
-                webReaderViewModel.saveAnnotation(it)
-              },
-              onCancel = {
-                webReaderViewModel.cancelAnnotationEdit()
-              }
-            )
-          }
-
          WebReaderLabelsSelectionSheet(webReaderViewModel)
        }

@ -296,6 +310,7 @@ fun WebReaderLoadingContainer(slug: String? = null, requestID: String? = null,
    }
 }

+
@OptIn(ExperimentalMaterial3Api::class, ExperimentalMaterialApi::class)
@Composable
 fun BottomSheetUI(title: String?, content: @Composable () -> Unit) {
@ -310,7 +325,6 @@ fun BottomSheetUI(title: String?, content: @Composable () -> Unit) {
    Scaffold(
    ) { paddingValues ->
      Box(modifier = Modifier
-        .padding(paddingValues)
        .fillMaxSize()) {
        content()
      }