Merge pull request #324 from cydrobolt/feature/fill_in_zeroes_for_empty_days

Populate empty days in range with zeroes before graphing data

3 files changed, 55 insertions, 2 deletions

diff --git a/app/Http/Controllers/StatsController.php b/app/Http/Controllers/StatsController.php
index 1ddebd8..193d1d1 100644
--- a/app/Http/Controllers/StatsController.php
+++ b/app/Http/Controllers/StatsController.php
@@ -30,6 +30,12 @@ class StatsController extends Controller {
         $left_bound = $user_left_bound ?: Carbon::now()->subDays(self::DAYS_TO_FETCH);
         $right_bound = $user_right_bound ?: Carbon::now();
 
+        if (Carbon::parse($right_bound)->gt(Carbon::now()) && !session('error')) {
+            // Right bound must not be greater than current time
+            // i.e cannot be in the future
+            return redirect()->back()->with('error', 'Right date bound cannot be in the future.');
+        }
+
         if (!$this->isLoggedIn()) {
             return redirect(route('login'))->with('error', 'Please login to view link stats.');
         }
diff --git a/public/js/StatsCtrl.js b/public/js/StatsCtrl.js
index d1dfaf9..b662484 100644
--- a/public/js/StatsCtrl.js
+++ b/public/js/StatsCtrl.js
@@ -11,8 +11,47 @@ polr.controller('StatsCtrl', function($scope, $compile) {
     $scope.refererData = refererData;
     $scope.countryData = countryData;
 
+    $scope.populateEmptyDayData = function () {
+        // Populate empty days in $scope.dayData with zeroes
+
+        // Number of days in range
+        var numDays = moment(datePickerRightBound).diff(moment(datePickerLeftBound), 'days');
+        var i = moment(datePickerLeftBound);
+
+        var daysWithData = {};
+
+        // Generate hash map to keep track of dates with data
+        _.each($scope.dayData, function (point) {
+            var dayDate = point.x;
+            daysWithData[dayDate] = true;
+        });
+
+        // Push zeroes for days without data
+        _.each(_.range(0, numDays), function () {
+            var formattedDate = i.format('YYYY-MM-DD');
+
+            if (!(formattedDate in daysWithData)) {
+                // If day does not have data, fill in with 0
+                $scope.dayData.push({
+                    x: formattedDate,
+                    y: 0
+                })
+            }
+
+            i.add(1, 'day');
+        });
+
+        // Sort dayData from least to most recent
+        // to ensure Chart.js displays the data correctly
+        $scope.dayData = _.sortBy($scope.dayData, ['x'])
+    }
+
     $scope.initDayChart = function () {
         var ctx = $("#dayChart");
+
+        // Populate empty days in dayData
+        $scope.populateEmptyDayData();
+
         $scope.dayChart = new Chart(ctx, {
             type: 'line',
             data: {
@@ -105,8 +144,12 @@ polr.controller('StatsCtrl', function($scope, $compile) {
         var $leftPicker = $('#left-bound-picker');
         var $rightPicker = $('#right-bound-picker');
 
-        $leftPicker.datetimepicker();
-        $rightPicker.datetimepicker();
+        var datePickerOptions = {
+            showTodayButton: true
+        }
+
+        $leftPicker.datetimepicker(datePickerOptions);
+        $rightPicker.datetimepicker(datePickerOptions);
 
         $leftPicker.data("DateTimePicker").parseInputDate(parseInputDate);
         $rightPicker.data("DateTimePicker").parseInputDate(parseInputDate);
diff --git a/resources/views/link_stats.blade.php b/resources/views/link_stats.blade.php
index 121e0b6..9083b30 100644
--- a/resources/views/link_stats.blade.php
+++ b/resources/views/link_stats.blade.php
@@ -23,6 +23,10 @@
                     <b>Long Link: </b>
                     <a target="_blank" href="{{ $link->long_url }}">{{ str_limit($link->long_url, 50) }}</a>
                 </p>
+                {{-- <p>
+                    <em>Tip: Clear the right date bound (bottom box) to set it to the current date and time. New
+                    clicks will not show unless the right date bound is set to the current time.</em>
+                </p> --}}
             </div>
             <div class="col-md-3">
                 <form action="" method="GET">