adjust tap location with scroll offset

android/Omnivore/app/src/main/java/app/omnivore/omnivore/ui/reader/WebReader.kt

@@ -24,7 +24,6 @@ import androidx.compose.ui.input.nestedscroll.nestedScroll
 import androidx.compose.ui.platform.LocalDensity
 import androidx.compose.ui.unit.dp
 import androidx.compose.ui.viewinterop.AndroidView
-import androidx.lifecycle.viewmodel.compose.viewModel
 import app.omnivore.omnivore.R
 import com.google.gson.Gson
 import kotlinx.coroutines.CoroutineScope
@@ -174,17 +173,17 @@ fun WebReader(
               val tapCoordinates = Gson().fromJson(json, TapCoordinates::class.java)
               Log.d("wvt", "received tap action: $tapCoordinates")
               CoroutineScope(Dispatchers.Main).launch {
-                webReaderViewModel.lastTappedLocationRect = tapCoordinates.asRect()
+                webReaderViewModel.lastTapCoordinates = tapCoordinates
                 actionMode?.finish()
                 actionMode = null
               }
             }
             "existingHighlightTap" -> {
-              val actionTapCoordinates = Gson().fromJson(json, ActionTapCoordinates::class.java)
-              Log.d("wv", "receive existing highlight tap action: $actionTapCoordinates")
+              val tapCoordinates = Gson().fromJson(json, TapCoordinates::class.java)
+              Log.d("wv", "receive existing highlight tap action: $tapCoordinates")
               CoroutineScope(Dispatchers.Main).launch {
                 webReaderViewModel.hasTappedExistingHighlight = true
-                webReaderViewModel.lastTappedLocationRect = actionTapCoordinates.asRect()
+                webReaderViewModel.lastTapCoordinates = tapCoordinates
                 startActionMode(null, ActionMode.TYPE_FLOATING)
               }
             }
@@ -236,7 +235,6 @@ class OmnivoreWebView(context: Context) : WebView(context) {
     // Called each time the action mode is shown. Always called after onCreateActionMode, but
     // may be called multiple times if the mode is invalidated.
     override fun onPrepareActionMode(mode: ActionMode, menu: Menu): Boolean {
-      Log.d("wv", "preparing action mode $menu")
       return false // Return false if nothing is done
     }
 
@@ -285,9 +283,17 @@ class OmnivoreWebView(context: Context) : WebView(context) {
 
     override fun onGetContentRect(mode: ActionMode?, view: View?, outRect: Rect?) {
       Log.d("wv", "outRect: $outRect, View: $view")
-      if (viewModel?.lastTappedLocationRect != null) {
-        Log.d("wv", "setting rect based on last tapped rect: ${viewModel?.lastTappedLocationRect.toString()}")
-        outRect?.set(viewModel!!.lastTappedLocationRect!!)
+      if (viewModel?.lastTapCoordinates != null) {
+        val scrollYOffset = viewModel?.scrollState?.value ?: 0
+        val xValue = viewModel!!.lastTapCoordinates!!.tapX.toInt()
+        val yValue = viewModel!!.lastTapCoordinates!!.tapY.toInt() + scrollYOffset
+        val rect = Rect(xValue, yValue, xValue, yValue)
+
+        Log.d("wv", "scrollState: $scrollYOffset")
+        Log.d("wv", "setting rect based on last tapped rect: ${viewModel?.lastTapCoordinates.toString()}")
+        Log.d("wv", "rect: $rect")
+
+        outRect?.set(rect)
       } else {
         outRect?.set(left, top, right, bottom)
       }
@@ -320,32 +326,7 @@ class AndroidWebKitMessenger(val messageHandler: (String, String) -> Unit) {
   }
 }
 
-data class ActionTapCoordinates(
-  val rectX: Double,
-  val rectY: Double,
-  val rectWidth: Double,
-  val rectHeight: Double,
-) {
-  fun asRect(): Rect {
-    return Rect(
-      rectX.toInt(),
-      rectY.toInt(),
-      rectX.toInt(),
-      rectY.toInt()
-    )
-  }
-}
-
 data class TapCoordinates(
   val tapX: Double,
   val tapY: Double
-) {
-  fun asRect(): Rect {
-    return Rect(
-      tapX.toInt(),
-      tapY.toInt(),
-      tapX.toInt(),
-      tapY.toInt()
-    )
-  }
-}
+)

android/Omnivore/app/src/main/java/app/omnivore/omnivore/ui/reader/WebReaderViewModel.kt

@@ -1,6 +1,5 @@
 package app.omnivore.omnivore.ui.reader
 
-import android.graphics.Rect
 import android.util.Log
 import androidx.compose.foundation.ScrollState
 import androidx.lifecycle.MutableLiveData
@@ -14,7 +13,6 @@ import com.google.gson.Gson
 import dagger.hilt.android.lifecycle.HiltViewModel
 import kotlinx.coroutines.launch
 import kotlinx.coroutines.runBlocking
-import org.json.JSONObject
 import java.util.*
 import javax.inject.Inject
 
@@ -41,7 +39,7 @@ class WebReaderViewModel @Inject constructor(
   val javascriptActionLoopUUIDLiveData = MutableLiveData(lastJavascriptActionLoopUUID)
 
   var hasTappedExistingHighlight = false
-  var lastTappedLocationRect: Rect? = null
+  var lastTapCoordinates: TapCoordinates? = null
 
   fun loadItem(slug: String) {
     viewModelScope.launch {
@@ -115,7 +113,7 @@ class WebReaderViewModel @Inject constructor(
     scrollState = ScrollState(0)
     javascriptDispatchQueue = mutableListOf()
     hasTappedExistingHighlight = false
-    lastTappedLocationRect = null
+    lastTapCoordinates = null
   }
 
   fun resetJavascriptDispatchQueue() {

packages/web/components/templates/article/HighlightsLayer.tsx

@@ -275,8 +275,8 @@ export function HighlightsLayer(props: HighlightsLayerProps): JSX.Element {
       }
 
       const tapAttributes = {
-        tapX: event.screenX,
-        tapY: event.screenY,
+        tapX: event.clientX,
+        tapY: event.clientY,
       }
 
       window?.AndroidWebKitMessenger?.handleIdentifiableMessage(
@@ -300,20 +300,18 @@ export function HighlightsLayer(props: HighlightsLayerProps): JSX.Element {
           // In the native app we post a message with the rect of the
           // highlight, so the app can display a native menu
           const rect = (target as Element).getBoundingClientRect()
-          const message = {
+
+          window?.webkit?.messageHandlers.viewerAction?.postMessage({
+            actionID: 'showMenu',
             rectX: rect.x,
             rectY: rect.y,
             rectWidth: rect.width,
             rectHeight: rect.height,
-            highlightID: highlight.id,
-          }
-          window?.webkit?.messageHandlers.viewerAction?.postMessage({
-            actionID: 'showMenu',
-            ...message,
           })
+
           window?.AndroidWebKitMessenger?.handleIdentifiableMessage(
             'existingHighlightTap',
-            JSON.stringify(message)
+            JSON.stringify({ ...tapAttributes })
           )
         }
       } else if ((target as Element).hasAttribute(highlightNoteIdAttribute)) {