Cross platform application embedding Webkit with WebGL support

Question

I need to create a cross platform (Win, Mac and Linux) application embedding a WebKit browser with HTML5 and WebGL support. So far I used Java/SWT way, however using webkit on windows is only partially possible (win32 only, safari 5 only) and has limited html5 support, no 3D at all.

In linux I successfully embedded webkit2gtk3 with WebGL support in vala like this:

using GLib;
using Gtk;
using WebKit;

public class Browser : Window {
    private const string URL = "http://lo-th.github.io/Oimo.js/index.html";

    public Browser() {
        this.add(this.create_web_window());

        this.destroy.connect(Gtk.main_quit);
    }

    private ScrolledWindow create_web_window() {
        var view = new WebView();
        view.get_settings().set_enable_webgl(true);
        view.load_uri(Browser.URL);

        var scrolled_window = new ScrolledWindow(null, null);
        scrolled_window.set_policy(PolicyType.AUTOMATIC, PolicyType.AUTOMATIC);
        scrolled_window.add(view);

        return scrolled_window;
    }

    public static int main(string[] args) {
        Gtk.init(ref args);

        var browser = new Browser();
        browser.resize(800,600);
        browser.show_all();

        Gtk.main();

        return 0;
    }
}

compiled with

valac --vapidir=. --pkg gtk+-3.0 --pkg webkit2gtk-3.0 --thread hellowebkit.vala

I also had success with python like this:

#!/usr/bin/env python

import gtk, webkit

w = gtk.Window()
w.set_title("Example Editor")
w.connect("destroy", gtk.main_quit)
w.resize(800,600)

scroll = gtk.ScrolledWindow()
w.add(scroll)

browser = webkit.WebView()
browser.get_settings().set_property("enable-webgl", True)
scroll.add(browser)

w.show_all()

browser.open("http://lo-th.github.io/Oimo.js/index.html");

gtk.main()

So the question now is: Is there any chance (and documentation) to get any of the above (compiling) and running in Win32/64 and OSX with WebGL support too?

Answer 1

Probably this could help

https://github.com/rogerwang/node-webkit

App runtime based on Chromium engine and node.js. Supports HTML5, CSS3, JS and WebGL. Did try it for a simpler project without WebGL, worked smooth. Very easy to setup too.

Check this slideshare, might help in deciding whether it is relevant

https://speakerdeck.com/zcbenz/node-webkit-app-runtime-based-on-chromium-and-node-dot-js

UPDATE: Found a couple of more alternatives to do similar stuff, not tried yet

1. https://github.com/milani/appjs
2. https://www.tidekit.com/

Another stackoverflow thread which might help Alternatives to node webkit? (filesize of importance)

Answer 2

Your Vala example uses WebKit2Gtk3. Unfortunately, WebKit2Gtk3 has not been ported to Windows yet. Citing Carlos Garcia Campos:

It's always been in our TODO list but as very low priority task, mainly due to the lack of windows knowledge, time and people interested. Any contribution to add windows support to WebKit2GTK+ would be more than welcome, of course.

Probably only solution is to hire a developer to work on this task :-(

---

I'm not sure which version of WebKitGtk is used in your Python example. WebKitGtk3 should work on Windows, WebKit2Gtk3 doesn't exist for Windows. However, I have no experience with running Python/GTK/WebKitGtk apps on Windows.