Hiding parent views when navigating further down child routes/states

Coming from angularjs and new to emberjs and wondering how to implement this in ember.

Here’s an angularjs + ui-router example: Growing Panes

click on the links in the navbar enters a child state (nested route in terms of ember?). when entering a child state, it looks at how deep it is and only limits the view to show a limited number of panes (default: 2, when clicking ‘preview’, that state explicitly specifies to limit it to 3).

goals:

  • limit the number of panes to show when progressing further down nested routes
  • adds a class to each pane so that css can be used to set the pane width based on context (my angularjs solution sets name-pane- class name)