Sign in to follow this  

Unable to save babylon playground when DOM manipulating

Recommended Posts

Edit: NEVERMIND, I checked noscript and that was blocking urls! I havn't had troubles saving before so didnt think of that!.
Here's the url if you want to see it in action!

Hi, I'm guessing this probably isn't a bug and is a security feature but I was creating a playground where I was projecting a world position to screenspace and then using css to position a div to make sure it was correct.

I couldn't find any information about unable to save a playground mentioning DOM manipulation.

Heres the code that is unable to save with the error  Unable to save your code. It may be too long.

var createScene = function () {

    // This creates a basic Babylon Scene object (non-mesh)
    var scene = new BABYLON.Scene(engine);

    // This creates and positions a free camera (non-mesh)
    var camera = new BABYLON.FreeCamera("camera1", new BABYLON.Vector3(0, 5, -10), scene);

    // This targets the camera to scene origin

    // This attaches the camera to the canvas
    camera.attachControl(canvas, true);

    // This creates a light, aiming 0,1,0 - to the sky (non-mesh)
    var light = new BABYLON.HemisphericLight("light1", new BABYLON.Vector3(0, 1, 0), scene);

    // Default intensity is 1. Let's dim the light a small amount
    light.intensity = 0.7;

    // Our built-in 'sphere' shape. Params: name, subdivs, size, scene
    var sphere = BABYLON.Mesh.CreateSphere("sphere1", 16, 2, scene);

    // Move the sphere upward 1/2 its height
    sphere.position.y = 1;

    // Our built-in 'ground' shape. Params: name, width, depth, subdivs, scene
    var ground = BABYLON.Mesh.CreateGround("ground1", 6, 6, 2, scene);

    var time = 0;

    var blob = document.getElementById("blobby");
    var canvasZone = document.getElementById("canvasZone"); = "relative";

if ( !blob ) {
    blob = document.createElement("div"); = "absolute"; = "red"; = "0"; = "0"; = "5px"; = "5px"; = "blobby"; = 10000000;


    scene.afterRender = function() {
        time += 1 / 120;

        sphere.position.x = 0 + 20 * Math.sin( time );

        var scene = sphere.getScene();
        var cameraViewport = camera.viewport;

        let projectedVector = BABYLON.Vector3.Project(  sphere.position, 
                                                        cameraViewport );
        const width = canvasZone.offsetWidth;
        const height = canvasZone.offsetHeight; = (width * projectedVector.x) + "px"; = (height * projectedVector.y) + "px";

    return scene;


Share this post

Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this  

  • Recently Browsing   0 members

    No registered users viewing this page.