now working on video and web box's to fix their annotation registration with doc decorations.

2 files changed, 8 insertions, 4 deletions

diff --git a/src/client/views/nodes/VideoBox.tsx b/src/client/views/nodes/VideoBox.tsx
index b446dab22..06a305515 100644
--- a/src/client/views/nodes/VideoBox.tsx
+++ b/src/client/views/nodes/VideoBox.tsx
@@ -414,8 +414,9 @@ export class VideoBox extends ViewBoxAnnotatableComponent<FieldViewProps, VideoD
         return this.addDocument(doc);
     }
 
-    @computed get contentScaling() { return this.props.scaling?.() || 1 }
+    @computed get contentScaling() { return this.props.scaling?.() || 1; }
     scaling = () => this.contentScaling;
+    screenToLocalTransform = () => this.props.ScreenToLocalTransform().scale(1 / this.scaling());
     contentFunc = () => [this.youtubeVideoId ? this.youtubeContent : this.content];
     render() {
         return (<div className="videoBox" onContextMenu={this.specificContextMenu}
@@ -434,7 +435,7 @@ export class VideoBox extends ViewBoxAnnotatableComponent<FieldViewProps, VideoD
                     select={emptyFunction}
                     active={this.annotationsActive}
                     ContentScaling={this.scaling}
-                    ScreenToLocalTransform={Transform.Identity}
+                    ScreenToLocalTransform={this.screenToLocalTransform}
                     whenActiveChanged={this.whenActiveChanged}
                     removeDocument={this.removeDocument}
                     moveDocument={this.moveDocument}
diff --git a/src/client/views/nodes/WebBox.tsx b/src/client/views/nodes/WebBox.tsx
index 511e8f537..d1d734255 100644
--- a/src/client/views/nodes/WebBox.tsx
+++ b/src/client/views/nodes/WebBox.tsx
@@ -646,7 +646,10 @@ export class WebBox extends ViewBoxAnnotatableComponent<FieldViewProps, WebDocum
     marqueeX = () => this._marqueeX;
     marqueeY = () => this._marqueeY;
     marqueeing = () => this._marqueeing;
-    scrollXf = () => this.props.ScreenToLocalTransform().translate(NumCast(this.layoutDoc._scrollLeft), NumCast(this.layoutDoc._scrollTop));
+    @computed get contentScaling() { return this.props.scaling?.() || 1; }
+    scrollXf = () => this.props.ScreenToLocalTransform().translate(NumCast(this.layoutDoc._scrollLeft), NumCast(this.layoutDoc._scrollTop)).scale(1 / this.contentScaling);
+    scaling = () => this.contentScaling;
+    screenToLocalTransform = () => this.props.ScreenToLocalTransform().scale(1 / this.scaling())
     render() {
         return (<div className="webBox" ref={this._mainCont} >
             <div className={`webBox-container`}
@@ -692,12 +695,12 @@ export class WebBox extends ViewBoxAnnotatableComponent<FieldViewProps, WebDocum
                             isAnnotationOverlay={true}
                             select={emptyFunction}
                             active={this.active}
-                            ContentScaling={returnOne}
                             whenActiveChanged={this.whenActiveChanged}
                             removeDocument={this.removeDocument}
                             moveDocument={this.moveDocument}
                             addDocument={this.addDocument}
                             CollectionView={undefined}
+                            ContentScaling={this.scaling}
                             ScreenToLocalTransform={this.scrollXf}
                             renderDepth={this.props.renderDepth + 1}>
                         </CollectionFreeFormView>