Examples: Remove display:none from CodeEditor and use actual componen…

…t state to hide spinner (#5782)
playcanvas · Nov 7, 2023 · 05421fc · 05421fc
1 parent f348546
commit 05421fc
Show file tree

Hide file tree

Showing 2 changed files with 2 additions and 4 deletions.
diff --git a/examples/src/app/code-editor.mjs b/examples/src/app/code-editor.mjs
@@ -78,14 +78,12 @@ class CodeEditor extends TypedComponent {
         /** @type {Record<string, string>} */
         const files = event.files;
         this.mergeState({ files, selectedFile: 'example.mjs' });
-        document.querySelector(".spin").style.display = 'none';
     }
 
     handleExampleLoading(event) {
         this.mergeState({
             files: {'example.mjs': '// reloading'}
         });
-        document.querySelector(".spin").style.display = '';
     }
 
     handleRequestedFiles(event) {

diff --git a/examples/src/app/example.mjs b/examples/src/app/example.mjs
@@ -303,13 +303,13 @@ class Example extends TypedComponent {
 
     render() {
         const { iframePath } = this;
-        const { orientation } = this.state;
+        const { orientation, exampleLoaded } = this.state;
         // console.log("Example#render", JSON.stringify(this.state, null, 2));
         return jsx(Container,
             {
                 id: "canvas-container"
             },
-            jsx(Spinner, { size: 50 }),
+            !exampleLoaded && jsx(Spinner, { size: 50 }),
             jsx("iframe", {
                 id: "exampleIframe",
                 key: iframePath,