mirror of
https://github.com/pi-hole/web.git
synced 2025-12-20 02:38:28 +00:00
Refactor date range initialization to fetch earliest timestamp from API and set default values
Signed-off-by: Adam Warner <me@adamwarner.co.uk>
This commit is contained in:
@@ -9,10 +9,12 @@
|
|||||||
|
|
||||||
"use strict";
|
"use strict";
|
||||||
|
|
||||||
const beginningOfTime = 1_262_304_000; // Jan 01 2010, 00:00 in seconds
|
// These values are provided by the API (/info/database).
|
||||||
const endOfTime = 2_147_483_647; // Jan 19, 2038, 03:14 in seconds
|
// We initialize them as null and populate them during page init.
|
||||||
let from = beginningOfTime;
|
let beginningOfTime = null; // seconds since epoch (set from API: info/database.earliest_timestamp)
|
||||||
let until = endOfTime;
|
let endOfTime = null; // seconds since epoch (set to end of today)
|
||||||
|
let from = null;
|
||||||
|
let until = null;
|
||||||
|
|
||||||
const dateformat = "MMM Do YYYY, HH:mm";
|
const dateformat = "MMM Do YYYY, HH:mm";
|
||||||
|
|
||||||
@@ -40,7 +42,30 @@ function getDnssecConfig() {
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Fetch database info (earliest timestamp, sizes, ...) from the API and
|
||||||
|
// initialize related globals.
|
||||||
|
function getDatabaseInfo() {
|
||||||
|
$.getJSON(document.body.dataset.apiurl + "/info/database", data => {
|
||||||
|
// earliest_timestamp is provided in seconds since epoch
|
||||||
|
beginningOfTime = Number(data.earliest_timestamp_disk);
|
||||||
|
// Round down to nearest 5-minute segment (300 seconds)
|
||||||
|
beginningOfTime = Math.floor(beginningOfTime / 300) * 300;
|
||||||
|
|
||||||
|
// endOfTime should be the end of today (local), in seconds since epoch
|
||||||
|
endOfTime = moment().endOf("day").unix();
|
||||||
|
|
||||||
|
// If from/until were not provided via GET, default them
|
||||||
|
from ??= beginningOfTime;
|
||||||
|
until ??= endOfTime;
|
||||||
|
|
||||||
|
initDateRangePicker();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
function initDateRangePicker() {
|
function initDateRangePicker() {
|
||||||
|
const minDateMoment = moment.unix(beginningOfTime);
|
||||||
|
const maxDateMoment = moment.unix(endOfTime);
|
||||||
|
|
||||||
$("#querytime").daterangepicker(
|
$("#querytime").daterangepicker(
|
||||||
{
|
{
|
||||||
timePicker: true,
|
timePicker: true,
|
||||||
@@ -52,21 +77,24 @@ function initDateRangePicker() {
|
|||||||
ranges: {
|
ranges: {
|
||||||
"Last 10 Minutes": [moment().subtract(10, "minutes"), moment()],
|
"Last 10 Minutes": [moment().subtract(10, "minutes"), moment()],
|
||||||
"Last Hour": [moment().subtract(1, "hours"), moment()],
|
"Last Hour": [moment().subtract(1, "hours"), moment()],
|
||||||
Today: [moment().startOf("day"), moment().endOf("day")],
|
Today: [moment().startOf("day"), maxDateMoment],
|
||||||
Yesterday: [
|
Yesterday: [
|
||||||
moment().subtract(1, "days").startOf("day"),
|
moment().subtract(1, "days").startOf("day"),
|
||||||
moment().subtract(1, "days").endOf("day"),
|
moment().subtract(1, "days").endOf("day"),
|
||||||
],
|
],
|
||||||
"Last 7 Days": [moment().subtract(6, "days"), moment().endOf("day")],
|
"Last 7 Days": [moment().subtract(6, "days"), maxDateMoment],
|
||||||
"Last 30 Days": [moment().subtract(29, "days"), moment().endOf("day")],
|
"Last 30 Days": [moment().subtract(29, "days"), maxDateMoment],
|
||||||
"This Month": [moment().startOf("month"), moment().endOf("month")],
|
"This Month": [moment().startOf("month"), moment().endOf("month")],
|
||||||
"Last Month": [
|
"Last Month": [
|
||||||
moment().subtract(1, "month").startOf("month"),
|
moment().subtract(1, "month").startOf("month"),
|
||||||
moment().subtract(1, "month").endOf("month"),
|
moment().subtract(1, "month").endOf("month"),
|
||||||
],
|
],
|
||||||
"This Year": [moment().startOf("year"), moment().endOf("year")],
|
"This Year": [moment().startOf("year"), moment().endOf("year")],
|
||||||
"All Time": [moment(beginningOfTime * 1000), moment(endOfTime * 1000)], // convert to milliseconds since epoch
|
"All Time": [minDateMoment, maxDateMoment],
|
||||||
},
|
},
|
||||||
|
// Don't allow selecting dates outside the database range
|
||||||
|
minDate: minDateMoment,
|
||||||
|
maxDate: maxDateMoment,
|
||||||
opens: "center",
|
opens: "center",
|
||||||
showDropdowns: true,
|
showDropdowns: true,
|
||||||
autoUpdateInput: true,
|
autoUpdateInput: true,
|
||||||
@@ -510,14 +538,15 @@ $(() => {
|
|||||||
const apiURL = getAPIURL(GETDict);
|
const apiURL = getAPIURL(GETDict);
|
||||||
|
|
||||||
if ("from" in GETDict) {
|
if ("from" in GETDict) {
|
||||||
from = GETDict.from;
|
from = Number(GETDict.from);
|
||||||
}
|
}
|
||||||
|
|
||||||
if ("until" in GETDict) {
|
if ("until" in GETDict) {
|
||||||
until = GETDict.until;
|
until = Number(GETDict.until);
|
||||||
}
|
}
|
||||||
|
|
||||||
initDateRangePicker();
|
// Fetch earliest timestamp from API and initialize date picker / table
|
||||||
|
getDatabaseInfo();
|
||||||
|
|
||||||
table = $("#all-queries").DataTable({
|
table = $("#all-queries").DataTable({
|
||||||
ajax: {
|
ajax: {
|
||||||
|
|||||||
Reference in New Issue
Block a user