Arma3_Exile/arma-server-web-admin
1
0
Fork 0
mirror of https://github.com/Dahlgren/arma-server-web-admin.git synced 2024-08-30 17:22:10 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add active state to navigation bar elements

Browse Source
This commit is contained in:
Björn Dahlgren 2019-07-29 17:10:46 +02:00
parent 1e0495f070
commit c914bb1019
3 changed files with 16 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
public/js/app/views/navigation.js
View File

@ -14,6 +14,14 @@ define(function (require) {
return Marionette.ItemView.extend({
template: _.template(tpl),
templateHelpers: function() {
return {
isActiveRoute: function (route) {
return Backbone.history.fragment === route ? 'active' : ''
}
}
},
events: {
"click #settings": "settings"
},
@ -22,6 +30,7 @@ define(function (require) {
this.settings = options.settings;
this.servers = options.servers;
this.serversListView = new ServersListView({ collection: this.servers })
Backbone.history.on('route', this.render);
},
onDomRefresh: function () {

3
public/js/app/views/navigation/servers/list_item.js
View File

@ -11,6 +11,9 @@ define(function (require) {
template = _.template(tpl);
return Marionette.ItemView.extend({
className: function () {
return Backbone.history.fragment === 'servers/' + this.model.get('id') ? 'active' : ''
},
tagName: "li",
template: template
});

8
public/js/tpl/navigation.html
View File

@ -11,10 +11,10 @@
</div>
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right">
<li><a href="#" id="dashboard">Dashboard</a></li>
<li><a href="#logs" id="logs">Logs</a></li>
<li><a href="#missions" id="missions">Missions</a></li>
<li><a href="#mods" id="mods">Mods</a></li>
<li class="<%= isActiveRoute('') %>"><a href="#" id="dashboard">Dashboard</a></li>
<li class="<%= isActiveRoute('logs') %>"><a href="#logs" id="logs">Logs</a></li>
<li class="<%= isActiveRoute('missions') %>"><a href="#missions" id="missions">Missions</a></li>
<li class="<%= isActiveRoute('mods') %>"><a href="#mods" id="mods">Mods</a></li>
<li><a href="#" id="settings">Settings</a></li>
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Servers <b class="caret"></b></a>