Tweak Cloudflare help message in WebView screen

Catches pages like what Shinigami is currently showing.
Also adjusts the banner to make it look more like part of the top AppBar so it
looks less like part of the webpage.
This commit is contained in:
arkon 2023-10-12 22:56:19 -04:00
parent 540fb1bb7c
commit c386d375de
2 changed files with 91 additions and 80 deletions

View File

@ -78,7 +78,7 @@ object SettingsMainScreen : Screen() {
val backPress = LocalBackPress.currentOrThrow val backPress = LocalBackPress.currentOrThrow
val containerColor = if (twoPane) getPalerSurface() else MaterialTheme.colorScheme.surface val containerColor = if (twoPane) getPalerSurface() else MaterialTheme.colorScheme.surface
val topBarState = rememberTopAppBarState() val topBarState = rememberTopAppBarState()
Scaffold( Scaffold(
topBarScrollBehavior = TopAppBarDefaults.pinnedScrollBehavior(topBarState), topBarScrollBehavior = TopAppBarDefaults.pinnedScrollBehavior(topBarState),
topBar = { scrollBehavior -> topBar = { scrollBehavior ->

View File

@ -7,6 +7,7 @@ import android.webkit.WebView
import androidx.compose.foundation.clickable import androidx.compose.foundation.clickable
import androidx.compose.foundation.layout.Box import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.fillMaxSize
import androidx.compose.foundation.layout.fillMaxWidth import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.padding import androidx.compose.foundation.layout.padding
import androidx.compose.material.icons.Icons import androidx.compose.material.icons.Icons
@ -14,6 +15,8 @@ import androidx.compose.material.icons.outlined.ArrowBack
import androidx.compose.material.icons.outlined.ArrowForward import androidx.compose.material.icons.outlined.ArrowForward
import androidx.compose.material.icons.outlined.Close import androidx.compose.material.icons.outlined.Close
import androidx.compose.material3.LinearProgressIndicator import androidx.compose.material3.LinearProgressIndicator
import androidx.compose.material3.MaterialTheme
import androidx.compose.material3.Surface
import androidx.compose.runtime.Composable import androidx.compose.runtime.Composable
import androidx.compose.runtime.getValue import androidx.compose.runtime.getValue
import androidx.compose.runtime.mutableStateOf import androidx.compose.runtime.mutableStateOf
@ -22,8 +25,10 @@ import androidx.compose.runtime.rememberCoroutineScope
import androidx.compose.runtime.setValue import androidx.compose.runtime.setValue
import androidx.compose.ui.Alignment import androidx.compose.ui.Alignment
import androidx.compose.ui.Modifier import androidx.compose.ui.Modifier
import androidx.compose.ui.draw.clip
import androidx.compose.ui.platform.LocalUriHandler import androidx.compose.ui.platform.LocalUriHandler
import androidx.compose.ui.res.stringResource import androidx.compose.ui.res.stringResource
import androidx.compose.ui.unit.dp
import com.google.accompanist.web.AccompanistWebViewClient import com.google.accompanist.web.AccompanistWebViewClient
import com.google.accompanist.web.LoadingState import com.google.accompanist.web.LoadingState
import com.google.accompanist.web.WebView import com.google.accompanist.web.WebView
@ -72,7 +77,7 @@ fun WebViewScreenContent(
super.onPageFinished(view, url) super.onPageFinished(view, url)
scope.launch { scope.launch {
val html = view.getHtml() val html = view.getHtml()
showCloudflareHelp = "window._cf_chl_opt" in html showCloudflareHelp = "window._cf_chl_opt" in html || "Ray ID is" in html
} }
} }
@ -103,54 +108,71 @@ fun WebViewScreenContent(
Scaffold( Scaffold(
topBar = { topBar = {
Box { Box {
AppBar( Column {
title = state.pageTitle ?: initialTitle, AppBar(
subtitle = currentUrl, title = state.pageTitle ?: initialTitle,
navigateUp = onNavigateUp, subtitle = currentUrl,
navigationIcon = Icons.Outlined.Close, navigateUp = onNavigateUp,
actions = { navigationIcon = Icons.Outlined.Close,
AppBarActions( actions = {
listOf( AppBarActions(
AppBar.Action( listOf(
title = stringResource(R.string.action_webview_back), AppBar.Action(
icon = Icons.Outlined.ArrowBack, title = stringResource(R.string.action_webview_back),
onClick = { icon = Icons.Outlined.ArrowBack,
if (navigator.canGoBack) { onClick = {
navigator.navigateBack() if (navigator.canGoBack) {
} navigator.navigateBack()
}
},
enabled = navigator.canGoBack,
),
AppBar.Action(
title = stringResource(R.string.action_webview_forward),
icon = Icons.Outlined.ArrowForward,
onClick = {
if (navigator.canGoForward) {
navigator.navigateForward()
}
},
enabled = navigator.canGoForward,
),
AppBar.OverflowAction(
title = stringResource(R.string.action_webview_refresh),
onClick = { navigator.reload() },
),
AppBar.OverflowAction(
title = stringResource(R.string.action_share),
onClick = { onShare(currentUrl) },
),
AppBar.OverflowAction(
title = stringResource(R.string.action_open_in_browser),
onClick = { onOpenInBrowser(currentUrl) },
),
AppBar.OverflowAction(
title = stringResource(R.string.pref_clear_cookies),
onClick = { onClearCookies(currentUrl) },
),
),
)
},
)
if (showCloudflareHelp) {
Surface(
modifier = Modifier.padding(8.dp),
) {
WarningBanner(
textRes = R.string.information_cloudflare_help,
modifier = Modifier
.clip(MaterialTheme.shapes.small)
.clickable {
uriHandler.openUri("https://tachiyomi.org/docs/guides/troubleshooting/#cloudflare")
}, },
enabled = navigator.canGoBack, )
), }
AppBar.Action( }
title = stringResource(R.string.action_webview_forward), }
icon = Icons.Outlined.ArrowForward,
onClick = {
if (navigator.canGoForward) {
navigator.navigateForward()
}
},
enabled = navigator.canGoForward,
),
AppBar.OverflowAction(
title = stringResource(R.string.action_webview_refresh),
onClick = { navigator.reload() },
),
AppBar.OverflowAction(
title = stringResource(R.string.action_share),
onClick = { onShare(currentUrl) },
),
AppBar.OverflowAction(
title = stringResource(R.string.action_open_in_browser),
onClick = { onOpenInBrowser(currentUrl) },
),
AppBar.OverflowAction(
title = stringResource(R.string.pref_clear_cookies),
onClick = { onClearCookies(currentUrl) },
),
),
)
},
)
when (val loadingState = state.loadingState) { when (val loadingState = state.loadingState) {
is LoadingState.Initializing -> LinearProgressIndicator( is LoadingState.Initializing -> LinearProgressIndicator(
modifier = Modifier modifier = Modifier
@ -168,38 +190,27 @@ fun WebViewScreenContent(
} }
}, },
) { contentPadding -> ) { contentPadding ->
Column( WebView(
modifier = Modifier.padding(contentPadding), state = state,
) { modifier = Modifier
if (showCloudflareHelp) { .fillMaxSize()
WarningBanner( .padding(contentPadding),
textRes = R.string.information_cloudflare_help, navigator = navigator,
modifier = Modifier.clickable { onCreated = { webView ->
uriHandler.openUri("https://tachiyomi.org/docs/guides/troubleshooting/#cloudflare") webView.setDefaultSettings()
},
)
}
WebView( // Debug mode (chrome://inspect/#devices)
state = state, if (BuildConfig.DEBUG &&
modifier = Modifier.weight(1f), 0 != webView.context.applicationInfo.flags and ApplicationInfo.FLAG_DEBUGGABLE
navigator = navigator, ) {
onCreated = { webView -> WebView.setWebContentsDebuggingEnabled(true)
webView.setDefaultSettings() }
// Debug mode (chrome://inspect/#devices) headers["user-agent"]?.let {
if (BuildConfig.DEBUG && webView.settings.userAgentString = it
0 != webView.context.applicationInfo.flags and ApplicationInfo.FLAG_DEBUGGABLE }
) { },
WebView.setWebContentsDebuggingEnabled(true) client = webClient,
} )
headers["user-agent"]?.let {
webView.settings.userAgentString = it
}
},
client = webClient,
)
}
} }
} }