I look back and I am very surprised

[dige]

Since Kiffi inspired me to develop WebApps with his Pb2Web 3 years ago, 90% of my projects are now WebApp based. It's incredible and it surprises myself.

The power and possibilities of WebApps (clients) in combination with PureBasic (server, CGI, FCGI etc.) are simply gigantic. Especially because these things run on all machines with a browser, including smartphones.

Even 3D runs smoothly in the browser! Check out these great SpiderBasic based WebApps:

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

http://cg.racine.free.fr/puzzle/

In the meanwhile I use Fred's SpiderBasic to develop WebApps, in combination with SpiderBite for the server-side communication. It just rocks!

Many thanks to Fred for SpiderBasic. And many thanks also to Kiffi and Falsam, who with your help greatly improve the possibilities of SpiderBasic.

Thank you guys!!!

Keep on going!!!

[HanPBF]

Great examples.

I also use nw.js and PureBasic as back office.

Are the examples done with SpiderBasic?
I know it's done with Dojo; it should translate to performant JavaScript.

Don't know how SpiderBasic's debugger works...
So, I have to do the things with Javascript.

But, indeed, at UI site, web technology is the way to go.

[Otrebor]

Indeed, great examples!
Puzzle is awesome

[dige]

Magic Mah-jong http://cg.racine.free.fr/mahjong/

[Nituvious]

web apps are basically where I am too. best place to be imo. you have such a massive client potential through a web app that no compiled program will ever hold a candle to, thanks to the advent of smart phones and their availability.

[falsam]

Are the examples done with SpiderBasic?

Yes : SpiderBasic & Babylon.sbi

Code: Select all

EnableExplicit

IncludeFile "babylon/babylon.sbi"

Global AssetsPath.s = "data/garden/"

;Scene
Global Scene, Camera, Light

;Leaves
Structure NewLeave
  Mesh.i
  x.f
  y.f
  z.f
  angle.f
EndStructure
Global Dim Leaves.NewLeave(200), LeavesTex, LeavesMat, Index

;Sounds
Global HubCentral, HubLeft, HubRight
Global SoundLeft, SoundCentral, SoundRight

;EyeBall
Global EyeBall

;Particle
Global Emitter 

;Mouse move
Global UserX.f, UserY.f

;Summary
Declare LoadGame()
Declare MouseMove()
Declare onLoadSuccess(Name.s, Mesh)
Declare onLoadError()

Declare EyeLookAt()
Declare RenderGame()

; Returns a random float in the interval [0.0, Maximum]
Macro RandomFloat(Maximum=1.0)
  ( Random(2147483647)*Maximum*4.6566128752457969241e-10 ) ; Random * 1/MaxRandom
EndMacro

; Returns a random sign {-1, 1}
Macro RandomSign()
  ( Random(1)*2-1 ) 
EndMacro

;No Zoom
!$('head').append('<meta name="viewport" content="width=device-width, maximum-scale=1.0, user-scalable=0">');

;Initengine 
UseModule BJS
InitEngine(@LoadGame())

