frontend working

micahg · Mar 2, 2023 · 22d6569 · 22d6569
1 parent c3e6ea1
commit 22d6569
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 6 deletions.
diff --git a/src/components/App/App.tsx b/src/components/App/App.tsx
@@ -8,9 +8,9 @@ function App() {
   let view = query.get('view');
   return (
     <div className="App">
-      <ContentEditor/>
-      {/* {view !== 'edit' && <RemoteDisplayComponent/>}
-      {view === 'edit' && <ContentEditor/>} */}
+      {/* <ContentEditor/> */}
+      {view !== 'edit' && <RemoteDisplayComponent/>}
+      {view === 'edit' && <ContentEditor/>}
     </div>
   );
 }

diff --git a/src/components/RemoteDisplayComponent/RemoteDisplayComponent.tsx b/src/components/RemoteDisplayComponent/RemoteDisplayComponent.tsx
@@ -55,8 +55,17 @@ const RemoteDisplayComponent = () => {
         return;
       }
 
+      // ignore null state -- happens when server has no useful state loaded yet
+      if (js.state === null) return;
+
+      // if we don't have an API URL we'll never get WS messages... seems impossible
+      if (apiUrl === null) {
+        console.error('THE IMPOSSIBLE HAS HAPPENED -- WS MESSAGE WITH NO API SERVER WHAT');
+        return;
+      }
+
       let ts: number = new Date().getTime();
-      if ('overlay' in js.state && apiUrl) {
+      if ('overlay' in js.state && js.state.overlay) {
         let asset: string = js.state.overlay;
         loadImage(`${apiUrl}/${asset}?${ts}`).then((img: HTMLImageElement) => {
           renderImage(img, overlayCnvs, overlayCtx);
@@ -65,7 +74,7 @@ const RemoteDisplayComponent = () => {
         });
       }
 
-      if ('background' in js.state && apiUrl) {
+      if ('background' in js.state && js.state.background) {
         let asset: string = js.state.background;
         loadImage(`${apiUrl}/${asset}?${ts}`).then((img: HTMLImageElement) => {
           renderImage(img, contentCnvs, contentCtx);

diff --git a/src/utils/drawing.ts b/src/utils/drawing.ts
@@ -25,7 +25,7 @@ export function loadImage(uri: string): Promise<HTMLImageElement> {
     // originates from the fact that our frontend in dev is on localhost:4200 and
     // I don't think cross-origin is setup properly for static data on the nose
     // server
-    img.crossOrigin = 'Anonymous';
+    // img.crossOrigin = 'Anonymous';
   });
 }
 /*export function loadImage(data: Blob): Promise<HTMLImageElement>;