Reload / Refresh an HTML page in a WebBrowser

UltraVox · Post by **UltraVox** » Mon Jun 01, 2015 5:29 am

Hello all,

I want to know how to Reload completely an HTML page in a WebBrowser ?

I make script changes in the HTML code (with FileWrite command) and I would completely reload the page after changes. But sometimes, with the "RefreshObject" command, the HTML page is not correctely reloading.

For you, what is the best method to be sure to fully reload a HTML page ? Code examples (NB and Java) would be appreciated.

Code: Select all

If "[CaseFloorSkyBox]" "=" "Checked"

   . Add floor in the SkyBox
   FileWrite "[PubDir]Data\3D\SkyBox\Skybox.html" "84" "    scene.add(floor);"
   
   . Refresh
   RefreshObject "Navigateur_Web5"
   

Else

   . Delete floor in the SkyBox
   FileWrite "[PubDir]Data\3D\SkyBox\Skybox.html" "84" "    // scene.add(floor);"
   
   . Refresh
   RefreshObject "Navigateur_Web5"

EndIf

The "RefreshObject" don't work here

Thank you for your answers.

UltraVox

Gaev · Post by **Gaev** » Mon Jun 01, 2015 6:27 am

UltraVox:

1) The // and ( ) might be causing unexpected text to be written to line 84.

a) using notepad.exe, check the contents of the file (Skybox.html)to make sure that line 84 has changed AS EXPECTED.

If not, try using Exclamation Mark ! in your FileWrite commands ...

Code: Select all

FileWrite "[PubDir]Data\3D\SkyBox\Skybox.html" "84" "!    scene.add(floor);"

and

FileWrite "[PubDir]Data\3D\SkyBox\Skybox.html" "84" "!    // scene.add(floor);"

2) If that does not do it, verify that line 84 is being invoked after a Refresh by temporarily placing an alert command after line 84 ... that shows the content of variable floor (if possible).

3) If the problem is that the refereshed file is NOT being used when you do the RefreshObject command, it could be that, because the name of the HTML file referenced by the WebBrowser object has not changed, somehow it assumes that nothing needs to be re-rendered.

So, you may have to fool the system by ...

- changing the file name associated with the WebBrowser object to something else
- doing a RefreshObject command
- changing the file name associated with the WebBrowser object back to Skybox.html
- doing a RefreshObject command

UltraVox · Post by **UltraVox** » Mon Jun 01, 2015 6:42 am

Hello Gaev. Thank you for your availability !

I confirm you that the FileWrite command written data correctly in the HTML file. I opened Notepad++, the code changes in real-time.

I wondered if there was a JavaScript to empty the Internet Temporary Files (for I.E) before RefreshObject ? Will it not be more simple than renaming the file permanently ?

Thank you.

UltraVox · Post by **UltraVox** » Mon Jun 01, 2015 6:53 am

To try it, I added the Navigation bar in the Webbrowser. I need to refresh the page 2 or 3 times, manually, to make it work. It's weird... the RefreshObject should work, and yet...

I need a JavaScript to empty the ITF. But I hardly know anything about the use of JavaScript with NB. It's the first time.

Gaev · Post by **Gaev** » Mon Jun 01, 2015 7:37 am

UltraVox:

I tried this ...

Code: Select all

FileWrite "[PubDir]abcd.htm" "7" "wxyz"
RefreshObject "WebBrowser5"

... and it re-rendered the contents of the WebBrowser object as expected.

This also works ...

Code: Select all

SetVar "[thisFile]" "!C:\gk\Neo5\gkLab\abcd.htm"
FileWrite "[thisFile]" "7" "ppppwxyz"
RefreshObject "WebBrowser5"

... where [thisFile] is defined as the Internet Address or HTML File: property for WebBrowser5

So, it must be something within your HTML/Javascript that is not working as expected ... can you load this file somewhere on the web (so we can examine it) ? ... if it is not too big, you can post it (as code) within this forum.

UltraVox · Post by **UltraVox** » Mon Jun 01, 2015 8:17 am

This is the Skybox.html page.

All elements 'src="js' are all OK in the 'js' folder. It works well locally, but much less well in NeoBook. I added 3 META to manage CACHE, but it changes nothing.

This is now pointless.

Code: Select all

<script src="js/THREEx.FullScreen.js"></script>

Skybox.html content :

Code: Select all

