Add support for mouse scrolling (for development)

[smerickson]

It would be really helpful if there was a way to enable mouse scrolling during development. I will often develop my mobile apps on my desktop browser and I'd like to be able to just use my mouse scroll wheel to scroll some elements, rather than clicking, holding and moving the mouse. Any plans to just wire up mouse scroll events to the scroller for testing purposes?

[mitchellsimoens]

Why? Don't you want to emulate what your attending audience will be doing?

[smerickson]

I find it too cumbersome and time consuming to refresh my iphone every time i want to test a change. and if I use a mobile browser emulator on my desktop, it just feels weird to click and hold the mouse and drag to scroll a list. you're right that I definitely will be testing things on a real mobile device before shipping it, but during the first few rapid iterations of a change, it would be nicer and faster to just work with it on the desktop.

[mitchellsimoens]

I do not mean to offend you and I can respect that everyone has their own development method but I just think it's trivial. IMO

[gwan]

Hi,

Sorry to reactivate this thread but I would like to know if it's possible to use mouse scrolling for any component in sencha touch.

I think that sencha touch could be a great framework to create a multi-device application, working both on mobile device or on desktop browser. But, because I do not succeed to use my mouse to scroll on any component I can reach properly my goal.

You did great job on this framework and I know that it is not your priority right now but if you know a hack to do so, it would be great to help me.

Thanks.

[Alex Vangelov]

I'm using coffeescript but the idea is visible:

app.body.on('mousewheel', (event,el) ->       
      offset = Ext.util.Offset()
      while (el != document.body) 
        if el.className == "x-scroller"
          scroller = Ext.ScrollManager.get(el.id);
          if event.browserEvent.wheelDelta > 0
            # scrollUp(scroller)
          else 
            # scrollDown(scroller)
          break
        el = el.parentNode
    )

Who can help with nice elastic scroll functions?
Also there is a problem .. have to click in the scroll area to activate scroller for the first time

[Alex Vangelov]

Coffeescript:

app.body.on('mousewheel', (event,el) -> 
      offset = Ext.util.Offset()
      while (el != document.body) 
        if el.className.indexOf("x-scroller-parent") > 0
            scroller = Ext.ScrollManager.get(el.firstChild.id)
            if scroller
              scroller.fireEvent('scrollstart', scroller, event)
              offset.y = event.browserEvent.wheelDelta
              scroller.scrollBy(offset,true)
              scroller.snapToBoundary(true)
              scroller.fireEvent('scrollend', scroller, offset)
              break
        el = el.parentNode
    )

Javascript:

app.body.on('mousewheel', function(event, el) {
        var offset, scroller, _results;
        offset = Ext.util.Offset();
        _results = [];
        while (el !== document.body) {
          if (el.className.indexOf("x-scroller-parent") > 0) {
            scroller = Ext.ScrollManager.get(el.firstChild.id);
            if (scroller) {
              scroller.fireEvent('scrollstart', scroller, event);
              offset.y = event.browserEvent.wheelDelta;
              scroller.scrollBy(offset, true);
              scroller.snapToBoundary(true);
              scroller.fireEvent('scrollend', scroller, offset);
              break;
            }
          }
          _results.push(el = el.parentNode);
        }
        return _results;
      });

[Alex Vangelov]

if (/\x-scroller(?!-parent)\b/).test(el.className)
scroller = Ext.ScrollManager.get(el.id)

[titanjer]

as title!
panel has no mousewheel event in sencha touch 2. how can i do?!

Thanks

[zardinuk]

I agree with gwan, I just want my apps to run in a desktop browser with two-touch. I use sencha touch because it works better on an ipad, not because I'm building specifically for ipad. Would like to see a global config option or something to allow two-finger-touch. I actually think it should be the default, unless there is some compelling reason why the mousewheel event should be ignored. I imagine there are some tablets with a mousewheel.

I'm using sencha touch 2 the above code snippet doesn't work for me. I am currently attempting a hack will post here if I'm successful.