|
1 | 1 | picker = angular.module('daterangepicker', [])
|
2 | 2 |
|
3 | 3 | picker.value('dateRangePickerConfig',
|
4 |
| - separator: ' - ' |
5 |
| - format: 'YYYY-MM-DD' |
| 4 | + separator: ' - ' |
| 5 | + format: 'YYYY-MM-DD' |
6 | 6 | )
|
7 | 7 |
|
8 | 8 | picker.directive('dateRangePicker', ($compile, $timeout, $parse, dateRangePickerConfig) ->
|
9 |
| - require: 'ngModel' |
10 |
| - restrict: 'A' |
11 |
| - scope: |
12 |
| - dateMin: '=min' |
13 |
| - dateMax: '=max' |
14 |
| - opts: '=options' |
15 |
| - link: ($scope, element, attrs, modelCtrl) -> |
16 |
| - el = $(element) |
17 |
| - customOpts = $parse(attrs.dateRangePicker)($scope, {}) |
18 |
| - opts = angular.extend({}, dateRangePickerConfig, customOpts) |
19 |
| - _picker = null |
20 |
| - |
21 |
| - _formatted = (viewVal) -> |
22 |
| - f = (date) -> |
23 |
| - if not moment.isMoment(date) |
24 |
| - return moment(date).format(opts.format) |
25 |
| - return date.format(opts.format) |
26 |
| - |
27 |
| - if opts.singleDatePicker |
28 |
| - f(viewVal.startDate) |
29 |
| - else |
30 |
| - [f(viewVal.startDate), f(viewVal.endDate)].join(opts.separator) |
31 |
| - |
32 |
| - _validateMin = (min, start) -> |
33 |
| - min = moment(min) |
34 |
| - start = moment(start) |
35 |
| - valid = min.isBefore(start) or min.isSame(start, 'day') |
36 |
| - modelCtrl.$setValidity('min', valid) |
37 |
| - return valid |
38 |
| - |
39 |
| - _validateMax = (max, end) -> |
40 |
| - max = moment(max) |
41 |
| - end = moment(end) |
42 |
| - valid = max.isAfter(end) or max.isSame(end, 'day') |
43 |
| - modelCtrl.$setValidity('max', valid) |
44 |
| - return valid |
45 |
| - |
46 |
| - modelCtrl.$formatters.push((val) -> |
47 |
| - if val and val.startDate and val.endDate |
48 |
| - # Update datepicker dates according to val before rendering. |
49 |
| - _picker.setStartDate(val.startDate) |
50 |
| - _picker.setEndDate(val.endDate) |
51 |
| - return val |
52 |
| - return '' |
53 |
| - ) |
54 |
| - |
55 |
| - modelCtrl.$parsers.push((val) -> |
56 |
| - # Check if input is valid. |
57 |
| - if not angular.isObject(val) or not (val.hasOwnProperty('startDate') and val.hasOwnProperty('endDate')) |
58 |
| - return modelCtrl.$modelValue |
59 |
| - |
60 |
| - # If min-max set, validate as well. |
61 |
| - if $scope.dateMin and val.startDate |
62 |
| - _validateMin($scope.dateMin, val.startDate) |
63 |
| - else |
64 |
| - modelCtrl.$setValidity('min', true) |
65 |
| - |
66 |
| - if $scope.dateMax and val.endDate |
67 |
| - _validateMax($scope.dateMax, val.endDate) |
68 |
| - else |
69 |
| - modelCtrl.$setValidity('max', true) |
70 |
| - |
71 |
| - return val |
72 |
| - ) |
73 |
| - |
74 |
| - modelCtrl.$isEmpty = (val) -> |
75 |
| - # modelCtrl is empty if val is invalid or any of the ranges are not set. |
76 |
| - not val or (val.startDate == null or val.endDate == null) |
77 |
| - |
78 |
| - modelCtrl.$render = -> |
79 |
| - if not modelCtrl.$modelValue |
80 |
| - return el.val('') |
81 |
| - |
82 |
| - if modelCtrl.$modelValue.startDate == null |
83 |
| - return el.val('') |
84 |
| - |
85 |
| - return el.val(_formatted(modelCtrl.$modelValue)) |
86 |
| - |
87 |
| - |
88 |
| - _init = -> |
89 |
| - el.daterangepicker(opts, (start, end, label) -> |
90 |
| - $timeout(-> |
91 |
| - $scope.$apply(-> |
92 |
| - modelCtrl.$setViewValue({ |
93 |
| - startDate: start.toDate() |
94 |
| - endDate: end.toDate() |
95 |
| - }) |
96 |
| - modelCtrl.$render() |
97 |
| - )) |
| 9 | + require: 'ngModel' |
| 10 | + restrict: 'A' |
| 11 | + scope: |
| 12 | + dateMin: '=min' |
| 13 | + dateMax: '=max' |
| 14 | + opts: '=options' |
| 15 | + link: ($scope, element, attrs, modelCtrl) -> |
| 16 | + el = $(element) |
| 17 | + customOpts = $parse(attrs.dateRangePicker)($scope, {}) |
| 18 | + opts = angular.extend({}, dateRangePickerConfig, customOpts) |
| 19 | + _picker = null |
| 20 | + |
| 21 | + _formatted = (viewVal) -> |
| 22 | + f = (date) -> |
| 23 | + if not moment.isMoment(date) |
| 24 | + return moment(date).format(opts.format) |
| 25 | + return date.format(opts.format) |
| 26 | + |
| 27 | + if opts.singleDatePicker |
| 28 | + f(viewVal.startDate) |
| 29 | + else |
| 30 | + [f(viewVal.startDate), f(viewVal.endDate)].join(opts.separator) |
| 31 | + |
| 32 | + _validateMin = (min, start) -> |
| 33 | + min = moment(min) |
| 34 | + start = moment(start) |
| 35 | + valid = min.isBefore(start) or min.isSame(start, 'day') |
| 36 | + modelCtrl.$setValidity('min', valid) |
| 37 | + return valid |
| 38 | + |
| 39 | + _validateMax = (max, end) -> |
| 40 | + max = moment(max) |
| 41 | + end = moment(end) |
| 42 | + valid = max.isAfter(end) or max.isSame(end, 'day') |
| 43 | + modelCtrl.$setValidity('max', valid) |
| 44 | + return valid |
| 45 | + |
| 46 | + modelCtrl.$formatters.push((val) -> |
| 47 | + if val and val.startDate and val.endDate |
| 48 | + # Update datepicker dates according to val before rendering. |
| 49 | + _picker.setStartDate(val.startDate) |
| 50 | + _picker.setEndDate(val.endDate) |
| 51 | + return val |
| 52 | + return '' |
| 53 | + ) |
| 54 | + |
| 55 | + modelCtrl.$parsers.push((val) -> |
| 56 | + # Check if input is valid. |
| 57 | + if not angular.isObject(val) or not (val.hasOwnProperty('startDate') and val.hasOwnProperty('endDate')) |
| 58 | + return modelCtrl.$modelValue |
| 59 | + |
| 60 | + # If min-max set, validate as well. |
| 61 | + if $scope.dateMin and val.startDate |
| 62 | + _validateMin($scope.dateMin, val.startDate) |
| 63 | + else |
| 64 | + modelCtrl.$setValidity('min', true) |
| 65 | + |
| 66 | + if $scope.dateMax and val.endDate |
| 67 | + _validateMax($scope.dateMax, val.endDate) |
| 68 | + else |
| 69 | + modelCtrl.$setValidity('max', true) |
| 70 | + |
| 71 | + return val |
| 72 | + ) |
| 73 | + |
| 74 | + modelCtrl.$isEmpty = (val) -> |
| 75 | + # modelCtrl is empty if val is invalid or any of the ranges are not set. |
| 76 | + not val or (val.startDate == null or val.endDate == null) |
| 77 | + |
| 78 | + modelCtrl.$render = -> |
| 79 | + if not modelCtrl.$modelValue |
| 80 | + return el.val('') |
| 81 | + |
| 82 | + if modelCtrl.$modelValue.startDate == null |
| 83 | + return el.val('') |
| 84 | + |
| 85 | + return el.val(_formatted(modelCtrl.$modelValue)) |
| 86 | + |
| 87 | + |
| 88 | + _init = -> |
| 89 | + el.daterangepicker(opts, (start, end, label) -> |
| 90 | + $timeout(-> |
| 91 | + $scope.$apply(-> |
| 92 | + modelCtrl.$setViewValue({ |
| 93 | + startDate: start.toDate() |
| 94 | + endDate: end.toDate() |
| 95 | + }) |
| 96 | + modelCtrl.$render() |
| 97 | + )) |
| 98 | + ) |
| 99 | + _picker = el.data('daterangepicker') |
| 100 | + el |
| 101 | + |
| 102 | + _init() |
| 103 | + |
| 104 | + # If input is cleared manually, set dates to null. |
| 105 | + el.change(() -> |
| 106 | + if $.trim(el.val()) == '' |
| 107 | + $timeout(-> |
| 108 | + $scope.$apply(-> |
| 109 | + modelCtrl.$setViewValue( |
| 110 | + startDate: null |
| 111 | + endDate: null |
98 | 112 | )
|
99 |
| - _picker = el.data('daterangepicker') |
100 |
| - el |
101 |
| - |
| 113 | + )) |
| 114 | + ) |
| 115 | + |
| 116 | + if attrs.min |
| 117 | + $scope.$watch('dateMin', (date) -> |
| 118 | + if date |
| 119 | + if not modelCtrl.$isEmpty(modelCtrl.$modelValue) |
| 120 | + _validateMin(date, modelCtrl.$modelValue.startDate) |
| 121 | + |
| 122 | + opts['minDate'] = moment(date) |
| 123 | + else |
| 124 | + opts['minDate'] = false |
102 | 125 | _init()
|
| 126 | + ) |
103 | 127 |
|
104 |
| - # If input is cleared manually, set dates to null. |
105 |
| - el.change(() -> |
106 |
| - if $.trim(el.val()) == '' |
107 |
| - $timeout(-> |
108 |
| - $scope.$apply(-> |
109 |
| - modelCtrl.$setViewValue( |
110 |
| - startDate: null |
111 |
| - endDate: null |
112 |
| - ) |
113 |
| - )) |
114 |
| - ) |
115 |
| - |
116 |
| - if attrs.min |
117 |
| - $scope.$watch('dateMin', (date) -> |
118 |
| - if date |
119 |
| - if not modelCtrl.$isEmpty(modelCtrl.$modelValue) |
120 |
| - _validateMin(date, modelCtrl.$modelValue.startDate) |
121 |
| - |
122 |
| - opts['minDate'] = moment(date) |
123 |
| - else |
124 |
| - opts['minDate'] = false |
125 |
| - _init() |
126 |
| - ) |
127 |
| - |
128 |
| - if attrs.max |
129 |
| - $scope.$watch('dateMax', (date) -> |
130 |
| - if date |
131 |
| - if not modelCtrl.$isEmpty(modelCtrl.$modelValue) |
132 |
| - _validateMax(date, modelCtrl.$modelValue.endDate) |
| 128 | + if attrs.max |
| 129 | + $scope.$watch('dateMax', (date) -> |
| 130 | + if date |
| 131 | + if not modelCtrl.$isEmpty(modelCtrl.$modelValue) |
| 132 | + _validateMax(date, modelCtrl.$modelValue.endDate) |
133 | 133 |
|
134 |
| - opts['maxDate'] = moment(date) |
135 |
| - else |
136 |
| - opts['maxDate'] = false |
| 134 | + opts['maxDate'] = moment(date) |
| 135 | + else |
| 136 | + opts['maxDate'] = false |
137 | 137 |
|
138 |
| - _init() |
139 |
| - ) |
| 138 | + _init() |
| 139 | + ) |
140 | 140 |
|
141 |
| - if attrs.options |
142 |
| - $scope.$watch('opts', (newOpts) -> |
143 |
| - opts = angular.extend(opts, newOpts) |
144 |
| - _init() |
145 |
| - ) |
| 141 | + if attrs.options |
| 142 | + $scope.$watch('opts', (newOpts) -> |
| 143 | + opts = angular.extend(opts, newOpts) |
| 144 | + _init() |
| 145 | + ) |
146 | 146 |
|
147 |
| - $scope.$on '$destroy', -> |
148 |
| - _picker.remove() |
| 147 | + $scope.$on '$destroy', -> |
| 148 | + _picker.remove() |
149 | 149 | )
|
0 commit comments