@iternio/react-native-auto-play 0.5.14-beta.1 → 0.6.1

package/android/src/main/java/com/margelo/nitro/swe/iternio/reactnativeautoplay/template/GridTemplate.kt

@@ -1,14 +1,19 @@
 package com.margelo.nitro.swe.iternio.reactnativeautoplay.template
 
 import androidx.car.app.CarContext
+import androidx.car.app.annotations.ExperimentalCarApi
 import androidx.car.app.model.GridItem
+import androidx.car.app.model.GridSection
 import androidx.car.app.model.GridTemplate
 import androidx.car.app.model.ItemList
+import androidx.car.app.model.SectionedItemTemplate
 import androidx.car.app.model.Template
 import com.margelo.nitro.swe.iternio.reactnativeautoplay.GridTemplateConfig
+import com.margelo.nitro.swe.iternio.reactnativeautoplay.GridImageSize
 import com.margelo.nitro.swe.iternio.reactnativeautoplay.NitroAction
 import com.margelo.nitro.swe.iternio.reactnativeautoplay.NitroGridButton
 
+@OptIn(ExperimentalCarApi::class)
 class GridTemplate(context: CarContext, config: GridTemplateConfig) :
     AndroidAutoTemplate<GridTemplateConfig>(context, config) {
 
@@ -18,7 +23,33 @@ class GridTemplate(context: CarContext, config: GridTemplateConfig) :
     override val autoDismissMs = config.autoDismissMs
 
     override fun parse(): Template {
-        val template = GridTemplate.Builder().apply {
+        val imageSize = config.imageSize
+        val template = when {
+            // SectionedItemTemplate (needed for per-item imageSize) is not a valid content
+            // template for MapWithContentTemplate, so imageSize is ignored while mapConfig is set.
+            config.mapConfig != null -> createGridTemplate()
+            imageSize == null || imageSize == GridImageSize.UNSET -> createGridTemplate()
+            else -> createSizedGridTemplate(imageSize)
+        }
+
+        return Parser.parseMapWithContentConfig(context, config.mapConfig, template)
+    }
+
+    private fun createGridTemplate(): Template = GridTemplate.Builder().apply {
+        setHeader(Parser.parseHeader(context, config.title, config.headerActions))
+
+        if (config.buttons.isEmpty()) {
+            setLoading(true)
+            return@apply
+        }
+
+        setSingleList(ItemList.Builder().apply {
+            config.buttons.forEach { button -> addItem(createGridItem(button)) }
+        }.build())
+    }.build()
+
+    private fun createSizedGridTemplate(imageSize: GridImageSize): Template =
+        SectionedItemTemplate.Builder().apply {
             setHeader(Parser.parseHeader(context, config.title, config.headerActions))
 
             if (config.buttons.isEmpty()) {
@@ -26,20 +57,23 @@ class GridTemplate(context: CarContext, config: GridTemplateConfig) :
                 return@apply
             }
 
-            setSingleList(ItemList.Builder().apply {
-                config.buttons.forEachIndexed { index, button ->
-                    addItem(GridItem.Builder().apply {
-                        setTitle(Parser.parseText(button.title))
-                        setOnClickListener(button.onPress)
-                        button.image.let { image ->
-                            setImage(Parser.parseImage(context, image))
-                        }
-                    }.build())
-                }
+            addSection(GridSection.Builder().apply {
+                setItemSize(imageSize.toItemSize())
+                config.buttons.forEach { button -> addItem(createGridItem(button)) }
             }.build())
         }.build()
 
-        return Parser.parseMapWithContentConfig(context, config.mapConfig, template)
+    private fun createGridItem(button: NitroGridButton): GridItem = GridItem.Builder().apply {
+        setTitle(Parser.parseText(button.title))
+        setOnClickListener(button.onPress)
+        setImage(Parser.parseImage(context, button.image))
+    }.build()
+
+    private fun GridImageSize.toItemSize(): Int = when (this) {
+        GridImageSize.LARGE -> GridSection.ITEM_SIZE_LARGE
+        GridImageSize.MEDIUM -> GridSection.ITEM_SIZE_MEDIUM
+        GridImageSize.SMALL -> GridSection.ITEM_SIZE_SMALL
+        GridImageSize.UNSET -> error("An unset grid image size has no item size")
     }
 
     override fun setTemplateHeaderActions(headerActions: Array<NitroAction>?) {
@@ -72,4 +106,4 @@ class GridTemplate(context: CarContext, config: GridTemplateConfig) :
         config = config.copy(buttons = buttons)
         super.applyConfigUpdate()
     }
-}
+}

package/android/src/main/java/com/margelo/nitro/swe/iternio/reactnativeautoplay/template/Parser.kt

@@ -36,6 +36,7 @@ import androidx.car.app.navigation.model.TravelEstimate
 import androidx.core.graphics.createBitmap
 import androidx.core.graphics.drawable.IconCompat
 import androidx.core.graphics.drawable.toBitmap
+import androidx.core.net.toUri
 import com.facebook.datasource.DataSources
 import com.facebook.drawee.backends.pipeline.Fresco
 import com.facebook.imagepipeline.image.CloseableBitmap
@@ -51,6 +52,7 @@ import com.margelo.nitro.swe.iternio.reactnativeautoplay.DurationWithTimeZone
 import com.margelo.nitro.swe.iternio.reactnativeautoplay.ForkType
 import com.margelo.nitro.swe.iternio.reactnativeautoplay.GlyphImage
 import com.margelo.nitro.swe.iternio.reactnativeautoplay.KeepType
+import com.margelo.nitro.swe.iternio.reactnativeautoplay.ListImageType
 import com.margelo.nitro.swe.iternio.reactnativeautoplay.ListTemplateConfig
 import com.margelo.nitro.swe.iternio.reactnativeautoplay.ManeuverType
 import com.margelo.nitro.swe.iternio.reactnativeautoplay.NitroAction
@@ -81,9 +83,12 @@ import java.util.Calendar
 import java.util.Locale
 import java.util.TimeZone
 import kotlin.math.abs
-import androidx.core.net.toUri
 
 object Parser {
+    // IMAGE_TYPE_MEDIUM was added to androidx.car.app in 1.8.0. Keep the protocol value here
+    // while this library continues to depend on 1.7.0.
+    private const val ROW_IMAGE_TYPE_MEDIUM = 16
+
     const val TAG = "Parser"
 
     fun parseHeader(
@@ -177,7 +182,11 @@ object Parser {
         }.build()
     }
 
-    fun parseAction(context: CarContext, action: NitroAction, useParkedOnlyClickListener: Boolean = false): Action {
+    fun parseAction(
+        context: CarContext,
+        action: NitroAction,
+        useParkedOnlyClickListener: Boolean = false
+    ): Action {
         if (action.type == NitroActionType.APPICON) {
             return Action.APP_ICON
         }
@@ -214,11 +223,21 @@ object Parser {
     }
 
     fun parseImage(context: CarContext, image: Variant_GlyphImage_AssetImage_RemoteImage): CarIcon {
-        return parseImage(context, image.asFirstOrNull(), image.asSecondOrNull(), image.asThirdOrNull())
+        return parseImage(
+            context,
+            image.asFirstOrNull(),
+            image.asSecondOrNull(),
+            image.asThirdOrNull()
+        )
     }
 
     fun parseImage(context: CarContext, image: NitroImage): CarIcon {
-        return parseImage(context, image.asFirstOrNull(), image.asSecondOrNull(), image.asThirdOrNull())
+        return parseImage(
+            context,
+            image.asFirstOrNull(),
+            image.asSecondOrNull(),
+            image.asThirdOrNull()
+        )
     }
 
     fun parseImage(
@@ -229,8 +248,19 @@ object Parser {
     ): CarIcon {
         val bitmap = parseImageToBitmap(context, glyphImage, assetImage, remoteImage)
 
+        // the tint recolors every opaque pixel, so it would also fill the background drawn in SymbolFont
+        val hasGlyphBackground =
+            glyphImage != null && (glyphImage.backgroundColor.get(context) ushr 24) != 0
+
+        val applyDefaultTint = !hasGlyphBackground && (glyphImage?.color?.isDefault
+            ?: assetImage?.color?.isDefault ?: remoteImage?.color?.isDefault ?: false)
+
         bitmap?.let {
-            return CarIcon.Builder(IconCompat.createWithBitmap(it)).build()
+            return CarIcon.Builder(IconCompat.createWithBitmap(it)).apply {
+                if (applyDefaultTint) {
+                    setTint(CarColor.DEFAULT)
+                }
+            }.build()
         }
 
         // remote images might fail to load so we provide some placeholder then
@@ -397,7 +427,13 @@ object Parser {
                         addText(parseText(detailedText))
                     }
                     row.image?.let { image ->
-                        setImage(parseImage(context, image))
+                        val parsedImage = parseImage(context, image)
+                        val imageType = row.imageType
+                        if (imageType == null) {
+                            setImage(parsedImage)
+                        } else {
+                            setImage(parsedImage, imageType.toRowImageType())
+                        }
                     }
                     row.browsable?.let { browsable ->
                         setBrowsable(browsable)
@@ -426,6 +462,14 @@ object Parser {
         }.build()
     }
 
+    private fun ListImageType.toRowImageType(): Int = when (this) {
+        ListImageType.LARGE -> Row.IMAGE_TYPE_LARGE
+        ListImageType.MEDIUM -> ROW_IMAGE_TYPE_MEDIUM
+        ListImageType.SMALL -> Row.IMAGE_TYPE_SMALL
+        ListImageType.EXTRA_SMALL -> Row.IMAGE_TYPE_EXTRA_SMALL
+        ListImageType.ICON -> Row.IMAGE_TYPE_ICON
+    }
+
     fun formatToTimestamp(time: DurationWithTimeZone): String {
         val calendar = Calendar.getInstance().apply {
             add(Calendar.SECOND, time.seconds.toInt())
@@ -591,10 +635,14 @@ object Parser {
     private fun fetchSync(context: CarContext, imageRequest: ImageRequest): Bitmap? {
         val dataSource = try {
             Fresco.getImagePipeline().fetchDecodedImage(imageRequest, context)
-        } catch (_: Exception) { return null }
+        } catch (_: Exception) {
+            return null
+        }
         val result = try {
             DataSources.waitForFinalResult(dataSource)
-        } catch (_: Exception) { dataSource.close(); return null }
+        } catch (_: Exception) {
+            dataSource.close(); return null
+        }
         val image = result?.get()
         try {
             if (image is CloseableBitmap) {
@@ -602,10 +650,14 @@ object Parser {
                 // whose backing bitmap has already been recycled or failed to allocate;
                 // copy() can also throw (e.g., OOM on very large remote images). Either
                 // way we return null so the caller falls back to a placeholder icon.
-                return image.underlyingBitmap?.copy(Bitmap.Config.ARGB_8888, false)
+                return image.underlyingBitmap.copy(Bitmap.Config.ARGB_8888, false)
             } else if (image is CloseableXml) {
                 val drawable = image.buildDrawable()
-                return drawable?.toBitmap(width = image.width, height = image.height, Bitmap.Config.ARGB_8888)
+                return drawable?.toBitmap(
+                    width = image.width,
+                    height = image.height,
+                    Bitmap.Config.ARGB_8888
+                )
             }
         } catch (_: Exception) {
             // Any decode/copy failure (OOM, recycled bitmap, invalid config, …) should
@@ -740,10 +792,12 @@ object Parser {
                 }
                 nitroManeuver.angle?.let { roundaboutExitAngle ->
                     if (nitroManeuver.trafficSide == TrafficSide.LEFT) {
-                        val angle = ((180 + roundaboutExitAngle) % 360).toInt().let { if (it == 0) 360 else it }
+                        val angle = ((180 + roundaboutExitAngle) % 360).toInt()
+                            .let { if (it == 0) 360 else it }
                         setRoundaboutExitAngle(angle)
                     } else {
-                        val angle = ((180 - roundaboutExitAngle) % 360).toInt().let { if (it == 0) 360 else it }
+                        val angle = ((180 - roundaboutExitAngle) % 360).toInt()
+                            .let { if (it == 0) 360 else it }
                         setRoundaboutExitAngle(angle)
                     }
                 }
@@ -822,7 +876,7 @@ object Parser {
             mapConfig.mapButtons?.let { mapButtons ->
                 setMapController(
                     MapController.Builder().apply {
-                        setMapActionStrip(Parser.parseMapActions(context, mapButtons)).build()
+                        setMapActionStrip(parseMapActions(context, mapButtons)).build()
                         setPanModeListener { isInPanMode ->
                             mapConfig.onDidChangePanningInterface?.let {
                                 it(isInPanMode)
@@ -832,8 +886,8 @@ object Parser {
                 )
             }
             mapConfig.headerActions?.let { headerActions ->
-                setActionStrip(Parser.parseMapHeaderActions(context, headerActions))
+                setActionStrip(parseMapHeaderActions(context, headerActions))
             }
         }.build()
     }
-}
+}

package/ios/Types.swift

@@ -20,4 +20,7 @@ enum AutoPlayError: LocalizedError {
     case noUiWindow(String)
     case initReactRootViewFailed(String)
     case voiceInputCancelled
+    case rootTemplateNotMapTemplate(String)
+    case templateIsMapPanel(String)
+    case mapTemplateNotVisible(String)
 }

package/ios/extensions/UIImage+Toggle.swift

@@ -10,9 +10,12 @@ import UIKit
 extension UIImage {
     static func makeToggleImage(
         enabled: Bool,
-        maximumImageSize: CGSize
+        maximumImageSize: CGSize,
+        traitCollection: UITraitCollection
     ) -> UIImage {
-        let renderer = UIGraphicsImageRenderer(size: maximumImageSize)
+        let format = UIGraphicsImageRendererFormat()
+        format.scale = traitCollection.displayScale
+        let renderer = UIGraphicsImageRenderer(size: maximumImageSize, format: format)
         return renderer.image { ctx in
             // Draw the track as a pill, centered vertically
             let trackHeight = maximumImageSize.height * 0.5

package/ios/hybrid/HybridAutoPlay.swift

@@ -160,7 +160,7 @@ class HybridAutoPlay: HybridAutoPlaySpec {
                     templateId: templateId
                 )
 
-                let carPlayTemplate = template.getTemplate()
+                let carPlayTemplate = try template.getTemplate()
 
                 if carPlayTemplate is CPMapTemplate {
                     try await MainActor.run {
@@ -192,23 +192,35 @@ class HybridAutoPlay: HybridAutoPlaySpec {
 
                 await template.invalidate()
 
-                let carPlayTemplate = template.getTemplate()
-
-                if carPlayTemplate is CPAlertTemplate {
-                    let animated = try await !interfaceController.dismissTemplate(
-                        animated: false
-                    )
-
-                    let _ = try await interfaceController.presentTemplate(
-                        carPlayTemplate,
-                        animated: animated
+                if #available(iOS 27.0, *), let panel = template.getPanel() as? CPMapPanel {
+                    /// since only the top most panel gets a panelDidHide call when pressing the close button
+                    /// we hide it globaly to avoid orphaned panels on the navigation stack
+                    panel.showsCloseButton = false
+                    
+                    try await interfaceController.pushPanel(
+                        panel,
+                        templateId: templateId
                     )
                 }
                 else {
-                    let _ = try await interfaceController.pushTemplate(
-                        carPlayTemplate,
-                        animated: true
-                    )
+                    let carPlayTemplate = try template.getTemplate()
+
+                    if carPlayTemplate is CPAlertTemplate {
+                        let animated = try await !interfaceController.dismissTemplate(
+                            animated: false
+                        )
+
+                        let _ = try await interfaceController.presentTemplate(
+                            carPlayTemplate,
+                            animated: animated
+                        )
+                    }
+                    else {
+                        let _ = try await interfaceController.pushTemplate(
+                            carPlayTemplate,
+                            animated: true
+                        )
+                    }
                 }
 
                 if let autoDismissMs = template.autoDismissMs {
@@ -217,7 +229,7 @@ class HybridAutoPlay: HybridAutoPlaySpec {
                             nanoseconds: UInt64(autoDismissMs) * 1_000_000
                         )
 
-                        if interfaceController.topTemplateId == templateId
+                        if interfaceController.isTopEntry(templateId: templateId)
                             || interfaceController.interfaceController
                                 .presentedTemplate?.id == templateId
                         {

package/ios/hybrid/HybridMapTemplate.swift

@@ -147,11 +147,15 @@ class HybridMapTemplate: HybridMapTemplateSpec {
         }
     }
 
-    func startNavigation(templateId: String, trip: TripConfig) throws {
-        try RootModule.withAutoPlayTemplate(templateId: templateId) {
-            (template: MapTemplate) in
-            let trip = Parser.parseTrip(tripConfig: trip)
-            template.startNavigation(trip: trip)
+    func startNavigation(templateId: String, trip: TripConfig) throws -> Promise<Void> {
+        return Promise.async {
+            try await MainActor.run {
+                try RootModule.withAutoPlayTemplate(templateId: templateId) {
+                    (template: MapTemplate) in
+                    let trip = Parser.parseTrip(tripConfig: trip)
+                    template.startNavigation(trip: trip)
+                }
+            }
         }
     }
 
@@ -168,4 +172,17 @@ class HybridMapTemplate: HybridMapTemplateSpec {
             template.setManeuverState(state: state)
         }
     }
+
+    func updateOptionsPanel(templateId: String, config: NitroOptionsPanelConfig?) throws
+        -> Promise<Void>
+    {
+        return Promise.async {
+            try await MainActor.run {
+                try RootModule.withAutoPlayTemplate(templateId: templateId) {
+                    (template: MapTemplate) in
+                    template.updateOptionsPanel(config: config)
+                }
+            }
+        }
+    }
 }