Issue #910: Integrate feature-readerview component (#2269)

Closes #908, Closes #910, Closes #911, Closes #912

Co-authored-by: Jonathan Almeida <jalmeida@mozilla.com>
nightly-build-test
Christian Sadilek 5 years ago committed by Jeff Boek
parent 49ac75c8b2
commit 9b0422b062

@ -287,6 +287,7 @@ dependencies {
implementation Deps.mozilla_feature_findinpage
implementation Deps.mozilla_feature_session_bundling
implementation Deps.mozilla_feature_site_permissions
implementation Deps.mozilla_feature_readerview
implementation Deps.mozilla_service_firefox_accounts
implementation Deps.mozilla_service_fretboard

@ -39,6 +39,7 @@ import mozilla.components.feature.contextmenu.ContextMenuFeature
import mozilla.components.feature.downloads.DownloadsFeature
import mozilla.components.feature.intent.IntentProcessor
import mozilla.components.feature.prompts.PromptFeature
import mozilla.components.feature.readerview.ReaderViewFeature
import mozilla.components.feature.session.FullScreenFeature
import mozilla.components.feature.session.SessionFeature
import mozilla.components.feature.session.SessionUseCases
@ -101,6 +102,7 @@ class BrowserFragment : Fragment(), BackHandler, CoroutineScope,
private val promptsFeature = ViewBoundFeatureWrapper<PromptFeature>()
private val findInPageIntegration = ViewBoundFeatureWrapper<FindInPageIntegration>()
private val toolbarIntegration = ViewBoundFeatureWrapper<ToolbarIntegration>()
private val readerViewFeature = ViewBoundFeatureWrapper<ReaderViewFeature>()
private val sitePermissionsFeature = ViewBoundFeatureWrapper<SitePermissionsFeature>()
private val fullScreenFeature = ViewBoundFeatureWrapper<FullScreenFeature>()
private val thumbnailsFeature = ViewBoundFeatureWrapper<ThumbnailsFeature>()
@ -286,6 +288,24 @@ class BrowserFragment : Fragment(), BackHandler, CoroutineScope,
view = view
)
readerViewFeature.set(
feature = ReaderViewFeature(
requireContext(),
requireComponents.core.engine,
requireComponents.core.sessionManager,
view.readerViewControlsBar
) {
getManagedEmitter<QuickActionChange>().apply {
onNext(QuickActionChange.ReadableStateChange(it))
onNext(QuickActionChange.ReaderActiveStateChange(
sessionManager.selectedSession?.readerMode ?: false)
)
}
},
owner = this,
view = view
)
val actionEmitter = ActionBusFactory.get(this).getManagedEmitter(SearchAction::class.java)
customTabSessionId?.let {
@ -380,8 +400,24 @@ class BrowserFragment : Fragment(), BackHandler, CoroutineScope,
bookmarkTapped()
}
is QuickActionAction.ReadPressed -> {
requireComponents.analytics.metrics.track(Event.QuickActionSheetReadTapped)
ItsNotBrokenSnack(context!!).showSnackbar(issueNumber = "908")
readerViewFeature.withFeature { feature ->
requireComponents.analytics.metrics.track(Event.QuickActionSheetReadTapped)
val actionEmitter = getManagedEmitter<QuickActionChange>()
val enabled = requireComponents.core.sessionManager.selectedSession?.readerMode ?: false
if (enabled) {
feature.hideReaderView()
actionEmitter.onNext(QuickActionChange.ReaderActiveStateChange(false))
} else {
feature.showReaderView()
actionEmitter.onNext(QuickActionChange.ReaderActiveStateChange(true))
}
}
}
is QuickActionAction.ReadAppearancePressed -> {
// TODO telemetry: https://github.com/mozilla-mobile/fenix/issues/2267
readerViewFeature.withFeature { feature ->
feature.showControls()
}
}
}
}
@ -454,6 +490,7 @@ class BrowserFragment : Fragment(), BackHandler, CoroutineScope,
return when {
findInPageIntegration.onBackPressed() -> true
fullScreenFeature.onBackPressed() -> true
readerViewFeature.onBackPressed() -> true
sessionFeature.onBackPressed() -> true
else -> false
}

