aboutsummaryrefslogtreecommitdiff
path: root/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
diff options
context:
space:
mode:
authorBob Zeleznik <zzzman@gmail.com>2019-04-30 22:17:26 -0400
committerBob Zeleznik <zzzman@gmail.com>2019-04-30 22:17:26 -0400
commitc92a8fbe94eb5e6167730ffa9a87e5e4e1d040e2 (patch)
tree8daa21ff72fa094c65d26c2e7db1da6d99ce58ee /src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
parentd2fb3085fe17a9c66eab893b2a3d000a5bdec054 (diff)
parent97ed2e452597d5f1f2e8d0abfc06e94b4aa5d448 (diff)
merged hannah's linking changes
Diffstat (limited to 'src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx')
-rw-r--r--src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx13
1 files changed, 11 insertions, 2 deletions
diff --git a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
index e54553d2b..4b759b948 100644
--- a/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
+++ b/src/client/views/collections/collectionFreeForm/CollectionFreeFormView.tsx
@@ -237,10 +237,15 @@ export class CollectionFreeFormView extends CollectionSubView(PanZoomDocument) {
}
focusDocument = (doc: Doc) => {
+ SelectionManager.DeselectAll();
+ this.props.Document.panTransformType = "Ease";
this.setPan(
NumCast(doc.x) + NumCast(doc.width) / 2,
NumCast(doc.y) + NumCast(doc.height) / 2);
this.props.focus(this.props.Document);
+ if (this.props.Document.panTransformType === "Ease") {
+ setTimeout(() => this.props.Document.panTransformType = "None", 2000); // wait 3 seconds, then reset to false
+ }
}
@@ -292,6 +297,7 @@ export class CollectionFreeFormView extends CollectionSubView(PanZoomDocument) {
private childViews = () => [...this.views, <CollectionFreeFormBackgroundView key="backgroundView" {...this.props} {...this.getDocumentViewProps(this.props.Document)} />];
render() {
const containerName = `collectionfreeformview${this.isAnnotationOverlay ? "-overlay" : "-container"}`;
+ const easing = () => this.props.Document.panTransformType === "Ease";
return (
<div className={containerName} ref={this.createDropTarget} onWheel={this.onPointerWheel}
style={{ borderRadius: "inherit" }}
@@ -300,7 +306,8 @@ export class CollectionFreeFormView extends CollectionSubView(PanZoomDocument) {
addDocument={this.addDocument} removeDocument={this.props.removeDocument} addLiveTextDocument={this.addLiveTextBox}
getContainerTransform={this.getContainerTransform} getTransform={this.getTransform}>
<CollectionFreeFormViewPannableContents centeringShiftX={this.centeringShiftX} centeringShiftY={this.centeringShiftY}
- zoomScaling={this.zoomScaling} panX={this.panX} panY={this.panY}>
+ easing={easing} zoomScaling={this.zoomScaling} panX={this.panX} panY={this.panY}>
+
<CollectionFreeFormLinksView {...this.props} key="freeformLinks">
<InkingCanvas getScreenTransform={this.getTransform} Document={this.props.Document} >
{this.childViews}
@@ -347,17 +354,19 @@ interface CollectionFreeFormViewPannableContentsProps {
panX: () => number;
panY: () => number;
zoomScaling: () => number;
+ easing: () => boolean;
}
@observer
class CollectionFreeFormViewPannableContents extends React.Component<CollectionFreeFormViewPannableContentsProps>{
render() {
+ let freeformclass = "collectionfreeformview" + (this.props.easing() ? "-ease" : "-none");
const cenx = this.props.centeringShiftX();
const ceny = this.props.centeringShiftY();
const panx = -this.props.panX();
const pany = -this.props.panY();
const zoom = this.props.zoomScaling();// needs to be a variable outside of the <Measure> otherwise, reactions won't fire
- return <div className="collectionfreeformview" style={{ borderRadius: "inherit", transform: `translate(${cenx}px, ${ceny}px) scale(${zoom}, ${zoom}) translate(${panx}px, ${pany}px)` }}>
+ return <div className={freeformclass} style={{ borderRadius: "inherit", transform: `translate(${cenx}px, ${ceny}px) scale(${zoom}, ${zoom}) translate(${panx}px, ${pany}px)` }}>
{this.props.children}
</div>;
}