I need to consult properties of canvas element in HTML5. Specifically we need to detect if the canvas is truly visible in order to start a HTML5 game. Currently we have a game - you can see it at [url removed, login to view] covered by advertising. During this time the game starts and throws lot of errors since it is not really visible (it is in our iframe that is loaded to a div on other page and that div is not visible during advert).
Specifically the game throws errors:
[url removed, login to view] WebGL: INVALID_VALUE: texImage2D: no canvas
[.Offscreen-For-WebGL-000002D71AA0D0C0]RENDER WARNING: texture bound to texture unit 0 is not renderable. It maybe non-power-of-2 and have incompatible texture filtering.
I'm running simple check - I'm checking cssHeight of the canvas after a few seconds. If it is zero, I assume it was loaded in hidden DIV and I display button to reload the page (the iframe) by user action (click). But this is not a clean way, we need to avoid this step.
We need simple solution to detect if the canvas is really visible or not. Possibly even with some try/catch workaround BEFORE trying to start the game. We need simple function that will verify / test the canvas if it is ready and not hidden. We would call this function repeatedly in time intervals until the canvas will be ready to work without errors.
The errors shown above are related to WEBGL so the check must relate to webgl graphics/rendering.
Of course [url removed, login to view] or $("#c2canvas").is(":visible"); won't help in this case.
Assumed project price $100
20 freelancers are bidding on average $173 for this job
Hello sir/ma'am.. I have gone through your project domain..and i want to complete your project. I have 7 years of experience and i can complete your project within your budget.. Thankyou!..