Skip to content

Instantly share code, notes, and snippets.

@wookiehangover
Created September 19, 2013 22:57
Show Gist options
  • Save wookiehangover/6630997 to your computer and use it in GitHub Desktop.
Save wookiehangover/6630997 to your computer and use it in GitHub Desktop.

Sprintly Rendering notes

FilteredCollection Events

FilteredCollection events are not granular: 'load', 'reset', 'filter-complete', and 'loaded' always trigger in sequence, and usually in duplicate, so there's no way to determine when to safely take a rendering action based on collection lifecycle events.

'sort' events are repeated many times on FilteredCollections--ideally sort events should be silent unless a change has actually occured. Binding rendering actions on 'sort' isn't possible because of all the duplicate events.

There are only a few events that I feel should be taking place in the lifecycle of a given FilteredCollection:

  • 'change' events on the individual models
  • 'sort' events when sort order changes (although maybe this is always handled on the individual model level with 'change:sort' and 'sort' events are saved for massive re-sorts, like changing sort direction)
  • 'reset' events when the entire collection contents are replaced

Rendering Considerations

I want to be able to render a column one time (when the initial filteredCollection payload is delivered) and handle all subsequent action with rendering / creating individual item cards.

items_column should keep track of which items from have been rendered (for lazy loading), and then let the individual item_cards be responsible for their own rendering, based on "change" events.

items_column should be able to listen to 'add' and 'remove' events on their filtered collection and affect individual item_cards as needed.

Dragging item cards between columns should produce 2 events: a 'remove' from the current column and an 'add' to the new column.

item_card views (and container elements) should not be created until the item_card is rendered.

Automatic sorting should be handled by re-sorting the collection, triggering a 'sort' event, which would cause the following actions on an item_column:

  • detach all rendered item cards from the DOM
  • for the number of rendered cards, iterate through the collection and render the item cards in sequence, re-attaching their views if needed.
  • item_card render will detect for a rendered-but-detached state

User-driven sorting (jquery-ui sortable) should not trigger a collection sort event. This event should be silenced since the DOM is the source of truth for the collection's sort state.

item_cards should use data binding to their models to update changes as soon as they happen (for instance, coming over the wire with pusher.)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment