**babylon.sbi version 1.0 (09 Janvier 2017)**

Version de SpiderBasic : 2.20\\
Version du framework babylon.js : 3.1 

<WRAP round box 100%>
===== Qu'est ce que babylon.sbi ? =====
</WRAP>

**Babylon.sbi** est un module codé avec le langage[[http://www.spiderbasic.com/|SpiderBasic]] permettant de disposer d'un accès simplifié au framework javascript **3D**  [[https://www.babylonjs.com/|babylonjs.com]] créée par //David Catuhe// et //David Rousset//, deux ingénieurs spécialisés dans le web chez Microsoft. 

Les principales fonctionnalités sont la création d'une ou plusieurs scènes, la création d'un skybox, la création d'un plan d'eau, la création des lumières, la création d'une ou plusieurs caméras, la création de meshs et de matériel, la création d'un terrain, le système d'ombrage, la gestion des collisions, la gestion de la gravité, la sauvegarde d'une scène, etc ...

Vous pouvez créer vos scènes sur [[https://clara.io]] et l'exporter au format babylon pour une utilisation dans votre code. 


===== Téléchargement =====
Les sources et les exemples sont téléchargeables sur la plateforme GitHub : [[https://github.com/falsam/BJS/archive/master.zip|BJS-Master.zip]] 57 Mo environ.

Une fois décompressé, le dossier fait environ 88 Mo.

  * Le dossier **babylon** contient l'interface de communication Babylon.sbi ainsi que ces dépendances (//Engine.sbi, Mesh.sbi, material.sbi, etc ...//). Il pèse environ 70 Ko.

  * Le dossier **sbbjs** contient le framework Javascript personnalisé babylon.custom.js et pése 2.40 Mo environ.
 
  * Le dossier **data** contient l'ensemble des textures et sons nécessaires aux fonctionnement des exemples. C'est le dossier le plus lourd avec un poids de 85 Mo actuellement. 


**Les dossiers babylon et sbbjs sont obligatoires pour le développement d'un code 3D.**

**En production, seul le dossier contenant le framework (sbbjs) est obligatoire.**

===== Environnement de travail =====
  ***Votre dossier**\\
  *→ **babylon** Dossier contenant les includes assurant l'interface avec le framework Babylon.js à utiliser avec SpiderBasic.\\
  *→ **sbbjs** Dossier contenant le framework babylon.custom.js qui sera à exporter lors de la création de votre application.\\
  *→ **//Data//** Dossier facultatif qui contiendra vos textures, son, etc ....\\
  ***code.sb** Votre code. (//Voir exemples 00-template.sb//)
 
===== Compatibilité avec les navigateurs =====
Les meilleures résultats visuels sont avec le navigateur Chrome. Pas de soucis non plus avec FireFox bien que par moment j'ai pu observer des ralentissements. Le résultat n'est pas au rendez vous avec Edge et non fonctionnel avec Internet Explorer. 

<WRAP round box 100%>
===== Fonctionnalités de Babylons.sbi=====
</WRAP>

<WRAP group>
<WRAP half column>
Le module principal **babylon.sbi** inclut d'autres modules. Vous obtiendrez la listes des fonctionnalités en cliquant sur chacun d'eux.

[[functions:engine|engine.sbi]]\\
Passage obligé pour créer votre espace 3D.

[[functions:scene|scenes.sbi]]\\
La scène est un conteneur d’objets 3D comme des cubes ou des modèles 3D.

[[functions:environment|environnement.sbi]]\\
Le ciel, l'eau, la lumière et l'ombre. Que c'est beau !

[[functions:camera|camera.sbi]]\\
Sans caméra, pas de visualisation 3D.

[[functions:mesh|meshs.sbi]]\\ 
Les Meshs (//maillages en 3D//) sont des objets 3D composés de triangles reliés entre eux pour donner une forme finale. 
Création de spheres, cubes, ground, terrain

[[functions:texture|texture.sbi]]\\
Les textures permettent aux objets 3D (//Meshs//) d'avoir un aspect réaliste. 

[[functions:material|materials.sbi]]\\
Un mesh sans textures c'est laid. Un matériel est un papier peint composé d'une ou plusieurs textures et parfois de couleurs qui sera plaqué sur un objet (//mesh//).


[[functions:particle|particle.sbi]]\\
Système de particules.

[[functions:music|music.sbi]]\\
Environnement musicale.


[[functions:keyboard|keyboard.sbi]]\\ 
Gestionnaire de clavier. 

[[functions:gui2d|gui.sbi]]\\ 
Du texte, des boutons, des images et des liens dans un espace 2D.

[[functions:assetsmanager|assetsmanager.sbi]]\\ 
Les fonctionnalités peuvent être utilisées pour importer des meshs dans une scène ou charger du texte et des fichiers binaires.
</WRAP>
<WRAP half column>
===== Exemples =====
[[playground:template|Template de base]]\\
[[playground:basicscene|Basic Scene]] [[http://falsam.com/sbbjs/basicscene.html|Voir]]\\
[[playground:meshclone|Cloner un mesh]]\\
[[playground:material|Material]] [[http://falsam.com/sbbjs/material.html|Voir]]\\
[[playground:shadow|Shadow]] [[http://falsam.com/sbbjs/shadow.html|Voir]]\\
[[playground:light|Light]] [[http://falsam.com/sbbjs/light.html|Voir]]\\
[[playground:collision|Collision]] [[http://falsam.com/sbbjs/collision.html|Voir]]\\
[[playground:skybox|Sky Box]] [[http://falsam.com/sbbjs/skybox.html|Voir]]\\
[[playground:water|Water]] [[http://falsam.com/sbbjs/water.html|Voir]]\\
[[playground:terrain|Terrain]] [[http://falsam.com/sbbjs/terrain.html|Voir]] \\ 
[[playground:picking|Picking]] [[http://falsam.com/sbbjs/picking.html|Voir]] \\  
[[playground:particle|Particle]] [[http://falsam.com/sbbjs/particle.html|Voir]] \\  
[[playground:music|Music]] [[http://falsam.com/sbbjs/music.html|Voir]] \\  
[[playground:musicspacial|MusicSpacial]] [[http://falsam.com/sbbjs/musicspatial.html|Voir]] \\  
[[playground:tube|CreateTube]] [[http://falsam.com/sbbjs/tube.html|Voir]] \\  
[[playground:tuberadiusfunction|Tube Radius Fonction]] [[http://falsam.com/sbbjs/tuberadiusfunction.html|Voir]] \\  
[[playground:vrcamera|Camera Virtuelle]] [[http://falsam.com/sbbjs/vrcamera.html|Voir (Experimental)]] \\  
</WRAP>
</WRAP>

<WRAP round box 100%>
===== Showcase =====
</WRAP>
[[https://falsam.com/sbbjs/garden.html|{{:wiki:garden.jpg?300|Garden Demo}}]]\\
Garden

[[https://falsam.com/sbbjs/assetsmanager.html|{{:wiki:addictionvideo.jpg?300|Addiction Vidéo}}]]\\
Addiction Vidéo

[[https://falsam.com/sbbjs/reflection.html|Reflection]]
Le ciel se reflète sur une sphère.