From bd6b5a81480f7f56a65c13954e080281279b6627 Mon Sep 17 00:00:00 2001 From: Melissa Zhang Date: Tue, 4 Aug 2020 16:53:36 -0700 Subject: "added invisibleDoc and simulated clicks to load annotations" --- src/client/views/MainView.tsx | 79 +++++++++++++++++++++- src/client/views/collections/CollectionSubView.tsx | 26 ++++--- src/client/views/linking/LinkMenuItem.tsx | 15 ++-- src/client/views/nodes/DocumentLinksButton.tsx | 14 ++-- 4 files changed, 112 insertions(+), 22 deletions(-) (limited to 'src/client/views') diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx index fccfe325a..ef44e0a4e 100644 --- a/src/client/views/MainView.tsx +++ b/src/client/views/MainView.tsx @@ -14,7 +14,7 @@ import { listSpec } from '../../fields/Schema'; import { ScriptField } from '../../fields/ScriptField'; import { BoolCast, Cast, FieldValue, StrCast } from '../../fields/Types'; import { TraceMobx } from '../../fields/util'; -import { emptyFunction, emptyPath, returnEmptyFilter, returnFalse, returnOne, returnTrue, returnZero, setupMoveUpEvents, Utils } from '../../Utils'; +import { emptyFunction, emptyPath, returnEmptyFilter, returnFalse, returnOne, returnTrue, returnZero, setupMoveUpEvents, Utils, simulateMouseClick } from '../../Utils'; import GoogleAuthenticationManager from '../apis/GoogleAuthenticationManager'; import { DocServer } from '../DocServer'; import { Docs, DocumentOptions } from '../documents/Documents'; @@ -60,6 +60,8 @@ import PDFMenu from './pdf/PDFMenu'; import { PreviewCursor } from './PreviewCursor'; import { Hypothesis } from '../apis/hypothesis/HypothesisUtils'; import { undoBatch } from '../util/UndoManager'; +import { WebBox } from './nodes/WebBox'; +import * as ReactDOM from 'react-dom'; @observer export class MainView extends React.Component { @@ -720,6 +722,37 @@ export class MainView extends React.Component { ; } + @computed get invisibleWebBox() { // see note under the makeLink method in HypothesisUtils.ts + return !DocumentLinksButton.invisibleWebDoc ? null : +
+ 500} + PanelHeight={() => 800} + NativeHeight={() => 500} + NativeWidth={() => 800} + ContentScaling={returnOne} + docFilters={returnEmptyFilter} + /> +
; + } + render() { return (
@@ -753,8 +786,52 @@ export class MainView extends React.Component { {this.snapLines} +
); } + + makeWebRef = (ele: HTMLDivElement) => { + reaction(() => DocumentLinksButton.invisibleWebDoc, + invisibleDoc => { + ReactDOM.unmountComponentAtNode(ele); + invisibleDoc && ReactDOM.render( +
+ 500} + PanelHeight={() => 800} + NativeHeight={() => 500} + NativeWidth={() => 800} + ContentScaling={returnOne} + docFilters={returnEmptyFilter} + /> +
; + , ele); + + const interval = setInterval(() => { + console.log("clicked"); + simulateMouseClick(ele, 50, 50, 50, 50); + }, 500); + + setTimeout(() => clearInterval(interval), 10000); + }); + } } Scripting.addGlobal(function freezeSidebar() { MainView.expandFlyout(); }); Scripting.addGlobal(function toggleComicMode() { Doc.UserDoc().fontFamily = "Comic Sans MS"; Doc.UserDoc().renderStyle = Doc.UserDoc().renderStyle === "comic" ? undefined : "comic"; }); diff --git a/src/client/views/collections/CollectionSubView.tsx b/src/client/views/collections/CollectionSubView.tsx index 5906282f1..b66da27b4 100644 --- a/src/client/views/collections/CollectionSubView.tsx +++ b/src/client/views/collections/CollectionSubView.tsx @@ -346,15 +346,22 @@ export function CollectionSubView(schemaCtor: (doc: Doc) => T, moreProps?: // } } if (uriList) { - this.addDocument(Docs.Create.WebDocument(uriList, { - ...options, - title: uriList, - _width: 400, - _height: 315, - _nativeWidth: 850, - _nativeHeight: 962, - UseCors: true - })); + const existingWebDoc = await Hypothesis.findWebDoc(uriList); + + if (existingWebDoc) { + this.addDocument(Doc.MakeAlias(existingWebDoc)); + } else { + const cleanedUri = uriList.split("#annotations:")[0]; // clean hypothes.is URLs that scroll directly to an annotation + this.addDocument(Docs.Create.WebDocument(uriList, { + ...options, + title: cleanedUri, + _width: 400, + // _height: 315, + _nativeWidth: 850, + _nativeHeight: 962, + UseCors: true + })); + } return; } @@ -437,4 +444,5 @@ import { CollectionView, CollectionViewType } from "./CollectionView"; import { SelectionManager } from "../../util/SelectionManager"; import { OverlayView } from "../OverlayView"; import { setTimeout } from "timers"; +import { Hypothesis } from "../../apis/hypothesis/HypothesisUtils"; diff --git a/src/client/views/linking/LinkMenuItem.tsx b/src/client/views/linking/LinkMenuItem.tsx index b29754d45..681f6ae54 100644 --- a/src/client/views/linking/LinkMenuItem.tsx +++ b/src/client/views/linking/LinkMenuItem.tsx @@ -1,9 +1,9 @@ import { library } from '@fortawesome/fontawesome-svg-core'; import { faArrowRight, faChevronDown, faChevronUp, faEdit, faEye, faTimes, faPencilAlt, faEyeSlash } from '@fortawesome/free-solid-svg-icons'; import { FontAwesomeIcon, FontAwesomeIconProps } from '@fortawesome/react-fontawesome'; -import { action, observable } from 'mobx'; +import { action, observable, runInAction } from 'mobx'; import { observer } from "mobx-react"; -import { Doc, DocListCast } from '../../../fields/Doc'; +import { Doc, DocListCast, Opt } from '../../../fields/Doc'; import { Cast, StrCast } from '../../../fields/Types'; import { DragManager } from '../../util/DragManager'; import { LinkManager } from '../../util/LinkManager'; @@ -151,7 +151,7 @@ export class LinkMenuItem extends React.Component { } @action.bound - async followDefault() { + followDefault() { DocumentLinksButton.EditLink = undefined; LinkDocPreview.LinkInfo = undefined; const linkDoc = this.props.linkDoc; @@ -167,7 +167,7 @@ export class LinkMenuItem extends React.Component { DocumentManager.Instance.FollowLink(this.props.linkDoc, this.props.sourceDoc, doc => this.props.addDocTab(doc, "onRight"), false); } - linkDoc.linksToAnnotation && Hypothesis.scrollToAnnotation(StrCast(this.props.linkDoc.annotationId)); + linkDoc.linksToAnnotation && Hypothesis.scrollToAnnotation(StrCast(this.props.linkDoc.annotationId), this.props.destinationDoc); } @undoBatch @@ -176,8 +176,11 @@ export class LinkMenuItem extends React.Component { this.props.linkDoc.linksToAnnotation && Hypothesis.deleteLink(StrCast(this.props.linkDoc.annotationId), Utils.prepend("/doc/" + this.props.sourceDoc[Id])); // delete hyperlink in annotation this.props.linkDoc.linksToAnnotation && console.log("annotationId", this.props.linkDoc.annotationId); LinkManager.Instance.deleteLink(this.props.linkDoc); - LinkDocPreview.LinkInfo = undefined; - DocumentLinksButton.EditLink = undefined; + + runInAction(() => { + LinkDocPreview.LinkInfo = undefined; + DocumentLinksButton.EditLink = undefined; + }); } @undoBatch diff --git a/src/client/views/nodes/DocumentLinksButton.tsx b/src/client/views/nodes/DocumentLinksButton.tsx index 00477874b..dcdaa3199 100644 --- a/src/client/views/nodes/DocumentLinksButton.tsx +++ b/src/client/views/nodes/DocumentLinksButton.tsx @@ -2,11 +2,11 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome"; import { Tooltip } from "@material-ui/core"; import { action, computed, observable, runInAction } from "mobx"; import { observer } from "mobx-react"; -import { Doc, DocListCast } from "../../../fields/Doc"; +import { Doc, DocListCast, Opt } from "../../../fields/Doc"; import { DocumentType } from "../../documents/DocumentTypes"; import { emptyFunction, setupMoveUpEvents, returnFalse, Utils, emptyPath } from "../../../Utils"; import { TraceMobx } from "../../../fields/util"; -import { DocUtils } from "../../documents/Documents"; +import { DocUtils, Docs } from "../../documents/Documents"; import { DragManager } from "../../util/DragManager"; import { LinkManager } from "../../util/LinkManager"; import { undoBatch, UndoManager } from "../../util/UndoManager"; @@ -18,7 +18,6 @@ import { Id } from "../../../fields/FieldSymbols"; import { TaskCompletionBox } from "./TaskCompletedBox"; import React = require("react"); import './DocumentLinksButton.scss'; -import { WebField } from "../../../fields/URLField"; const higflyout = require("@hig/flyout"); export const { anchorPoints } = higflyout; @@ -40,6 +39,9 @@ export class DocumentLinksButton extends React.Component; + public static invisibleWebRef = React.createRef(); + @action @undoBatch onLinkButtonMoved = (e: PointerEvent) => { if (this.props.InMenu && this.props.StartLink) { @@ -114,12 +116,12 @@ export class DocumentLinksButton extends React.Component