Keyboard navigation
Summary: Adding keyboard navigation for bookmarks Reviewed By: jknoxville Differential Revision: D17419667 fbshipit-source-id: 851f93d662b6071c3478dca5c9d20b9814e15c1b
This commit is contained in:
committed by
Facebook Github Bot
parent
1666cf5ee5
commit
bd1fc342c8
@@ -13,6 +13,7 @@ import {readBookmarksFromDB} from '../plugins/navigation/util/indexedDB';
|
|||||||
import {PersistedState as NavPluginState} from '../plugins/navigation/types';
|
import {PersistedState as NavPluginState} from '../plugins/navigation/types';
|
||||||
import BaseDevice from '../devices/BaseDevice';
|
import BaseDevice from '../devices/BaseDevice';
|
||||||
import {State as PluginState} from 'src/reducers/pluginStates';
|
import {State as PluginState} from 'src/reducers/pluginStates';
|
||||||
|
import {platform} from 'os';
|
||||||
|
|
||||||
type State = {
|
type State = {
|
||||||
bookmarks: Array<Bookmark>;
|
bookmarks: Array<Bookmark>;
|
||||||
@@ -59,6 +60,14 @@ class LocationsButton extends Component<Props, State> {
|
|||||||
retreivingBookmarks: false,
|
retreivingBookmarks: false,
|
||||||
};
|
};
|
||||||
|
|
||||||
|
componentWillMount() {
|
||||||
|
document.addEventListener('keydown', this.keyDown);
|
||||||
|
}
|
||||||
|
|
||||||
|
componentWillUnmount() {
|
||||||
|
document.removeEventListener('keydown', this.keyDown);
|
||||||
|
}
|
||||||
|
|
||||||
goToLocation = (location: string) => {
|
goToLocation = (location: string) => {
|
||||||
const {selectedDevice} = this.props;
|
const {selectedDevice} = this.props;
|
||||||
if (selectedDevice != null) {
|
if (selectedDevice != null) {
|
||||||
@@ -66,6 +75,17 @@ class LocationsButton extends Component<Props, State> {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
keyDown = (e: KeyboardEvent) => {
|
||||||
|
if (
|
||||||
|
((platform() === 'darwin' && e.metaKey) ||
|
||||||
|
(platform() !== 'darwin' && e.ctrlKey)) &&
|
||||||
|
/^\d$/.test(e.key) &&
|
||||||
|
this.state.bookmarks.length >= parseInt(e.key, 10)
|
||||||
|
) {
|
||||||
|
this.goToLocation(this.state.bookmarks[parseInt(e.key, 10) - 1].uri);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
updateBookmarks = () => {
|
updateBookmarks = () => {
|
||||||
readBookmarksFromDB().then(bookmarksMap => {
|
readBookmarksFromDB().then(bookmarksMap => {
|
||||||
const bookmarks: Array<Bookmark> = [];
|
const bookmarks: Array<Bookmark> = [];
|
||||||
@@ -92,11 +112,12 @@ class LocationsButton extends Component<Props, State> {
|
|||||||
label: 'Bookmarks',
|
label: 'Bookmarks',
|
||||||
enabled: false,
|
enabled: false,
|
||||||
},
|
},
|
||||||
...bookmarks.map(bookmark => {
|
...bookmarks.map((bookmark, i) => {
|
||||||
return {
|
return {
|
||||||
click: () => {
|
click: () => {
|
||||||
this.goToLocation(bookmark.uri);
|
this.goToLocation(bookmark.uri);
|
||||||
},
|
},
|
||||||
|
accelerator: i < 9 ? `CmdOrCtrl+${i + 1}` : undefined,
|
||||||
label: shortenText(
|
label: shortenText(
|
||||||
bookmark.commonName + ' - ' + bookmark.uri,
|
bookmark.commonName + ' - ' + bookmark.uri,
|
||||||
100,
|
100,
|
||||||
|
|||||||
Reference in New Issue
Block a user