Merge pull request #4 from shiki/issue/8627-giphy-picker-preview

Preview in Giphy Picker

Author: kwonye

WordPress/src/main/java/org/wordpress/android/ui/giphy/GiphyMediaViewHolder.kt

@@ -34,6 +34,13 @@ class GiphyMediaViewHolder(
      * A function that is called when the thumbnail is clicked.
      */
     private val onClickListener: (GiphyMediaViewModel) -> Unit,
+    /**
+     * A function that is called when the user performs a long press on the thumbnail
+     */
+    private val onLongClickListener: (GiphyMediaViewModel) -> Unit,
+    /**
+     * The view used for this `ViewHolder`.
+     */
     itemView: View,
     /**
      * The dimensions used for the ImageView
@@ -53,14 +60,20 @@ class GiphyMediaViewHolder(
             layoutParams.height = thumbnailViewDimensions.height
 
             setOnClickListener { mediaViewModel?.let(onClickListener) }
+            setOnLongClickListener {
+                val mediaViewModel = mediaViewModel ?: return@setOnLongClickListener false
+                onLongClickListener(mediaViewModel)
+                true
+            }
         }
     }
 
     /**
      * Update the views to use the given [GiphyMediaViewModel]
      *
      * The [mediaViewModel] is optional because we enable placeholders in the paged list created by
-     * [GiphyPickerViewModel]. This causes null values to be bound to [GiphyMediaViewHolder] instances.
+     * [org.wordpress.android.viewmodel.giphy.GiphyPickerViewModel]. This causes null values to be bound to
+     * [GiphyMediaViewHolder] instances.
      */
     override fun bind(item: GiphyMediaViewModel?) {
         super.bind(item)
@@ -126,6 +139,7 @@ class GiphyMediaViewHolder(
         fun create(
             imageManager: ImageManager,
             onClickListener: (GiphyMediaViewModel) -> Unit,
+            onLongClickListener: (GiphyMediaViewModel) -> Unit,
             parent: ViewGroup,
             thumbnailViewDimensions: ThumbnailViewDimensions
         ): GiphyMediaViewHolder {
@@ -135,6 +149,7 @@ class GiphyMediaViewHolder(
             return GiphyMediaViewHolder(
                     imageManager = imageManager,
                     onClickListener = onClickListener,
+                    onLongClickListener = onLongClickListener,
                     itemView = view,
                     thumbnailViewDimensions = thumbnailViewDimensions
             )

WordPress/src/main/java/org/wordpress/android/ui/giphy/GiphyPickerActivity.kt

@@ -20,11 +20,13 @@ import org.wordpress.android.WordPress
 import org.wordpress.android.analytics.AnalyticsTracker
 import org.wordpress.android.fluxc.model.SiteModel
 import org.wordpress.android.ui.giphy.GiphyMediaViewHolder.ThumbnailViewDimensions
+import org.wordpress.android.ui.media.MediaPreviewActivity
 import org.wordpress.android.util.AniUtils
 import org.wordpress.android.util.DisplayUtils
 import org.wordpress.android.util.ToastUtils
 import org.wordpress.android.util.image.ImageManager
 import org.wordpress.android.viewmodel.ViewModelFactory
+import org.wordpress.android.viewmodel.giphy.GiphyMediaViewModel
 import org.wordpress.android.viewmodel.giphy.GiphyPickerViewModel
 import org.wordpress.android.viewmodel.giphy.GiphyPickerViewModel.State
 import javax.inject.Inject
@@ -67,6 +69,7 @@ class GiphyPickerActivity : AppCompatActivity() {
         initializeRecyclerView()
         initializeSearchView()
         initializeSelectionBar()
+        initializePreviewHandlers()
         initializeDownloadHandlers()
         initializeStateChangeHandlers()
     }
@@ -86,7 +89,8 @@ class GiphyPickerActivity : AppCompatActivity() {
         val pagedListAdapter = GiphyPickerPagedListAdapter(
                 imageManager = imageManager,
                 thumbnailViewDimensions = thumbnailViewDimensions,
-                onMediaViewClickListener = viewModel::toggleSelected
+                onMediaViewClickListener = viewModel::toggleSelected,
+                onMediaViewLongClickListener = { showPreview(listOf(it)) }
         )
 
         recycler.apply {
@@ -163,6 +167,30 @@ class GiphyPickerActivity : AppCompatActivity() {
         })
     }
 
+    /**
+     * Set up listener for the Preview button
+     */
+    private fun initializePreviewHandlers() {
+        text_preview.setOnClickListener {
+            val mediaViewModels = viewModel.selectedMediaViewModelList.value?.values?.toList()
+            if (mediaViewModels != null && mediaViewModels.isNotEmpty()) {
+                showPreview(mediaViewModels)
+            }
+        }
+    }
+
+    /**
+     * Show the images of the given [mediaViewModels] in [MediaPreviewActivity]
+     *
+     * @param mediaViewModels A non-empty list
+     */
+    private fun showPreview(mediaViewModels: List<GiphyMediaViewModel>) {
+        check(mediaViewModels.isNotEmpty())
+
+        val uris = mediaViewModels.map { it.previewImageUri.toString() }
+        MediaPreviewActivity.showPreview(this, null, ArrayList(uris), uris.first())
+    }
+
     /**
      * Set up reacting to "Add" button presses and processing the result
      */

WordPress/src/main/java/org/wordpress/android/ui/giphy/GiphyPickerPagedListAdapter.kt

@@ -13,12 +13,14 @@ import org.wordpress.android.viewmodel.giphy.GiphyMediaViewModel
 class GiphyPickerPagedListAdapter(
     private val imageManager: ImageManager,
     private val thumbnailViewDimensions: ThumbnailViewDimensions,
-    private val onMediaViewClickListener: (GiphyMediaViewModel) -> Unit
+    private val onMediaViewClickListener: (GiphyMediaViewModel) -> Unit,
+    private val onMediaViewLongClickListener: (GiphyMediaViewModel) -> Unit
 ) : PagedListAdapter<GiphyMediaViewModel, GiphyMediaViewHolder>(DIFF_CALLBACK) {
     override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): GiphyMediaViewHolder {
         return GiphyMediaViewHolder.create(
                 imageManager = imageManager,
                 onClickListener = onMediaViewClickListener,
+                onLongClickListener = onMediaViewLongClickListener,
                 parent = parent,
                 thumbnailViewDimensions = thumbnailViewDimensions
         )

WordPress/src/main/java/org/wordpress/android/viewmodel/giphy/GiphyMediaViewModel.kt

@@ -25,6 +25,12 @@ interface GiphyMediaViewModel {
      * The thumbnail to show in a list. This is an animated GIF.
      */
     val thumbnailUri: Uri
+    /**
+     * The image to use for previews in the picker
+     *
+     * This should be the `downsized` image which is downsized to be under 2mb.
+     */
+    val previewImageUri: Uri
     /**
      * The large image to download.
      *

WordPress/src/main/java/org/wordpress/android/viewmodel/giphy/MutableGiphyMediaViewModel.kt

@@ -18,6 +18,7 @@ import org.wordpress.android.viewmodel.SingleLiveEvent
 class MutableGiphyMediaViewModel(
     override val id: String,
     override val thumbnailUri: Uri,
+    override val previewImageUri: Uri,
     override val largeImageUri: Uri,
     override val title: String
 ) : GiphyMediaViewModel {
@@ -44,6 +45,7 @@ class MutableGiphyMediaViewModel(
     constructor(media: Media) : this(
             id = media.id,
             thumbnailUri = Uri.parse(media.images.fixedHeightDownsampled.gifUrl),
+            previewImageUri = Uri.parse(media.images.downsized.gifUrl),
             largeImageUri = Uri.parse(media.images.downsizedLarge.gifUrl),
             title = media.title
     )

WordPress/src/test/java/org/wordpress/android/viewmodel/giphy/GiphyPickerViewModelTest.kt

@@ -218,6 +218,7 @@ class GiphyPickerViewModelTest {
             id = UUID.randomUUID().toString(),
             thumbnailUri = mock(),
             largeImageUri = mock(),
+            previewImageUri = mock(),
             title = UUID.randomUUID().toString()
     )
 }