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
#282
08/10/2012 (10:03 pm)
Tomer: there is an end-user solution, called "programming", because this is a product for which the end-users are programmers. You use it because you can make it do what you want on your own power. 
#283
Programming is not an end-user solution a plug-in is. A easy to use GUI Element you can drug and drop with a comprehensive properties dialog is what end users expect even programmers want to program just the extended properties or just the game mechanic not the game engine itself if they can avoid it.
Sure you can limit your end-users base to c++ core programmers yet most GDKs have an easy way to script and like TorqueScript the good ones have GUI too so you can program very little and prototype very quickly.
Anyway I chose Torque over other option because of what you get out of the box already and the many extensions to the source code and this resource too. I paid 1000$ for the source since it is important to me to have full control.
Now when I am going to develop my garage game I am starting to think it will be better to use another engine that has plug ins comparable with each other and not a pile of kits and resources that are most likely hard to merge even if I had the time and knowledge to patch together.
No one in Israel teaches Torque only Unity... I wish I could change that yet the market has its say.
08/11/2012 (1:04 am)
For the record I am a very experienced programmer for over 12 years professionally and 27 as a hobby.Programming is not an end-user solution a plug-in is. A easy to use GUI Element you can drug and drop with a comprehensive properties dialog is what end users expect even programmers want to program just the extended properties or just the game mechanic not the game engine itself if they can avoid it.
Sure you can limit your end-users base to c++ core programmers yet most GDKs have an easy way to script and like TorqueScript the good ones have GUI too so you can program very little and prototype very quickly.
Anyway I chose Torque over other option because of what you get out of the box already and the many extensions to the source code and this resource too. I paid 1000$ for the source since it is important to me to have full control.
Now when I am going to develop my garage game I am starting to think it will be better to use another engine that has plug ins comparable with each other and not a pile of kits and resources that are most likely hard to merge even if I had the time and knowledge to patch together.
No one in Israel teaches Torque only Unity... I wish I could change that yet the market has its say.
#284
If anybody has any questions on replacing Qt with Awesomium ask away and I will try to answer them.
08/11/2012 (10:49 am)
Let's get this thread back on topic please. Debating how a 2 year old resource of R&D code is updated is not productive.If anybody has any questions on replacing Qt with Awesomium ask away and I will try to answer them.
#285
adding lib file to VS and building it with out plugin.
10/25/2012 (12:17 pm)
Can you give us an outline spelling out the process?adding lib file to VS and building it with out plugin.
#286
adding lib file to VS and building it with out plugin.
10/26/2012 (11:53 am)
Can you give us an outline spelling out the process?adding lib file to VS and building it with out plugin.
#287
adding lib file to VS and building it with out plugin.
10/26/2012 (12:03 pm)
Can you give us an outline spelling out the process?adding lib file to VS and building it with out plugin.
#288
The only remaining issue I've hit is the webkit libpng conflicting with the one included in Torque 3D. For now I'm building webkit without png support like this....
I tried persuading the Torque build system to use webkit's libpng and not build it's own but haven't managed to do that yet. If anyone has any pointers that would be appreciated.
The weird thing is that I don't remember hitting any libpng conflicts when building against 4.6 or 4.8 versions of webkit.
Anyway, youtube video works great with 4.7.4 and once I have the png issue sorted I'll post again with instructions on how to build 4.7.4 for anyone else who needs video and would rather stay with webkit than go the Awesomium route. Thanks to Josh and Doug for their previous instructions on building Torque with webkit.
12/04/2012 (9:36 am)
Webkit with video is a key part of our project so we've decided to go back to the most recent version of webkit with flash video support. To that end I've been trying to compile Webkit 4.7.4 with Torque 3D 1.2. I'm using VS2010 on Windows 8.The only remaining issue I've hit is the webkit libpng conflicting with the one included in Torque 3D. For now I'm building webkit without png support like this....
configure -opensource -no-phonon -no-multimedia -no-script -no-opengl -no-openvg -no-qt3support -no-dbus -no-scripttools -nomake demos -nomake examples -fast -release -qt-libpng
I tried persuading the Torque build system to use webkit's libpng and not build it's own but haven't managed to do that yet. If anyone has any pointers that would be appreciated.
The weird thing is that I don't remember hitting any libpng conflicts when building against 4.6 or 4.8 versions of webkit.
Anyway, youtube video works great with 4.7.4 and once I have the png issue sorted I'll post again with instructions on how to build 4.7.4 for anyone else who needs video and would rather stay with webkit than go the Awesomium route. Thanks to Josh and Doug for their previous instructions on building Torque with webkit.
#289
releases.qt-project.org/qt5.0/rc1/qt-windows-opensource-5.0.0-rc1-msvc2010_32-x8...
(General download page is: qt-project.org/downloads if you want to try on a different platform)
Download Josh's original webkit demo from here: static.garagegames.com/static/resources/T3DWebKitDemo.zip
Download the patch to Josh's webkit demo here: www.dropbox.com/s/90rphpylt11xcvg/t3d_webkit.zip
This includes Doug's round up of changes and tweaks to get it to work with Qt5
Copy the DLLs from Qt5.0.0-rc15.0.0-rc1msvc2010bin into your game folder
Copy the plugins folder from the same folder also into your game folder
You can skip the DLLs ending in 'd' unless you want to debug inside Qt or Webkit
Adjust $qtdir in buildFiles/config/project.conf to match your Qt install folder
Run generateProjects.bat
Re-open MSVC2010 and rebuild your solution
To view flash video you'll need the 'other browser' version of flash from here:
get.adobe.com/flashplayer/otherversions/
That's all you need to do to get webkit working from the binaries, if you want to tweak the source then read on...
There is some generally useful Qt5 build information here:
qt-project.org/wiki/Building_Qt_5_from_Git#0cc5cbb2903cf6911ac1b6e3aa032572
Source download qt5 rc1 is here: releases.qt-project.org/qt5.0/rc1/single/qt-everywhere-opensource-src-5.0.0-rc1....
Dependencies:
MS Visual Studio C++ 2010
Python: www.python.org/download/
Perl: www.activestate.com/activeperl/downloads
Add python and perl to PATH environment variable.
Open Visual C++ 2010 Command Prompt then run:
configure -release -opensource -platform win32-msvc2010
nmake
12/12/2012 (6:00 am)
Good news on the Qt WebKit front. Qt5 Webkit is now at RC1 and again supports flash video. Instructions... Building from binaries
Download and install the Windows binaries from here:releases.qt-project.org/qt5.0/rc1/qt-windows-opensource-5.0.0-rc1-msvc2010_32-x8...
(General download page is: qt-project.org/downloads if you want to try on a different platform)
Download Josh's original webkit demo from here: static.garagegames.com/static/resources/T3DWebKitDemo.zip
Download the patch to Josh's webkit demo here: www.dropbox.com/s/90rphpylt11xcvg/t3d_webkit.zip
This includes Doug's round up of changes and tweaks to get it to work with Qt5
Copy the DLLs from Qt5.0.0-rc15.0.0-rc1msvc2010bin into your game folder
Copy the plugins folder from the same folder also into your game folder
You can skip the DLLs ending in 'd' unless you want to debug inside Qt or Webkit
Adjust $qtdir in buildFiles/config/project.conf to match your Qt install folder
Run generateProjects.bat
Re-open MSVC2010 and rebuild your solution
To view flash video you'll need the 'other browser' version of flash from here:
get.adobe.com/flashplayer/otherversions/
That's all you need to do to get webkit working from the binaries, if you want to tweak the source then read on...
Building Qt5 WebKit from source
I haven't investigated yet whether Josh's fixes are still relevant to Qt5, but if you want to change how Qt5 is built or make any changes then you should be able to build from source.There is some generally useful Qt5 build information here:
qt-project.org/wiki/Building_Qt_5_from_Git#0cc5cbb2903cf6911ac1b6e3aa032572
Source download qt5 rc1 is here: releases.qt-project.org/qt5.0/rc1/single/qt-everywhere-opensource-src-5.0.0-rc1....
Dependencies:
MS Visual Studio C++ 2010
Python: www.python.org/download/
Perl: www.activestate.com/activeperl/downloads
Add python and perl to PATH environment variable.
Open Visual C++ 2010 Command Prompt then run:
configure -release -opensource -platform win32-msvc2010
nmake
#291
12/12/2012 (9:27 am)
Nice!
#292
01/30/2013 (9:22 am)
Thx 4 your work on this good job!
#293
I've followed the steps to do a binary build, and initially I was getting a build error about unable to open the Torque.rc file, which was not in the project directory for WebKitDemo DLL. Based on some forum comments here I fixed this by copying the Torque.rc file from the VS2008 build files and now I am able to compile successfully. However when I run the program and attempt to open the browser from the Demo mode, I am getting the below exception:
Unhandled exception at 0x10e69edb (WebKitDemo_DEBUG.dll) in WebKitDemo_DEBUG.exe: 0xC0000005: Access violation reading location 0x00000000.
The error is being thrown from this block of code:
void MatInstance::setTransforms(const MatrixSet &matrixSet, SceneRenderState *state)
{
PROFILE_SCOPE(MatInstance_setTransforms);
mProcessedMaterial->setTransforms(matrixSet, state, getCurPass());
}
Has anyone run across this before?
Profile: Win 7, VS2010, QT5
07/15/2013 (3:19 pm)
Need some help please:I've followed the steps to do a binary build, and initially I was getting a build error about unable to open the Torque.rc file, which was not in the project directory for WebKitDemo DLL. Based on some forum comments here I fixed this by copying the Torque.rc file from the VS2008 build files and now I am able to compile successfully. However when I run the program and attempt to open the browser from the Demo mode, I am getting the below exception:
Unhandled exception at 0x10e69edb (WebKitDemo_DEBUG.dll) in WebKitDemo_DEBUG.exe: 0xC0000005: Access violation reading location 0x00000000.
The error is being thrown from this block of code:
void MatInstance::setTransforms(const MatrixSet &matrixSet, SceneRenderState *state)
{
PROFILE_SCOPE(MatInstance_setTransforms);
mProcessedMaterial->setTransforms(matrixSet, state, getCurPass());
}
Has anyone run across this before?
Profile: Win 7, VS2010, QT5
#294
If anybody has any questions on replacing Qt with Awesomium ask away and I will try to answer them.
I have a question:
- Am trying to add Awesomium support into our game, which is an enhanced version of AFX 2.0 for T3D MIT 3.0 (enhanced meaning that we have several resources compiled in such as climbable objects, pathshape, 3d Radar/compass, etc)
- We currently have Qtwebkit4 support built-in and it works well, however Awesomium looks like it might provide additional features
- Correctly added in the Awesomium integration pack for T3D, code compiles successfully with no errors, but now the game just crashes on load
- My question is, does Awesomium conflict with Qtwebkit4? In other words do I need to strip out all the QT stuff do get Awesomium to work?
Thanks for any advice you can provide.
P
12/05/2013 (6:36 am)
Scott Burns wrote:If anybody has any questions on replacing Qt with Awesomium ask away and I will try to answer them.
I have a question:
- Am trying to add Awesomium support into our game, which is an enhanced version of AFX 2.0 for T3D MIT 3.0 (enhanced meaning that we have several resources compiled in such as climbable objects, pathshape, 3d Radar/compass, etc)
- We currently have Qtwebkit4 support built-in and it works well, however Awesomium looks like it might provide additional features
- Correctly added in the Awesomium integration pack for T3D, code compiles successfully with no errors, but now the game just crashes on load
- My question is, does Awesomium conflict with Qtwebkit4? In other words do I need to strip out all the QT stuff do get Awesomium to work?
Thanks for any advice you can provide.
P
#295
12/05/2013 (7:32 am)
I don't think they would conflict if the implementations are wholly separate. I can't say for certain since when we switched to Awesomium I completely stripped Qt out.
#296
Guess I will just have to do process-of-elimination to figure out the conflict - it could be QT or maybe Awesomium conflicts with AFX somehow.
Will try rebuilding minus the QT first, and if it still crashes will remove AFX and see if that works.
Hopefully it's QT that is the problem, as I would hate to have to choose between Awesomium and AFX, our project uses a lot of AFX effects and features.
Cheers
P
12/05/2013 (7:50 am)
Thanks Scott.Guess I will just have to do process-of-elimination to figure out the conflict - it could be QT or maybe Awesomium conflicts with AFX somehow.
Will try rebuilding minus the QT first, and if it still crashes will remove AFX and see if that works.
Hopefully it's QT that is the problem, as I would hate to have to choose between Awesomium and AFX, our project uses a lot of AFX effects and features.
Cheers
P
#297
I have Awesomium integration pack for T3D running alongside AFX without conflicts. Stripped Qt out completely as well, so you should be OK
12/05/2013 (3:07 pm)
Hey Paul,I have Awesomium integration pack for T3D running alongside AFX without conflicts. Stripped Qt out completely as well, so you should be OK
#298
Thanks for the info... So I have stripped out QT completely and now the EXE compiles and runs great!
I am able to run the demo and see all the browser windows in-game.
However, when I try to add the support into my own game, when I try to create a new AwShape in the game editor it comes up blank, and converting my existing QT WebCube textures to AwShapes doesn't work - they likewise just come up blank and transparent now, with an error in the console:
Material - MainViewScreen_Mat(9648) - Failed to load diffuse map art/interiors/Bridge/MainViewSreen/#MainViewScreenName for stage 0
Here is the code in the mission file to create the object:
new AwShape(MainViewEarth) {
shapeName = "art/interiors/Bridge/MainViewSreen/MainViewEarth.dts";
playAmbient = "1";
meshCulling = "0";
originSort = "0";
collisionType = "Visible Mesh";
decalType = "Visible Mesh";
allowPlayerStep = "1";
renderNormals = "0";
forceDetail = "-1";
position = "-158.162 -0.184202 105.815";
rotation = "0 0 1 56.1313";
scale = "0.523782 1 0.449224";
isSTControl = "0";
canSave = "1";
canSaveDynamicFields = "1";
};
And here is my materials.cs code for the DTS in question:
singleton AwTextureTarget(MainViewScreen) {
//Unique name for the texture target.
TextureTargetName = "MainViewScreenName";
OnGainMouseInputSound = "WebShapeOnGainMouseInputSound";
OnLoseMouseInputSound = "WebShapeOnLoseMouseInputSound";
// URL to the website or file on disk.
StartURL = "art/interiors/bridge/mainviewsreen/MainViewScrn.html";
Resolution = "1024 768";
UseBitmapCache = true;
};
singleton Material(MainViewScreen_Mat)
{
mapTo = "MainViewScrn";
diffuseMap[0] = "#MainViewScreenName";
specular[0] = "0 0 0 1";
specularPower[0] = "2";
emissive [0] = true;
translucentBlendOp = "None";
};
The DTS has a part to it labeled "MainViewScrn" where we used to render the QT Webkit texture to, it used to display the web page we would tell it to in the materials file.
I thought just by editing the materials to follow what was in the demo, that my web pages should just come up. But they do not, and throw the console error above.
Anybody have any ideas?
Many thanks for the help.
P
12/06/2013 (8:31 am)
Hey Joshua,Thanks for the info... So I have stripped out QT completely and now the EXE compiles and runs great!
I am able to run the demo and see all the browser windows in-game.
However, when I try to add the support into my own game, when I try to create a new AwShape in the game editor it comes up blank, and converting my existing QT WebCube textures to AwShapes doesn't work - they likewise just come up blank and transparent now, with an error in the console:
Material - MainViewScreen_Mat(9648) - Failed to load diffuse map art/interiors/Bridge/MainViewSreen/#MainViewScreenName for stage 0
Here is the code in the mission file to create the object:
new AwShape(MainViewEarth) {
shapeName = "art/interiors/Bridge/MainViewSreen/MainViewEarth.dts";
playAmbient = "1";
meshCulling = "0";
originSort = "0";
collisionType = "Visible Mesh";
decalType = "Visible Mesh";
allowPlayerStep = "1";
renderNormals = "0";
forceDetail = "-1";
position = "-158.162 -0.184202 105.815";
rotation = "0 0 1 56.1313";
scale = "0.523782 1 0.449224";
isSTControl = "0";
canSave = "1";
canSaveDynamicFields = "1";
};
And here is my materials.cs code for the DTS in question:
singleton AwTextureTarget(MainViewScreen) {
//Unique name for the texture target.
TextureTargetName = "MainViewScreenName";
OnGainMouseInputSound = "WebShapeOnGainMouseInputSound";
OnLoseMouseInputSound = "WebShapeOnLoseMouseInputSound";
// URL to the website or file on disk.
StartURL = "art/interiors/bridge/mainviewsreen/MainViewScrn.html";
Resolution = "1024 768";
UseBitmapCache = true;
};
singleton Material(MainViewScreen_Mat)
{
mapTo = "MainViewScrn";
diffuseMap[0] = "#MainViewScreenName";
specular[0] = "0 0 0 1";
specularPower[0] = "2";
emissive [0] = true;
translucentBlendOp = "None";
};
The DTS has a part to it labeled "MainViewScrn" where we used to render the QT Webkit texture to, it used to display the web page we would tell it to in the materials file.
I thought just by editing the materials to follow what was in the demo, that my web pages should just come up. But they do not, and throw the console error above.
Anybody have any ideas?
Many thanks for the help.
P
#299
However, I have no mouse input...
Joshua, is there anything you had to in AFX to get mouse input working on the AwShapes? Because for me AFX is trapping all the mouse inputs in its own GUI overlay.
Cheers
P
12/06/2013 (12:27 pm)
OK, so I figured out the texture issues and can see web pages now, you can ignore the post above :)However, I have no mouse input...
Joshua, is there anything you had to in AFX to get mouse input working on the AwShapes? Because for me AFX is trapping all the mouse inputs in its own GUI overlay.
Cheers
P
#300
I manage web controls via a manager/loader which results in Canvas.add() - so I know this works...but being AFX, the mouse inputs might simply be swallowed by the afxEventCatchAll control? That would be where I start looking.
if not, then maybe something like:
J
12/06/2013 (1:33 pm)
Hi Paul, I manage web controls via a manager/loader which results in Canvas.add() - so I know this works...but being AFX, the mouse inputs might simply be swallowed by the afxEventCatchAll control? That would be where I start looking.
if not, then maybe something like:
function sample()
{
Canvas.add(
new AwGui(AwesomiumSampleTest) {J
Associate Scott Burns
GG Alumni