Navigation helper amends

closes #4541

- Add role="presentation" to <li>
- Clean up space if nav-current isn't present
- Changed all internal references from nav to navigation for consistency
- Deleted old nav.hbs
- Updated tests
This commit is contained in:
Hannah Wolfe 2015-02-15 21:44:07 +00:00
parent d28ffef3e9
commit 6d42df029a
5 changed files with 31 additions and 35 deletions

View File

@ -72,7 +72,7 @@ function formatPageResponse(posts, page, extraValues) {
var resp = {
posts: posts,
pagination: page.meta.pagination,
nav: navigation || {}
navigation: navigation || {}
};
return _.extend(resp, extraValues);
});
@ -93,7 +93,7 @@ function formatResponse(post) {
return getSiteNavigation().then(function (navigation) {
return {
post: post,
nav: navigation
navigation: navigation
};
});
}

View File

@ -10,22 +10,22 @@ var _ = require('lodash'),
navigation = function (options) {
/*jshint unused:false*/
var nav,
var navigation,
context,
currentUrl = this.relativeUrl;
if (!_.isObject(this.nav) || _.isFunction(this.nav)) {
if (!_.isObject(this.navigation) || _.isFunction(this.navigation)) {
return errors.logAndThrowError('navigation data is not an object or is a function');
}
if (this.nav.filter(function (e) {
return (_.isUndefined(e.label) || _.isUndefined(e.url));
}).length > 0) {
return errors.logAndThrowError('All values must be defined for label, url and current');
}
if (this.navigation.filter(function (e) {
return (_.isUndefined(e.label) || _.isUndefined(e.url));
}).length > 0) {
return errors.logAndThrowError('All values must be defined for label, url and current');
}
// check for non-null string values
if (this.nav.filter(function (e) {
if (this.navigation.filter(function (e) {
return ((!_.isNull(e.label) && !_.isString(e.label)) ||
(!_.isNull(e.url) && !_.isString(e.url)));
}).length > 0) {
@ -37,11 +37,11 @@ navigation = function (options) {
}
// {{navigation}} should no-op if no data passed in
if (this.nav.length === 0) {
if (this.navigation.length === 0) {
return new hbs.SafeString('');
}
nav = this.nav.map(function (e) {
navigation = this.navigation.map(function (e) {
var out = {};
out.current = e.url === currentUrl;
out.label = e.label;
@ -50,7 +50,7 @@ navigation = function (options) {
return out;
});
context = _.merge({}, {nav: nav});
context = _.merge({}, {navigation: navigation});
return template.execute('navigation', context);
};

View File

@ -1,7 +0,0 @@
<nav id="site-navigation" role="navigation">
<ul>
{{#links}}
<li class="{{#active}}current-menu-item{{/active}}"><a title="{{{title}}}" href="{{url}}">{{{title}}}</a></li>
{{/links}}
</ul>
</nav>

View File

@ -1,5 +1,5 @@
<ul class="nav">
{{#foreach nav}}
<li class="nav-{{slug}} {{#if current}}nav-current{{/if}}"><a href="{{url absolute="true"}}">{{label}}</a></li>
{{#foreach navigation}}
<li class="nav-{{slug}}{{#if current}} nav-current{{/if}}" role="presentation"><a href="{{url absolute="true"}}">{{label}}</a></li>
{{/foreach}}
</ul>
</ul>

View File

@ -31,12 +31,12 @@ describe('{{navigation}} helper', function () {
runHelper('not an object').should.throwError('navigation data is not an object or is a function');
runHelper(function () {}).should.throwError('navigation data is not an object or is a function');
runHelper({nav: [{label: 1, url: 'bar'}]}).should.throwError('Invalid value, Url and Label must be strings');
runHelper({nav: [{label: 'foo', url: 1}]}).should.throwError('Invalid value, Url and Label must be strings');
runHelper({navigation: [{label: 1, url: 'bar'}]}).should.throwError('Invalid value, Url and Label must be strings');
runHelper({navigation: [{label: 'foo', url: 1}]}).should.throwError('Invalid value, Url and Label must be strings');
});
it('can render empty nav', function () {
var navigation = {nav:[]},
var navigation = {navigation:[]},
rendered = helpers.navigation.call(navigation);
should.exist(rendered);
@ -45,26 +45,29 @@ describe('{{navigation}} helper', function () {
it('can render one item', function () {
var singleItem = {label: 'Foo', url: '/foo'},
navigation = {nav: [singleItem]},
rendered = helpers.navigation.call(navigation);
navigation = {navigation: [singleItem]},
rendered = helpers.navigation.call(navigation),
testUrl = 'href="' + utils.config.url + '/foo"';
should.exist(rendered);
rendered.string.should.containEql('li');
rendered.string.should.containEql('nav-foo');
rendered.string.should.containEql('href="/foo"');
rendered.string.should.containEql(testUrl);
});
it('can render multiple items', function () {
var firstItem = {label: 'Foo', url: '/foo'},
secondItem = {label: 'Bar Baz Qux', url: '/qux'},
navigation = {nav: [firstItem, secondItem]},
rendered = helpers.navigation.call(navigation);
navigation = {navigation: [firstItem, secondItem]},
rendered = helpers.navigation.call(navigation),
testUrl = 'href="' + utils.config.url + '/foo"',
testUrl2 = 'href="' + utils.config.url + '/qux"';
should.exist(rendered);
rendered.string.should.containEql('nav-foo');
rendered.string.should.containEql('nav-bar-baz-qux');
rendered.string.should.containEql('href="/foo"');
rendered.string.should.containEql('href="/qux"');
rendered.string.should.containEql(testUrl);
rendered.string.should.containEql(testUrl2);
});
it('can annotate the current url', function () {
@ -72,7 +75,7 @@ describe('{{navigation}} helper', function () {
secondItem = {label: 'Bar', url: '/qux'},
navigation = {
relativeUrl: '/foo',
nav: [firstItem, secondItem]
navigation: [firstItem, secondItem]
},
rendered = helpers.navigation.call(navigation);
@ -80,6 +83,6 @@ describe('{{navigation}} helper', function () {
rendered.string.should.containEql('nav-foo');
rendered.string.should.containEql('nav-current');
rendered.string.should.containEql('nav-foo nav-current');
rendered.string.should.containEql('nav-bar "');
rendered.string.should.containEql('nav-bar"');
});
});