fix(pose-viewer): render event after render, not before

sign-language-processing · Nov 11, 2023 · b4b4e31 · b4b4e31
1 parent 2cf49eb
commit b4b4e31
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 6 deletions.
diff --git a/src/js/pose_viewer/package.json b/src/js/pose_viewer/package.json
@@ -1,6 +1,6 @@
 {
   "name": "pose-viewer",
-  "version": "0.7.3",
+  "version": "0.7.4",
   "description": "Stencil Component Starter",
   "main": "dist/index.cjs.js",
   "module": "dist/index.js",

diff --git a/src/js/pose_viewer/src/components/pose-viewer/pose-viewer.tsx b/src/js/pose_viewer/src/components/pose-viewer/pose-viewer.tsx
@@ -317,6 +317,7 @@ export class PoseViewer {
     const frameId = Math.floor(currentTime * this.pose.body.fps);
     const frame = this.pose.body.frames[frameId];
 
+    const render = this.renderer.render(frame);
     if (!this.hasRendered) {
       requestAnimationFrame(() => {
         this.hasRendered = true;
@@ -325,11 +326,7 @@ export class PoseViewer {
     }
     requestAnimationFrame(() => this.render$.emit());
 
-    return (
-      <Host>
-        {this.renderer.render(frame)}
-      </Host>
-    );
+    return (<Host>{render}</Host>);
   }
 }
 

diff --git a/src/js/pose_viewer/src/index.html b/src/js/pose_viewer/src/index.html
@@ -79,6 +79,11 @@
       poseViewer.setAttribute('src', url + 'test');
     }, 2000);
 
+    poseViewer.addEventListener('render$', (e) => {
+      console.log(poseViewer.shadowRoot.querySelector('canvas').width);
+      console.log(poseViewer.shadowRoot.querySelector('canvas').height);
+    });
+
 
     // for(let i = 0; i < sentence.length; i++) {
     //   setTimeout(() => {