From 5ad8289e8ca3b6ff8304ac4fa3c2d3adaa9abf6d Mon Sep 17 00:00:00 2001
From: bobzel <zzzman@gmail.com>
Date: Thu, 1 Sep 2022 14:52:04 -0400
Subject: afixed loadingBox to show error message for unsupported videos. 
 fixed video uploading to generate errors for unsupported (Chrome) codecs.  
 fixed videos that don't have codec support to still play audio and show
 duration.  fixed dragging rotated documents to show and place the rotted
 document WYSIWYG

---
 src/client/views/nodes/DocumentView.tsx |  4 ++--
 src/client/views/nodes/LoadingBox.scss  |  2 ++
 src/client/views/nodes/LoadingBox.tsx   |  4 ++--
 src/client/views/nodes/VideoBox.tsx     | 10 ++++++----
 4 files changed, 12 insertions(+), 8 deletions(-)

(limited to 'src/client/views')

diff --git a/src/client/views/nodes/DocumentView.tsx b/src/client/views/nodes/DocumentView.tsx
index 01fadb48d..113574a64 100644
--- a/src/client/views/nodes/DocumentView.tsx
+++ b/src/client/views/nodes/DocumentView.tsx
@@ -498,8 +498,8 @@ export class DocumentViewInternal extends DocComponent<DocumentViewInternalProps
                 .ScreenToLocalTransform()
                 .scale(this.NativeDimScaling)
                 .transformDirection(x - left, y - top);
-            dragData.offset[0] = Math.min(this.rootDoc[WidthSym](), dragData.offset[0]);
-            dragData.offset[1] = Math.min(this.rootDoc[HeightSym](), dragData.offset[1]);
+            // dragData.offset[0] = Math.min(this.rootDoc[WidthSym](), dragData.offset[0]);  // bcz: this was breaking dragging rotated objects since the offset may be out of bounds with regard to the unrotated document
+            // dragData.offset[1] = Math.min(this.rootDoc[HeightSym](), dragData.offset[1]);
             dragData.dropAction = dropAction;
             dragData.treeViewDoc = this.props.treeViewDoc;
             dragData.removeDocument = this.props.removeDocument;
diff --git a/src/client/views/nodes/LoadingBox.scss b/src/client/views/nodes/LoadingBox.scss
index f6912f547..d63ed2575 100644
--- a/src/client/views/nodes/LoadingBox.scss
+++ b/src/client/views/nodes/LoadingBox.scss
@@ -4,6 +4,8 @@
     align-content: center;
     justify-content: center;
     background-color: #fdfdfd;
+    height: 100%;
+    align-items: center;
 }
 
 .textContainer {
diff --git a/src/client/views/nodes/LoadingBox.tsx b/src/client/views/nodes/LoadingBox.tsx
index f3243f6cd..462ad425a 100644
--- a/src/client/views/nodes/LoadingBox.tsx
+++ b/src/client/views/nodes/LoadingBox.tsx
@@ -37,9 +37,9 @@ export class LoadingBox extends ViewBoxAnnotatableComponent<FieldViewProps>() {
 
     render() {
         return (
-            <div className="loadingBoxContainer">
+            <div className="loadingBoxContainer" style={{ background: this.rootDoc.isLoading ? '' : 'red' }}>
                 <div className="textContainer">
-                    <p className="headerText">{this.rootDoc.isLoading ? 'Loading:' : 'Error Loading File:'}</p>
+                    <p className="headerText">{this.rootDoc.isLoading ? 'Loading:' : StrCast(this.rootDoc.errorMessage, 'Error Loading File:')}</p>
                     <span className="text">{StrCast(this.rootDoc.title)}</span>
                     {!this.rootDoc.isLoading ? null : <ReactLoading type={'spinningBubbles'} color={'blue'} height={100} width={100} />}
                 </div>
diff --git a/src/client/views/nodes/VideoBox.tsx b/src/client/views/nodes/VideoBox.tsx
index 0ff15f93b..6ff11258d 100644
--- a/src/client/views/nodes/VideoBox.tsx
+++ b/src/client/views/nodes/VideoBox.tsx
@@ -396,10 +396,12 @@ export class VideoBox extends ViewBoxAnnotatableComponent<ViewBoxAnnotatableProp
 
     // sets video info on load
     videoLoad = action(() => {
-        const aspect = this.player!.videoWidth / this.player!.videoHeight;
-        Doc.SetNativeWidth(this.dataDoc, this.player!.videoWidth);
-        Doc.SetNativeHeight(this.dataDoc, this.player!.videoHeight);
-        this.layoutDoc._height = NumCast(this.layoutDoc._width) / aspect;
+        const aspect = this.player!.videoWidth / (this.player!.videoHeight || 1);
+        if (aspect) {
+            Doc.SetNativeWidth(this.dataDoc, this.player!.videoWidth);
+            Doc.SetNativeHeight(this.dataDoc, this.player!.videoHeight);
+            this.layoutDoc._height = NumCast(this.layoutDoc._width) / aspect;
+        }
         if (Number.isFinite(this.player!.duration)) {
             this.rawDuration = this.player!.duration;
         } else this.rawDuration = NumCast(this.dataDoc[this.fieldKey + '-duration']);
-- 
cgit v1.2.3-70-g09d2