Porting HTML 5 page to a webBrowser object in winforms

Question

I'm trying to port THIS pasge and its HTML5 animation to a winform. What I did is copied and added the index.html and all the css and js file to my project. This is how my project directory looks like

And then I'm trying to load the html file into my webbrowser object using this code snippet

private void Form1_Load(object sender, EventArgs e)
    {
        string curDir = Directory.GetCurrentDirectory();
        this.webBrowser2.Url = new Uri(String.Format("file:///{0}/index.html", curDir));
    }

And I have set properties of all the file to Copy Always Now when I run the project I get a script error message and upon pressing Yes it loads the page but only background is displayed and the animation is lost!

please help!

PS: I've changed

<link href="css/main.css" rel="stylesheet" type="text/css" />
        <script src="js/ThreeWebGL.js"></script>
        <script src="js/ThreeExtras.js"></script>

To

<link href="main.css" rel="stylesheet" type="text/css" />
    <script src="ThreeWebGL.js"></script>
    <script src="ThreeExtras.js"></script>

in index.html file

Screenshots of two script error that I'm getting--

It works in IE10

Answer 1

The *.js files need to be in a js folder. Either create the folder and move them or edit the html file.

EDIT1: Does it work if you point it to " http://www.script-tutorials.com/demos/177/index.html "?

EDIT2: Add:

<meta http-equiv="X-UA-Compatible" content="IE=Edge" />

in the html head section.

EDIT3:

I tried on my machine and it's the same behavior. But the page does run fine in Internet Explorer 11. Maybe the WinForms control uses IE engine in some compatibility mode. I would use http://www.awesomium.com/

Answer 2

The webbrowser control is just an instance of IE - that page doesn't work for me in Internet Explorer so it's unlikely to work in the embedded browser. Search for webkit net - might give you better results. I'm tempted to ask why you want to do this but I'm sure you've got a good reason.

Answer 3

Got it working! Basically the set up works fine. Just had to open main.css file and comment out all the footer properties to get rid of the footer and found another script ref which was pointed to js/script.js had to change it to script.js

Now how can i increase the framerate so that it doesnt stutter? Theres a lag at the moment