From b1a3d25609fd455ec1bf4f6c9468849a08ab2ac4 Mon Sep 17 00:00:00 2001
From: Gino Miceli <gmiceli@google.com>
Date: Fri, 8 Sep 2023 15:07:18 -0400
Subject: [PATCH 1/3] Offline area map selector mask and outline

---
 .../offline_area_viewport_outline.xml         | 22 +++++++++
 .../layout/offline_base_map_selector_frag.xml | 47 +++++++++++++++++++
 ground/src/main/res/values/colors.xml         |  1 +
 3 files changed, 70 insertions(+)
 create mode 100644 ground/src/main/res/drawable/offline_area_viewport_outline.xml

diff --git a/ground/src/main/res/drawable/offline_area_viewport_outline.xml b/ground/src/main/res/drawable/offline_area_viewport_outline.xml
new file mode 100644
index 0000000000..b523238e64
--- /dev/null
+++ b/ground/src/main/res/drawable/offline_area_viewport_outline.xml
@@ -0,0 +1,22 @@
+<?xml version="1.0" encoding="utf-8"?>
+
+<!--
+  ~ Copyright 2023 Google LLC
+  ~
+  ~ Licensed under the Apache License, Version 2.0 (the "License");
+  ~ you may not use this file except in compliance with the License.
+  ~ You may obtain a copy of the License at
+  ~
+  ~     https://www.apache.org/licenses/LICENSE-2.0
+  ~
+  ~ Unless required by applicable law or agreed to in writing, software
+  ~ distributed under the License is distributed on an "AS IS" BASIS,
+  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+  ~ See the License for the specific language governing permissions and
+  ~ limitations under the License.
+  -->
+
+  <shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle" >
+    <solid android:color="@android:color/transparent" />
+    <stroke android:width="3dp" android:color="@color/md_theme_inversePrimary"/>
+  </shape>
diff --git a/ground/src/main/res/layout/offline_base_map_selector_frag.xml b/ground/src/main/res/layout/offline_base_map_selector_frag.xml
index ea6f2f61eb..80a100129a 100644
--- a/ground/src/main/res/layout/offline_base_map_selector_frag.xml
+++ b/ground/src/main/res/layout/offline_base_map_selector_frag.xml
@@ -74,6 +74,53 @@
           app:layout_constraintEnd_toEndOf="parent"
           app:useCompatPadding="true" />
       </com.google.android.ground.ui.common.TwoLineToolbar>
+
+      <View
+        android:id="@+id/top_mask"
+        android:layout_width="match_parent"
+        android:layout_height="24dp"
+        android:background="@color/blackMapOverlay"
+        android:alpha="0.4"
+        app:layout_constraintTop_toBottomOf="@+id/offline_area_selector_toolbar" />
+
+      <View
+        android:id="@+id/bottom_mask"
+        android:layout_width="match_parent"
+        android:layout_height="80dp"
+        android:background="@color/blackMapOverlay"
+        android:alpha="0.4"
+        app:layout_constraintBottom_toBottomOf="parent" />
+
+      <View
+        android:id="@+id/right_mask"
+        android:layout_width="24dp"
+        android:layout_height="0dp"
+        android:alpha="0.4"
+        android:background="@color/blackMapOverlay"
+        app:layout_constraintTop_toBottomOf="@id/top_mask"
+        app:layout_constraintBottom_toTopOf="@id/bottom_mask"
+        app:layout_constraintRight_toRightOf="parent" />
+
+      <View
+        android:id="@+id/left_mask"
+        android:layout_width="24dp"
+        android:layout_height="0dp"
+        android:background="@color/blackMapOverlay"
+        android:alpha="0.4"
+        app:layout_constraintTop_toBottomOf="@id/top_mask"
+        app:layout_constraintBottom_toTopOf="@id/bottom_mask"
+        app:layout_constraintLeft_toLeftOf="parent" />
+
+      <View
+        android:id="@+id/viewport_outline"
+        android:layout_width="0dp"
+        android:layout_height="0dp"
+        android:background="@drawable/offline_area_viewport_outline"
+        app:layout_constraintTop_toBottomOf="@id/top_mask"
+        app:layout_constraintBottom_toTopOf="@id/bottom_mask"
+        app:layout_constraintLeft_toRightOf="@id/left_mask"
+        app:layout_constraintRight_toLeftOf="@id/right_mask"/>
+
     </androidx.constraintlayout.widget.ConstraintLayout>
   </FrameLayout>
 </layout>
diff --git a/ground/src/main/res/values/colors.xml b/ground/src/main/res/values/colors.xml
index 43db6c4cec..a00e4036ee 100644
--- a/ground/src/main/res/values/colors.xml
+++ b/ground/src/main/res/values/colors.xml
@@ -20,6 +20,7 @@
   <color name="colorMapAccent">#ff9131</color>
   <color name="clusterColor">#6DDD81</color>
   <color name="polyLineColor">#55ffffff</color>