Procedure LoadGame()      
  Scene = CreateScene()
  
  If Scene    
    ;setup environment
    UseAssetsManager()
    AssetsManagerPrompt("Loading ...")
    
    ClearScene(RGB(0,0,0))
    AmbientColor(RGB(255,255,255))
    Fog(RGB(255,255,255), 0.005)   
    
    ;Camera Light   
    Camera = CreateCamera("camera", 0, 0, -10, #BJS_Free)
    DisableControlCamera(Camera)
    
    Light = CreateLight("point", 0, 0, -10, 0.5, #BJS_Point)
    SetLightColor(Light, #BJS_Diffuse, RGB(255,255,255))
    SetLightColor(Light, #BJS_Specular, RGB(255,255,255))
    
    ;Sound
    SoundLeft = MusicLoad("left", AssetsPath + "sound/gong.mp3", #True, #True)
    SoundCentral = MusicLoad("central", AssetsPath + "sound/ambiance.mp3", #True, #True)    
    SoundRight = MusicLoad("right", AssetsPath + "sound/drum.mp3", #True, #True)
    MusicVolume(SoundRight, 0.4)
        
    ;Sound Hub 
    HubLeft = CreateSphere("hubleft", 2, 1)    
    MoveMesh(HubLeft, -30, 0, 10)
    HideMesh(HubLeft)
    MusicAttachToMesh(HubLeft, SoundLeft)
    
    HubCentral = CreateSphere("hubcentral", 2, 1)
    HideMesh(HubCentral)
    MusicAttachToMesh(HubCentral, SoundCentral)
    
    HubRight = CreateSphere("hubright", 2, 1)    
    MoveMesh(HubRight, 30, 0, 10)
    HideMesh(HubRight)
    MusicAttachToMesh(HubRight, SoundRight)    
    
    ;Particle
    Emitter = CreateParticleEmitter("particles", HubCentral, 1000)
    ParticleTexture(Emitter, AssetsPath + "particle.png")
    ParticleEmitBox(Emitter, -50, -4, -40, 40, -4, 50) 
    ParticleColorDead(Emitter, RGBA(0, 0, 55, 0))
    ParticleSizeRange(Emitter, 0.5, 1.5)    
    ParticleTimeToLive(Emitter, 1, 3)
    ParticleEmissionRate(Emitter, 200)    
    ParticleGravity(Emitter, 0, 4, 0)
    ParticleSpeed(Emitter, 1, 3, 0.005)    
    StartParticle(Emitter)
    
    ;Leaves
    LeavesTex = LoadTexture(AssetsPath + "viny_leaves.png")
    LeavesMat = CreateMaterial("leaves")
    SetMaterialTexture(LeavesMat, #BJS_Diffuse, LeavesTex, #True)
    
    For Index = 0 To 199
      With Leaves(Index)
        \Mesh = CreatePlane("Leave0", 4, 4)
        GhostMesh(\Mesh)
        
        \x = Random(15) * RandomSign()
        \y = Random(2) * RandomSign()        
        \z = Random(30) * RandomSign()
        \angle = RandomFloat(0.1) * RandomSign()
        MoveMesh(\Mesh, \x, \y, \z) 
        SetMeshMaterial(\Mesh, LeavesMat)
      EndWith
    Next  
    
    ;Eye Ball
    AssetsManagerAdd("Eyeball", AssetsPath + "EyeBall/eye.babylon", @onLoadSuccess(), @onLoadError())   
    
    AssetsManagerLoad()
    
    onMouseMove(@MouseMove())    
    RenderLoop(@RenderGame())
  EndIf
EndProcedure

Procedure MouseMove()  
  UserX =  -1 + (SceneMouseX(Scene)/DesktopWidth(0)) * 2 
  UserY =  -1 + (SceneMouseY(Scene)/DesktopHeight(0)) * 2 
EndProcedure

Procedure onLoadSuccess(Name.s, Mesh)
  EyeBall = Mesh
  MoveMesh(EyeBall, 0, 0, 20)
  ScaleMesh(EyeBall, 0.5, 0.5, 0.5)  
  RotateMesh(EyeBall, 90, 0, 0)
  BeforeRender(@EyeLookAt())
EndProcedure

Procedure onLoadError()
    
EndProcedure

;Render
Procedure EyeLookAt()
  MeshLookAt(EyeBall, Camera)
  RotateMesh(EyeBall, 90, 0, 0)
EndProcedure

Procedure RenderGame()  
  Protected x.f = CameraX(Camera) + ((UserX * 10) - CameraX(Camera)) * 0.05  
  Protected z.f = CameraZ(Camera) + ((UserY *-10) - CameraZ(Camera)) * 0.05  
  
  MoveCamera(Camera, x, 0, z)
  
  For Index = 0 To 199
    With Leaves(Index)
      RotateMesh(\Mesh, 0, 0, \angle, #PB_Relative)
    EndWith
  Next  
  RenderWorld() 
EndProcedure