webstaff: finish first pass at enumeration pane
authorGalen Charlton <gmc@equinoxinitiative.org>
Fri, 28 Apr 2017 21:01:58 +0000 (17:01 -0400)
committerGalen Charlton <gmc@equinoxinitiative.org>
Tue, 30 May 2017 16:06:39 +0000 (12:06 -0400)
Includes three new directives:

egMonthSelector
egSeasonSelector
egMonthDaySelector

Signed-off-by: Galen Charlton <gmc@equinoxinitiative.org>
Open-ILS/src/templates/staff/serials/t_month_day_selector.tt2 [new file with mode: 0644]
Open-ILS/src/templates/staff/serials/t_month_selector.tt2 [new file with mode: 0644]
Open-ILS/src/templates/staff/serials/t_prediction_wizard.tt2
Open-ILS/src/templates/staff/serials/t_season_selector.tt2 [new file with mode: 0644]
Open-ILS/web/js/ui/default/staff/serials/directives/prediction_wizard.js

diff --git a/Open-ILS/src/templates/staff/serials/t_month_day_selector.tt2 b/Open-ILS/src/templates/staff/serials/t_month_day_selector.tt2
new file mode 100644 (file)
index 0000000..5a1a38f
--- /dev/null
@@ -0,0 +1,17 @@
+<div class="input-group">
+  <input type="text"
+    class="form-control"
+    ng-show="!hideDatePicker"
+    uib-datepicker-popup="MMMM d"
+    is-open="datePickerIsOpen"
+    ng-model="dt"
+    datepicker-options="options"
+    show-button-bar="false"
+  />
+  <span class="input-group-btn">
+    <button type="button" class="btn btn-default"
+      ng-click="datePickerIsOpen=!datePickerIsOpen">
+      <i class="glyphicon glyphicon-calendar"></i>
+    </button>
+  </span>
+</div>
diff --git a/Open-ILS/src/templates/staff/serials/t_month_selector.tt2 b/Open-ILS/src/templates/staff/serials/t_month_selector.tt2
new file mode 100644 (file)
index 0000000..a9329f0
--- /dev/null
@@ -0,0 +1,14 @@
+<select ng-model="ngModel">
+  <option value="01">[% l('January') %]</option>
+  <option value="02">[% l('February') %]</option>
+  <option value="03">[% l('March') %]</option>
+  <option value="04">[% l('April') %]</option>
+  <option value="05">[% l('May') %]</option>
+  <option value="06">[% l('June') %]</option>
+  <option value="07">[% l('July') %]</option>
+  <option value="08">[% l('August') %]</option>
+  <option value="09">[% l('September') %]</option>
+  <option value="10">[% l('October') %]</option>
+  <option value="11">[% l('November') %]</option>
+  <option value="12">[% l('December') %]</option>
+</select>
index 34533db..9da3b69 100644 (file)
          </div>
       </div>
       <div class="row">
+        <div class="checkbox">
+          <label>
+            <input type="checkbox" ng-model="pattern.use_calendar_change">
+            [% l('First level enumeration changes during subscription year') %]
+          </label>
+         </div>
+         <div ng-if="pattern.use_calendar_change">
+         <div class="row" ng-repeat="chg in pattern.calendar_change">
+           <div class="col-md-1"></div>
+           <div class="col-md-2">
+             <label>[% l('Change occurs') %]
+               <select ng-model="chg.type">
+                 <option value="date">[% l('Specific date') %]</option>
+                 <option value="month">[% l('Start of month') %]</option>
+                 <option value="season">[% l('Start of season') %]</option>
+               </select>
+             </label>
+           </div>
+           <div class="col-md-3">
+             <eg-month-selector     ng-model="chg.month"  ng-if="chg.type == 'month'" ></eg-month-selector>
+             <eg-season-selector    ng-model="chg.season" ng-if="chg.type == 'season'"></eg-season-selector>
+             <eg-month-day-selector day="chg.day" month="chg.month" ng-if="chg.type == 'date'"  ></eg-month-day-selector>
+           </div>
+           <div class="col-md-2">
+              <button ng-click="pattern.remove_calendar_change($index)" class="btn btn-sm btn-warning">[% l('Delete') %]</button>
+              <button ng-click="pattern.add_calendar_change()" ng-hide="!$last" class="btn btn-sm btn-warning">[% l('Add more') %]</button>
+           </div>
+         </div>
+         </div>
+      </div>
+      <div class="row">
         <button class="btn btn-success pull-right" ng-click="tab.active = tab.active + 1">
             [% l('Next') %]
         </button>
