event handler cleanups

This commit is contained in:
刘浩远 2020-07-28 20:43:22 +08:00
parent 5927bf3441
commit f0234afd9e
10 changed files with 24 additions and 18 deletions

2
package-lock.json generated
View File

@ -1,6 +1,6 @@
{
"name": "fluent-reader",
"version": "0.6.2",
"version": "0.6.3",
"lockfileVersion": 1,
"requires": true,
"dependencies": {

View File

@ -5,6 +5,7 @@ import { RSSItem } from "../scripts/models/item"
import { Stack, CommandBarButton, IContextualMenuProps, FocusZone, ContextualMenuItemType, Spinner, Icon, Link } from "@fluentui/react"
import { RSSSource, SourceOpenTarget } from "../scripts/models/source"
import { shareSubmenu } from "./context-menu"
import { platformCtrl } from "../scripts/utils"
const FONT_SIZE_OPTIONS = [12, 13, 14, 15, 16, 17, 18, 19, 20]
@ -12,7 +13,7 @@ type ArticleProps = {
item: RSSItem
source: RSSSource
locale: string
shortcuts: (item: RSSItem, key: string) => void
shortcuts: (item: RSSItem, e: KeyboardEvent) => void
dismiss: () => void
offsetItem: (offset: number) => void
toggleHasRead: (item: RSSItem) => void
@ -72,7 +73,7 @@ class Article extends React.Component<ArticleProps, ArticleState> {
key: "openInBrowser",
text: intl.get("openExternal"),
iconProps: { iconName: "NavigateExternalInline" },
onClick: e => { window.utils.openExternal(this.props.item.link, window.utils.platform === "darwin" ? e.metaKey : e.ctrlKey) }
onClick: e => { window.utils.openExternal(this.props.item.link, platformCtrl(e)) }
},
{
key: "copyURL",
@ -117,7 +118,6 @@ class Article extends React.Component<ArticleProps, ArticleState> {
this.toggleWebpage()
break
default:
this.props.shortcuts(this.props.item, input.key)
const keyboardEvent = new KeyboardEvent("keydown", {
code: input.code,
key: input.key,
@ -128,6 +128,7 @@ class Article extends React.Component<ArticleProps, ArticleState> {
repeat: input.isAutoRepeat,
bubbles: true
})
this.props.shortcuts(this.props.item, keyboardEvent)
document.dispatchEvent(keyboardEvent)
break
}

View File

@ -1,6 +1,7 @@
import * as React from "react"
import { RSSSource, SourceOpenTarget } from "../../scripts/models/source"
import { RSSItem } from "../../scripts/models/item"
import { platformCtrl } from "../../scripts/utils"
export namespace Card {
export type Props = {
@ -8,7 +9,7 @@ export namespace Card {
item: RSSItem
source: RSSSource
keyword: string
shortcuts: (item: RSSItem, key: string) => void
shortcuts: (item: RSSItem, e: KeyboardEvent) => void
markRead: (item: RSSItem) => void
contextMenu: (feedId: string, item: RSSItem, e) => void
showItem: (fid: string, item: RSSItem) => void
@ -16,7 +17,7 @@ export namespace Card {
const openInBrowser = (props: Props, e: React.MouseEvent) => {
props.markRead(props.item)
window.utils.openExternal(props.item.link, window.utils.platform === "darwin" ? e.metaKey : e.ctrlKey)
window.utils.openExternal(props.item.link, platformCtrl(e))
}
export const bindEventsToProps = (props: Props) => ({
@ -55,6 +56,6 @@ export namespace Card {
}
const onKeyDown = (props: Props, e: React.KeyboardEvent) => {
props.shortcuts(props.item, e.key)
props.shortcuts(props.item, e.nativeEvent)
}
}

View File

@ -1,7 +1,7 @@
import * as React from "react"
import intl from "react-intl-universal"
import QRCode from "qrcode.react"
import { cutText, webSearch, getSearchEngineName } from "../scripts/utils"
import { cutText, webSearch, getSearchEngineName, platformCtrl } from "../scripts/utils"
import { ContextualMenu, IContextualMenuItem, ContextualMenuItemType, DirectionalHint } from "office-ui-fabric-react/lib/ContextualMenu"
import { ContextMenuType } from "../scripts/models/app"
import { RSSItem } from "../scripts/models/item"
@ -77,7 +77,7 @@ export class ContextMenu extends React.Component<ContextMenuProps> {
iconProps: { iconName: "NavigateExternalInline" },
onClick: (e) => {
this.props.markRead(this.props.item)
window.utils.openExternal(this.props.item.link, window.utils.platform === "darwin" ? e.metaKey : e.ctrlKey)
window.utils.openExternal(this.props.item.link, platformCtrl(e))
}
},
{
@ -158,7 +158,7 @@ export class ContextMenu extends React.Component<ContextMenuProps> {
text: intl.get("openExternal"),
iconProps: { iconName: "NavigateExternalInline" },
onClick: (e) => {
if (window.utils.platform === "darwin" ? e.metaKey : e.ctrlKey) {
if (platformCtrl(e)) {
window.utils.imageCallback(ImageCallbackTypes.OpenExternalBg)
} else {
window.utils.imageCallback(ImageCallbackTypes.OpenExternal)

View File

@ -12,7 +12,7 @@ export type FeedProps = FeedReduxProps & {
items: RSSItem[]
sourceMap: Object
keyword: string
shortcuts: (item: RSSItem, key: string) => void
shortcuts: (item: RSSItem, e: KeyboardEvent) => void
markRead: (item: RSSItem) => void
contextMenu: (feedId: string, item: RSSItem, e) => void
loadMore: (feed: RSSFeed) => void

View File

@ -28,7 +28,7 @@ const makeMapStateToProps = () => {
const mapDispatchToProps = (dispatch: AppDispatch) => {
return {
shortcuts: (item: RSSItem, key: string) => dispatch(itemShortcuts(item, key)),
shortcuts: (item: RSSItem, e: KeyboardEvent) => dispatch(itemShortcuts(item, e)),
dismiss: () => dispatch(dismissItem()),
offsetItem: (offset: number) => dispatch(showOffsetItem(offset)),
toggleHasRead: (item: RSSItem) => dispatch(item.hasRead ? markUnread(item) : markRead(item)),

View File

@ -33,7 +33,7 @@ const makeMapStateToProps = () => {
}
const mapDispatchToProps = dispatch => {
return {
shortcuts: (item: RSSItem, key: string) => dispatch(itemShortcuts(item, key)),
shortcuts: (item: RSSItem, e: KeyboardEvent) => dispatch(itemShortcuts(item, e)),
markRead: (item: RSSItem) => dispatch(markRead(item)),
contextMenu: (feedId: string, item: RSSItem, e) => dispatch(openItemMenu(item, feedId, e)),
loadMore: (feed: RSSFeed) => dispatch(loadMore(feed)),

View File

@ -1,6 +1,6 @@
import * as db from "../db"
import intl from "react-intl-universal"
import { domParser, htmlDecode, ActionStatus, AppThunk } from "../utils"
import { domParser, htmlDecode, ActionStatus, AppThunk, platformCtrl } from "../utils"
import { RSSSource } from "./source"
import { FeedActionTypes, INIT_FEED, LOAD_MORE, FilterType, initFeeds } from "./feed"
import Parser from "@yang991178/rss-parser"
@ -331,21 +331,22 @@ export function toggleHidden(item: RSSItem): AppThunk {
}
}
export function itemShortcuts(item: RSSItem, key: string): AppThunk {
export function itemShortcuts(item: RSSItem, e: KeyboardEvent): AppThunk {
return (dispatch) => {
switch (key) {
switch (e.key) {
case "m": case "M":
if (item.hasRead) dispatch(markUnread(item))
else dispatch(markRead(item))
break
case "b": case "B":
if (!item.hasRead) dispatch(markRead(item))
window.utils.openExternal(item.link)
window.utils.openExternal(item.link, platformCtrl(e))
break
case "s": case "S":
dispatch(toggleStarred(item))
break
case "h": case "H":
if (!item.hasRead) dispatch(markRead(item))
dispatch(toggleHidden(item))
break
}

View File

@ -226,7 +226,6 @@ function insertSource(source: RSSSource): AppThunk<Promise<RSSSource>> {
}))
})
}
}
export function addSource(url: string, name: string = null, batch = false): AppThunk<Promise<number>> {

View File

@ -189,3 +189,7 @@ export function validateRegex(regex: string, flags = ""): RegExp {
return null
}
}
export function platformCtrl(e: React.MouseEvent | React.KeyboardEvent | MouseEvent | KeyboardEvent) {
return window.utils.platform === "darwin" ? e.metaKey : e.ctrlKey
}