1

Right now I have a scrollview with fa-pipe-from from the surfaces in it and that works fine, and I've tried a few ways to listen in on the events from the scrollview.

One way was to add a fa-pipe-to to the scrollview

<fa-scroll-view fa-pipe-from="resultsViewHandler" fa-pipe-to="scrollViewHandler">

pointing to event handler

$scope.scrollViewHandler = new EventHandler();

but no events are coming from this handler

$scope.scrollViewHandler.on("start",function( e ){
    console.log( e ); 
}); // is never called

I've seen in another stackoverflow - link - question which suggested a solution that didn't work:

$famous.find('fa-scroll-view')[0].renderNode.sync.on('start', function(event) {
    console.log('start');
});

Any suggestions on how to achieve this?

EDIT: Apparently fa-pipe-to is working as expected, but the scrollview isn't emitting all events. The events that do work are: onEdge, offEdge, settle, pageChange and you can use them by piping the scrollview to an empty event handler like described above and listening to these events on it. The events that don't work are: start, update, end, resize and unfortunately are the ones I need the most.

Community
  • 1
  • 1
jamwise
  • 165
  • 1
  • 1
  • 10
  • I have the exact same problem. I need to listen to scroll start: did you find a solution? – pasine Oct 15 '14 at 15:53
  • 1
    I didn't find a clean solution, but I decided to make a little add-on to famous-angular to be able to directly access the objects. https://github.com/i11ume/famous-object – jamwise Oct 15 '14 at 19:19
  • Thanks man, I'm going to use it. You should definitely report it in to famous-angular github. It can save a lot of time to many people. – pasine Oct 15 '14 at 21:53

1 Answers1

0

Hey I answered that question in the link

I gave my scrollview an ID

<fa-scroll-view id="footer-scrollview" fa-pipe-from="footerScrollHandler"></fa-scroll-view>

And was able to listen to the events like so:

var scrollView = $famous.find('#footer-scrollview')[0].renderNode,
                scrollViewHandler = scrollView.sync
            ;
            scrollViewHandler.on('start', function(event) {
                console.log('start');
            });

'update' and 'end' events worked too. I also used a 2nd scrollview somewhere else in the app (w/ a different ID) and using the same strategy and it worked fine

user1857711
  • 117
  • 2
  • 1
    I have discovered since the first post that this $famous.find doesn't work when using a router with templates, since all famous.find does it query the DOM, I think it's doing this before the content is rendered. – jamwise Oct 10 '14 at 20:02
  • are u using ui.router or ngRoute? Using ui.router, I wrapped
    within an and in my templated view's controller, was able to use $famous.find on my 2nd fa-scroll-view
    – user1857711 Oct 10 '14 at 20:08
  • Just tried, unfortunately didn't work. I need to have css animations between routes so I'm putting the fb-app within each template, so I wouldn't be able to wrap the whole thing in a fa-view anyway. – jamwise Oct 10 '14 at 20:14
  • interesting...sorry can't tell what's going on w/o seeing more code. I also had to decide whether to put fa-app in each view or wrap each view in fa-app. I went w/ the latter 'cuz more fa-apps means more work for famous. Doesn't leave much room for non-famo.us animations or even layouts though. Good luck! – user1857711 Oct 10 '14 at 20:20
  • @jamal If you know how many things will be rendered in your template, you can use $famous.find() after that many deploy events are fired. – trusktr Oct 13 '14 at 04:20
  • Unfortunately $famous.find() doesn't seem to work on templates rendered through the router at the moment. Which is my current setup. – jamwise Oct 13 '14 at 04:21