Scene neither loading on Sandbox nor on index.html file

[Abdullah]

Helloo Everyone... I am new to BabylonJS. 
but unfortunately my experience is not getting very good..
i m trying to load my .babylon file in Sandbox or in Visual Studio index.html file. 
but i m not getting any results. when i am trying to load in Sandbox i m getting errors shown in the image attached below.

Anyhow i have added the MIME types in Web Config file in Visual Studio. Any help will be appreciated. 

Thanx

[Wingnut]

Hi Abdullah, welcome to the forum, and sorry to hear you are having problems.

I think I have seen this problem before, and it is caused by NOT having access to the BABYLON Materials Library.  I am going to request some assistance from @davrous for this... perhaps he has some advice.  Meantime, check this list...

https://github.com/BabylonJS/Babylon.js/tree/master/materialsLibrary/dist

If you are using any of those materials in your project, try including their JS files... via <script> elements... in the same way as you include babylon.js, hand.js, etc.  I think those material JS files need to be "included" into your project (if used on a material).

http://doc.babylonjs.com/tutorials/How_to_create_a_material_for_materialsLibrary#update-the-test-page
  See the...

<script src="../dist/babylon.diffuseEmissiveMaterial.js"></script>

 

When we work with these fancy materials in our playground, the materials library files are automatically included.  But in non-playground scenes, you will need to manually include any library materials that you use in your scene.  Not sure about Materials Library => Sandbox.  Perhaps Davrous will have some words about that.

No promises, but it is worth trying.  Hope this helps.  Please report results, thanks.  Be well.

[Abdullah]

Thanks for your reply...  I hope it will work for me.. 
Anyhow i will surely notify you with the results.. 

 

[Abdullah]

Actually i guess i forget to tell you something that i have .babylon files exported from Blender. And want to use that meshes in my scene.
So are above mentioned guidelines also for them??? 

And if i want to work with keyboard inputs ..is there also any library for them??? Because inputs are also not working.. i am trying the same code of inputs as shown in playground but it isn't working. 

i need help on early basis... @Wingnut 
So it will be good for me if you do some help as soon as possible. 

Thanks, Be well

[JCPalmer]

When you selected your .babylon for the sandbox, you selected ball.png as well. right?  It is never going to work without that.

[Wingnut]

Thx JC.  But with failed material texture load, won't it fall-back to checkerboard texture?  Maybe not, for Sandbox.

Or is ball.png a refmap used in a shader?  Maybe no fallback to checkerboard for failed shader refmaps.  But... hmm... should be.

Abdullah... does the scene have good light?  Good camera?  Inputs should activate automatically, I think.  Make sure you have attached the camera to the canvas.

ANY mesh seen?  Does scene.meshes have length (in your home version)?  You could iterate through all scene.meshes and set each mesh.showBoundingBox = true;  *shrug*  Just some ideas. 

But JC is correct, I think.  First step... get ball.png to load with scene.

[Abdullah]

yeah, @JCPalmer i m also selecting .PNG files.

but i have also tried without any texture. it Means i am not using any texture. just a simple .babylon file. 

And @Wingnut if you are saying about camera then i don't think that's a problem. but i will surely recheck it.  

Anyhow i have downloaded the import meshes file from playgorund and then run it on my PC. And it was giving the same result as was on playgorund. but then i loaded my .babylon file in the code and run it again but my meshes were not showing. 

so i guess it is the problem of .babylon file.

 

[JCPalmer]

I think we will need more than just a picture of a console log.  An export log file, .blend, or .babylon.  I doubt this has anything to a missing materials library, since you cannot directly cause the need for one using the Blender JSON exporter.

Probably not even Blender related as well.  I assume you can run the demo scenes on this machine.  Something looks wrong with that screen shot.  Sandbox has sceneloader logging turned on.  Here is Sandbox with on of my test scenes.  It errors, because of a missing sound file, but clearly shows the .babylon producer tag info before doing anything.

[Abdullah]

