Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Improve top right menu and sidebar #2298

Merged
merged 10 commits into from
Aug 20, 2022
Merged

Improve top right menu and sidebar #2298

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
10 commits
Select commit Hold shift + click to select a range
f528829
Testing a shorter main menu + top menu
rdwebdesign Aug 13, 2022
4687476
Different order
rdwebdesign Aug 13, 2022
836b7ab
Fix logout link
rdwebdesign Aug 13, 2022
1785784
Change left hamburger menu icon to arrows
yubiuser Aug 13, 2022
1fdb5e7
Remove session timer leftovers
yubiuser Aug 13, 2022
621f9c0
Add link to releases on discourse
yubiuser Aug 13, 2022
70dce5f
Fix donate button on mobile
yubiuser Aug 13, 2022
4e76c43
Remove unused $auth
yubiuser Aug 13, 2022
944ce3a
Tweak topbar and sidebar
rdwebdesign Aug 13, 2022
5b4f8d8
Improve pi-hole SVG icon
rdwebdesign Aug 14, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 0 additions & 10 deletions index.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -90,14 +90,6 @@
</div>
</div>
</div>
<?php
// If the user is logged in, then we show the more detailed index page.
// Even if we would include them here anyhow, there would be nothing to
// show since the API will respect the privacy of the user if he defines
// a password
if ($auth) {
?>

<div class="row">
<div class="col-md-12">
<div class="box" id="clients">
Expand Down Expand Up @@ -285,8 +277,6 @@
<!-- /.col -->
</div>
<!-- /.row -->
<?php
} ?>

<script src="scripts/pi-hole/js/index.js?v=<?php echo $cacheVer; ?>"></script>

Expand Down
38 changes: 0 additions & 38 deletions scripts/pi-hole/js/footer.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -255,44 +255,6 @@ $("#pihole-disable-custom").on("click", function (e) {
piholeChange("disable", custVal);
});

// Session timer
function updateSessionTimer() {
start = new Date();
start.setSeconds(start.getSeconds() + sessionvalidity);
}

var sessionTimerCounter, sessionvalidity, start;

var sessiontimer = document.getElementById("sessiontimer");
if (sessiontimer) {
sessionTimerCounter = document.getElementById("sessiontimercounter");
sessionvalidity = parseInt(sessionTimerCounter.textContent, 10);
start = new Date();

if (sessionvalidity > 0) {
// setSeconds will correctly handle wrap-around cases
updateSessionTimer();

setInterval(function () {
var current = new Date();
var totalseconds = (start - current) / 1000;
var minutes = Math.floor(totalseconds / 60);
if (minutes < 10) {
minutes = "0" + minutes;
}

var seconds = Math.floor(totalseconds % 60);
if (seconds < 10) {
seconds = "0" + seconds;
}

sessionTimerCounter.textContent = totalseconds > 0 ? minutes + ":" + seconds : "-- : --";
}, 1000);
} else {
sessiontimer.style.display = "none";
}
}

