diff options
Diffstat (limited to 'src/client/views/nodes')
| -rw-r--r-- | src/client/views/nodes/DocumentView.tsx | 18 | ||||
| -rw-r--r-- | src/client/views/nodes/formattedText/FormattedTextBox.tsx | 15 |
2 files changed, 22 insertions, 11 deletions
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx index c1665ea3d..796d2b3ca 100644 --- a/src/client/views/nodes/DocumentView.tsx +++ b/src/client/views/nodes/DocumentView.tsx @@ -316,7 +316,7 @@ export class DocumentViewInternal extends DocComponent<DocumentViewInternalProps return this.props?.styleProvider?.(this.layoutDoc, this.props, StyleProp.TitleHeight) || 0; } @computed get pointerEvents(): 'none' | 'all' | 'visiblePainted' | undefined { - return this.props.styleProvider?.(this.Document, this.props, StyleProp.PointerEvents + (this.props.isSelected() ? ':selected' : '')); + return this.onClickHandler ? 'all' : this.props.styleProvider?.(this.Document, this.props, StyleProp.PointerEvents + (this.props.isSelected() ? ':selected' : '')); } @computed get finalLayoutKey() { return StrCast(this.Document.layoutKey, 'layout'); @@ -328,7 +328,8 @@ export class DocumentViewInternal extends DocComponent<DocumentViewInternalProps return this.props.NativeHeight(); } @computed get onClickHandler() { - return this.props.onClick?.() ?? this.props.onBrowseClick?.() ?? Cast(this.Document.onClick, ScriptField, Cast(this.layoutDoc.onClick, ScriptField, null)); + const noClick = this.rootSelected() || this.props.isSelected() || this._componentView?.isAnyChildContentActive?.(); + return noClick ? undefined : this.props.onClick?.() ?? this.props.onBrowseClick?.() ?? Cast(this.Document.onClick, ScriptField, Cast(this.layoutDoc.onClick, ScriptField, null)); } @computed get onDoubleClickHandler() { return this.props.onDoubleClick?.() ?? Cast(this.layoutDoc.onDoubleClick, ScriptField, null) ?? this.Document.onDoubleClick; @@ -613,7 +614,7 @@ export class DocumentViewInternal extends DocComponent<DocumentViewInternalProps // bcz: hack? don't execute script if you're clicking on a scripting box itself const { clientX, clientY, shiftKey, altKey } = e; const func = () => - this.onClickHandler.script.run( + this.onClickHandler?.script.run( { this: this.layoutDoc, self: this.rootDoc, @@ -1065,7 +1066,7 @@ export class DocumentViewInternal extends DocComponent<DocumentViewInternalProps rootSelected = (outsideReaction?: boolean) => this.props.isSelected(outsideReaction) || (this.props.Document.rootDocument && this.props.rootSelected?.(outsideReaction)) || false; panelHeight = () => this.props.PanelHeight() - this.headerMargin; screenToLocal = () => this.props.ScreenToLocalTransform().translate(0, -this.headerMargin); - onClickFunc = () => this.onClickHandler; + onClickFunc = () => this.onClickHandler as any as ScriptField; // bcz: typing HACK. check and fix. setHeight = (height: number) => (this.layoutDoc._height = height); setContentView = action((view: { getAnchor?: (addAsAnnotation: boolean) => Doc; forward?: () => boolean; back?: () => boolean }) => (this._componentView = view)); isContentActive = (outsideReaction?: boolean) => { @@ -1116,17 +1117,14 @@ export class DocumentViewInternal extends DocComponent<DocumentViewInternalProps </Tooltip> ); } - pointerEventsFunc = () => this.pointerEvents; + contentPointerEvents = () => (this.onClickHandler ? 'none' : this.pointerEvents); @computed get contents() { TraceMobx(); return ( <div className="documentView-contentsView" style={{ - // prettier-ignore - pointerEvents: - (this.pointerEvents === 'visiblePainted' ? 'none' : this.pointerEvents) ?? - (this.rootDoc.layoutKey === 'layout_icon' ? 'none' : 'all'), + pointerEvents: this.pointerEvents === 'visiblePainted' ? 'none' : this.pointerEvents, height: this.headerMargin ? `calc(100% - ${this.headerMargin}px)` : undefined, }}> {!this._retryThumb || !this.thumbShown() ? null : ( @@ -1147,7 +1145,7 @@ export class DocumentViewInternal extends DocComponent<DocumentViewInternalProps <DocumentContentsView key={1} {...this.props} - pointerEvents={this.opacity === 0 ? returnNone : this.pointerEventsFunc} + pointerEvents={this.contentPointerEvents} docViewPath={this.props.viewPath} thumbShown={this.thumbShown} isHovering={this.props.isHovering} diff --git a/src/client/views/nodes/formattedText/FormattedTextBox.tsx b/src/client/views/nodes/formattedText/FormattedTextBox.tsx index a2c1195cb..ddec86606 100644 --- a/src/client/views/nodes/formattedText/FormattedTextBox.tsx +++ b/src/client/views/nodes/formattedText/FormattedTextBox.tsx @@ -1723,6 +1723,8 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<FieldViewProps this._ignoreScroll = true; this.layoutDoc._scrollTop = this._scrollRef.current.scrollTop; this._ignoreScroll = false; + e.stopPropagation(); + e.preventDefault(); } } }; @@ -1873,7 +1875,18 @@ export class FormattedTextBox extends ViewBoxAnnotatableComponent<FieldViewProps return styleFromLayoutString?.height === '0px' ? null : ( <div className="formattedTextBox-cont" - onWheel={e => this.props.isContentActive() && e.stopPropagation()} + ref={r => + r?.addEventListener( + 'wheel', // if scrollTop is 0, then don't let wheel trigger scroll on any container (which it would since onScroll won't be triggered on this) + (e: WheelEvent) => { + if (this.isContentActive()) { + if (!NumCast(this.layoutDoc._scrollTop) && e.deltaY <= 0) e.preventDefault(); + e.stopPropagation(); + } + }, + { passive: false } + ) + } style={{ ...(this.props.dontScale ? {} |