From 2781f77d46612720865ac0c1d115d6e013806103 Mon Sep 17 00:00:00 2001 From: yipstanley Date: Tue, 3 Dec 2019 17:34:58 -0500 Subject: improved multi-user touch stuff --- src/client/views/nodes/DocumentView.tsx | 23 +++++++++++------------ 1 file changed, 11 insertions(+), 12 deletions(-) (limited to 'src/client/views/nodes') diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx index 39a68f51e..38c46b258 100644 --- a/src/client/views/nodes/DocumentView.tsx +++ b/src/client/views/nodes/DocumentView.tsx @@ -142,7 +142,7 @@ export class DocumentView extends DocComponent(Docu (Math.abs(e.clientX - this._downX) < Utils.DRAG_THRESHOLD && Math.abs(e.clientY - this._downY) < Utils.DRAG_THRESHOLD)) { e.stopPropagation(); let preventDefault = true; - if (this._doubleTap && this.props.renderDepth && !this.onClickHandler?.script) { // disable double-click to show full screen for things that have an on click behavior since clicking them twice can be misinterpreted as a double click + if (this._doubleTap && this.props.renderDepth && !this.onClickHandler ?.script) { // disable double-click to show full screen for things that have an on click behavior since clicking them twice can be misinterpreted as a double click let fullScreenAlias = Doc.MakeAlias(this.props.Document); if (StrCast(fullScreenAlias.layoutKey) !== "layoutCustom" && fullScreenAlias.layoutCustom !== undefined) { fullScreenAlias.layoutKey = "layoutCustom"; @@ -362,7 +362,7 @@ export class DocumentView extends DocComponent(Docu @undoBatch @action setCustomView = (custom: boolean): void => { - if (this.props.ContainingCollectionView?.props.DataDoc || this.props.ContainingCollectionView?.props.Document.isTemplateDoc) { + if (this.props.ContainingCollectionView ?.props.DataDoc || this.props.ContainingCollectionView ?.props.Document.isTemplateDoc) { Doc.MakeMetadataFieldTemplate(this.props.Document, this.props.ContainingCollectionView.props.Document); } else { custom ? DocumentView.makeCustomViewClicked(this.props.Document, this.props.DataDoc) : DocumentView.makeNativeViewClicked(this.props.Document); @@ -651,16 +651,15 @@ export class DocumentView extends DocComponent(Docu @action handle2PointersMove = (e: TouchEvent) => { - let pt1 = e.targetTouches.item(0); - let pt2 = e.targetTouches.item(1); - if (pt1 && pt2 && this.prevPoints.has(pt1.identifier) && this.prevPoints.has(pt2.identifier)) { - let oldPoint1 = this.prevPoints.get(pt1.identifier); - let oldPoint2 = this.prevPoints.get(pt2.identifier); - let pinching = InteractionUtils.Pinning(pt1, pt2, oldPoint1!, oldPoint2!); - if (pinching !== 0) { - let newWidth = Math.max(Math.abs(oldPoint1!.clientX - oldPoint2!.clientX), Math.abs(pt1.clientX - pt2.clientX)) - this.props.Document.width = newWidth; - } + let myTouches = InteractionUtils.GetMyTargetTouches(e, this.prevPoints); + let pt1 = myTouches[0]; + let pt2 = myTouches[1]; + let oldPoint1 = this.prevPoints.get(pt1.identifier); + let oldPoint2 = this.prevPoints.get(pt2.identifier); + let pinching = InteractionUtils.Pinning(pt1, pt2, oldPoint1!, oldPoint2!); + if (pinching !== 0) { + let newWidth = Math.max(Math.abs(oldPoint1!.clientX - oldPoint2!.clientX), Math.abs(pt1.clientX - pt2.clientX)) + this.props.Document.width = newWidth; } } -- cgit v1.2.3-70-g09d2 From d8b3a6fc2cc6cf15680de82cc512ef5e392bd375 Mon Sep 17 00:00:00 2001 From: Bob Zeleznik Date: Tue, 3 Dec 2019 18:50:08 -0500 Subject: fixed text higlighing --- src/client/util/RichTextRules.ts | 8 ++++---- src/client/views/nodes/FormattedTextBox.tsx | 5 ++++- 2 files changed, 8 insertions(+), 5 deletions(-) (limited to 'src/client/views/nodes') diff --git a/src/client/util/RichTextRules.ts b/src/client/util/RichTextRules.ts index bf365579a..cef1011cc 100644 --- a/src/client/util/RichTextRules.ts +++ b/src/client/util/RichTextRules.ts @@ -72,28 +72,28 @@ export const inpRules = { return state.tr.deleteRange(start, end).addStoredMark(schema.marks.pFontSize.create({ fontSize: size })); }), new InputRule( - new RegExp(/t/), + new RegExp(/t$/), (state, match, start, end) => { if (state.selection.to === state.selection.from) return null; const node = (state.doc.resolve(start) as any).nodeAfter; return node ? state.tr.addMark(start, end, schema.marks.user_tag.create({ userid: Doc.CurrentUserEmail, tag: "todo", modified: Math.round(Date.now() / 1000 / 60) })) : state.tr; }), new InputRule( - new RegExp(/i/), + new RegExp(/i$/), (state, match, start, end) => { if (state.selection.to === state.selection.from) return null; const node = (state.doc.resolve(start) as any).nodeAfter; return node ? state.tr.addMark(start, end, schema.marks.user_tag.create({ userid: Doc.CurrentUserEmail, tag: "ignore", modified: Math.round(Date.now() / 1000 / 60) })) : state.tr; }), new InputRule( - new RegExp(/\!/), + new RegExp(/!$/), (state, match, start, end) => { if (state.selection.to === state.selection.from) return null; const node = (state.doc.resolve(start) as any).nodeAfter; return node ? state.tr.addMark(start, end, schema.marks.user_tag.create({ userid: Doc.CurrentUserEmail, tag: "important", modified: Math.round(Date.now() / 1000 / 60) })) : state.tr; }), new InputRule( - new RegExp(/\x/), + new RegExp(/x$/), (state, match, start, end) => { if (state.selection.to === state.selection.from) return null; const node = (state.doc.resolve(start) as any).nodeAfter; diff --git a/src/client/views/nodes/FormattedTextBox.tsx b/src/client/views/nodes/FormattedTextBox.tsx index f9b246c10..fcd8b6202 100644 --- a/src/client/views/nodes/FormattedTextBox.tsx +++ b/src/client/views/nodes/FormattedTextBox.tsx @@ -142,6 +142,7 @@ export class FormattedTextBox extends DocAnnotatableComponent<(FieldViewProps & constructor(props: any) { super(props); FormattedTextBox.Instance = this; + this.updateHighlights(); } public get CurrentDiv(): HTMLDivElement { return this._ref.current!; } @@ -191,6 +192,7 @@ export class FormattedTextBox extends DocAnnotatableComponent<(FieldViewProps & } const state = this._editorView.state.apply(tx); this._editorView.updateState(state); + (tx.storedMarks && !this._editorView.state.storedMarks) && (this._editorView.state.storedMarks = tx.storedMarks); const tsel = this._editorView.state.selection.$from; tsel.marks().filter(m => m.type === this._editorView!.state.schema.marks.user_mark).map(m => AudioBox.SetScrubTime(Math.max(0, m.attrs.modified * 5000 - 1000))); @@ -328,7 +330,7 @@ export class FormattedTextBox extends DocAnnotatableComponent<(FieldViewProps & } return ret; } - static _highlights: string[] = []; + static _highlights: string[] = ["Text from Others", "Todo Items", "Important Items", "Disagree Items", "Ignore Items"]; updateHighlights = () => { clearStyleSheetRules(FormattedTextBox._userStyleSheet); @@ -370,6 +372,7 @@ export class FormattedTextBox extends DocAnnotatableComponent<(FieldViewProps & document.addEventListener("pointermove", this.sidebarMove); document.addEventListener("pointerup", this.sidebarUp); e.stopPropagation(); + e.preventDefault(); // prevents text from being selected during drag } sidebarMove = (e: PointerEvent) => { let bounds = this.CurrentDiv.getBoundingClientRect(); -- cgit v1.2.3-70-g09d2 From 97a4a9b1cfddc8b147ff61be13624704949c97f7 Mon Sep 17 00:00:00 2001 From: bob Date: Wed, 4 Dec 2019 12:50:38 -0500 Subject: tweaks to textbox sidebar. update to passport and npm --- package.json | 4 ++-- src/client/views/nodes/FormattedTextBox.scss | 1 + src/client/views/nodes/FormattedTextBox.tsx | 3 ++- src/server/Initialization.ts | 2 +- 4 files changed, 6 insertions(+), 4 deletions(-) (limited to 'src/client/views/nodes') diff --git a/package.json b/package.json index 574c7e7fa..32344aad4 100644 --- a/package.json +++ b/package.json @@ -81,7 +81,7 @@ "@types/mongoose": "^5.5.8", "@types/node": "^10.12.30", "@types/nodemailer": "^4.6.6", - "@types/passport": "^1.0.0", + "@types/passport": "^1.0.2", "@types/passport-google-oauth20": "^2.0.2", "@types/passport-local": "^1.0.33", "@types/pdfjs-dist": "^2.0.0", @@ -171,7 +171,7 @@ "nodemailer": "^5.1.1", "nodemon": "^1.18.10", "normalize.css": "^8.0.1", - "npm": "^6.12.0", + "npm": "^6.13.2", "p-limit": "^2.2.0", "passport": "^0.4.0", "passport-google-oauth20": "^2.0.0", diff --git a/src/client/views/nodes/FormattedTextBox.scss b/src/client/views/nodes/FormattedTextBox.scss index c06f38a6c..f3a14169a 100644 --- a/src/client/views/nodes/FormattedTextBox.scss +++ b/src/client/views/nodes/FormattedTextBox.scss @@ -58,6 +58,7 @@ height: 35px; background: lightgray; border-radius: 20px; + cursor:grabbing; } .formattedTextBox-cont>.formattedTextBox-sidebar-handle { diff --git a/src/client/views/nodes/FormattedTextBox.tsx b/src/client/views/nodes/FormattedTextBox.tsx index fcd8b6202..481ae441e 100644 --- a/src/client/views/nodes/FormattedTextBox.tsx +++ b/src/client/views/nodes/FormattedTextBox.tsx @@ -197,6 +197,7 @@ export class FormattedTextBox extends DocAnnotatableComponent<(FieldViewProps & const tsel = this._editorView.state.selection.$from; tsel.marks().filter(m => m.type === this._editorView!.state.schema.marks.user_mark).map(m => AudioBox.SetScrubTime(Math.max(0, m.attrs.modified * 5000 - 1000))); this._applyingChange = true; + this.extensionDoc && !this.extensionDoc.lastModified && (this.extensionDoc.backgroundColor = "lightGray"); this.extensionDoc && (this.extensionDoc.lastModified = new DateField(new Date(Date.now()))); this.dataDoc[this.props.fieldKey] = new RichTextField(JSON.stringify(state.toJSON()), state.doc.textBetween(0, state.doc.content.size, "\n\n")); this._applyingChange = false; @@ -1131,7 +1132,7 @@ export class FormattedTextBox extends DocAnnotatableComponent<(FieldViewProps & e.stopPropagation(); }} > + style={{ color: this._recording ? "red" : "blue", opacity: this._recording ? 1 : 0.5, display: this.props.isSelected() ? "" : "none" }} icon={"microphone"} size="sm" /> ); diff --git a/src/server/Initialization.ts b/src/server/Initialization.ts index 6fe67f2c7..ff2b64317 100644 --- a/src/server/Initialization.ts +++ b/src/server/Initialization.ts @@ -40,7 +40,7 @@ export default async function InitializeServer(options: InitializationOptions) { app.use("*", ({ user, originalUrl }, res, next) => { if (user && !originalUrl.includes("Heartbeat")) { - const userEmail = user.email; + const userEmail = (user as any).email; if (userEmail) { timeMap[userEmail] = Date.now(); } -- cgit v1.2.3-70-g09d2 From 710dda13398c01b2b0f63b033ccca0c8ea4f7e49 Mon Sep 17 00:00:00 2001 From: bob Date: Wed, 4 Dec 2019 14:28:24 -0500 Subject: fixed mainview flyoutbehavior a bit. fixed keyvaluebox editing of lists a little. --- src/client/views/EditableView.tsx | 6 +++--- src/client/views/MainView.tsx | 2 +- src/client/views/collections/CollectionTreeView.tsx | 16 ++++++++++++++-- src/client/views/nodes/KeyValueBox.tsx | 8 ++++---- src/new_fields/DateField.ts | 4 ++++ src/new_fields/List.ts | 3 +-- 6 files changed, 27 insertions(+), 12 deletions(-) (limited to 'src/client/views/nodes') diff --git a/src/client/views/EditableView.tsx b/src/client/views/EditableView.tsx index f78b61892..ea9d548a1 100644 --- a/src/client/views/EditableView.tsx +++ b/src/client/views/EditableView.tsx @@ -10,7 +10,7 @@ export interface EditableProps { /** * Called to get the initial value for editing * */ - GetValue(): string; + GetValue(): string | undefined; /** * Called to apply changes @@ -108,8 +108,8 @@ export class EditableView extends React.Component { @action private finalizeEdit(value: string, shiftDown: boolean) { + this._editing = false; if (this.props.SetValue(value, shiftDown)) { - this._editing = false; this.props.isEditingCallback && this.props.isEditingCallback(false); } } @@ -124,7 +124,7 @@ export class EditableView extends React.Component { } render() { - if (this._editing) { + if (this._editing && this.props.GetValue() !== undefined) { return this.props.autosuggestProps ? { MainView.Instance._flyoutTranslate = true; - MainView.Instance.flyoutWidth = 250; + MainView.Instance.flyoutWidth = (MainView.Instance.flyoutWidth || 250); }); @computed get expandButton() { diff --git a/src/client/views/collections/CollectionTreeView.tsx b/src/client/views/collections/CollectionTreeView.tsx index 48ea35c6b..95503147a 100644 --- a/src/client/views/collections/CollectionTreeView.tsx +++ b/src/client/views/collections/CollectionTreeView.tsx @@ -279,7 +279,7 @@ class TreeView extends React.Component { const contents = doc[key]; let contentElement: (JSX.Element | null)[] | JSX.Element = []; - if (contents instanceof Doc || Cast(contents, listSpec(Doc))) { + if (contents instanceof Doc || (Cast(contents, listSpec(Doc)) && (Cast(contents, listSpec(Doc))!.length && Cast(contents, listSpec(Doc))![0] instanceof Doc))) { const remDoc = (doc: Doc) => this.remove(doc, key); const addDoc = (doc: Doc, addBefore?: Doc, before?: boolean) => Doc.AddDocToList(this.dataDoc, key, doc, addBefore, before, false, true); contentElement = TreeView.GetChildElements(contents instanceof Doc ? [contents] : @@ -294,7 +294,7 @@ class TreeView extends React.Component { height={13} fontSize={12} GetValue={() => Field.toKeyValueString(doc, key)} - SetValue={(value: string) => KeyValueBox.SetField(doc, key, value)} />; + SetValue={(value: string) => KeyValueBox.SetField(doc, key, value, true)} />; } rows.push(
{key + ":"} @@ -302,6 +302,18 @@ class TreeView extends React.Component { {contentElement}
); } + rows.push(
+ ""} + SetValue={(value: string) => { + value.indexOf(":") !== -1 && KeyValueBox.SetField(doc, value.substring(0, value.indexOf(":")), value.substring(value.indexOf(":") + 1, value.length), true); + return true; + }} /> +
); return rows; } diff --git a/src/client/views/nodes/KeyValueBox.tsx b/src/client/views/nodes/KeyValueBox.tsx index fba29e4cd..322d639dc 100644 --- a/src/client/views/nodes/KeyValueBox.tsx +++ b/src/client/views/nodes/KeyValueBox.tsx @@ -66,10 +66,10 @@ export class KeyValueBox extends React.Component { return { script, type: dubEq, onDelegate: eq }; } - public static ApplyKVPScript(doc: Doc, key: string, kvpScript: KVPScript): boolean { + public static ApplyKVPScript(doc: Doc, key: string, kvpScript: KVPScript, forceOnDelegate?: boolean): boolean { const { script, type, onDelegate } = kvpScript; //const target = onDelegate ? Doc.Layout(doc.layout) : Doc.GetProto(doc); // bcz: TODO need to be able to set fields on layout templates - const target = onDelegate ? doc : Doc.GetProto(doc); + const target = forceOnDelegate || onDelegate ? doc : Doc.GetProto(doc); let field: Field; if (type === "computed") { field = new ComputedField(script); @@ -88,10 +88,10 @@ export class KeyValueBox extends React.Component { } @undoBatch - public static SetField(doc: Doc, key: string, value: string) { + public static SetField(doc: Doc, key: string, value: string, forceOnDelegate?: boolean) { const script = this.CompileKVPScript(value); if (!script) return false; - return this.ApplyKVPScript(doc, key, script); + return this.ApplyKVPScript(doc, key, script, forceOnDelegate); } onPointerDown = (e: React.PointerEvent): void => { diff --git a/src/new_fields/DateField.ts b/src/new_fields/DateField.ts index abec91e06..4f999e5e8 100644 --- a/src/new_fields/DateField.ts +++ b/src/new_fields/DateField.ts @@ -19,6 +19,10 @@ export class DateField extends ObjectField { return new DateField(this.date); } + toString() { + return `${this.date.toISOString()}`; + } + [ToScriptString]() { return `new DateField(new Date(${this.date.toISOString()}))`; } diff --git a/src/new_fields/List.ts b/src/new_fields/List.ts index e9101158b..bb48b1bb3 100644 --- a/src/new_fields/List.ts +++ b/src/new_fields/List.ts @@ -290,8 +290,7 @@ class ListImpl extends ObjectField { private [SelfProxy]: any; [ToScriptString]() { - return "invalid"; - // return `new List([${(this as any).map((field => Field.toScriptString(field))}])`; + return `new List([${(this as any).map((field: any) => Field.toScriptString(field))}])`; } } export type List = ListImpl & (T | (T extends RefField ? Promise : never))[]; -- cgit v1.2.3-70-g09d2 From 74839056c8fccb216ee682c642771ab101b43d35 Mon Sep 17 00:00:00 2001 From: bob Date: Wed, 4 Dec 2019 14:34:17 -0500 Subject: from last --- src/client/views/nodes/FieldView.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'src/client/views/nodes') diff --git a/src/client/views/nodes/FieldView.tsx b/src/client/views/nodes/FieldView.tsx index c93746773..048960c5e 100644 --- a/src/client/views/nodes/FieldView.tsx +++ b/src/client/views/nodes/FieldView.tsx @@ -53,7 +53,7 @@ export interface FieldViewProps { @observer export class FieldView extends React.Component { public static LayoutString(fieldType: { name: string }, fieldStr: string) { - return `<${fieldType.name} {...props} fieldKey={"${fieldStr}"}/>`; //e.g., "" + return `<${fieldType.name} {...props} fieldKey={'${fieldStr}'}/>`; //e.g., "" } @computed -- cgit v1.2.3-70-g09d2 From 968d678e8aeb6f57cc892e3fe789067a8246c5fe Mon Sep 17 00:00:00 2001 From: bob Date: Wed, 4 Dec 2019 17:47:28 -0500 Subject: started to add paths --- src/client/documents/Documents.ts | 5 +-- src/client/util/RichTextSchema.tsx | 3 +- src/client/views/CollectionLinearView.tsx | 1 + src/client/views/MainView.tsx | 11 ++++--- src/client/views/OverlayView.tsx | 1 + .../views/collections/CollectionDockingView.tsx | 38 +++++++++++++--------- .../views/collections/CollectionSchemaView.tsx | 1 + .../views/collections/CollectionStackingView.tsx | 1 + .../views/collections/CollectionTreeView.tsx | 36 +++++++++++--------- .../collectionFreeForm/CollectionFreeFormView.tsx | 1 + .../views/nodes/ContentFittingDocumentView.tsx | 4 ++- src/client/views/nodes/DocumentView.tsx | 12 ++++--- src/client/views/nodes/FieldView.tsx | 1 + src/client/views/nodes/FormattedTextBoxComment.tsx | 3 +- .../views/presentationview/PresElementBox.tsx | 3 +- src/client/views/search/SearchItem.tsx | 3 +- 16 files changed, 78 insertions(+), 46 deletions(-) (limited to 'src/client/views/nodes') diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts index e0f2858ba..5d5bdfcbd 100644 --- a/src/client/documents/Documents.ts +++ b/src/client/documents/Documents.ts @@ -534,7 +534,8 @@ export namespace Docs { export type DocConfig = { doc: Doc, - initialWidth?: number + initialWidth?: number, + path?: Doc[] }; export function StandardCollectionDockingDocument(configs: Array, options: DocumentOptions, id?: string, type: string = "row") { @@ -543,7 +544,7 @@ export namespace Docs { { type: type, content: [ - ...configs.map(config => CollectionDockingView.makeDocumentConfig(config.doc, undefined, config.initialWidth)) + ...configs.map(config => CollectionDockingView.makeDocumentConfig(config.doc, undefined, config.initialWidth, config.path)) ] } ] diff --git a/src/client/util/RichTextSchema.tsx b/src/client/util/RichTextSchema.tsx index 3b786e61d..4612f2885 100644 --- a/src/client/util/RichTextSchema.tsx +++ b/src/client/util/RichTextSchema.tsx @@ -761,8 +761,9 @@ export class DashDocView { this._dashSpan.style.width = this._outer.style.width = dashDoc[WidthSym]() + "px"; }); ReactDOM.render( this.openWorkspace(mainDoc), 0); @@ -271,6 +270,7 @@ export class MainView extends React.Component { {!mainContainer ? (null) : this.flyoutWidth; - addDocTabFunc = (doc: Doc, data: Opt, where: string) => { + addDocTabFunc = (doc: Doc, data: Opt, where: string, libraryPath?: Doc[]) => { if (where === "close") { return CollectionDockingView.CloseRightSplit(doc); } @@ -346,7 +346,7 @@ export class MainView extends React.Component { this.openWorkspace(doc); return true; } else { - return CollectionDockingView.AddRightSplit(doc, undefined); + return CollectionDockingView.AddRightSplit(doc, undefined, undefined, libraryPath); } } mainContainerXf = () => new Transform(0, -this._buttonBarHeight, 1); @@ -363,6 +363,7 @@ export class MainView extends React.Component { { @observable public static Instances: CollectionDockingView[] = []; @computed public static get Instance() { return CollectionDockingView.Instances[0]; } - public static makeDocumentConfig(document: Doc, dataDoc: Doc | undefined, width?: number) { + public static makeDocumentConfig(document: Doc, dataDoc: Doc | undefined, width?: number, libraryPath?: Doc[]) { return { type: 'react-component', component: 'DocumentFrameRenderer', @@ -47,7 +47,8 @@ export class CollectionDockingView extends React.Component d[Id]) : [] //collectionDockingView: CollectionDockingView.Instance } }; @@ -95,12 +96,12 @@ export class CollectionDockingView extends React.Component { + public AddTab = (stack: any, document: Doc, dataDocument: Doc | undefined, libraryPath?: Doc[]) => { Doc.GetProto(document).lastOpened = new DateField; - const docContentConfig = CollectionDockingView.makeDocumentConfig(document, dataDocument); + const docContentConfig = CollectionDockingView.makeDocumentConfig(document, dataDocument, undefined, libraryPath); if (stack === undefined) { let stack: any = this._goldenLayout.root; while (!stack.isStack) { @@ -427,10 +428,6 @@ export class CollectionDockingView extends React.Component, dragSpan); ReactDOM.render(, gearSpan); - // ReactDOM.render( { - // where === "onRight" ? CollectionDockingView.AddRightSplit(doc, dataDoc) : CollectionDockingView.Instance.AddTab(stack, doc, dataDoc); - // return true; - // }} />, upDiv); tab.reactComponents = [dragSpan, gearSpan, upDiv]; tab.element.append(dragSpan); tab.element.append(gearSpan); @@ -532,11 +529,13 @@ interface DockedFrameProps { documentId: FieldId; dataDocumentId: FieldId; glContainer: any; + libraryPath: (FieldId[]) //collectionDockingView: CollectionDockingView } @observer export class DockedFrameRenderer extends React.Component { _mainCont: HTMLDivElement | null = null; + @observable private _libraryPath: Doc[] = []; @observable private _panelWidth = 0; @observable private _panelHeight = 0; @observable private _document: Opt; @@ -554,6 +553,14 @@ export class DockedFrameRenderer extends React.Component { DocServer.GetRefField(this.props.dataDocumentId).then(action((f: Opt) => this._dataDoc = f as Doc)); } })); + this.props.libraryPath && this.setupLibraryPath(); + } + + async setupLibraryPath() { + Promise.all(this.props.libraryPath.map(async docid => { + let d = await DocServer.GetRefField(docid); + return d instanceof Doc ? d : undefined + })).then(action((list: (Doc | undefined)[]) => this._libraryPath = list.filter(d => d).map(d => d as Doc))); } /** @@ -640,17 +647,17 @@ export class DockedFrameRenderer extends React.Component { get previewPanelCenteringOffset() { return this.nativeWidth() && !this.layoutDoc!.ignoreAspect ? (this._panelWidth - this.nativeWidth() * this.contentScaling()) / 2 : 0; } get widthpercent() { return this.nativeWidth() && !this.layoutDoc!.ignoreAspect ? `${(this.nativeWidth() * this.contentScaling()) / this.panelWidth() * 100}%` : undefined; } - addDocTab = (doc: Doc, dataDoc: Opt, location: string) => { + addDocTab = (doc: Doc, dataDoc: Opt, location: string, libraryPath?: Doc[]) => { SelectionManager.DeselectAll(); if (doc.dockingConfig) { MainView.Instance.openWorkspace(doc); return true; } else if (location === "onRight") { - return CollectionDockingView.AddRightSplit(doc, dataDoc); + return CollectionDockingView.AddRightSplit(doc, dataDoc, undefined, libraryPath); } else if (location === "close") { return CollectionDockingView.CloseRightSplit(doc); } else { - return CollectionDockingView.Instance.AddTab(this._stack, doc, dataDoc); + return CollectionDockingView.Instance.AddTab(this._stack, doc, dataDoc, libraryPath); } } @@ -659,6 +666,7 @@ export class DockedFrameRenderer extends React.Component { const document = this._document; const resolvedDataDoc = document.layout instanceof Doc ? document : this._dataDoc; return doc) { doc) { return boolean; + addDocTab: (doc: Doc, dataDoc: Doc | undefined, where: string, libraryPath?: Doc[]) => boolean; pinToPres: (document: Doc) => void; panelWidth: () => number; panelHeight: () => number; @@ -95,8 +96,8 @@ class TreeView extends React.Component { @computed get MAX_EMBED_HEIGHT() { return NumCast(this.props.document.maxEmbedHeight, 300); } @computed get dataDoc() { return this.templateDataDoc ? this.templateDataDoc : this.props.document; } @computed get fieldKey() { - const splits = StrCast(Doc.LayoutField(this.props.document)).split("fieldKey={\""); - return splits.length > 1 ? splits[1].split("\"")[0] : "data"; + const splits = StrCast(Doc.LayoutField(this.props.document)).split("fieldKey={\'"); + return splits.length > 1 ? splits[1].split("\'")[0] : "data"; } childDocList(field: string) { const layout = Doc.LayoutField(this.props.document) instanceof Doc ? Doc.LayoutField(this.props.document) as Doc : undefined; @@ -120,7 +121,7 @@ class TreeView extends React.Component { } @undoBatch delete = () => this.props.deleteDoc(this.props.document); - @undoBatch openRight = () => this.props.addDocTab(this.props.document, this.templateDataDoc, "onRight"); + @undoBatch openRight = () => this.props.addDocTab(this.props.document, this.templateDataDoc, "onRight", this.props.libraryPath); @undoBatch indent = () => this.props.addDocument(this.props.document) && this.delete(); @undoBatch move = (doc: Doc, target: Doc, addDoc: (doc: Doc) => boolean) => { return this.props.document !== target && this.props.deleteDoc(doc) && addDoc(doc); @@ -194,8 +195,8 @@ class TreeView extends React.Component { ContextMenu.Instance.addItem({ description: "Clear All", event: () => Doc.GetProto(CurrentUserUtils.UserDocument.recentlyClosed as Doc).data = new List(), icon: "plus" }); } else if (this.props.document !== CurrentUserUtils.UserDocument.workspaces) { ContextMenu.Instance.addItem({ description: "Pin to Presentation", event: () => this.props.pinToPres(this.props.document), icon: "tv" }); - ContextMenu.Instance.addItem({ description: "Open Tab", event: () => this.props.addDocTab(this.props.document, this.templateDataDoc, "inTab"), icon: "folder" }); - ContextMenu.Instance.addItem({ description: "Open Right", event: () => this.props.addDocTab(this.props.document, this.templateDataDoc, "onRight"), icon: "caret-square-right" }); + ContextMenu.Instance.addItem({ description: "Open Tab", event: () => this.props.addDocTab(this.props.document, this.templateDataDoc, "inTab", this.props.libraryPath), icon: "folder" }); + ContextMenu.Instance.addItem({ description: "Open Right", event: () => this.props.addDocTab(this.props.document, this.templateDataDoc, "onRight", this.props.libraryPath), icon: "caret-square-right" }); if (DocumentManager.Instance.getDocumentViews(this.dataDoc).length) { ContextMenu.Instance.addItem({ description: "Focus", event: () => (view => view && view.props.focus(this.props.document, true))(DocumentManager.Instance.getFirstDocumentView(this.dataDoc)), icon: "camera" }); } @@ -286,7 +287,7 @@ class TreeView extends React.Component { DocListCast(contents), this.props.treeViewId, doc, undefined, key, this.props.containingCollection, this.props.prevSibling, addDoc, remDoc, this.move, this.props.dropAction, this.props.addDocTab, this.props.pinToPres, this.props.ScreenToLocalTransform, this.props.outerXf, this.props.active, this.props.panelWidth, this.props.ChromeHeight, this.props.renderDepth, this.props.hideHeaderFields, this.props.preventTreeViewOpen, - [...this.props.renderedIds, doc[Id]]); + [...this.props.renderedIds, doc[Id]], this.props.libraryPath); } else { contentElement = { this.templateDataDoc, expandKey, this.props.containingCollection, this.props.prevSibling, addDoc, remDoc, this.move, this.props.dropAction, this.props.addDocTab, this.props.pinToPres, this.props.ScreenToLocalTransform, this.props.outerXf, this.props.active, this.props.panelWidth, this.props.ChromeHeight, this.props.renderDepth, this.props.hideHeaderFields, this.props.preventTreeViewOpen, - [...this.props.renderedIds, this.props.document[Id]])} + [...this.props.renderedIds, this.props.document[Id]], this.props.libraryPath)} ; } else if (this.treeViewExpandedView === "fields") { return
    @@ -343,6 +344,7 @@ class TreeView extends React.Component { { renderDepth: number, hideHeaderFields: () => boolean, preventTreeViewOpen: boolean, - renderedIds: string[] + renderedIds: string[], + libraryPath: Doc[] | undefined ) { const viewSpecScript = Cast(containingCollection.viewSpecScript, ScriptField); if (viewSpecScript) { @@ -499,9 +502,9 @@ class TreeView extends React.Component { } const indent = i === 0 ? undefined : () => { - if (StrCast(docs[i - 1].layout).indexOf("fieldKey") !== -1) { - const fieldKeysub = StrCast(docs[i - 1].layout).split("fieldKey")[1]; - const fieldKey = fieldKeysub.split("\"")[1]; + if (StrCast(docs[i - 1].layout).indexOf('fieldKey') !== -1) { + const fieldKeysub = StrCast(docs[i - 1].layout).split('fieldKey')[1]; + const fieldKey = fieldKeysub.split("\'")[1]; if (fieldKey && Cast(docs[i - 1][fieldKey], listSpec(Doc)) !== undefined) { Doc.AddDocToList(docs[i - 1], fieldKey, child); docs[i - 1].treeViewOpen = true; @@ -510,9 +513,9 @@ class TreeView extends React.Component { } }; const outdent = !parentCollectionDoc ? undefined : () => { - if (StrCast(parentCollectionDoc.layout).indexOf("fieldKey") !== -1) { - const fieldKeysub = StrCast(parentCollectionDoc.layout).split("fieldKey")[1]; - const fieldKey = fieldKeysub.split("\"")[1]; + if (StrCast(parentCollectionDoc.layout).indexOf('fieldKey') !== -1) { + const fieldKeysub = StrCast(parentCollectionDoc.layout).split('fieldKey')[1]; + const fieldKey = fieldKeysub.split("\'")[1]; Doc.AddDocToList(parentCollectionDoc, fieldKey, child, parentPrevSibling, false); parentCollectionDoc.treeViewOpen = true; remove(child); @@ -529,6 +532,7 @@ class TreeView extends React.Component { return !(child instanceof Doc) ? (null) : BoolCast(this.props.Document.hideHeaderFields), - BoolCast(this.props.Document.preventTreeViewOpen), []) + BoolCast(this.props.Document.preventTreeViewOpen), [], this.props.LibraryPath) }
diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx index c69b264c4..c3e064da5 100644 --- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx +++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx @@ -627,6 +627,7 @@ export class CollectionFreeFormView extends CollectionSubView(PanZoomDocument) { ...this.props, DataDoc: childData, Document: childLayout, + LibraryPath: this.props.LibraryPath ? [...this.props.LibraryPath, this.props.Document] : [], layoutKey: undefined, ruleProvider: this.Document.isRuleProvider && childLayout.type !== DocumentType.TEXT ? this.props.Document : this.props.ruleProvider, //bcz: hack! - currently ruleProviders apply to documents in nested colleciton, not direct children of themselves onClick: undefined, // this.props.onClick, // bcz: check this out -- I don't think we want to inherit click handlers, or we at least need a way to ignore them diff --git a/src/client/views/nodes/ContentFittingDocumentView.tsx b/src/client/views/nodes/ContentFittingDocumentView.tsx index efc907f9b..86fab0ba0 100644 --- a/src/client/views/nodes/ContentFittingDocumentView.tsx +++ b/src/client/views/nodes/ContentFittingDocumentView.tsx @@ -17,6 +17,7 @@ import { CollectionView } from "../collections/CollectionView"; interface ContentFittingDocumentViewProps { Document?: Doc; DataDocument?: Doc; + LibraryPath: Doc[]; childDocs?: Doc[]; renderDepth: number; fitToBox?: boolean; @@ -85,8 +86,9 @@ export class ContentFittingDocumentView extends React.Component ; Document: Doc; DataDoc?: Doc; + LibraryPath: Doc[]; fitToBox?: boolean; onClick?: ScriptField; addDocument?: (doc: Doc) => boolean; @@ -70,7 +71,7 @@ export interface DocumentViewProps { parentActive: (outsideReaction: boolean) => boolean; whenActiveChanged: (isActive: boolean) => void; bringToFront: (doc: Doc, sendToBack?: boolean) => void; - addDocTab: (doc: Doc, dataDoc: Doc | undefined, where: string) => boolean; + addDocTab: (doc: Doc, dataDoc: Doc | undefined, where: string, libraryPath?: Doc[]) => boolean; pinToPres: (document: Doc) => void; zoomToScale: (scale: number) => void; backgroundColor: (doc: Doc) => string | undefined; @@ -401,9 +402,9 @@ export class DocumentView extends DocComponent(Docu const cm = ContextMenu.Instance; const subitems: ContextMenuProps[] = []; - subitems.push({ description: "Open Full Screen", event: () => CollectionDockingView.Instance && CollectionDockingView.Instance.OpenFullScreen(this), icon: "desktop" }); - subitems.push({ description: "Open Tab ", event: () => this.props.addDocTab(this.props.Document, this.props.DataDoc, "inTab"), icon: "folder" }); - subitems.push({ description: "Open Right ", event: () => this.props.addDocTab(this.props.Document, this.props.DataDoc, "onRight"), icon: "caret-square-right" }); + subitems.push({ description: "Open Full Screen", event: () => CollectionDockingView.Instance && CollectionDockingView.Instance.OpenFullScreen(this, this.props.LibraryPath), icon: "desktop" }); + subitems.push({ description: "Open Tab ", event: () => this.props.addDocTab(this.props.Document, this.props.DataDoc, "inTab", this.props.LibraryPath), icon: "folder" }); + subitems.push({ description: "Open Right ", event: () => this.props.addDocTab(this.props.Document, this.props.DataDoc, "onRight", this.props.LibraryPath), icon: "caret-square-right" }); subitems.push({ description: "Open Alias Tab ", event: () => this.props.addDocTab(Doc.MakeAlias(this.props.Document), this.props.DataDoc, "inTab"), icon: "folder" }); subitems.push({ description: "Open Alias Right", event: () => this.props.addDocTab(Doc.MakeAlias(this.props.Document), this.props.DataDoc, "onRight"), icon: "caret-square-right" }); subitems.push({ description: "Open Fields ", event: () => this.props.addDocTab(Docs.Create.KVPDocument(this.props.Document, { width: 300, height: 300 }), undefined, "onRight"), icon: "layer-group" }); @@ -527,6 +528,8 @@ export class DocumentView extends DocComponent(Docu SelectionManager.SelectDoc(this, false); } }); + let path = this.props.LibraryPath.reduce((p: string, d: Doc) => p + "/" + (Doc.AreProtosEqual(d, (Doc.UserDoc().LibraryBtn as Doc).sourcePanel as Doc) ? "" : d.title), ""); + cm.addItem({ description: `path: ${path}`, event: () => { }, icon: "check" }) } // does Document set a layout prop @@ -552,6 +555,7 @@ export class DocumentView extends DocComponent(Docu ContainingCollectionDoc={this.props.ContainingCollectionDoc} Document={this.props.Document} fitToBox={this.props.fitToBox} + LibraryPath={this.props.LibraryPath} addDocument={this.props.addDocument} removeDocument={this.props.removeDocument} moveDocument={this.props.moveDocument} diff --git a/src/client/views/nodes/FieldView.tsx b/src/client/views/nodes/FieldView.tsx index 048960c5e..ce1c468ad 100644 --- a/src/client/views/nodes/FieldView.tsx +++ b/src/client/views/nodes/FieldView.tsx @@ -30,6 +30,7 @@ export interface FieldViewProps { ruleProvider: Doc | undefined; Document: Doc; DataDoc?: Doc; + LibraryPath: Doc[]; onClick?: ScriptField; isSelected: (outsideReaction?: boolean) => boolean; select: (isCtrlPressed: boolean) => void; diff --git a/src/client/views/nodes/FormattedTextBoxComment.tsx b/src/client/views/nodes/FormattedTextBoxComment.tsx index 2ec30e3b3..9f1dd4aec 100644 --- a/src/client/views/nodes/FormattedTextBoxComment.tsx +++ b/src/client/views/nodes/FormattedTextBoxComment.tsx @@ -177,8 +177,9 @@ export class FormattedTextBoxComment { } catch (e) { } if (target) { ReactDOM.render((P width: propDocWidth === 0 ? "auto" : propDocWidth * scale(), }}> { onPointerEnter={action(() => this._displayDim = this._useIcons ? 50 : Number(SEARCH_THUMBNAIL_SIZE))} onPointerLeave={action(() => this._displayDim = 50)} > Date: Thu, 5 Dec 2019 11:11:07 -0500 Subject: compile warning fixes. --- src/client/util/RichTextSchema.tsx | 6 +++--- .../views/collections/CollectionDockingView.tsx | 6 +++--- .../views/collections/CollectionSchemaCells.tsx | 1 + src/client/views/nodes/DocumentView.tsx | 9 +++++++-- src/client/views/nodes/FormattedTextBox.tsx | 4 ++-- src/client/views/nodes/ImageBox.scss | 23 +++++++++++----------- src/client/views/nodes/ImageBox.tsx | 7 ++++--- src/client/views/nodes/KeyValuePair.tsx | 1 + src/client/views/pdf/PDFViewer.tsx | 1 + src/new_fields/documentSchemas.ts | 3 +++ src/new_fields/util.ts | 2 +- 11 files changed, 37 insertions(+), 26 deletions(-) (limited to 'src/client/views/nodes') diff --git a/src/client/util/RichTextSchema.tsx b/src/client/util/RichTextSchema.tsx index 4612f2885..189bf08f7 100644 --- a/src/client/util/RichTextSchema.tsx +++ b/src/client/util/RichTextSchema.tsx @@ -671,15 +671,15 @@ export class DashDocCommentView { this._collapsed.className = "formattedTextBox-inlineComment"; this._collapsed.id = "DashDocCommentView-" + node.attrs.docid; this._view = view; - let targetNode = () => { + const targetNode = () => { for (let i = getPos() + 1; i < view.state.doc.nodeSize; i++) { - let m = view.state.doc.nodeAt(i); + const m = view.state.doc.nodeAt(i); if (m && m.type === view.state.schema.nodes.dashDoc && m.attrs.docid === node.attrs.docid) { return { node: m, pos: i } as { node: any, pos: number }; } } return undefined; - } + }; this._collapsed.onpointerdown = (e: any) => { const target = targetNode(); if (target) { diff --git a/src/client/views/collections/CollectionDockingView.tsx b/src/client/views/collections/CollectionDockingView.tsx index e35dc4c00..4374cde3c 100644 --- a/src/client/views/collections/CollectionDockingView.tsx +++ b/src/client/views/collections/CollectionDockingView.tsx @@ -529,7 +529,7 @@ interface DockedFrameProps { documentId: FieldId; dataDocumentId: FieldId; glContainer: any; - libraryPath: (FieldId[]) + libraryPath: (FieldId[]); //collectionDockingView: CollectionDockingView } @observer @@ -558,8 +558,8 @@ export class DockedFrameRenderer extends React.Component { async setupLibraryPath() { Promise.all(this.props.libraryPath.map(async docid => { - let d = await DocServer.GetRefField(docid); - return d instanceof Doc ? d : undefined + const d = await DocServer.GetRefField(docid); + return d instanceof Doc ? d : undefined; })).then(action((list: (Doc | undefined)[]) => this._libraryPath = list.filter(d => d).map(d => d as Doc))); } diff --git a/src/client/views/collections/CollectionSchemaCells.tsx b/src/client/views/collections/CollectionSchemaCells.tsx index 1700c14cf..171dc4606 100644 --- a/src/client/views/collections/CollectionSchemaCells.tsx +++ b/src/client/views/collections/CollectionSchemaCells.tsx @@ -143,6 +143,7 @@ export class CollectionSchemaCell extends React.Component { const props: FieldViewProps = { Document: this.props.rowProps.original, DataDoc: this.props.rowProps.original, + LibraryPath: [], fieldKey: this.props.rowProps.column.id as string, ruleProvider: undefined, ContainingCollectionView: this.props.CollectionView, diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx index fef365bf3..9f5b86e8d 100644 --- a/src/client/views/nodes/DocumentView.tsx +++ b/src/client/views/nodes/DocumentView.tsx @@ -528,8 +528,13 @@ export class DocumentView extends DocComponent(Docu SelectionManager.SelectDoc(this, false); } }); - let path = this.props.LibraryPath.reduce((p: string, d: Doc) => p + "/" + (Doc.AreProtosEqual(d, (Doc.UserDoc().LibraryBtn as Doc).sourcePanel as Doc) ? "" : d.title), ""); - cm.addItem({ description: `path: ${path}`, event: () => { }, icon: "check" }) + const path = this.props.LibraryPath.reduce((p: string, d: Doc) => p + "/" + (Doc.AreProtosEqual(d, (Doc.UserDoc().LibraryBtn as Doc).sourcePanel as Doc) ? "" : d.title), ""); + cm.addItem({ + description: `path: ${path}`, event: () => { + this.props.LibraryPath.map(lp => Doc.GetProto(lp).treeViewOpen = lp.treeViewOpen = true); + Doc.BrushDoc(this.props.Document); + }, icon: "check" + }); } // does Document set a layout prop diff --git a/src/client/views/nodes/FormattedTextBox.tsx b/src/client/views/nodes/FormattedTextBox.tsx index 481ae441e..e7c59ccb4 100644 --- a/src/client/views/nodes/FormattedTextBox.tsx +++ b/src/client/views/nodes/FormattedTextBox.tsx @@ -376,8 +376,8 @@ export class FormattedTextBox extends DocAnnotatableComponent<(FieldViewProps & e.preventDefault(); // prevents text from being selected during drag } sidebarMove = (e: PointerEvent) => { - let bounds = this.CurrentDiv.getBoundingClientRect(); - this._sidebarMovement += Math.sqrt((e.clientX - this._lastX) * (e.clientX - this._lastX) + (e.clientY - this._lastY) * (e.clientY - this._lastY)) + const bounds = this.CurrentDiv.getBoundingClientRect(); + this._sidebarMovement += Math.sqrt((e.clientX - this._lastX) * (e.clientX - this._lastX) + (e.clientY - this._lastY) * (e.clientY - this._lastY)); this.props.Document.sidebarWidthPercent = "" + 100 * (1 - (e.clientX - bounds.left) / bounds.width) + "%"; } sidebarUp = (e: PointerEvent) => { diff --git a/src/client/views/nodes/ImageBox.scss b/src/client/views/nodes/ImageBox.scss index 3b42c2352..cf5d999a7 100644 --- a/src/client/views/nodes/ImageBox.scss +++ b/src/client/views/nodes/ImageBox.scss @@ -1,13 +1,22 @@ -.imageBox { +.imageBox, .imageBox-dragging{ pointer-events: all; border-radius: inherit; width:100%; height:100%; position: absolute; transform-origin: top left; + .imageBox-fader { + pointer-events: all; + } } -.imageBox-cont, .imageBox-cont-dragging { +.imageBox-dragging { + .imageBox-fader { + pointer-events: none; + } +} + +.imageBox-cont { padding: 0vw; position: absolute; text-align: center; @@ -22,15 +31,6 @@ width: 100%; pointer-events: all; } - .imageBox-fader { - pointer-events: all; - } -} - -.imageBox-cont-dragging { - .imageBox-fader { - pointer-events: none; - } } .imageBox-dot { @@ -43,7 +43,6 @@ background: gray; } - #google-photos { transition: all 0.5s ease 0s; width: 30px; diff --git a/src/client/views/nodes/ImageBox.tsx b/src/client/views/nodes/ImageBox.tsx index b4a51657f..f60888929 100644 --- a/src/client/views/nodes/ImageBox.tsx +++ b/src/client/views/nodes/ImageBox.tsx @@ -308,7 +308,6 @@ export class ImageBox extends DocAnnotatableComponent + return
[this.content]; render() { - return (
{ const props: FieldViewProps = { Document: this.props.doc, DataDoc: this.props.doc, + LibraryPath: [], ContainingCollectionView: undefined, ContainingCollectionDoc: undefined, ruleProvider: undefined, diff --git a/src/client/views/pdf/PDFViewer.tsx b/src/client/views/pdf/PDFViewer.tsx index 69aacc902..3aa5d1d2c 100644 --- a/src/client/views/pdf/PDFViewer.tsx +++ b/src/client/views/pdf/PDFViewer.tsx @@ -634,6 +634,7 @@ export class PDFViewer extends DocAnnotatableComponent