+  <color name="blackMapOverlay">#000000</color>
 
   <!-- Updated Color palette -->
   <color name="md_theme_primary">#006E2C</color>

From 234cb850abc23adcca7f4f98b5cddc33f9d8a154 Mon Sep 17 00:00:00 2001
From: Gino Miceli <gmiceli@google.com>
Date: Fri, 8 Sep 2023 17:48:13 -0400
Subject: [PATCH 2/3] Update Cancel and Download layout

---
 .../selector/OfflineAreaSelectorFragment.kt   |  1 -
 .../selector/OfflineAreaSelectorViewModel.kt  |  4 +
 .../layout/offline_base_map_selector_frag.xml | 85 ++++++++++++-------
 ground/src/main/res/values/dimens.xml         |  4 +-
 ground/src/main/res/values/strings.xml        |  2 +
 ground/src/main/res/values/styles.xml         | 15 +++-
 6 files changed, 75 insertions(+), 36 deletions(-)

diff --git a/ground/src/main/java/com/google/android/ground/ui/offlinebasemap/selector/OfflineAreaSelectorFragment.kt b/ground/src/main/java/com/google/android/ground/ui/offlinebasemap/selector/OfflineAreaSelectorFragment.kt
index 6cc5c97d4d..5c24d64f18 100644
--- a/ground/src/main/java/com/google/android/ground/ui/offlinebasemap/selector/OfflineAreaSelectorFragment.kt
+++ b/ground/src/main/java/com/google/android/ground/ui/offlinebasemap/selector/OfflineAreaSelectorFragment.kt
@@ -56,7 +56,6 @@ class OfflineAreaSelectorFragment : Hilt_OfflineAreaSelectorFragment() {
     val binding = OfflineBaseMapSelectorFragBinding.inflate(inflater, container, false)
     binding.viewModel = viewModel
     binding.lifecycleOwner = this
-    getAbstractActivity().setActionBar(binding.offlineAreaSelectorToolbar, true)
     return binding.root
   }
 
diff --git a/ground/src/main/java/com/google/android/ground/ui/offlinebasemap/selector/OfflineAreaSelectorViewModel.kt b/ground/src/main/java/com/google/android/ground/ui/offlinebasemap/selector/OfflineAreaSelectorViewModel.kt
index 8fce8812ae..f81a5d6d6f 100644
--- a/ground/src/main/java/com/google/android/ground/ui/offlinebasemap/selector/OfflineAreaSelectorViewModel.kt
+++ b/ground/src/main/java/com/google/android/ground/ui/offlinebasemap/selector/OfflineAreaSelectorViewModel.kt
@@ -96,6 +96,10 @@ internal constructor(
     }
   }
 
