Jump to content

Reimplementing the game GUI with HTML


Recommended Posts

Yeah I just looked at the wxWidgets docs it is limited but you can embed a full browser.


EMBEDDED WEB BROWSERS
Although wxHtmlWindow is a fantastic lightweight HTML viewer, sometimes you
need full web facilities in your application. Eventually wxWidgets will provide
a single class to embed an appropriate browser on each platform, but for now
there are different classes to achieve this.
On Mac OS X, wxWidgets comes with wxWebKitCtrl, which you need to
enable by passing --enable-webkit to configure when building wxWidgets.
On Linux, you can download wxMozilla (see Appendix E). Be warned that
your application distribution will swell by many megabytes if embedding
Mozilla.
On Windows, you can download wxIE (see Appendix E) to embed Internet
Explorer in your application. You can also consider using wxMozilla on
Windows.

but it may increase our download size significantly but I imagine any option will do the same.

Enjoy the Choice :)

Link to comment
Share on other sites

Yeah I just looked at the wxWidgets docs it is limited but you can embed a full browser.


EMBEDDED WEB BROWSERS
Although wxHtmlWindow is a fantastic lightweight HTML viewer, sometimes you
need full web facilities in your application. Eventually wxWidgets will provide
a single class to embed an appropriate browser on each platform, but for now
there are different classes to achieve this.
On Mac OS X, wxWidgets comes with wxWebKitCtrl, which you need to
enable by passing --enable-webkit to configure when building wxWidgets.
On Linux, you can download wxMozilla (see Appendix E). Be warned that
your application distribution will swell by many megabytes if embedding
Mozilla.
On Windows, you can download wxIE (see Appendix E) to embed Internet
Explorer in your application. You can also consider using wxMozilla on
Windows.

but it may increase our download size significantly but I imagine any option will do the same.

Enjoy the Choice :)

To be honest, what we need is not a browser, but rather an UI engine which understands HTML/CSS. Browsers come with a lot of cr*p that is of no use to us, like HTTP support, security models etc. Also, I doubt wxWidgets can even be used inside SDL.

Link to comment
Share on other sites

My main thing here is that it should support DOM. That way we can manipulate the HTML instead of just present it like a normal browser.

The Python interface of libRocket is modelled on DOM. Supposedly, "Rocket provides support for developing your own bindings to other scripting languages", so it should be possible to make it work with SpiderMonkey too.

Link to comment
Share on other sites

If the GUI was built on HTML and CSS I can defiantly work a lot more in that area and I know a couple people who could help too...

I think our best bet for an in-game rendering HTML/CSS layout engine would be Webkit. Its (compiled) size is only about 40Mb and It is (generally) the most standards compliant and up to date layout engine.

Edited by Josh
Link to comment
Share on other sites

If the GUI was built on HTML and CSS I can defiantly work a lot more in that area and I know a couple people who could help too...

I think our best bet for an in-game rendering HTML/CSS layout engine would be Webkit. Its (compiled) size is only about 40Mb and It is (generally) the most standards compliant and up to date layout engine.

Standards compliance isn't really an issue, since we're not building a web browser :)

Edited by zoot
Link to comment
Share on other sites

Instead of using a full fledged browser, I feel it might be better to use something like http://librocket.com/ which supports HTML and CSS, and is already integrated in many games...

Great suggestion! That's pretty exciting :) Looks like it only has one dependency, FreeType, unlike WebKit. It supports the platforms we want and then some (iOS / Android anyone?) The build process looks painless. We could continue using SDL and our custom render engine. The thing to note though is it's not a web browser, but just an interface between input and display components which happens to support HTML/CSS. I have no idea how JavaScript would interact with it (likely through a custom interface we have to write ourselves which isn't terrible, that's what we do currently).

Link to comment
Share on other sites

Standards compliance isn't really an issue, since we're not building a web browser :)

Yes, but its nice to have some of the latest features.

Great suggestion! That's pretty exciting :) Looks like it only has one dependency, FreeType, unlike WebKit. It supports the platforms we want and then some (iOS / Android anyone?) The build process looks painless. We could continue using SDL and our custom render engine. The thing to note though is it's not a web browser, but just an interface between input and display components which happens to support HTML/CSS. I have no idea how JavaScript would interact with it (likely through a custom interface we have to write ourselves which isn't terrible, that's what we do currently).

Well this is a step forward. Going through the RCSS property index, I think its quite doable. If it has media queries and a HTML interface, I think it might work. But if we're going to integrate it into the current SDL engine, why not just get Webkit?

Link to comment
Share on other sites

You know what I just realized, that would make it incredibly easy to try new fonts. Not only that, if it has any decent level of Unicode support at all, we could support translations to languages like Chinese, Arabic, Hebrew, without much trouble. I think?
It looks like it :-) http://librocket.com/wiki/documentation/Localisation

But do we know anyone brave enough to implement this?

Link to comment
Share on other sites

Yes, but its nice to have some of the latest features.

Well this is a step forward. Going through the RCSS property index, I think its quite doable. If it has media queries and a HTML interface, I think it might work. But if we're going to integrate it into the current SDL engine, why not just get Webkit?

Look at some of the features WebKit has: "Web Storage"? "Geolocation API"? Of what use is that to us? Or how can they be removed?

Link to comment
Share on other sites

EA (vade retro satana :balrog:) has apparently released the source code for the WebKit derived layout engine they used for parts of the UI in the console game Skate 3.

Presumably, they have cut out a lot of the crap that comes with vanilla WebKit.

Edit: This slide deck describe how they did it. Apparently, the main disadvantages they found were worse visual quality and memory consumption.

Edit2: If anyone wants to push for using HTML/CSS in the game, I suggest they make a helluva proof-of-concept first (to view in ordinary web browsers) to show that it actually can do what we need.

Edit3: Updated link.

Edited by zoot
Link to comment
Share on other sites

  • 7 months later...

I love the GUI of Zero-K (http://zero-k.info/) that uses the spring engine (originally from total annihilation). It's clean and occupies little space.

@FIFE: Have you played Unknown Horizons? I like the game concept and follow it's development. But the GUI is quite buggy (especially the configurable resource menu: The settings are not stored and it's not clear what you will hit with a click: The button or the game world).

Edited by FeXoR
Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...