aboutsummaryrefslogtreecommitdiff
path: root/src/client/views
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/views')
-rw-r--r--src/client/views/DocComponent.tsx1
-rw-r--r--src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx31
-rw-r--r--src/client/views/nodes/DocumentView.tsx5
-rw-r--r--src/client/views/nodes/FieldView.tsx3
-rw-r--r--src/client/views/nodes/ImageBox.tsx1
-rw-r--r--src/client/views/nodes/VideoBox.tsx1
6 files changed, 22 insertions, 20 deletions
diff --git a/src/client/views/DocComponent.tsx b/src/client/views/DocComponent.tsx
index fd0b4e83f..bbd902a96 100644
--- a/src/client/views/DocComponent.tsx
+++ b/src/client/views/DocComponent.tsx
@@ -68,7 +68,6 @@ export interface ViewBoxInterface {
removeDocument?: (doc: Doc | Doc[], annotationKey?: string, leavePushpin?: boolean, dontAddToRemoved?: boolean) => boolean; // add a document (used only by collections)
select?: (ctrlKey: boolean, shiftKey: boolean) => void;
focus?: (textAnchor: Doc, options: FocusViewOptions) => Opt<number>;
- browseTo?: (clientX: number, clientY: number, browseTransitionTime: number) => boolean; // when in explore mode, this allows a component view to display itself in an easy to read way (ie, a document in a freeformview will zoom itself to mostly full screen)
viewTransition?: () => Opt<string>; // duration of a view transition animation
isAnyChildContentActive?: () => boolean; // is any child content of the document active
onClickScriptDisable?: () => 'never' | 'always'; // disable click scripts : never, always, or undefined = only when selected
diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
index d3998aee8..8a859a3fd 100644
--- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
+++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
@@ -309,8 +309,23 @@ export class CollectionFreeFormView extends CollectionSubView<Partial<collection
return dispTime === -1 || curTime === -1 || (curTime - dispTime >= -1e-4 && curTime <= endTime);
}
+ focusOnPoint = (options: FocusViewOptions) => {
+ const {pointFocus, zoomTime, didMove} = options;
+ if (!this.Document.isGroup && pointFocus && !didMove) {
+ const dfltScale = this.isAnnotationOverlay ? 1 : 0.5;
+ if (this.layoutDoc[this.scaleFieldKey] !== dfltScale) {
+ this.zoomSmoothlyAboutPt(this.screenToFreeformContentsXf.transformPoint(pointFocus.X, pointFocus.Y), dfltScale, zoomTime);
+ options.didMove = true;
+ return zoomTime;
+ }
+ }
+ return undefined;
+ };
+
groupFocus = (anchor: Doc, options: FocusViewOptions) => {
- options.docTransform = new Transform(-NumCast(this.layoutDoc[this.panXFieldKey]) + NumCast(anchor.x), -NumCast(this.layoutDoc[this.panYFieldKey]) + NumCast(anchor.y), 1);
+ if (options.pointFocus) return this.focusOnPoint(options);
+ options.docTransform = new Transform(NumCast(anchor.x) + NumCast(anchor._width)/2 - NumCast(this.layoutDoc[this.panXFieldKey]),
+ NumCast(anchor.y) + NumCast(anchor._height)/2- NumCast(this.layoutDoc[this.panYFieldKey]), 1); // prettier-ignore
const res = this._props.focus(this.Document, options);
options.docTransform = undefined;
return res;
@@ -318,6 +333,7 @@ export class CollectionFreeFormView extends CollectionSubView<Partial<collection
focus = (anchor: Doc, options: FocusViewOptions) => {
if (this._lightboxDoc) return undefined;
+ if (options.pointFocus) return this.focusOnPoint(options);
if (anchor === this.Document) {
// if (options.willZoomCentered && options.zoomScale) {
// this.fitContentOnce();
@@ -1980,19 +1996,6 @@ export class CollectionFreeFormView extends CollectionSubView<Partial<collection
</div>
);
}
- browseTo = (clientX: number, clientY: number, browseTransitionTime: number): boolean => {
- if (!this.Document.isGroup) {
- const dfltScale = this.isAnnotationOverlay ? 1 : 0.5;
- if (this.layoutDoc[this.scaleFieldKey] !== dfltScale) {
- this.zoomSmoothlyAboutPt(this.screenToFreeformContentsXf.transformPoint(clientX, clientY), dfltScale, browseTransitionTime);
- return true;
- }
- return !!this.DocumentView?.()
- .containerViewPath?.()
- ?.some(cont => cont.ComponentView?.browseTo?.(clientX, clientY, browseTransitionTime));
- }
- return false;
- };
}
@observer
diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index 555b4ba92..626e3d899 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -50,7 +50,7 @@ import { CollectionFreeFormDocumentView } from './CollectionFreeFormDocumentView
import { DocumentContentsView, ObserverJsxParser } from './DocumentContentsView';
import { DocumentLinksButton } from './DocumentLinksButton';
import './DocumentView.scss';
-import { FieldViewProps, FieldViewSharedProps } from './FieldView';
+import { FieldViewProps, FieldViewSharedProps, FocusViewOptions } from './FieldView';
import { KeyValueBox } from './KeyValueBox';
import { LinkAnchorBox } from './LinkAnchorBox';
import { FormattedTextBox } from './formattedText/FormattedTextBox';
@@ -314,11 +314,12 @@ export class DocumentViewInternal extends DocComponent<FieldViewProps & Document
const browseTransitionTime = 500;
SelectionManager.DeselectAll();
DocumentManager.Instance.showDocument(this.Document, { zoomScale: 0.8, willZoomCentered: true }, (focused: boolean) => {
+ const options:FocusViewOptions = { pointFocus: {X: e.clientX, Y :e.clientY}, zoomTime: browseTransitionTime};
if (!focused && this._docView) {
this._docView
.docViewPath()
.reverse()
- .find(cont => cont.ComponentView?.browseTo?.(e.clientX, e.clientY, browseTransitionTime));
+ .forEach(cont => cont.ComponentView?.focus?.(cont.Document, options));
Doc.linkFollowHighlight(this.Document, false);
}
});
diff --git a/src/client/views/nodes/FieldView.tsx b/src/client/views/nodes/FieldView.tsx
index c2f946a88..52dc632ae 100644
--- a/src/client/views/nodes/FieldView.tsx
+++ b/src/client/views/nodes/FieldView.tsx
@@ -22,7 +22,7 @@ export interface FocusViewOptions {
docTransform?: Transform; // when a document can't be panned and zoomed within its own container (say a group), then we need to continue to move up the render hierarchy to find something that can pan and zoom. when this happens the docTransform must accumulate all the transforms of each level of the hierarchy
instant?: boolean; // whether focus should happen instantly (as opposed to smooth zoom)
preview?: boolean; // whether changes should be previewed by the componentView or written to the document
- effect?: Doc; // animation effect for focus
+ effect?: Doc; // animation effect for focus // bcz: needs to be changed to something more generic than a Doc
noSelect?: boolean; // whether target should be selected after focusing
playAudio?: boolean; // whether to play audio annotation on focus
playMedia?: boolean; // whether to play start target videos
@@ -30,6 +30,7 @@ export interface FocusViewOptions {
zoomTextSelections?: boolean; // whether to display a zoomed overlay of anchor text selections
toggleTarget?: boolean; // whether to toggle target on and off
easeFunc?: 'linear' | 'ease'; // transition method for scrolling
+ pointFocus?: {X:number, Y: number }; // clientX and clientY coordinates to focus on instead of a document target (used by explore mode)
}
export type FocusFuncType = (doc: Doc, options: FocusViewOptions) => Opt<number>;
// eslint-disable-next-line no-use-before-define
diff --git a/src/client/views/nodes/ImageBox.tsx b/src/client/views/nodes/ImageBox.tsx
index 617c45715..db28d0a48 100644
--- a/src/client/views/nodes/ImageBox.tsx
+++ b/src/client/views/nodes/ImageBox.tsx
@@ -414,7 +414,6 @@ export class ImageBox extends ViewBoxAnnotatableComponent<FieldViewProps>() impl
TraceMobx();
return <div className="imageBox-annotationLayer" style={{ height: this._props.PanelHeight() }} ref={this._annotationLayer} />;
}
- browseTo = (clientX: number, clientY: number, browseTransitionTime: number) => !!this._ffref.current?.browseTo?.(clientX, clientY, browseTransitionTime);
screenToLocalTransform = () => this.ScreenToLocalBoxXf().translate(0, NumCast(this.layoutDoc._layout_scrollTop) * this.ScreenToLocalBoxXf().Scale);
marqueeDown = (e: React.PointerEvent) => {
if (!this.dataDoc[this.fieldKey]) {
diff --git a/src/client/views/nodes/VideoBox.tsx b/src/client/views/nodes/VideoBox.tsx
index fd7997248..b8ec0081a 100644
--- a/src/client/views/nodes/VideoBox.tsx
+++ b/src/client/views/nodes/VideoBox.tsx
@@ -979,7 +979,6 @@ export class VideoBox extends ViewBoxAnnotatableComponent<FieldViewProps>() impl
this._props.bringToFront?.(cropping);
return cropping;
};
- browseTo = (clientX: number, clientY: number, browseTransitionTime: number) => !!this._ffref.current?.browseTo(clientX, clientY, browseTransitionTime);
focus = (anchor: Doc, options: FocusViewOptions) => (anchor.type === DocumentType.CONFIG ? undefined : this._ffref.current?.focus(anchor, options));
savedAnnotations = () => this._savedAnnotations;
render() {