in Famo.us, how do you pipe events to parent view from inside parent view

Question

I have a custom view that contains a surface. I am needing to pipe the surface events to the parent view. I can do this easily from outside the view, but how do I do this from inside the view? Here is my custom view with the code that does NOT work:

define([
    "famous/core/view",
    "famous/core/Surface",
    "famous/modifiers/StateModifier"
], function(View, Surface, StateModifier){

    function _createContainer() {
        var self = this;
        var container = new Surface({
            classes: ['blue-bg'],
            content: 'HERE IS A LOVELY BIT OF CONTENT FOR MY SURFACE'
        });
        // THIS DOESN'T WORK, BUT ILLUSTRATES WHAT I'M NEEDING TO DO:
        container.pipe(self);
        self.containerNode.add(container);
        self.form = container;
    }

    function FormView(){
        var self = this;
        View.apply(self, arguments);
        var containerMod = new StateModifier({
            size: self.options.size
        });
        self.containerNode = self.add(containerMod);
        _createContainer.call(self);
    }

    FormView.prototype = Object.create(View.prototype);
    FormView.prototype.constructor = FormView;

    FormView.DEFAULT_OPTIONS = {
        size: [300, 800]
    };

    return FormView;
});

Here is example code that does work, but that I want to do from inside the view:

var myView = new View();
mainContext.add(myView);

var surface = new Surface({
  size: [100, 100],
  content: 'click me',
  properties: {
    color: 'white',
    textAlign: 'center',
    backgroundColor: '#FA5C4F'
  }
});

myView.add(surface);

surface.pipe(myView);

can you give an example of what your trying to do like a real world example because I've got no clue from the code that doesn't work. IF I had to guess I'd say you can't just 'pipe' you need to do something like surface.on('click',function(data){this._eventOutput.emit('click',data)}.bind(this); — aintnorest, Nov 20 '14 at 07:21
well, the problem is, i'm adding this "FormView" to a scrollview, and i'm needing it to scroll. The only way i've gotten scrolling to work is to pipe the events from the surface scrollview. Since my FormView contains a surface, i need to first pipe the event from the surface to it's parent view (FormView), and then pipe from FormView to the scrollView I'm adding it to. Does that make sense? — Tyler Jones, Nov 20 '14 at 15:31

score 1 · Accepted Answer · answered Nov 20 '14 at 17:19

1

Inside your custom view FormView you need to pipe to the view's event handler. This will allow the view's events to be seen by a Scrollview when they are added to surfaces.

Change

container.pipe(self);

to

container.pipe(self._eventOutput);

answered Nov 20 '14 at 17:19

talves

13,993
5
40
63

one more question: which event is needing to be piped to the scrollview in order to allow scrolling? Can I explicitly send just that event with a broadcast to the event output? or do i have to pipe all events to the event output? – Tyler Jones Nov 20 '14 at 17:30
When you pipe your events to event output all events are piped to the view. Scrollview will see any events needed from the view to do scrolling. The specific events are [`scroll` and `touch`](https://github.com/Famous/famous/blob/develop/src/views/Scrollview.js#L85-L95). You do not have to emit those events, they will be seen by the Scrollview. – talves Nov 20 '14 at 17:36
Here is a **[working example](http://jsbin.com/hesuca/2/edit?js,output)** of your form view with some quick mods. – talves Nov 20 '14 at 17:57

in Famo.us, how do you pipe events to parent view from inside parent view

1 Answers1