Design two level side menu approach


For several days I am struggling with side menu in Ember. The idea is to have menu on the left side with approximately 10 elements. Some of them will be simple {{link-to}} elements, but others should expand(with more subroutes) when clicked. The requirements are:

User should be able to expand all expandable menu elements at a time. When I put URL to specific child route, that route’s parent element should be automatically expanded, and specified subroute should have activeClass(like with {{link-to}} I would also like to have smooth transitions of expansion. I tried to nest {{link-to}} but when I click on the parent element, it renders its template, but it should not. Also I do not have hook thanks to which I would expand or collapse subroute elements. I really don’t know how to bit it:( Anyone can give even small tip? Thank you