Commit 5c6bc46f authored by dmorley's avatar dmorley

let users pick pagezize in advanced

try some non-bootstrap default colors and font
parent 504a3b31
@import url("/node_modules/typeface-roboto/index.css");
body {
font-family: 'Roboto', sans-serif;
font-weight: 400;
--blue: #4b6588;
--grey: #cecaa7;
--green: #A07614;
}
.bg-blue {
background-color: var(--blue) !important;
}
.blue {
color: var(--blue);
}
.bg-green {
background-color: var(--green);
}
.green {
color: var(--green);
}
.bg-grey {
background-color: var(--grey);
}
.grey {
color: var(--grey);
}
a {
color: var(--blue);
}
.tablesorter-header {
background-color: var(--grey) !important;
}
.main { .main {
padding: 5px; padding: 5px;
} }
......
...@@ -63,11 +63,11 @@ $navs = [ ...@@ -63,11 +63,11 @@ $navs = [
]; ];
?> ?>
<header> <header>
<div class="collapse bg-dark" id="navbarHeader"> <div class="collapse bg-grey" id="navbarHeader">
<div class="container"> <div class="container">
<div class="row"> <div class="row">
<div class="col-sm-8 col-md-7 py-4"> <div class="col-sm-8 col-md-7 py-4">
<h4 class="text-white">About</h4> <h4 class="text-black">About</h4>
<p class="text-muted">Poduptime helps you find a diaspora, friendica, hubzilla or socialhome pod to use and join the federated social network.</p> <p class="text-muted">Poduptime helps you find a diaspora, friendica, hubzilla or socialhome pod to use and join the federated social network.</p>
<ul class="navbar-nav"> <ul class="navbar-nav">
<?php <?php
...@@ -83,7 +83,7 @@ $navs = [ ...@@ -83,7 +83,7 @@ $navs = [
</ul> </ul>
</div> </div>
<div class="col-sm-4 offset-md-1 py-4"> <div class="col-sm-4 offset-md-1 py-4">
<h4 class="text-white">Views</h4> <h4 class="text-black">Views</h4>
<ul class="navbar-nav"> <ul class="navbar-nav">
<?php <?php
foreach ($navs['views'] as $nav_item) { foreach ($navs['views'] as $nav_item) {
...@@ -101,7 +101,7 @@ $navs = [ ...@@ -101,7 +101,7 @@ $navs = [
</div> </div>
</div> </div>
</div> </div>
<div class="navbar navbar-dark bg-dark box-shadow"> <div class="navbar navbar-dark bg-blue box-shadow">
<div class="container d-flex justify-content-between"> <div class="container d-flex justify-content-between">
<a href="/" class="navbar-brand d-flex align-items-center"> <a href="/" class="navbar-brand d-flex align-items-center">
<strong>Poduptime</strong> <strong>Poduptime</strong>
......
...@@ -3,7 +3,9 @@ var $table = $('.tablesorter'), ...@@ -3,7 +3,9 @@ var $table = $('.tablesorter'),
container: $(".pager"), container: $(".pager"),
output: '{startRow} - {endRow} of {filteredRows} total', output: '{startRow} - {endRow} of {filteredRows} total',
removeRows: false, removeRows: false,
cssGoto: '.gotoPage' size: 15,
savePages : true,
cssPageSize: '.pagesize'
}; };
$table $table
.tablesorter({ .tablesorter({
...@@ -34,6 +36,7 @@ $(document).ready(function () { ...@@ -34,6 +36,7 @@ $(document).ready(function () {
$('.columnSelectorWrapper').hide(); $('.columnSelectorWrapper').hide();
$('.columnssimple').hide(); $('.columnssimple').hide();
$('.resetfilters').hide(); $('.resetfilters').hide();
$('.pagesize').hide();
$('.columnsadvanced').show().css('display', 'inline-block'); $('.columnsadvanced').show().css('display', 'inline-block');
$('table').trigger('filterReset'); $('table').trigger('filterReset');
}); });
...@@ -43,12 +46,12 @@ $(document).ready(function () { ...@@ -43,12 +46,12 @@ $(document).ready(function () {
$('.columnSelectorWrapper').show().css('display', 'inline-block'); $('.columnSelectorWrapper').show().css('display', 'inline-block');
$('.columnssimple').show().css('display', 'inline-block'); $('.columnssimple').show().css('display', 'inline-block');
$('.resetfilters').show().css('display', 'inline-block'); $('.resetfilters').show().css('display', 'inline-block');
$('.pagesize').show().css('display', 'inline-block');
$('.columnsadvanced').hide(); $('.columnsadvanced').hide();
}); });
$('.resetfilters').on('click', function () { $('.resetfilters').on('click', function () {
$('table').trigger('filterReset'); $('table').trigger('filterReset');
}); });
$('table').trigger('pageSize', 15);
$.get('tabledata.php?ajax=page2', function (html) { $.get('tabledata.php?ajax=page2', function (html) {
$('table tbody').append(html); $('table tbody').append(html);
$('table').trigger('update', [true]); $('table').trigger('update', [true]);
......
...@@ -13,7 +13,8 @@ ...@@ -13,7 +13,8 @@
"leaflet": "^1.3.3", "leaflet": "^1.3.3",
"leaflet.markercluster": "^1.3.0", "leaflet.markercluster": "^1.3.0",
"popper.js": "^1.14.3", "popper.js": "^1.14.3",
"tablesorter": "^2.30.7" "tablesorter": "^2.30.7",
"typeface-roboto": "^0.0.54"
}, },
"scripts": { "scripts": {
"test": "echo \"Error: no test specified\" && exit 1" "test": "echo \"Error: no test specified\" && exit 1"
......
...@@ -52,8 +52,8 @@ try { ...@@ -52,8 +52,8 @@ try {
label: 'Users', label: 'Users',
fill: false, fill: false,
yAxisID: "l2", yAxisID: "l2",
borderColor: "#e67e22", borderColor: "#A07614",
backgroundColor: "#e67e22", backgroundColor: "#A07614",
borderWidth: 4, borderWidth: 4,
pointHoverRadius: 6 pointHoverRadius: 6
}, { }, {
...@@ -61,8 +61,8 @@ try { ...@@ -61,8 +61,8 @@ try {
label: 'Local Posts', label: 'Local Posts',
fill: false, fill: false,
yAxisID: "l2", yAxisID: "l2",
borderColor: "#2980b9", borderColor: "#4b6588",
backgroundColor: "#2980b9", backgroundColor: "#4b6588",
borderWidth: 4, borderWidth: 4,
pointHoverRadius: 6 pointHoverRadius: 6
}, { }, {
...@@ -70,8 +70,8 @@ try { ...@@ -70,8 +70,8 @@ try {
label: 'Comments', label: 'Comments',
fill: false, fill: false,
yAxisID: "l2", yAxisID: "l2",
borderColor: "#FFD700", borderColor: "#cecaa7",
backgroundColor: "#FFD700", backgroundColor: "#cecaa7",
borderWidth: 4, borderWidth: 4,
pointHoverRadius: 6 pointHoverRadius: 6
}] }]
......
...@@ -51,8 +51,8 @@ try { ...@@ -51,8 +51,8 @@ try {
label: 'Uptime %', label: 'Uptime %',
fill: false, fill: false,
yAxisID: "l1", yAxisID: "l1",
borderColor: "#2ecc71", borderColor: "#A07614",
backgroundColor: "#2ecc71", backgroundColor: "#A07614)",
borderWidth: 4, borderWidth: 4,
pointHoverRadius: 6 pointHoverRadius: 6
}, { }, {
...@@ -60,8 +60,8 @@ try { ...@@ -60,8 +60,8 @@ try {
label: 'Latency ms', label: 'Latency ms',
fill: false, fill: false,
yAxisID: "r1", yAxisID: "r1",
borderColor: "#a93226", borderColor: "#4b6588",
backgroundColor: "#a93226", backgroundColor: "#4b6588",
borderWidth: 4, borderWidth: 4,
pointHoverRadius: 6, pointHoverRadius: 6,
pointStyle: 'rect' pointStyle: 'rect'
......
...@@ -21,19 +21,19 @@ $country_code = $_SERVER['HTTP_CF_IPCOUNTRY'] ?? ''; ...@@ -21,19 +21,19 @@ $country_code = $_SERVER['HTTP_CF_IPCOUNTRY'] ?? '';
} }
</style> </style>
<div class="float-right float-md-left float-sm-right"> <div class="float-right float-md-left float-sm-right">
<a href="go.php" class="m-1 btn btn-sm btn-info">Auto pick a pod</a> <a href="go.php" class="m-1 btn btn-sm bg-green text-white">Auto pick a pod</a>
<a href="#" class="m-1 btn btn-sm btn-info" data-featherlight-variant="table-responsive" data-featherlight="wizard.php?page=1">Use pod wizard</a> <a href="#" class="m-1 btn btn-sm bg-green text-white" data-featherlight-variant="table-responsive" data-featherlight="wizard.php?page=1">Use pod wizard</a>
</div> </div>
<div class="float-right"> <div class="float-right">
<button type="button" class="columnssimple hidden m-1 btn btn-sm btn-info">Simple View</button> <button type="button" class="columnssimple hidden m-1 btn btn-sm bg-grey">Simple View</button>
<div class="columnSelectorWrapper m-1"> <div class="columnSelectorWrapper m-1">
<input id="colSelect1" type="checkbox" class="hidden"> <input id="colSelect1" type="checkbox" class="hidden">
<label class="columnSelectorButton m-1 btn btn-sm btn-info" for="colSelect1">Select Columns</label> <label class="columnSelectorButton m-1 btn btn-sm bg-grey" for="colSelect1">Select Columns</label>
<div id="columnSelector" class="dropdown columnSelector"> <div id="columnSelector" class="dropdown columnSelector">
</div> </div>
</div> </div>
<button type="button" class="resetfilters m-1 btn btn-sm btn-info hidden">Reset Filters</button> <button type="button" class="resetfilters m-1 btn btn-sm bg-grey hidden">Reset Filters</button>
<button type="button" class="columnsadvanced m-1 btn btn-sm btn-info">Advanced View</button> <button type="button" class="columnsadvanced m-1 btn btn-sm bg-grey">Advanced View</button>
</div> </div>
<div class="pager hidden float-right float-md-left"> <div class="pager hidden float-right float-md-left">
...@@ -44,6 +44,15 @@ $country_code = $_SERVER['HTTP_CF_IPCOUNTRY'] ?? ''; ...@@ -44,6 +44,15 @@ $country_code = $_SERVER['HTTP_CF_IPCOUNTRY'] ?? '';
<span class="next pagination" title="Next page">&gt;</span> <span class="next pagination" title="Next page">&gt;</span>
<span class="last pagination" title="Last page">&raquo;</span> <span class="last pagination" title="Last page">&raquo;</span>
<div class="d-inline-block">
<select class="pagesize hidden form-control form-control-sm">
<option value="15">15</option>
<option value="60">60</option>
<option value="120">120</option>
<option value="240">240</option>
<option value="all">All</option>
</select>
</div>
</div> </div>
<div class="table-responsive"> <div class="table-responsive">
...@@ -51,7 +60,7 @@ $country_code = $_SERVER['HTTP_CF_IPCOUNTRY'] ?? ''; ...@@ -51,7 +60,7 @@ $country_code = $_SERVER['HTTP_CF_IPCOUNTRY'] ?? '';
<div class="signal"></div> <div class="signal"></div>
</div> </div>
<table class="table table-bordered table-sm tablesorter table-hover tfont"> <table class="table table-bordered table-sm tablesorter table-hover tfont">
<thead class="thead-dark"> <thead class="thead-grey">
<tr> <tr>
<th data-priority="1" class="columnSelector-disable"><div data-toggle="tooltip" title="A pod is a site for you to set up your account.">Pod</div></th> <th data-priority="1" class="columnSelector-disable"><div data-toggle="tooltip" title="A pod is a site for you to set up your account.">Pod</div></th>
<th class="columnSelector-false"><div>Name</div></th> <th class="columnSelector-false"><div>Name</div></th>
......
...@@ -34,9 +34,9 @@ foreach ($pods as $pod) { ...@@ -34,9 +34,9 @@ foreach ($pods as $pod) {
$tip = "Over the last {$humanmonitored} uptime was {$pod['uptime_alltime']}% and response time from Los Angeles was {$pod['latency']}ms."; $tip = "Over the last {$humanmonitored} uptime was {$pod['uptime_alltime']}% and response time from Los Angeles was {$pod['latency']}ms.";
if (($_COOKIE['domain'] ?? null) === $pod['domain']) { if (($_COOKIE['domain'] ?? null) === $pod['domain']) {
echo '<tr><td title="This is the last pod you visited from this site. ' . $tip . '" data-placement="right" data-toggle="tooltip" class="bg-secondary"><a class="text-warning url" target="_pod" href="/go.php?domain=' . $pod['domain'] . '">' . $pod['domain'] . '</a></td>'; echo '<tr><td title="This is the last pod you visited from this site. ' . $tip . '" data-placement="right" data-toggle="tooltip" class="bg-blue"><a class="text-white url" target="_pod" href="/go.php?domain=' . $pod['domain'] . '">' . $pod['domain'] . '</a></td>';
} else { } else {
echo '<tr><td data-placement="right" title="' . $tip . '" data-toggle="tooltip"><a class="text-success url" target="_pod" href="/go.php?domain=' . $pod['domain'] . '">' . $pod['domain'] . '</a></td>'; echo '<tr><td data-placement="right" title="' . $tip . '" data-toggle="tooltip"><a class="url" target="_pod" href="/go.php?domain=' . $pod['domain'] . '">' . $pod['domain'] . '</a></td>';
} }
if ($pod['shortversion'] > $pod['masterversion']) { if ($pod['shortversion'] > $pod['masterversion']) {
...@@ -50,11 +50,11 @@ foreach ($pods as $pod) { ...@@ -50,11 +50,11 @@ foreach ($pods as $pod) {
$pre = 'This pod runs production code'; $pre = 'This pod runs production code';
} }
$classver = 'black'; $classver = 'green';
if (version_compare($pod['shortversion'] ?? '', $pod['masterversion'] ?? '', '=')) { if (version_compare($pod['shortversion'] ?? '', $pod['masterversion'] ?? '', '=')) {
$classver = 'text-success'; $classver = 'black';
} elseif (version_compare($pod['shortversion'] ?? '', $pod['masterversion'] ?? '', '<')) { } elseif (version_compare($pod['shortversion'] ?? '', $pod['masterversion'] ?? '', '<')) {
$classver = 'text-warning'; $classver = 'text-danger';
} }
echo '<td>' . $pod['name'] . '</td>'; echo '<td>' . $pod['name'] . '</td>';
echo '<td class="' . $classver . '"><div title="' . $pre . ' version: ' . $pod['shortversion'] . ' master version is: ' . ($pod['masterversion'] ?: 'unknown') . '" data-toggle="tooltip">' . $version . '</div></td>'; echo '<td class="' . $classver . '"><div title="' . $pre . ' version: ' . $pod['shortversion'] . ' master version is: ' . ($pod['masterversion'] ?: 'unknown') . '" data-toggle="tooltip">' . $version . '</div></td>';
......
...@@ -101,7 +101,7 @@ if ($page === 1) { ...@@ -101,7 +101,7 @@ if ($page === 1) {
</label> </label>
</div> </div>
</div> </div>
<button type="button" class="wizardnext2 btn btn-info">Next</button> <button type="button" class="wizardnext2 btn bg-grey">Next</button>
EOF; EOF;
} elseif ($page === 2) { } elseif ($page === 2) {
...@@ -120,7 +120,7 @@ EOF; ...@@ -120,7 +120,7 @@ EOF;
country($country)->getEmoji() country($country)->getEmoji()
); );
} }
echo '</div></div><button type="button" class="wizardnext3 btn btn-info">Next</button>'; echo '</div></div><button type="button" class="wizardnext3 btn bg-grey">Next</button>';
} elseif ($page === 3) { } elseif ($page === 3) {
$languages = data('detectedlanguage', $softwarename, $country); $languages = data('detectedlanguage', $softwarename, $country);
// Sort language names correctly. // Sort language names correctly.
...@@ -136,7 +136,7 @@ EOF; ...@@ -136,7 +136,7 @@ EOF;
$iso->languageByCode1($language) $iso->languageByCode1($language)
); );
} }
echo '</div></div><button type="button" class="wizardnext4 btn btn-info">Next</button>'; echo '</div></div><button type="button" class="wizardnext4 btn bg-grey">Next</button>';
} elseif ($page === 4) { } elseif ($page === 4) {
$months = data('monthsmonitored', $softwarename, $country, $language); $months = data('monthsmonitored', $softwarename, $country, $language);
$min = min($months); $min = min($months);
...@@ -148,7 +148,7 @@ EOF; ...@@ -148,7 +148,7 @@ EOF;
echo '<div class="row m-1 p-1"><div class="col-9">Months Online Minimum:</div><div class="col-8">'; echo '<div class="row m-1 p-1"><div class="col-9">Months Online Minimum:</div><div class="col-8">';
printf('<input type="text" name="month" id="month" data-min="%d" data-max="%d" data-step="1">', $min, $max); printf('<input type="text" name="month" id="month" data-min="%d" data-max="%d" data-step="1">', $min, $max);
} }
echo '</div></div><button type="button" class="suggestpod btn btn-info">Suggest a Pod</button>'; echo '</div></div><button type="button" class="suggestpod btn bg-grey">Suggest a Pod</button>';
} }
......
...@@ -73,3 +73,7 @@ tablesorter@^2.30.7: ...@@ -73,3 +73,7 @@ tablesorter@^2.30.7:
resolved "https://registry.yarnpkg.com/tablesorter/-/tablesorter-2.30.7.tgz#91e01fa256b270e6a8b2bca0b0e714b647af2d0c" resolved "https://registry.yarnpkg.com/tablesorter/-/tablesorter-2.30.7.tgz#91e01fa256b270e6a8b2bca0b0e714b647af2d0c"
dependencies: dependencies:
jquery ">=1.2.6" jquery ">=1.2.6"
typeface-roboto@^0.0.54:
version "0.0.54"
resolved "https://registry.yarnpkg.com/typeface-roboto/-/typeface-roboto-0.0.54.tgz#8f02c9a18d1cfa7f49381a6ff0d21ff061f38ad2"
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment