From 157faac6a3c8a7c2347baf78e1796ff0aa3e0312 Mon Sep 17 00:00:00 2001 From: bobzel Date: Mon, 7 Sep 2020 15:27:34 -0400 Subject: fixed childLayoutString templates whch broke somewhere along the way. --- src/client/views/nodes/DocumentContentsView.tsx | 18 +++++++++++++++--- 1 file changed, 15 insertions(+), 3 deletions(-) (limited to 'src/client/views/nodes') diff --git a/src/client/views/nodes/DocumentContentsView.tsx b/src/client/views/nodes/DocumentContentsView.tsx index 1b2070c0f..90fc5dc64 100644 --- a/src/client/views/nodes/DocumentContentsView.tsx +++ b/src/client/views/nodes/DocumentContentsView.tsx @@ -64,7 +64,19 @@ interface HTMLtagProps { onClick?: ScriptField; onInput?: ScriptField; } -//"{this.title}"@observer + +//" {this.title}" +//" +// +// +// {this.title} +// +// " @observer export class HTMLtag extends React.Component { click = (e: React.MouseEvent) => { @@ -170,10 +182,10 @@ export class DocumentContentsView extends React.Component { - const splits = layoutFrame.split(`func=`); + const splits = layoutFrame.split(`${func}=`); if (splits.length > 1) { const code = XRegExp.matchRecursive(splits[1], "{", "}", "", { valueNames: ["between", "left", "match", "right", "between"] }); - layoutFrame = splits[0] + ` ${func}={props.onClick} ` + splits[1].substring(code[1].end + 1); + layoutFrame = splits[0] + ` ${func}={props.${func}} ` + splits[1].substring(code[1].end + 1); return ScriptField.MakeScript(code[1].value, { this: Doc.name, self: Doc.name, value: "string" }); } return undefined; -- cgit v1.2.3-70-g09d2 From 39224bee728cd17861d17d0d20f62a92aadf3090 Mon Sep 17 00:00:00 2001 From: bobzel Date: Tue, 8 Sep 2020 16:08:48 -0400 Subject: fixed images with different exif orientations and simplified ImageBox --- src/client/documents/Documents.ts | 4 +++ src/client/views/nodes/ImageBox.tsx | 57 +++++++++---------------------------- 2 files changed, 17 insertions(+), 44 deletions(-) (limited to 'src/client/views/nodes') diff --git a/src/client/documents/Documents.ts b/src/client/documents/Documents.ts index 8d1f8a04e..7e276747c 100644 --- a/src/client/documents/Documents.ts +++ b/src/client/documents/Documents.ts @@ -1226,6 +1226,10 @@ export namespace DocUtils { proto["data-nativeOrientation"] = result.exifData?.data?.image?.Orientation; proto["data-nativeWidth"] = (result.nativeWidth < result.nativeHeight) ? maxNativeDim * result.nativeWidth / result.nativeHeight : maxNativeDim; proto["data-nativeHeight"] = (result.nativeWidth < result.nativeHeight) ? maxNativeDim : maxNativeDim / (result.nativeWidth / result.nativeHeight); + if (Number(result.exifData?.data?.image?.Orientation) >= 5) { + proto["data-nativeHeight"] = (result.nativeWidth < result.nativeHeight) ? maxNativeDim * result.nativeWidth / result.nativeHeight : maxNativeDim; + proto["data-nativeWidth"] = (result.nativeWidth < result.nativeHeight) ? maxNativeDim : maxNativeDim / (result.nativeWidth / result.nativeHeight); + } proto.contentSize = result.contentSize; } generatedDocuments.push(doc); diff --git a/src/client/views/nodes/ImageBox.tsx b/src/client/views/nodes/ImageBox.tsx index 5832a51a7..d1e7f903b 100644 --- a/src/client/views/nodes/ImageBox.tsx +++ b/src/client/views/nodes/ImageBox.tsx @@ -26,6 +26,7 @@ import { FaceRectangles } from './FaceRectangles'; import { FieldView, FieldViewProps } from './FieldView'; import "./ImageBox.scss"; import React = require("react"); +import { takeWhile } from 'lodash'; const path = require('path'); const { Howl } = require('howler'); @@ -73,10 +74,16 @@ export class ImageBox extends ViewBoxAnnotatableComponent this.paths.length && this.resize(this.paths[0]), - () => true, + this._pathDisposer = reaction(() => ({ nativeSize: this.nativeSize, width: this.layoutDoc[WidthSym]() }), + ({ nativeSize, width }) => { + this.layoutDoc._nativeWidth = nativeSize.nativeWidth; + this.layoutDoc._nativeHeight = nativeSize.nativeHeight; + this.layoutDoc._nativeOrientation = nativeSize.nativeOrientation; + this.layoutDoc._height = width * nativeSize.nativeHeight / nativeSize.nativeWidth; + }, { fireImmediately: true }); } + componentWillUnmount() { this._pathDisposer?.(); } @@ -249,45 +256,6 @@ export class ImageBox extends ViewBoxAnnotatableComponent { - const basePath = imgPath.replace(/_[oms]./, ""); - const curPath = this.dataDoc[this.fieldKey + "-path"]; - const cachedNativeSize = { - width: basePath === curPath || !curPath ? NumCast(this.dataDoc[this.fieldKey + "-nativeWidth"]) : 0, - height: basePath === curPath || !curPath ? NumCast(this.dataDoc[this.fieldKey + "-nativeHeight"]) : 0, - }; - const docAspect = this.layoutDoc[HeightSym]() / this.layoutDoc[WidthSym](); - const cachedAspect = cachedNativeSize.height / cachedNativeSize.width; - if (!cachedNativeSize.width || !cachedNativeSize.height || Math.abs(NumCast(this.layoutDoc._width) / NumCast(this.layoutDoc._height) - cachedNativeSize.width / cachedNativeSize.height) > 0.05) { - if (!this.layoutDoc.isTemplateDoc || this.dataDoc !== this.layoutDoc) { - const rotation = NumCast(this.dataDoc[this.fieldKey + "-rotation"]) % 180; - const orientation = NumCast(this.dataDoc[this.fieldKey + "-nativeOrientation"]); - if (orientation >= 5 || rotation === 90 || rotation === 270) { - this.layoutDoc._nativeWidth = NumCast(this.dataDoc[this.fieldKey + "-nativeHeight"]); - this.layoutDoc._nativeHeight = NumCast(this.dataDoc[this.fieldKey + "-nativeWidth"]); - } else { - this.layoutDoc._nativeWidth = NumCast(this.dataDoc[this.fieldKey + "-nativeWidth"]); - this.layoutDoc._nativeHeight = NumCast(this.dataDoc[this.fieldKey + "-nativeHeight"]); - } - const rotatedAspect = NumCast(this.layoutDoc._nativeHeight) / NumCast(this.layoutDoc._nativeWidth); - if (this.layoutDoc[WidthSym]() && (!cachedNativeSize.width || !cachedNativeSize.height || Math.abs(1 - docAspect / rotatedAspect) > 0.1)) { - this.layoutDoc._height = this.layoutDoc[WidthSym]() * rotatedAspect; - this.dataDoc[this.fieldKey + "-path"] = basePath; - } - } else if (Math.abs(1 - docAspect / cachedAspect) > 0.1) { - this.layoutDoc._width = this.layoutDoc[WidthSym]() || cachedNativeSize.width; - this.layoutDoc._height = this.layoutDoc[WidthSym]() * cachedAspect; - } - } else if (this.layoutDoc._nativeWidth !== cachedNativeSize.width || this.layoutDoc._nativeHeight !== cachedNativeSize.height) { - !(this.layoutDoc[StrCast(this.layoutDoc.layoutKey)] instanceof Doc) && setTimeout(() => { - if (!(this.layoutDoc[StrCast(this.layoutDoc.layoutKey)] instanceof Doc)) { - this.layoutDoc._nativeWidth = cachedNativeSize.width; - this.layoutDoc._nativeHeight = cachedNativeSize.height; - } - }, 0); - } - } - @action onPointerEnter = () => { const self = this; @@ -370,7 +338,8 @@ export class ImageBox extends ViewBoxAnnotatableComponent Date: Tue, 8 Sep 2020 20:18:20 -0400 Subject: fixed conentFittingDocView for gridViews (that use dontCenter) --- src/client/views/nodes/ContentFittingDocumentView.tsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'src/client/views/nodes') diff --git a/src/client/views/nodes/ContentFittingDocumentView.tsx b/src/client/views/nodes/ContentFittingDocumentView.tsx index 715faa934..5c9109185 100644 --- a/src/client/views/nodes/ContentFittingDocumentView.tsx +++ b/src/client/views/nodes/ContentFittingDocumentView.tsx @@ -42,7 +42,7 @@ export class ContentFittingDocumentView extends React.Component this.props.ScreenToLocalTransform().translate(-this.centeringOffset, -this.centeringYOffset).scale(1 / this.contentScaling()); + private getTransform = () => this.props.dontCenter ? this.props.ScreenToLocalTransform().scale(1 / this.contentScaling()) : this.props.ScreenToLocalTransform().translate(-this.centeringOffset, -this.centeringYOffset).scale(1 / this.contentScaling()); private get centeringOffset() { return this.nativeWidth() && !this.props.Document._fitWidth ? (this.props.PanelWidth() - this.nativeWidth() * this.contentScaling()) / 2 : 0; } private get centeringYOffset() { return Math.abs(this.centeringOffset) < 0.001 ? (this.props.PanelHeight() - this.nativeHeight() * this.contentScaling()) / 2 : 0; } -- cgit v1.2.3-70-g09d2 From b8300497de3d496015c719ad59df9b1d6d4b0e56 Mon Sep 17 00:00:00 2001 From: bobzel Date: Tue, 8 Sep 2020 23:57:23 -0400 Subject: fixed event handling on embedded textboxes - dash field views need to stopPropagation() on pointerdown events, and textBoxes need to handle scroll events when they are rootSelected() (ie, in a template) --- src/client/views/collections/CollectionMasonryViewFieldRow.tsx | 2 +- src/client/views/nodes/formattedText/DashFieldView.tsx | 5 ++++- src/client/views/nodes/formattedText/FormattedTextBox.tsx | 2 +- 3 files changed, 6 insertions(+), 3 deletions(-) (limited to 'src/client/views/nodes') diff --git a/src/client/views/collections/CollectionMasonryViewFieldRow.tsx b/src/client/views/collections/CollectionMasonryViewFieldRow.tsx index 65695d22a..cb7ffb0e7 100644 --- a/src/client/views/collections/CollectionMasonryViewFieldRow.tsx +++ b/src/client/views/collections/CollectionMasonryViewFieldRow.tsx @@ -182,7 +182,7 @@ export class CollectionMasonryViewFieldRow extends React.Component) => { if (e.button === 0 && !e.ctrlKey) { - setupMoveUpEvents(this, e, this.headerMove, emptyFunction, () => (this.props.parent.props.Document._chromeStatus === "disabled") && this.collapseSection(e)); + setupMoveUpEvents(this, e, this.headerMove, emptyFunction, e => (this.props.parent.props.Document._chromeStatus === "disabled") && this.collapseSection(e)); this._createAliasSelected = false; } } diff --git a/src/client/views/nodes/formattedText/DashFieldView.tsx b/src/client/views/nodes/formattedText/DashFieldView.tsx index f2658e77e..f14a57e31 100644 --- a/src/client/views/nodes/formattedText/DashFieldView.tsx +++ b/src/client/views/nodes/formattedText/DashFieldView.tsx @@ -106,7 +106,10 @@ export class DashFieldViewInternal extends React.Component { r?.addEventListener("keydown", e => this.fieldSpanKeyDown(e, r)); r?.addEventListener("blur", e => r && this.updateText(r.textContent!, false)); - r?.addEventListener("pointerdown", action((e) => this._showEnumerables = true)); + r?.addEventListener("pointerdown", action((e) => { + this._showEnumerables = true; + e.stopPropagation(); + })); }} > {strVal} ; diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx index 311143ff7..f1a1726b2 100644 --- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx +++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx @@ -1286,7 +1286,7 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<(FieldViewProp } onPointerWheel = (e: React.WheelEvent): void => { // if a text note is not selected and scrollable, this prevents us from being able to scroll and zoom out at the same time - if (this.props.isSelected(true) || e.currentTarget.scrollHeight > e.currentTarget.clientHeight) { + if ((this.props.rootSelected(true) || this.props.isSelected(true)) || e.currentTarget.scrollHeight > e.currentTarget.clientHeight) { e.stopPropagation(); } } -- cgit v1.2.3-70-g09d2