diff --git a/app/src/main/java/org/thoughtcrime/securesms/mediapreview/MediaPreviewPlayerControlView.kt b/app/src/main/java/org/thoughtcrime/securesms/mediapreview/MediaPreviewPlayerControlView.kt index 2fa682afa2..c300bc2566 100644 --- a/app/src/main/java/org/thoughtcrime/securesms/mediapreview/MediaPreviewPlayerControlView.kt +++ b/app/src/main/java/org/thoughtcrime/securesms/mediapreview/MediaPreviewPlayerControlView.kt @@ -1,13 +1,24 @@ package org.thoughtcrime.securesms.mediapreview +import android.animation.Animator +import android.animation.Animator.AnimatorListener +import android.annotation.SuppressLint import android.content.Context import android.util.AttributeSet +import android.view.MotionEvent import android.widget.ImageButton import android.widget.LinearLayout +import android.widget.TextView +import androidx.core.content.ContextCompat import androidx.recyclerview.widget.RecyclerView +import com.airbnb.lottie.LottieAnimationView +import com.airbnb.lottie.LottieProperty +import com.airbnb.lottie.model.KeyPath import com.google.android.exoplayer2.ui.PlayerControlView import org.thoughtcrime.securesms.R import org.thoughtcrime.securesms.util.MediaUtil +import kotlin.time.DurationUnit +import kotlin.time.toDuration /** * The bottom bar for the media preview. This includes the standard seek bar as well as playback controls, @@ -23,6 +34,7 @@ class MediaPreviewPlayerControlView @JvmOverloads constructor( val recyclerView: RecyclerView = findViewById(R.id.media_preview_album_rail) private val durationBar: LinearLayout = findViewById(R.id.exo_duration_viewgroup) private val videoControls: LinearLayout = findViewById(R.id.exo_button_viewgroup) + private val durationLabel: TextView = findViewById(R.id.exo_duration) private val shareButton: ImageButton = findViewById(R.id.exo_share) private val forwardButton: ImageButton = findViewById(R.id.exo_forward) @@ -47,12 +59,65 @@ class MediaPreviewPlayerControlView @JvmOverloads constructor( showTimeoutMs = -1 } - fun setVisibility(mediaMode: MediaMode) { + @SuppressLint("SetTextI18n") + fun setMediaMode(mediaMode: MediaMode) { durationBar.visibility = if (mediaMode == MediaMode.VIDEO) VISIBLE else GONE videoControls.visibility = if (mediaMode == MediaMode.VIDEO) VISIBLE else INVISIBLE + if (mediaMode == MediaMode.VIDEO) { + setProgressUpdateListener { position, _ -> + val finalPlayer = player ?: return@setProgressUpdateListener + val remainingDuration = (finalPlayer.duration - position).toDuration(DurationUnit.MILLISECONDS) + val minutes: Long = remainingDuration.inWholeMinutes + val seconds: Long = remainingDuration.inWholeSeconds % 60 + durationLabel.text = "–${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}" + } + } else { + setProgressUpdateListener(null) + } } fun setShareButtonListener(listener: OnClickListener?) = shareButton.setOnClickListener(listener) fun setForwardButtonListener(listener: OnClickListener?) = forwardButton.setOnClickListener(listener) } + +class LottieAnimatedButton @JvmOverloads constructor( + context: Context, + attrs: AttributeSet? = null +) : LottieAnimationView(context, attrs) { + + init { + addValueCallback(KeyPath("**"), LottieProperty.COLOR) { ContextCompat.getColor(context, R.color.signal_colorOnSurface) } + } + + override fun onTouchEvent(event: MotionEvent?): Boolean { + when (event?.action) { + MotionEvent.ACTION_DOWN -> { + speed = 1f + playAnimation() + } + MotionEvent.ACTION_UP -> { + if (isAnimating) { + addAnimatorListener(object : AnimatorListener { + override fun onAnimationEnd(animation: Animator?) { + removeAllAnimatorListeners() + playAnimationReverse() + } + + override fun onAnimationStart(animation: Animator?) {} + override fun onAnimationCancel(animation: Animator?) {} + override fun onAnimationRepeat(animation: Animator?) {} + }) + } else { + playAnimationReverse() + } + } + } + return super.onTouchEvent(event) + } + + private fun playAnimationReverse() { + speed = -1f + playAnimation() + } +} diff --git a/app/src/main/java/org/thoughtcrime/securesms/mediapreview/MediaPreviewV2Fragment.kt b/app/src/main/java/org/thoughtcrime/securesms/mediapreview/MediaPreviewV2Fragment.kt index 3142033067..1584e46a59 100644 --- a/app/src/main/java/org/thoughtcrime/securesms/mediapreview/MediaPreviewV2Fragment.kt +++ b/app/src/main/java/org/thoughtcrime/securesms/mediapreview/MediaPreviewV2Fragment.kt @@ -190,7 +190,7 @@ class MediaPreviewV2Fragment : Fragment(R.layout.fragment_media_preview_v2), Med } else { MediaPreviewPlayerControlView.MediaMode.fromString(currentItem.contentType) } - binding.mediaPreviewPlaybackControls.setVisibility(mediaType) + binding.mediaPreviewPlaybackControls.setMediaMode(mediaType) binding.toolbar.title = getTitleText(currentItem, currentState.showThread) binding.toolbar.subtitle = getSubTitleText(currentItem) diff --git a/app/src/main/res/drawable-v21/circle_touch_highlight_background_material3.xml b/app/src/main/res/drawable-v21/circle_touch_highlight_background_material3.xml new file mode 100644 index 0000000000..787ac0264c --- /dev/null +++ b/app/src/main/res/drawable-v21/circle_touch_highlight_background_material3.xml @@ -0,0 +1,9 @@ + + + + + + + + \ No newline at end of file diff --git a/app/src/main/res/drawable/circle_touch_highlight_background_material3.xml b/app/src/main/res/drawable/circle_touch_highlight_background_material3.xml new file mode 100644 index 0000000000..cde22ffbc6 --- /dev/null +++ b/app/src/main/res/drawable/circle_touch_highlight_background_material3.xml @@ -0,0 +1,8 @@ + + + + + + + + \ No newline at end of file diff --git a/app/src/main/res/drawable/mediarail_media_outline.xml b/app/src/main/res/drawable/mediarail_media_outline.xml index 54e19058e8..785b432e75 100644 --- a/app/src/main/res/drawable/mediarail_media_outline.xml +++ b/app/src/main/res/drawable/mediarail_media_outline.xml @@ -1,6 +1,6 @@ - + @@ -28,13 +28,12 @@ android:includeFontPadding="false" android:paddingLeft="4dp" android:paddingRight="4dp" - android:textColor="#FFBEBEBE" - android:textSize="14sp" /> + android:textColor="@color/signal_colorOnSurface" /> + android:textColor="@color/signal_colorOnSurface" /> @@ -56,26 +54,28 @@ android:layout_height="wrap_content" android:layout_gravity="center" android:layout_marginStart="12dp" - android:layout_marginTop="8dp" android:layout_marginEnd="12dp" android:orientation="horizontal" + android:visibility="gone" app:layoutManager="androidx.recyclerview.widget.LinearLayoutManager" tools:layout_height="64dp" /> + style="@style/ExoMediaButton.Previous" + android:layout_marginStart="8dp" + android:layout_marginEnd="8dp" /> - + android:layout_gravity="center_vertical" + android:background="@drawable/circle_touch_highlight_background_material3" + app:lottie_rawRes="@raw/lottie_15s_skip_back" + app:tint="@color/signal_colorOnSurface" + tools:visibility="visible" /> + style="@style/ExoMediaButton" + android:layout_marginStart="@dimen/media_preview_button_horizontal_margin" + android:layout_marginEnd="@dimen/media_preview_button_horizontal_margin" /> + style="@style/ExoMediaButton" + android:layout_marginStart="@dimen/media_preview_button_horizontal_margin" + android:layout_marginEnd="@dimen/media_preview_button_horizontal_margin" /> + style="@style/MediaPreviewButton" + android:src="@drawable/exo_controls_play" /> + style="@style/MediaPreviewButton" + android:src="@drawable/exo_controls_pause" /> - + android:layout_gravity="center_vertical" + android:background="@drawable/circle_touch_highlight_background_material3" + android:backgroundTint="@color/signal_colorOnSurface" + app:lottie_rawRes="@raw/lottie_15s_skip_forward" + app:tint="@color/signal_colorOnSurface" + tools:visibility="visible" /> + style="@style/ExoMediaButton.Next" + android:layout_marginStart="8dp" + android:layout_marginEnd="8dp" /> + style="@style/ExoMediaButton.VR" + android:layout_marginStart="8dp" + android:layout_marginEnd="8dp" /> diff --git a/app/src/main/res/layout/mediarail_media_item.xml b/app/src/main/res/layout/mediarail_media_item.xml index 2ee28a3628..8549d9b0e7 100644 --- a/app/src/main/res/layout/mediarail_media_item.xml +++ b/app/src/main/res/layout/mediarail_media_item.xml @@ -4,31 +4,31 @@ tools:viewBindingIgnore="true" xmlns:app="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools" - android:layout_width="57dp" - android:layout_height="57dp" - android:layout_margin="2dp" + android:layout_width="46dp" + android:layout_height="46dp" + android:layout_margin="4dp" android:animateLayoutChanges="true"> + app:thumbnail_radius="8dp"/> diff --git a/app/src/main/res/raw/lottie_15s_play_pause.json b/app/src/main/res/raw/lottie_15s_play_pause.json new file mode 100644 index 0000000000..b34b334670 --- /dev/null +++ b/app/src/main/res/raw/lottie_15s_play_pause.json @@ -0,0 +1 @@ +{"v":"4.8.0","meta":{"g":"LottieFiles AE 3.0.2","a":"","k":"","d":"","tc":""},"fr":60,"ip":0,"op":50,"w":704,"h":704,"nm":"Pause","ddd":0,"assets":[],"layers":[{"ddd":0,"ind":1,"ty":4,"nm":"Play","sr":1,"ks":{"o":{"a":1,"k":[{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":0,"s":[100]},{"t":10,"s":[0]}],"ix":11},"r":{"a":1,"k":[{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":0,"s":[0]},{"t":10,"s":[90]}],"ix":10},"p":{"a":0,"k":[352,352,0],"ix":2},"a":{"a":0,"k":[264,264,0],"ix":1},"s":{"a":1,"k":[{"i":{"x":[0.667,0.667,0.667],"y":[1,1,1]},"o":{"x":[0.333,0.333,0.333],"y":[0,0,0]},"t":0,"s":[100,100,100]},{"t":10,"s":[50,50,100]}],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[0,0],[-2.051,-2.95],[0,-3.593],[2.051,-2.95],[3.368,-1.25],[0,0],[0,18.15],[0,0],[-15.752,-9.108]],"o":[[3.368,1.25],[2.051,2.95],[0,3.593],[-2.051,2.95],[0,0],[-15.708,9.108],[0,0],[0,-18.15],[0,0]],"v":[[188.962,-16.544],[197.287,-10.093],[200.438,-0.044],[197.287,10.005],[188.962,16.456],[-171.838,225.456],[-200.438,209],[-200.438,-209],[-171.838,-225.456]],"c":true},"ix":2},"nm":"Path 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"fl","c":{"a":0,"k":[0,0,0,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[288.438,263.999],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Group 1","np":2,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":1800,"st":0,"bm":0},{"ddd":0,"ind":2,"ty":4,"nm":"Pause","sr":1,"ks":{"o":{"a":1,"k":[{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":0,"s":[0]},{"t":10,"s":[100]}],"ix":11},"r":{"a":1,"k":[{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":0,"s":[-90]},{"t":10,"s":[0]}],"ix":10},"p":{"a":0,"k":[352,352,0],"ix":2},"a":{"a":0,"k":[264,264,0],"ix":1},"s":{"a":1,"k":[{"i":{"x":[0.667,0.667,0.667],"y":[1,1,1]},"o":{"x":[0.333,0.333,0.333],"y":[0,0,0]},"t":0,"s":[50,50,100]},{"t":10,"s":[100,100,100]}],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[-6.075,0],[0,0],[0,-6.075],[0,0],[6.075,0],[0,0],[0,6.075],[0,0]],"o":[[0,0],[6.075,0],[0,0],[0,6.075],[0,0],[-6.075,0],[0,0],[0,-6.075]],"v":[[-55,-220],[55,-220],[66,-209],[66,209],[55,220],[-55,220],[-66,209],[-66,-209]],"c":true},"ix":2},"nm":"Path 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"fl","c":{"a":0,"k":[0,0,0,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[374,264],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Group 1","np":2,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false},{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[-6.075,0],[0,0],[0,-6.075],[0,0],[6.075,0],[0,0],[0,6.075],[0,0]],"o":[[0,0],[6.075,0],[0,0],[0,6.075],[0,0],[-6.075,0],[0,0],[0,-6.075]],"v":[[-55,-220],[55,-220],[66,-209],[66,209],[55,220],[-55,220],[-66,209],[-66,-209]],"c":true},"ix":2},"nm":"Path 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"fl","c":{"a":0,"k":[0,0,0,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[154,264],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Group 2","np":2,"cix":2,"bm":0,"ix":2,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":1800,"st":0,"bm":0}],"markers":[]} \ No newline at end of file diff --git a/app/src/main/res/raw/lottie_15s_skip_back.json b/app/src/main/res/raw/lottie_15s_skip_back.json new file mode 100644 index 0000000000..4b8e4d4d1e --- /dev/null +++ b/app/src/main/res/raw/lottie_15s_skip_back.json @@ -0,0 +1 @@ +{"v":"4.8.0","meta":{"g":"LottieFiles AE 3.0.2","a":"","k":"","d":"","tc":""},"fr":60,"ip":0,"op":20,"w":704,"h":704,"nm":"Rewind","ddd":0,"assets":[],"layers":[{"ddd":0,"ind":1,"ty":4,"nm":"Shape Layer 1","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[352,352,0],"ix":2},"a":{"a":0,"k":[264,264,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[2.191,-2.182],[0,0],[0,0],[0,0],[0,0],[0,0],[0,0],[-3.803,1.219],[-4.834,0],[-5.285,-2.182],[-3.674,-4.042],[-1.869,-5.839],[0,-7.315],[1.934,-5.646],[3.867,-4.363],[5.865,-2.502],[7.928,0],[5.543,1.732],[4.383,3.401],[2.643,5.005],[0.258,6.481],[0,0],[-1.869,-3.016],[-3.029,-1.604],[-4.061,0],[-2.643,1.347],[-1.74,2.502],[-0.838,3.401],[0,4.042],[0.967,3.208],[1.998,2.374],[3.029,1.283],[3.996,0],[2.9,-1.604]],"o":[[0,0],[0,0],[0,0],[0,0],[0,0],[0,0],[1.998,-1.219],[3.867,-1.283],[6.703,0],[5.285,2.117],[3.738,4.042],[1.934,5.775],[0,6.417],[-1.869,5.582],[-3.867,4.299],[-5.865,2.438],[-5.994,0],[-5.479,-1.797],[-4.383,-3.465],[-2.578,-5.005],[0,0],[0.451,4.299],[1.869,3.016],[3.094,1.604],[3.674,0],[2.707,-1.412],[1.74,-2.502],[0.838,-3.401],[0,-3.914],[-0.967,-3.272],[-1.998,-2.374],[-2.965,-1.283],[-5.35,0],[-2.836,1.604]],"v":[[-22.575,4.62],[-42.974,-0.289],[-35.143,-71.03],[42.297,-71.03],[42.297,-49.952],[-13.97,-49.952],[-17.644,-17.228],[-8.943,-20.886],[4.109,-22.811],[22.091,-19.538],[35.53,-10.298],[43.941,4.524],[46.841,24.158],[43.941,42.252],[35.336,57.171],[20.738,67.373],[0.048,71.03],[-17.257,68.432],[-32.049,60.636],[-42.587,47.931],[-46.841,30.703],[-21.608,30.703],[-18.127,41.675],[-10.78,48.605],[-0.048,51.011],[9.426,48.99],[16.097,43.119],[19.964,34.264],[21.221,23.099],[19.771,12.416],[15.324,3.946],[7.783,-1.54],[-2.659,-3.465],[-15.034,-1.059]],"c":true},"ix":2},"nm":"Path 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"fl","c":{"a":0,"k":[0,0,0,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[320.076,272.534],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Group 1","np":2,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false},{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[0,0],[0,0],[0,0],[0,0],[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0],[0,0],[0,0],[0,0],[0,0]],"v":[[29.777,-70.26],[29.777,70.26],[4.157,70.26],[4.157,-40.52],[-29.777,-29.355],[-29.777,-49.952],[26.877,-70.26]],"c":true},"ix":2},"nm":"Path 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"fl","c":{"a":0,"k":[0,0,0,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[198.981,271.379],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Group 2","np":2,"cix":2,"bm":0,"ix":2,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":1800,"st":0,"bm":0},{"ddd":0,"ind":2,"ty":4,"nm":"Shape Layer 2","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":1,"k":[{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":0,"s":[0]},{"t":10,"s":[-90]}],"ix":10},"p":{"a":0,"k":[352,352,0],"ix":2},"a":{"a":0,"k":[264,264,0],"ix":1},"s":{"a":0,"k":[-100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[0,0],[7.333,4.215],[0,0],[0,-8.43],[0,0],[0,-105.958],[-121.503,0],[0,120.959],[45.055,40.105],[0,0],[0,-55.832],[103.277,0],[0,102.815],[-82.046,19.698],[0,0],[-7.333,4.215]],"o":[[7.333,-4.215],[0,0],[-7.333,-4.215],[0,0],[-100.419,20.293],[0,120.959],[121.503,0],[0,-64.904],[0,0],[39.102,34.122],[0,102.815],[-103.277,0],[0,-87.728],[0,0],[0,8.43],[0,0]],"v":[[71.5,-164.647],[71.5,-183.615],[-27.5,-240.517],[-44,-231.033],[-44,-191.65],[-220,22.984],[0,242],[220,22.984],[146.587,-140.334],[123.209,-117.061],[187,22.984],[0,209.148],[-187,22.984],[-44,-157.996],[-44,-117.229],[-27.5,-107.745]],"c":true},"ix":2},"nm":"Path 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"fl","c":{"a":0,"k":[0,0,0,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[264,242],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Group 1","np":4,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false},{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[0,0],[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0],[0,0]],"v":[[-264,-264],[264,-264],[264,264],[-264,264]],"c":true},"ix":2},"nm":"Path 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"tr","p":{"a":0,"k":[264,264],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Group 2","np":3,"cix":2,"bm":0,"ix":2,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":1800,"st":0,"bm":0}],"markers":[]} \ No newline at end of file diff --git a/app/src/main/res/raw/lottie_15s_skip_forward.json b/app/src/main/res/raw/lottie_15s_skip_forward.json new file mode 100644 index 0000000000..db922af4fc --- /dev/null +++ b/app/src/main/res/raw/lottie_15s_skip_forward.json @@ -0,0 +1 @@ +{"v":"4.8.0","meta":{"g":"LottieFiles AE 3.0.2","a":"","k":"","d":"","tc":""},"fr":60,"ip":0,"op":20,"w":704,"h":704,"nm":"Fast Forward","ddd":0,"assets":[],"layers":[{"ddd":0,"ind":1,"ty":4,"nm":"Shape Layer 1","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":0,"k":0,"ix":10},"p":{"a":0,"k":[352,352,0],"ix":2},"a":{"a":0,"k":[264,264,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[2.191,-2.182],[0,0],[0,0],[0,0],[0,0],[0,0],[0,0],[-3.803,1.219],[-4.834,0],[-5.285,-2.182],[-3.674,-4.042],[-1.869,-5.839],[0,-7.315],[1.934,-5.646],[3.867,-4.363],[5.865,-2.502],[7.928,0],[5.543,1.732],[4.383,3.401],[2.643,5.005],[0.258,6.481],[0,0],[-1.869,-3.016],[-3.029,-1.604],[-4.061,0],[-2.643,1.347],[-1.74,2.502],[-0.838,3.401],[0,4.042],[0.967,3.208],[1.998,2.374],[3.029,1.283],[3.996,0],[2.9,-1.604]],"o":[[0,0],[0,0],[0,0],[0,0],[0,0],[0,0],[1.998,-1.219],[3.867,-1.283],[6.703,0],[5.285,2.117],[3.738,4.042],[1.934,5.775],[0,6.417],[-1.869,5.582],[-3.867,4.299],[-5.865,2.438],[-5.994,0],[-5.479,-1.797],[-4.383,-3.465],[-2.578,-5.005],[0,0],[0.451,4.299],[1.869,3.016],[3.094,1.604],[3.674,0],[2.707,-1.412],[1.74,-2.502],[0.838,-3.401],[0,-3.914],[-0.967,-3.272],[-1.998,-2.374],[-2.965,-1.283],[-5.35,0],[-2.836,1.604]],"v":[[-22.575,4.62],[-42.974,-0.289],[-35.143,-71.03],[42.297,-71.03],[42.297,-49.952],[-13.97,-49.952],[-17.644,-17.228],[-8.943,-20.886],[4.109,-22.811],[22.091,-19.538],[35.53,-10.298],[43.941,4.524],[46.841,24.158],[43.941,42.252],[35.336,57.171],[20.738,67.373],[0.048,71.03],[-17.257,68.432],[-32.049,60.636],[-42.587,47.931],[-46.841,30.703],[-21.608,30.703],[-18.127,41.675],[-10.78,48.605],[-0.048,51.011],[9.426,48.99],[16.097,43.119],[19.964,34.264],[21.221,23.099],[19.771,12.416],[15.324,3.946],[7.783,-1.54],[-2.659,-3.465],[-15.034,-1.059]],"c":true},"ix":2},"nm":"Path 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"fl","c":{"a":0,"k":[0,0,0,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[320.076,272.534],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Group 1","np":2,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false},{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[0,0],[0,0],[0,0],[0,0],[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0],[0,0],[0,0],[0,0],[0,0]],"v":[[29.777,-70.26],[29.777,70.26],[4.157,70.26],[4.157,-40.52],[-29.777,-29.355],[-29.777,-49.952],[26.877,-70.26]],"c":true},"ix":2},"nm":"Path 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"fl","c":{"a":0,"k":[0,0,0,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[198.981,271.379],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Group 2","np":2,"cix":2,"bm":0,"ix":2,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":1800,"st":0,"bm":0},{"ddd":0,"ind":2,"ty":4,"nm":"Shape Layer 2","sr":1,"ks":{"o":{"a":0,"k":100,"ix":11},"r":{"a":1,"k":[{"i":{"x":[0.667],"y":[1]},"o":{"x":[0.333],"y":[0]},"t":0,"s":[0]},{"t":10,"s":[90]}],"ix":10},"p":{"a":0,"k":[352,352,0],"ix":2},"a":{"a":0,"k":[264,264,0],"ix":1},"s":{"a":0,"k":[100,100,100],"ix":6}},"ao":0,"shapes":[{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[0,0],[7.333,4.215],[0,0],[0,-8.43],[0,0],[0,-105.958],[-121.503,0],[0,120.959],[45.055,40.105],[0,0],[0,-55.832],[103.277,0],[0,102.815],[-82.046,19.698],[0,0],[-7.333,4.215]],"o":[[7.333,-4.215],[0,0],[-7.333,-4.215],[0,0],[-100.419,20.293],[0,120.959],[121.503,0],[0,-64.904],[0,0],[39.102,34.122],[0,102.815],[-103.277,0],[0,-87.728],[0,0],[0,8.43],[0,0]],"v":[[71.5,-164.647],[71.5,-183.615],[-27.5,-240.517],[-44,-231.033],[-44,-191.65],[-220,22.984],[0,242],[220,22.984],[146.587,-140.334],[123.209,-117.061],[187,22.984],[0,209.148],[-187,22.984],[-44,-157.996],[-44,-117.229],[-27.5,-107.745]],"c":true},"ix":2},"nm":"Path 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"fl","c":{"a":0,"k":[0,0,0,1],"ix":4},"o":{"a":0,"k":100,"ix":5},"r":1,"bm":0,"nm":"Fill 1","mn":"ADBE Vector Graphic - Fill","hd":false},{"ty":"tr","p":{"a":0,"k":[264,242],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Group 1","np":4,"cix":2,"bm":0,"ix":1,"mn":"ADBE Vector Group","hd":false},{"ty":"gr","it":[{"ind":0,"ty":"sh","ix":1,"ks":{"a":0,"k":{"i":[[0,0],[0,0],[0,0],[0,0]],"o":[[0,0],[0,0],[0,0],[0,0]],"v":[[-264,-264],[264,-264],[264,264],[-264,264]],"c":true},"ix":2},"nm":"Path 1","mn":"ADBE Vector Shape - Group","hd":false},{"ty":"tr","p":{"a":0,"k":[264,264],"ix":2},"a":{"a":0,"k":[0,0],"ix":1},"s":{"a":0,"k":[100,100],"ix":3},"r":{"a":0,"k":0,"ix":6},"o":{"a":0,"k":100,"ix":7},"sk":{"a":0,"k":0,"ix":4},"sa":{"a":0,"k":0,"ix":5},"nm":"Transform"}],"nm":"Group 2","np":3,"cix":2,"bm":0,"ix":2,"mn":"ADBE Vector Group","hd":false}],"ip":0,"op":1800,"st":0,"bm":0}],"markers":[]} \ No newline at end of file diff --git a/app/src/main/res/values/colors.xml b/app/src/main/res/values/colors.xml index f8015ed266..60f1bcde47 100644 --- a/app/src/main/res/values/colors.xml +++ b/app/src/main/res/values/colors.xml @@ -41,6 +41,7 @@ #4d4d4d #400099cc + #14E2E1E5 #ffffffff #ff333333 diff --git a/app/src/main/res/values/dimens.xml b/app/src/main/res/values/dimens.xml index 5443e324a9..dd3d27e2e9 100644 --- a/app/src/main/res/values/dimens.xml +++ b/app/src/main/res/values/dimens.xml @@ -236,5 +236,9 @@ 76dp 20dp 24dp - 20dp + 24dp + 16dp + 48dp + 48dp + 8dp diff --git a/app/src/main/res/values/styles.xml b/app/src/main/res/values/styles.xml index 85b7d58ffb..8a44b57477 100644 --- a/app/src/main/res/values/styles.xml +++ b/app/src/main/res/values/styles.xml @@ -520,4 +520,11 @@ 24sp center +