add toggle for auto highlight mode on ios
This commit is contained in:
File diff suppressed because one or more lines are too long
@ -9,6 +9,7 @@ import Views
|
||||
)
|
||||
@AppStorage(UserDefaultKey.preferredWebLineSpacing.rawValue) var storedLineSpacing = 150
|
||||
@AppStorage(UserDefaultKey.preferredWebMaxWidthPercentage.rawValue) var storedMaxWidthPercentage = 100
|
||||
@AppStorage(UserDefaultKey.enableHighlightOnRelease.rawValue) var enableHighlightOnRelease = false
|
||||
|
||||
@Binding var preferredFont: String
|
||||
@Binding var prefersHighContrastText: Bool
|
||||
@ -114,6 +115,11 @@ import Views
|
||||
isOn: $prefersHighContrastText,
|
||||
label: { Text(LocalText.genericHighContrastText) }
|
||||
)
|
||||
|
||||
Toggle(
|
||||
isOn: $enableHighlightOnRelease,
|
||||
label: { Text(LocalText.genericHighContrastText) }
|
||||
)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -100,6 +100,7 @@ struct WebReader: PlatformViewRepresentable {
|
||||
(webView as? OmnivoreWebView)?.updateFontFamily()
|
||||
(webView as? OmnivoreWebView)?.updateFontSize()
|
||||
(webView as? OmnivoreWebView)?.updateTextContrast()
|
||||
(webView as? OmnivoreWebView)?.updateAutoHighlightMode()
|
||||
(webView as? OmnivoreWebView)?.updateMaxWidthPercentage()
|
||||
(webView as? OmnivoreWebView)?.updateLineHeight()
|
||||
(webView as? OmnivoreWebView)?.updateLabels(labelsJSON: item.labelsJSONString)
|
||||
@ -152,6 +153,15 @@ struct WebReader: PlatformViewRepresentable {
|
||||
}
|
||||
}()
|
||||
|
||||
let enableHighlightOnRelease: Bool = {
|
||||
let key = UserDefaultKey.enableHighlightOnRelease.rawValue
|
||||
if UserDefaults.standard.object(forKey: key) != nil {
|
||||
return UserDefaults.standard.bool(forKey: key)
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
}()
|
||||
|
||||
let fontFamily = fontFamilyValue.flatMap { WebFont(rawValue: $0) } ?? .system
|
||||
|
||||
let htmlString = WebReaderContent(
|
||||
@ -162,7 +172,8 @@ struct WebReader: PlatformViewRepresentable {
|
||||
lineHeight: lineHeight(),
|
||||
maxWidthPercentage: maxWidthPercentage(),
|
||||
fontFamily: fontFamily,
|
||||
prefersHighContrastText: prefersHighContrastText
|
||||
prefersHighContrastText: prefersHighContrastText,
|
||||
enableHighlightOnRelease: enableHighlightOnRelease
|
||||
)
|
||||
.styledContent
|
||||
|
||||
|
||||
@ -12,6 +12,7 @@ struct WebReaderContent {
|
||||
let fontFamily: WebFont
|
||||
let articleContent: ArticleContent
|
||||
let prefersHighContrastText: Bool
|
||||
let enableHighlightOnRelease: Bool
|
||||
|
||||
init(
|
||||
item: LinkedItem,
|
||||
@ -21,7 +22,8 @@ struct WebReaderContent {
|
||||
lineHeight: Int,
|
||||
maxWidthPercentage: Int,
|
||||
fontFamily: WebFont,
|
||||
prefersHighContrastText: Bool
|
||||
prefersHighContrastText: Bool,
|
||||
enableHighlightOnRelease: Bool
|
||||
) {
|
||||
self.textFontSize = fontSize
|
||||
self.lineHeight = lineHeight
|
||||
@ -31,6 +33,7 @@ struct WebReaderContent {
|
||||
self.fontFamily = fontFamily
|
||||
self.articleContent = articleContent
|
||||
self.prefersHighContrastText = prefersHighContrastText
|
||||
self.enableHighlightOnRelease = enableHighlightOnRelease
|
||||
}
|
||||
|
||||
// swiftlint:disable line_length
|
||||
@ -88,6 +91,7 @@ struct WebReaderContent {
|
||||
window.localStorage.setItem("theme", "\(themeKey)")
|
||||
window.prefersHighContrastFont = \(prefersHighContrastText)
|
||||
window.enableHighlightBar = \(isMacApp)
|
||||
window.highlightOnRelease = \(enableHighlightOnRelease)
|
||||
</script>
|
||||
<script src="bundle.js"></script>
|
||||
<script src="mathJaxConfiguration.js" id="MathJax-script"></script>
|
||||
|
||||
@ -6,6 +6,7 @@ public enum UserDefaultKey: String {
|
||||
case preferredWebLineSpacing
|
||||
case preferredWebMaxWidthPercentage
|
||||
case prefersHighContrastWebFont
|
||||
case enableHighlightOnRelease
|
||||
case userHasDeniedPushPrimer
|
||||
case firebasePushToken
|
||||
case homeFeedlayoutPreference
|
||||
|
||||
@ -107,6 +107,20 @@ public final class OmnivoreWebView: WKWebView {
|
||||
}
|
||||
}
|
||||
|
||||
public func updateAutoHighlightMode() {
|
||||
let isEnabled = UserDefaults.standard.value(
|
||||
forKey: UserDefaultKey.enableHighlightOnRelease.rawValue
|
||||
) as? Bool
|
||||
|
||||
if let isEnabled = isEnabled {
|
||||
do {
|
||||
try dispatchEvent(.handleAutoHighlightModeChange(isEnabled: isEnabled))
|
||||
} catch {
|
||||
showErrorInSnackbar("Error updating text contrast")
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
public func updateTitle(title: String) {
|
||||
do {
|
||||
try dispatchEvent(.updateTitle(title: title))
|
||||
@ -382,6 +396,7 @@ public final class OmnivoreWebView: WKWebView {
|
||||
|
||||
public enum WebViewDispatchEvent {
|
||||
case handleFontContrastChange(isHighContrast: Bool)
|
||||
case handleAutoHighlightModeChange(isEnabled: Bool)
|
||||
case updateLineHeight(height: Int)
|
||||
case updateMaxWidthPercentage(maxWidthPercentage: Int)
|
||||
case updateFontSize(size: Int)
|
||||
@ -445,6 +460,8 @@ public enum WebViewDispatchEvent {
|
||||
return "updateLabels"
|
||||
case .updateTitle:
|
||||
return "updateTitle"
|
||||
case .handleAutoHighlightModeChange:
|
||||
return "handleAutoHighlightModeChange"
|
||||
}
|
||||
}
|
||||
|
||||
@ -487,6 +504,8 @@ public enum WebViewDispatchEvent {
|
||||
return "event.anchorIdx = '\(anchorIdx)';"
|
||||
case .annotate, .highlight, .setHighlightLabels, .share, .remove, .copyHighlight, .dismissHighlight:
|
||||
return ""
|
||||
case let .handleAutoHighlightModeChange(isEnabled: isEnabled):
|
||||
return "event.enableHighlightOnRelease = '\(isEnabled)';"
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -72,6 +72,7 @@ public enum WebFont: String, CaseIterable {
|
||||
UITraitCollection.current.preferredWebFontSize
|
||||
@AppStorage(UserDefaultKey.preferredWebLineSpacing.rawValue) var storedLineSpacing = 150
|
||||
@AppStorage(UserDefaultKey.preferredWebMaxWidthPercentage.rawValue) var storedMaxWidthPercentage = 100
|
||||
@AppStorage(UserDefaultKey.enableHighlightOnRelease.rawValue) var enableHighlightOnRelease = false
|
||||
@AppStorage(UserDefaultKey.preferredWebFont.rawValue) var preferredFont = WebFont.inter.rawValue
|
||||
@AppStorage(UserDefaultKey.prefersHighContrastWebFont.rawValue) var prefersHighContrastText = true
|
||||
|
||||
@ -202,6 +203,13 @@ public enum WebFont: String, CaseIterable {
|
||||
updateReaderPreferences()
|
||||
}
|
||||
|
||||
Toggle(LocalText.enableHighlightOnReleaseText, isOn: $enableHighlightOnRelease)
|
||||
.frame(height: 40)
|
||||
.padding(.trailing, 6)
|
||||
.onChange(of: enableHighlightOnRelease) { _ in
|
||||
updateReaderPreferences()
|
||||
}
|
||||
|
||||
Spacer()
|
||||
}
|
||||
.padding()
|
||||
|
||||
@ -159,6 +159,7 @@ public enum LocalText {
|
||||
public static let genericLoading = localText(key: "genericLoading")
|
||||
public static let genericFontFamily = localText(key: "genericFontFamily")
|
||||
public static let genericHighContrastText = localText(key: "genericHighContrastText")
|
||||
public static let enableHighlightOnReleaseText = localText(key: "enableHighlightOnReleaseText")
|
||||
public static let genericFont = localText(key: "genericFont")
|
||||
public static let genericHighlight = localText(key: "genericHighlight")
|
||||
public static let labelsGeneric = localText(key: "labelsGeneric")
|
||||
|
||||
File diff suppressed because one or more lines are too long
@ -164,6 +164,7 @@
|
||||
"genericLoading" = "Loading...";
|
||||
"genericFontFamily" = "Font Family";
|
||||
"genericHighContrastText" = "High Contrast Text";
|
||||
"enableHighlightOnReleaseText" = "Auto Highlight Mode:";
|
||||
"genericFont" = "Font";
|
||||
"genericHighlight" = "Highlight";
|
||||
"labelsGeneric" = "Labels";
|
||||
|
||||
@ -165,6 +165,7 @@
|
||||
"genericLoading" = "加载中...";
|
||||
"genericFontFamily" = "字体册";
|
||||
"genericHighContrastText" = "高对比度文本";
|
||||
"enableHighlightOnReleaseText" = "Auto Highlight Mode:";
|
||||
"genericFont" = "字体";
|
||||
"genericHighlight" = "荧光笔";
|
||||
"labelsGeneric" = "标签";
|
||||
|
||||
@ -76,7 +76,7 @@ const App = () => {
|
||||
margin={window.margin}
|
||||
maxWidthPercentage={window.maxWidthPercentage}
|
||||
lineHeight={window.lineHeight}
|
||||
highlightOnRelease={true}
|
||||
highlightOnRelease={window.highlightOnRelease}
|
||||
highContrastFont={window.prefersHighContrastFont ?? true}
|
||||
articleMutations={{
|
||||
createHighlightMutation: (input) =>
|
||||
|
||||
@ -106,6 +106,9 @@ export function ArticleContainer(props: ArticleContainerProps): JSX.Element {
|
||||
const [title, setTitle] = useState(props.article.title)
|
||||
const [showReportIssuesModal, setShowReportIssuesModal] = useState(false)
|
||||
const [fontSize, setFontSize] = useState(props.fontSize ?? 20)
|
||||
const [highlightOnRelease, setHighlightOnRelease] = useState(
|
||||
props.highlightOnRelease
|
||||
)
|
||||
// iOS app embed can overide the original margin and line height
|
||||
const [maxWidthPercentageOverride, setMaxWidthPercentageOverride] = useState<
|
||||
number | null
|
||||
@ -147,6 +150,18 @@ export function ArticleContainer(props: ArticleContainerProps): JSX.Element {
|
||||
}
|
||||
}
|
||||
|
||||
interface UpdateHighlightModeEvent extends Event {
|
||||
enableHighlightOnRelease?: boolean
|
||||
}
|
||||
|
||||
const updateHighlightMode = (event: UpdateHighlightModeEvent) => {
|
||||
const isEnabled =
|
||||
event.enableHighlightOnRelease !== undefined
|
||||
? event.enableHighlightOnRelease
|
||||
: false
|
||||
setHighlightOnRelease(isEnabled)
|
||||
}
|
||||
|
||||
interface UpdateMaxWidthPercentageEvent extends Event {
|
||||
maxWidthPercentage?: number
|
||||
}
|
||||
@ -254,6 +269,10 @@ export function ArticleContainer(props: ArticleContainerProps): JSX.Element {
|
||||
document.addEventListener('updateLabels', handleUpdateLabels)
|
||||
|
||||
document.addEventListener('share', share)
|
||||
document.addEventListener(
|
||||
'handleAutoHighlightModeChange',
|
||||
updateHighlightMode
|
||||
)
|
||||
|
||||
return () => {
|
||||
document.removeEventListener('updateFontFamily', updateFontFamily)
|
||||
@ -272,6 +291,10 @@ export function ArticleContainer(props: ArticleContainerProps): JSX.Element {
|
||||
document.removeEventListener('updateTitle', handleUpdateTitle)
|
||||
document.removeEventListener('updateLabels', handleUpdateLabels)
|
||||
document.removeEventListener('share', share)
|
||||
document.removeEventListener(
|
||||
'handleAutoHighlightModeChange',
|
||||
updateHighlightMode
|
||||
)
|
||||
}
|
||||
})
|
||||
|
||||
@ -405,7 +428,7 @@ export function ArticleContainer(props: ArticleContainerProps): JSX.Element {
|
||||
highlightBarDisabled={props.highlightBarDisabled}
|
||||
showHighlightsModal={props.showHighlightsModal}
|
||||
setShowHighlightsModal={props.setShowHighlightsModal}
|
||||
highlightOnRelease={props.highlightOnRelease}
|
||||
highlightOnRelease={highlightOnRelease}
|
||||
articleMutations={props.articleMutations}
|
||||
/>
|
||||
{showReportIssuesModal ? (
|
||||
|
||||
Reference in New Issue
Block a user