<!doctype html>
<html lang="en">
<head>
	<title>Skybox</title>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0">
        <meta http-equiv="Pragma" content="no-cache" />
        <meta http-equiv="Cache-Control" content="no-cache, must-revalidate" />
        <meta http-equiv="Cache" content="no store" />
        <meta http-equiv="Expires" content="0" />
</head>
<body>

<script src="js/Three.js"></script>
<script src="js/Detector.js"></script>
<script src="js/Stats.js"></script>
<script src="js/OrbitControls.js"></script>
<script src="js/THREEx.KeyboardState.js"></script>
<script src="js/THREEx.FullScreen.js"></script>
<script src="js/THREEx.WindowResize.js"></script>


<div id="ThreeJS" style="position: absolute; left:0px; top:0px"></div>
<script>

// MAIN

// Standard Global Variables
var container, scene, camera, renderer, controls, stats;
var keyboard = new THREEx.KeyboardState();
var clock = new THREE.Clock();
// Custom Global Variables
var cube;

init();
animate();

// FUNCTIONS 		
function init() 
{
	// SCENE
	scene = new THREE.Scene();
	
	// CAMERA
	var SCREEN_WIDTH = window.innerWidth, SCREEN_HEIGHT = window.innerHeight;
	var VIEW_ANGLE = 45, ASPECT = SCREEN_WIDTH / SCREEN_HEIGHT, NEAR = 0.1, FAR = 20000;
	camera = new THREE.PerspectiveCamera( VIEW_ANGLE, ASPECT, NEAR, FAR);
	scene.add(camera);
	camera.position.set(0,150,400);
	camera.lookAt(scene.position);	
	
	// RENDERER
	if ( Detector.webgl )
		renderer = new THREE.WebGLRenderer( {antialias:true} );
	else
	        renderer = new THREE.CanvasRenderer(); 
	renderer.setSize(SCREEN_WIDTH, SCREEN_HEIGHT);
	container = document.getElementById( 'ThreeJS' );
	container.appendChild( renderer.domElement );
	
	// EVENTS
	THREEx.WindowResize(renderer, camera);
	// THREEx.FullScreen.bindKey({ charCode : 'm'.charCodeAt(0) });
	
	// CONTROLS
	controls = new THREE.OrbitControls( camera, renderer.domElement );
	
	// STATS
	// stats = new Stats();
	// stats.domElement.style.position = 'absolute';
	// stats.domElement.style.bottom = '0px';
	// stats.domElement.style.zIndex = 100;
	// container.appendChild( stats.domElement );
	
	// LIGHT
	var light = new THREE.PointLight(0xffffff);
	light.position.set(0,250,0);
	scene.add(light);
	
	// FLOOR
	var floorTexture = new THREE.ImageUtils.loadTexture( 'images/checkerboard.jpg' );
	floorTexture.wrapS = floorTexture.wrapT = THREE.RepeatWrapping; 
	floorTexture.repeat.set( 10, 10 );
	var floorMaterial = new THREE.MeshBasicMaterial( { map: floorTexture, side: THREE.DoubleSide } );
	var floorGeometry = new THREE.PlaneGeometry(100, 100, 10, 10);
	var floor = new THREE.Mesh(floorGeometry, floorMaterial);
	floor.position.y = -0.5;
        scene.add(floor);
	
	////////////
	// CUSTOM //
	////////////
	
	// axes
	var axes = new THREE.AxisHelper(100);
	scene.add( axes );
	
	var imagePrefix = "images/dawnmountain-";
	var directions  = ["xpos", "xneg", "ypos", "yneg", "zpos", "zneg"];
	var imageSuffix = ".png";
	var skyGeometry = new THREE.CubeGeometry( 5000, 5000, 5000 );	
	
	var materialArray = [];
	for (var i = 0; i < 6; i++)
		materialArray.push( new THREE.MeshBasicMaterial({
			map: THREE.ImageUtils.loadTexture( imagePrefix + directions[i] + imageSuffix ),
			side: THREE.BackSide
		}));
	var skyMaterial = new THREE.MeshFaceMaterial( materialArray );
	var skyBox = new THREE.Mesh( skyGeometry, skyMaterial );
	scene.add( skyBox );
	
}

function animate() 
{
    requestAnimationFrame( animate );
	render();		
	update();
}

function update()
{
	if ( keyboard.pressed("z") ) 
	{ 
		// do something
	}
	
	controls.update();
	stats.update();
}

function render() 
{
	renderer.render( scene, camera );
}

</script>
</body>
</html>

Gaev · Post by **Gaev** » Mon Jun 01, 2015 9:30 am

UltraVox:

