bastion/nginx-proxy-manager
2
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Frontend

Browse Source
This commit is contained in:
Jamie Curnow
2018-06-20 08:48:14 +10:00
parent 80d78cbf25
commit b38b988da4
40 changed files with 1419 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src/frontend/js/app/ui/footer/main.ejs Normal file
View File

@ -0,0 +1,14 @@
<div class="row align-items-center flex-row-reverse">
<div class="col-auto ml-auto">
<div class="row align-items-center">
<div class="col-auto">
<ul class="list-inline list-inline-dots mb-0">
<li class="list-inline-item"><a href="https://github.com/jc21/docker-registry-ui?utm_source=docker-registry-ui">Fork me on Github</a></li>
</ul>
</div>
</div>
</div>
<div class="col-12 col-lg-auto mt-3 mt-lg-0 text-center">
v<%- getVersion() %> &copy; 2018 <a href="https://jc21.com?utm_source=docker-registry-ui" target="_blank">jc21.com</a>. Theme by <a href="https://github.com/tabler/tabler?utm_source=docker-registry-ui" target="_blank">Tabler</a>
</div>
</div>

16
src/frontend/js/app/ui/footer/main.js Normal file
View File

@ -0,0 +1,16 @@
'use strict';
const Mn = require('backbone.marionette');
const template = require('./main.ejs');
const App = require('../../main');
module.exports = Mn.View.extend({
className: 'container',
template: template,
templateContext: {
getVersion: function () {
return App.version;
}
}
});

28
src/frontend/js/app/ui/header/main.ejs Normal file
View File

@ -0,0 +1,28 @@
<div class="container">
<div class="d-flex">
<a class="navbar-brand" href="/">
<img src="/images/favicons/favicon-32x32.png" border="0"> &nbsp; Docker Registry
</a>
<div class="d-flex order-lg-2 ml-auto">
<div class="dropdown">
<a href="#" class="nav-link pr-0 leading-none" data-toggle="dropdown">
<span class="avatar" style="background-image: url(<%- getUserField('avatar', '/images/default-avatar.jpg') %>)"></span>
<span class="ml-2 d-none d-lg-block">
<span class="text-default"><%- getUserField('name', 'Unknown User') %></span>
<small class="text-muted d-block mt-1"><%- getRole() %></small>
</span>
</a>
<div class="dropdown-menu dropdown-menu-right dropdown-menu-arrow">
<a class="dropdown-item profile" href="/profile">
<i class="dropdown-icon fe fe-user"></i> Profile
</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item logout" href="/logout">
<i class="dropdown-icon fe fe-log-out"></i> <%- getLogoutText() %>
</a>
</div>
</div>
</div>
</div>
</div>

55
src/frontend/js/app/ui/header/main.js Normal file
View File

@ -0,0 +1,55 @@
'use strict';
const $ = require('jquery');
const Mn = require('backbone.marionette');
const Cache = require('../../cache');
const Controller = require('../../controller');
const Tokens = require('../../tokens');
const template = require('./main.ejs');
module.exports = Mn.View.extend({
id: 'header',
className: 'header',
template: template,
ui: {
link: 'a'
},
events: {
'click @ui.link': function (e) {
e.preventDefault();
let href = $(e.currentTarget).attr('href');
switch (href) {
case '/':
Controller.showDashboard();
break;
case '/profile':
Controller.showProfile();
break;
case '/logout':
Controller.logout();
break;
}
}
},
templateContext: {
getUserField: function (field, default_val) {
return Cache.User.get(field) || default_val;
},
getRole: function () {
return Cache.User.isAdmin() ? 'Administrator' : 'Apache Helicopter';
},
getLogoutText: function () {
if (Tokens.getTokenCount() > 1) {
return 'Sign back in as ' + Tokens.getNextTokenName();
}
return 'Sign out';
}
}
});

18
src/frontend/js/app/ui/main.ejs Normal file
View File

@ -0,0 +1,18 @@
<div class="page-main">
<div class="header" id="header">
<!-- Header View -->
</div>
<div id="menu">
<!-- Menu View -->
</div>
<div class="my-3 my-md-5">
<div id="app-content" class="container">
<!-- App View -->
</div>
</div>
</div>
<footer class="footer">
<!-- Footer View -->
</footer>

44
src/frontend/js/app/ui/main.js Normal file
View File

