From d112a07246f14619c46275de0f66d3b9b3901cfd Mon Sep 17 00:00:00 2001
From: Galen Charlton <gmc@equinoxinitiative.org>
Date: Fri, 28 Apr 2017 18:00:12 -0400
Subject: [PATCH] webstaff: implement chronology tab

Signed-off-by: Galen Charlton <gmc@equinoxinitiative.org>
---
 .../staff/serials/t_prediction_wizard.tt2          | 61 ++++++++++++++++++++--
 .../staff/serials/directives/prediction_wizard.js  | 41 ++++++++++++---
 2 files changed, 92 insertions(+), 10 deletions(-)

diff --git a/Open-ILS/src/templates/staff/serials/t_prediction_wizard.tt2 b/Open-ILS/src/templates/staff/serials/t_prediction_wizard.tt2
index 9da3b69494..67ade59754 100644
--- a/Open-ILS/src/templates/staff/serials/t_prediction_wizard.tt2
+++ b/Open-ILS/src/templates/staff/serials/t_prediction_wizard.tt2
@@ -157,15 +157,70 @@
       </div>
     </uib-tab>
     <uib-tab index="1" disable="tab.active != 1" heading="[% l('Chronology Display') %]">
-      <div class="row">
+      <div>
         <div class="checkbox">
           <label>
             <input type="checkbox" ng-model="pattern.use_chron">
             [% l('Use Chronology Captions?') %]
           </label>
         </div>
-        <div class="row" ng-if="pattern.use_chron">
-CHRON
+        <div  ng-if="pattern.use_chron">
+          <div class="row">
+            <div class="col-md-4"></div>
+            <div class="col-md-4">[% l('Display level descriptor? E.g., "Year: 2017, Month: Feb" (not recommended)') %]</div>
+          </div>
+          <div class="row" ng-repeat="chron in pattern.chron_levels">
+            <div class="col-md-1"></div>
+            <div class="col-md-1">[% l('Level [_1]', '{{$index + 1}}')  %]</div>
+            <div class="col-md-2">
+              <select ng-model="chron.caption">
+                <option value="year">[% l('Year') %]</option>
+                <option value="season">[% l('Season') %]</option>
+                <option value="month">[% l('Month') %]</option>
+                <option value="week">[% l('Week') %]</option>
+                <option value="day">[% l('Day') %]</option>
+                <option value="hour">[% l('Hour') %]</option>
+              </select>
+            </div>
+            <div class="col-md-2">
+              <input type="checkbox" ng-model="chron.display_caption"></input>
+            </div>
+            <div class="col-md-4">
+              <button ng-if="$index > 0 && $last" ng-click="pattern.drop_chron_level()" class="btn btn-sm btn-warning">
+                [% l('Remove Level') %]
+              </button>
+              <button ng-if="$last && pattern.chron_levels.length < 4" ng-click="pattern.add_chron_level()" class="btn btn-sm btn-warning">
+                [% l('Add Level') %]
+              </button>
+            </div>
+          </div>
+          <div>
+            <div class="checkbox">
+              <label>
+                <input type="checkbox" ng-model="pattern.use_alt_chron">
+                [% l('Use Alternative Chronology Captions?') %]
+              </label>
+            </div>
+            <div ng-if="pattern.use_alt_chron">
+              <div class="row" ng-repeat="chron in pattern.alt_chron_levels">
+                <div class="col-md-1"></div>
+                <div class="col-md-1">[% l('Level [_1]', '{{$index + 1}}')  %]</div>
+                <div class="col-md-2">
+                  <select ng-model="chron.caption">
+                    <option value="year">[% l('Year') %]</option>
+                    <option value="season">[% l('Season') %]</option>
+                    <option value="month">[% l('Month') %]</option>
+                    <option value="week">[% l('Week') %]</option>
+                    <option value="day">[% l('Day') %]</option>
+                    <option value="hour">[% l('Hour') %]</option>
+                  </select>
+                </div>
+                <div class="col-md-2">
+                  <input type="checkbox" ng-model="chron.display_caption"></input>
+                </div>
+              </div>
+            </div>
+          </div>
         </div>
       </div>
       <div class="row">
diff --git a/Open-ILS/web/js/ui/default/staff/serials/directives/prediction_wizard.js b/Open-ILS/web/js/ui/default/staff/serials/directives/prediction_wizard.js
index 1a739c2fee..7e6a46cc8d 100644
--- a/Open-ILS/web/js/ui/default/staff/serials/directives/prediction_wizard.js
+++ b/Open-ILS/web/js/ui/default/staff/serials/directives/prediction_wizard.js
@@ -24,6 +24,7 @@ function($scope , $q , egSerialsCoreSvc , egCore , egGridDataProvider) {
         this.use_enum = false;
         this.use_alt_enum = false;
         this.use_chron = false;
+        this.use_alt_chron = false;
         this.use_calendar_changes = false;
         this.compress_expand = '3';
         this.caption_evaluation = '0';        
@@ -99,18 +100,30 @@ function($scope , $q , egSerialsCoreSvc , egCore , egGridDataProvider) {
                 if (sf in chron_level_map) {
                     this.use_chron = true;
                     curr_chron_level = chron_level_map[sf];
-                    this.chron_levels[curr_chron_level] = {
-                        caption : value
+                    var chron = {};
+                    if (value.match(/^\(.*\)$/)) {
+                        chron.display_caption = false;
+                        chron.caption = value.replace(/^\(/, '').replace(/\)$/, '');
+                    } else {
+                        chron.display_caption = true;
+                        chron.caption = value;
                     }
+                    this.chron_levels[curr_chron_level] = chron;
                     continue;
                 }
                 if (sf in alt_chron_level_map) {
-                    this.use_chron = true;
+                    this.use_alt_chron = true;
                     curr_chron_level = -1;
-                    curr_alt_chron_level = alt_enum_level_map[sf];
-                    this.alt_chron_levels[curr_alt_chron_level] = {
-                        caption : value
+                    curr_alt_chron_level = alt_chron_level_map[sf];
+                    var chron = {};
+                    if (value.match(/^\(.*\)$/)) {
+                        chron.display_caption = false;
+                        chron.caption = value.replace(/^\(/, '').replace(/\)$/, '');
+                    } else {
+                        chron.display_caption = true;
+                        chron.caption = value;
                     }
+                    this.alt_chron_levels[curr_alt_chron_level] = chron;
                     continue;
                 }
 
@@ -219,11 +232,25 @@ function($scope , $q , egSerialsCoreSvc , egCore , egGridDataProvider) {
                 day    : null
             });
         }
+
+        this.add_chron_level = function() {
+            if (self.chron_levels.length < 4) {
+                self.chron_levels.push({
+                    caption : null,
+                    display_caption : false
+                });
+            }
+        }
+        this.drop_chron_level = function() {
+            if (self.chron_levels.length > 1) {
+                self.chron_levels.pop();
+            }
+        }
     }
     // TODO chron only
 
     // dummy pattern
-    $scope.pattern = new PredictionPattern(["3","0","8","1","a","v.","b","no.","u","6","v","r","g","sequence","i","(year)","j","(month)","w","m","x","06,12"]);
+    $scope.pattern = new PredictionPattern(["3","0","8","1","a","v.","b","no.","u","6","v","r","g","sequence","i","(year)","j","month","m","(day)","w","m","x","06,12"]);
     console.debug($scope.pattern);
 }]
     }
-- 
2.11.0