Add the code in emscripten hello_worldd which was missing in last 2 check-ins (sorry).

- Add a function to check for canvas resizes 
- Switch to WebGL1 driver


git-svn-id: svn://svn.code.sf.net/p/irrlicht/code/branches/ogl-es@5508 dfc29bdd-3216-0410-991c-e03cc46cb475

examples/01.HelloWorld_emscripten/Makefile

@@ -40,8 +40,8 @@ all_win32 clean_win32 static_win32: SUF=.exe
 all_emscripten clean_emscripten: SUF=.html
 all_emscripten: CXXFLAGS += -fno-exceptions -fno-rtti -fstrict-aliasing  -std=gnu++11 -U__STRICT_ANSI__
 all_emscripten: LDFLAGS += -lGL -lSDL --preload-file ../../media@/media -s ALLOW_MEMORY_GROWTH=1 -s NO_EXIT_RUNTIME=1
-# You have to check yourself if oyu need FULL_ES2 or not (it's slower sometimes, but some stuff simply won't work yet without this)
+# You need the FULL_ES2 when using EDT_OGLES2 driver
-all_emscripten: LDFLAGS += -s FULL_ES2=1 
+#all_emscripten: LDFLAGS += -s FULL_ES2=1 
 static_win32: CPPFLAGS += -D_IRR_STATIC_LIB_
 all_win32: LDFLAGS += -lopengl32 -lEGL -lGLESv1_CM -lGLESv2 -lm
 static_win32: LDFLAGS += -lgdi32 -lwinspool -lcomdlg32 -lole32 -loleaut32 -luuid -lodbc32 -lodbccp32 -lopengl32 -lEGL -lGLESv1_CM -lGLESv2

examples/01.HelloWorld_emscripten/main.cpp

@@ -11,7 +11,7 @@ You have to setup the emscripten environment on your system first to use this.
 
 /*
 The code in here is mostly similar to the usual HelloWorld.
-You can find more information about it there. Here we mainly document the 
+You can find more information about it there. Here we mainly document the
 differences needed for emscripten.
 */
 
@@ -23,7 +23,7 @@ using namespace io;
 using namespace gui;
 
 /*
-This part not necessary for emscripten, only useful to keep it in 
+This part not necessary for emscripten, only useful to keep it in
 in case you want to run the same code on Windows with VS as well.
 */
 #ifdef _MSC_VER
@@ -40,23 +40,52 @@ IVideoDriver* driver = 0;
 ISceneManager* smgr = 0;
 IGUIEnvironment* guienv = 0;
 
+ICameraSceneNode* camera = 0;
+dimension2d<u32> screenSize(640, 480);
+
+#ifdef __EMSCRIPTEN__
+/*
+	Handle changes in canvas size which are done with html/js.
+	Note that it's only OK for windowed so far,
+	the switch to fullscreen not yet working.
+*/
+void checkCanvasResize()
+{
+	int w, h, fs;
+	emscripten_get_canvas_size(&w, &h, &fs);
+	const core::dimension2d<u32> canvasDim(w,h);
+	if ( canvasDim != screenSize )
+	{
+		screenSize = canvasDim;
+		driver->OnResize(canvasDim);
+		driver->setViewPort(irr::core::rect<irr::s32>(0,0,w,h));
+
+		irr::f32 aspect = (irr::f32)w / (irr::f32)h;
+		camera->setAspectRatio(aspect);
+	}
+}
+
+
 /*
 	emscripten can't run things in an endless-loop or otherwise the browse will consider
 	the script to hang.
 */
