CODEWITHSUNDEEP
model-view-controllerbackbone.jsmodel
Aimee.S
Aimee.S

Reputation: 31

Best layout mechanism for a (rather complex) Backbone view?

I'm new to backbone and despite reading up on a few resources, a bit unsure still how to structure my view and the corresponding model.

The view in question is a custom facebook view, which has a filter (drop down list) at top and then a content view below - which depending what's being filtered displays some content.

For example, you can have items like all, status, photos, groups in the filter.

If the user select all, then the content view should render all status, photos and group updates for the user. Given that a status looks different from a photo, the view should be able to render status and photos differently.

If the user selects status, only a list of status is displayed.

Question is, do I create separate model collections for statues, photos etc. or just one polymorphic collections model that has all statuses, photos etc.?

How about the view? Should I create different views, one for displaying all items and then one each for item selected or should I have just one view and have logic in there to render things differently based on the model?

Thanks!

Upvotes: 2

Views: 95

Answers (1)

Sushanth --
Sushanth --

Reputation: 55750

The way I would go about structuring the view would be.

ContainerView   (Holds dropdown and the content)
    |
    |
    |-----> HeaderView  (  This holds the Drop Dwon)
    |
    |-----> ContentView (This holds the content)
               |
               |
               |------> ListView ( For all the models )
                           |
                           |
                           |----> ListItemView ( Render each model in collection

You would have a collections object that will be passed along to the Header and ContentView .

You list view will be listening to the reset and change event of your dropdown and render the list view that would iterate over the collection and render ListItemView for each model.

Now you have 2 approached to handle Photos , status and groups.

You can either have a attribute on each model that says the type of group it belongs to and have render a different template based on the attribute or you can have a separate view for each group. I would go with the latter ( might be a overkill ) . But it would be helpful if you are talking in terms of scalability and performance.

Upvotes: 1

Related Questions