Using Javascript from SpiderBasic
falsam
 
Posts: 263
Joined: Mon May 05, 2014 9:49 pm
Location: France

Babylon.js

by falsam Fri May 12, 2017 7:37 pm

Image

Babylon.sbi is a module coded with theSpiderBasic language that provides simplified access to the framework javascript 3D babylonjs.com created by David Catuhe and David Rousset, two web engineers at Microsoft.

Sources and examples on the GitHub platform.
:arrow: https://github.com/falsam/BJS

■ Structure of your folder.
Babylon A folder containing the interfaces with the Babylon.js framework (do not change the name).
sbbjs Folder containing the babylon.custom.js framework that will be exported when creating your application
Data Optional folder that will contain your textures, sound, etc ....
Code.sb Your code. (See examples 00-template.sb)

■ Example
Code: Select all
;Babylon.sbi - Basic Scene
EnableExplicit
 
IncludeFile "babylon/babylon.sbi"
 
Global Camera, Light, Plane, Sphere, Cylinder, Cube, Torus
 
Declare LoadGame()
Declare RenderGame()
 
UseModule BJS
 
InitEngine(@LoadGame())
 
Procedure LoadGame()   
  If CreateScene()
 
    ;Camera & Light
    Camera  = CreateCamera("camera", 0, 5, 7, #ArcRotate)
    Light   = CreateLight("light", 0, 10, 0)
 
    ;Objects (Plane, Sphere, ....)
    Plane   = CreateGround("plane", 10, 10)
    Sphere  = CreateSphere("sphere", 2)
    MoveMesh(Sphere, 0, 2, 0)
 
    Cylinder= CreateCylinder("cylinder", 2, 2, 2)
    MoveMesh(Cylinder, 3, 1, -2)
 
    Cube = CreateBox("cube", 2)
    MoveMesh(Cube, -3, 1, -2)
 
    Torus = CreateTorus("torus", 2, 1)
    MoveMesh(Torus, -2, 0.5, 2)
 
    RenderLoop(@RenderGame())
  EndIf
EndProcedure
 
Procedure RenderGame()
  RenderWorld()
EndProcedure
Result
Image

■ ShowCase
Water http://falsam.com/sbbjs/water.html (Use the mouse to explore the scene)
Music http://falsam.com/sbbjs/music.html
particle http://falsam.com/sbbjs/particle.html

■ In french : http://falsam.com/sbbjs/wiki/doku.php?id=babylon
Last edited by falsam on Fri Jan 19, 2018 2:06 pm, edited 1 time in total.

➽ Windows 10 - JDK 1.8 - SB 2.20 - Android 5.5
http://falsam.com

Sorry for my poor english
plouf
 
Posts: 34
Joined: Tue Feb 25, 2014 6:01 pm

Re: Babylon.js

by plouf Fri May 12, 2017 10:33 pm

Hey nice work ;)

showcase test
firefox x64 v53.0 opera 44 /chrome IE 11
water nice cloud compelte black water nothing all corect
music some sound but objects fall outside ground nothing correct image no sound at all
particle i guess its ok nothing i guess its ok


note that have found several problems in SB demos as well, and only perfect working under explorer
falsam
 
Posts: 263
Joined: Mon May 05, 2014 9:49 pm
Location: France

Re: Babylon.js

by falsam Fri May 12, 2017 10:47 pm

Thanks for your feedback.

I forgot to test the examples with Firefox and Edge.

With Edge it's a disaster. The lag is important and the scene is frozen.

With Firefox, some sound wav do not work.

Chrome no problem.

➽ Windows 10 - JDK 1.8 - SB 2.20 - Android 5.5
http://falsam.com

Sorry for my poor english
plouf
 
Posts: 34
Joined: Tue Feb 25, 2014 6:01 pm

Re: Babylon.js

by plouf Sat May 13, 2017 6:22 am

here with chrome 58.0.3029.81 (64-bit) (and opera)

i see NOTHING but the background in ALL
User avatar
Peter
 
Posts: 497
Joined: Mon Feb 24, 2014 10:17 pm
Location: 127.0.0.1

Re: Babylon.js

by Peter Sat May 13, 2017 9:01 am

@falsam: Image

Here (on Chrome and Firefox): no problems.

Greetings ... Peter
falsam
 
Posts: 263
Joined: Mon May 05, 2014 9:49 pm
Location: France

Re: Babylon.js

by falsam Sat May 13, 2017 12:56 pm

Thanks Peter ^-^

➽ Windows 10 - JDK 1.8 - SB 2.20 - Android 5.5
http://falsam.com

Sorry for my poor english
HPW
 
Posts: 19
Joined: Thu May 04, 2017 4:25 pm

Re: Babylon.js

by HPW Sat May 13, 2017 2:16 pm

Hello,

Very nice and interesting stuff.
Is it possible to mix a Babylon-Scene with spiderbasic GUI-elements?

Regards
falsam
 
Posts: 263
Joined: Mon May 05, 2014 9:49 pm
Location: France

Re: Babylon.js

by falsam Sat May 13, 2017 10:07 pm

HPW wrote:Is it possible to mix a Babylon-Scene with spiderbasic GUI-elements?
Yes if a window and a canvasgadget (option #transparent) are created.
Code: Select all
;Babylon Rendering (OPTION #PB_Canvas_Transparent)
CanvasGadget(#mfRender, 260, 25, 400, 300, #PB_Canvas_Transparent)
And InitEngine with your canvas
Code: Select all
InitEngine(@LoadGame(), #mfRender)

An example as soon as possible.
Last edited by falsam on Sat May 13, 2017 10:43 pm, edited 1 time in total.

➽ Windows 10 - JDK 1.8 - SB 2.20 - Android 5.5
http://falsam.com

Sorry for my poor english
falsam
 
Posts: 263
Joined: Mon May 05, 2014 9:49 pm
Location: France

Re: Babylon.js

by falsam Sat May 13, 2017 10:25 pm

Babylon.sbi 0.86 is done

-Add : Example 15-Canvas.sb Demo http://falsam.com/sbbjs/canvas.html
-Bug fix Camera.

Download https://github.com/falsam/BJS/archive/master.zip

➽ Windows 10 - JDK 1.8 - SB 2.20 - Android 5.5
http://falsam.com

Sorry for my poor english
HPW
 
Posts: 19
Joined: Thu May 04, 2017 4:25 pm

Re: Babylon.js

by HPW Sun May 14, 2017 5:38 am

Hello,

Thanks for the quick Response and the update with sample.
I will have a look later.

Regards
Return to Javascript

Who is online

Users browsing this forum: No registered users and 2 guests