These are one of my exported files from Blender attached below... @JCPalmer And there Blender files are also attached.

Kindly have a look on it. And reply me if it is ok or not...?

Thanks.. 

Bouncing Ball.babylon

racket2.babylon

racket2.blend

Bouncing Ball.blend

[JCPalmer]

There is no producer tag in .babylon files.  Your exporter is way out of date.  I exported ball from blend.  It made no textures & loaded in sandbox fine (though it failed to produce a scene loader audit trail).

Same thing with racket, except you only get a black scene.  Probably a light issue.

 

Change to 5.0.7 exporter.  Good luck.

 

[Abdullah]

Thanks @JCPalmer.. 
kindly do me a favor.. 
is the exporter in link below you are talking about??

 

https://github.com/BabylonJS/Babylon.js/blob/master/Exporters/Blender/Blender2Babylon-5.0.zip

[JCPalmer]

Yes click down load link.  Blender takes .zip files, so no need to expand yourself.

[Abdullah]

@JCPalmer Sorry for disturbing you again and again. 

but I have downloaded the .zip file and placed it in the addons. 

But in Blender user preferences i did'nt find the babylon import export..
 

[gryff]

@Abdullah : I would not bother trying to put the zip file in the Blender "addons" directory.

Just open Blender then: File -> User Preferences -> Install From File. Activate the new addon, then "Save User Settings"

If I have older versions I usually remove those first.

as @JCPalmer : says above - no need to unzip the files - Blender will handle it

cheers, gryff

[Abdullah]

Thanks alot @JCPalmer, @Wingnut and @gryff... 

it is woking fine now.. 

hope you guys will not mind if i disturb you for more help in future. 

Thanks again.. 

Be Well all of you

[Abdullah]

Guys what if my mesh is showing very small when i load in index.html. 
And it is fine when i load in sandbox.. ????? 

Code is below. And mesh and blender file is also attached.

 

indexx.html

Table.babylon

 

Table.blend

[gryff]

@Abdullah : Well in the Sandbox you are probably using the camera defined in the .babylon file (the one that comes from Blender) whereas in your index file you are using a camera you define - and it is a long way from your table.

Try this instead:

var camera = new BABYLON.ArcRotateCamera("Camera", 0, 0.8, 10, BABYLON.Vector3.Zero(), scene);

Also if you want to change the size of the table use:

table.scaling = new BABYLON.Vector3(34, 34, 34);

You are also making the light follow the camera - better to use: 

light.parent = camera;

As the "scene.registerBeforeRender" function will be called before every frame.

And finally, the normals of your table mesh are screwed up - particularly the table legs. Recalculate Normal Outside in Blender.

cheers, gryff

 

 

 

[Abdullah]

thanx @gryff...
let me try these changes..

[Abdullah]

i want to add a constant velocity to my ball. And when it touch any racket then on some key event i should be able to increase or decrease the velocity of the ball.. 

Any help please????

@gryff @Wingnut @JCPalmer

 

[Wingnut]

Hi A!  This is quite simple.

http://www.babylonjs-playground.com/#UP2O8#41

I will leave you to do keypress events, and adjustments to directionAndMagnitude variable.  You can see that variable used in animation function line 30.  Our addInPlace() is a wonderful feature for doing... vector3 + vector3  .

Continuing the tour... you can easily see the impact and clear handlers in lines 37-52.

Lines 54-72 are actionManager code.  There are enter and exit intersect triggers that are registered on both paddles (racquets).  There are also executeCode actions that target the onImpact(meshEvent) and onClear(meshEvent) handler functions.  Notice that the meshEvent is sent to the handler functions... automatically.  (Thanks to Deltakosh making it so.) 

I use data from the meshEvent object... in lines 40, 41, 49, 50.   It is handy.   A reference to sphere might be stored on it, but I didn't feel like looking for it. 

Instead, I did a direct ref to "sphere" in lines 44 and 51.   I would have rather used meshEvent.intersectingMesh.scaling, and not sphere.scaling. 

