From 5816840af60f97a34318a52a5276482cab392496 Mon Sep 17 00:00:00 2001 From: bobzel Date: Fri, 16 Oct 2020 15:48:54 -0400 Subject: updated user initialization code to not generate server traffic when creating a new account. set user accounts to update their cache 2.5s after login. --- src/client/documents/Documents.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) (limited to 'src/client/documents/Documents.ts') diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts index 45c465d84..d7c9af1a3 100644 --- a/src/client/documents/Documents.ts +++ b/src/client/documents/Documents.ts @@ -236,6 +236,8 @@ class EmptyBox { export namespace Docs { + export let newAccount: boolean = false; + export namespace Prototypes { type LayoutSource = { LayoutString: (key: string) => string }; @@ -392,7 +394,7 @@ export namespace Docs { // non-guid string ids for each document prototype const prototypeIds = Object.values(DocumentType).filter(type => type !== DocumentType.NONE).map(type => type + suffix); // fetch the actual prototype documents from the server - const actualProtos = await DocServer.GetRefFields(prototypeIds); + const actualProtos = Docs.newAccount ? {} : await DocServer.GetRefFields(prototypeIds); // update this object to include any default values: DocumentOptions for all prototypes prototypeIds.map(id => { -- cgit v1.2.3-70-g09d2 From b75fc9edafb72a6cf5b1e15a3d2b5300c053f92f Mon Sep 17 00:00:00 2001 From: bobzel Date: Thu, 22 Oct 2020 01:38:03 -0400 Subject: fixed webBoxes to switch URLS when hyperlink is clicked (and page is not cross-origin). fixed some undo navigation web stuff. fixed drag/drop to create anchor that bounds the original selection. fixed html clippings to not have a nativewith/height so that they reflow --- src/client/documents/Documents.ts | 2 +- src/client/views/collections/CollectionSubView.tsx | 14 +++++++++----- src/client/views/nodes/WebBox.tsx | 20 +++++++++++++------- 3 files changed, 23 insertions(+), 13 deletions(-) (limited to 'src/client/documents/Documents.ts') diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts index d7c9af1a3..d7af88b72 100644 --- a/src/client/documents/Documents.ts +++ b/src/client/documents/Documents.ts @@ -1101,7 +1101,7 @@ export namespace DocUtils { }); } ctor = Docs.Create.WebDocument; - options = { ...options, _fitWidth: true, _nativeWidth: 850, _width: 400, _height: 512, title: path, }; + options = { ...options, _fitWidth: true, _width: 400, _height: 512, title: path, }; } return ctor ? ctor(path, options) : undefined; } diff --git a/src/client/views/collections/CollectionSubView.tsx b/src/client/views/collections/CollectionSubView.tsx index f0cf54db4..5c3c70be2 100644 --- a/src/client/views/collections/CollectionSubView.tsx +++ b/src/client/views/collections/CollectionSubView.tsx @@ -344,12 +344,16 @@ export function CollectionSubView(schemaCtor: (doc: Doc) => T, moreProps?: Doc.GetProto(htmlDoc)["data-text"] = Doc.GetProto(htmlDoc).text = text; this.props.addDocument(htmlDoc); if (srcWeb) { - const focusNode = (SelectionManager.SelectedDocuments()[0].ContentDiv?.getElementsByTagName("iframe")?.[0]?.contentDocument?.getSelection()?.focusNode as any); + const iframe = SelectionManager.SelectedDocuments()[0].ContentDiv?.getElementsByTagName("iframe")?.[0]; + const focusNode = (iframe?.contentDocument?.getSelection()?.focusNode as any); if (focusNode) { - const rect = "getBoundingClientRect" in focusNode ? focusNode.getBoundingClientRect() : focusNode?.parentElement.getBoundingClientRect(); - const x = (rect?.x || 0); - const y = NumCast(srcWeb._scrollTop) + (rect?.y || 0); - const anchor = Docs.Create.FreeformDocument([], { _backgroundColor: "transparent", _width: 75, _height: 40, x, y, annotationOn: srcWeb }); + const rects = iframe?.contentWindow?.getSelection()?.getRangeAt(0).getClientRects(); + "getBoundingClientRect" in focusNode ? focusNode.getBoundingClientRect() : focusNode?.parentElement.getBoundingClientRect(); + const x = (rects && Array.from(rects).reduce((x: any, r: DOMRect) => x === undefined || r.x < x ? r.x : x, undefined as any)) || 0; + const y = NumCast(srcWeb._scrollTop) + ((rects && Array.from(rects).reduce((y: any, r: DOMRect) => y === undefined || r.y < y ? r.y : y, undefined as any)) || 0); + const r = (rects && Array.from(rects).reduce((x: any, r: DOMRect) => x === undefined || r.x + r.width > x ? r.x + r.width : x, undefined as any)) || 0; + const b = NumCast(srcWeb._scrollTop) + ((rects && Array.from(rects).reduce((y: any, r: DOMRect) => y === undefined || r.y + r.height > y ? r.y + r.height : y, undefined as any)) || 0); + const anchor = Docs.Create.FreeformDocument([], { _backgroundColor: "transparent", _width: r - x, _height: b - y, x, y, annotationOn: srcWeb }); anchor.context = srcWeb; const key = Doc.LayoutFieldKey(srcWeb); Doc.AddDocToList(srcWeb, key + "-annotations", anchor); diff --git a/src/client/views/nodes/WebBox.tsx b/src/client/views/nodes/WebBox.tsx index eb9e08e20..168fee807 100644 --- a/src/client/views/nodes/WebBox.tsx +++ b/src/client/views/nodes/WebBox.tsx @@ -72,14 +72,23 @@ export class WebBox extends ViewBoxAnnotatableComponent { const iframe = this._iframeRef.current; if (iframe && iframe.contentDocument) { iframe.setAttribute("enable-annotation", "true"); + iframe.contentDocument.addEventListener("click", undoBatch(action(e => { + const href = (e.target as any)?.href; + if (href) { + this._url = href.replace(Utils.prepend(""), Cast(this.dataDoc[this.fieldKey], WebField, null)?.url.origin); + this.submitURL(); + } + }))); iframe.contentDocument.addEventListener('pointerdown', this.iframedown, false); iframe.contentDocument.addEventListener('scroll', this.iframeScrolled, false); this.layoutDoc.scrollHeight = iframe.contentDocument.children?.[0].scrollHeight || 1000; @@ -178,14 +187,11 @@ export class WebBox extends ViewBoxAnnotatableComponent) => { - this._url = e.target.value; - } - onUrlDragover = (e: React.DragEvent) => { e.preventDefault(); } + + @undoBatch @action onUrlDrop = (e: React.DragEvent) => { const { dataTransfer } = e; -- cgit v1.2.3-70-g09d2 From 24d2da070fbac9d950bae0eff6cdf4137d9b5305 Mon Sep 17 00:00:00 2001 From: bobzel Date: Fri, 6 Nov 2020 15:26:17 -0500 Subject: fixed web pages to scroll and update scrollTop when in annotation mode. fixed pointer events on custom text view headers. --- src/client/documents/Documents.ts | 1 + src/client/util/CurrentUserUtils.ts | 2 +- .../views/collections/CollectionStackingView.tsx | 5 +- src/client/views/nodes/WebBox.tsx | 82 +++++++++++----------- 4 files changed, 47 insertions(+), 43 deletions(-) (limited to 'src/client/documents/Documents.ts') diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts index d7af88b72..2d8a897a5 100644 --- a/src/client/documents/Documents.ts +++ b/src/client/documents/Documents.ts @@ -61,6 +61,7 @@ export interface DocumentOptions { _autoHeight?: boolean; _headerHeight?: number; // height of header of custom notes _headerFontSize?: number; // font size of header of custom notes + _headerPointerEvents?: string; // types of events the header of a custom text document can consume _panX?: number; _panY?: number; _width?: number; diff --git a/src/client/util/CurrentUserUtils.ts b/src/client/util/CurrentUserUtils.ts index 5886aa13f..4f054269f 100644 --- a/src/client/util/CurrentUserUtils.ts +++ b/src/client/util/CurrentUserUtils.ts @@ -405,7 +405,7 @@ export class CurrentUserUtils { selection: { type: "text", anchor: 1, head: 1 }, storedMarks: [] }; - const headerTemplate = Docs.Create.RTFDocument(new RichTextField(JSON.stringify(json), ""), { title: "header", version: headerViewVersion, target: doc, _height: 70, _headerHeight: 12, _headerFontSize: 9, _autoHeight: true, system: true, cloneFieldFilter: new List(["system"]) }, "header"); // text needs to be a space to allow templateText to be created + const headerTemplate = Docs.Create.RTFDocument(new RichTextField(JSON.stringify(json), ""), { title: "header", version: headerViewVersion, target: doc, _height: 70, _headerPointerEvents: "all", _headerHeight: 12, _headerFontSize: 9, _autoHeight: true, system: true, cloneFieldFilter: new List(["system"]) }, "header"); // text needs to be a space to allow templateText to be created headerTemplate[DataSym].layout = "
" + " " + diff --git a/src/client/views/collections/CollectionStackingView.tsx b/src/client/views/collections/CollectionStackingView.tsx index 7a3257525..2285bcb8f 100644 --- a/src/client/views/collections/CollectionStackingView.tsx +++ b/src/client/views/collections/CollectionStackingView.tsx @@ -289,8 +289,11 @@ export class CollectionStackingView extends CollectionSubView (pos[axis] + pos1[axis]) / 2 ? 1 : 0; } }); + const oldDocs = this.childDocs.length; if (super.onInternalDrop(e, de)) { - const newDocs = de.complete.docDragData.droppedDocuments; + const newDocs = this.childDocs.slice().filter((d: Doc, ind: number) => ind >= oldDocs); + + //de.complete.docDragData.droppedDocuments; const docs = this.childDocList; DragManager.docsBeingDragged = []; if (docs && newDocs.length) { diff --git a/src/client/views/nodes/WebBox.tsx b/src/client/views/nodes/WebBox.tsx index 1e5e8133d..80e2d3ce2 100644 --- a/src/client/views/nodes/WebBox.tsx +++ b/src/client/views/nodes/WebBox.tsx @@ -43,21 +43,19 @@ export class WebBox extends ViewBoxAnnotatableComponent = React.createRef(); static _annotationStyle: any = addStyleSheet(); + public static LayoutString(fieldKey: string) { return FieldView.LayoutString(WebBox, fieldKey); } private _mainCont: React.RefObject = React.createRef(); private _startX: number = 0; private _startY: number = 0; - private _scrollTarget: any = undefined; @observable private _marqueeX: number = 0; @observable private _marqueeY: number = 0; @observable private _marqueeWidth: number = 0; @observable private _marqueeHeight: number = 0; @observable private _marqueeing: boolean = false; - public static LayoutString(fieldKey: string) { return FieldView.LayoutString(WebBox, fieldKey); } - get _collapsed() { return StrCast(this.layoutDoc._chromeStatus) !== "enabled"; } - set _collapsed(value) { this.layoutDoc._chromeStatus = !value ? "enabled" : "disabled"; } @observable private _url: string = "hello"; @observable private _pressX: number = 0; @observable private _pressY: number = 0; + @observable private _iframe: HTMLIFrameElement | null = null; @observable private _savedAnnotations: Dictionary = new Dictionary(); private _selectionReactionDisposer?: IReactionDisposer; private _scrollReactionDisposer?: IReactionDisposer; @@ -65,10 +63,13 @@ export class WebBox extends ViewBoxAnnotatableComponent(); - private _iframeRef = React.createRef(); private _iframeIndicatorRef = React.createRef(); private _iframeDragRef = React.createRef(); private _setPreviewCursor: undefined | ((x: number, y: number, drag: boolean) => void); + get scrollHeight() { return this.webpage?.scrollHeight || 1000; } + get _collapsed() { return StrCast(this.layoutDoc._chromeStatus) !== "enabled"; } + set _collapsed(value) { this.layoutDoc._chromeStatus = !value ? "enabled" : "disabled"; } + get webpage() { return this._iframe?.contentDocument?.children[0]; } constructor(props: any) { super(props); @@ -79,8 +80,8 @@ export class WebBox extends ViewBoxAnnotatableComponent { - const iframe = this._iframeRef.current; - if (iframe && iframe.contentDocument) { + const iframe = this._iframe; + if (iframe?.contentDocument) { iframe.setAttribute("enable-annotation", "true"); iframe.contentDocument.addEventListener("click", undoBatch(action(e => { let href = ""; @@ -93,10 +94,10 @@ export class WebBox extends ViewBoxAnnotatableComponent ({ scrollY: this.layoutDoc._scrollY, scrollX: this.layoutDoc._scrollX }), @@ -121,7 +122,7 @@ export class WebBox extends ViewBoxAnnotatableComponent { const durationStr = StrCast(this.Document._viewTransition).match(/([0-9]*)ms/); const duration = durationStr ? Number(durationStr[1]) : 1000; - if (scrollTop !== undefined && this._forceSmoothScrollUpdate) { + if (scrollTop !== this._outerRef.current?.scrollTop && scrollTop !== undefined && this._forceSmoothScrollUpdate) { this._outerRef.current && smoothScroll(duration, this._outerRef.current, Math.abs(scrollTop || 0), () => this._forceSmoothScrollUpdate = true); } else this._forceSmoothScrollUpdate = true; }, @@ -144,10 +145,10 @@ export class WebBox extends ViewBoxAnnotatableComponent void) => this._setPreviewCursor = func; iframeWheel = (e: any) => { if (this._forceSmoothScrollUpdate && e.target?.children) { - this._scrollTarget && setTimeout(action(() => { - this._scrollTarget.scrollLeft = 0; - const scrollTop = this._scrollTarget.scrollTop; - const scrollLeft = this._scrollTarget.scrollLeft; + this.webpage && setTimeout(action(() => { + this.webpage!.scrollLeft = 0; + const scrollTop = this.webpage!.scrollTop; + const scrollLeft = this.webpage!.scrollLeft; this._outerRef.current!.scrollTop = scrollTop; this._outerRef.current!.scrollLeft = scrollLeft; if (this.layoutDoc._scrollTop !== scrollTop) { @@ -161,9 +162,6 @@ export class WebBox extends ViewBoxAnnotatableComponent { - this._scrollTarget = e.target.children[0]; - } async componentDidMount() { const urlField = Cast(this.dataDoc[this.props.fieldKey], WebField); runInAction(() => this._url = urlField?.url.toString() || ""); @@ -210,8 +208,7 @@ export class WebBox extends ViewBoxAnnotatableComponent { @@ -330,9 +327,9 @@ export class WebBox extends ViewBoxAnnotatableComponent { e.currentTarget.before((e.currentTarget.contentDocument?.body || e.currentTarget.contentDocument)?.children[0]!); e.currentTarget.remove(); }} - view =