@lugg/maps 0.2.0-alpha.8 → 1.0.0-beta.0

package/android/src/main/java/com/luggmaps/LuggMarkerView.kt

@@ -1,10 +1,19 @@
 package com.luggmaps
 
 import android.content.Context
+import android.graphics.Bitmap
+import android.graphics.Canvas
 import android.view.View
+import android.view.ViewGroup
+import androidx.core.graphics.createBitmap
 import androidx.core.view.isNotEmpty
 import com.facebook.react.views.view.ReactViewGroup
 import com.google.android.gms.maps.model.AdvancedMarker
+import com.google.android.gms.maps.model.BitmapDescriptor
+import com.google.android.gms.maps.model.BitmapDescriptorFactory
+import com.luggmaps.events.MarkerDragEvent
+import com.luggmaps.events.MarkerPressEvent
+import com.luggmaps.extensions.dispatchEvent
 
 interface LuggMarkerViewDelegate {
   fun markerViewDidUpdate(markerView: LuggMarkerView)
@@ -12,6 +21,8 @@ interface LuggMarkerViewDelegate {
 }
 
 class LuggMarkerView(context: Context) : ReactViewGroup(context) {
+  private var scaleUpdateRunnable: Runnable? = null
+
   var name: String? = null
     private set
 
@@ -36,23 +47,120 @@ class LuggMarkerView(context: Context) : ReactViewGroup(context) {
   var zIndex: Float = 0f
     private set
 
+  var rotate: Float = 0f
+    private set
+
+  var scale: Float = 1f
+    private set
+
+  var scaleChanged: Boolean = false
+    private set
+
+  var rasterize: Boolean = true
+    private set
+
+  var draggable: Boolean = false
+    private set
+
+  var isDragging: Boolean = false
+
   var didLayout: Boolean = false
     private set
 
   val hasCustomView: Boolean
     get() = iconView.isNotEmpty()
 
-  val iconView: ReactViewGroup = object : ReactViewGroup(context) {
-    override fun onMeasure(widthMeasureSpec: Int, heightMeasureSpec: Int) {
-      var maxWidth = 0
-      var maxHeight = 0
-      for (i in 0 until childCount) {
-        val child = getChildAt(i)
-        if (child.width > maxWidth) maxWidth = child.width
-        if (child.height > maxHeight) maxHeight = child.height
+  val iconView: ReactViewGroup = ReactViewGroup(context)
+
+  private fun measureIconViewBounds(): Pair<Int, Int> {
+    var maxWidth = 0
+    var maxHeight = 0
+    for (i in 0 until iconView.childCount) {
+      val child = iconView.getChildAt(i)
+      val childRight = child.left + child.width
+      val childBottom = child.top + child.height
+      if (childRight > maxWidth) maxWidth = childRight
+      if (childBottom > maxHeight) maxHeight = childBottom
+    }
+    return Pair(maxWidth, maxHeight)
+  }
+
+  private fun createIconBitmap(): BitmapDescriptor? {
+    val (width, height) = measureIconViewBounds()
+    if (width <= 0 || height <= 0) return null
+
+    val scaledWidth = (width * scale).toInt()
+    val scaledHeight = (height * scale).toInt()
+
+    val bitmap = createBitmap(scaledWidth, scaledHeight)
+    val canvas = Canvas(bitmap)
+    canvas.scale(scale, scale)
+    iconView.draw(canvas)
+    return BitmapDescriptorFactory.fromBitmap(bitmap)
+  }
+
+  private fun createIconViewWrapper(): View {
+    val (width, height) = measureIconViewBounds()
+    val scaledWidth = (width * scale).toInt()
+    val scaledHeight = (height * scale).toInt()
+
+    (iconView.parent as? ViewGroup)?.removeView(iconView)
+    iconView.scaleX = scale
+    iconView.scaleY = scale
+    iconView.pivotX = 0f
+    iconView.pivotY = 0f
+
+    return object : ReactViewGroup(context) {
+      init {
+        addView(iconView)
       }
 
-      setMeasuredDimension(maxWidth, maxHeight)
+      override fun onMeasure(widthMeasureSpec: Int, heightMeasureSpec: Int) {
+        setMeasuredDimension(scaledWidth, scaledHeight)
+      }
+    }
+  }
+
+  fun applyIconToMarker() {
+    val m = marker ?: return
+    if (!hasCustomView) return
+
+    if (rasterize) {
+      createIconBitmap()?.let { m.setIcon(it) }
+    } else {
+      m.iconView = createIconViewWrapper()
+    }
+  }
+
+  fun applyScaleToMarker() {
+    val m = marker ?: return
+    if (!hasCustomView) return
+
+    scaleUpdateRunnable?.let { removeCallbacks(it) }
+    scaleUpdateRunnable = Runnable {
+      if (rasterize) {
+        createIconBitmap()?.let { m.setIcon(it) }
+      } else {
+        m.iconView = createIconViewWrapper()
+      }
+    }
+    post(scaleUpdateRunnable)
+  }
+
+  fun updateIcon(onAddMarker: () -> Unit) {
+    if (!hasCustomView) return
+    if (rasterize) {
+      post {
+        if (marker == null) {
+          onAddMarker()
+        } else {
+          applyIconToMarker()
+        }
+      }
+    } else {
+      marker?.remove()
+      marker = null
+      post { onAddMarker() }
     }
   }
 
@@ -92,6 +200,7 @@ class LuggMarkerView(context: Context) : ReactViewGroup(context) {
     bottom: Int
   ) {
     super.onLayout(changed, left, top, right, bottom)
+
     if (changed && !didLayout) {
       didLayout = true
       delegate?.markerViewDidLayout(this)
@@ -120,6 +229,43 @@ class LuggMarkerView(context: Context) : ReactViewGroup(context) {
     this.zIndex = zIndex
   }
 
+  fun setRotate(rotate: Float) {
+    this.rotate = rotate
+  }
+
+  fun setScale(scale: Float) {
+    scaleChanged = this.scale != scale
+    this.scale = scale
+  }
+
+  fun clearScaleChanged() {
+    scaleChanged = false
+  }
+
+  fun setRasterize(rasterize: Boolean) {
+    this.rasterize = rasterize
+  }
+
+  fun setDraggable(draggable: Boolean) {
+    this.draggable = draggable
+  }
+
+  fun emitPressEvent(x: Float, y: Float) {
+    dispatchEvent(MarkerPressEvent(this, latitude, longitude, x, y))
+  }
+
+  fun emitDragStartEvent(x: Float, y: Float) {
+    dispatchEvent(MarkerDragEvent(this, MarkerDragEvent.DRAG_START, latitude, longitude, x, y))
+  }
+
+  fun emitDragChangeEvent(x: Float, y: Float) {
+    dispatchEvent(MarkerDragEvent(this, MarkerDragEvent.DRAG_CHANGE, latitude, longitude, x, y))
+  }
+
+  fun emitDragEndEvent(x: Float, y: Float) {
+    dispatchEvent(MarkerDragEvent(this, MarkerDragEvent.DRAG_END, latitude, longitude, x, y))
+  }
+
   fun setName(name: String?) {
     this.name = name
   }
@@ -129,12 +275,10 @@ class LuggMarkerView(context: Context) : ReactViewGroup(context) {
   }
 
   fun onDropViewInstance() {
+    scaleUpdateRunnable?.let { removeCallbacks(it) }
+    scaleUpdateRunnable = null
     didLayout = false
     delegate = null
     iconView.removeAllViews()
   }
-
-  companion object {
-    private const val TAG = "Lugg"
-  }
 }

package/android/src/main/java/com/luggmaps/LuggMarkerViewManager.kt

@@ -20,6 +20,14 @@ class LuggMarkerViewManager :
   override fun getName(): String = NAME
   override fun createViewInstance(context: ThemedReactContext): LuggMarkerView = LuggMarkerView(context)
 
+  override fun getExportedCustomDirectEventTypeConstants(): Map<String, Any> =
+    mapOf(
+      "topMarkerPress" to mapOf("registrationName" to "onMarkerPress"),
+      "topMarkerDragStart" to mapOf("registrationName" to "onMarkerDragStart"),
+      "topMarkerDragChange" to mapOf("registrationName" to "onMarkerDragChange"),
+      "topMarkerDragEnd" to mapOf("registrationName" to "onMarkerDragEnd")
+    )
+
   override fun onDropViewInstance(view: LuggMarkerView) {
     super.onDropViewInstance(view)
     view.onDropViewInstance()
@@ -69,6 +77,26 @@ class LuggMarkerViewManager :
     view.setZIndex(zIndex)
   }
 
+  @ReactProp(name = "rotate", defaultDouble = 0.0)
+  override fun setRotate(view: LuggMarkerView, value: Double) {
+    view.setRotate(value.toFloat())
+  }
+
+  @ReactProp(name = "scale", defaultDouble = 1.0)
+  override fun setScale(view: LuggMarkerView, value: Double) {
+    view.setScale(value.toFloat())
+  }
+
+  @ReactProp(name = "rasterize", defaultBoolean = true)
+  override fun setRasterize(view: LuggMarkerView, value: Boolean) {
+    view.setRasterize(value)
+  }
+
+  @ReactProp(name = "draggable", defaultBoolean = false)
+  override fun setDraggable(view: LuggMarkerView, value: Boolean) {
+    view.setDraggable(value)
+  }
+
   companion object {
     const val NAME = "LuggMarkerView"
   }

package/android/src/main/java/com/luggmaps/LuggPackage.kt

@@ -1,13 +1,10 @@
 package com.luggmaps
 
 import com.facebook.react.ReactPackage
-import com.facebook.react.bridge.NativeModule
 import com.facebook.react.bridge.ReactApplicationContext
 import com.facebook.react.uimanager.ViewManager
 
 class LuggPackage : ReactPackage {
   override fun createViewManagers(reactContext: ReactApplicationContext): List<ViewManager<*, *>> =
-    listOf(LuggGoogleMapViewManager(), LuggMarkerViewManager(), LuggMapWrapperViewManager(), LuggPolylineViewManager())
-
-  override fun createNativeModules(reactContext: ReactApplicationContext): List<NativeModule> = emptyList()
+    listOf(LuggMapViewManager(), LuggMarkerViewManager(), LuggMapWrapperViewManager(), LuggPolylineViewManager(), LuggPolygonViewManager())
 }

package/android/src/main/java/com/luggmaps/LuggPolygonView.kt

@@ -0,0 +1,85 @@
+package com.luggmaps
+
+import android.content.Context
+import android.graphics.Color
+import com.facebook.react.views.view.ReactViewGroup
+import com.google.android.gms.maps.model.LatLng
+import com.google.android.gms.maps.model.Polygon
+import com.luggmaps.events.PolygonPressEvent
+import com.luggmaps.extensions.dispatchEvent
+
+interface LuggPolygonViewDelegate {
+  fun polygonViewDidUpdate(polygonView: LuggPolygonView)
+}
+
+class LuggPolygonView(context: Context) : ReactViewGroup(context) {
+  var coordinates: List<LatLng> = emptyList()
+    private set
+
+  var holes: List<List<LatLng>> = emptyList()
+    private set
+
+  var strokeColor: Int = Color.BLACK
+    private set
+
+  var fillColor: Int = Color.argb(77, 0, 0, 0)
+    private set
+
+  var strokeWidth: Float = 1f
+    private set
+
+  var zIndex: Float = 0f
+    private set
+
+  var tappable: Boolean = false
+    private set
+
+  var delegate: LuggPolygonViewDelegate? = null
+  var polygon: Polygon? = null
+
+  init {
+    visibility = GONE
+  }
+
+  fun setCoordinates(coords: List<LatLng>) {
+    coordinates = coords
+  }
+
+  fun setHoles(value: List<List<LatLng>>) {
+    holes = value
+  }
+
+  fun setStrokeColor(color: Int) {
+    strokeColor = color
+  }
+
+  fun setFillColor(color: Int) {
+    fillColor = color
+  }
+
+  fun setStrokeWidth(width: Float) {
+    strokeWidth = width
+  }
+
+  fun setZIndex(value: Float) {
+    zIndex = value
+  }
+
+  fun setTappable(value: Boolean) {
+    tappable = value
+  }
+
+  fun emitPressEvent() {
+    dispatchEvent(PolygonPressEvent(this))
+  }
+
+  fun onAfterUpdateTransaction() {
+    delegate?.polygonViewDidUpdate(this)
+  }
+
+  fun onDropViewInstance() {
+    delegate = null
+    polygon?.remove()
+    polygon = null
+  }
+}

package/android/src/main/java/com/luggmaps/LuggPolygonViewManager.kt

@@ -0,0 +1,100 @@
+package com.luggmaps
+
+import com.facebook.react.bridge.ReadableArray
+import com.facebook.react.module.annotations.ReactModule
+import com.facebook.react.uimanager.ThemedReactContext
+import com.facebook.react.uimanager.ViewGroupManager
+import com.facebook.react.uimanager.ViewManagerDelegate
+import com.facebook.react.uimanager.annotations.ReactProp
+import com.facebook.react.viewmanagers.LuggPolygonViewManagerDelegate
+import com.facebook.react.viewmanagers.LuggPolygonViewManagerInterface
+import com.google.android.gms.maps.model.LatLng
+
+@ReactModule(name = LuggPolygonViewManager.NAME)
+class LuggPolygonViewManager :
+  ViewGroupManager<LuggPolygonView>(),
+  LuggPolygonViewManagerInterface<LuggPolygonView> {
+  private val delegate: ViewManagerDelegate<LuggPolygonView> = LuggPolygonViewManagerDelegate(this)
+
+  override fun getDelegate(): ViewManagerDelegate<LuggPolygonView> = delegate
+  override fun getName(): String = NAME
+  override fun createViewInstance(context: ThemedReactContext): LuggPolygonView = LuggPolygonView(context)
+
+  override fun getExportedCustomDirectEventTypeConstants(): Map<String, Any> =
+    mapOf("topPolygonPress" to mapOf("registrationName" to "onPolygonPress"))
+
+  override fun onDropViewInstance(view: LuggPolygonView) {
+    super.onDropViewInstance(view)
+    view.onDropViewInstance()
+  }
+
+  override fun onAfterUpdateTransaction(view: LuggPolygonView) {
+    super.onAfterUpdateTransaction(view)
+    view.onAfterUpdateTransaction()
+  }
+
+  @ReactProp(name = "coordinates")
+  override fun setCoordinates(view: LuggPolygonView, value: ReadableArray?) {
+    value?.let { array ->
+      val coords = mutableListOf<LatLng>()
+      for (i in 0 until array.size()) {
+        val coord = array.getMap(i)
+        val lat = coord?.getDouble("latitude") ?: 0.0
+        val lng = coord?.getDouble("longitude") ?: 0.0
+        coords.add(LatLng(lat, lng))
+      }
+      view.setCoordinates(coords)
+    }
+  }
+
+  @ReactProp(name = "holes")
+  override fun setHoles(view: LuggPolygonView, value: ReadableArray?) {
+    value?.let { array ->
+      val holesList = mutableListOf<List<LatLng>>()
+      for (i in 0 until array.size()) {
+        val holeArray = array.getArray(i)
+        val hole = mutableListOf<LatLng>()
+        if (holeArray != null) {
+          for (j in 0 until holeArray.size()) {
+            val coord = holeArray.getMap(j)
+            val lat = coord?.getDouble("latitude") ?: 0.0
+            val lng = coord?.getDouble("longitude") ?: 0.0
+            hole.add(LatLng(lat, lng))
+          }
+        }
+        holesList.add(hole)
+      }
+      view.setHoles(holesList)
+    }
+  }
+
+  @ReactProp(name = "strokeColor", customType = "Color")
+  override fun setStrokeColor(view: LuggPolygonView, value: Int?) {
+    view.setStrokeColor(value ?: android.graphics.Color.BLACK)
+  }
+
+  @ReactProp(name = "fillColor", customType = "Color")
+  override fun setFillColor(view: LuggPolygonView, value: Int?) {
+    view.setFillColor(value ?: android.graphics.Color.argb(77, 0, 0, 0))
+  }
+
+  @ReactProp(name = "strokeWidth", defaultDouble = 1.0)
+  override fun setStrokeWidth(view: LuggPolygonView, value: Double) {
+    view.setStrokeWidth(value.toFloat())
+  }
+
+  @ReactProp(name = "tappable")
+  override fun setTappable(view: LuggPolygonView, value: Boolean) {
+    view.setTappable(value)
+  }
+
+  @ReactProp(name = "zIndex", defaultFloat = 0f)
+  override fun setZIndex(view: LuggPolygonView, value: Float) {
+    super.setZIndex(view, value)
+    view.setZIndex(value)
+  }
+
+  companion object {
+    const val NAME = "LuggPolygonView"
+  }
+}

package/android/src/main/java/com/luggmaps/LuggPolylineView.kt

@@ -12,6 +12,8 @@ interface LuggPolylineViewDelegate {
   fun polylineViewDidUpdate(polylineView: LuggPolylineView)
 }
 
+data class AnimatedOptions(val duration: Long = 2150L, val easing: String = "linear", val trailLength: Float = 1f, val delay: Long = 0L)
+
 class LuggPolylineView(context: Context) : ReactViewGroup(context) {
   var coordinates: List<LatLng> = emptyList()
     private set
@@ -25,6 +27,12 @@ class LuggPolylineView(context: Context) : ReactViewGroup(context) {
   var animated: Boolean = false
     private set
 
+  var animatedOptions: AnimatedOptions = AnimatedOptions()
+    private set
+
+  var zIndex: Float = 0f
+    private set
+
   var cachedSpans: List<StyleSpan>? = null
     private set
 
@@ -55,6 +63,14 @@ class LuggPolylineView(context: Context) : ReactViewGroup(context) {
     animated = value
   }
 
+  fun setAnimatedOptions(options: AnimatedOptions) {
+    animatedOptions = options
+  }
+
+  fun setZIndex(value: Float) {
+    zIndex = value
+  }
+
   fun getOrCreateSpans(): List<StyleSpan> {
     cachedSpans?.let { return it }
 

package/android/src/main/java/com/luggmaps/LuggPolylineViewManager.kt

@@ -1,6 +1,7 @@
 package com.luggmaps
 
 import com.facebook.react.bridge.ReadableArray
+import com.facebook.react.bridge.ReadableMap
 import com.facebook.react.module.annotations.ReactModule
 import com.facebook.react.uimanager.ThemedReactContext
 import com.facebook.react.uimanager.ViewGroupManager
@@ -65,6 +66,27 @@ class LuggPolylineViewManager :
     view.setAnimated(value)
   }
 
+  @ReactProp(name = "animatedOptions")
+  override fun setAnimatedOptions(view: LuggPolylineView, value: ReadableMap?) {
+    val options = if (value != null) {
+      AnimatedOptions(
+        duration = if (value.hasKey("duration")) value.getDouble("duration").toLong() else 2150L,
+        easing = if (value.hasKey("easing")) value.getString("easing") ?: "linear" else "linear",
+        trailLength = if (value.hasKey("trailLength")) value.getDouble("trailLength").toFloat() else 1f,
+        delay = if (value.hasKey("delay")) value.getDouble("delay").toLong() else 0L
+      )
+    } else {
+      AnimatedOptions()
+    }
+    view.setAnimatedOptions(options)
+  }
+
+  @ReactProp(name = "zIndex", defaultFloat = 0f)
+  override fun setZIndex(view: LuggPolylineView, value: Float) {
+    super.setZIndex(view, value)
+    view.setZIndex(value)
+  }
+
   companion object {
     const val NAME = "LuggPolylineView"
   }