Perhaps I have more things to learn and/or contributions to make to BJS framework. 

Try to learn to use your browser F12 dev tools object inspector feature... and it will be easy to view all the data (arriving at the handlers) on the meshEvent object.  Using object inspectors is a fast-track to learning. 

Most times, you can simply do console.log(meshEvent)... and then open your dev tools JS console, and click on the word "OBJECT".  It should open your browser object inspector.

Hope this helps.  Use playground search, docs search, and forum search to find information and demos about 'keypress'.  Good luck!   Be patient with yourself. 

[Abdullah]

thanx @Wingnut... 

i think i have'nt told you everything. Actually i know how to add key events and i have also added some in my code.

actually i don't want to move the ball just right .. i want to move the ball like a table tennis ball. i have applied physics imposter on my sphere ball .. and i have set linear velocity .  

and my actual question is that i want to move the ball continuously with linear velocity untill i press some key and decrease or increase its velocity. 

actually i want that when ball touch racket then a force should apply on ball which will have increase or decrease  speed . and i want to do it like that  

when ball touches racket a key will be pressed which will add or sub velocity of the ball by some factor may be constant. and if key is not pressed then ball should with the speed it was moving before. 

So kindly inform me if you understand my question and have any solution.

anyhow i have used applyimpulse. but i guess i have not used ot correctly. 

[Wingnut]

Hi again.  Ok, let's call it "boost" (speed increase) and "brake" (speed decrease). 

Although I do not know how to do it, you could increase/decrease the paddle restitution value.

Somewhere global, set var paddleDefaultRestitution = 0.9);  Also make sure both your paddles have initial restitution of 0.9

Now... inside that render loop...

// paddle 1 boost/brake/normal
if (paddle1BoostKeyPressed) { paddle1.impostor.setRestitution(paddleDefaultRestitution + .3) }  // boost
else if (paddle1BrakeKeyPressed) { paddle1.impostor.setRestitution(paddleDefaultRestitution - .3) }  // brake
else { paddle1.impostor.setRestitution(paddleDefaultRestitution) }  // return to normal restitution

// paddle 2 boost/brake/normal
if (paddle2BoostKeyPressed) { paddle2.impostor.setRestitution(paddleDefaultRestitution + .3) }  // boost
else if (paddle2BrakeKeyPressed) { paddle2.impostor.setRestitution(paddleDefaultRestitution - .3) }  // brake
else { paddle2.impostor.setRestitution(paddleDefaultRestitution) }  // return to normal restitution

I do not know if there is a .setRestitution() function in OimoJS or CannonJS.  I'm sure there is... but you will need to study their API's to learn how to change an impostor's restitution "on the fly".  Maybe others will comment and tell us how to do it.

But, do you understand the "theory", here?  I hope so.  We don't change the ball speed.  Instead, we make the paddles more/less "bounce-powerful".  This is a signal to the physics engine... to change the bounce-off-the-paddle speed.  This is just an idea... not a very good one.  

The "paddle-swapping" and "impostor-swapping" ideas... further below... might be easier/wiser. 

Adjusting ball.linearVelocity for boost and brake IS possible, but difficult.  You MUST wait for the ball to impact the paddle FIRST, and then boost or brake.  If you apply boost or brake at the same time as impact happens, the ball may go THROUGH the paddle, or get stuck IN the paddle.  It is because you have confused the physics engine.  It is best to allow the physics engine to freely calculate its own velocities.

I have a little helper idea.  If you make THREE paddle1's and THREE paddle2's... you could swap them out when the keys are pressed. 

So, you would have 6 paddles.  Paddle1 and paddle2 with weak restitution, paddle1 and paddle2 with normal restitution, and paddle1 and paddle2 with powerful restitution.  Secretly change the paddles... QUICKLY, depending upon which keys are pressed.  *shrug*.  You could also quickly re-create the physicsImpostor (with different restitution value) for a paddle... upon key presses. 

