From 20f31796ed6f6c9fb71fa80cf858a7ac353300cf Mon Sep 17 00:00:00 2001 From: Bob Zeleznik Date: Tue, 7 May 2019 00:22:01 -0400 Subject: from last --- src/client/views/Templates.tsx | 28 +++++++++++++--------------- 1 file changed, 13 insertions(+), 15 deletions(-) (limited to 'src/client/views/Templates.tsx') diff --git a/src/client/views/Templates.tsx b/src/client/views/Templates.tsx index 5858ee014..738272913 100644 --- a/src/client/views/Templates.tsx +++ b/src/client/views/Templates.tsx @@ -51,24 +51,22 @@ export namespace Templates { ); export const Title = new Template("Title", TemplatePosition.InnerTop, - `
{layout}
{props.Document.title}
` + `
{layout}
+
{props.Document.title}
` ); export const Summary = new Template("Title", TemplatePosition.InnerTop, - `
{layout}
{props.Document.doc1.title}
` + `
+
+ {layout} +
+
+ +
+
+ +
+
` ); - // export const Summary = new Template("Title", TemplatePosition.InnerTop, - // `
- //
- // {layout} - //
- //
- // - //
- //
- // - //
- //
` - // ); export const TemplateList: Template[] = [Title, OuterCaption, InnerCaption, SideCaption]; -- cgit v1.2.3-70-g09d2 From 26141a697ae52a7edf3cc6845ce2153111f8860e Mon Sep 17 00:00:00 2001 From: bob Date: Tue, 7 May 2019 15:26:29 -0400 Subject: added Bullet template --- src/client/views/DocumentDecorations.tsx | 15 ++++++++++++--- src/client/views/TemplateMenu.tsx | 20 +++++++++++++++----- src/client/views/Templates.tsx | 18 +++++------------- src/client/views/collections/CollectionBaseView.tsx | 10 +++++++--- .../views/nodes/CollectionFreeFormDocumentView.tsx | 9 +++++---- 5 files changed, 44 insertions(+), 28 deletions(-) (limited to 'src/client/views/Templates.tsx') diff --git a/src/client/views/DocumentDecorations.tsx b/src/client/views/DocumentDecorations.tsx index e2f445874..8ae71fdc8 100644 --- a/src/client/views/DocumentDecorations.tsx +++ b/src/client/views/DocumentDecorations.tsx @@ -507,9 +507,18 @@ export class DocumentDecorations extends React.Component<{}, { value: string }> } let templates: Map = new Map(); - let doc = SelectionManager.SelectedDocuments()[0]; Array.from(Object.values(Templates.TemplateList)).map(template => { - let docTemps = doc.templates; + let docTemps = SelectionManager.SelectedDocuments().reduce((res: string[], doc: DocumentView, i) => { + let temps = doc.props.Document.templates; + if (temps instanceof List) { + temps.map(temp => { + if (temp !== Templates.Bullet.Layout || i === 0) { + res.push(temp); + } + }) + } + return res + }, [] as string[]); let checked = false; docTemps.forEach(temp => { if (template.Layout === temp) { @@ -560,7 +569,7 @@ export class DocumentDecorations extends React.Component<{}, { value: string }> - + diff --git a/src/client/views/TemplateMenu.tsx b/src/client/views/TemplateMenu.tsx index f29d9c8a1..376feb5a5 100644 --- a/src/client/views/TemplateMenu.tsx +++ b/src/client/views/TemplateMenu.tsx @@ -4,6 +4,8 @@ import { observer } from "mobx-react"; import './DocumentDecorations.scss'; import { Template } from "./Templates"; import { DocumentView } from "./nodes/DocumentView"; +import { List } from "../../new_fields/List"; +import { Doc } from "../../new_fields/Doc"; const higflyout = require("@hig/flyout"); export const { anchorPoints } = higflyout; export const Flyout = higflyout.default; @@ -25,24 +27,32 @@ class TemplateToggle extends React.Component<{ template: Template, checked: bool } export interface TemplateMenuProps { - doc: DocumentView; + docs: DocumentView[]; templates: Map; } @observer export class TemplateMenu extends React.Component { - @observable private _hidden: boolean = true; - @action toggleTemplate = (event: React.ChangeEvent, template: Template): void => { if (event.target.checked) { - this.props.doc.addTemplate(template); + if (template.Name == "Bullet") { + this.props.docs[0].addTemplate(template); + this.props.docs[0].props.Document.maximizedDocs = new List(this.props.docs.filter((v, i) => i !== 0).map(v => v.props.Document)); + } else { + this.props.docs.map(d => d.addTemplate(template)); + } this.props.templates.set(template, true); this.props.templates.forEach((checked, template) => console.log("Set Checked + " + checked + " " + this.props.templates.get(template))); } else { - this.props.doc.removeTemplate(template); + if (template.Name == "Bullet") { + this.props.docs[0].removeTemplate(template); + this.props.docs[0].props.Document.maximizedDocs = undefined; + } else { + this.props.docs.map(d => d.removeTemplate(template)); + } this.props.templates.set(template, false); this.props.templates.forEach((checked, template) => console.log("Unset Checked + " + checked + " " + this.props.templates.get(template))); } diff --git a/src/client/views/Templates.tsx b/src/client/views/Templates.tsx index 738272913..51fca4c41 100644 --- a/src/client/views/Templates.tsx +++ b/src/client/views/Templates.tsx @@ -54,21 +54,13 @@ export namespace Templates { `
{layout}
{props.Document.title}
` ); - export const Summary = new Template("Title", TemplatePosition.InnerTop, - `
-
- {layout} -
-
- -
-
- -
-
` + + export const Bullet = new Template("Bullet", TemplatePosition.InnerTop, + `
{layout}
+
` ); - export const TemplateList: Template[] = [Title, OuterCaption, InnerCaption, SideCaption]; + export const TemplateList: Template[] = [Title, OuterCaption, InnerCaption, SideCaption, Bullet]; export function sortTemplates(a: Template, b: Template) { if (a.Position < b.Position) { return -1; } diff --git a/src/client/views/collections/CollectionBaseView.tsx b/src/client/views/collections/CollectionBaseView.tsx index cbb568c07..14b92af48 100644 --- a/src/client/views/collections/CollectionBaseView.tsx +++ b/src/client/views/collections/CollectionBaseView.tsx @@ -95,15 +95,18 @@ export class CollectionBaseView extends React.Component { if (!this.createsCycle(doc, props.Document)) { //TODO This won't create the field if it doesn't already exist const value = Cast(props.Document[props.fieldKey], listSpec(Doc)); + let alreadyAdded = true; if (value !== undefined) { - if (allowDuplicates || !value.some(v => v[Id] === doc[Id])) { + if (allowDuplicates || !value.some(v => v instanceof Doc && v[Id] === doc[Id])) { + alreadyAdded = false; value.push(doc); } } else { + alreadyAdded = false; Doc.SetOnPrototype(this.props.Document, this.props.fieldKey, new List([doc])); } // set the ZoomBasis only if hasn't already been set -- bcz: maybe set/resetting the ZoomBasis should be a parameter to addDocument? - if (this.collectionViewType === CollectionViewType.Freeform || this.collectionViewType === CollectionViewType.Invalid) { + if (!alreadyAdded && (this.collectionViewType === CollectionViewType.Freeform || this.collectionViewType === CollectionViewType.Invalid)) { let zoom = NumCast(this.props.Document.scale, 1); Doc.SetOnPrototype(doc, "zoomBasis", zoom); } @@ -118,7 +121,8 @@ export class CollectionBaseView extends React.Component { const value = Cast(props.Document[props.fieldKey], listSpec(Doc), []); let index = -1; for (let i = 0; i < value.length; i++) { - if (value[i][Id] === doc[Id]) { + let v = value[i]; + if (v instanceof Doc && v[Id] === doc[Id]) { index = i; break; } diff --git a/src/client/views/nodes/CollectionFreeFormDocumentView.tsx b/src/client/views/nodes/CollectionFreeFormDocumentView.tsx index c4f85847a..df78d92e2 100644 --- a/src/client/views/nodes/CollectionFreeFormDocumentView.tsx +++ b/src/client/views/nodes/CollectionFreeFormDocumentView.tsx @@ -127,6 +127,7 @@ export class CollectionFreeFormDocumentView extends DocComponent => { + UndoManager.GetOpenBatches().forEach(batch => console.log(batch.batchName)); SelectionManager.DeselectAll(); let isMinimized: boolean | undefined; let maximizedDocs = await DocListCast(this.props.Document.maximizedDocs); @@ -144,8 +145,8 @@ export class CollectionFreeFormDocumentView extends DocComponent([scrpt[0], scrpt[1], maxx, maxy, maxw, maxh, Date.now(), isMinimized ? 1 : 0]) } } @@ -175,7 +176,7 @@ export class CollectionFreeFormDocumentView extends DocComponent Date: Wed, 8 May 2019 00:45:14 -0400 Subject: small fixes to titles, templates, minimizing, and keyvalue deletion --- src/client/views/Templates.tsx | 12 ++++++++++-- .../views/collections/collectionFreeForm/MarqueeView.tsx | 13 +++++++++++-- src/client/views/nodes/CollectionFreeFormDocumentView.tsx | 6 +++--- src/client/views/nodes/DocumentContentsView.tsx | 14 ++++++++++---- src/client/views/nodes/KeyValuePair.tsx | 5 +++-- 5 files changed, 37 insertions(+), 13 deletions(-) (limited to 'src/client/views/Templates.tsx') diff --git a/src/client/views/Templates.tsx b/src/client/views/Templates.tsx index 51fca4c41..de94a1578 100644 --- a/src/client/views/Templates.tsx +++ b/src/client/views/Templates.tsx @@ -50,6 +50,10 @@ export namespace Templates { `
{layout}
` ); + export const TitleOverlay = new Template("TitleOverlay", TemplatePosition.InnerTop, + `
{layout}
+
{props.Document.title}
` + ); export const Title = new Template("Title", TemplatePosition.InnerTop, `
{layout}
{props.Document.title}
` @@ -57,10 +61,14 @@ export namespace Templates { export const Bullet = new Template("Bullet", TemplatePosition.InnerTop, `
{layout}
-
` +
+ +
+
` ); - export const TemplateList: Template[] = [Title, OuterCaption, InnerCaption, SideCaption, Bullet]; + export const TemplateList: Template[] = [Title, TitleOverlay, OuterCaption, InnerCaption, SideCaption, Bullet]; export function sortTemplates(a: Template, b: Template) { if (a.Position < b.Position) { return -1; } diff --git a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx index c9b0b28f7..b9a6792ed 100644 --- a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx +++ b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx @@ -63,8 +63,17 @@ export class MarqueeView extends React.Component let text = await navigator.clipboard.readText(); let ns = text.split("\n").filter(t => t != "\r"); for (let i = 0; i < ns.length - 1; i++) { - while (!(ns[i].endsWith("-\r") || ns[i].endsWith(".\r") || ns[i].endsWith(":\r")) && i < ns.length - 1) { - ns.splice(i, 2, ns[i].substr(0, ns[i].length - 1) + ns[i + 1].trimLeft()); + if (ns[i].trim() === "") { + ns.splice(i, 1); + continue; + } + while (!(ns[i].trim() === "" || ns[i].endsWith("-\r") || ns[i].endsWith("-") || + ns[i].endsWith(".\r") || ns[i].endsWith(".") || + ns[i].endsWith(":\r") || ns[i].endsWith(":")) && i < ns.length - 1) { + let sub = ns[i].endsWith("\r") ? 1 : 0; + let br = ns[i + 1].trim() === ""; + ns.splice(i, 2, ns[i].substr(0, ns[i].length - sub) + ns[i + 1].trimLeft()); + if (br) break; } } ns.map(line => { diff --git a/src/client/views/nodes/CollectionFreeFormDocumentView.tsx b/src/client/views/nodes/CollectionFreeFormDocumentView.tsx index df78d92e2..0e34cb626 100644 --- a/src/client/views/nodes/CollectionFreeFormDocumentView.tsx +++ b/src/client/views/nodes/CollectionFreeFormDocumentView.tsx @@ -145,8 +145,8 @@ export class CollectionFreeFormDocumentView extends DocComponent { - layout = template.replace("{layout}", base); - base = layout; - }); + // bcz: templates are intended for the main document layout. However, + // a DocumentContentsView is also used to render the annotation overlay for a document. + // So we detect that here by checking the layoutKey. This should probably be moved into + // a prop so that the overlay can explicitly turn off templates. + if (this.props.layoutKey !== "backgroundLayout") { + this.templates.forEach(template => { + layout = template.replace("{layout}", base); + base = layout; + }); + } return layout; } diff --git a/src/client/views/nodes/KeyValuePair.tsx b/src/client/views/nodes/KeyValuePair.tsx index 203fb5625..5de660d57 100644 --- a/src/client/views/nodes/KeyValuePair.tsx +++ b/src/client/views/nodes/KeyValuePair.tsx @@ -46,8 +46,9 @@ export class KeyValuePair extends React.Component {
-- cgit v1.2.3-70-g09d2 From a8a5cf33985c47cb6e7c68f30c482232fc8d023a Mon Sep 17 00:00:00 2001 From: bob Date: Wed, 8 May 2019 10:13:13 -0400 Subject: converted template constants to screen space - need to think about more flexible api --- src/client/views/Templates.tsx | 8 ++++++-- src/client/views/nodes/DocumentContentsView.tsx | 14 ++++++++++---- 2 files changed, 16 insertions(+), 6 deletions(-) (limited to 'src/client/views/Templates.tsx') diff --git a/src/client/views/Templates.tsx b/src/client/views/Templates.tsx index de94a1578..6f706bdc5 100644 --- a/src/client/views/Templates.tsx +++ b/src/client/views/Templates.tsx @@ -52,11 +52,15 @@ export namespace Templates { export const TitleOverlay = new Template("TitleOverlay", TemplatePosition.InnerTop, `
{layout}
-
{props.Document.title}
` +
+ {props.Document.title} +
` ); export const Title = new Template("Title", TemplatePosition.InnerTop, `
{layout}
-
{props.Document.title}
` +
+ {props.Document.title} +
` ); export const Bullet = new Template("Bullet", TemplatePosition.InnerTop, diff --git a/src/client/views/nodes/DocumentContentsView.tsx b/src/client/views/nodes/DocumentContentsView.tsx index 1dc6343e8..294e17720 100644 --- a/src/client/views/nodes/DocumentContentsView.tsx +++ b/src/client/views/nodes/DocumentContentsView.tsx @@ -64,13 +64,19 @@ export class DocumentContentsView extends React.Component { - layout = template.replace("{layout}", base); + let self = this; + function convertConstantsToNative(match: string, offset: number, x: string) { + let px = Number(match.replace("px", "")); + return `${px * self.props.ScreenToLocalTransform().Scale}px`; + } + let nativizedTemplate = template.replace(/([0-9]+)px/g, convertConstantsToNative); + layout = nativizedTemplate.replace("{layout}", base); base = layout; }); } -- cgit v1.2.3-70-g09d2 From 007433dabbd6a8a5f702ac393ecd2b40b1c3a9d8 Mon Sep 17 00:00:00 2001 From: bob Date: Wed, 8 May 2019 18:31:14 -0400 Subject: fixes for templates including changing the relative order of CollectionOverlayView in the stack --- src/client/views/MainOverlayTextBox.tsx | 1 + src/client/views/Templates.tsx | 2 +- .../collectionFreeForm/CollectionFreeFormLinksView.tsx | 2 +- .../collectionFreeForm/CollectionFreeFormView.scss | 8 ++++++-- .../collectionFreeForm/CollectionFreeFormView.tsx | 15 +++++---------- .../views/collections/collectionFreeForm/MarqueeView.tsx | 3 +++ src/client/views/nodes/FormattedTextBox.scss | 1 + src/client/views/nodes/FormattedTextBox.tsx | 6 ++---- 8 files changed, 20 insertions(+), 18 deletions(-) (limited to 'src/client/views/Templates.tsx') diff --git a/src/client/views/MainOverlayTextBox.tsx b/src/client/views/MainOverlayTextBox.tsx index d32e3f21b..3b75c248a 100644 --- a/src/client/views/MainOverlayTextBox.tsx +++ b/src/client/views/MainOverlayTextBox.tsx @@ -43,6 +43,7 @@ export class MainOverlayTextBox extends React.Component this._textXf = tx ? tx : () => Transform.Identity(); this._textTargetDiv = div; if (div) { + if (div.parentElement && div.parentElement instanceof HTMLDivElement && div.parentElement.id === "screenSpace") this._textXf = () => Transform.Identity(); this._textColor = div.style.color; div.style.color = "transparent"; this.TextScroll = div.scrollTop; diff --git a/src/client/views/Templates.tsx b/src/client/views/Templates.tsx index 6f706bdc5..02f9aa510 100644 --- a/src/client/views/Templates.tsx +++ b/src/client/views/Templates.tsx @@ -39,7 +39,7 @@ export namespace Templates { // export const BasicLayout = new Template("Basic layout", "{layout}"); export const OuterCaption = new Template("Outer caption", TemplatePosition.OutterBottom, - `
{layout}
` + `
` ); export const InnerCaption = new Template("Inner caption", TemplatePosition.InnerBottom, diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormLinksView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormLinksView.tsx index 2d815a302..cbfbb1d2c 100644 --- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormLinksView.tsx +++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormLinksView.tsx @@ -1,4 +1,4 @@ -import { computed, IReactionDisposer, reaction } from "mobx"; +import { computed, IReactionDisposer, reaction, trace } from "mobx"; import { observer } from "mobx-react"; import { Utils } from "../../../../Utils"; import { DocumentManager } from "../../../util/DocumentManager"; diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.scss b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.scss index cb849b325..063c9e2cf 100644 --- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.scss +++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.scss @@ -37,7 +37,9 @@ border-radius: $border-radius; box-sizing: border-box; position: absolute; - overflow: hidden; + .marqueeView { + overflow: hidden; + } top: 0; left: 0; width: 100%; @@ -61,7 +63,9 @@ border-radius: $border-radius; box-sizing: border-box; position:absolute; - overflow: hidden; + .marqueeView { + overflow: hidden; + } top: 0; left: 0; width: 100%; diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx index fcc73d5b6..797f94d5f 100644 --- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx +++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx @@ -110,15 +110,11 @@ export class CollectionFreeFormView extends CollectionSubView(PanZoomDocument) { @action onPointerDown = (e: React.PointerEvent): void => { - let childSelected = Cast(this.props.Document[this.props.fieldKey], listSpec(Doc), [] as Doc[]).filter(doc => doc).reduce((childSelected, doc) => { - var dv = DocumentManager.Instance.getDocumentView(doc); - return childSelected || (dv && SelectionManager.IsSelected(dv) ? true : false); - }, false); if ((CollectionFreeFormView.RIGHT_BTN_DRAG && (((e.button === 2 && (!this.isAnnotationOverlay || this.zoomScaling() !== 1)) || - (e.button === 0 && e.altKey)) && (childSelected || this.props.active()))) || + (e.button === 0 && e.altKey)) && this.props.active())) || (!CollectionFreeFormView.RIGHT_BTN_DRAG && - ((e.button === 0 && !e.altKey && (!this.isAnnotationOverlay || this.zoomScaling() !== 1)) && (childSelected || this.props.active())))) { + ((e.button === 0 && !e.altKey && (!this.isAnnotationOverlay || this.zoomScaling() !== 1)) && this.props.active()))) { document.removeEventListener("pointermove", this.onPointerMove); document.removeEventListener("pointerup", this.onPointerUp); document.addEventListener("pointermove", this.onPointerMove); @@ -233,7 +229,6 @@ export class CollectionFreeFormView extends CollectionSubView(PanZoomDocument) { return NumCast(doc1.zIndex) - NumCast(doc2.zIndex); }).forEach((doc, index) => doc.zIndex = index + 1); doc.zIndex = docs.length + 1; - return doc; } focusDocument = (doc: Doc) => { @@ -316,18 +311,18 @@ export class CollectionFreeFormView extends CollectionSubView(PanZoomDocument) { {/* */} - + ); } } @observer -class CollectionFreeFormOverlayView extends React.Component { +class CollectionFreeFormOverlayView extends React.Component boolean }> { @computed get overlayView() { return (); + isTopMost={this.props.isTopMost} isSelected={this.props.isSelected} select={emptyFunction} />); } render() { return this.overlayView; diff --git a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx index 9764db1d4..740c50297 100644 --- a/src/client/views/collections/collectionFreeForm/MarqueeView.tsx +++ b/src/client/views/collections/collectionFreeForm/MarqueeView.tsx @@ -101,6 +101,8 @@ export class MarqueeView extends React.Component document.addEventListener("pointermove", this.onPointerMove, true); document.addEventListener("pointerup", this.onPointerUp, true); document.addEventListener("keydown", this.marqueeCommand, true); + console.log(this.props.container.props.Document.title); + e.stopPropagation(); } if (e.altKey) { e.preventDefault(); @@ -180,6 +182,7 @@ export class MarqueeView extends React.Component if (ink) { this.marqueeInkDelete(ink.inkData); } + SelectionManager.DeselectAll(); this.cleanupInteractions(false); e.stopPropagation(); } diff --git a/src/client/views/nodes/FormattedTextBox.scss b/src/client/views/nodes/FormattedTextBox.scss index 9e58a8e7f..458a62c5b 100644 --- a/src/client/views/nodes/FormattedTextBox.scss +++ b/src/client/views/nodes/FormattedTextBox.scss @@ -17,6 +17,7 @@ border-radius: inherit; border-color: $intermediate-color; box-sizing: border-box; + background-color: inherit; border-style: solid; overflow-y: scroll; overflow-x: hidden; diff --git a/src/client/views/nodes/FormattedTextBox.tsx b/src/client/views/nodes/FormattedTextBox.tsx index ee6000da7..4b3172e82 100644 --- a/src/client/views/nodes/FormattedTextBox.tsx +++ b/src/client/views/nodes/FormattedTextBox.tsx @@ -24,8 +24,8 @@ import { StrCast, Cast, NumCast, BoolCast } from "../../../new_fields/Types"; import { RichTextField } from "../../../new_fields/RichTextField"; import { Id } from "../../../new_fields/RefField"; import { UndoManager } from "../../util/UndoManager"; -const { buildMenuItems } = require("prosemirror-example-setup"); -const { menuBar } = require("prosemirror-menu"); +import { Transform } from "prosemirror-transform"; +import { Transform as MatrixTransform } from "../../util/Transform"; // FormattedTextBox: Displays an editable plain text node that maps to a specified Key of a Document // @@ -306,13 +306,11 @@ export class FormattedTextBox extends DocComponent<(FieldViewProps & FormattedTe render() { let style = this.props.isOverlay ? "scroll" : "hidden"; let rounded = NumCast(this.props.Document.borderRounding) < 0 ? "-rounded" : ""; - let color = StrCast(this.props.Document.backgroundColor); let interactive = InkingControl.Instance.selectedTool ? "" : "interactive"; return (