Torque 3D Embedded Browser (WebKit)
by Josh Engebretson · in Torque 3D Professional · 01/15/2010 (8:55 pm) · 305 replies
Hey guys,
Here are some highlights:
1) It uses QtWebKit which is based off Apple's WebKit, the same HTML5/Canvas based web rendering engine from Chrome, Safari, Adobe AIR
2) QtWebKit is *easily* the best designed embeddable web browser I have found in exhaustive travels... (I actually compiled Chrome from source at one point, not recommended). Qt is *extremely* well supported and owned by Nokia who recently paid $153,000,000 for it. So, it is probably going to be around for some time.
3) Flash works :)
4) It is setup as a GuiControl so interacts perfectly with mouse events, control overlap, filters...
There are currently 3 rendering modes:
1) Render to Texture: This mode renders the web view to an offscreen buffer and then uploads it to a GFXTexHandle. It uses the Torque GUI system input for mouse and keyboard. As we're rendering to a texture, compositing and rendering to 3d surfaces is possible. Flash renders as long as it is set to windowless mode in the HTML (not a big deal). Instead of using Flash for anything other than presentation/video playback, I would suggest looking into Canvas/HTML5/CSS animations/effects in this mode.
2) Render Native: This mode integrates a native child window with Gui Control, giving the best of both worlds :) There is no need to render to texture as we're using an actual clipped child HWND which uses the Torque GUI system for position/extents and focus :) Transparency does not currently work, however under Vista/Win7 this should be possible. I should be able to get masking working with minimal effort, which would allow for shaped windows and transparent areas.
3) Render Popup: This mode pops up a standalone window, which is owned by the application and consistent in scripting with other modes. This is useful for things like integrated document browsing, tutorial video watching, game doc reading, game forum reading, etc... where you don't want to crowd your game interface with browser. However, you want CLOSE scripted integration with a standard browser (no worries of IE/Mozilla/Chrome), which isn't possible with the current "launch browser" functionality.
These modes work with HTTPS adding a nice way to authenticate to servers, secure purchasing, etc.
It is still pretty early in the development and the idea with the code release will be to get feedback on usability and features... especially WRT integration with Javascript on the page, etc.
EDIT: The first version has been released and is available HERE
Regards,
- Josh Engebretson
Mythos Labs, LLC
Here are some highlights:
1) It uses QtWebKit which is based off Apple's WebKit, the same HTML5/Canvas based web rendering engine from Chrome, Safari, Adobe AIR
2) QtWebKit is *easily* the best designed embeddable web browser I have found in exhaustive travels... (I actually compiled Chrome from source at one point, not recommended). Qt is *extremely* well supported and owned by Nokia who recently paid $153,000,000 for it. So, it is probably going to be around for some time.
3) Flash works :)
4) It is setup as a GuiControl so interacts perfectly with mouse events, control overlap, filters...
There are currently 3 rendering modes:
1) Render to Texture: This mode renders the web view to an offscreen buffer and then uploads it to a GFXTexHandle. It uses the Torque GUI system input for mouse and keyboard. As we're rendering to a texture, compositing and rendering to 3d surfaces is possible. Flash renders as long as it is set to windowless mode in the HTML (not a big deal). Instead of using Flash for anything other than presentation/video playback, I would suggest looking into Canvas/HTML5/CSS animations/effects in this mode.
2) Render Native: This mode integrates a native child window with Gui Control, giving the best of both worlds :) There is no need to render to texture as we're using an actual clipped child HWND which uses the Torque GUI system for position/extents and focus :) Transparency does not currently work, however under Vista/Win7 this should be possible. I should be able to get masking working with minimal effort, which would allow for shaped windows and transparent areas.
3) Render Popup: This mode pops up a standalone window, which is owned by the application and consistent in scripting with other modes. This is useful for things like integrated document browsing, tutorial video watching, game doc reading, game forum reading, etc... where you don't want to crowd your game interface with browser. However, you want CLOSE scripted integration with a standard browser (no worries of IE/Mozilla/Chrome), which isn't possible with the current "launch browser" functionality.
These modes work with HTTPS adding a nice way to authenticate to servers, secure purchasing, etc.
It is still pretty early in the development and the idea with the code release will be to get feedback on usability and features... especially WRT integration with Javascript on the page, etc.
EDIT: The first version has been released and is available HERE
Regards,
- Josh Engebretson
Mythos Labs, LLC
About the author
http://www.TheEngine.Co
#62
I'll post back if I'll run to any problems.
03/04/2010 (8:17 am)
This resource is extremely useful for my game project. Thanks for this!I'll post back if I'll run to any problems.
#63
Check out this video www.youtube.com/watch?v=zUdrflSOe_Q&feature=player_embedded
03/04/2010 (11:08 pm)
Berkelium (www.torquepowered.com/community/resources/view/19421) is a BSD licensed library that provides off-screen browser rendering via Google's open source Chromium web browser, it might give you better FPS since Chromium improved Java Script performance based on the same web kit.Check out this video www.youtube.com/watch?v=zUdrflSOe_Q&feature=player_embedded
#64
- Is it possible to allow processing of clicks in render to texture mode? I guess it would be possible to get the texture coords from a raycast of the click, not sure how to pass that click into webkit though.
- Is there any way to control sound output from flash etc? It would be nice to make the sound 3D and have some control of the volume. I'm guessing this could be tricky though. If that's not possible is there anyway of adding a setting to the WebCtrl to turn sound on/off.
03/05/2010 (1:35 am)
A couple of questions/feature requests...- Is it possible to allow processing of clicks in render to texture mode? I guess it would be possible to get the texture coords from a raycast of the click, not sure how to pass that click into webkit though.
- Is there any way to control sound output from flash etc? It would be nice to make the sound 3D and have some control of the volume. I'm guessing this could be tricky though. If that's not possible is there anyway of adding a setting to the WebCtrl to turn sound on/off.
#65
QtWebKit.dll //No information since its not debug version
OpenAL32.dll //Cannot find or open the PDB file.
Sens_oal.dll //Cannot find or open the PDB file.
I'm using February DirectX 2010 with Visual C++ 2008 Express Edition on Windows Vista Ultimate 64 bit.
03/08/2010 (2:01 pm)
I am failed. I compiled with no problems. I copied the qt*.dll's from the bin folder to the game folder with the debug exe. When I start the game it no longer asks where the dll's are. So thats good. But, When I run the debug version it looks like is running but nothing comes up. In other words it never really starts. I took a look at the modules tab and it showed me a white exclimation mark with a red circle outline background on:QtWebKit.dll //No information since its not debug version
OpenAL32.dll //Cannot find or open the PDB file.
Sens_oal.dll //Cannot find or open the PDB file.
I'm using February DirectX 2010 with Visual C++ 2008 Express Edition on Windows Vista Ultimate 64 bit.
#66
@JesseL: You should run a debug session, break all, and get a call stack to see where the problem might be...
03/08/2010 (2:12 pm)
@Justin Knight: 3D mouse clicking in page space is already supported by the demo application. You could look at scripting the Flash control with Javascript for volume control (otherwise, fake input to the control)@JesseL: You should run a debug session, break all, and get a call stack to see where the problem might be...
#67
03/09/2010 (6:21 am)
@Josh: 3D mouse clicking was broken because I had my webcubes using Bounds instead of Visible Mesh collision. I also hadn't changed my PlayGui to inherit from MyGameTsCtrl instead of GameTsCtrl. Working nicely now, thanks. 
#68
What was the change needed to fix this?
03/16/2010 (7:36 pm)
I am also getting these linker errors:15>zlib.lib(inflate.obj) : error LNK2005: _inflateInit2_ already defined in QtCore4.lib(QtCore4.dll) 15>zlib.lib(inflate.obj) : error LNK2005: _inflate already defined in QtCore4.lib(QtCore4.dll) 15>zlib.lib(inflate.obj) : error LNK2005: _inflateEnd already defined in QtCore4.lib(QtCore4.dll) 15>zlib.lib(deflate.obj) : error LNK2005: _deflate already defined in QtCore4.lib(QtCore4.dll) 15>zlib.lib(deflate.obj) : error LNK2005: _deflateEnd already defined in QtCore4.lib(QtCore4.dll) 15>zlib.lib(deflate.obj) : error LNK2005: _deflateInit2_ already defined in QtCore4.lib(QtCore4.dll) 15>zlib.lib(compress.obj) : error LNK2005: _compress2 already defined in QtCore4.lib(QtCore4.dll)
What was the change needed to fix this?
#69
03/16/2010 (8:54 pm)
Finally fixed the zlib duplicate symbols issue - I just had to copy the project config files over to my project and then run generateProjects.
#70
Material - WebCube_WebCube(6515) - Failed to load diffuse map art/shapes/webcube/#MyWebTexture for stage 0
Webkit is working really well in T3D for me, I just wondered what was causing these errors and if there was a workaround/fix.
03/22/2010 (3:35 am)
I've noticed I get a number of these errors in the console, both in my application and the webkit demo:Material - WebCube_WebCube(6515) - Failed to load diffuse map art/shapes/webcube/#MyWebTexture for stage 0
Webkit is working really well in T3D for me, I just wondered what was causing these errors and if there was a workaround/fix.
#71
I'm currently only interested in MouseDown() but I believe the same will apply to other events.
To re-enable mouseDown I changed MyGameTSCtrl to inherit from GameTSCtrl rather than GuiTSCtrl and added a Parent::onMouseDown() to the start of MyGameTSCtrl::MouseDown()
03/22/2010 (4:30 am)
Another thing I've just spotted is that I was no longer getting mouse events through to my playGui.cs.I'm currently only interested in MouseDown() but I believe the same will apply to other events.
To re-enable mouseDown I changed MyGameTSCtrl to inherit from GameTSCtrl rather than GuiTSCtrl and added a Parent::onMouseDown() to the start of MyGameTSCtrl::MouseDown()
#72
If you hold your mouse button down and drag it across other objects other than the ones with the webkit textures, the game will crash. I fixed this by replacing the code in the following functions in the myGameTSCtrl class.
Change
"Material* m = dynamic_cast <Material *> (r.material->getMaterial());"
to
"Material* m = ( r.material ? dynamic_cast< Material* >( r.material->getMaterial() ) : 0 );"
in the following functions:
1. void MyGameTSCtrl::onMouseMove(const GuiEvent &evt)
2. void MyGameTSCtrl::onMouseUp(const GuiEvent & evt)
3. void MyGameTSCtrl::onMouseDown(const GuiEvent & evt)
Suggestion:
Also, this may be obvious, but if you want different webkit textures on each face of the cube, you need to create a cube model that has a different material on each face.
03/25/2010 (5:44 am)
Error:If you hold your mouse button down and drag it across other objects other than the ones with the webkit textures, the game will crash. I fixed this by replacing the code in the following functions in the myGameTSCtrl class.
Change
"Material* m = dynamic_cast <Material *> (r.material->getMaterial());"
to
"Material* m = ( r.material ? dynamic_cast< Material* >( r.material->getMaterial() ) : 0 );"
in the following functions:
1. void MyGameTSCtrl::onMouseMove(const GuiEvent &evt)
2. void MyGameTSCtrl::onMouseUp(const GuiEvent & evt)
3. void MyGameTSCtrl::onMouseDown(const GuiEvent & evt)
Suggestion:
Also, this may be obvious, but if you want different webkit textures on each face of the cube, you need to create a cube model that has a different material on each face.
#73
03/28/2010 (2:29 pm)
I have noticed that if you use render to texture mode in full screen and use something like a fade effect that fades between screens - there are brief flashes of rectangles. At the exact same resolution in windowed mode the transition is smooth and there are no flashes. I set the fps for the flash control to 60. Anyone else seeing this?
#74
The issues I am seeing are:
- Performance with large textures
- Crashes on exit
- Process hanging around after exit
- Blank textures in texture render mode
03/28/2010 (7:21 pm)
Well I'd really like to use Flash for developing our UI using this resource, but it needs some work. Is InstantAction/TorquePowered going to put any resources into making this solid?The issues I am seeing are:
- Performance with large textures
- Crashes on exit
- Process hanging around after exit
- Blank textures in texture render mode
#75
04/03/2010 (11:08 am)
There is so much to this, in game ads, messages to the players via facebook statuses. This is great.
#76
04/07/2010 (8:34 am)
Is it possible to get an update on what plans Torque has for the WebKit Demo? Will there be an update in the near future? There is a great deal of business potential with this capability. We are more than happy to improve what has already been done, but we would like to know if it is being worked on so we don't duplicate the work. Thanks. 
#77
04/07/2010 (10:27 am)
This is an exciting development Josh! Surprisingly I had little trouble following the instructions provided with the kit demo. The Demo compiled and ran on the first try :) I can't wait to see what great things will come from this.
#78
I'm really glad people are finding this useful and are getting it compiling/running :)
This WebKit technology was developed in very few hours as a R&D project. TorquePowered.com owns the code and graciously allowed it to be released.
It is quite useful and the code is production quality. However, there may be some issues as pointed out. These may have been introduced by compiling against newer versions of Qt/QtWebKit or not applying the patches fully/correctly. This is relatively advanced technology and it is best to use a debugger in these situations to get at minimum a callstack.
HTML5 is a really big deal, especially now that Apple (makers of WebKit) and Microsoft are fully committed to the standard. I would advise that if you are using this to stay clear of the Flash plugin... instead, look into creating GUIs with HTML5 standards, most of the tricky/buggy stuff that came up working on this had to do with tricking the Flash plugin to work. HTML5 is more than up to the task for awesome/animated/themeable game GUI work... also, since this uses Qt, the Qt animation framework is also trivial to get running...
Mythos Labs isn't actively developing this technology. However, we are currently consulting on a project that may use it and any fixes made, we'll ask to get out for the common good.
I would encourage anyone who develops improvements/fixes to share them. This is at the very least a running start on some awesome :)
04/07/2010 (10:44 am)
Hey all, I'm really glad people are finding this useful and are getting it compiling/running :)
This WebKit technology was developed in very few hours as a R&D project. TorquePowered.com owns the code and graciously allowed it to be released.
It is quite useful and the code is production quality. However, there may be some issues as pointed out. These may have been introduced by compiling against newer versions of Qt/QtWebKit or not applying the patches fully/correctly. This is relatively advanced technology and it is best to use a debugger in these situations to get at minimum a callstack.
HTML5 is a really big deal, especially now that Apple (makers of WebKit) and Microsoft are fully committed to the standard. I would advise that if you are using this to stay clear of the Flash plugin... instead, look into creating GUIs with HTML5 standards, most of the tricky/buggy stuff that came up working on this had to do with tricking the Flash plugin to work. HTML5 is more than up to the task for awesome/animated/themeable game GUI work... also, since this uses Qt, the Qt animation framework is also trivial to get running...
Mythos Labs isn't actively developing this technology. However, we are currently consulting on a project that may use it and any fixes made, we'll ask to get out for the common good.
I would encourage anyone who develops improvements/fixes to share them. This is at the very least a running start on some awesome :)
#79
@Josh
If the code is owned by GG/TorquePowered.com, will the WebKit integration become part of the T3D code base?
--RB
04/15/2010 (5:54 am)
Quote:This WebKit technology was developed in very few hours as a R&D project. TorquePowered.com owns the code and graciously allowed it to be released.
@Josh
If the code is owned by GG/TorquePowered.com, will the WebKit integration become part of the T3D code base?
--RB
#80
04/15/2010 (10:14 am)
It is something on our list to evaluate for proper integration into the SDK. The earliest that is likely to happen is in the Fall of this year. 
Torque Owner Justin Knight
TCE
I found this page useful, whhich describes deploying Webkit applications:
[link]http://qt.nokia.com/doc/4.6/deployment.html[/link]
The main issue I hit was it not finding the plugin .dlls which was solved by creating a qt.conf file as described here:
[link]http://qt.nokia.com/doc/4.6/qt-conf.html[/link]