From 326cf48bf28340d1533565a19236411c4091d3b4 Mon Sep 17 00:00:00 2001 From: Sam Wilkins Date: Mon, 8 Jul 2019 21:34:54 -0400 Subject: key fixes for drag abort and delete marquee selection --- src/client/views/GlobalKeyHandler.ts | 8 ++++++++ src/client/views/MainView.tsx | 22 ++++++---------------- 2 files changed, 14 insertions(+), 16 deletions(-) (limited to 'src') diff --git a/src/client/views/GlobalKeyHandler.ts b/src/client/views/GlobalKeyHandler.ts index fb4a107ad..0d95bb96c 100644 --- a/src/client/views/GlobalKeyHandler.ts +++ b/src/client/views/GlobalKeyHandler.ts @@ -67,6 +67,14 @@ export default class KeyManager { } MainView.Instance.toggleColorPicker(true); break; + case "delete": + case "backspace": + SelectionManager.SelectedDocuments().map(docView => { + let doc = docView.props.Document; + let remove = docView.props.removeDocument; + remove && remove(doc); + }); + break; } return { diff --git a/src/client/views/MainView.tsx b/src/client/views/MainView.tsx index fe59f52c8..da126fb74 100644 --- a/src/client/views/MainView.tsx +++ b/src/client/views/MainView.tsx @@ -67,12 +67,6 @@ export class MainView extends React.Component { window.removeEventListener("keydown", KeyManager.Instance.handle); window.addEventListener("keydown", KeyManager.Instance.handle); - window.removeEventListener("pointerdown", this.pointerDown); - window.addEventListener("pointerdown", this.pointerDown); - - window.removeEventListener("pointerup", this.pointerUp); - window.addEventListener("pointerup", this.pointerUp); - reaction(() => { let workspaces = CurrentUserUtils.UserDocument.workspaces; let recent = CurrentUserUtils.UserDocument.recentlyClosed; @@ -86,17 +80,12 @@ export class MainView extends React.Component { if (libraryHeight && Math.abs(CurrentUserUtils.UserDocument[HeightSym]() - libraryHeight) > 5) { CurrentUserUtils.UserDocument.height = libraryHeight; } - (Cast(CurrentUserUtils.UserDocument.recentlyClosed, Doc) as Doc)!.allowClear = true; + (Cast(CurrentUserUtils.UserDocument.recentlyClosed, Doc) as Doc).allowClear = true; }, { fireImmediately: true }); } - pointerDown = (e: PointerEvent) => this.isPointerDown = true; - pointerUp = (e: PointerEvent) => this.isPointerDown = false; - componentWillUnMount() { window.removeEventListener("keydown", KeyManager.Instance.handle); - window.removeEventListener("pointerdown", this.pointerDown); - window.removeEventListener("pointerup", this.pointerUp); } constructor(props: Readonly<{}>) { @@ -151,8 +140,8 @@ export class MainView extends React.Component { window.addEventListener("drop", (e) => e.preventDefault(), false); // drop event handler window.addEventListener("dragover", (e) => e.preventDefault(), false); // drag event handler // click interactions for the context menu - document.addEventListener("pointerdown", action(function (e: PointerEvent) { - + document.addEventListener("pointerdown", action((e: PointerEvent) => { + this.isPointerDown = true; const targets = document.elementsFromPoint(e.x, e.y); if (targets && targets.length && targets[0].className.toString().indexOf("contextMenu") === -1) { ContextMenu.Instance.closeMenu(); @@ -286,6 +275,7 @@ export class MainView extends React.Component { } @action onPointerUp = (e: PointerEvent) => { + this.isPointerDown = false; if (Math.abs(e.clientX - this._downsize) < 4) { if (this.flyoutWidth < 5) this.flyoutWidth = 250; else this.flyoutWidth = 0; @@ -300,7 +290,7 @@ export class MainView extends React.Component { } else { CollectionDockingView.Instance.AddRightSplit(doc, undefined); } - }; + } @computed get flyout() { let sidebar = CurrentUserUtils.UserDocument.sidebar; @@ -325,7 +315,7 @@ export class MainView extends React.Component { ContainingCollectionView={undefined} zoomToScale={emptyFunction} getScale={returnOne}> - + ; } @computed get mainContent() { -- cgit v1.2.3-70-g09d2 From bc4e7ceb8a738b890344c4564ab0d97e0a10293d Mon Sep 17 00:00:00 2001 From: bob Date: Tue, 9 Jul 2019 10:57:58 -0400 Subject: fixed some template issues, added text templates. --- src/client/views/DocumentDecorations.tsx | 2 +- .../views/nodes/CollectionFreeFormDocumentView.tsx | 3 +- src/client/views/nodes/DocumentContentsView.tsx | 27 +++++++++--- src/client/views/nodes/DocumentView.tsx | 15 ++++++- src/client/views/nodes/FormattedTextBox.tsx | 48 +++++++++++++--------- 5 files changed, 65 insertions(+), 30 deletions(-) (limited to 'src') diff --git a/src/client/views/DocumentDecorations.tsx b/src/client/views/DocumentDecorations.tsx index 48b89ff4e..d6cf793ab 100644 --- a/src/client/views/DocumentDecorations.tsx +++ b/src/client/views/DocumentDecorations.tsx @@ -357,7 +357,7 @@ export class DocumentDecorations extends React.Component<{}, { value: string }> onRadiusMove = (e: PointerEvent): void => { let dist = Math.sqrt((e.clientX - this._radiusDown[0]) * (e.clientX - this._radiusDown[0]) + (e.clientY - this._radiusDown[1]) * (e.clientY - this._radiusDown[1])); - SelectionManager.SelectedDocuments().map(dv => Doc.GetProto(dv.props.Document).borderRounding = `${Math.min(100, dist)}%`); + SelectionManager.SelectedDocuments().map(dv => dv.props.Document.borderRounding = Doc.GetProto(dv.props.Document).borderRounding = `${Math.min(100, dist)}%`); e.stopPropagation(); e.preventDefault(); } diff --git a/src/client/views/nodes/CollectionFreeFormDocumentView.tsx b/src/client/views/nodes/CollectionFreeFormDocumentView.tsx index 1c00687ed..b09538d1a 100644 --- a/src/client/views/nodes/CollectionFreeFormDocumentView.tsx +++ b/src/client/views/nodes/CollectionFreeFormDocumentView.tsx @@ -7,6 +7,7 @@ import { DocComponent } from "../DocComponent"; import { DocumentView, DocumentViewProps, positionSchema } from "./DocumentView"; import "./DocumentView.scss"; import React = require("react"); +import { Doc } from "../../../new_fields/Doc"; export interface CollectionFreeFormDocumentViewProps extends DocumentViewProps { x?: number; @@ -70,7 +71,7 @@ export class CollectionFreeFormDocumentView extends DocComponent { - let br = StrCast(this.props.Document.borderRounding); + let br = StrCast(this.props.Document.layout instanceof Doc ? this.props.Document.layout.borderRounding : this.props.Document.borderRounding); if (br.endsWith("%")) { let percent = Number(br.substr(0, br.length - 1)) / 100; let nativeDim = Math.min(NumCast(this.props.Document.nativeWidth), NumCast(this.props.Document.nativeHeight)); diff --git a/src/client/views/nodes/DocumentContentsView.tsx b/src/client/views/nodes/DocumentContentsView.tsx index 56a14e26e..745520bc4 100644 --- a/src/client/views/nodes/DocumentContentsView.tsx +++ b/src/client/views/nodes/DocumentContentsView.tsx @@ -49,12 +49,11 @@ export class DocumentContentsView extends React.Component { @computed get layout(): string { - let layoutDoc = this.props.Document.layout instanceof Doc ? this.props.Document.layout : this.props.Document; - const layout = Cast(layoutDoc[this.props.layoutKey], "string"); + const layout = Cast(this.layoutDoc[this.props.layoutKey], "string"); if (layout === undefined) { return this.props.Document.data ? "" : - KeyValueBox.LayoutString(layoutDoc.proto ? "proto" : ""); + KeyValueBox.LayoutString(this.layoutDoc.proto ? "proto" : ""); } else if (typeof layout === "string") { return layout; } else { @@ -62,8 +61,23 @@ export class DocumentContentsView extends React.Component obj.active = this.props.parentActive).omit, Document: layoutDoc } }; + get dataDoc() { + if (this.props.DataDoc === undefined && this.props.Document.layout instanceof Doc) { + // if there is no dataDoc (ie, we're not rendering a temlplate layout), but this document + // has a template layout document, then we will render the template layout but use + // this document as the data document for the layout. + return this.props.Document; + } + return this.props.DataDoc + } + get layoutDoc() { + // if this document's layout field contains a document (ie, a rendering template), then we will use that + // to determine the render JSX string, otherwise the layout field should directly contain a JSX layout string. + return this.props.Document.layout instanceof Doc ? this.props.Document.layout : this.props.Document; + } + + CreateBindings(): JsxBindings { + return { props: { ...OmitKeys(this.props, ['parentActive'], (obj: any) => obj.active = this.props.parentActive).omit, Document: this.layoutDoc, DataDoc: this.dataDoc } }; } @computed get templates(): List { @@ -105,11 +119,12 @@ export class DocumentContentsView extends React.Component 7) return (null); if (!this.layout && (this.props.layoutKey !== "overlayLayout" || !this.templates.length)) return (null); return { console.log(test); }} diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx index d027ed516..47ec3b5a1 100644 --- a/src/client/views/nodes/DocumentView.tsx +++ b/src/client/views/nodes/DocumentView.tsx @@ -218,7 +218,15 @@ export class DocumentView extends DocComponent(Docu e.stopPropagation(); } - get dataDoc() { return this.props.DataDoc !== this.props.Document ? this.props.DataDoc : undefined; } + get dataDoc() { + if (this.props.DataDoc === undefined && this.props.Document.layout instanceof Doc) { + // if there is no dataDoc (ie, we're not rendering a temlplate layout), but this document + // has a template layout document, then we will render the template layout but use + // this document as the data document for the layout. + return this.props.Document; + } + return this.props.DataDoc !== this.props.Document ? this.props.DataDoc : undefined; + } startDragging(x: number, y: number, dropAction: dropActionType, dragSubBullets: boolean) { if (this._mainCont.current) { let allConnected = [this.props.Document, ...(dragSubBullets ? DocListCast(this.props.Document.subBulletDocs) : [])]; @@ -585,20 +593,23 @@ export class DocumentView extends DocComponent(Docu @computed get nativeWidth() { return this.Document.nativeWidth || 0; } @computed get nativeHeight() { return this.Document.nativeHeight || 0; } @computed get contents() { - return (); + return (); } render() { if (this.Document.hidden) { return null; } + let self = this; let backgroundColor = this.props.Document.layout instanceof Doc ? StrCast(this.props.Document.layout.backgroundColor) : this.Document.backgroundColor; + let foregroundColor = StrCast(this.props.Document.layout instanceof Doc ? this.props.Document.layout.color : this.props.Document.color); var nativeWidth = this.nativeWidth > 0 ? `${this.nativeWidth}px` : "100%"; var nativeHeight = BoolCast(this.props.Document.ignoreAspect) ? this.props.PanelHeight() / this.props.ContentScaling() : this.nativeHeight > 0 ? `${this.nativeHeight}px` : "100%"; return (
this._editorView!.state.doc.nodeSize - 3) { + this.props.Document.color = color; + } let colorMark = this._editorView!.state.schema.mark(this._editorView!.state.schema.marks.pFontColor, { color: color }); this._editorView!.dispatch(this._editorView!.state.tr.addMark(this._editorView!.state.selection.from, this._editorView!.state.selection.to, colorMark)); @@ -160,25 +164,28 @@ export class FormattedTextBox extends DocComponent<(FieldViewProps & FormattedTe e.stopPropagation(); } else { if (de.data instanceof DragManager.DocumentDragData) { - let ldocs = Cast(this.dataDoc.subBulletDocs, listSpec(Doc)); - if (!ldocs) { - this.dataDoc.subBulletDocs = new List([]); - } - ldocs = Cast(this.dataDoc.subBulletDocs, listSpec(Doc)); - if (!ldocs) return; - if (!ldocs || !ldocs[0] || ldocs[0] instanceof Promise || StrCast((ldocs[0] as Doc).layout).indexOf("CollectionView") === -1) { - ldocs.splice(0, 0, Docs.StackingDocument([], { title: StrCast(this.dataDoc.title) + "-subBullets", x: NumCast(this.props.Document.x), y: NumCast(this.props.Document.y) + NumCast(this.props.Document.height), width: 300, height: 300 })); - this.props.addDocument && this.props.addDocument(ldocs[0] as Doc); - this.props.Document.templates = new List([Templates.Bullet.Layout]); - this.props.Document.isBullet = true; - } - let stackDoc = (ldocs[0] as Doc); - if (de.data.moveDocument) { - de.data.moveDocument(de.data.draggedDocuments[0], stackDoc, (doc) => { - Cast(stackDoc.data, listSpec(Doc))!.push(doc); - return true; - }); - } + this.props.Document.layout = de.data.draggedDocuments[0]; + de.data.draggedDocuments[0].isTemplate = true; + e.stopPropagation(); + // let ldocs = Cast(this.dataDoc.subBulletDocs, listSpec(Doc)); + // if (!ldocs) { + // this.dataDoc.subBulletDocs = new List([]); + // } + // ldocs = Cast(this.dataDoc.subBulletDocs, listSpec(Doc)); + // if (!ldocs) return; + // if (!ldocs || !ldocs[0] || ldocs[0] instanceof Promise || StrCast((ldocs[0] as Doc).layout).indexOf("CollectionView") === -1) { + // ldocs.splice(0, 0, Docs.StackingDocument([], { title: StrCast(this.dataDoc.title) + "-subBullets", x: NumCast(this.props.Document.x), y: NumCast(this.props.Document.y) + NumCast(this.props.Document.height), width: 300, height: 300 })); + // this.props.addDocument && this.props.addDocument(ldocs[0] as Doc); + // this.props.Document.templates = new List([Templates.Bullet.Layout]); + // this.props.Document.isBullet = true; + // } + // let stackDoc = (ldocs[0] as Doc); + // if (de.data.moveDocument) { + // de.data.moveDocument(de.data.draggedDocuments[0], stackDoc, (doc) => { + // Cast(stackDoc.data, listSpec(Doc))!.push(doc); + // return true; + // }); + // } } } } @@ -426,6 +433,7 @@ export class FormattedTextBox extends DocComponent<(FieldViewProps & FormattedTe ContextMenu.Instance.addItem({ description: "Text Funcs...", subitems: subitems }); } render() { + let self = this; let style = this.props.isOverlay ? "scroll" : "hidden"; let rounded = StrCast(this.props.Document.borderRounding) === "100%" ? "-rounded" : ""; let interactive = InkingControl.Instance.selectedTool ? "" : "interactive"; @@ -435,7 +443,7 @@ export class FormattedTextBox extends DocComponent<(FieldViewProps & FormattedTe height: this.props.height ? this.props.height : undefined, background: this.props.hideOnLeave ? "rgba(0,0,0,0.4)" : undefined, opacity: this.props.hideOnLeave ? (this._entered || this.props.isSelected() || this.props.Document.libraryBrush ? 1 : 0.1) : 1, - color: this.props.color ? this.props.color : this.props.hideOnLeave ? "white" : "initial", + color: this.props.color ? this.props.color : this.props.hideOnLeave ? "white" : "inherit", pointerEvents: interactive ? "all" : "none", fontSize: "13px" }} -- cgit v1.2.3-70-g09d2 From 32e9b0e49c9df7da95b1c6d8721e392ffddc04de Mon Sep 17 00:00:00 2001 From: bob Date: Tue, 9 Jul 2019 12:48:07 -0400 Subject: fixed hyperlink following bug in formattedText --- src/client/views/nodes/FormattedTextBox.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'src') diff --git a/src/client/views/nodes/FormattedTextBox.tsx b/src/client/views/nodes/FormattedTextBox.tsx index 32bb97255..fd895507c 100644 --- a/src/client/views/nodes/FormattedTextBox.tsx +++ b/src/client/views/nodes/FormattedTextBox.tsx @@ -289,7 +289,7 @@ export class FormattedTextBox extends DocComponent<(FieldViewProps & FormattedTe if (e.button === 0 && ((!this.props.isSelected() && !e.ctrlKey) || (this.props.isSelected() && e.ctrlKey)) && !e.metaKey && e.target) { let href = (e.target as any).href; for (let parent = (e.target as any).parentNode; !href && parent; parent = parent.parentNode) { - href = parent.childNodes[0].href; + href = parent.childNodes[0].href ? parent.childNodes[0].href : parent.href; } if (href) { if (href.indexOf(DocServer.prepend("/doc/")) === 0) { -- cgit v1.2.3-70-g09d2