I am assuming that you have changed line number (in FileWrite) from 84 to 88 to reflect the changes you made since first post here.

Try this code (instead of RefreshObject) ...

Code: Select all

BrowserExecScript "Navigateur_Web5" "location.reload(true);" "JavaScript"

UltraVox · Post by **UltraVox** » Mon Jun 01, 2015 9:37 am

After many unsuccessful tests, I'll try your solution : rename the file (.html / .htm).

For information, the page I copied does not work directly in my UI NB app. But when I insert it in a large window of my NB app (CustomWindow), it works well (but I still can not update the page with RefreshObject)...

There really has a bad interaction between Three.js and NeoBook. In local, if I activate the Stats.js module, I am at 60 FPS. In NB, I fall to 20 FPS...

Something in NB prevents Three.js to function normally.

PS : Gaev, OK, I try now your last solution.

Gaev · Post by **Gaev** » Mon Jun 01, 2015 9:40 am

UltraVox:

It works well locally, but much less well in NeoBook

Can you do the following ...

- start with file containing " // scene.add(floor);"
- render it in your IE Browser
- verify that it renders as expected
- change content of file (using notrepad++) to " scene.add(floor);"
- press the Reload/Refresh key
- verify that it renders as expected

UltraVox · Post by **UltraVox** » Mon Jun 01, 2015 10:05 am

Gaev,

That's the first thing I made : testing locally with IE.
The answer is Yes, the refresh-update works perfectly locally, with IE, Firefox and Chrome. Not with NB.

I just tested your JavaScript, and either, it does not work. There is no reaction of the WebBrowser in NB.

I'll have to rename the file, hoping it will work...
Thank you very much for your help. You are really nice !

Gaev · Post by **Gaev** » Mon Jun 01, 2015 10:46 am

UltraVox:

That's the first thing I made : testing locally with IE.
The answer is Yes, the refresh-update works perfectly locally, with IE, Firefox and Chrome. Not with NB.

Yes, but did you start with the command commented out ... and then change it to non-commented command ? ... perhaps your javascript works/renders the same with/without that command.

1) Instead of commenting the line, try and replace it with something like ...

Code: Select all

alert(12345);

... in your HTML file to verify that the new file is being used when being refreshed from NeoBook.

2) Since everything works for me (using a simple HTML file with just content of "abcd" changed to "pqrs") ... and since my IE version is different from yours, you can try a test with a simple html file that looks like ...

Code: Select all

<html>

<head>
</head>

<body>
abcd
</body>

</html>

... and then change line 7 to "pqrs" ... followed by a RefreshObject ... see if it works in your environment.

UltraVox · Post by **UltraVox** » Mon Jun 01, 2015 12:24 pm

Gaev,

Obviously, it works. There is no reason why it does not work : the page is almost empty.
Let me give you two visual examples of my problem (with all files in Local mode).

1/ With this, the "RefreshObject" works in NeoBook :
http://threejs.org/examples/#webgl_geometry_cube
I can change everything without any problems.

2/ With this, the "RefreshObject" don't work in NeoBook :
http://threejs.org/examples/#webgl_shaders_ocean

This is the same technology, in both cases. It's just an HTML file that calls the JavaScript resources. Three.js is just a JavaScript Library. But, If there is a SkyBox, the RefreshObject does not work in NB. There is no reason for that. And it's not normal to lose between 40 FPS with the first experience (IE locally), and the second (and same) experience, but with NB.

Curious and annoying for my program.

Gaev · Post by **Gaev** » Mon Jun 01, 2015 1:38 pm

UltraVox:

Obviously, it works. There is no reason why it does not work : the page is almost empty.

1) The fact that it works has nothing to do with "how empty the page is".

2) The objective here was to try and figure out "where it stops working for you" ... we can surmise from your response that ...

- NeoBook's RefreshObject command works in your environment (Windows 8 and IE 11) ... i.e. NeoBook is able to tell IE 11 to Refresh the contents ... and IE 11 is correctly doing it using the updated file contents on disk.

- the problem lies with "the servicing of the html/javascript in the changed file".

Let me give you two visual examples of my problem (with all files in Local mode).

1/ With this, the "RefreshObject" works in NeoBook :
http://threejs.org/examples/#webgl_geometry_cube
I can change everything without any problems.

2/ With this, the "RefreshObject" don't work in NeoBook :
http://threejs.org/examples/#webgl_shaders_ocean

This is the same technology, in both cases. It's just an HTML file that calls the JavaScript resources.

Firefox ...