diff --git a/Open-ILS/src/templates/staff/serials/t_season_selector.tt2 b/Open-ILS/src/templates/staff/serials/t_season_selector.tt2
new file mode 100644 (file)
index 0000000..f939503
--- /dev/null
@@ -0,0 +1,6 @@
+<select ng-model="ngModel">
+  <option value="21">[% l('Spring') %]</option>
+  <option value="22">[% l('Summer') %]</option>
+  <option value="23">[% l('Autumn') %]</option>
+  <option value="24">[% l('Winter') %]</option>
+</select>
index 63f3385..1a739c2 100644 (file)
@@ -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_calendar_changes = false;
         this.compress_expand = '3';
         this.caption_evaluation = '0';        
         this.enum_levels = [];
@@ -145,20 +146,25 @@ function($scope , $q , egSerialsCoreSvc , egCore , egGridDataProvider) {
                     }
                 }
                 if (sf == 'x') {
+                    this.use_calendar_change = true;
                     this.calendar_change = [];
                     value.split(',').forEach(function(chg) {
                         var calendar_change = {
+                            type   : null,
                             season : null,
                             month  : null,
                             day    : null
                         }
                         if (chg.length == 2) {
                             if (chg >= '21') {
+                                calendar_change.type = 'season';
                                 calendar_change.season = chg;
                             } else {
+                                calendar_change.type = 'month';
                                 calendar_change.month = chg;
                             }
                         } else if (chg.length == 4) {
+                            calendar_change.type = 'date';
                             calendar_change.month = chg.substring(0, 2);
                             calendar_change.day   = chg.substring(2, 4);
                         }
@@ -200,6 +206,19 @@ function($scope , $q , egSerialsCoreSvc , egCore , egGridDataProvider) {
                 self.alt_enum_levels.pop();
             }
         }
+        this.remove_calendar_change = function(idx) {
+            if (self.calendar_change.length > idx) {
+                self.calendar_change.splice(idx, 1);
+            }
+        }
+        this.add_calendar_change = function() {
+            self.calendar_change.push({
+                type   : null,
+                season : null,
+                month  : null,
+                day    : null
+            });
+        }
     }
     // TODO chron only
 
@@ -209,3 +228,74 @@ function($scope , $q , egSerialsCoreSvc , egCore , egGridDataProvider) {
 }]
     }
 })
+
+.directive('egMonthSelector', function() {
+    return {
+        transclude: true,
+        restrict:   'E',
+        scope: {
+            ngModel : '='
+        },
+        templateUrl: './serials/t_month_selector',
+        controller:
+       ['$scope','$q',
+function($scope , $q) {
+}]
+    }
+})
+
+.directive('egSeasonSelector', function() {
+    return {
+        transclude: true,
+        restrict:   'E',
+        scope: {
+            ngModel : '='
+        },
+        templateUrl: './serials/t_season_selector',
+        controller:
+       ['$scope','$q',
+function($scope , $q) {
+}]
+    }
+})
+
+.directive('egMonthDaySelector', function() {
+    return {
+        transclude: true,
+        restrict:   'E',
+        scope: {
+            month : '=',
+            day   : '='
+        },
+        templateUrl: './serials/t_month_day_selector',
+        controller:
+       ['$scope','$q',
+function($scope , $q) {
+    if ($scope.month == null) $scope.month = '01';
+    if ($scope.day   == null) $scope.day   = '01';
+    $scope.dt = new Date(2012, parseInt($scope.month) - 1, parseInt($scope.day), 1);
+    $scope.options = {
+        minMode : 'day',
+        maxMode : 'day',
+        datepickerMode : 'day',
+        showWeeks : false,
+        // use a leap year, though any publisher who uses 29 February as a
+        // calendar change is simply trolling
+        // also note that when https://github.com/angular-ui/bootstrap/issues/1993
+        // is fixed, setting minDate and maxDate would make sense, as
+        // user wouldn't be able to keeping hit the left or right arrows
+        // past the end of the range
+        // minDate : new Date('2012-01-01 00:00:01'),
+        // maxDate : new Date('2012-12-31 23:59:59'),
+        formatDayTitle : 'MMMM',
+    }
+    $scope.datePickerIsOpen = false;
+    $scope.$watch('dt', function(newVal, oldVal) {
+        if (newVal != oldVal) {
+            $scope.day   = ('00' + $scope.dt.getDate() ).slice(-2);
+            $scope.month = ('00' + ($scope.dt.getMonth() + 1)).slice(-2);
+        }
+    });
+}]
+    }
+})