YouTube iframe integration problems

Help & Support
1

Hallo Yaustar,

thanks for the great ‘YouTubed in 3D Scenes’,untill now I’ve opend my YouTube Tutorials in an extra browser tabs. Your design looks so much better :tv:

I’ve tried to implent it in my game: Cinema When I click on the plane the sound starts, but the viedeo didn’t show. I’ve tried different cams and planes, but nothing works. Sorry but I’m not clever enough to understand Your code fully :frowning: .
I’ve tried high and low resolution PixelperUnit, becouse my plane is 15 times larger, my thought to make it 15 times smaller? Is this how it should work? I’m verry grateful for any hind

:cucumber:

2

Several things:

  • The camera clear colour needs to be transparent
  • The canvas needs to be transparent in project settings
  • Remove the camera on the root entity
  • Make sure the plane is facing the correct direction

Fixed version: https://playcanvas.com/editor/scene/1065710

1 Like
3

Thank You so much :star_struck:

Transparence on camera and turning plane I’ve tried, and the camera on the maybe a left over from testing something, but the trancparence of the camera seams to be the orignial problem and than I’ve managed to make things worse…

gradefully
:cucumber:

4

Just updated the YT - iframe script and got follwing error:
Uncaught NotFoundError: Failed to execute ‘removeChild’ on ‘Node’: The node to be removed is not a child of this node.

Error: Failed to execute ‘removeChild’ on ‘Node’:
The node to be removed is not a child of this node. at Css3Plane.disable (https://launch.playcanvas.com/api/assets/files/scripts/Shops/Cinema/iframePlane.js?id=40680501&branchId=cf68c3b8-63cc-4b4d-930f-474a380e483d:357:32)

tried to connect dom with cameraelement but nothing works, much to sophisticated for a dummy like me. Any hint as always verry welcome…

error occurs when leaving the cinema through the emergency escape door

Cinema

5

I just met the same problem while switching scenes which contains iFrame planes(I am using two iFrame planes which might cause the issue).

Error:

[css3-renderer.js?id=83981472&branchId=7ea11be6-f826-4eef-a7a5-523e9fffe371:308]: Uncaught NotFoundError: Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node.

Error: Failed to execute 'removeChild' on 'Node': The node to be removed is not a child of this node.
    at Css3Plane.disable (https://launch.playcanvas.com/api/assets/files/Scripts/css3-renderer.js?id=83981472&branchId=7ea11be6-f826-4eef-a7a5-523e9fffe371:308:32)
    at i. (https://launch.playcanvas.com/api/assets/files/Scripts/IframePlane.js?id=83983828&branchId=7ea11be6-f826-4eef-a7a5-523e9fffe371:38:25)
    at e.fire (https://launch.playcanvas.com/editor/scene/js/engine/playcanvas.min.js?version=1.54.1:6:11491)
    at i.destroy (https://launch.playcanvas.com/editor/scene/js/engine/playcanvas.min.js?version=1.54.1:6:602510)
    at i._onBeforeRemove (https://launch.playcanvas.com/editor/scene/js/engine/playcanvas.min.js?version=1.54.1:6:598394)

The code that caused the error:

        disable: function () {
            this.cameraElement.removeChild(this.dom);
            this._renderer.removeTarget(this); 
        },
6

I fixed the original project here: PlayCanvas 3D HTML5 Game Engine

Turns out the disable event is fired as part of the destroy process so it was trying to remove the DOM element twice so I’ve just removed the destroy callback.

2 Likes