Solution needed for displaying unknown number of unknown types of subviews

[joezimjs]

Consider a page with a customizable sidebar: you can add, delete, and rearrange any number of modules in that sidebar. All the modules do something different, otherwise there'd be no reason to have more than one module.

LayoutView has a determinate number of Regions, so it can't help when you have an indeterminate number of views to show in that area. You can always use addRegion, but unless you customize that method, there's nothing to attach that new Region to.

CollectionView and CompositeView can help with an unknown number of views, but all the views have to be the same.

What we're looking for is the ability to append a view inside a container that holds any number of views of any type. My current solution is a Region that can hold an array of views.

[cmaher]

I've handled this by constructing a CollectionView that takes a collection of models that hold the viewType they're associated with.

// In an extension of collectionView/compositeView
        getChildView: function (child) {
            return child.get('viewType');
        },

        childViewOptions: function (child) {
            return child.get('viewOptions');
        }

[samccone]

+1 @cmaher this is also how i do it

[joezimjs]

That's a decent way to do it. It would require using a special type of model that wraps all the view options and such. Seems kinda hacky, but I've seen worse.

[samccone]

@joezimjs I am interested in your thoughts for what the ideal API would look like. I have been thinking about it a bunch.

[joezimjs]

I think both solutions work well, but the MultiRegion that I created can be more helpful if we already have a view constructed and just want to be able to insert it into that region. I have also come up with a NamedMultiRegion that uses babysitter behind the scenes so you can access the views inside with several different types of indexes.

If we were using your idea with CollectionView, it might be a good idea to wrap it up to expose a different API, or you could just throw a few methods to make things simpler. Adding a view would be simple:

sidebar.addView({
  viewClass: MyView,
  viewOptions: {
    model: someModel,
    ...
  }
});

If that method returns the model that is created, then we can use that as a means of getting a reference to the view associated with it, so we can do more than just add a view.

If I get some time, maybe I'll write up some code, but right now, it's not really a priority for me.

[jamesplease]

For the record, I am completely sold on the multiRegion idea. I've begun thinking up possible APIs for it, and I'll definitely be working on implementing it soon based off your excellent work, @joezimjs.

Thanks for this great suggestion!

[joezimjs]

I'm glad you like it @jmeas. In all honesty, I don't see why we can't have both the MultiRegion and the specialized CollectionView. They both have their pros and cons and are better are some things that the other isn't, so let the devs decide.

[jamesplease]

Added to #1796