Web and WebWorks Development

[noCore]

Hi all ,

I was just wondering if there is a way to set the html5canvas to full screen ?.

Right now i am doing it with the following code

 g_canvas.setAttribute("width",  $(window).width() - 20);
    g_canvas.setAttribute("height",  $(window).height() - 20);

 but the problems i am facing with this is :

 In ripple and emulators it works perfectly fine , but when i loaded the program in an acual black berry ..

it works fine in portrait mode ... but when i flip it to landscape mode ... its bigger than the acuall viewport size .. thats cause the $(window).width() is updated correctly but the height remains same ... am i missing some thing ?

i have the following meta tag  too.

<metaname="viewport"content="height=device-height,width=device-width,t​argetuser-scalable=no,initial-scale=1.0"/>

thanks for any help.

[BertKoor]

Try this:

g_canvas.setAttribute("width", window.innerWidth - 20);
g_canvas.setAttribute("height", window.innerHeight - 20);

so just access the attributes, don't call the methods.

[astanley]

Good suggestion!

Would also want to make sure that your canvas sizing JavaScript is re-executed when the  screen orientation changes?  Doing so will ensure that the canvas is properly sized to the new screen width when you change between landscape and portrait?

One way of doing this is with the window.orientation object.  Demo here:

http://blackberry.github.com/WebWorks-Samples/kitchenSink/html/browser/orientation.html