[statistics_reporting] Add date range selection

3 files changed, 46 insertions, 18 deletions

diff --git a/modules-available/statistics_reporting/config.json b/modules-available/statistics_reporting/config.json
index c439efa8..2bd54eb1 100644
--- a/modules-available/statistics_reporting/config.json
+++ b/modules-available/statistics_reporting/config.json
@@ -4,6 +4,7 @@
 	    "statistics",
 	    "locations",
 	    "js_stupidtable",
-	    "js_jqueryui"
+	    "js_jqueryui",
+	    "bootstrap_datepicker"
 	]
 }
\ No newline at end of file
diff --git a/modules-available/statistics_reporting/page.inc.php b/modules-available/statistics_reporting/page.inc.php
index cc03e4d8..45f93144 100644
--- a/modules-available/statistics_reporting/page.inc.php
+++ b/modules-available/statistics_reporting/page.inc.php
@@ -11,7 +11,11 @@ class Page_Statistics_Reporting extends Page
 	/**
 	 * @var int
 	 */
-	private $days;
+	private $from;
+	/**
+	 * @var int
+	 */
+	private $to;
 	/**
 	 * @var int
 	 */
@@ -46,7 +50,11 @@ class Page_Statistics_Reporting extends Page
 
 		$this->action = Request::any('action', 'show', 'string');
 		$this->type = Request::get('type', 'total', 'string');
-		$this->days = Request::get('cutoff', 7, 'int');
+
+		// Format: yyyy-mm-dd
+		$fromString = Request::get('from', '-6 days', 'string');
+		$toString = Request::get('to', 'today', 'string');
+
 		$this->lower = Request::get('lower', 8, 'int');
 		$this->upper = Request::get('upper', 20, 'int');
 
@@ -55,9 +63,13 @@ class Page_Statistics_Reporting extends Page
 			$this->type = 'total';
 		}
 
+		// convert from/to dates to unixtime
+		$this->from = min(strtotime($fromString.' 00:00:00'), time());
+		$this->to = min(strtotime($toString.' 23:59:59'), time());
+
 		// timespan you want to see. default = last 7 days
-		GetData::$from = strtotime("-" . ($this->days - 1) . " days 00:00:00");
-		GetData::$to = time();
+		GetData::$from = $this->from;
+		GetData::$to = $this->to;
 		GetData::$lowerTimeBound = $this->lower;
 		GetData::$upperTimeBound = $this->upper;
 		/*
@@ -134,6 +146,9 @@ class Page_Statistics_Reporting extends Page
 				);
 			}
 
+			$data['from'] = date_format(date_timestamp_set(new DateTime(), $this->from), 'Y-m-d');
+			$data['to'] = date_format(date_timestamp_set(new DateTime(), $this->to), 'Y-m-d');
+
 			$data['lower'] = $this->lower;
 			$data['upper'] = $this->upper;
 
diff --git a/modules-available/statistics_reporting/templates/columnChooser.html b/modules-available/statistics_reporting/templates/columnChooser.html
index d6ff90b7..8664f776 100644
--- a/modules-available/statistics_reporting/templates/columnChooser.html
+++ b/modules-available/statistics_reporting/templates/columnChooser.html
@@ -14,7 +14,23 @@
 			{{lang_displaySelection}}
 		</div>
 		<div class="panel-body">
-			<div class="row top-row">
+			<div class="row">
+				<div class="col-sm-6 col-md-4" style="display: flex; align-items: center; margin-bottom: 20px">
+					<span style="width: 40px">From:</span>
+					<div class="input-group bootstrap-timepicker timepicker" style="margin: 0 20px">
+						<span class="input-group-addon"><i class="glyphicon glyphicon-calendar"></i></span>
+						<input name="from" id="date-from" class="form-control" autocomplete="off" value="{{from}}">
+					</div>
+				</div>
+				<div class="col-sm-6 col-md-4" style="display: flex; align-items: center; margin-bottom: 20px">
+					<span style="width: 40px">To:</span>
+					<div class="input-group bootstrap-timepicker timepicker" style="margin: 0 20px">
+						<span class="input-group-addon"><i class="glyphicon glyphicon-calendar"></i></span>
+						<input name="to" id="date-to" class="form-control" autocomplete="off" value="{{to}}">
+					</div>
+				</div>
+			</div>
+			<div class="row">
 				<div class="col-md-2">
 					<select name="type" id="select-table" class="form-control">
 						{{#tables}}
@@ -22,14 +38,8 @@
 						{{/tables}}
 					</select>
 				</div>
-				<div class="col-md-2">
-					<select name="cutoff" id="select-cutoff" class="form-control">
-						{{#days}}
-						<option value="{{days}}" {{selected}}>{{days}} {{lang_days}}</option>
-						{{/days}}
-					</select>
-				</div>
-				<div class="col-md-3" style="margin-top: 10px;">
+
+				<div class="col-md-5" style="margin-top: 10px;">
 					<div id="slider">
 						<div id="lower-handle" class="ui-slider-handle"></div>
 						<div id="upper-handle" class="ui-slider-handle"></div>
@@ -37,10 +47,8 @@
 						<input type="hidden" id="upper-field" name="upper" value="{{upper}}">
 					</div>
 				</div>
-				<div class="col-md-1">
-						<button type="submit" class="btn btn-primary">{{lang_show}}</button>
-				</div>
-				<div class="col-md-3">
+				<div class="col-md-5" style="display: flex; justify-content: flex-end">
+					<button type="submit" class="btn btn-primary" style="margin-right: 20px">{{lang_show}}</button>
 					<div class="input-group">
 						<select class="form-control" name="format">
 							<option value="json">JSON</option>
@@ -110,6 +118,10 @@
 <script type="application/javascript">
 
 	document.addEventListener("DOMContentLoaded", function () {
+		const now = new Date();
+		$('#date-from').datepicker({format : 'yyyy-mm-dd', endDate: now, todayHighlight: true, weekStart: 1});
+		$('#date-to').datepicker({format : 'yyyy-mm-dd', endDate: now, todayHighlight: true, weekStart: 1});
+
 		var lowerHandle = $("#lower-handle");
 		var upperHandle = $("#upper-handle");
 		var lower = $('#lower-field').val();