phares3757/gatus
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Move refresh interval to bottom left corner instead

Browse Source 
+ Use icon
+ Minor improvements
This commit is contained in:
TwinProduction 2020-10-02 12:08:52 -04:00
parent a29f175cba
commit 261fe27b2e
1 changed files with 34 additions and 29 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

63
static/index.html
View File

@ -90,6 +90,15 @@
#social img:hover { #social img:hover {
opacity: 1; opacity: 1;
} }
#settings {
position: fixed;
left: 5px;
bottom: 5px;
padding: 5px;
}
#settings select:focus {
box-shadow: none;
}
</style> </style>
</head> </head>
<body> <body>
@ -104,19 +113,6 @@
</div> </div>
</div> </div>
</div> </div>
<div class="mb-2">
<div class="row flex-row-reverse">
<div class="col-2">
<div class="input-group mb-3">
<select class="custom-select" id="refreshRate">
</select>
<div class="input-group-append">
<label class="input-group-text" for="refreshRate">Seconds</label>
</div>
</div>
</div>
</div>
</div>
<div id="results"></div> <div id="results"></div>
</div> </div>
@ -141,10 +137,26 @@
</a> </a>
</div> </div>
<div id="settings">
<div class="input-group input-group-sm">
<div class="input-group-prepend">
<div class="input-group-text">&#x21bb;</div>
</div>
<select class="form-control form-control-sm" id="refresh-rate">
<option value="10">10s</option>
<option value="30" selected>30s</option>
<option value="60">1m</option>
<option value="120">2m</option>
<option value="300">5m</option>
<option value="600">10m</option>
</select>
</div>
</div>
<script> <script>
let serviceStatuses = {}; let serviceStatuses = {};
let timerHandler = 0; let timerHandler = 0;
let refreshInterval = 0; let refreshIntervalHandler = 0;
let userClickedStatus = false; let userClickedStatus = false;
function showTooltip(serviceName, index, element) { function showTooltip(serviceName, index, element) {
@ -305,26 +317,19 @@
.replace(/'/g, '&apos;'); .replace(/'/g, '&apos;');
} }
function setRefreshInterval(i) { function setRefreshInterval(seconds) {
refreshResults(); refreshResults();
refreshInterval = setInterval(function() { refreshIntervalHandler = setInterval(function() {
refreshResults(); refreshResults();
}, i) }, seconds * 1000)
} }
$("#refreshRate").change(function() { $("#refresh-rate").change(function() {
clearInterval(refreshInterval); clearInterval(refreshIntervalHandler);
setRefreshInterval($(this).val() * 1000) setRefreshInterval($(this).val())
}); });
setRefreshInterval(30);
for (var i = 5; i <= 600; i++) { $("#refresh-rate").val(30);
if (i%5 == 0) {
$("#refreshRate").append(new Option(i, i));
}
}
$("#refreshRate").val(30);
setRefreshInterval(30000)
</script> </script>
</body> </body>
</html> </html>