diff --git a/packages/web/components/templates/article/PdfArticleContainer.tsx b/packages/web/components/templates/article/PdfArticleContainer.tsx index 31fcd487f..6a5b4f78a 100644 --- a/packages/web/components/templates/article/PdfArticleContainer.tsx +++ b/packages/web/components/templates/article/PdfArticleContainer.tsx @@ -11,7 +11,6 @@ import { createHighlightMutation } from '../../../lib/networking/mutations/creat import { deleteHighlightMutation } from '../../../lib/networking/mutations/deleteHighlightMutation' import { articleReadingProgressMutation } from '../../../lib/networking/mutations/articleReadingProgressMutation' import { mergeHighlightMutation } from '../../../lib/networking/mutations/mergeHighlightMutation' -import { useCanShareNative } from '../../../lib/hooks/useCanShareNative' import { pspdfKitKey } from '../../../lib/appConfig' import { HighlightNoteModal } from './HighlightNoteModal' import { showErrorToast } from '../../../lib/toastHelpers' @@ -22,7 +21,6 @@ import 'react-sliding-pane/dist/react-sliding-pane.css' import { NotebookContent } from './Notebook' import { NotebookHeader } from './NotebookHeader' import useWindowDimensions from '../../../lib/hooks/useGetWindowDimensions' -import { usePersistedState } from '../../../lib/hooks/usePersistedState' export type PdfArticleContainerProps = { viewer: UserBasicData @@ -419,6 +417,65 @@ export default function PdfArticleContainer( }) } ) + + function keyDownHandler(event: globalThis.KeyboardEvent) { + const key = event.key.toLowerCase() + switch (key) { + case 'o': + document.dispatchEvent(new Event('openOriginalArticle')) + break + case 'u': + const query = window.sessionStorage.getItem('q') + if (query) { + window.location.assign(`/home?${query}`) + } else { + window.location.replace(`/home`) + } + break + case 'e': + document.dispatchEvent(new Event('archive')) + break + case '#': + document.dispatchEvent(new Event('delete')) + break + case 'h': + const root = (event.target as HTMLElement).querySelector( + '.PSPDFKit-Root' + ) + const highlight = root?.querySelector( + '.PSPDFKit-Text-Markup-Inline-Toolbar-Highlight' + ) + console.log('root ', root) + console.log('highlight overlay: ', highlight, highlight?.nodeName) + if (highlight && highlight?.nodeName == 'BUTTON') { + const button = highlight as HTMLButtonElement + button.click() + } + break + // case 'n': + // TODO: need to set a post creation event here, then + // go through the regular highlight creation + // document.dispatchEvent(new Event('annotate')) + // break + case 't': + props.setShowHighlightsModal(true) + break + case 'i': + document.dispatchEvent(new Event('showEditModal')) + break + } + } + + const isIE11 = navigator.userAgent.indexOf('Trident/') > -1 + instance.contentDocument.addEventListener( + 'keydown', + keyDownHandler, + isIE11 + ? { + capture: true, + } + : true + ) })() document.addEventListener('deleteHighlightbyId', async (event) => { diff --git a/packages/web/pages/[username]/[slug]/index.tsx b/packages/web/pages/[username]/[slug]/index.tsx index fc299688f..30cc92b46 100644 --- a/packages/web/pages/[username]/[slug]/index.tsx +++ b/packages/web/pages/[username]/[slug]/index.tsx @@ -13,8 +13,6 @@ import { } from './../../../components/templates/article/ArticleContainer' import { PdfArticleContainerProps } from './../../../components/templates/article/PdfArticleContainer' import { useCallback, useEffect, useState } from 'react' -import { useKeyboardShortcuts } from '../../../lib/keyboardShortcuts/useKeyboardShortcuts' -import { navigationCommands } from '../../../lib/keyboardShortcuts/navigationShortcuts' import dynamic from 'next/dynamic' import { Toaster } from 'react-hot-toast' import { createHighlightMutation } from '../../../lib/networking/mutations/createHighlightMutation' @@ -38,7 +36,6 @@ import { useReaderSettings } from '../../../lib/hooks/useReaderSettings' import { SkeletonArticleContainer } from '../../../components/templates/article/SkeletonArticleContainer' import { useRegisterActions } from 'kbar' import { deleteLinkMutation } from '../../../lib/networking/mutations/deleteLinkMutation' -import { ConfirmationModal } from '../../../components/patterns/ConfirmationModal' import { ReaderHeader } from '../../../components/templates/reader/ReaderHeader' import { EditArticleModal } from '../../../components/templates/homeFeed/EditItemModals' import { VerticalArticleActionsMenu } from '../../../components/templates/article/VerticalArticleActions' @@ -120,6 +117,9 @@ export default function Home(): JSX.Element { }) } else { router.push(`/home`) + showSuccessToast('Page archived', { + position: 'bottom-right', + }) } }) } @@ -187,16 +187,22 @@ export default function Home(): JSX.Element { actionHandler('mark-read') } + const showEditModal = () => { + actionHandler('showEditModal') + } + document.addEventListener('archive', archive) document.addEventListener('delete', deletePage) document.addEventListener('mark-read', markRead) document.addEventListener('openOriginalArticle', openOriginalArticle) + document.addEventListener('showEditModal', showEditModal) return () => { document.removeEventListener('archive', archive) document.removeEventListener('mark-read', markRead) document.removeEventListener('delete', deletePage) document.removeEventListener('openOriginalArticle', openOriginalArticle) + document.removeEventListener('showEditModal', showEditModal) } }, [actionHandler])