@ -18,7 +18,8 @@ class QuickActionComponent(
bus: ActionBusFactory,
override var initialState: QuickActionState = QuickActionState(
readable = false,
bookmarked = false
bookmarked = false,
readerActive = false
)
) : UIComponent<QuickActionState, QuickActionAction, QuickActionChange>(
bus.getManagedEmitter(QuickActionAction::class.java),
@ -33,6 +34,9 @@ class QuickActionComponent(
is QuickActionChange.ReadableStateChange -> {
state.copy(readable = change.readable)
}
is QuickActionChange.ReaderActiveStateChange -> {
state.copy(readerActive = change.active)
}
}
}
@ -44,7 +48,7 @@ class QuickActionComponent(
}
}
data class QuickActionState(val readable: Boolean, val bookmarked: Boolean) : ViewState
data class QuickActionState(val readable: Boolean, val bookmarked: Boolean, val readerActive: Boolean) : ViewState
sealed class QuickActionAction : Action {
object Opened : QuickActionAction()
@ -53,9 +57,11 @@ sealed class QuickActionAction : Action {
object DownloadsPressed : QuickActionAction()
object BookmarkPressed : QuickActionAction()
object ReadPressed : QuickActionAction()
object ReadAppearancePressed : QuickActionAction()
}
sealed class QuickActionChange : Change {
data class BookmarkedStateChange(val bookmarked: Boolean) : QuickActionChange()
data class ReadableStateChange(val readable: Boolean) : QuickActionChange()
data class ReaderActiveStateChange(val active: Boolean) : QuickActionChange()
}

@ -78,6 +78,10 @@ class QuickActionUIView(
actionEmitter.onNext(QuickActionAction.ReadPressed)
quickActionSheetBehavior.state = BottomSheetBehavior.STATE_COLLAPSED
}
view.quick_action_read_appearance.setOnClickListener {
actionEmitter.onNext(QuickActionAction.ReadAppearancePressed)
quickActionSheetBehavior.state = BottomSheetBehavior.STATE_COLLAPSED
}
}
/**
@ -105,7 +109,16 @@ class QuickActionUIView(
}
override fun updateView() = Consumer<QuickActionState> {
view.quick_action_read.visibility = if (it.readable) View.VISIBLE else View.GONE
view.quick_action_read.apply {
visibility = if (it.readable) View.VISIBLE else View.GONE
isSelected = it.readerActive
text = if (it.readerActive) {
context.getString(R.string.quick_action_read_close)
} else {
context.getString(R.string.quick_action_read)
}
}
view.quick_action_read_appearance.visibility = if (it.readerActive) View.VISIBLE else View.GONE
view.quick_action_bookmark.isSelected = it.bookmarked
}

@ -0,0 +1,30 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- This Source Code Form is subject to the terms of the Mozilla Public
- License, v. 2.0. If a copy of the MPL was not distributed with this
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="oval">
<size
android:width="40dp"
android:height="40dp"/>
<solid android:color="#ECBCFB"/>
</shape>
</item>
<item
android:bottom="8dp"
android:left="8dp"
android:right="8dp"
android:top="8dp">
<vector
android:width="24dp"
android:height="24dp"
android:viewportWidth="24"
android:viewportHeight="24">
<path
android:pathData="M18.9,16.1c-0.5,0.4 -1,0.6 -1.5,0.8 -0.4,0.2 -0.9,0.3 -1.3,0.3 -0.6,0 -1.1,-0.2 -1.5,-0.6 -0.4,-0.4 -0.6,-0.9 -0.6,-1.6 0,-0.8 0.3,-1.3 0.9,-1.8 0.6,-0.5 1.9,-0.9 4.1,-1.3v-0.4c0,-0.6 -0.1,-1 -0.4,-1.3 -0.2,-0.3 -0.6,-0.4 -1.2,-0.4L17,9.8c-0.1,0 -0.3,0 -0.4,0.1v1.5h-1.5c-0.3,0 -0.4,0 -0.6,-0.1 -0.1,-0.1 -0.2,-0.2 -0.2,-0.5 0,-0.5 0.3,-0.9 1,-1.3s1.5,-0.6 2.5,-0.6c1.1,0 1.9,0.2 2.4,0.6 0.5,0.4 0.7,1.2 0.7,2.2L20.9,16l0.2,0.2 0.9,0.1v0.7h-2.9l-0.2,-0.9zM18.9,15.4v-2.6c-1.1,0.2 -1.8,0.5 -2.2,0.8 -0.4,0.3 -0.6,0.7 -0.6,1.1 0,0.4 0.1,0.7 0.3,0.9 0.2,0.2 0.5,0.3 0.9,0.3 0.2,0 0.4,0 0.7,-0.1 0.3,-0.1 0.6,-0.2 0.9,-0.4zM6.6,6h1.7L12,16l1,0.2v0.8L8.7,17v-0.8l1,-0.1 0.1,-0.2 -1,-2.8L5.3,13.1l-1,2.7 0.2,0.2 1,0.1v0.9L2,17v-0.8l1,-0.2L6.6,6zM7,8.2l-1.4,4h2.9L7,8.2z"
android:fillColor="#482166"
android:fillAlpha=".8"/>
</vector>
</item>
</layer-list>

@ -0,0 +1,29 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- This Source Code Form is subject to the terms of the Mozilla Public
- License, v. 2.0. If a copy of the MPL was not distributed with this
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item>
<shape android:shape="oval">
<size
android:width="40dp"
android:height="40dp"/>
<solid android:color="@color/quick_action_reader_close_icon_background"/>
</shape>
</item>
<item
android:bottom="8dp"
android:left="8dp"
android:right="8dp"
android:top="8dp">
<vector
android:width="24dp"
android:height="24dp"
android:viewportWidth="24"
android:viewportHeight="24">
<path
android:pathData="M13.3588,11.981L17.7411,7.5987C18.0934,7.2259 18.0851,6.6403 17.7224,6.2776C17.3597,5.9149 16.7741,5.9066 16.4013,6.2589L12.019,10.6412L7.6367,6.2589C7.2638,5.9066 6.6783,5.9149 6.3156,6.2776C5.9529,6.6403 5.9446,7.2259 6.2969,7.5987L10.6792,11.981L6.2969,16.3633C6.0461,16.6002 5.9439,16.9547 6.03,17.2888C6.1162,17.6229 6.3771,17.8838 6.7112,17.97C7.0453,18.0561 7.3998,17.9539 7.6367,17.7031L12.019,13.3208L16.4013,17.7031C16.7741,18.0554 17.3597,18.0471 17.7224,17.6844C18.0851,17.3217 18.0934,16.7362 17.7411,16.3633L13.3588,11.981Z"
android:fillColor="@color/quick_action_reader_close_icon"/>
</vector>
</item>
</layer-list>

@ -0,0 +1,10 @@
<?xml version="1.0" encoding="utf-8"?>
<!-- This Source Code Form is subject to the terms of the Mozilla Public
- License, v. 2.0. If a copy of the MPL was not distributed with this
- file, You can obtain one at http://mozilla.org/MPL/2.0/. -->
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_selected="false"
android:drawable="@drawable/quick_action_icon_read" />
<item android:state_selected="true"
android:drawable="@drawable/quick_action_icon_close" />
</selector>

@ -38,4 +38,13 @@
mozac:findInPageButtonsTint="?primaryText"
mozac:findInPageResultCountTextColor="?primaryText" />
<mozilla.components.feature.readerview.view.ReaderViewControlsBar
android:id="@+id/readerViewControlsBar"
android:background="?foundation"
android:elevation="24dp"
android:visibility="gone"
android:layout_gravity="bottom"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</androidx.coordinatorlayout.widget.CoordinatorLayout>

@ -77,13 +77,27 @@
android:textColor="?primaryText"
android:textSize="12sp" />
<Button
android:id="@+id/quick_action_read_appearance"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="?selectableItemBackgroundBorderless"
android:drawableTop="@drawable/quick_action_icon_appearance"
android:drawablePadding="5dp"
android:text="@string/quick_action_read_appearance"
android:textAllCaps="false"
android:textColor="?primaryText"
android:textSize="12sp"
android:visibility="gone" />
<Button
android:id="@+id/quick_action_read"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="?selectableItemBackgroundBorderless"
android:drawableTop="@drawable/quick_action_icon_read"
android:drawableTop="@drawable/reader_two_state"
android:drawablePadding="5dp"
android:text="@string/quick_action_read"
android:textAllCaps="false"

@ -21,4 +21,7 @@
<color name="scrimEnd_normal_theme">@color/scrimStart_dark_theme</color>
<color name="toggle_off_knob_normal_theme">@color/toggle_off_knob_dark_theme</color>
<color name="toggle_off_track_normal_theme">@color/toggle_off_track_dark_theme</color>
<!-- Reader View colors -->
<color name="mozac_feature_readerview_text_color">@color/primary_text_dark_theme</color>
</resources>

@ -109,6 +109,12 @@
<color name="quick_action_read_icon">#8a201f</color>
<color name="quick_action_read_icon_background">#fce98f</color>
<color name="quick_action_reader_close_icon">#f9f9fb</color>
<color name="quick_action_reader_close_icon_background">#582bcb</color>
<color name="quick_action_reader_appearance_icon">#482166</color>
<color name="quick_action_reader_appearance_icon_background">#ecbcfb</color>
<!-- Toggle Colors -->
<color name="toggle_off_knob_light_theme">@color/photonGrey10</color>
<color name="toggle_off_track_light_theme">@color/dark_grey_90</color>
@ -124,4 +130,7 @@
<color name="light_grey_05">#FBFBFE</color>
<color name="dark_grey_90">#15141A</color>
<color name="neutral_text">@color/white_color</color>
<!-- Reader View colors -->
<color name="mozac_feature_readerview_text_color">@color/primary_text_light_theme</color>
</resources>

@ -206,6 +206,10 @@
<string name="quick_action_bookmark">Bookmark</string>
<!-- Button in the browser chrome in the browser to put the the current page in reader mode -->
<string name="quick_action_read">Read</string>
<!-- Button in the browser chrome to exit reader mode -->
<string name="quick_action_read_close">Close</string>
<!-- Button in the browser chrome to configure reader mode appearance e.g. the used font type and size -->
<string name="quick_action_read_appearance">Appearance</string>
<!-- Content description (not visible, for screen readers etc.): Quick action sheet handle to provide users
with shortcuts to commonly used actions such as Share, Bookmark etc.. -->
<string name="quick_action_sheet_handle">Quick actions</string>
@ -475,4 +479,5 @@
<!-- QR code scanner prompt which appears after scanning a code, but before navigating to it
First parameter is the name of the app, second parameter is the URL or text scanned-->
<string name="qr_scanner_confirmation_dialog_message">Allow %1$s to open %2$s</string>
</resources>

@ -103,6 +103,7 @@ object Deps {
const val mozilla_feature_findinpage = "org.mozilla.components:feature-findinpage:${Versions.mozilla_android_components}"
const val mozilla_feature_session_bundling = "org.mozilla.components:feature-session-bundling:${Versions.mozilla_android_components}"
const val mozilla_feature_site_permissions = "org.mozilla.components:feature-sitepermissions:${Versions.mozilla_android_components}"
const val mozilla_feature_readerview = "org.mozilla.components:feature-readerview:${Versions.mozilla_android_components}"
const val mozilla_service_firefox_accounts = "org.mozilla.components:service-firefox-accounts:${Versions.mozilla_android_components}"
const val mozilla_service_fretboard = "org.mozilla.components:service-fretboard:${Versions.mozilla_android_components}"

Loading…
Cancel
Save