Show "Loading.." text while main.js is loading

Monkey Targets Forums/HTML5/Show "Loading.." text while main.js is loading

HPM(Posted 2015) [#1]
Hey all,

I have a rather large main.js file, which is being distributed via WAN; this means that it can takes some seconds before Monkey comes in effect. I want to show the user something during that time in the Canvas-area (a simple "Loading.." will do), but can not figure out how to do this.. can anybody help me with this ?

TIA! :)

Harry


TeaBoy(Posted 2015) [#2]
You could try using the OnLoading() method provided by Monkey.

Seems to work ok for me.

Method OnLoading()
  DrawText("Loading... Please Wait...", DeviceWidth()/2, DeviceHeight()/2, 0.5, 0.5)
End Method



HPM(Posted 2015) [#3]
Thanks for this TeaBoy, but that doesn't solve it (I tried it to be sure ;) ). I am trying to bridge the time it takes to download the main.js (which is by now over 1MB, and can take a couple of secs to load when coming from the Web), so I suspect Monkey itself cannot really solve this: I basically want the html <DIV> to show some text before its canvas is taken over by the main.js code. I just don't have a clue on how to do that in the HTML (I'm quite nooby with Javascript).


Jesse(Posted 2015) [#4]
look for a specific example from the diddy module. I believe it has an example on how to do that. The drawback is that you have to use the diddy module. there is a thread on the modules forum that discusses it. The first page shows where to download it from.


Jesse(Posted 2015) [#5]
.


impixi(Posted 2015) [#6]
A bit annoying but can be done like this (I think):

Insert the following html into the generated MonkeyGame.html file (or the template file targets\html5\template\MonkeyGame.html)
just after the <body> tag.
<div id="msgPreload" style="position: absolute; width: 100%;">Preloading, please wait...</div>


..

Create the following javascript code file in your game code directory:

preloadmsg.js
function RemovePreloadMsg()
{
	var div = document.getElementById('msgPreload');
	if (div) div.remove();
}


..

In your main monkey code file call the RemovePreloadMsg() function just before you create your mojo app.

Example:



..

EDIT: RemovePreloadMsg() might need to go in the OnCreate() method of your mojo app?

..


HPM(Posted 2015) [#7]
Yes Impixi, that does the trick (in the Main is enough)!

Thanks! :)