Babylon.js

Using Javascript from SpiderBasic
kofstreet
Posts: 1
Joined: Mon Jan 22, 2018 8:48 pm

mesh animate

Post by kofstreet »

Hi,

I'm new in Spiderbasic and want to start using it with 3d, my question is : mesh animating is available or not yet ?

Thanks
falsam
Posts: 280
Joined: Mon May 05, 2014 9:49 pm
Location: France
Contact:

Re: Babylon.js

Post by falsam »

Maybe in the next version of Babylon.sbi

Demo

■ Simple skeleton with 2 bones make with Blender 2.79

Image

:arrow: http://falsam.com/sbbjs/firstanimation.html

■ Dude

http://falsam.com/sbbjs/meshanimation.html

➽ Windows 11 - JDK 1.8 - SB 2.40 - Android 13
http://falsam.com

Sorry for my poor english
User avatar
T4r4ntul4
Posts: 132
Joined: Wed May 21, 2014 1:57 pm
Location: Netherlands
Contact:

Re: Babylon.js

Post by T4r4ntul4 »

I have a few requests:

- You can set the camera rotation with RotateCamera(), but you cant get the camera rotation with a function, for example: GetCamRotX(), GetCamRotY(), GetCamRotZ() or something similar.
- Same with a Mesh, you can use RotateMesh() but you cant get the mesh rotation with for example: GetMeshRotX(), GetMeshRotY(), GetMeshRotZ() or something similar.

I wanted to use WSAD keys to move the camera, i now use this piece of code: (but cant do that in SB BBjs) Maybe add a function that can do this with any key you specify?

Code: Select all

  !v_camera.keysUp.push(87); // W
  !v_camera.keysDown.push(83); // S
  !v_camera.keysLeft.push(65); // A
  !v_camera.keysRight.push(68); // D
Is it possible for you to add those functions?
falsam
Posts: 280
Joined: Mon May 05, 2014 9:49 pm
Location: France
Contact:

Re: Babylon.js

Post by falsam »

T4r4ntul4 wrote:I wanted to use WSAD keys to move the camera, i now use this piece of code: (but cant do that in SB BBjs) Maybe add a function that can do this with any key you specify?
This feature exists with the current version :