-#ifdef __EMSCRIPTEN__
 void one_iter()
 {
-    if(!device->run()) 
+    if(!device->run())
 	{
 		// Could clean up here in theory, but not sure if it makes a difference
-		
+
 		/*
 		This tells emscripten to not run any further code.
 		*/
         emscripten_cancel_main_loop();
         return;
     }
+
+	// In case you have a resizeable canvas (resized from html)
+	checkCanvasResize();
+
     driver->beginScene(ECBF_COLOR | ECBF_DEPTH, SColor(255,100,101,140));
 
     smgr->drawAll();
@@ -73,24 +102,21 @@ void one_iter()
 int main()
 {
 	/*
-	Create device flags for emscripten are still experimental 
+	Create device flags for emscripten are still experimental
 	and might not all work.
-	
+
-	- deviceType: You have to use video::EDT_OGLES2 which will be translated 
+	- deviceType: You can to use EDT_OGLES2 or EDT_WEBGL1 on emscripten.
-	   to WebGL by emscripten.
+	   EDT_WEBGL1 is better optimized but does not yet support all options.
-	   It can be useful to have EDT_OGLES2 or EDT_OGLES1 for comparison for
+	   EDT_OGLES2 needs -s FULL_ES2=1 as linker flag in the Makefile.
-	   testing on the desktop.
 	*/
 #ifndef __EMSCRIPTEN__
-	device =
+	video::E_DRIVER_TYPE deviceType = EDT_OGLES2;
- 		createDevice( video::EDT_OGLES1, dimension2d<u32>(640, 480), 16,
- 			false, false, false, 0);
 #else //__EMSCRIPTEN__
-	device =
+	video::E_DRIVER_TYPE deviceType = EDT_WEBGL1;
-		createDevice(video::EDT_OGLES2, dimension2d<u32>(640, 480), 16,
-    		false, false, false, 0);
 #endif //__EMSCRIPTEN__
 
+	device = createDevice(deviceType, screenSize, 16, false, false, false, 0);
+
 	if (!device)
 		return 1;
 
@@ -118,10 +144,10 @@ int main()
 		rect<s32>(10,10,260,22), true);
 
 	/*
-	Get a media path dedicated for your platform. 
+	Get a media path dedicated for your platform.
 	We tell emscripten to copy the media folder in the Makefile with:
 	"--preload-file ../../media@/media"
-	That copies our ../../media folder in a .data 
+	That copies our ../../media folder in a .data
 	file which is loaded by the browser. It can then be accessed there
     by "/media" name (that's the parameter after the '@').
 	Note that usually you would try to copy only as many files
@@ -141,10 +167,10 @@ int main()
 	IAnimatedMeshSceneNode* node = smgr->addAnimatedMeshSceneNode( mesh );
 
 	/*
-	Disable lighting because we do not have a dynamic light in here, and	
+	Disable lighting because we do not have a dynamic light in here, and
-	the mesh would be totally black otherwise. 
+	the mesh would be totally black otherwise.
-	Set the frame loop such that the predefined STAND animation is used. 
+	Set the frame loop such that the predefined STAND animation is used.
-	Add a texture to the model. 
+	Add a texture to the model.
 	*/
 	if (node)
 	{
@@ -158,11 +184,11 @@ int main()
 	(0, 30, -40). The camera looks from there to (0,5,0), which is
 	approximately the place where our md2 model is.
 	*/
-	smgr->addCameraSceneNode(0, vector3df(0,30,-40), vector3df(0,5,0));
+	camera = smgr->addCameraSceneNode(0, vector3df(0,30,-40), vector3df(0,5,0));
 
 #ifndef __EMSCRIPTEN__		// this part only so you can run the same code on desktop
 	/*
-	On desktop we run and endless loop until the user closes the window or 
+	On desktop we run and endless loop until the user closes the window or
 	presses ALT+F4 (or whatever keycode closes a window).
 	*/
 	while(device->run())
@@ -175,20 +201,20 @@ int main()
 		driver->endScene();
 	}
 	device->drop();
-	
+
 #else // __EMSCRIPTEN__
-	
+
 	/*
-	Setting fps to 0 or a negative value will use the browser’s 
+	Setting fps to 0 or a negative value will use the browser’s
-	requestAnimationFrame mechanism to call the main loop function. 
+	requestAnimationFrame mechanism to call the main loop function.
-	Emscripten documentation recommends to do that, but you can also set 
+	Emscripten documentation recommends to do that, but you can also set
-	another fps value and the browser will try to call the main-loop 
+	another fps value and the browser will try to call the main-loop
 	fps times per second.
 	The simulate_infinite_loop tells emscripten that this is an application
-	which will simulate an infinite loop. There is also a flag in the 
+	which will simulate an infinite loop. There is also a flag in the
 	Makefile about that: -s NO_EXIT_RUNTIME=1
 	*/
-	int fps = 0;	
+	int fps = 0;
 	int simulate_infinite_loop = 1;
 	emscripten_set_main_loop(one_iter, fps, simulate_infinite_loop);
 #endif //__EMSCRIPTEN__