+  fun onCancelClick() {
+    navigator.navigateUp()
+  }
+
   fun onMapReady(map: Map) {
     map.mapType = MapType.TERRAIN
     tileSources.forEach { map.addTileOverlay(it) }
diff --git a/ground/src/main/res/layout/offline_base_map_selector_frag.xml b/ground/src/main/res/layout/offline_base_map_selector_frag.xml
index 80a100129a..2d207489a3 100644
--- a/ground/src/main/res/layout/offline_base_map_selector_frag.xml
+++ b/ground/src/main/res/layout/offline_base_map_selector_frag.xml
@@ -34,46 +34,34 @@
       android:layout_height="match_parent"
       android:fitsSystemWindows="true">
 
+      <Toolbar
+        android:id="@+id/offline_area_selector_toolbar"
+        android:layout_width="match_parent"
+        android:layout_height="wrap_content"
+        android:minHeight="?attr/actionBarSize"
+        android:elevation="@dimen/toolbar_elevation"
+        app:layout_constraintTop_toTopOf="parent">
+
+        <TextView
+          android:layout_width="match_parent"
+          android:layout_height="wrap_content"
+          android:layout_gravity="center"
+          android:gravity="center"
+          android:text="@string/offline_area_selector_title"
+          android:theme="@style/CenteredToolbarTitle" />
+      </Toolbar>
+
       <androidx.fragment.app.FragmentContainerView
         android:id="@+id/map"
         android:layout_width="match_parent"
         android:layout_height="0dp"
         android:layout_gravity="center"
         app:layout_behavior="com.google.android.ground.ui.home.mapcontainer.MapLayoutBehavior"
-        app:layout_constraintBottom_toBottomOf="parent"
+        app:layout_constraintBottom_toBottomOf="@id/button_buttons"
         app:layout_constraintEnd_toEndOf="parent"
         app:layout_constraintHorizontal_bias="0.5"
         app:layout_constraintStart_toStartOf="parent"
-        app:layout_constraintTop_toBottomOf="@+id/offline_area_selector_toolbar" />
-      <com.google.android.ground.ui.common.TwoLineToolbar
-        android:id="@+id/offline_area_selector_toolbar"
-        android:layout_width="match_parent"
-        android:layout_height="wrap_content"
-        android:elevation="@dimen/toolbar_elevation"
-        android:theme="@style/PrimaryToolbarTheme"
-        app:layout_constraintEnd_toEndOf="parent"
-        app:layout_constraintStart_toStartOf="parent"
-        app:layout_constraintTop_toTopOf="parent"
-        app:title="@string/offline_base_map_selector">
-
-        <com.google.android.material.button.MaterialButton
-          android:id="@+id/download_button"
-          style="@style/ChipButton"
-          android:layout_width="wrap_content"
-          android:layout_height="wrap_content"
-          android:layout_gravity="bottom|end"
-          android:layout_marginEnd="@dimen/chip_button_margin_right"
-          android:layout_marginBottom="@dimen/map_btn_margin_bottom"
-          android:elevation="6dp"
-          android:text="@string/offline_base_map_selector_download"
-          android:onClick="@{() -> viewModel.onDownloadClick()}"
-          app:backgroundTint="@color/colorMapAccent"
-          app:chipIcon="@drawable/ic_area_download"
-          app:icon="@drawable/ic_area_download"
-          app:layout_constraintBottom_toBottomOf="parent"
-          app:layout_constraintEnd_toEndOf="parent"
-          app:useCompatPadding="true" />
-      </com.google.android.ground.ui.common.TwoLineToolbar>
+        app:layout_constraintTop_toBottomOf="@id/offline_area_selector_toolbar" />
 
       <View
         android:id="@+id/top_mask"
@@ -89,7 +77,7 @@
         android:layout_height="80dp"
         android:background="@color/blackMapOverlay"
         android:alpha="0.4"
-        app:layout_constraintBottom_toBottomOf="parent" />
+        app:layout_constraintBottom_toTopOf="@id/button_buttons" />
 
       <View
         android:id="@+id/right_mask"
@@ -121,6 +109,39 @@
         app:layout_constraintLeft_toRightOf="@id/left_mask"
         app:layout_constraintRight_toLeftOf="@id/right_mask"/>
 
+      <LinearLayout
+        android:id="@+id/button_buttons"
+        android:layout_width="match_parent"
+        android:layout_height="90dp"
+        android:orientation="horizontal"
+        android:gravity="top"
+        android:background="@color/md_theme_background"
+        app:layout_constraintBottom_toBottomOf="parent">
+
+        <com.google.android.material.chip.Chip
+          android:layout_width="wrap_content"
+          android:layout_height="wrap_content"
+          style="@style/ChipButton.Secondary"
+          android:layout_weight="0.5"
+          android:layout_marginStart="16dp"
+          android:layout_marginEnd="8dp"
+          android:layout_marginTop="16dp"
+          android:text="@string/offline_area_select_cancel_button"
+          android:onClick="@{() -> viewModel.onCancelClick()}" />
+
+        <com.google.android.material.chip.Chip
+          android:layout_width="wrap_content"
+          android:layout_height="wrap_content"
+          style="@style/ChipButton"
+          android:id="@+id/download_button"
+          android:text="@string/offline_base_map_selector_download"
+          android:layout_weight="0.5"
+          android:layout_marginStart="8dp"
+          android:layout_marginEnd="16dp"
+          android:layout_marginTop="16dp"
+          android:onClick="@{() -> viewModel.onDownloadClick()}" />
+      </LinearLayout>
+
     </androidx.constraintlayout.widget.ConstraintLayout>
   </FrameLayout>
 </layout>
diff --git a/ground/src/main/res/values/dimens.xml b/ground/src/main/res/values/dimens.xml
index f6d1e119e5..958ede8fcd 100644
--- a/ground/src/main/res/values/dimens.xml
+++ b/ground/src/main/res/values/dimens.xml
@@ -50,8 +50,8 @@
   <dimen name="submission_summary_text_padding_right">8dp</dimen>
   <dimen name="submission_summary_text_max_width">128dp</dimen>
   <dimen name="chip_button_padding">14dp</dimen>
-  <dimen name="chip_button_corner_radius">24dp</dimen>
-  <dimen name="chip_button_min_height">48dp</dimen>
+  <dimen name="chip_button_corner_radius">100dp</dimen>
+  <dimen name="chip_button_min_height">40dp</dimen>
   <dimen name="chip_button_text_size">14sp</dimen>
   <dimen name="chip_toolbar_button_corner_radius">20dp</dimen>
   <dimen name="chip_toolbar_button_padding">10dp</dimen>
diff --git a/ground/src/main/res/values/strings.xml b/ground/src/main/res/values/strings.xml
index f5db64555e..4689f98ad1 100644
--- a/ground/src/main/res/values/strings.xml
+++ b/ground/src/main/res/values/strings.xml
@@ -163,4 +163,6 @@
   <string name="contact_survey_organizer_to_obtain_access">Contact your system administrator to request access</string>
   <string name="close_app">Close app</string>
   <string name="warning_sign_out">Warning: If you sign out, all unsaved data will be lost </string>
+  <string name="offline_area_select_cancel_button">Cancel</string>
+  <string name="offline_area_selector_title">Download this area?</string>
 </resources>
diff --git a/ground/src/main/res/values/styles.xml b/ground/src/main/res/values/styles.xml
index 50ef4f4ab8..5e7b2c367e 100644
--- a/ground/src/main/res/values/styles.xml
+++ b/ground/src/main/res/values/styles.xml
@@ -71,6 +71,11 @@
     <item name="android:textColor">?attr/colorOnSurface</item>
   </style>
 
+  <style name="CenteredToolbarTitle">
+    <item name="android:textColor">?attr/colorOnSurface</item>
+    <item name="android:textSize">22sp</item>
+  </style>
+
   <style name="ToolbarSubtitle" parent="TextAppearance.Widget.AppCompat.Toolbar.Subtitle">
     <item name="android:textColor">?attr/colorOnSurfaceVariant</item>
     <item name="android:textSize">12sp</item>
@@ -139,12 +144,21 @@
     <item name="chipStartPadding">@dimen/chip_button_padding</item>
     <item name="chipEndPadding">@dimen/chip_button_padding</item>
     <item name="chipMinHeight">@dimen/chip_button_min_height</item>
+    <item name="android:textAlignment">center</item>
+
     <!-- textColor inside textAppearance stopped working in 28.0.0-rc02. -->
     <item name="chipIconTint">?attr/colorSurface</item>
     <item name="android:textColor">?attr/colorSurface</item>
     <item name="android:textAppearance">@style/ChipButtonText</item>
   </style>
 
+  <style name="ChipButton.Secondary" parent="ChipButton">
+    <item name="chipBackgroundColor">?attr/colorSurface</item>
+    <item name="android:textColor">?attr/colorPrimary</item>
+    <item name="chipStrokeColor">?attr/colorOutline</item>
+    <item name="chipStrokeWidth">1dp</item>
+  </style>
+
   <style name="ChipButton.Toolbar">
     <item name="chipCornerRadius">@dimen/chip_toolbar_button_corner_radius</item>
     <item name="chipStartPadding">@dimen/chip_toolbar_button_padding</item>
@@ -154,7 +168,6 @@
 
   <style name="ChipButtonText">
     <item name="android:textSize">@dimen/chip_button_text_size</item>
-    <item name="android:textStyle">bold</item>
   </style>
 
   <!-- NavDrawer Header -->

From 1fd58f95b7641904f04e2bb379c6e20d1587ea71 Mon Sep 17 00:00:00 2001
From: Gino Miceli <gmiceli@google.com>
Date: Fri, 8 Sep 2023 18:15:22 -0400
Subject: [PATCH 3/3] Remove unused resource

---
 .../res/drawable-anydpi/ic_area_download.xml  | 29 -------------------
 1 file changed, 29 deletions(-)
 delete mode 100644 ground/src/main/res/drawable-anydpi/ic_area_download.xml

diff --git a/ground/src/main/res/drawable-anydpi/ic_area_download.xml b/ground/src/main/res/drawable-anydpi/ic_area_download.xml
deleted file mode 100644
index 30c3f41959..0000000000
--- a/ground/src/main/res/drawable-anydpi/ic_area_download.xml
+++ /dev/null
@@ -1,29 +0,0 @@
-<?xml version="1.0" encoding="utf-8"?>
-
-<!--
-  ~ Copyright 2020 Google LLC
-  ~
-  ~ Licensed under the Apache License, Version 2.0 (the "License");
-  ~ you may not use this file except in compliance with the License.
-  ~ You may obtain a copy of the License at
-  ~
-  ~     https://www.apache.org/licenses/LICENSE-2.0
-  ~
-  ~ Unless required by applicable law or agreed to in writing, software
-  ~ distributed under the License is distributed on an "AS IS" BASIS,
-  ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-  ~ See the License for the specific language governing permissions and
-  ~ limitations under the License.
-  -->
-
-<vector xmlns:android="http://schemas.android.com/apk/res/android"
-    android:width="24dp"
-    android:height="24dp"
-    android:viewportWidth="24"
-    android:viewportHeight="24"
-    android:tint="#FFFFFF"
-    android:alpha="0.8">
-    <path
-        android:fillColor="#FF000000"
-        android:pathData="M19,9h-4V3H9v6H5l7,7 7,-7zM5,18v2h14v-2H5z"/>
-</vector>