aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/DocumentDecorations.tsx
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/views/DocumentDecorations.tsx')
-rw-r--r--src/client/views/DocumentDecorations.tsx50
1 files changed, 25 insertions, 25 deletions
diff --git a/src/client/views/DocumentDecorations.tsx b/src/client/views/DocumentDecorations.tsx
index 40eb1fe2b..8b8b7fa4d 100644
--- a/src/client/views/DocumentDecorations.tsx
+++ b/src/client/views/DocumentDecorations.tsx
@@ -20,6 +20,7 @@ import { DocumentManager } from '../util/DocumentManager';
import { DragManager } from '../util/DragManager';
import { LinkFollower } from '../util/LinkFollower';
import { SelectionManager } from '../util/SelectionManager';
+import { SettingsManager } from '../util/SettingsManager';
import { SnappingManager } from '../util/SnappingManager';
import { UndoManager } from '../util/UndoManager';
import { CollectionDockingView } from './collections/CollectionDockingView';
@@ -46,9 +47,9 @@ export class DocumentDecorations extends React.Component<{ PanelWidth: number; P
private _titleHeight = 20;
private _resizeUndo?: UndoManager.Batch;
private _offX = 0;
- _offY = 0; // offset from click pt to inner edge of resize border
+ private _offY = 0; // offset from click pt to inner edge of resize border
private _snapX = 0;
- _snapY = 0; // last snapped location of resize border
+ private _snapY = 0; // last snapped location of resize border
private _dragHeights = new Map<Doc, { start: number; lowest: number }>();
private _inkDragDocs: { doc: Doc; x: number; y: number; width: number; height: number }[] = [];
@@ -70,8 +71,8 @@ export class DocumentDecorations extends React.Component<{ PanelWidth: number; P
DocumentDecorations.Instance = this;
reaction(
() => SelectionManager.Views().slice(),
- action(docs => {
- this._showNothing = !DocumentView.LongPress && docs.length === 1; // show decorations if multiple docs are selected or we're long pressing
+ action(views => {
+ this._showNothing = !DocumentView.LongPress && views.length === 1; // show decorations if multiple docs are selected or we're long pressing
this._editingTitle = false;
})
);
@@ -80,8 +81,10 @@ export class DocumentDecorations extends React.Component<{ PanelWidth: number; P
'pointermove',
action(e => {
if (this.Bounds.x || this.Bounds.y || this.Bounds.r || this.Bounds.b) {
- if (this.Bounds.x !== Number.MAX_VALUE && (this.Bounds.x > e.clientX || this.Bounds.r < e.clientX || this.Bounds.y > e.clientY || this.Bounds.b < e.clientY)) {
+ if (this.Bounds.x !== Number.MAX_VALUE && (this.Bounds.x > e.clientX + 10 || this.Bounds.r < e.clientX - 10 || this.Bounds.y > e.clientY + 10 || this.Bounds.b < e.clientY - 10)) {
this._showNothing = false;
+ } else {
+ this._showNothing = true;
}
}
})
@@ -225,10 +228,7 @@ export class DocumentDecorations extends React.Component<{ PanelWidth: number; P
e.x,
e.y,
{
- dragComplete: action(e => {
- dragData.canEmbed && SelectionManager.DeselectAll();
- this._hidden = false;
- }),
+ dragComplete: action(e => (this._hidden = false)),
hideSource: true,
}
);
@@ -255,7 +255,7 @@ export class DocumentDecorations extends React.Component<{ PanelWidth: number; P
iconView.props.removeDocument?.(iconView.props.Document);
}
});
- SelectionManager.DeselectAll();
+ views.forEach(v => SelectionManager.DeselectView());
}
this._iconifyBatch?.end();
this._iconifyBatch = undefined;
@@ -403,10 +403,8 @@ export class DocumentDecorations extends React.Component<{ PanelWidth: number; P
}), // moveEvent
action(action(() => (this._isRotating = false))), // upEvent
action((e, doubleTap) => {
- if (doubleTap) {
- seldocview.rootDoc.rotation_centerX = 0.5;
- seldocview.rootDoc.rotation_centerY = 0.5;
- }
+ seldocview.rootDoc.rotation_centerX = 0;
+ seldocview.rootDoc.rotation_centerY = 0;
})
);
};
@@ -777,10 +775,11 @@ export class DocumentDecorations extends React.Component<{ PanelWidth: number; P
const hideDecorations = seldocview.props.hideDecorations || seldocview.rootDoc.hideDecorations;
const hideResizers =
![AclAdmin, AclEdit, AclAugment].includes(GetEffectiveAcl(seldocview.rootDoc)) || hideDecorations || seldocview.props.hideResizeHandles || seldocview.rootDoc.layout_hideResizeHandles || this._isRounding || this._isRotating;
- const hideTitle = hideDecorations || seldocview.props.hideDecorationTitle || seldocview.rootDoc.layout_hideDecorationTitle || this._isRounding || this._isRotating;
+ const hideTitle = this._showNothing || hideDecorations || seldocview.props.hideDecorationTitle || seldocview.rootDoc.layout_hideDecorationTitle || this._isRounding || this._isRotating;
const hideDocumentButtonBar = hideDecorations || seldocview.props.hideDocumentButtonBar || seldocview.rootDoc.layout_hideDocumentButtonBar || this._isRounding || this._isRotating;
// if multiple documents have been opened at the same time, then don't show open button
const hideOpenButton =
+ this._showNothing ||
hideDecorations ||
seldocview.props.hideOpenButton ||
seldocview.rootDoc.layout_hideOpenButton ||
@@ -788,6 +787,7 @@ export class DocumentDecorations extends React.Component<{ PanelWidth: number; P
this._isRounding ||
this._isRotating;
const hideDeleteButton =
+ this._showNothing ||
hideDecorations ||
this._isRounding ||
this._isRotating ||
@@ -821,7 +821,7 @@ export class DocumentDecorations extends React.Component<{ PanelWidth: number; P
// Radius constants
const useRounding = seldocview.ComponentView instanceof ImageBox || seldocview.ComponentView instanceof FormattedTextBox || seldocview.ComponentView instanceof CollectionFreeFormView;
- const borderRadius = numberValue(StrCast(seldocview.rootDoc.layout_borderRounding));
+ const borderRadius = numberValue(Cast(seldocview.rootDoc.layout_borderRounding, 'string', null));
const docMax = Math.min(NumCast(seldocview.rootDoc.width) / 2, NumCast(seldocview.rootDoc.height) / 2);
const maxDist = Math.min((this.Bounds.r - this.Bounds.x) / 2, (this.Bounds.b - this.Bounds.y) / 2);
const radiusHandle = (borderRadius / docMax) * maxDist;
@@ -884,9 +884,9 @@ export class DocumentDecorations extends React.Component<{ PanelWidth: number; P
)}
</div>
);
-
+ const freeformDoc = SelectionManager.Views().some(v => v.props.CollectionFreeFormDocumentView?.());
return (
- <div className="documentDecorations" style={{ display: this._showNothing ? 'none' : undefined }}>
+ <div className="documentDecorations" style={{ display: this._showNothing && !freeformDoc ? 'none' : undefined }}>
<div
className="documentDecorations-background"
style={{
@@ -906,13 +906,13 @@ export class DocumentDecorations extends React.Component<{ PanelWidth: number; P
{bounds.r - bounds.x < 15 && bounds.b - bounds.y < 15 ? null : (
<div>
<div
- className="documentDecorations-container"
+ className={`documentDecorations-container ${this._showNothing ? 'showNothing' : ''}`}
key="container"
style={{
transform: `translate(${bounds.x - this._resizeBorderWidth / 2}px, ${bounds.y - this._resizeBorderWidth / 2 - this._titleHeight}px) rotate(${rotation}deg)`,
transformOrigin: `50% calc(50% + 10px)`,
width: bounds.r - bounds.x + this._resizeBorderWidth + 'px',
- height: bounds.b - bounds.y + this._resizeBorderWidth + this._titleHeight + 'px',
+ height: bounds.b - bounds.y + this._resizeBorderWidth + (this._showNothing ? 0 : this._titleHeight) + 'px',
}}>
<div
className="documentDecorations-topbar"
@@ -944,17 +944,17 @@ export class DocumentDecorations extends React.Component<{ PanelWidth: number; P
{useRounding && (
<div
key="rad"
+ className="documentDecorations-borderRadius"
style={{
background: `${this._isRounding ? Colors.MEDIUM_BLUE : undefined}`,
- transform: `translate(${radiusHandleLocation}px, ${radiusHandleLocation}px)`,
+ transform: `translate(${radiusHandleLocation ?? 0}px, ${(radiusHandleLocation ?? 0) + (this._showNothing ? 0 : this._titleHeight)}px)`,
}}
- className={`documentDecorations-borderRadius`}
onPointerDown={this.onRadiusDown}
onContextMenu={e => e.preventDefault()}
/>
)}
- {hideDocumentButtonBar ? null : (
+ {hideDocumentButtonBar || this._showNothing ? null : (
<div
className="link-button-container"
key="links"
@@ -980,8 +980,8 @@ export class DocumentDecorations extends React.Component<{ PanelWidth: number; P
}}>
{this._isRotating ? null : (
<Tooltip enterDelay={750} title={<div className="dash-tooltip">tap to set rotate center, drag to rotate</div>}>
- <div className="documentDecorations-rotation" style={{ pointerEvents: 'all', color: 'blue' }} onPointerDown={this.onRotateDown} onContextMenu={e => e.preventDefault()}>
- <IconButton icon={<FaUndo />} color={Colors.LIGHT_GRAY} />
+ <div className="documentDecorations-rotation" style={{ pointerEvents: 'all', background: 'transparent' }} onPointerDown={this.onRotateDown} onContextMenu={e => e.preventDefault()}>
+ <IconButton icon={<FaUndo />} color={SettingsManager.userColor} />
</div>
</Tooltip>
)}
generated by cgit v1.2.3-70-g09d2 (git 2.46.0) at 2025-10-06 11:51:48 +0000