Light Mapping in HTML5

It took best part of two weeks but we now have light mapping in Freedom-Engine 3D and AGK, and can be seen running right now.

Simply visit https://freedom-engine.com/ide.php and select the 3D - FPS Example, press PLAY and then run around the 3D scene. There is no collision in the Freedom-Engine version at the moment, and we plan to add optimisation on the media and the file structure for faster loading and smaller media files.

We're still in BETA, and both commands and engine are still work in progress, but you should be able to use this version to import your own OBJ and texture files, and start creating some interesting 3D scenes.  One very cool aspect of this version is that you can create vertex and pixel shaders right in the editor. Simply click to create a new source code file and then rename it with .VS for vertex shader and .PS for pixel shader. These files will then be used as media files when you use something like LoadShader ( 1, "vertex.vs", "pixel.ps" ) to load the shaders in.

Here is the source code that created the example above:


rem
rem 3D Lightmapping
rem Artwork by Mark Blosser
rem

rem Init app
SetSyncRate(60,1)
SetClearColor(128,64,0)

rem Loading status
customimg=LoadImage("custom.png")
CreateText(1,"Loading Metro Theatre Scene")
SetTextFontImage(1,customimg)
SetTextAlignment(1,1)
SetTextPosition(1,50,45)
SetTextSize(1,10)
CreateText(2,"Artwork by Mark Blosser")
SetTextFontImage(2,customimg)
SetTextAlignment(2,1)
SetTextPosition(2,50,60)
SetTextSize(1,8)
Sync()

rem Load world
gosub _load_world

rem Setup camera
plrx#=1850 : plrz#=-3650 : plra#=0 : eyeheight#=553
SetCameraPosition(1,plrx#,eyeheight#,plrz#)
SetCameraRotationEuler(1,0,plra#,0)

rem Start loop
DeleteText(1) : DeleteText(2)

rem Main loop
do
 `
 rem Move camera
 if GetRawKeyState(38)=1 then MoveCameraLocalZ(1,4.0)
 if GetRawKeyState(40)=1 then MoveCameraLocalZ(1,-4.0)
 if GetRawKeyState(37)=1 then RotateCameraLocalY(1,-4.0)
 if GetRawKeyState(39)=1 then RotateCameraLocalY(1,4.0)
 `
 rem Framerate prompt
 fps=ScreenFPS() : Print(fps)
 `
 rem Update screen
 Sync()
 `
loop

_load_world:
 `
 rem Shaders
 shaderindex=1 : LoadShader(shaderindex,"vertex.vs","pixel.ps")
 `
 rem Load lightmaps
 dim lm[10]
 lm[0]=LoadImage("0.png")
 lm[1]=LoadImage("1.png")
 `
 rem Load all OBJ making up world (created in FPS Creator)
 objmax=50
 for obj=1 to objmax
  obj$="mesh"+str(obj)+".obj"
  LoadObject(obj,obj$,0)
  if obj>=1 and obj<=7
   tex$="mesh"+str(obj)+"-1.jpg"
  else
   tex$="mesh"+str(obj)+"-0.jpg"
  endif
  texname$=left(tex$,len(tex$)-4)
  lm$=right(texname$,1)
  if lm$="-" then lm$="0"
  SetObjectImage(obj,LoadImage(tex$),0)
  SetObjectImage(obj,lm[val(lm$)],1)
  SetObjectShader(obj,shaderindex)
  `
  rem Progress status
  perc#=obj : perc#=perc#/objmax : perc=perc#*100
  SetTextString(1,"Metro Theatre - "+str(perc)+"%") : Sync()

 next obj
 `
return

I'm pretty buzzed about this version as it allows decent looking scenes to be created and played in a native HTML5 browser, no plug-ins need apply! In the near future we plan to get everything else in such as point and directional lighting for the built-in shaders plus more control over how your models are loaded in and how they are formatted for advanced shader features.

The next few steps is to make sure you can deploy these new 3D apps flawlessly, so you can share what you have created while you work on the latest version.