app/js/navbar.js
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 |
(function(){
'use strict';
var app = window.LS || (window.LS = {});
var u = app.utils;
app.navlinks = {
controller: function(){
app.navlinks.vm.init();
},
vm: {
init: function(){
this.info = Info.get();
this.activelink = function(url){
return (m.route().match(new RegExp("^\/"+url))) ? "active" : "";
};
this.guidelinks = [
{path: "/guide/overview", title: "Overview"},
{path: "/guide/getting-started", title: "Getting Started"},
{path: "/guide/usage", title: "Usage"},
{path: "/guide/api", title: "API"},
{path: "/guide/credits", title: "Credits"}
];
this.taglinks = function(info){
return info.tags.map(function(tag){
var key = Object.keys(tag)[0];
return {path: "/tags/"+key, title: key+" ("+tag[key]+")"};
});
};
}
},
view: function(ctrl){
var vm = app.navlinks.vm;
return m("ul.nav.navbar-nav", [
m("li", {class: vm.activelink("info")}, [m("a", {href: "/info", config: m.route},
[m("i.fa.fa-info-circle"), " Info"])]),
u.dropdown({title: "Guide", icon:"fa-book", links: vm.guidelinks, active: vm.activelink("guide")}),
u.dropdown({title: "Tags", icon:"fa-tag", links: vm.taglinks(vm.info()), active: vm.activelink("tags")}),
m("li", {class: vm.activelink("new")}, [m("a", {href: "/document/create/", config: m.route},
[m("i.fa.fa-plus-circle"), " New"])])
]);
}
};
app.navheader = {
controller: function() {},
view: function(ctrl) {
return m(".navbar-header", [
m("button.navbar-toggle.collapsed[data-toggle='collapse'][data-target='#nav-collapse'][type='button']", [
m("span.sr-only", "Toggle navigation"),
m("span.icon-bar"),
m("span.icon-bar"),
m("span.icon-bar")
]),
m("a.navbar-brand", {href: "/", config:m.route}, "LiteStore")
]);
}
};
app.searchbox = {
controller: function() {},
view: function(ctrl) {
return m("form.navbar-form.navbar-right[role='search']", [
m(".input-group", [
m("input.form-control[type='text'i][placeholder='Search...']"),
m("span.input-group-btn",
m("button.btn.btn-default[type='button']", [m("i.fa.fa-search")]))
])
]
);
}
};
app.navbar = {
controller: function() {
this.navheader = new app.navheader.controller();
this.navlinks = new app.navlinks.controller();
this.searchbox = new app.searchbox.controller();
},
view: function(ctrl) {
return m("nav.navbar.navbar-inverse.navbar-fixed-top", [
m(".container-fluid", [
app.navheader.view(ctrl.navheader),
m("#nav-collapse.collapse.navbar-collapse", [
app.navlinks.view(ctrl.navlinks),
app.searchbox.view(ctrl.searchbox)
])
])
]);
}
};
}());
|