Welcome!

Welcome to the official BlackBerry Support Community Forums.

This is your resource to discuss support topics with your peers, and learn from each other.

inside custom component

Web and WebWorks Development

Reply
Highlighted
Retired
Posts: 1,561
Registered: ‎04-12-2010
My Device: BlackBerry Z10
My Carrier: Bell

Re: Problem loading game project in BlackBerry 7 Simulator

Ah, so I think I've narrowed this down.

The application is leveraging window.requestAnimationFrame which actually wasn't supported until PlayBook 2.1:
https://developer.blackberry.com/bbos/html5/documentation/requestanimationframe.html

BlackBerry 10 also supports this, but not legacy BBOS:
http://caniuse.com/requestanimationframe

Unfortunately, this won't run on BBOS as-is with window.requestAnimationFrame.

You could try a polyfill as discussed here that relies on setTimeout instead:
http://www.paulirish.com/2011/requestanimationframe-for-smart-animating/

This looks to be an updated version of the same:
https://gist.github.com/paulirish/1579671

Erik Oros | @WaterlooErik | eoros@blackberry.com | Developer Issue Tracker

If a reply has answered your question, please click Accept as Solution to help other visitors in the future.
New Contributor
Posts: 6
Registered: ‎05-09-2014
My Device: Developer/non-BlackBerry User
My Carrier: none

Re: Problem loading game project in BlackBerry 7 Simulator

Okay, it now works in the simulator but there's HUGE lag when playing it. In my assumption, almost 5-10 frames per second. 

 

The polyfill was the solution to this, and when the game runs, it only shows 1/3 of the whole canvas. I might figure out the solution on my own. Thanks for the help. 

 

Here's how I did it:

function run() {
	/*var loop = function() {
		update();
		render();
		window.requestAnimationFrame(loop, canvas);
	}
	window.requestAnimationFrame(loop, canvas);*/

	var mainloop = function() {
        update();
		render();
    };

    var animFrame = window.requestAnimationFrame ||
            window.webkitRequestAnimationFrame ||
            window.mozRequestAnimationFrame    ||
            window.oRequestAnimationFrame      ||
            window.msRequestAnimationFrame     ||
            null ;

    if ( animFrame !== null ) {
        var recursiveAnim = function() {
            mainloop();
            animFrame( recursiveAnim, canvas );
        };

        // start the mainloop
        animFrame( recursiveAnim, canvas );
    } else {
        var ONE_FRAME_TIME = 1000.0 / 60.0 ;
        setInterval( mainloop, ONE_FRAME_TIME );
    }
}

 The commented codes are the syntaxes for the original main loop of the game. In the new game loop, I only added render(); and update(); inside the var mainloop function.

 

 

 

Thanks again, marking this thread SOLVED.