Merge pull request #2541 from rjackson/simplify-nested-list-active-view

Refactor navbar to eliminate nested {{link-to}}.

core/client/app.js

@@ -1,6 +1,7 @@
 import Resolver from 'ember/resolver';
 import initFixtures from 'ghost/fixtures/init';
 import {currentUser, injectCurrentUser} from 'ghost/initializers/current-user';
+import 'ghost/utils/link-view';
 
 var App = Ember.Application.extend({
     /**
@@ -20,4 +21,4 @@ initFixtures();
 App.initializer(currentUser);
 App.initializer(injectCurrentUser);
 
-export default App;
+export default App;

core/client/components/activating-list-item.js

@@ -0,0 +1,5 @@
+export default Ember.Component.extend({
+    tagName: 'li',
+    classNameBindings: ['active'],
+    active: false
+});

core/client/templates/-navbar.hbs

@@ -4,17 +4,9 @@
     </a>
     <nav id="global-nav" role="navigation">
         <ul id="main-menu" >
-            {{!-- @TODO: don't nest link-to attributes
-                currently required to get proper class styling --}}
-            {{#link-to "posts" class="content" tagName="li" disabled=true}}
-                {{#link-to "posts"}}Content{{/link-to}}
-            {{/link-to}}
-            {{#link-to "new" class="editor" tagName="li" disabled=true}}
-                {{#link-to "new"}}New post{{/link-to}}
-            {{/link-to}}
-            {{#link-to "settings" class="settings" tagName="li" disabled=true}}
-                {{#link-to "settings"}}Settings{{/link-to}}
-            {{/link-to}}
+            {{activating-list-item route="posts" title="Content" classNames="content"}}
+            {{activating-list-item route="new" title="New post" classNames="content"}}
+            {{activating-list-item route="settings" title="Settings" classNames="content"}}
 
             <li id="usermenu" class="usermenu subnav">
                 <a href="#" class="dropdown">

core/client/templates/components/activating-list-item.hbs

@@ -0,0 +1 @@
+{{#link-to route alternateActive=active}}{{title}}{{yield}}{{/link-to}}

core/client/utils/link-view.js

@@ -0,0 +1,9 @@
+Ember.LinkView.reopen({
+    active: Ember.computed('resolvedParams', 'routeArgs', function () {
+        var isActive = this._super();
+
+        Ember.set(this, 'alternateActive', isActive);
+
+        return isActive;
+    })
+});