The render loop code will be somewhat the same as shown above.  Instead of changing the restitution, you would change-out the paddles or change-out the physics impostors.  Use the same if-then-else render loop structure... just use different { actions }. 

I'm not a pro.  I could have said wrong things.  I am only a hobby-level BJS user.

These are some ideas... not necessarily GOOD ideas.     Perhaps others will comment with better wisdom.  Good luck, stay in touch. 

[Abdullah]

thanx alot @Wingnut...

Surely i will try your tricks and will stay in touch...  

[Abdullah]

Helloo Everyone.. 
i am stuck on the collision.

i want to increase or decrease the speed of ball when it collides with racquet. 

i am sharing my code. in which sphere is my ball and r1 and r2 are the raquets. 
 

r1 moving keys are  UHJK and for r2 are WASD. So kindly have a look and guide me please. 

@Wingnut @gryff @JCPalmer

Thanks

Babylon.rar

[Wingnut]

Hi A.  Okay, into the playground we go. 

http://playground.babylonjs.com/#2H9MHN#2

I hope you don't mind my temporary-publishing of racket2 and racket3 files.  You could do the same.  Free github accounts are easy to get.  With my free account, I created a folder named 'misc' and I can drag-and-drop files into it (be sure to hit commit button at bottom of github page, after drag-drop). 

You can do the same, if you wish.  Do not create the 'master' folder inside 'misc'... but still use /master in the path, just like I did.

ANYWAY, I removed all .checkCollisions.  Those are ONLY for BabylonJS built-in colliders/ellipsoids, and not used with physics engines.

Also, I temporarily disabled your textures... no big deal.

See that "function" at the end of line 78?  Sometimes that is called a callback function.  Notice that I put the entire racket3 loader... inside the callback function of racket2 loader?  Strange, huh?  I finish BOTH callback functions...  in lines 104 - 105.

Notice in the #1 version of this playground, I did not do that.  In the #2 version, I was TRYING to stop some "r1 is undefined" and "r2 is undefined" console errors.  Those errors happen when WASD keys are pressed, or when UHJK keys are pressed.  I don't know why that is happening.  Perhaps others will help us.

In summary, you have some physics impacts happening, here.  Good, eh?  The scene is working... a little bit.   

This scene is small sized.  The .radius value in camera line 5... is only 10 units.  It might be wise to make the table and racquets larger.  Physics engines work better... with larger mesh.  I think you should make the table/racquets 5-10 times larger.

Abdullah, will you be using Q and E keys = boost/brake for r2, and Y and I keys = boost/brake for r1? 

Perhaps something like (in semi-pseudo code)...

if (keypress === E) {  // increase restitution
   r2.physicsImpostor = new BABYLON.PhysicsImpostor(r2, BABYLON.PhysicsImpostor.BoxImpostor, { mass: 0, restitution: 1.0 }, scene);
}

if (keypress === Q) {  // decrease restitution
   r2.physicsImpostor = new BABYLON.PhysicsImpostor(r2, BABYLON.PhysicsImpostor.BoxImpostor, { mass: 0, restitution: 0.6 }, scene);
}

Be sure to set/return restitution to normal, if no boost or brake keys are pressed.

 r2.physicsImpostor = new BABYLON.PhysicsImpostor(r2, BABYLON.PhysicsImpostor.BoxImpostor, { mass: 0, restitution: 0.8 }, scene);

Okay, all this should help, somewhat.  What you are trying to do... can be difficult.  Physics engines can be can be difficult to control.

If you wish to make your physics impostors PERFECTLY "fit" your racquets, you will need to use the CannonJS physics engine, and use MeshImpostor.  OimoJS does NOT currently have a MeshImposter available.  But, so far, your Oimo BoxImpostors are working quite well.

Good luck, have fun, be well.

Forum friends, can you help us with the r1/r2 undefined errors... in the keypresses?  It is a JS scope issue.  r1 and r2 are globalized variables, but possibly incorrectly globalized.  Thanks!