- shows just a black canvas for the first one
- tells me "my video card does not support WebGL" for the second one

Chrome renders both ... perhaps my slow computer, perhaps due to lack of capable video card, but it took a long time for the animation to show up.

Three.js is just a JavaScript Library. But, If there is a SkyBox, the RefreshObject does not work in NB. There is no reason for that.

Debugging in an environment with 3 different technologies (NeoBook, IE 11, your javascript library) requires you to carry out your investigation "one step at a time" ... in a methodical/logical manner.

So, the next step would be to ...

a) have two files on disk ... one with the (scene.add(floor);) command ... the other with the (alert(12345);) command ... composed with notepad++

b) instead of doing a FileWrite from NeoBook, just change the name of the file associated with the WebBrowser object

... tell us if the rendering was as expected.

And it's not normal to lose between 40 FPS with the first experience (IE locally), and the second (and same) experience, but with NB.

I do not have expertise with video cards ... but this could perhaps be due to ...

- the video card NOT being used for rendering when going through NeoBook

- an automatic dumbing down of the FPS because of the inability to handle the higher load

UltraVox · Post by **UltraVox** » Mon Jun 01, 2015 10:43 pm

Hi Gaev,

a) have two files on disk ... one with the (scene.add(floor);) command ... the other with the (alert(12345);) command ... composed with notepad++

b) instead of doing a FileWrite from NeoBook, just change the name of the file associated with the WebBrowser object

... tell us if the rendering was as expected.

That's impossible. The moment "CustomWindow" appears, my NB app freezes. My only choice is to close the CustomWindow with the red cross at the top right of the screen. I can look around me, in 3D, in the skybox, but I can do nothing else. Worse, if I make up the SkyBox in a WebBrowser directly in my app (without CustomWindow), any application freezes. I have to do CTRL+ALT+DEL to end the app.

I tried Alertbox :

Code: Select all

If "[Floor]" "=" "Checked"
   AlertBox "Checked" "Checked"
   FileWrite "[PubDir]Data\3D\SkyBox\Skybox.html" "74" "    scene.add(floor);"
   AlertBox "FileWrite" "FileWrite add floor"
   RefreshObject "Navigateur_Web5"
   AlertBox "Refresh" "Refresh"
Else
    AlertBox "Unchecked" "Unchecked"
    FileWrite "[PubDir]Data\3D\SkyBox\Skybox.html" "74" "    // scene.add(floor);"
    AlertBox "FileWrite" "FileWrite del floor"
    RefreshObject "Navigateur_Web5"
    AlertBox "Refresh" "Refresh"
EndIf

But to reveal the Alertbox's, I am forced to close the CustomWindow

As long as CustomWindow is open, there is no Alertbox.

- the video card NOT being used for rendering when going through NeoBook

- an automatic dumbing down of the FPS because of the inability to handle the higher load

Possibly yes.
Is Dave can respond to this suggestion ?

UltraVox · Post by **UltraVox** » Tue Jun 02, 2015 1:24 am

I did a test with a new temporary application, in which I do the same thing in my application. And surprise ? This is worse than the first application: there is absolutely nothing that works...

Here is my application for download (.exe , .pub , images , .js , all...) :
http://we.tl/WjCtOcTM9s

If you manage to see something other than "INDEX PAGE, SKYBOX PAGE, CUBEMAP PAGE", then we can move forward. Test the local page with IE, Firefox and Chrome. They work perfectly. In NB, nothing...

Thank you for your help.

Archived NeoSoft Support Forum

Reload / Refresh an HTML page in a WebBrowser

Reload / Refresh an HTML page in a WebBrowser

Re: Reload / Refresh an HTML page in a WebBrowser

Re: Reload / Refresh an HTML page in a WebBrowser

Re: Reload / Refresh an HTML page in a WebBrowser

Re: Reload / Refresh an HTML page in a WebBrowser

Re: Reload / Refresh an HTML page in a WebBrowser

Re: Reload / Refresh an HTML page in a WebBrowser

Re: Reload / Refresh an HTML page in a WebBrowser

Re: Reload / Refresh an HTML page in a WebBrowser

Re: Reload / Refresh an HTML page in a WebBrowser

Re: Reload / Refresh an HTML page in a WebBrowser

Re: Reload / Refresh an HTML page in a WebBrowser

Re: Reload / Refresh an HTML page in a WebBrowser

Re: Reload / Refresh an HTML page in a WebBrowser

Re: Reload / Refresh an HTML page in a WebBrowser