Web and WebWorks Development

[superfly_fr]

BB10 Webworks + BBui.js / DevAlpha

I'm currently developing a game based on touch events.

While my screen size is set to fit devAlpha in lanscape (1280X760 : height minus 8px), the screen scrolls up/down when I "touch and move" a finger on devAlpha. I want to prevent this.

I have read several threads about this (including Adam's) and also read some examples comments, so that I tried these "solutions" with no luck.

- Viewport meta definition (in index file) : no height specified.

<meta name="viewport" content="initial-scale=1.0,width=device-width,user-scalable=no,target-densitydpi=device-dpi" />

 - "Inhibitor" script ( attempt #1 : first script "as-is" in my main pushed screen script ".JS" file )

/* ---------------
 * disable scroll 
 * ---------------*/
        preventMove = function(evt) {
           evt.preventDefault();
           window.scroll(0, 0);
           return false;
        };
        document.addEventListener('touchmove', preventMove, false);

 - Inhibitor script (attempt #2 : function in my ".JS" file but event listener added to the "ondomready" event within the bb.init() function in the index page.

in my JS file (no event listener added)

/* ---------------
 * disable scroll 
 * ---------------*/
        preventMove = function(evt) {
           evt.preventDefault();
           window.scroll(0, 0);
           return false;
        };

 in the bb.init(); event listener added when dom is ready (my main screen id is 'home')

				// Fires "after" styling is applied and "after" the screen is inserted in the DOM
				ondomready : function(element, id) {
					if (id == 'dataOnTheFly') {
						dataOnTheFly_initialLoad(element);
					} else if (id== 'home') {
                       document.addEventListener('touchmove', preventMove, false);
                    }
				}

(I must admit I'm probably lost in the DOM ...)

- finally, since my app use divs that fires a function on "ontouchstart" event, I added the "event" parameter in the function call and added a "preventDefault()" as the first line of the script.

One div example in my home.htm page

<img id="lPrint" src="images/pouceG.png" width="175" height="265" ontouchstart="thumbSensor('sL',1,event)">

 thumbsensor script :

    thumbSensor = function(place,state,evt) {
        currLR = place;
        // what pad/dock
        window[place] = state;
        // what's its value
    
        /* ------------------------------------------
         *  thumbs dock / started / thumb ITA states 
         * ------------------------------------------ */
            if(evt = 'ontouchstart'){ // prevent scrolling
                alert('onTS'); // => Testing, and Yes, it is displayed right//
                evt.preventDefault();
                window.scroll(0,0);
                return(false);            
            }
[...]
}

When I check the Chrome console using the last option, this is what I get (side note: why the webworks ready event is fired so many times - about 10 ?) :

Now, I believe either I missed something big (probably) or the proper way to do so or ...
Can someone help ?

[LBP]

For me this is an issue I requested for in bbUI.js since I think it has to do with the "bounce" of the iScroll used on each screen. This setting is "true" by default, so every single screen using iScroll is bouncing outside of the boundaries of the screen, also if the screens height isn't as high as the device height.

[superfly_fr]

Thanks LBP. Is there a way we can disable iScroll?

[LBP]

Maybe the only thing to be done is to overwrite the bounce effect of iScroll to be false by default in this line (7010) in github next version of bbUI.js.

[tneil · Accepted solution]

If you need to override touch events in bbUI you will have to turn of screen scrolling effects using  data-bb-scroll-effect="off" on the screen element: https://github.com/blackberry/bbUI.js/wiki/Screens

Currently iScroll is used for scrolling effects and will be taking over touch inputs for scrolling of a screen.

[superfly_fr]

I missed it big. Thank you Tim.

As for my problem, please note Tim's solution will allow to use the simple script option, as described in Adam's post.