@ -0,0 +1,44 @@
'use strict';
const Mn = require('backbone.marionette');
const template = require('./main.ejs');
const HeaderView = require('./header/main');
const MenuView = require('./menu/main');
const FooterView = require('./footer/main');
const Cache = require('../cache');
module.exports = Mn.View.extend({
className: 'page',
template: template,
regions: {
header_region: {
el: '#header',
replaceElement: true
},
menu_region: {
el: '#menu',
replaceElement: true
},
footer_region: '.footer',
app_content_region: '#app-content'
},
showAppContent: function (view) {
this.showChildView('app_content_region', view);
},
onRender: function () {
this.showChildView('header_region', new HeaderView({
model: Cache.User
}));
this.showChildView('menu_region', new MenuView());
this.showChildView('footer_region', new FooterView());
},
reset: function () {
this.getRegion('header_region').reset();
this.getRegion('footer_region').reset();
}
});

56
src/frontend/js/app/ui/menu/main.ejs Normal file
View File

@ -0,0 +1,56 @@
<div class="container">
<div class="row align-items-center">
<div class="col-lg order-lg-first">
<ul class="nav nav-tabs border-0 flex-column flex-lg-row">
<li class="nav-item">
<a href="../index.html" class="nav-link"><i class="fe fe-home"></i> Home</a>
</li>
<li class="nav-item">
<a href="javascript:void(0)" class="nav-link" data-toggle="dropdown"><i class="fe fe-box"></i> Interface</a>
<div class="dropdown-menu dropdown-menu-arrow">
<a href="../cards.html" class="dropdown-item ">Cards design</a>
<a href="../charts.html" class="dropdown-item ">Charts</a>
<a href="../pricing-cards.html" class="dropdown-item ">Pricing cards</a>
</div>
</li>
<li class="nav-item dropdown">
<a href="javascript:void(0)" class="nav-link" data-toggle="dropdown"><i class="fe fe-calendar"></i> Components</a>
<div class="dropdown-menu dropdown-menu-arrow">
<a href="../maps.html" class="dropdown-item ">Maps</a>
<a href="../icons.html" class="dropdown-item ">Icons</a>
<a href="../store.html" class="dropdown-item ">Store</a>
<a href="../blog.html" class="dropdown-item ">Blog</a>
<a href="../carousel.html" class="dropdown-item ">Carousel</a>
</div>
</li>
<li class="nav-item dropdown">
<a href="javascript:void(0)" class="nav-link" data-toggle="dropdown"><i class="fe fe-file"></i> Pages</a>
<div class="dropdown-menu dropdown-menu-arrow">
<a href="../profile.html" class="dropdown-item ">Profile</a>
<a href="../login.html" class="dropdown-item ">Login</a>
<a href="../register.html" class="dropdown-item ">Register</a>
<a href="../forgot-password.html" class="dropdown-item ">Forgot password</a>
<a href="../400.html" class="dropdown-item ">400 error</a>
<a href="../401.html" class="dropdown-item ">401 error</a>
<a href="../403.html" class="dropdown-item ">403 error</a>
<a href="../404.html" class="dropdown-item ">404 error</a>
<a href="../500.html" class="dropdown-item ">500 error</a>
<a href="../503.html" class="dropdown-item ">503 error</a>
<a href="../email.html" class="dropdown-item ">Email</a>
<a href="../empty.html" class="dropdown-item ">Empty page</a>
<a href="../rtl.html" class="dropdown-item ">RTL mode</a>
</div>
</li>
<li class="nav-item dropdown">
<a href="../form-elements.html" class="nav-link"><i class="fe fe-check-square"></i> Forms</a>
</li>
<li class="nav-item">
<a href="../gallery.html" class="nav-link"><i class="fe fe-image"></i> Gallery</a>
</li>
<li class="nav-item">
<a href="../docs/index.html" class="nav-link"><i class="fe fe-file-text"></i> Documentation</a>
</li>
</ul>
</div>
</div>
</div>

10
src/frontend/js/app/ui/menu/main.js Normal file
View File

@ -0,0 +1,10 @@
'use strict';
const Mn = require('backbone.marionette');
const template = require('./main.ejs');
module.exports = Mn.View.extend({
id: 'menu',
className: 'header collapse d-lg-flex p-0',
template: template
});