Bug 1313719 : History view for scheduled rules (#207). r=bhearsum

ui/app/js/controllers/rule_scheduled_changes_controller.js

@@ -4,6 +4,29 @@ function($scope, $routeParams, $location, $timeout, Rules, Search, $modal, $rout
   $scope.loading = true;
   $scope.failed = false;
 
+  $scope.sc_id = parseInt($routeParams.sc_id, 10);
+
+  function loadPage(newPage) {
+    Rules.getScheduledChangeHistory($scope.sc_id, $scope.pageSize, newPage)
+    .success(function(response) {
+      $scope.scheduled_changes = response.revisions;
+      $scope.scheduled_changes_rules_count = response.count;
+    })
+    .error(function() {
+      console.error(arguments);
+      $scope.failed = true;
+    })
+    .finally(function() {
+      $scope.loading = false;
+    });
+  }
+
+  if ($scope.sc_id) {
+    // history of a specific rule
+    $scope.$watch("currentPage", function(newPage) {
+      loadPage(newPage);
+    });
+  } else {
   Rules.getScheduledChanges()
   .success(function(response) {
     // "when" is a unix timestamp, but it's much easier to work with Date objects,
@@ -22,12 +45,22 @@ function($scope, $routeParams, $location, $timeout, Rules, Search, $modal, $rout
   .finally(function() {
     $scope.loading = false;
   });
+  }
 
   $scope.$watch("ordering_str", function(value) {
     $scope.ordering = value.value.split(",");
   });
 
-  $scope.ordering_options = [
+
+   if ($scope.sc_id) {
+    $scope.ordering_options = [
+      {
+        text: "Data Version",
+        value: "-data_version"
+      },
+    ];
+  } else {
+    $scope.ordering_options = [
     {
       text: "When",
       value: "when"
@@ -37,6 +70,7 @@ function($scope, $routeParams, $location, $timeout, Rules, Search, $modal, $rout
       value: "product,channel"
     },
   ];
+  }
 
   $scope.ordering_str = $scope.ordering_options[0];
 
@@ -56,6 +90,9 @@ function($scope, $routeParams, $location, $timeout, Rules, Search, $modal, $rout
   $scope.state_str = $scope.state_filter[0];
 
   $scope.filterBySelect = function(sc) {
+    if($scope.sc_id) {
+      return true;
+    }
     if ($scope.state_str.value === "complete" && sc.complete) {
       return true;
     }

ui/app/js/router.js

@@ -38,6 +38,12 @@ angular.module("app").config(function($routeProvider, $locationProvider) {
     reloadOnSearch: false
   })
 
+  .when("/scheduled_changes/rules/:sc_id", {
+    templateUrl: "rule_scheduled_changes.html",
+    controller: "RuleScheduledChangesController",
+    reloadOnSearch: false
+  })
+
   .when('/rules', {
     templateUrl: 'rules.html',
     controller: 'RulesController',

ui/app/js/services/rules_service.js

@@ -53,6 +53,9 @@ angular.module("app").factory('Rules', function($http) {
       data.csrf_token = csrf_token;
       return $http.post("/api/scheduled_changes/rules", data);
     },
+    getScheduledChangeHistory: function(sc_id, limit, page) {
+      return $http.get('/api/scheduled_changes/rules/' + sc_id + '/revisions?limit=' + limit + '&page=' + page);
+    },
     updateScheduledChange: function(sc_id, data, csrf_token) {
       data = jQuery.extend({}, data);
       if (data.when === null) {

ui/app/templates/rule_scheduled_changes.html

@@ -1,17 +1,23 @@
 <div loader ng-show="loading"></div>
 
 <h2>
-  <span>Scheduled Rule Changes</span>
+  <span ng-show="!scheduled_changes_rules_count">Scheduled Rule Changes</span>
+  <span ng-show="scheduled_changes_rules_count">History for Scheduled Rule Change</span>
 
   <span class="count">
     ({{ filtered_items.length | number:0 }}
     <span>found)</span>
   </span>
 
-  <button class="btn btn-primary btn-xs" ng-click="openNewScheduledRuleChangeModal()">
+  <button ng-show="!scheduled_changes_rules_count" class="btn btn-primary btn-xs" ng-click="openNewScheduledRuleChangeModal()">
     Add a new Scheduled Rule Change
     <i class="glyphicon glyphicon-plus"></i>
   </button>
+  <a href="/rules/scheduled_changes" class="btn btn-primary btn-xs"
+          ng-show="scheduled_changes_rules_count">
+    All Scheduled Changes
+    <i class="glyphicon glyphicon-arrow-left"></i>
+  </a>
 
 </h2>
 
@@ -27,7 +33,7 @@ <h2>
     </div>
   </div>
   <div class="col-sm-6 text-right">
-    <div class="row">
+    <div ng-show="!scheduled_changes_rules_count" class="row">
       <label>State:</label>
       <select ng-model="state_str" name="state_filter" ng-options="o.text for o in state_filter track by o.value">
       </select>
@@ -47,9 +53,10 @@ <h2>
 
     <h3 class="panel-title">
       <div style="float: right">
-        <button class="btn btn-default btn-xs" ng-click="openUpdateModal(sc)">Update</button>
-        <button class="btn btn-default btn-xs" ng-click="openDeleteModal(sc)">Delete</button>
-        <a class="btn btn-default btn-xs" ng-href="/scheduled_changes/rules/{{ sc.sc_id }}">History</a>
+        <i ng-if=" scheduled_changes_rules_count && $first && (currentPage == 1)">Current</i>
+        <button ng-show="!scheduled_changes_rules_count" class="btn btn-default btn-xs" ng-click="openUpdateModal(sc)">Update</button>
+        <button ng-show="!scheduled_changes_rules_count" class="btn btn-default btn-xs" ng-click="openDeleteModal(sc)">Delete</button>
+        <a ng-show="!scheduled_changes_rules_count" class="btn btn-default btn-xs" ng-href="/scheduled_changes/rules/{{ sc.sc_id }}">History</a>
       </div>
 
       <i title="Product" ng-show="!sc.product">no product</i>
@@ -140,7 +147,10 @@ <h5 title="Data Version">
     </dl>
 
   </div>
-
+<div class="panel-footer" ng-show="scheduled_changes_rules_count">
+    Changed by <code>{{ sc.changed_by }}</code>
+    <span moment="sc.timestamp"></span>
+  </div>
 </div>