Add fix for vcam lagging behind during rendering

engine/src/base/Project.js

@@ -1896,7 +1896,9 @@ orderDynamicFrames() {
         renderCopy.zoom = zoom / window.devicePixelRatio;
         renderCopy.pan = {x: 0, y: 0};
 
-        // renderCopy.tick();
+        renderCopy.view.render();
+		this.resetSoundsPlayed();
+		renderCopy.tick();
 
         // We need full control over when paper.js renders, if we leave autoUpdate on, it's possible to lose frames if paper.js doesnt automatically render as fast as we are generating the images.
         // (See paper.js docs for info about autoUpdate)
@@ -1940,7 +1942,6 @@ orderDynamicFrames() {
             frameImage.src = renderCopy.view.canvas.toDataURL(args.imageType);
         }
 
-        this.resetSoundsPlayed();
         renderFrame();
     }
 

public/builtinlibrary/wickobjects/vcam.wickobj

@@ -1 +1 @@
-{"object":{"classname":"Clip","identifier":null,"name":null,"uuid":"291dc48b-b145-448f-9e54-2cce085cd54f","children":["6ffac017-fc2e-41de-b048-7ea766047e00"],"scripts":[{"name":"update","src":"// Wick VCam v1.0\n\n// (optional) set this value to true if you want black bars to\n// render if the vcam is a different aspect ratio than the project\nthis.showBlackBorders = true;\n\n// Save original size of the vcam\nthis.origBounds = this.origBounds || {\n    width: this.bounds.width,\n    height: this.bounds.height,\n};\n\n// Hide vcam outline and show black borders (if enabled)\nthis.gotoAndStop(this.showBlackBorders ? 2 : 3);\n\n// Hide the projects black bars if needed (the vcam will render its own)\nthis.project.renderBlackBars = false;\n\n// Adjust pan and zoom so that only what is inside the vcam is visible\n// alani's zoom code:\nvar canvasElement = window.document.getElementById(\"wick-canvas-container\").children[0] || {width: window.innerWidth, height: window.innerHeight};\nvar WHDW = canvasElement.height/canvasElement.width;\nvar PHDW = project.height/project.width;\ngh = WHDW < PHDW?project.height:(project.width/canvasElement.width)*canvasElement.height;\ngw = WHDW > PHDW?project.width:(project.height/canvasElement.height)*canvasElement.width;\nvar k = this.origBounds.height/gh;\nvar k2 = this.origBounds.width/gw;\nthis.project.zoom = k2>k?gw/this.origBounds.width:gh/this.origBounds.height;\n// pan and rotation:\nthis.project.pan.x = -(this.x - project.width/2);\nthis.project.pan.y = -(this.y - project.height/2);\nthis.project.rotation = -this.rotation;\n\n"}],"cursor":"default","transformation":{"x":358.2554517133957,"y":208.72274143302195,"scaleX":1,"scaleY":1,"rotation":0,"opacity":1},"animationType":"loop","singleFrameNumber":1},"children":[{"classname":"Timeline","identifier":null,"name":null,"uuid":"6ffac017-fc2e-41de-b048-7ea766047e00","children":["bfaf645a-3003-4c42-afa3-a0a13742c35a"],"playheadPosition":1,"activeLayerIndex":0},{"classname":"Layer","identifier":null,"name":"Layer","uuid":"bfaf645a-3003-4c42-afa3-a0a13742c35a","children":["99e7a79b-9e02-46f5-b481-1240363f736c","8c9e6a50-f5e2-4c4a-8ab1-2876a79e6804","3c0081af-fe36-4317-95a5-b90db04f0875"],"locked":false,"hidden":false},{"classname":"Frame","identifier":null,"name":null,"uuid":"99e7a79b-9e02-46f5-b481-1240363f736c","children":["03196ea7-6fc8-43f6-9ebe-dc103bee4d94","ba6bf951-7a76-422b-9d65-a80234de1f6a","e7a56c22-00a6-431e-8fe2-41a084a16722"],"scripts":[{"name":"default","src":""}],"cursor":"default","start":1,"end":1,"sound":null,"soundVolume":1,"soundLoop":false,"originalLayerIndex":0},{"classname":"Frame","identifier":null,"name":null,"uuid":"8c9e6a50-f5e2-4c4a-8ab1-2876a79e6804","children":["dd8ba2d7-1369-439f-9565-7ff957c7c2c6","53aba1c5-5823-4e08-aa66-39e24719e581","6c721034-b600-4222-bbf8-790dec5bf190","fb84f26b-953a-4569-b3a2-c36533fd11be"],"scripts":[{"name":"default","src":""}],"cursor":"default","start":2,"end":2,"sound":null,"soundVolume":1,"soundLoop":false,"originalLayerIndex":0},{"classname":"Frame","identifier":null,"name":null,"uuid":"3c0081af-fe36-4317-95a5-b90db04f0875","children":[],"scripts":[{"name":"default","src":""}],"cursor":"default","start":3,"end":3,"sound":null,"soundVolume":1,"soundLoop":false,"originalLayerIndex":0},{"classname":"Path","identifier":null,"name":null,"uuid":"03196ea7-6fc8-43f6-9ebe-dc103bee4d94","children":[],"json":["Path",{"applyMatrix":true,"segments":[[-360,240],[-360,-240],[360,-240],[360,240]],"closed":true,"fillColor":[0.2902,0.56471,0.88627,0.19],"strokeColor":[0,0,0]}],"fontStyle":"normal","fontWeight":400},{"classname":"Path","identifier":null,"name":null,"uuid":"ba6bf951-7a76-422b-9d65-a80234de1f6a","children":[],"json":["Path",{"applyMatrix":true,"segments":[[0,-37.5],[0,37.5]],"strokeColor":[0,0,0]}],"fontStyle":"normal","fontWeight":400},{"classname":"Path","identifier":null,"name":null,"uuid":"e7a56c22-00a6-431e-8fe2-41a084a16722","children":[],"json":["Path",{"applyMatrix":true,"segments":[[-37.5,0],[37.5,0]],"strokeColor":[0,0,0]}],"fontStyle":"normal","fontWeight":400},{"classname":"Path","identifier":null,"name":null,"uuid":"dd8ba2d7-1369-439f-9565-7ff957c7c2c6","children":[],"json":["Path",{"applyMatrix":true,"segments":[[-10000,-240],[-10000,-10000],[10000,-10000],[10000,-240]],"closed":true,"fillColor":[0,0,0],"strokeColor":[0,0,0]}],"fontStyle":"normal","fontWeight":400},{"classname":"Path","identifier":null,"name":null,"uuid":"53aba1c5-5823-4e08-aa66-39e24719e581","children":[],"json":["Path",{"applyMatrix":true,"segments":[[-10000,10000],[-10000,240],[10000,240],[10000,10000]],"closed":true,"fillColor":[0,0,0],"strokeColor":[0,0,0]}],"fontStyle":"normal","fontWeight":400},{"classname":"Path","identifier":null,"name":null,"uuid":"6c721034-b600-4222-bbf8-790dec5bf190","children":[],"json":["Path",{"applyMatrix":true,"segments":[[-10000,10000],[-10000,-10000],[-360,-10000],[-360,10000]],"closed":true,"fillColor":[0,0,0],"strokeColor":[0,0,0]}],"fontStyle":"normal","fontWeight":400},{"classname":"Path","identifier":null,"name":null,"uuid":"fb84f26b-953a-4569-b3a2-c36533fd11be","children":[],"json":["Path",{"applyMatrix":true,"segments":[[360,10000],[360,-10000],[10000,-10000],[10000,10000]],"closed":true,"fillColor":[0,0,0],"strokeColor":[0,0,0]}],"fontStyle":"normal","fontWeight":400}],"assets":[]}
+{"object":{"classname":"Clip","identifier":null,"name":null,"uuid":"c74e46c8-034b-427f-b519-e1b69e233143","children":["55ab1656-ac42-442c-9341-6a1dbc8d5a9e"],"scripts":[{"name":"default","src":"// Wick VCam Beta v1.1\n\n// (optional) set this value to true if you want black bars to\n// render if the vcam is a different aspect ratio than the project\nthis.showBlackBorders = true;\n\n// Hide vcam outline and show black borders (if enabled)\nthis.gotoAndStop(this.showBlackBorders ? 2 : 3);\n\n// Hide the projects black bars if needed (the vcam will render its own)\nthis.project.renderBlackBars = false;\n\nthis.inEditor = window.INJECTED_WICKPROJECT_DATA === undefined;\n\nthis.update = function() {\n    let wr = 0;\n    let hr = 0;\n    \n    // exported interactive projects have a different zoom system\n    if(this.inEditor) {\n        wr = this.project.view.canvasDimensions.width;\n        hr = this.project.view.canvasDimensions.height;\n    } else {\n        wr = project.width;\n        hr = project.height;\n    }\n    \n    wr /= 720*this.scaleX;\n    hr /= 480*this.scaleY;\n    \n    this.project.zoom = Math.min(wr, hr);\n    this.project.pan.x = -(this.x - project.width/2);\n    this.project.pan.y = -(this.y - project.height/2);\n    this.project.rotation = -this.rotation;\n};\n\nthis.update();"},{"name":"update","src":"this.update();"}],"cursor":"default","transformation":{"x":360,"y":240,"scaleX":1,"scaleY":1,"rotation":0,"opacity":1},"animationType":"loop","singleFrameNumber":1,"assetSourceUUID":"57d7df92-26c7-4c24-8778-0770b3c66c84"},"children":[{"classname":"Timeline","identifier":null,"name":null,"uuid":"55ab1656-ac42-442c-9341-6a1dbc8d5a9e","children":["f10938ac-6b00-4249-a3ae-f60a87f7f262"],"playheadPosition":1,"activeLayerIndex":0},{"classname":"Layer","identifier":null,"name":"Layer","uuid":"f10938ac-6b00-4249-a3ae-f60a87f7f262","children":["6f1dc70e-b815-4d36-97d7-0372fb7a3de4","a7344f6b-fce3-43a4-97da-5be44c9ecdda","4b5266a3-8ebd-4d2c-931b-56e0fe2f1a6f"],"locked":false,"hidden":false,"opacity":1},{"classname":"Frame","identifier":null,"name":null,"uuid":"6f1dc70e-b815-4d36-97d7-0372fb7a3de4","children":["d022c557-9a8e-4fc4-9e53-dd011f845161","4021db46-ac09-4f30-8964-13a3135c18c7","f1509932-0840-40b7-b966-f274af4d1d18"],"scripts":[{"name":"default","src":""}],"cursor":"default","start":1,"end":1,"sound":null,"soundVolume":1,"soundLoop":false,"soundStart":0,"originalLayerIndex":0},{"classname":"Frame","identifier":null,"name":null,"uuid":"a7344f6b-fce3-43a4-97da-5be44c9ecdda","children":["3bcea6fd-7725-49cc-ad78-65e7809d38e1","6de9202c-f31c-44cd-8114-d5a6c06e106e","587acb5b-f94a-4806-9c2d-c13051809752","f605f648-d367-407d-b056-3474de566c34"],"scripts":[{"name":"default","src":""}],"cursor":"default","start":2,"end":2,"sound":null,"soundVolume":1,"soundLoop":false,"soundStart":0,"originalLayerIndex":0},{"classname":"Frame","identifier":null,"name":null,"uuid":"4b5266a3-8ebd-4d2c-931b-56e0fe2f1a6f","children":[],"scripts":[{"name":"default","src":""}],"cursor":"default","start":3,"end":3,"sound":null,"soundVolume":1,"soundLoop":false,"soundStart":0,"originalLayerIndex":0},{"classname":"Path","identifier":null,"name":null,"uuid":"d022c557-9a8e-4fc4-9e53-dd011f845161","children":[],"json":["Path",{"applyMatrix":true,"segments":[[-360,240],[-360,-240],[360,-240],[360,240]],"closed":true,"fillColor":[0.2902,0.56471,0.88627,0.19],"strokeColor":[0,0,0]}],"fontStyle":"normal","fontWeight":400},{"classname":"Path","identifier":null,"name":null,"uuid":"4021db46-ac09-4f30-8964-13a3135c18c7","children":[],"json":["Path",{"applyMatrix":true,"segments":[[0,-37.5],[0,37.5]],"strokeColor":[0,0,0]}],"fontStyle":"normal","fontWeight":400},{"classname":"Path","identifier":null,"name":null,"uuid":"f1509932-0840-40b7-b966-f274af4d1d18","children":[],"json":["Path",{"applyMatrix":true,"segments":[[-37.5,0],[37.5,0]],"strokeColor":[0,0,0]}],"fontStyle":"normal","fontWeight":400},{"classname":"Path","identifier":null,"name":null,"uuid":"3bcea6fd-7725-49cc-ad78-65e7809d38e1","children":[],"json":["Path",{"applyMatrix":true,"segments":[[-10000,-240],[-10000,-10000],[10000,-10000],[10000,-240]],"closed":true,"fillColor":[0,0,0],"strokeColor":[0,0,0],"strokeWidth":0}],"fontStyle":"normal","fontWeight":400},{"classname":"Path","identifier":null,"name":null,"uuid":"6de9202c-f31c-44cd-8114-d5a6c06e106e","children":[],"json":["Path",{"applyMatrix":true,"segments":[[-10000,10000],[-10000,240],[10000,240],[10000,10000]],"closed":true,"fillColor":[0,0,0],"strokeColor":[0,0,0],"strokeWidth":0}],"fontStyle":"normal","fontWeight":400},{"classname":"Path","identifier":null,"name":null,"uuid":"587acb5b-f94a-4806-9c2d-c13051809752","children":[],"json":["Path",{"applyMatrix":true,"segments":[[-10000,10000],[-10000,-10000],[-360,-10000],[-360,10000]],"closed":true,"fillColor":[0,0,0],"strokeColor":[0,0,0],"strokeWidth":0}],"fontStyle":"normal","fontWeight":400},{"classname":"Path","identifier":null,"name":null,"uuid":"f605f648-d367-407d-b056-3474de566c34","children":[],"json":["Path",{"applyMatrix":true,"segments":[[360,10000],[360,-10000],[10000,-10000],[10000,10000]],"closed":true,"fillColor":[0,0,0],"strokeColor":[0,0,0],"strokeWidth":0}],"fontStyle":"normal","fontWeight":400}],"assets":[]}