// Handle Ctrl + Enter button on Login page
$(document).keypress(function (e) {
if ((e.keyCode === 10 || e.keyCode === 13) && e.ctrlKey && $("#loginpw").is(":focus")) {
Expand Down
4 changes: 1 addition & 3 deletions scripts/pi-hole/js/index.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
* This file is copyright under the latest version of the EUPL.
* Please see LICENSE file for your rights under this license. */

/* global utils:false, Chart:false, updateSessionTimer:false */
/* global utils:false, Chart:false */

// Define global variables
var timeLineChart, clientsChart;
Expand Down Expand Up @@ -774,8 +774,6 @@ function updateSummaryData(runOnce) {
};

$.getJSON("api.php?summaryRaw", function (data) {
updateSessionTimer();

if ("FTLnotrunning" in data) {
data.dns_queries_today = "Lost";
data.ads_blocked_today = "connection";
Expand Down
13 changes: 8 additions & 5 deletions scripts/pi-hole/php/header.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -38,17 +38,12 @@
<!-- Theme styles -->
<?php if ($theme == 'default-light') { ?>
<meta name="theme-color" content="#367fa9">
<link rel="stylesheet" href="style/vendor/SourceSansPro/SourceSansPro.css?v=<?php echo $cacheVer; ?>">
<?php } elseif ($theme == 'default-dark') { ?>
<meta name="theme-color" content="#272c30">
<link rel="stylesheet" href="style/vendor/SourceSansPro/SourceSansPro.css?v=<?php echo $cacheVer; ?>">
<?php } elseif ($theme == 'default-darker') { ?>
<meta name="theme-color" content="#2e6786">
<link rel="stylesheet" href="style/vendor/SourceSansPro/SourceSansPro.css?v=<?php echo $cacheVer; ?>">
<?php } elseif ($theme == 'lcars') { ?>
<meta name="theme-color" content="#4488FF">
<link rel="stylesheet" href="style/vendor/fonts/ubuntu-mono/ubuntu-mono.css?v=<?php echo $cacheVer; ?>">
<link rel="stylesheet" href="style/vendor/fonts/antonio/antonio.css?v=<?php echo $cacheVer; ?>">
<?php } ?>

<?php if ($darkmode) { ?>
Expand All @@ -57,6 +52,14 @@
</style>
<?php } ?>

<!-- Theme fonts -->
<?php if ($theme == 'lcars') { ?>
<link rel="stylesheet" href="style/vendor/fonts/ubuntu-mono/ubuntu-mono.css?v=<?php echo $cacheVer; ?>">
<link rel="stylesheet" href="style/vendor/fonts/antonio/antonio.css?v=<?php echo $cacheVer; ?>">
<?php } else { ?>
<link rel="stylesheet" href="style/vendor/SourceSansPro/SourceSansPro.css?v=<?php echo $cacheVer; ?>">
<?php } ?>

<!-- Common styles -->
<link rel="stylesheet" href="style/vendor/bootstrap/css/bootstrap.min.css?v=<?php echo $cacheVer; ?>">
<?php if ($auth) { ?>
Expand Down
59 changes: 26 additions & 33 deletions scripts/pi-hole/php/header_authenticated.php
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -158,6 +158,17 @@ function getTemperature()
<div id="enableTimer" hidden><?php if (file_exists('../custom_disable_timer')) {
echo file_get_contents('../custom_disable_timer');
} ?></div>
<!-- Pi-hole SVG icon - used in topmenu and sidebar -->
<svg display="none">
<symbol id="pihole-svg-logo" viewBox="0 0 200 200">
<path d="M88.387 61.745C63.6 59.101 38.632 40.367 36.66.728c38.462 0 59.03 22.769 61.017 58.846 7.273-43.275 41.366-38.203 41.366-38.203 1.619 24.526-18.52 39.394-41.366 40.632C91.26 48.48 52.813 15.305 52.813 15.305a.108.108 0 0 0-.169.122c0 .001 37.102 32.32 35.743 46.318" fill="currentcolor"/>
<path d="M100 199.272c-2.399-.137-24.785-.993-26.145-26.145-1.1-15.28 10.972-26.543 10.972-41.38-2.736-36.994-52.307-32.41-52.307 0a30.472 30.472 0 0 0 8.91 21.608l36.933 36.949a30.466 30.466 0 0 0 21.607 8.908" fill="currentColor"/>
<path d="M167.48 131.762c-.137 2.399-.994 24.785-26.146 26.145-15.28 1.1-26.558-10.972-41.38-10.972-36.996 2.736-32.41 52.292 0 52.292a30.468 30.468 0 0 0 21.607-8.91l36.965-36.933a30.466 30.466 0 0 0 8.908-21.607" fill="currentColor"/>
<path d="M100 64.282c2.399.137 24.786.992 26.146 26.145 1.1 15.281-10.972 26.543-10.972 41.38 2.735 36.995 52.292 32.41 52.292 0a30.465 30.465 0 0 0-8.91-21.607l-36.949-36.965A30.468 30.468 0 0 0 100 64.326" fill="currentColor"/>
<path d="M32.642 131.762c.137-2.4.994-24.786 26.145-26.146 15.28-1.101 26.558 10.972 41.38 10.972 36.996-2.781 32.411-52.292 0-52.292a30.468 30.468 0 0 0-21.607 8.91l-36.964 36.949a30.472 30.472 0 0 0-8.91 21.607" fill="currentColor"/>
</symbol>
</svg>

<div class="wrapper">
<header class="main-header">
<!-- Logo -->
Expand All @@ -171,63 +182,45 @@ function getTemperature()
<nav class="navbar navbar-static-top">
<!-- Sidebar toggle button-->
<a href="#" class="sidebar-toggle-svg" data-toggle="push-menu" role="button">
<i aria-hidden="true" class="fa fa-bars"></i>
<i aria-hidden="true" class="fa fa-angle-double-left"></i>
<span class="sr-only">Toggle navigation</span>
<span class="warning-count hidden" id="top-warning-count"></span>
</a>
<div class="navbar-custom-menu">
<ul class="nav navbar-nav">
<li<?php echo !$hostname ? ' class="hidden"' : ''; ?>>
<p class="navbar-text">
<span class="hidden-xs hidden-sm">hostname:</span>
<span class="hidden-xs">hostname:</span>
<code><?php echo $hostname; ?></code>
</p>
</li>
<li class="dropdown user user-menu">
<a href="#" class="dropdown-toggle" data-toggle="dropdown" aria-expanded="false">
<img src="img/logo.svg" class="user-image" alt="Pi-hole logo" style="border-radius: 0" width="25" height="25">
<span class="hidden-xs">Pi-hole</span>
<i class="fa fa-bars"></i>
</a>
<ul class="dropdown-menu">
<!-- User image -->
<li class="user-header">
<img src="img/logo.svg" alt="Pi-hole Logo" style="border: 0" width="90" height="90">
<p>
Open Source Ad Blocker
<small>Designed For Raspberry Pi</small>
</p>
</li>
<!-- Menu Body -->
<li class="user-body">
<div class="row">
<div class="col-xs-4 text-center">
<a class="btn-link" href="https://github.com/pi-hole" rel="noopener" target="_blank">GitHub</a>
</div>
<div class="col-xs-4 text-center">
<a class="btn-link" href="https://pi-hole.net/" rel="noopener" target="_blank">Website</a>
</div>
<div class="col-xs-4 text-center">
<a class="btn-link" href="https://github.com/pi-hole/pi-hole/releases" rel="noopener" target="_blank">Updates</a>
</div>
<div id="sessiontimer" class="col-xs-12 text-center">
<strong>Session is valid for <span id="sessiontimercounter">
<?php if ($auth && strlen($pwhash) > 0) {
echo $maxlifetime;
} else {
echo '0';
} ?>
</span></strong>
</div>
</div>
</li>
<!-- <li class="user-body"></li> -->
<!-- Menu Footer -->
<li class="user-footer">
<!-- Donate Button -->
<div class="text-center">
<a class="btn btn-primary btn-lg donate" href="https://pi-hole.net/donate/" rel="noopener" target="_blank">
<i class="fas fa-fw menu-icon fa-donate"></i> Donate
</a>
</div>
<a class="btn-link" href="https://pi-hole.net/" rel="noopener" target="_blank">
<svg class="svg-inline--fa fa-fw menu-icon" style="height: 1.25em"><use xlink:href="#pihole-svg-logo"/></svg>
Pi-hole Website
</a>
<hr>
<a class="btn-link" href="https://docs.pi-hole.net/" rel="noopener" target="_blank"><i class="fa fa-fw menu-icon fa-question-circle"></i> Documentation</a>
<a class="btn-link" href="https://discourse.pi-hole.net/" rel="noopener" target="_blank"><i class="fa fa-fw menu-icon fab fa-discourse"></i> Pi-hole Forum</a>
<a class="btn-link" href="https://github.com/pi-hole" rel="noopener" target="_blank"><i class="fa-fw menu-icon fab fa-github"></i> GitHub</a>
<a class="btn-link" href="https://discourse.pi-hole.net/c/announcements/5" rel="noopener" target="_blank"><i class="fa-fw menu-icon fa fa-regular fa-rocket"></i> Pi-hole Releases</a>
<hr>
<a class="btn-link" href="logout.php" rel="noopener"><i class="fa fa-fw menu-icon fa-sign-out-alt"></i> Log out</a>
</li>
</ul>
</li>
Expand Down
Loading