AnimatedModel.play?

Questions
21

Any error on the console?

22

There is ZERO error on the console, please look at my whole html code again thanks.

23

Trying to put your code after the canvas tag

<body onLoad="init()">
<canvas id="my_canvas"></canvas>
<script>
var canvas_id; var engine; var scene; var camera; var light;

function init()
{
	setup_Babylon_Scene();
}

function setup_Babylon_Scene()
{
	canvas_id = document.getElementById("my_canvas");
	engine = new BABYLON.Engine(canvas_id, true);
	scene = new BABYLON.Scene(engine);
    
    	camera = new BABYLON.ArcRotateCamera("Camera1",0,0,5,BABYLON.Vector3.Zero(),scene);
	camera.attachControl(canvas_id); //Default controls enabled.
	
	light = new BABYLON.PointLight("Light1", new BABYLON.Vector3(-20,30,-20),scene);
	
	BABYLON.SceneLoader.ImportMesh("","","skinned_model.babylon",scene, model_1_completed);

	engine.runRenderLoop(onEnterFrame);
	window.addEventListener("resize",function(){engine.resize();});
	scene.debugLayer.show();
}

function model_1_completed(newMeshes, particleSystems, skeletons)
{
	console.log("Model_Loaded");
}

function onEnterFrame()
{
       scene.render();

}
</script>
24

As per your advise, this is the new code, again, no inspector [omg the forum messed up my html code again…how am I ever going to ask a decent question if this keeps on happening ?]:

<html>
<head>
<meta charset = "UTF-8">
<title>Show Inspector</title>
<style type="text/css">
html, body
{
	margin:0;
	padding:0;
	width:100%;
	height:100%;
	overflow:hidden;
	background-color: #000000;
}

#my_canvas
{
	width:100%;
	height:100%;
	touch-action:none;
}
</style>

<script src="babylon.js"></script>
<script src="babylon.inspector.bundle.js"></script>


</head>
<body onLoad="init()">
<canvas id="my_canvas"></canvas>
<script>
var canvas_id; var engine; var scene; var camera; var light;

function init()
{
	setup_Babylon_Scene();
}

function setup_Babylon_Scene()
{
	canvas_id = document.getElementById("my_canvas");
	engine = new BABYLON.Engine(canvas_id, true);
	scene = new BABYLON.Scene(engine);
    
    	camera = new BABYLON.ArcRotateCamera("Camera1",0,0,5,BABYLON.Vector3.Zero(),scene);
	camera.attachControl(canvas_id); //Default controls enabled.
	
	light = new BABYLON.PointLight("Light1", new BABYLON.Vector3(-20,30,-20),scene);
	
	BABYLON.SceneLoader.ImportMesh("","","SNU_Idled.babylon",scene, model_1_completed);

	engine.runRenderLoop(onEnterFrame);
	window.addEventListener("resize",function(){engine.resize();});
	scene.debugLayer.show();
}

function model_1_completed(newMeshes, particleSystems, skeletons)
{
	console.log("Model_Loaded");
}

function onEnterFrame()
{
       scene.render();
}
</script>
</body>
</html>```
25

Serioulsy…can you calm down?

To get your code formatted correctly please use ``` before and after your code (I edited the first one)

26

Thanks ! Now you can see my full stripped down no nonsense doesn’t even have a material setup straight to the point code now.
The inspector is not showing, what’s wrong ?

27

You have made a mistake somewhere. The inspector works at home, as well as the PG.
You have a link so that I can see your complete page.
Or do you have a link to see it live.

28

I have pasted my whole html code there.
It works, the model loads, but no inspector, please scroll up to see the whole thing.

29

Check the content of your .js files because this code works (only changed the script src targets:

<html>

<head>
    <meta charset="UTF-8">
    <title>Show Inspector</title>
    <style type="text/css">
        html,
        body {
            margin: 0;
            padding: 0;
            width: 100%;
            height: 100%;
            overflow: hidden;
            background-color: #000000;
        }

        #my_canvas {
            width: 100%;
            height: 100%;
            touch-action: none;
        }
    </style>

    <script src="https://preview.babylonjs.com/babylon.js"></script>
    <script src="https://preview.babylonjs.com/inspector/babylon.inspector.bundle.js"></script>

    <script>
        var canvas_id; var engine; var scene; var camera; var light;

        function init() {
            setup_Babylon_Scene();
        }

        function setup_Babylon_Scene() {
            canvas_id = document.getElementById("my_canvas");
            engine = new BABYLON.Engine(canvas_id, true);
            scene = new BABYLON.Scene(engine);

            camera = new BABYLON.ArcRotateCamera("Camera1", 0, 0, 5, BABYLON.Vector3.Zero(), scene);
            camera.attachControl(canvas_id); //Default controls enabled.

            light = new BABYLON.PointLight("Light1", new BABYLON.Vector3(-20, 30, -20), scene);

            BABYLON.SceneLoader.ImportMesh("", "", "skinned_model.babylon", scene, model_1_completed);

            engine.runRenderLoop(onEnterFrame);
            window.addEventListener("resize", function() { engine.resize(); });
            scene.debugLayer.show();
        }

        function model_1_completed(newMeshes, particleSystems, skeletons) {
            console.log("Model_Loaded");
        }

        function onEnterFrame() {
            scene.render();

        }
    </script>
</head>

<body onLoad="init()">
    <canvas id="my_canvas"></canvas>
</body>

</html>
30

Are you sure you have downloaded this file?

babylon.inspector.bundle.js

31

What the hell, why would changing:

<script src="babylon.js"></script>
<script src="babylon.inspector.bundle.js"></script>

to

<script src="https://preview.babylonjs.com/babylon.js"></script>
<script src="https://preview.babylonjs.com/inspector/babylon.inspector.bundle.js"></script>

Magically made it work ?!!
Both of my files are in the same folder !
I…I don’t understand !

32

It would be nice to avoid telling us to read your code, to scroll … We are not stupid.

Trying to be nicer. We try to help you.

1 Like
33

Sorry, just a little frustrated.

I re downloaded “babylon.inspector.bundle.js” and change the script tag back to:

<script src="babylon.js"></script>
<script src="babylon.inspector.bundle.js"></script>

The model is loaded as usual…but the inspector just wouldn’t load !
Does babylon.inspector.bundle.js require some internet connection or something ? Why doesn’t it work locally ?

34

Pretty sure there is a problem with either the file itself or perhaps versions? Are they both on latest 4.0 alpha?

35

Yes, it requires an internet connection. This file calls another remote script.

36

There we go ! We caught the evil right there ! The documentation says that it can be loaded locally but it does sneaky remote script loading in the background that doesn’t actually make it load locally !
So…no local inspector after all.

37

Local, do not mean without internet connection

38

No this is wrong. It DOES NOT require ANYTHING else than the babylon.inspector.bundle.js

39

Last warning: either you cool down or I ban your account.

40

I figure out the bug, the bug is IN “babylon.js” !!!
I downloaded babylon.js from:

https://preview.babylonjs.com/babylon.js

and replace my own babylon.js and it works fine.

So now begs the question, what is wrong with my babylon.js ?
I can tell you now, I created the babylon.js by going to:
https://www.babylonjs.com/versionbuilder/
and checked ALL the checkbox and THEN download.
Looks like the babylon.js that contains ALL the checkboxes will cause the inspector to fail quietly without any error report !

Looks like the preview version is more stable than the stable one downloaded from the official site.