From b725cbb244136ddfffad24d4ac68b9beb31845a3 Mon Sep 17 00:00:00 2001 From: bobzel Date: Mon, 5 Oct 2020 09:36:13 -0400 Subject: stopped ctrl-a from selecting doucment.body. prevented pdfviewer's texxt layer from scrolling horizontally when text annotations go out of bounds horizontally. fixed text boxes to not grab selectonOnLoad focus unless they're in an active tab. --- src/client/views/nodes/formattedText/FormattedTextBox.tsx | 10 +++++++++- 1 file changed, 9 insertions(+), 1 deletion(-) (limited to 'src/client/views/nodes/formattedText') diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx index a998386d8..b0199b35f 100644 --- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx +++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx @@ -1123,6 +1123,14 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp } } + private isActiveTab(el: Element | null | undefined) { + do { + if (el?.className.includes("lm_active")) return true; + el = el?.parentNode as any; + } while (el !== document.body); + return false; + } + private setupEditor(config: any, fieldKey: string) { const curText = Cast(this.dataDoc[this.props.fieldKey], RichTextField, null); const rtfField = Cast((!curText?.Text && this.layoutDoc[this.props.fieldKey]) || this.dataDoc[fieldKey], RichTextField); @@ -1161,7 +1169,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp } const selectOnLoad = this.rootDoc[Id] === FormattedTextBox.SelectOnLoad; - if (selectOnLoad && !this.props.dontRegisterView && !this.props.dontSelectOnLoad) { + if (selectOnLoad && !this.props.dontRegisterView && !this.props.dontSelectOnLoad && this.isActiveTab(this.ProseRef)) { FormattedTextBox.SelectOnLoad = ""; this.props.select(false); if (FormattedTextBox.SelectOnLoadChar && this._editorView) { -- cgit v1.2.3-70-g09d2 From 56d9d31d4ac9f2913bec14a2e3c4472fcfd90a7b Mon Sep 17 00:00:00 2001 From: bobzel Date: Mon, 5 Oct 2020 14:34:16 -0400 Subject: fixed formatted texst box select on load when pdf is full screen and the same pdf is in inactive tab behind it. --- src/client/views/nodes/formattedText/FormattedTextBox.tsx | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) (limited to 'src/client/views/nodes/formattedText') diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx index b0199b35f..ef39e6a90 100644 --- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx +++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx @@ -1124,11 +1124,11 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp } private isActiveTab(el: Element | null | undefined) { - do { - if (el?.className.includes("lm_active")) return true; - el = el?.parentNode as any; - } while (el !== document.body); - return false; + while (el && el !== document.body) { + if (getComputedStyle(el).display === "none") return false; + el = el.parentNode as any; + } + return true; } private setupEditor(config: any, fieldKey: string) { -- cgit v1.2.3-70-g09d2 From e32312a409673a23eb4af82ef33f41f8bf226292 Mon Sep 17 00:00:00 2001 From: bobzel Date: Tue, 6 Oct 2020 22:37:41 -0400 Subject: runtime error fix for fetchProto(). fix for preview layout of text link. --- src/client/views/nodes/formattedText/FormattedTextBoxComment.scss | 3 --- src/fields/Doc.ts | 1 + 2 files changed, 1 insertion(+), 3 deletions(-) (limited to 'src/client/views/nodes/formattedText') diff --git a/src/client/views/nodes/formattedText/FormattedTextBoxComment.scss b/src/client/views/nodes/formattedText/FormattedTextBoxComment.scss index 582ada6ce..81afba4d7 100644 --- a/src/client/views/nodes/formattedText/FormattedTextBoxComment.scss +++ b/src/client/views/nodes/formattedText/FormattedTextBoxComment.scss @@ -29,9 +29,6 @@ font-style: italic; color: rgb(95, 97, 102); font-size: 10px; - padding-bottom: 4px; - margin-bottom: 5px; - } } diff --git a/src/fields/Doc.ts b/src/fields/Doc.ts index a8a5ba9bd..54d85ba86 100644 --- a/src/fields/Doc.ts +++ b/src/fields/Doc.ts @@ -104,6 +104,7 @@ const AclMap = new Map([ ]); export function fetchProto(doc: Doc) { + if (!doc) return; const permissions: { [key: string]: symbol } = {}; Object.keys(doc).filter(key => key.startsWith("acl") && (permissions[key] = AclMap.get(StrCast(doc[key]))!)); -- cgit v1.2.3-70-g09d2 From e6b8a14e3463ba65a4dac9f1fcfa6323084904d4 Mon Sep 17 00:00:00 2001 From: bobzel Date: Wed, 7 Oct 2020 15:02:16 -0400 Subject: fixed following links to set the scollTop of PDFs corretion. Fixed following links to rich text anchors to scroll and highlight properly. fixed pushpin behavior to only toggle off when the target is in sight. --- src/client/util/DocumentManager.ts | 13 ++++++++++--- .../collectionFreeForm/CollectionFreeFormView.tsx | 22 ++++++++++++++++------ .../views/nodes/formattedText/FormattedTextBox.tsx | 12 +++++++----- src/client/views/pdf/PDFViewer.tsx | 2 +- src/fields/util.ts | 4 ++-- 5 files changed, 36 insertions(+), 17 deletions(-) (limited to 'src/client/views/nodes/formattedText') diff --git a/src/client/util/DocumentManager.ts b/src/client/util/DocumentManager.ts index 4becdf4a3..ce4e1e378 100644 --- a/src/client/util/DocumentManager.ts +++ b/src/client/util/DocumentManager.ts @@ -159,17 +159,24 @@ export class DocumentManager { } } if (docView) { // we have a docView already and aren't forced to create a new one ... just focus on the document. TODO move into view if necessary otherwise just highlight? + const sameContext = annotatedDoc && annotatedDoc === originatingDoc?.context; if (originatingDoc?.isPushpin) { - docView.props.Document.hidden = !docView.props.Document.hidden; + const hide = !docView.props.Document.hidden; + (!hide || !sameContext) && (docView.props.Document.hidden = !docView.props.Document.hidden); + docView.props.focus(docView.props.Document, willZoom, undefined, (notfocused: boolean) => { // bcz: Argh! TODO: Need to add a notFocused argument to the after finish callback function that indicates whether the window had to scroll to show the target + notfocused && hide && (docView.props.Document.hidden = true); + return focusAndFinish(); + // @ts-ignore bcz: Argh TODO: Need to add a parameter to focus() everywhere for whether focus should center the target's container in the view or not. // here we don't want to focus the container if the source and target are in the same container + }, sameContext); finished?.(); } else { docView.select(false); docView.props.Document.hidden && (docView.props.Document.hidden = undefined); // @ts-ignore - docView.props.focus(docView.props.Document, willZoom, undefined, focusAndFinish, annotatedDoc && annotatedDoc === originatingDoc?.context); - highlight(); + docView.props.focus(docView.props.Document, willZoom, undefined, focusAndFinish, sameContext); } + highlight(); } else { const contextDocs = docContext ? await DocListCastAsync(docContext.data) : undefined; const contextDoc = contextDocs?.find(doc => Doc.AreProtosEqual(doc, targetDoc)) ? docContext : undefined; diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx index 35b4c8e98..382929861 100644 --- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx +++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx @@ -888,17 +888,27 @@ export class CollectionFreeFormView extends CollectionSubView 5 ? 1000 : 0; + const curScroll = NumCast(this.props.Document._scrollTop); + let scrollTo = curScroll; + if (curScroll + contextHgt < NumCast(doc.y)) { + scrollTo = NumCast(doc.y) + NumCast(doc._height) - contextHgt; + } else if (curScroll > NumCast(doc.y)) { + scrollTo = NumCast(doc.y); + } + if (curScroll !== scrollTo) { + this.props.Document._scrollY = scrollTo; + delay = Math.abs(scrollTo - curScroll) > 5 ? 1000 : 0; + !dontCenter && delay && this.props.focus(this.props.Document); + afterFocus && setTimeout(afterFocus, delay); + // @ts-ignore + } else afterFocus(true); // bcz: TODO Aragh -- need to add a parameter to afterFocus() functions to indicate whether the focus function didn't need to scroll } - !dontCenter && this.props.focus(this.props.Document); - afterFocus && setTimeout(afterFocus, delay); } else { const layoutdoc = Doc.Layout(doc); const newPanX = NumCast(doc.x) + NumCast(layoutdoc._width) / 2; diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx index ef39e6a90..0fccbd8ef 100644 --- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx +++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx @@ -916,11 +916,13 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp async (scrollToLinkID) => { const findLinkFrag = (frag: Fragment, editor: EditorView) => { const nodes: Node[] = []; + let hadStart = start !== 0; frag.forEach((node, index) => { const examinedNode = findLinkNode(node, editor); - if (examinedNode?.textContent) { - nodes.push(examinedNode); - !start && (start = index); + if (examinedNode?.node.textContent) { + nodes.push(examinedNode.node); + !hadStart && (start = index + examinedNode.start); + hadStart = true; } }); return { frag: Fragment.fromArray(nodes), start }; @@ -928,11 +930,11 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp const findLinkNode = (node: Node, editor: EditorView) => { if (!node.isText) { const content = findLinkFrag(node.content, editor); - return node.copy(content.frag); + return { node: node.copy(content.frag), start: content.start }; } const marks = [...node.marks]; const linkIndex = marks.findIndex(mark => mark.type === editor.state.schema.marks.linkAnchor); - return linkIndex !== -1 && marks[linkIndex].attrs.allLinks.find((item: { href: string }) => scrollToLinkID === item.href.replace(/.*\/doc\//, "")) ? node : undefined; + return linkIndex !== -1 && marks[linkIndex].attrs.allLinks.find((item: { href: string }) => scrollToLinkID === item.href.replace(/.*\/doc\//, "")) ? { node, start: 0 } : undefined; }; let start = 0; diff --git a/src/client/views/pdf/PDFViewer.tsx b/src/client/views/pdf/PDFViewer.tsx index 3570c565a..606d3e550 100644 --- a/src/client/views/pdf/PDFViewer.tsx +++ b/src/client/views/pdf/PDFViewer.tsx @@ -184,7 +184,7 @@ export class PDFViewer extends ViewBoxAnnotatableComponent this._mainCont.current && smoothScroll(1000, this._mainCont.current, scrollY || 0), 250); } - setTimeout(() => this.Document._scrollY = undefined, 1000); + setTimeout(() => { this.Document._scrollTop = scrollY; this.Document._scrollY = undefined; }, 1000); } }, { fireImmediately: true } diff --git a/src/fields/util.ts b/src/fields/util.ts index 8a694de83..7293db0c2 100644 --- a/src/fields/util.ts +++ b/src/fields/util.ts @@ -385,7 +385,7 @@ export function updateFunction(target: any, prop: any, value: any, receiver: any receiver[prop].push(...diff.items); }, undo: action(() => { - let curList = receiver[prop]; + const curList = receiver[prop]; //while (curList[ForwardUpates]) curList = curList[ForwardUpates]; diff.items.forEach((doc: any) => { const ind = curList.indexOf(doc.value()); @@ -396,7 +396,7 @@ export function updateFunction(target: any, prop: any, value: any, receiver: any diff?.op === "$remFromSet" ? { redo: action(() => { - let curList = receiver[prop]; + const curList = receiver[prop]; diff.items.forEach((doc: any) => { const ind = curList.indexOf(doc.value()); ind !== -1 && curList.splice(ind, 1); -- cgit v1.2.3-70-g09d2 From 192e23a2ae335a5f0de361eed9a24a5d08547217 Mon Sep 17 00:00:00 2001 From: bobzel Date: Wed, 7 Oct 2020 17:49:20 -0400 Subject: fixed undoing changes to a textbox's fontsize/family. changed auto-page ref syntax to start with ':'. fixed making text menu appear when clicking on caption & other text boxes. --- src/client/views/collections/CollectionMenu.tsx | 45 +++++++++++----------- .../views/nodes/formattedText/FormattedTextBox.tsx | 5 +-- .../views/nodes/formattedText/RichTextMenu.tsx | 45 ++++++++++++---------- .../views/nodes/formattedText/RichTextRules.ts | 6 +-- 4 files changed, 50 insertions(+), 51 deletions(-) (limited to 'src/client/views/nodes/formattedText') diff --git a/src/client/views/collections/CollectionMenu.tsx b/src/client/views/collections/CollectionMenu.tsx index 09ff3bb0c..4bdb233c9 100644 --- a/src/client/views/collections/CollectionMenu.tsx +++ b/src/client/views/collections/CollectionMenu.tsx @@ -529,12 +529,7 @@ export class CollectionFreeFormViewChrome extends React.Component - {!Doc.UserDoc().noviceMode && !this.isText && !this.props.isDoc ? Back Frame} placement="bottom"> -
- -
- : null} - {!Doc.UserDoc().noviceMode && !this.isText && !this.props.isDoc ? Toggle View All} placement="bottom"> -
this.document.editing = !this.document.editing)} > - {NumCast(this.document._currentFrame)} -
- : null} - {!Doc.UserDoc().noviceMode && !this.isText && !this.props.isDoc ? Forward Frame} placement="bottom"> -
- -
- : null} + {!Doc.UserDoc().noviceMode && !this.isText && !this.props.isDoc ? + <> + Back Frame} placement="bottom"> +
+ +
+ + Toggle View All} placement="bottom"> +
this.document.editing = !this.document.editing)} > + {NumCast(this.document._currentFrame)} +
+ + Forward Frame} placement="bottom"> +
+ +
+ + + : null} {!this.props.isOverlay || this.document.type !== DocumentType.WEB || this.isText || this.props.isDoc ? (null) : this.urlEditor @@ -872,7 +871,7 @@ export class CollectionFreeFormViewChrome extends React.Component : (null) } - {this.isText ? : null} + {
} ; } } diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx index 0fccbd8ef..c6bd0cb81 100644 --- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx +++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx @@ -1321,6 +1321,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp if (coords && coords.left > x && coords.left < x + RichTextMenu.Instance.width && coords.top > y && coords.top < y + RichTextMenu.Instance.height + 50) { y = Math.min(bounds.bottom, window.innerHeight - RichTextMenu.Instance.height); } + this._editorView && RichTextMenu.Instance?.updateMenu(this._editorView, undefined, this.props); setTimeout(() => window.document.activeElement === this.ProseRef?.children[0] && RichTextMenu.Instance.jumpTo(x, y), 250); } } @@ -1557,9 +1558,6 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp
{ - console.log(e); - }} />; } @@ -1608,7 +1606,6 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp const scale = this.props.hideOnLeave ? 1 : this.props.ContentScaling() * NumCast(this.layoutDoc._viewScale, 1); const rounded = StrCast(this.layoutDoc.borderRounding) === "100%" ? "-rounded" : ""; const interactive = (Doc.GetSelectedTool() === InkTool.None || SnappingManager.GetIsDragging()) && !this.layoutDoc._isBackground; - selected && setTimeout(() => this._editorView && RichTextMenu.Instance?.updateMenu(this._editorView, undefined, this.props)); // need to make sure that we update a text box that is selected after updating the one that was deselected if (!selected && FormattedTextBoxComment.textBox === this) { FormattedTextBoxComment.Hide(); } const minimal = this.props.ignoreAutoHeight; const margins = NumCast(this.layoutDoc._yMargin, this.props.yMargin || 0); diff --git a/src/client/views/nodes/formattedText/RichTextMenu.tsx b/src/client/views/nodes/formattedText/RichTextMenu.tsx index 68239a8f1..d492b561b 100644 --- a/src/client/views/nodes/formattedText/RichTextMenu.tsx +++ b/src/client/views/nodes/formattedText/RichTextMenu.tsx @@ -32,7 +32,7 @@ export class RichTextMenu extends AntimodeMenu { static Instance: RichTextMenu; public overMenu: boolean = false; // kind of hacky way to prevent selects not being selectable - public view?: EditorView; + @observable public view?: EditorView; public editorProps: FieldViewProps & FormattedTextBoxProps | undefined; public _brushMap: Map> = new Map(); @@ -154,7 +154,7 @@ export class RichTextMenu extends AntimodeMenu { @action public updateMenu(view: EditorView, lastState: EditorState | undefined, props: any) { - if (!view || !(view as any).TextView?.props.isSelected(true) || !view.hasFocus()) { + if (!view || !view.hasFocus()) { return; } this.view = view; @@ -366,7 +366,7 @@ export class RichTextMenu extends AntimodeMenu { ); } - createMarksDropdown(activeOption: string, options: { mark: Mark | null, title: string, label: string, command: (mark: Mark, view: EditorView) => void, hidden?: boolean, style?: {} }[], key: string, setter: (val: string) => {}): JSX.Element { + createMarksDropdown(activeOption: string, options: { mark: Mark | null, title: string, label: string, command: (mark: Mark, view: EditorView) => void, hidden?: boolean, style?: {} }[], key: string, setter: (val: string) => void): JSX.Element { const items = options.map(({ title, label, hidden, style }) => { if (hidden) { return ; @@ -378,19 +378,22 @@ export class RichTextMenu extends AntimodeMenu { function onChange(e: React.ChangeEvent) { e.stopPropagation(); e.preventDefault(); - self.TextView.endUndoTypingBatch(); - options.forEach(({ label, mark, command }) => { - if (e.target.value === label && mark) { - if (!self.TextView.props.isSelected(true)) { - switch (mark.type) { - case schema.marks.pFontFamily: setter(Doc.UserDoc().fontFamily = mark.attrs.family); break; - case schema.marks.pFontSize: setter(Doc.UserDoc().fontSize = mark.attrs.fontSize.toString() + "px"); break; + self.TextView?.endUndoTypingBatch(); + UndoManager.RunInBatch(() => { + options.forEach(({ label, mark, command }) => { + if (e.target.value === label && mark) { + if (!self.TextView?.props.isSelected(true)) { + switch (mark.type) { + case schema.marks.pFontFamily: setter(Doc.UserDoc().fontFamily = mark.attrs.family); break; + case schema.marks.pFontSize: setter(Doc.UserDoc().fontSize = mark.attrs.fontSize.toString() + "px"); break; + } } + else self.view && mark && command(mark, self.view); } - else UndoManager.RunInBatch(() => self.view && mark && command(mark, self.view), "text mark dropdown"); - } - }); + }); + }, "text mark dropdown"); } + return {key}
} placement="bottom"> ; @@ -424,9 +427,6 @@ export class RichTextMenu extends AntimodeMenu { } changeFontSize = (mark: Mark, view: EditorView) => { - if ((this.view?.state.selection.$from.pos || 0) < 2) { - this.TextView.layoutDoc._fontSize = mark.attrs.fontSize === Number(mark.attrs.fontSize) ? `${mark.attrs.fontSize}pt` : mark.attrs.fontSize; - } const fmark = view.state.schema.marks.pFontSize.create({ fontSize: mark.attrs.fontSize }); this.setMark(fmark, view.state, (tx: any) => view.dispatch(tx.addStoredMark(fmark)), true); view.focus(); @@ -434,9 +434,6 @@ export class RichTextMenu extends AntimodeMenu { } changeFontFamily = (mark: Mark, view: EditorView) => { - if ((this.view?.state.selection.$from.pos || 0) < 2) { - this.TextView.layoutDoc._fontFamily = mark.attrs.family; - } const fmark = view.state.schema.marks.pFontFamily.create({ family: mark.attrs.family }); this.setMark(fmark, view.state, (tx: any) => view.dispatch(tx.addStoredMark(fmark)), true); view.focus(); @@ -984,8 +981,14 @@ export class RichTextMenu extends AntimodeMenu { {this.collapsed ? this.getDragger() : (null)}
, - {[this.createMarksDropdown(this.activeFontSize, this.fontSizeOptions, "font size", action((val: string) => this.activeFontSize = val)), - this.createMarksDropdown(this.activeFontFamily, this.fontFamilyOptions, "font family", action((val: string) => this.activeFontFamily = val)), + {[this.createMarksDropdown(this.activeFontSize, this.fontSizeOptions, "font size", action((val: string) => { + this.activeFontSize = val; + SelectionManager.SelectedDocuments().map(dv => dv.props.Document._fontSize = val); + })), + this.createMarksDropdown(this.activeFontFamily, this.fontFamilyOptions, "font family", action((val: string) => { + this.activeFontFamily = val; + SelectionManager.SelectedDocuments().map(dv => dv.props.Document._fontFamily = val); + })),
, this.createNodesDropdown(this.activeListType, this.listTypeOptions, "list type", () => ({})), this.createButton("sort-amount-down", "Summarize", undefined, this.insertSummarizer), diff --git a/src/client/views/nodes/formattedText/RichTextRules.ts b/src/client/views/nodes/formattedText/RichTextRules.ts index 72b91c955..99334b6db 100644 --- a/src/client/views/nodes/formattedText/RichTextRules.ts +++ b/src/client/views/nodes/formattedText/RichTextRules.ts @@ -267,11 +267,11 @@ export class RichTextRules { // [[fieldKey]] => show field // [[fieldKey:Doc]] => show field of doc new InputRule( - new RegExp(/\[\[([a-zA-Z_@\? \-0-9]*)(=[a-zA-Z_@\? /\-0-9]*)?(:[a-zA-Z_@\.\? \-0-9]+)?\]\]$/), + new RegExp(/\[\[([a-zA-Z_\? \-0-9]*)(=[a-zA-Z_@\? /\-0-9]*)?(:[a-zA-Z_@:\.\? \-0-9]+)?\]\]$/), (state, match, start, end) => { const fieldKey = match[1]; - const rawdocid = match[3]?.substring(1); - const docid = rawdocid ? (!rawdocid.includes("@") ? normalizeEmail(Doc.CurrentUserEmail) + "@" + rawdocid : rawdocid) : undefined; + const rawdocid = match[3]; + const docid = rawdocid ? normalizeEmail((!rawdocid.includes("@") ? Doc.CurrentUserEmail + rawdocid : rawdocid.substring(1))) : undefined; const value = match[2]?.substring(1); if (!fieldKey) { const linkId = Utils.GenerateGuid(); -- cgit v1.2.3-70-g09d2 From a722aab6a65ad8d222ec3d576497ce9687cac966 Mon Sep 17 00:00:00 2001 From: bobzel Date: Thu, 8 Oct 2020 00:44:43 -0400 Subject: fixed adding/removing schema columns. fixed showing text/ink tools in menu at right time. cleaned up schema view a bit and fixed drag bar from disappearing when shown in full tab. --- src/client/views/collections/CollectionMenu.tsx | 4 +- .../views/collections/CollectionSchemaView.scss | 5 +- .../views/collections/CollectionSchemaView.tsx | 148 +++++++-------------- src/client/views/collections/SchemaTable.tsx | 6 +- src/client/views/globalCssVariables.scss | 2 + src/client/views/globalCssVariables.scss.d.ts | 1 + .../views/nodes/formattedText/FormattedTextBox.tsx | 1 + .../views/nodes/formattedText/RichTextMenu.tsx | 4 +- src/server/websocket.ts | 4 +- 9 files changed, 63 insertions(+), 112 deletions(-) (limited to 'src/client/views/nodes/formattedText') diff --git a/src/client/views/collections/CollectionMenu.tsx b/src/client/views/collections/CollectionMenu.tsx index 4bdb233c9..429764154 100644 --- a/src/client/views/collections/CollectionMenu.tsx +++ b/src/client/views/collections/CollectionMenu.tsx @@ -528,9 +528,7 @@ export class CollectionFreeFormViewChrome extends React.Component = new Map([ @observer export class CollectionSchemaView extends CollectionSubView(doc => doc) { private _previewCont?: HTMLDivElement; - private DIVIDER_WIDTH = 4; - - @observable previewDoc: Doc | undefined = undefined; - @observable private _focusedTable: Doc = this.props.Document; - - @computed get previewWidth() { return () => NumCast(this.props.Document.schemaPreviewWidth); } - @computed get previewHeight() { return () => this.props.PanelHeight() - 2 * this.borderWidth; } - @computed get tableWidth() { return this.props.PanelWidth() - 2 * this.borderWidth - this.DIVIDER_WIDTH - this.previewWidth(); } - @computed get borderWidth() { return Number(COLLECTION_BORDER_WIDTH); } + @observable _previewDoc: Doc | undefined = undefined; + @observable _focusedTable: Doc = this.props.Document; + @observable _col: any = ""; @observable _menuWidth = 0; @observable _headerOpen = false; @observable _headerIsEditing = false; - @observable _col: any = ""; @observable _menuHeight = 0; @observable _pointerX = 0; @observable _pointerY = 0; @observable _openTypes: boolean = false; + + @computed get previewWidth() { return () => NumCast(this.props.Document.schemaPreviewWidth); } + @computed get previewHeight() { return () => this.props.PanelHeight() - 2 * this.borderWidth; } + @computed get tableWidth() { return this.props.PanelWidth() - 2 * this.borderWidth - Number(SCHEMA_DIVIDER_WIDTH) - this.previewWidth(); } + @computed get borderWidth() { return Number(COLLECTION_BORDER_WIDTH); } + @computed get scale() { return this.props.ScreenToLocalTransform().Scale; } + @computed get columns() { return Cast(this.props.Document._schemaHeaders, listSpec(SchemaHeaderField), []); } + set columns(columns: SchemaHeaderField[]) { this.props.Document._schemaHeaders = new List(columns); } + @computed get menuCoordinates() { let searchx = 0; let searchy = 0; @@ -81,15 +83,6 @@ export class CollectionSchemaView extends CollectionSubView(doc => doc) { return this.props.ScreenToLocalTransform().transformPoint(x, y); } - @computed get scale() { return this.props.ScreenToLocalTransform().Scale; } - - @computed get columns() { - return Cast(this.props.Document._schemaHeaders, listSpec(SchemaHeaderField), []); - } - set columns(columns: SchemaHeaderField[]) { - this.props.Document._schemaHeaders = new List(columns); - } - get documentKeys() { const docs = this.childDocs; const keys: { [key: string]: boolean } = {}; @@ -104,27 +97,12 @@ export class CollectionSchemaView extends CollectionSubView(doc => doc) { this.columns.forEach(key => keys[key.heading] = true); return Array.from(Object.keys(keys)); } - @computed get possibleKeys() { return this.documentKeys.filter(key => this.columns.findIndex(existingKey => existingKey.heading.toUpperCase() === key.toUpperCase()) === -1); } @action setHeaderIsEditing = (isEditing: boolean) => this._headerIsEditing = isEditing; - - @action - changeColumnType = (type: ColumnType, col: any): void => { - this._openTypes = false; - this.setColumnType(col, type); - } - - changeColumnSort = (desc: boolean | undefined, col: any): void => { - this.setColumnSort(col, desc); - } - - changeColumnColor = (color: string, col: any): void => { - this.setColumnColor(col, color); - } - @undoBatch setColumnType = (columnField: SchemaHeaderField, type: ColumnType): void => { + this._openTypes = false; if (columnTypes.get(columnField.heading)) return; const columns = this.columns; @@ -165,42 +143,42 @@ export class CollectionSchemaView extends CollectionSubView(doc => doc) { const type = col.type; - const anyType =
this.changeColumnType(ColumnType.Any, col)}> + const anyType =
this.setColumnType(col, ColumnType.Any)}> Any
; - const numType =
this.changeColumnType(ColumnType.Number, col)}> + const numType =
this.setColumnType(col, ColumnType.Number)}> Number
; - const textType =
this.changeColumnType(ColumnType.String, col)}> + const textType =
this.setColumnType(col, ColumnType.String)}> Text
; - const boolType =
this.changeColumnType(ColumnType.Boolean, col)}> + const boolType =
this.setColumnType(col, ColumnType.Boolean)}> Checkbox
; - const listType =
this.changeColumnType(ColumnType.List, col)}> + const listType =
this.setColumnType(col, ColumnType.List)}> List
; - const docType =
this.changeColumnType(ColumnType.Doc, col)}> + const docType =
this.setColumnType(col, ColumnType.Doc)}> Document
; - const imageType =
this.changeColumnType(ColumnType.Image, col)}> + const imageType =
this.setColumnType(col, ColumnType.Image)}> Image
; - const dateType =
this.changeColumnType(ColumnType.Date, col)}> + const dateType =
this.setColumnType(col, ColumnType.Date)}> Date
; @@ -239,15 +217,15 @@ export class CollectionSchemaView extends CollectionSubView(doc => doc) {
-
this.changeColumnSort(true, col)}> +
this.setColumnSort(col, true)}> Sort descending
-
this.changeColumnSort(false, col)}> +
this.setColumnSort(col, false)}> Sort ascending
-
this.changeColumnSort(undefined, col)}> +
this.setColumnSort(col, undefined)}> Clear sorting
@@ -270,12 +248,12 @@ export class CollectionSchemaView extends CollectionSubView(doc => doc) {
-
this.changeColumnColor(pink!, col)}>
-
this.changeColumnColor(purple!, col)}>
-
this.changeColumnColor(blue!, col)}>
-
this.changeColumnColor(yellow!, col)}>
-
this.changeColumnColor(red!, col)}>
-
this.changeColumnColor(gray, col)}>
+
this.setColumnColor(col, pink!)}>
+
this.setColumnColor(col, purple!)}>
+
this.setColumnColor(col, blue!)}>
+
this.setColumnColor(col, yellow!)}>
+
this.setColumnColor(col, red!)}>
+
this.setColumnColor(col, gray)}>
); @@ -320,8 +298,6 @@ export class CollectionSchemaView extends CollectionSubView(doc => doc) { @action closeHeader = () => { this._headerOpen = false; } - - @undoBatch @action deleteColumn = (key: string) => { @@ -351,15 +327,12 @@ export class CollectionSchemaView extends CollectionSubView(doc => doc) { onWheel(e: React.WheelEvent) { const scale = this.props.ScreenToLocalTransform().Scale; this.props.active(true) && e.stopPropagation(); - //this.menuCoordinates[0] -= e.screenX / scale; - //this.menuCoordinates[1] -= e.screenY / scale; } @computed get renderMenuContent() { TraceMobx(); return
{this.renderTypes(this._col)} - {/* {this.renderSorting(this._col)} */} {this.renderColors(this._col)}