CameraMapKey(Camera, Key, Value = #PB_Ignore)

Example

Code: Select all

    ;Camera movement : Redefine the camera keys
    InitKey()
    
    CameraMapKey(Camera, #PB_Key_Left, #PB_Key_A)
    CameraMapKey(Camera, #PB_Key_Right, #PB_Key_D)
    CameraMapKey(Camera, #PB_Key_Up, #PB_Key_W)
    CameraMapKey(Camera, #PB_Key_Down, #PB_Key_S)
T4r4ntul4 wrote:I have a few requests: ....
Yes No problem and useful ^-^

For the moment I do not publish the modifications. I put the features in an example.

Get Meshes Rotation
- Value.f = GetMeshRotX(Mesh, Mode = #PB_Absolute)
- Value.f = GetMeshRotY(Mesh, Mode = #PB_Absolute)
- Value.f = GetMeshRotZ(Mesh, Mode = #PB_Absolute)

Get Camera Rotation
- Value.f = GetCameraRotX(Camera, Mode = #PB_Absolute)
- Value.f = GetCameraRotY(Camera, Mode = #PB_Absolute)
- Value.f = GetCameraRotZ(Camera, Mode = #PB_Absolute)

Mode :
- #PB_Absolute returns an angle in 0 and 359°
- #PB_Relative returns an infinite angle. Example : 720 (two 360 on himself)

Misc
- onMouseRelease(CallBack)

■ Test code with these features.
<- and -> keys for left and right rotation of the cube.
A D W S button for camera movement.
Click and move the mouse to rotate the camera.

Code: Select all

EnableExplicit

IncludeFile "babylon/babylon.sbi"

Global MouseDown, Scene, Camera, Material, Ground, Box

Declare LoadGame()
Declare MouseDown()
Declare MouseRelease()
Declare MouseMove()
Declare RenderGame()

;-Include 

;Private 
Procedure.f AngleRotation(Angle.f, Mode)
  Protected n
  
  If Mode = #PB_Absolute
    n = Angle / 360
    ProcedureReturn Angle - (360 * n)
  ElseIf Mode = #PB_Relative
    ProcedureReturn Angle
  Else
    ProcedureReturn -1
  EndIf 
EndProcedure

;Public
Procedure.f GetMeshRotX(Mesh, Mode = #PB_Absolute)
  Protected Angle.f, n
  
  !v_angle =  v_mesh.rotation.x * 180 / Math.PI
  n = Angle / 360
  
  ProcedureReturn Angle - (360 * n)
EndProcedure

Procedure.f GetMeshRotY(Mesh, Mode = #PB_Absolute)
  Protected Angle.f
  
  !v_angle =  v_mesh.rotation.y * 180 / Math.PI
  ProcedureReturn AngleRotation(Angle, Mode)  
EndProcedure

Procedure.f GetMeshRotZ(Mesh, Mode = #PB_Absolute)
  Protected Angle.f
  
  !v_angle =  v_mesh.rotation.z * 180 / Math.PI  
  ProcedureReturn AngleRotation(Angle, Mode)  
EndProcedure

Procedure.f GetCameraRotX(Camera, Mode = #PB_Absolute)
  Protected Angle.f 
  
  !v_angle = v_camera.rotation.x * 180 / Math.PI  
  ProcedureReturn AngleRotation(Angle, Mode)  
EndProcedure

Procedure.f GetCameraRotY(Camera, Mode = #PB_Absolute)
  Protected Angle.f 
  
  !v_angle = v_camera.rotation.y * 180 / Math.PI  
  ProcedureReturn AngleRotation(Angle, Mode)  
EndProcedure

Procedure.f GetCameraRotZ(Camera, Mode = #PB_Absolute)
  Protected Angle.f 
  
  !v_angle = v_camera.rotation.z * 180 / Math.PI  
  ProcedureReturn AngleRotation(Angle, Mode)  
EndProcedure


Procedure onMouseRelease(CallBack)
  !v_bjscurrentscene.onPointerUp = function (evt) {
  ! v_callback(evt)
  !}
EndProcedure

;-End Include
;-

UseModule BJS
InitEngine(@LoadGame())

Procedure LoadGame()    
  Scene = CreateScene()
  If Scene
    
    ;Light and camera
    CreateLight("Ambience", 0, 200, 0)
    
    Camera = CreateCamera("camera", 0, 10, -20, #BJS_Free)
    CameraLookAt(Camera, 0, 0, 0)
    CameraBodySize(Camera, 1, 5, 1)
    
    ;Camera movement : Redefine the camera keys
    InitKey()
    
    CameraMapKey(Camera, #PB_Key_Left, #PB_Key_A)
    CameraMapKey(Camera, #PB_Key_Right, #PB_Key_D)
    CameraMapKey(Camera, #PB_Key_Up, #PB_Key_W)
    CameraMapKey(Camera, #PB_Key_Down, #PB_Key_S)
    
    ;Ground
    Ground = CreateGround("ground", 100, 100)
    Material = CreateMaterial("Grass")
    SetMaterialTexture(Material, #BJS_Diffuse, LoadTexture("data/textures/grass.png"))
    ScaleMaterial(Material, 5, 5)
    SetMeshMaterial(Ground, Material)
    
    ;Box
    Box = CreateBox("My box", 4, 4, 4)
    Material = CreateMaterial("crate")
    SetMaterialTexture(Material, #BJS_Diffuse, LoadTexture("data/textures/crate.png"))
    SetMeshMaterial(Box, Material)
    MoveMesh(Box, 0, 2, 0)
    
    onMouseDown(@MouseDown())
    onMouseRelease(@MouseRelease())
    onMouseMove(@MouseMove())
    
    RenderLoop(@RenderGame())
  EndIf
EndProcedure

Procedure MouseDown()
  MouseDown = #True
EndProcedure

Procedure MouseRelease()
  MouseDown = #False  
EndProcedure

Procedure MouseMove()
  If MouseDown
    Debug "Camera Rotation (x / y) " +  StrF(GetCameraRotX(Camera), 2) + " / " + StrF(GetCameraRotY(Camera), 2) 
  EndIf
EndProcedure

Procedure RenderGame()
  If KeyPushed(#PB_Key_Left)
    RotateMesh(Box, 0, -2.5, 0, #PB_Relative)
    Debug "Mesh Rotation (Y) " + StrF(GetMeshRotY(Box), 2)
  EndIf
  
  
  If KeyPushed(#PB_Key_Right)
    RotateMesh(Box, 0, 2.5, 0, #PB_Relative)
    Debug "Mesh Rotation (Y) " + StrF(GetMeshRotY(Box), 2)
  EndIf
  
  RenderWorld() 
EndProcedure
If you agree with this test, I modify babylon.sbi and release the new version.

➽ Windows 11 - JDK 1.8 - SB 2.40 - Android 13
http://falsam.com

Sorry for my poor english
User avatar
T4r4ntul4
Posts: 132
Joined: Wed May 21, 2014 1:57 pm
Location: Netherlands
Contact:

Re: Babylon.js

Post by T4r4ntul4 »

Ah, i didnt know CameraMapKey() was for that.

I tested your code and it seems working perfectly! :D
HPW
Posts: 35
Joined: Thu May 04, 2017 4:25 pm

Re: Babylon.js

Post by HPW »

Hello falsam,

Downloaded the last Version and get an error in "15-Canvas.sb"

This:

ImportScene("car", "data/Ferrari/", "ferrari.obj", @OnLoad())

should be:

ImportScene("car", "data/Ferrari/ferrari.obj", @OnLoad())
and:
ImportScene("fordmustang", "data/FordMustang/1967-shelby-ford-mustang.babylon", @OnLoad())

Regards

Hans-Peter
falsam
Posts: 280
Joined: Mon May 05, 2014 9:49 pm
Location: France
Contact:

Re: Babylon.js

Post by falsam »

OOops :oops: Thank you HPW. I'm updating this example.

➽ Windows 11 - JDK 1.8 - SB 2.40 - Android 13
http://falsam.com

Sorry for my poor english
Dirk Geppert
Posts: 282
Joined: Fri Sep 22, 2017 7:02 am

Re: Babylon.js

Post by Dirk Geppert »

@Falsam: I'd like to do something with VR. Is Babylon also suitable for creating a 3D stereo VR display or is it only possible with WebVR etc.?

Ciao Dirk
poshu
Posts: 96
Joined: Mon Feb 24, 2014 11:46 pm

Re: Babylon.js

Post by poshu »

Babylon.js supports webvr.
Dirk Geppert
Posts: 282
Joined: Fri Sep 22, 2017 7:02 am

Re: Babylon.js

Post by Dirk Geppert »

Excuse my previous question, please. I just found the VR demo in falsams babylon examples. That's awesome! :shock:
These are great new opportunities. :D I'll be off, in the VR. ;)

Big thanks to Falsam for the Babylon integration!
Post Reply