aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/client/views/DocumentDecorations.tsx1
-rw-r--r--src/client/views/GlobalKeyHandler.ts3
-rw-r--r--src/client/views/PreviewCursor.tsx83
-rw-r--r--src/client/views/SearchItem.tsx67
-rw-r--r--src/client/views/collections/CollectionViewChromes.tsx22
-rw-r--r--src/client/views/collections/collectionFreeForm/MarqueeView.tsx3
-rw-r--r--src/client/views/nodes/DocumentView.tsx12
-rw-r--r--src/client/views/nodes/FormattedTextBox.tsx45
-rw-r--r--src/client/views/nodes/LinkMenu.tsx1
-rw-r--r--src/client/views/nodes/LinkMenuGroup.tsx10
-rw-r--r--src/client/views/nodes/LinkMenuItem.tsx169
-rw-r--r--src/client/views/nodes/WebBox.tsx56
-rw-r--r--src/new_fields/Doc.ts55
13 files changed, 385 insertions, 142 deletions
diff --git a/src/client/views/DocumentDecorations.tsx b/src/client/views/DocumentDecorations.tsx
index 891fd7847..b18a3c192 100644
--- a/src/client/views/DocumentDecorations.tsx
+++ b/src/client/views/DocumentDecorations.tsx
@@ -811,6 +811,7 @@ export class DocumentDecorations extends React.Component<{}, { value: string }>
let linkButton = null;
if (SelectionManager.SelectedDocuments().length > 0) {
let selFirst = SelectionManager.SelectedDocuments()[0];
+
let linkCount = LinkManager.Instance.getAllRelatedLinks(selFirst.props.Document).length;
linkButton = (<Flyout
anchorPoint={anchorPoints.RIGHT_TOP}
diff --git a/src/client/views/GlobalKeyHandler.ts b/src/client/views/GlobalKeyHandler.ts
index 8a7295c65..790784f46 100644
--- a/src/client/views/GlobalKeyHandler.ts
+++ b/src/client/views/GlobalKeyHandler.ts
@@ -181,6 +181,9 @@ export default class KeyManager {
break;
case "a":
case "v":
+ stopPropagation = false;
+ preventDefault = false;
+ break;
case "x":
case "c":
stopPropagation = false;
diff --git a/src/client/views/PreviewCursor.tsx b/src/client/views/PreviewCursor.tsx
index e7a5475ed..40be470d6 100644
--- a/src/client/views/PreviewCursor.tsx
+++ b/src/client/views/PreviewCursor.tsx
@@ -1,13 +1,20 @@
-import { action, observable } from 'mobx';
+import { action, observable, runInAction } from 'mobx';
import { observer } from 'mobx-react';
import "normalize.css";
import * as React from 'react';
import "./PreviewCursor.scss";
+import { Docs } from '../documents/Documents';
+// import { Transform } from 'prosemirror-transform';
+import { Doc } from '../../new_fields/Doc';
+import { Transform } from "../util/Transform";
@observer
export class PreviewCursor extends React.Component<{}> {
private _prompt = React.createRef<HTMLDivElement>();
static _onKeyPress?: (e: KeyboardEvent) => void;
+ static _getTransform: () => Transform;
+ static _addLiveTextDoc: (doc: Doc) => void;
+ static _addDocument: (doc: Doc, allowDuplicates: false) => boolean;
@observable static _clickPoint = [0, 0];
@observable public static Visible = false;
//when focus is lost, this will remove the preview cursor
@@ -20,12 +27,67 @@ export class PreviewCursor extends React.Component<{}> {
document.addEventListener("keydown", this.onKeyPress);
document.addEventListener("paste", this.paste);
}
+
paste = (e: ClipboardEvent) => {
- console.log(e.clipboardData);
- if (e.clipboardData) {
- console.log(e.clipboardData.getData("text/html"));
- console.log(e.clipboardData.getData("text/csv"));
- console.log(e.clipboardData.getData("text/plain"));
+ if (PreviewCursor.Visible) {
+ if (e.clipboardData) {
+ let newPoint = PreviewCursor._getTransform().transformPoint(PreviewCursor._clickPoint[0], PreviewCursor._clickPoint[1]);
+ runInAction(() => { PreviewCursor.Visible = false; });
+
+
+ if (e.clipboardData.getData("text/plain") !== "") {
+
+ // tests for youtube and makes video document
+ if (e.clipboardData.getData("text/plain").indexOf("www.youtube.com/watch") !== -1) {
+ const url = e.clipboardData.getData("text/plain").replace("youtube.com/watch?v=", "youtube.com/embed/");
+ PreviewCursor._addDocument(Docs.Create.VideoDocument(url, {
+ title: url, width: 400, height: 315,
+ nativeWidth: 600, nativeHeight: 472.5,
+ x: newPoint[0], y: newPoint[1]
+ }), false);
+ return;
+ }
+
+ // tests for URL and makes web document
+ let re: any = /^https?:\/\/www\./g;
+ if (re.test(e.clipboardData.getData("text/plain"))) {
+ const url = e.clipboardData.getData("text/plain")
+ PreviewCursor._addDocument(Docs.Create.WebDocument(url, {
+ title: url, width: 300, height: 300,
+ // nativeWidth: 300, nativeHeight: 472.5,
+ x: newPoint[0], y: newPoint[1]
+ }), false);
+ return;
+ }
+
+ // creates text document
+ let newBox = Docs.Create.TextDocument({
+ width: 200, height: 100,
+ x: newPoint[0],
+ y: newPoint[1],
+ title: "-pasted text-"
+ });
+
+ newBox.proto!.autoHeight = true;
+ PreviewCursor._addLiveTextDoc(newBox);
+ return;
+ }
+ //pasting in images
+ if (e.clipboardData.getData("text/html") !== "" && e.clipboardData.getData("text/html").includes("<img src=")) {
+ let re: any = /<img src="(.*?)"/g;
+ let arr: any[] = re.exec(e.clipboardData.getData("text/html"));
+
+ let img: Doc = Docs.Create.ImageDocument(
+ arr[1], {
+ width: 300, title: arr[1],
+ x: newPoint[0],
+ y: newPoint[1],
+ });
+ PreviewCursor._addDocument(img, false);
+ return;
+ }
+
+ }
}
}
@@ -49,9 +111,16 @@ export class PreviewCursor extends React.Component<{}> {
}
}
@action
- public static Show(x: number, y: number, onKeyPress: (e: KeyboardEvent) => void) {
+ public static Show(x: number, y: number,
+ onKeyPress: (e: KeyboardEvent) => void,
+ addLiveText: (doc: Doc) => void,
+ getTransform: () => Transform,
+ addDocument: (doc: Doc, allowDuplicates: false) => boolean) {
this._clickPoint = [x, y];
this._onKeyPress = onKeyPress;
+ this._addLiveTextDoc = addLiveText;
+ this._getTransform = getTransform;
+ this._addDocument = addDocument;
setTimeout(action(() => this.Visible = true), (1));
}
render() {
diff --git a/src/client/views/SearchItem.tsx b/src/client/views/SearchItem.tsx
deleted file mode 100644
index fd4b2420d..000000000
--- a/src/client/views/SearchItem.tsx
+++ /dev/null
@@ -1,67 +0,0 @@
-import React = require("react");
-import { library } from '@fortawesome/fontawesome-svg-core';
-import { faCaretUp, faFilePdf, faFilm, faImage, faObjectGroup, faStickyNote } from '@fortawesome/free-solid-svg-icons';
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { Doc } from "../../new_fields/Doc";
-import { DocumentManager } from "../util/DocumentManager";
-import { SetupDrag } from "../util/DragManager";
-
-
-export interface SearchProps {
- doc: Doc;
-}
-
-library.add(faCaretUp);
-library.add(faObjectGroup);
-library.add(faStickyNote);
-library.add(faFilePdf);
-library.add(faFilm);
-
-export class SearchItem extends React.Component<SearchProps> {
-
- onClick = () => {
- DocumentManager.Instance.jumpToDocument(this.props.doc, false);
- }
-
- //needs help
- // @computed get layout(): string { const field = Cast(this.props.doc[fieldKey], IconField); return field ? field.icon : "<p>Error loading icon data</p>"; }
-
-
- public static DocumentIcon(layout: string) {
- let button = layout.indexOf("PDFBox") !== -1 ? faFilePdf :
- layout.indexOf("ImageBox") !== -1 ? faImage :
- layout.indexOf("Formatted") !== -1 ? faStickyNote :
- layout.indexOf("Video") !== -1 ? faFilm :
- layout.indexOf("Collection") !== -1 ? faObjectGroup :
- faCaretUp;
- return <FontAwesomeIcon icon={button} className="documentView-minimizedIcon" />;
- }
- onPointerEnter = (e: React.PointerEvent) => {
- Doc.BrushDoc(this.props.doc);
- }
- onPointerLeave = (e: React.PointerEvent) => {
- Doc.UnBrushDoc(this.props.doc);
- }
-
- collectionRef = React.createRef<HTMLDivElement>();
- startDocDrag = () => {
- let doc = this.props.doc;
- const isProto = Doc.GetT(doc, "isPrototype", "boolean", true);
- if (isProto) {
- return Doc.MakeDelegate(doc);
- } else {
- return Doc.MakeAlias(doc);
- }
- }
- render() {
- return (
- <div className="search-item" ref={this.collectionRef} id="result"
- onPointerEnter={this.onPointerEnter} onPointerLeave={this.onPointerLeave}
- onClick={this.onClick} onPointerDown={SetupDrag(this.collectionRef, this.startDocDrag)} >
- <div className="search-title" id="result" >title: {this.props.doc.title}</div>
- {/* <div className="search-type" id="result" >Type: {this.props.doc.layout}</div> */}
- {/* <div className="search-type" >{SearchItem.DocumentIcon(this.layout)}</div> */}
- </div>
- );
- }
-} \ No newline at end of file
diff --git a/src/client/views/collections/CollectionViewChromes.tsx b/src/client/views/collections/CollectionViewChromes.tsx
index 25b152d4e..9631243c0 100644
--- a/src/client/views/collections/CollectionViewChromes.tsx
+++ b/src/client/views/collections/CollectionViewChromes.tsx
@@ -263,17 +263,6 @@ export class CollectionViewBaseChrome extends React.Component<CollectionViewChro
})} />);
}
- @action.bound
- clearFilter = () => {
- let compiled = CompileScript("return true", { params: { doc: Doc.name }, typecheck: false });
- if (compiled.compiled) {
- this.props.CollectionView.props.Document.viewSpecScript = new ScriptField(compiled);
- }
-
- this._keyRestrictions = [];
- this.addKeyRestrictions([]);
- }
-
private dropDisposer?: DragManager.DragDropDisposer;
protected createDropTarget = (ele: HTMLDivElement) => {
this.dropDisposer && this.dropDisposer();
@@ -295,6 +284,17 @@ export class CollectionViewBaseChrome extends React.Component<CollectionViewChro
return true;
}
+ @action.bound
+ clearFilter = () => {
+ let compiled = CompileScript("return true", { params: { doc: Doc.name }, typecheck: false });
+ if (compiled.compiled) {
+ this.props.CollectionView.props.Document.viewSpecScript = new ScriptField(compiled);
+ }
+
+ this._keyRestrictions = [];
+ this.addKeyRestrictions([]);
+ }
+
datePickerRef = (node: HTMLInputElement) => {
if (node) {
this._picker = datepicker("#" + node.id, {
diff --git a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx
index aad26efa0..4d318c02c 100644
--- a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx
+++ b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx
@@ -203,7 +203,8 @@ export class MarqueeView extends React.Component<MarqueeViewProps>
onClick = (e: React.MouseEvent): void => {
if (Math.abs(e.clientX - this._downX) < Utils.DRAG_THRESHOLD &&
Math.abs(e.clientY - this._downY) < Utils.DRAG_THRESHOLD) {
- PreviewCursor.Show(e.clientX, e.clientY, this.onKeyPress);
+ //this is probably the wrong transform
+ PreviewCursor.Show(e.clientX, e.clientY, this.onKeyPress, this.props.addLiveTextDocument, this.props.getTransform, this.props.addDocument);
// let the DocumentView stopPropagation of this event when it selects this document
} else { // why do we get a click event when the cursor have moved a big distance?
// let's cut it off here so no one else has to deal with it.
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index fd53262d7..9f1d98bb5 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -774,18 +774,20 @@ export class DocumentView extends DocComponent<DocumentViewProps, Document>(Docu
}
let showTextTitle = showTitle && StrCast(this.layoutDoc.layout).startsWith("<FormattedTextBox") ? showTitle : undefined;
let brushDegree = Doc.IsBrushedDegree(this.props.Document);
+ let fullDegree = Doc.isBrushedHighlightedDegree(this.props.Document);
+ // console.log(fullDegree)
let borderRounding = StrCast(Doc.GetProto(this.props.Document).borderRounding);
- let localScale = this.props.ScreenToLocalTransform().Scale * brushDegree;
+ let localScale = this.props.ScreenToLocalTransform().Scale * fullDegree;
return (
<div className={`documentView-node${this.topMost ? "-topmost" : ""}`}
ref={this._mainCont}
style={{
pointerEvents: this.layoutDoc.isBackground && !this.isSelected() ? "none" : "all",
color: foregroundColor,
- outlineColor: ["transparent", "maroon", "maroon"][brushDegree],
- outlineStyle: ["none", "dashed", "solid"][brushDegree],
- outlineWidth: brushDegree && !borderRounding ? `${localScale}px` : "0px",
- border: brushDegree && borderRounding ? `${["none", "dashed", "solid"][brushDegree]} ${["transparent", "maroon", "maroon"][brushDegree]} ${localScale}px` : undefined,
+ outlineColor: ["transparent", "maroon", "maroon", "yellow"][fullDegree],
+ outlineStyle: ["none", "dashed", "solid", "solid"][fullDegree],
+ outlineWidth: fullDegree && !borderRounding ? `${localScale}px` : "0px",
+ border: fullDegree && borderRounding ? `${["none", "dashed", "solid", "solid"][fullDegree]} ${["transparent", "maroon", "maroon", "yellow"][fullDegree]} ${localScale}px` : undefined,
borderRadius: "inherit",
background: backgroundColor,
width: nativeWidth,
diff --git a/src/client/views/nodes/FormattedTextBox.tsx b/src/client/views/nodes/FormattedTextBox.tsx
index 606e8edb0..9ae092bad 100644
--- a/src/client/views/nodes/FormattedTextBox.tsx
+++ b/src/client/views/nodes/FormattedTextBox.tsx
@@ -145,28 +145,31 @@ export class FormattedTextBox extends DocComponent<(FieldViewProps & FormattedTe
paste = (e: ClipboardEvent) => {
+ //this is throwing a ton of erros so i had to comment it out
if (e.clipboardData && this._editorView) {
- let pdfPasteText = `${Utils.GenerateDeterministicGuid("pdf paste")}`;
- for (let i = 0; i < e.clipboardData.items.length; i++) {
- let item = e.clipboardData.items.item(i);
- if (item.type === "text/plain") {
- item.getAsString((text) => {
- let pdfPasteIndex = text.indexOf(pdfPasteText);
- if (pdfPasteIndex > -1) {
- let insertText = text.substr(0, pdfPasteIndex);
- const tx = this._editorView!.state.tr.insertText(insertText);
- // tx.setSelection(new Selection(tx.))
- const state = this._editorView!.state;
- this._editorView!.dispatch(tx);
- if (FormattedTextBox._toolTipTextMenu) {
- // this._toolTipTextMenu.makeLinkWithState(state)
- }
- e.stopPropagation();
- e.preventDefault();
- }
- });
- }
- }
+ // let pdfPasteText = `${Utils.GenerateDeterministicGuid("pdf paste")}`;
+ // for (let i = 0; i < e.clipboardData.items.length; i++) {
+ // let item = e.clipboardData.items.item(i);
+ // console.log(item)
+ // if (item.type === "text/plain") {
+ // console.log("plain")
+ // item.getAsString((text) => {
+ // let pdfPasteIndex = text.indexOf(pdfPasteText);
+ // if (pdfPasteIndex > -1) {
+ // let insertText = text.substr(0, pdfPasteIndex);
+ // const tx = this._editorView!.state.tr.insertText(insertText);
+ // // tx.setSelection(new Selection(tx.))
+ // const state = this._editorView!.state;
+ // this._editorView!.dispatch(tx);
+ // if (FormattedTextBox._toolTipTextMenu) {
+ // // this._toolTipTextMenu.makeLinkWithState(state)
+ // }
+ // e.stopPropagation();
+ // e.preventDefault();
+ // }
+ // });
+ // }
+ // }
}
}
diff --git a/src/client/views/nodes/LinkMenu.tsx b/src/client/views/nodes/LinkMenu.tsx
index 1908889e9..16e318f7a 100644
--- a/src/client/views/nodes/LinkMenu.tsx
+++ b/src/client/views/nodes/LinkMenu.tsx
@@ -39,6 +39,7 @@ export class LinkMenu extends React.Component<Props> {
linkItems.push(
<LinkMenuGroup
key={groupType}
+ docView={this.props.docView}
sourceDoc={this.props.docView.props.Document}
group={group}
groupType={groupType}
diff --git a/src/client/views/nodes/LinkMenuGroup.tsx b/src/client/views/nodes/LinkMenuGroup.tsx
index e04044266..aa23d80a1 100644
--- a/src/client/views/nodes/LinkMenuGroup.tsx
+++ b/src/client/views/nodes/LinkMenuGroup.tsx
@@ -22,6 +22,8 @@ interface LinkMenuGroupProps {
groupType: string;
showEditor: (linkDoc: Doc) => void;
addDocTab: (document: Doc, dataDoc: Doc | undefined, where: string) => void;
+ docView: DocumentView;
+
}
@observer
@@ -83,9 +85,13 @@ export class LinkMenuGroup extends React.Component<LinkMenuGroupProps> {
let groupItems = this.props.group.map(linkDoc => {
let destination = LinkManager.Instance.getOppositeAnchor(linkDoc, this.props.sourceDoc);
if (destination && this.props.sourceDoc) {
- return <LinkMenuItem key={destination[Id] + this.props.sourceDoc[Id]} groupType={this.props.groupType}
+ return <LinkMenuItem key={destination[Id] + this.props.sourceDoc[Id]}
+ groupType={this.props.groupType}
addDocTab={this.props.addDocTab}
- linkDoc={linkDoc} sourceDoc={this.props.sourceDoc} destinationDoc={destination} showEditor={this.props.showEditor} />;
+ linkDoc={linkDoc}
+ sourceDoc={this.props.sourceDoc}
+ destinationDoc={destination}
+ showEditor={this.props.showEditor} />;
}
});
diff --git a/src/client/views/nodes/LinkMenuItem.tsx b/src/client/views/nodes/LinkMenuItem.tsx
index 90b335933..9349dbbac 100644
--- a/src/client/views/nodes/LinkMenuItem.tsx
+++ b/src/client/views/nodes/LinkMenuItem.tsx
@@ -13,6 +13,8 @@ import { LinkManager } from '../../util/LinkManager';
import { DragLinkAsDocument } from '../../util/DragManager';
import { CollectionDockingView } from '../collections/CollectionDockingView';
import { SelectionManager } from '../../util/SelectionManager';
+import { CollectionViewType } from '../collections/CollectionBaseView';
+import { DocumentView } from './DocumentView';
library.add(faEye, faEdit, faTimes, faArrowRight, faChevronDown, faChevronUp);
@@ -31,10 +33,54 @@ export class LinkMenuItem extends React.Component<LinkMenuItemProps> {
@observable private _showMore: boolean = false;
@action toggleShowMore() { this._showMore = !this._showMore; }
+
+ unhighlight = () => {
+ Doc.UnhighlightAll();
+ document.removeEventListener("pointerdown", this.unhighlight);
+ }
+
+ @action
+ highlightDoc = () => {
+ document.removeEventListener("pointerdown", this.unhighlight);
+ Doc.HighlightDoc(this.props.destinationDoc);
+ window.setTimeout(() => {
+ document.addEventListener("pointerdown", this.unhighlight);
+ }, 10000);
+ }
+
+ // NOT TESTED
+ // col = collection the doc is in
+ // target = the document to center on
@undoBatch
- onFollowLink = async (e: React.PointerEvent): Promise<void> => {
- e.stopPropagation();
- e.persist();
+ openLinkColRight = ({ col, target }: { col: Doc, target: Doc }) => {
+ col = Doc.IsPrototype(col) ? Doc.MakeDelegate(col) : col;
+ if (NumCast(col.viewType, CollectionViewType.Invalid) === CollectionViewType.Freeform) {
+ const newPanX = NumCast(target.x) + NumCast(target.width) / NumCast(target.zoomBasis, 1) / 2;
+ const newPanY = NumCast(target.y) + NumCast(target.height) / NumCast(target.zoomBasis, 1) / 2;
+ col.panX = newPanX;
+ col.panY = newPanY;
+ }
+ CollectionDockingView.Instance.AddRightSplit(col, undefined);
+ }
+
+ // DONE
+ // this opens the linked doc in a right split, NOT in its collection
+ @undoBatch
+ openLinkRight = () => {
+ this.highlightDoc();
+ let alias = Doc.MakeAlias(this.props.destinationDoc);
+ CollectionDockingView.Instance.AddRightSplit(alias, undefined);
+ SelectionManager.DeselectAll();
+ }
+
+ // DONE
+ // this is the standard "follow link" (jump to document)
+ // taken from follow link
+ @undoBatch
+ jumpToLink = async (shouldZoom: boolean) => {
+ //there is an issue right now so this will be false automatically
+ shouldZoom = false;
+ this.highlightDoc();
let jumpToDoc = this.props.destinationDoc;
let pdfDoc = FieldValue(Cast(this.props.destinationDoc, Doc));
if (pdfDoc) {
@@ -45,29 +91,83 @@ export class LinkMenuItem extends React.Component<LinkMenuItemProps> {
let sourceContext = await Cast(proto.sourceContext, Doc);
let self = this;
-
let dockingFunc = (document: Doc) => { this.props.addDocTab(document, undefined, "inTab"); SelectionManager.DeselectAll(); };
- if (e.ctrlKey) {
- dockingFunc = (document: Doc) => CollectionDockingView.Instance.AddRightSplit(document, undefined);
- }
if (this.props.destinationDoc === self.props.linkDoc.anchor2 && targetContext) {
- DocumentManager.Instance.jumpToDocument(jumpToDoc, e.altKey, false, async document => dockingFunc(document), undefined, targetContext);
+ DocumentManager.Instance.jumpToDocument(jumpToDoc, shouldZoom, false, async document => dockingFunc(document), undefined, targetContext);
}
else if (this.props.destinationDoc === self.props.linkDoc.anchor1 && sourceContext) {
- DocumentManager.Instance.jumpToDocument(jumpToDoc, e.altKey, false, document => dockingFunc(sourceContext!));
+ DocumentManager.Instance.jumpToDocument(jumpToDoc, shouldZoom, false, document => dockingFunc(sourceContext!));
}
else if (DocumentManager.Instance.getDocumentView(jumpToDoc)) {
- DocumentManager.Instance.jumpToDocument(jumpToDoc, e.altKey, undefined, undefined, NumCast((this.props.destinationDoc === self.props.linkDoc.anchor2 ? self.props.linkDoc.anchor2Page : self.props.linkDoc.anchor1Page)));
+ DocumentManager.Instance.jumpToDocument(jumpToDoc, shouldZoom, undefined, undefined, NumCast((this.props.destinationDoc === self.props.linkDoc.anchor2 ? self.props.linkDoc.anchor2Page : self.props.linkDoc.anchor1Page)));
+
}
else {
- DocumentManager.Instance.jumpToDocument(jumpToDoc, e.altKey, false, dockingFunc);
+ DocumentManager.Instance.jumpToDocument(jumpToDoc, shouldZoom, false, dockingFunc);
}
}
+ // DONE
+ // opens link in new tab (not in a collection)
+ // this opens it full screen, do we need a separate full screen option?
+ @undoBatch
+ openLinkTab = () => {
+ this.highlightDoc();
+ let fullScreenAlias = Doc.MakeAlias(this.props.destinationDoc);
+ this.props.addDocTab(fullScreenAlias, undefined, "inTab");
+ SelectionManager.DeselectAll();
+ }
+
+ // NOT TESTED
+ // opens link in new tab in collection
+ // col = collection the doc is in
+ // target = the document to center on
+ @undoBatch
+ openLinkColTab = ({ col, target }: { col: Doc, target: Doc }) => {
+ this.highlightDoc();
+ col = Doc.IsPrototype(col) ? Doc.MakeDelegate(col) : col;
+ if (NumCast(col.viewType, CollectionViewType.Invalid) === CollectionViewType.Freeform) {
+ const newPanX = NumCast(target.x) + NumCast(target.width) / NumCast(target.zoomBasis, 1) / 2;
+ const newPanY = NumCast(target.y) + NumCast(target.height) / NumCast(target.zoomBasis, 1) / 2;
+ col.panX = newPanX;
+ col.panY = newPanY;
+ }
+ // CollectionDockingView.Instance.AddRightSplit(col, undefined);
+ this.props.addDocTab(col, undefined, "inTab");
+ SelectionManager.DeselectAll();
+ }
+
+ // this will open a link next to the source doc
+ @undoBatch
+ openLinkInPlace = () => {
+ this.highlightDoc();
+
+ let alias = Doc.MakeAlias(this.props.destinationDoc);
+ let y = this.props.sourceDoc.y;
+ let x = this.props.sourceDoc.x;
+ let parentView: any = undefined;
+ let parentDoc: Doc = this.props.sourceDoc;
+
+ SelectionManager.SelectedDocuments().map(dv => {
+ if (dv.props.Document === this.props.sourceDoc) {
+ parentView = dv.props.ContainingCollectionView;
+ }
+ });
+
+ if (parentView) {
+ // console.log(parentDoc)
+ console.log(parentView.props.addDocument)
+ }
+ }
+
+ //set this to be the default link behavior, can be any of the above
+ private defaultLinkBehavior: any = this.openLinkInPlace;
+
onEdit = (e: React.PointerEvent): void => {
e.stopPropagation();
this.props.showEditor(this.props.linkDoc);
+ SelectionManager.DeselectAll();
}
renderMetadata = (): JSX.Element => {
@@ -127,7 +227,10 @@ export class LinkMenuItem extends React.Component<LinkMenuItemProps> {
{canExpand ? <div title="Show more" className="button" onPointerDown={() => this.toggleShowMore()}>
<FontAwesomeIcon className="fa-icon" icon={this._showMore ? "chevron-up" : "chevron-down"} size="sm" /></div> : <></>}
<div title="Edit link" className="button" onPointerDown={this.onEdit}><FontAwesomeIcon className="fa-icon" icon="edit" size="sm" /></div>
- <div title="Follow link" className="button" onPointerDown={this.onFollowLink}><FontAwesomeIcon className="fa-icon" icon="arrow-right" size="sm" /></div>
+ {/* Original */}
+ {/* <div title="Follow link" className="button" onPointerDown={this.onFollowLink}><FontAwesomeIcon className="fa-icon" icon="arrow-right" size="sm" /></div> */}
+ {/* New */}
+ <div title="Follow link" className="button" onPointerDown={this.defaultLinkBehavior}><FontAwesomeIcon className="fa-icon" icon="arrow-right" size="sm" /></div>
</div>
</div>
{this._showMore ? this.renderMetadata() : <></>}
@@ -136,4 +239,44 @@ export class LinkMenuItem extends React.Component<LinkMenuItemProps> {
</div >
);
}
-} \ No newline at end of file
+}
+
+ // @undoBatch
+ // onFollowLink = async (e: React.PointerEvent): Promise<void> => {
+ // e.stopPropagation();
+ // e.persist();
+ // let jumpToDoc = this.props.destinationDoc;
+ // let pdfDoc = FieldValue(Cast(this.props.destinationDoc, Doc));
+ // if (pdfDoc) {
+ // jumpToDoc = pdfDoc;
+ // }
+ // let proto = Doc.GetProto(this.props.linkDoc);
+ // let targetContext = await Cast(proto.targetContext, Doc);
+ // let sourceContext = await Cast(proto.sourceContext, Doc);
+ // let self = this;
+
+
+ // let dockingFunc = (document: Doc) => { this.props.addDocTab(document, undefined, "inTab"); SelectionManager.DeselectAll(); };
+ // if (e.ctrlKey) {
+ // dockingFunc = (document: Doc) => CollectionDockingView.Instance.AddRightSplit(document, undefined);
+ // }
+
+ // if (this.props.destinationDoc === self.props.linkDoc.anchor2 && targetContext) {
+ // DocumentManager.Instance.jumpToDocument(jumpToDoc, e.altKey, false, async document => dockingFunc(document), undefined, targetContext!);
+ // console.log("1")
+ // }
+ // else if (this.props.destinationDoc === self.props.linkDoc.anchor1 && sourceContext) {
+ // DocumentManager.Instance.jumpToDocument(jumpToDoc, e.altKey, false, document => dockingFunc(sourceContext!));
+ // console.log("2")
+ // }
+ // else if (DocumentManager.Instance.getDocumentView(jumpToDoc)) {
+ // DocumentManager.Instance.jumpToDocument(jumpToDoc, e.altKey, undefined, undefined, NumCast((this.props.destinationDoc === self.props.linkDoc.anchor2 ? self.props.linkDoc.anchor2Page : self.props.linkDoc.anchor1Page)));
+ // console.log("3")
+
+ // }
+ // else {
+ // DocumentManager.Instance.jumpToDocument(jumpToDoc, e.altKey, false, dockingFunc);
+ // console.log("4")
+
+ // }
+ // } \ No newline at end of file
diff --git a/src/client/views/nodes/WebBox.tsx b/src/client/views/nodes/WebBox.tsx
index 9b66b2431..173de64de 100644
--- a/src/client/views/nodes/WebBox.tsx
+++ b/src/client/views/nodes/WebBox.tsx
@@ -1,18 +1,29 @@
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { action, observable } from "mobx";
import { observer } from "mobx-react";
-import { FieldResult } from "../../../new_fields/Doc";
import { HtmlField } from "../../../new_fields/HtmlField";
-import { InkTool } from "../../../new_fields/InkField";
-import { Cast, NumCast } from "../../../new_fields/Types";
import { WebField } from "../../../new_fields/URLField";
-import { Utils } from "../../../Utils";
import { DocumentDecorations } from "../DocumentDecorations";
import { InkingControl } from "../InkingControl";
import { FieldView, FieldViewProps } from './FieldView';
-import { KeyValueBox } from "./KeyValueBox";
import "./WebBox.scss";
import React = require("react");
+import { InkTool } from "../../../new_fields/InkField";
+import { Cast, FieldValue, NumCast, StrCast } from "../../../new_fields/Types";
+import { Utils } from "../../../Utils";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { faStickyNote } from '@fortawesome/free-solid-svg-icons';
+import { observable, action, computed } from "mobx";
+import { listSpec } from "../../../new_fields/Schema";
+import { Field, FieldResult } from "../../../new_fields/Doc";
+import { RefField } from "../../../new_fields/RefField";
+import { ObjectField } from "../../../new_fields/ObjectField";
+import { updateSourceFile } from "typescript";
+import { KeyValueBox } from "./KeyValueBox";
+import { setReactionScheduler } from "mobx/lib/internal";
+import { library } from "@fortawesome/fontawesome-svg-core";
+import { Docs } from "../../documents/Documents";
+import { PreviewCursor } from "../PreviewCursor";
+
+library.add(faStickyNote)
@observer
export class WebBox extends React.Component<FieldViewProps> {
@@ -64,6 +75,24 @@ export class WebBox extends React.Component<FieldViewProps> {
}
}
+ switchToText() {
+ console.log("switchng to text")
+ if (this.props.removeDocument) this.props.removeDocument(this.props.Document);
+ // let newPoint = PreviewCursor._getTransform().transformPoint(PreviewCursor._clickPoint[0], PreviewCursor._clickPoint[1]);
+ let newBox = Docs.Create.TextDocument({
+ width: 200, height: 100,
+ // x: newPoint[0],
+ // y: newPoint[1],
+ x: NumCast(this.props.Document.x),
+ y: NumCast(this.props.Document.y),
+ title: "-pasted text-"
+ });
+
+ newBox.proto!.autoHeight = true;
+ PreviewCursor._addLiveTextDoc(newBox);
+ return;
+ }
+
urlEditor() {
return (
<div className="webView-urlEditor" style={{ top: this.collapsed ? -70 : 0 }}>
@@ -86,9 +115,18 @@ export class WebBox extends React.Component<FieldViewProps> {
onChange={this.onURLChange}
onKeyDown={this.onValueKeyDown}
/>
- <button className="submitUrl" onClick={this.submitURL}>
- SUBMIT URL
+ <div style={{
+ display: "flex",
+ flexDirection: "row",
+
+ }}>
+ <button className="submitUrl" onClick={this.submitURL}>
+ SUBMIT URL
</button>
+ <button className="switchToText" onClick={this.switchToText} style={{ paddingLeft: 10 }} >
+ <FontAwesomeIcon icon={faStickyNote} size={"2x"} />
+ </button>
+ </div>
</div>
</div>
</div>
diff --git a/src/new_fields/Doc.ts b/src/new_fields/Doc.ts
index ca05dfa45..bd08edec8 100644
--- a/src/new_fields/Doc.ts
+++ b/src/new_fields/Doc.ts
@@ -599,6 +599,19 @@ export namespace Doc {
});
}
+ export function isBrushedHighlightedDegree(doc: Doc) {
+ if (Doc.IsHighlighted(doc)) {
+ return 3;
+ }
+ else {
+ return Doc.IsBrushedDegree(doc);
+ }
+ }
+
+ export class DocBrush {
+ @observable BrushedDoc: ObservableMap<Doc, boolean> = new ObservableMap();
+ }
+ const brushManager = new DocBrush();
export class DocData {
@observable _user_doc: Doc = undefined!;
@@ -608,18 +621,48 @@ export namespace Doc {
export function UserDoc(): Doc { return manager._user_doc; }
export function SetUserDoc(doc: Doc) { manager._user_doc = doc; }
export function IsBrushed(doc: Doc) {
- return manager.BrushedDoc.has(doc) || manager.BrushedDoc.has(Doc.GetDataDoc(doc));
+ return brushManager.BrushedDoc.has(doc) || brushManager.BrushedDoc.has(Doc.GetDataDoc(doc));
}
export function IsBrushedDegree(doc: Doc) {
- return manager.BrushedDoc.has(Doc.GetDataDoc(doc)) ? 2 : manager.BrushedDoc.has(doc) ? 1 : 0;
+ return brushManager.BrushedDoc.has(Doc.GetDataDoc(doc)) ? 2 : brushManager.BrushedDoc.has(doc) ? 1 : 0;
}
export function BrushDoc(doc: Doc) {
- manager.BrushedDoc.set(doc, true);
- manager.BrushedDoc.set(Doc.GetDataDoc(doc), true);
+ brushManager.BrushedDoc.set(doc, true);
+ brushManager.BrushedDoc.set(Doc.GetDataDoc(doc), true);
}
export function UnBrushDoc(doc: Doc) {
- manager.BrushedDoc.delete(doc);
- manager.BrushedDoc.delete(Doc.GetDataDoc(doc));
+ brushManager.BrushedDoc.delete(doc);
+ brushManager.BrushedDoc.delete(Doc.GetDataDoc(doc));
+ }
+
+ export class HighlightBrush {
+ @observable HighlightedDoc: Map<Doc, boolean> = new Map();
+ }
+ const highlightManager = new HighlightBrush();
+ export function IsHighlighted(doc: Doc) {
+ let IsHighlighted = highlightManager.HighlightedDoc.get(doc) || highlightManager.HighlightedDoc.get(Doc.GetDataDoc(doc));
+ return IsHighlighted;
+ }
+ export function HighlightDoc(doc: Doc) {
+ runInAction(() => {
+ highlightManager.HighlightedDoc.set(doc, true);
+ highlightManager.HighlightedDoc.set(Doc.GetDataDoc(doc), true);
+ });
+ }
+ export function UnHighlightDoc(doc: Doc) {
+ runInAction(() => {
+ highlightManager.HighlightedDoc.set(doc, false);
+ highlightManager.HighlightedDoc.set(Doc.GetDataDoc(doc), false);
+ });
+ }
+ export function UnhighlightAll() {
+ let mapEntries = highlightManager.HighlightedDoc.keys();
+ let docEntry: IteratorResult<Doc>;
+ while (!(docEntry = mapEntries.next()).done) {
+ let targetDoc = docEntry.value;
+ targetDoc && Doc.UnHighlightDoc(targetDoc);
+ }
+
}
}
Scripting.addGlobal(function renameAlias(doc: any, n: any) { return StrCast(doc.title).replace(/\([0-9]*\)/, "") + `(${n})`; });