376 lines
12 KiB
Plaintext
376 lines
12 KiB
Plaintext
|
<!DOCTYPE html>
|
||
|
<!--
|
||
|
Main format for the AdminLTE (https://adminlte.io/docs/3.1/) 3.1 Server manager 2 page.
|
||
|
Derived from the AdminLTE starter page: https://adminlte.io/themes/v3/starter.html
|
||
|
|
||
|
brianr@bjsystems.co.uk
|
||
|
|
||
|
To Do (24Apr2021)
|
||
|
|
||
|
1. Breadcrumb trail on right of info bar.
|
||
|
2. Remove heading from content
|
||
|
3. Make active menu entry highlight - DONE
|
||
|
4. Reduced logo for when left sidebar is "just" visible - DONE
|
||
|
5. Icons/ Short form for menu items when left sidebar is "just" visible.
|
||
|
6. Add dark mode - STARTED - nneds a lot more work!
|
||
|
7. Enhance Login button - DONE
|
||
|
8. Forgotten Password on login screen
|
||
|
|
||
|
-->
|
||
|
<html lang="en">
|
||
|
<head>
|
||
|
<meta charset="utf-8">
|
||
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||
|
<title><%= $title %></title>
|
||
|
|
||
|
<!-- Google Font: Source Sans Pro -->
|
||
|
%= stylesheet "https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700&display=fallback"
|
||
|
<!-- Font Awesome Icons -->
|
||
|
%= stylesheet "/plugins/fontawesome-free/css/all.css"
|
||
|
<!-- Theme style -->
|
||
|
%= stylesheet "/dist/css/adminlte.css"
|
||
|
%= stylesheet "/css/adminlte-menu.css"
|
||
|
%= stylesheet "/css/adminlte-header-and-footer.css"
|
||
|
%= stylesheet "/css/adminlte-content.css"
|
||
|
%= content_for 'head_contrib'
|
||
|
%= include 'partials/_js_imports'
|
||
|
%= include 'common_js'
|
||
|
%= content_for 'refresh'
|
||
|
|
||
|
</head>
|
||
|
<body class="hold-transition sidebar-mini layout-boxed ">
|
||
|
<div class="wrapper">
|
||
|
|
||
|
<!-- Navbar -->
|
||
|
|
||
|
<nav class="main-header navbar navbar-expand navbar-white navbar-light">
|
||
|
<!-- Left navbar links -->
|
||
|
<ul class="navbar-nav col-sm-10">
|
||
|
|
||
|
<li class="nav-item">
|
||
|
<a class="nav-link" data-widget="pushmenu" href="#" role="button"><i class="fas fa-bars"></i></a>
|
||
|
</li>
|
||
|
<li class="nav-item d-none d-sm-inline-block">
|
||
|
<a href="/smanager" class="nav-link">Home</a>
|
||
|
</li>
|
||
|
<li class="nav-item d-none d-sm-inline-block">
|
||
|
<a href="mailto:info:koozali.org" class="nav-link">Contact</a>
|
||
|
</li>
|
||
|
<li class="nav-item d-none d-sm-inline-block">
|
||
|
<a href="/server-manager" class="nav-link">Prev-SM</a>
|
||
|
</li>
|
||
|
|
||
|
<li id="swttheme" class="nav-item d-none d-sm-inline-block">
|
||
|
% if (scalar @{SrvMngr::theme_list( $c )} > 1) {
|
||
|
%= include 'partials/_swt_theme'
|
||
|
% }
|
||
|
|
||
|
</li>
|
||
|
|
||
|
<li id = "swtsize" class="nav-item d-none d-sm-inline-block">
|
||
|
% param 'fontsize'=>'text-md' unless 'fontsize';
|
||
|
%=label_for fontsize=>'Font size:'
|
||
|
%=select_field fontsize=>[['very small'=>'text-xs'],['small'=>'text-sm'],['medium'=>'text-md'],['large'=>'text-lg'],['very large'=>'text-xl']],onchange=>"SetFontSize()",id=>"fontsizeid"
|
||
|
</li>
|
||
|
|
||
|
<li id = "darkmodeswt" class="nav-item d-none d-sm-inline-block">
|
||
|
%# param 'darkmodeswtcheck'=>0 unless 'darkmodeswtcheck';
|
||
|
%=label_for darkmodeswtcheck=>'Dark Mode:'
|
||
|
%=check_box darkmodeswtcheck=>0, onchange=>"SetDarkMode();", id=>"darkmodeswtid"
|
||
|
</li>
|
||
|
|
||
|
<li class="nav-item d-none d-sm-inline-block">
|
||
|
% if ( not defined $c->session->{lang} ) {
|
||
|
% SrvMngr::init_session ( $c );
|
||
|
% }
|
||
|
</li>
|
||
|
|
||
|
</ul>
|
||
|
</nav>
|
||
|
<!-- /.navbar -->
|
||
|
|
||
|
<!-- Main Sidebar Container -->
|
||
|
<aside class="main-sidebar sidebar-light-primary elevation-4">
|
||
|
<!-- Brand Logo -->
|
||
|
<a href="/smanager" class="brand-link logo-switch">
|
||
|
<img src="img/smeserver_login.jpg" alt="Koozali Logo" class="brand-image-xl elevation-3 logo-xl" style="opacity: .9;max-height:none;height:auto;">
|
||
|
<img src="img/smeserver_login-xs.jpg" alt="Koozali Logo" class="brand-image-xs elevation-3 logo-xs" style="opacity: .9;max-height:none;height:auto;">
|
||
|
<!--
|
||
|
<span class="brand-text font-weight-light">Server Manager II</span>
|
||
|
-->
|
||
|
</a>
|
||
|
|
||
|
<!-- Sidebar -->
|
||
|
<div class="sidebar float-left">
|
||
|
<!-- Sidebar Menu -->
|
||
|
<nav class="mt-2">
|
||
|
<ul class="nav nav-pills nav-sidebar flex-column" data-widget="treeview" role="menu" data-accordion="false">
|
||
|
<!-- Add icons to the links using the .nav-icon class
|
||
|
with font-awesome or any other icon font library -->
|
||
|
<li class="nav-item">
|
||
|
%= include 'partials/_nav_menu'
|
||
|
</li>
|
||
|
<li class="nav-item">
|
||
|
% if ( $c->is_logged_in ) {
|
||
|
%= include 'partials/_user_menu'
|
||
|
% }
|
||
|
</li>
|
||
|
<li class="nav-item">
|
||
|
% if ( $c->is_admin ) {
|
||
|
%= include 'partials/_navig2'
|
||
|
% }
|
||
|
</li>
|
||
|
|
||
|
</ul>
|
||
|
</nav>
|
||
|
<!-- /.sidebar-menu -->
|
||
|
</div>
|
||
|
<!-- /.sidebar -->
|
||
|
</aside>
|
||
|
|
||
|
<!-- Content Wrapper. Contains page content -->
|
||
|
<div class="content-wrapper">
|
||
|
<!-- Content Header (Page header) -->
|
||
|
<div class="content-header">
|
||
|
|
||
|
|
||
|
<div class="container-fluid">
|
||
|
<div class="row mb-2">
|
||
|
|
||
|
<div class="col-sm-5">
|
||
|
<b><%= session 'SystemName' %>@<%= session 'DomainName' %></b>
|
||
|
</div>
|
||
|
|
||
|
<div id="h2e23" class="col-sm-3">
|
||
|
% if ( not defined $c->session->{username} ) {
|
||
|
<a class="button" target="_parent" href="login"><b>Login</b></a>
|
||
|
% } else {
|
||
|
<a class="button" target="_parent" href="/smanager/logout"><b><%= $c->session->{username} %> Logout</b></a>
|
||
|
% }
|
||
|
</div>
|
||
|
|
||
|
|
||
|
<div class="col-sm-4">
|
||
|
<ol class="breadcrumb float-sm-right">
|
||
|
|
||
|
<li class="breadcrumb-item active"><a href="#">Home</a></li>
|
||
|
<li class="breadcrumb-item"><a href="#">L1</a></li>
|
||
|
<li class="breadcrumb-item"><a href="#">L2</a></li>
|
||
|
|
||
|
</ol>
|
||
|
</div><!-- /.col -->
|
||
|
</div><!-- /.row -->
|
||
|
</div><!-- /.container-fluid -->
|
||
|
|
||
|
<div class="container-fluid">
|
||
|
<div class="row mb-2">
|
||
|
<div class="col-sm-12">
|
||
|
%= include 'partials/_info'
|
||
|
</div><!-- /.col -->
|
||
|
</div><!-- /.row -->
|
||
|
|
||
|
</div><!-- /.container-fluid -->
|
||
|
<div class="container-fluid">
|
||
|
<div class="row mb-2">
|
||
|
<div class="col-sm-12">
|
||
|
% if (flash 'success') {
|
||
|
<br><div class=success>
|
||
|
%= "Success: ".$c->render_to_string(inline => flash 'success')
|
||
|
</div>
|
||
|
% }
|
||
|
% if ( flash 'warning' ) {
|
||
|
<br><div class=sme-warning>
|
||
|
%= "Warning: ".$c->render_to_string(inline => flash 'warning')
|
||
|
</div>
|
||
|
%}
|
||
|
% if ( flash 'error' ) {
|
||
|
<br><div class=sme-error>
|
||
|
%= "Error: ".$c->render_to_string(inline => flash 'error')
|
||
|
</div>
|
||
|
%}
|
||
|
</div><!-- /.col -->
|
||
|
</div><!-- /.row -->
|
||
|
</div><!-- /.container-fluid -->
|
||
|
|
||
|
|
||
|
</div><!-- /.content-header -->
|
||
|
|
||
|
<!-- Main content -->
|
||
|
<div class="content">
|
||
|
<div class="container-fluid">
|
||
|
% my $content = content('module');
|
||
|
%= $content;
|
||
|
</div><!-- /.container-fluid -->
|
||
|
</div>
|
||
|
<!-- /.content -->
|
||
|
</div>
|
||
|
<!-- /.content-wrapper -->
|
||
|
|
||
|
<!-- Control Sidebar -->
|
||
|
<aside class="control-sidebar control-sidebar-dark">
|
||
|
<!-- Control sidebar content goes here -->
|
||
|
<div class="p-3">
|
||
|
<h5>Title</h5>
|
||
|
<p>Sidebar content</p>
|
||
|
</div>
|
||
|
</aside>
|
||
|
<!-- /.control-sidebar -->
|
||
|
|
||
|
<!-- Main Footer -->
|
||
|
<footer class="main-footer">
|
||
|
<!-- To the right -->
|
||
|
<div class="sm2-footer float-left d-none d-sm-inline">
|
||
|
%= include 'partials/_footer'
|
||
|
<span class="adminlte-version"></span>
|
||
|
%= `rpm -q smeserver-manager`;
|
||
|
|
||
|
%= `rpm -q smeserver-manager-AdminLTE`;
|
||
|
</div>
|
||
|
<!-- Default to the left
|
||
|
<strong>Copyright © 2014-2021 <a href="https://adminlte.io">AdminLTE.io</a>.</strong> All rights reserved.
|
||
|
-->
|
||
|
</footer>
|
||
|
</div>
|
||
|
<!-- ./wrapper -->
|
||
|
|
||
|
<!-- REQUIRED SCRIPTS -->
|
||
|
|
||
|
<!-- jQuery -->
|
||
|
%= javascript "/plugins/jquery/jquery.min.js"
|
||
|
|
||
|
<!-- Bootstrap 4 -->
|
||
|
%= javascript "/plugins/bootstrap/js/bootstrap.bundle.min.js"
|
||
|
<!-- AdminLTE App -->
|
||
|
%= javascript "/dist/js/adminlte.min.js"
|
||
|
|
||
|
<!-- Breadcrumbs
|
||
|
%= javascript "/js/jquery-bootstrap-breadcrumb.js"
|
||
|
-->
|
||
|
|
||
|
<!--
|
||
|
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.0/dist/js/bootstrap.bundle.min.js" integrity="sha384-Piv4xVNRyMGpqkS2by6br4gNJ7DXjqk09RmUpJ8jgGtD7zP9yug3goQfGII0yAns" crossorigin="anonymous"></script>
|
||
|
-->
|
||
|
|
||
|
|
||
|
<!-- SME specific scripts -->
|
||
|
%= include 'common_js'
|
||
|
%= content 'js_swapClass'
|
||
|
%= content 'js_togglePassword'
|
||
|
<script>
|
||
|
$(document).ready(function() {
|
||
|
const classSelector = 'adminlte-version';
|
||
|
const versionType = 'full'; // 'full' OR true;
|
||
|
for (var i = 0, max = document.styleSheets.length; i < max; i++) {
|
||
|
if (document.styleSheets[i].href == null) continue;
|
||
|
if ((document.styleSheets[i].href).includes("adminlte")) {
|
||
|
$.ajax({
|
||
|
url: document.styleSheets[i].href,
|
||
|
dataType: "text",
|
||
|
success: function(cssText) {
|
||
|
const searchReg = /AdminLTE v([0-9.]{0,})/;
|
||
|
const result = cssText.match(searchReg);
|
||
|
if (result != null){ $(`.${classSelector}`).text(result[versionType == 'full' ? 0 : 1]);}
|
||
|
}
|
||
|
});
|
||
|
}
|
||
|
}
|
||
|
/* Overload the sme classes with those from AdminLTE */
|
||
|
$(".sme-error").addClass("card card-danger card-body");
|
||
|
$(".sme-warning").addClass("card card-warning card-body");
|
||
|
$(".success").addClass("card card-success card-body");
|
||
|
$(".sme-success").addClass("card card-success card-body");
|
||
|
$("table.sme-border").addClass("table table-striped" );
|
||
|
|
||
|
//$("table.table-sort").DataTable();
|
||
|
$(".dataTables_length").addClass("bs-select");
|
||
|
|
||
|
$("#footer").addClass("card card-info card-body");
|
||
|
$(".module").addClass("card card-info card-body");
|
||
|
$(".central").addClass("card card-info card-body");
|
||
|
$(".review-panel table").addClass("table");
|
||
|
$(".module h1").addClass("card-header");
|
||
|
//$(".module h2").addClass("card-subtitle");
|
||
|
|
||
|
|
||
|
$(".menu-cell").addClass("nav-item");
|
||
|
$(".item").addClass("nav-link");
|
||
|
$(".infobar").addClass("row");
|
||
|
$(".label").addClass("float-left");
|
||
|
$(".action").addClass("float-right btn btn-primary");
|
||
|
|
||
|
|
||
|
$("#h2l1").addClass("row");
|
||
|
$("#h2e22").addClass("float-right");
|
||
|
$("#h2e23").addClass("float-right");
|
||
|
$("#h2e12").addClass("float-right");
|
||
|
|
||
|
//table sort icon
|
||
|
$(".column-sort").addClass("fa fa-sort");
|
||
|
|
||
|
/*Dark mode changes*/
|
||
|
var mode = localStorage.getItem('darkmode');
|
||
|
var myselect = document.getElementById("darkmodeswtid");
|
||
|
if (mode == "") {myselect.checked = false;}
|
||
|
else {myselect.checked = true;}
|
||
|
$("#darkmodeswtid").val(mode).change();
|
||
|
|
||
|
|
||
|
/* Sort out font size */
|
||
|
var fontsize = localStorage.getItem('fontsize');
|
||
|
if (fontsize == ""){fontsize = 'text-md'}
|
||
|
$("#fontsizeid").val(fontsize).change();
|
||
|
|
||
|
|
||
|
|
||
|
var url = window.location;
|
||
|
|
||
|
// for sidebar menu entirely but not cover treeview - not yet working...
|
||
|
//
|
||
|
$('.nav-link').filter(function() {
|
||
|
return this.href == url;
|
||
|
}).parent().addClass('active');
|
||
|
|
||
|
/*
|
||
|
var options = "";
|
||
|
var breadcrumb = $('.breadcrumb').breadcrumb(options);
|
||
|
breadcrumb.push('Level');
|
||
|
breadcrumb.pop();
|
||
|
*/
|
||
|
|
||
|
});
|
||
|
|
||
|
function SetFontSize(){
|
||
|
var myselect = document.getElementById("fontsizeid");
|
||
|
var textclass = myselect.options[myselect.selectedIndex].value;
|
||
|
$("body").removeClass('text-xs text-sm text-md text-lg text-xl').addClass(textclass);
|
||
|
localStorage.setItem('fontsize',textclass);
|
||
|
};
|
||
|
|
||
|
function SetDarkMode(){
|
||
|
var myselect = document.getElementById("darkmodeswtid");
|
||
|
var mode = '';
|
||
|
if (myselect.checked) {mode = "dark-mode";}
|
||
|
$("body").removeClass('dark-mode').addClass(mode);
|
||
|
localStorage.setItem('darkmode',mode);
|
||
|
};
|
||
|
|
||
|
|
||
|
(function ($) {
|
||
|
$.fn.replaceClass = function (pFromClass, pToClass) {
|
||
|
return this.removeClass(pFromClass).addClass(pToClass);
|
||
|
};
|
||
|
}(jQuery));
|
||
|
|
||
|
|
||
|
/** add active class and stay opened when selected */
|
||
|
|
||
|
// for treeview - not currently used. (but I may do!!)
|
||
|
$('ul.treeview-menu a').filter(function() {
|
||
|
return this.href == url;
|
||
|
}).parentsUntil(".sidebar-menu > .treeview-menu").addClass('active');
|
||
|
|
||
|
|
||
|
</script>
|
||
|
</body>
|
||
|
</html>
|