forked from Textalk/angular-schema-form-datepicker
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathbootstrap-datepicker.js
117 lines (101 loc) · 4.29 KB
/
bootstrap-datepicker.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
angular.module("schemaForm").run(["$templateCache", function($templateCache) {$templateCache.put("directives/decorators/bootstrap/datepicker/datepicker.html","<div class=\"form-group\" ng-class=\"{\'has-error\': hasError()}\">\n <label class=\"control-label\" ng-show=\"showTitle()\">{{form.title}}</label>\n\n <input ng-show=\"form.key\"\n style=\"background-color: white\"\n type=\"text\"\n class=\"form-control\"\n schema-validate=\"form\"\n ng-model=\"$$value$$\"\n pick-a-date\n min-date=\"form.minDate\"\n max-date=\"form.maxDate\"\n format=\"form.format\" />\n\n <span class=\"help-block\">{{ (hasError() && errorMessage(schemaError())) || form.description}}</span>\n</div>\n");}]);
angular.module('schemaForm').directive('pickADate', function () {
//String dates for min and max is not supported
//https://github.com/amsul/pickadate.js/issues/439
//So strings we create dates from
var formatDate = function(value) {
//Strings or timestamps we make a date of
if (angular.isString(value) || angular.isNumber(value)) {
return new Date(value);
}
return value; //We hope it's a date object
};
return {
restrict: 'A',
require: 'ngModel',
scope: {
ngModel: '=',
minDate: '=',
maxDate: '=',
format: '='
},
link: function (scope, element, attrs, ngModel) {
//Bail out gracefully if pickadate is not loaded.
if (!element.pickadate) {
return;
}
//By setting formatSubmit to null we inhibit the
//hidden field that pickadate likes to create.
//We use ngModel formatters instead to format the value.
element.pickadate({
onClose: function () {
element.blur();
},
formatSubmit: null
});
//Defaultformat is for json schema date-time is ISO8601
//i.e. "yyyy-mm-dd"
var defaultFormat = 'yyyy-mm-dd';
//View format on the other hand we get from the pickadate translation file
var viewFormat = $.fn.pickadate.defaults.format;
var picker = element.pickadate('picker');
//The view value
ngModel.$formatters.push(function(value) {
if (angular.isUndefined(value) || value === null) {
return value;
}
//We set 'view' and 'highlight' instead of 'select'
//since the latter also changes the input, which we do not want.
picker.set('view', value, {format: scope.format || defaultFormat});
picker.set('highlight', value, {format: scope.format || defaultFormat});
//piggy back on highlight to and let pickadate do the transformation.
return picker.get('highlight', viewFormat);
});
ngModel.$parsers.push(function() {
return picker.get('select', scope.format || defaultFormat);
});
//bind once.
if (angular.isDefined(attrs.minDate)) {
var onceMin = scope.$watch('minDate', function (value) {
if (value) {
picker.set('min', formatDate(value));
onceMin();
}
}, true);
}
if (angular.isDefined(attrs.maxDate)) {
var onceMax = scope.$watch('maxDate', function (value) {
if (value) {
picker.set('max', formatDate(value));
onceMax();
}
}, true);
}
}
};
});
angular.module('schemaForm').config(
['schemaFormProvider', 'schemaFormDecoratorsProvider', 'sfPathProvider',
function(schemaFormProvider, schemaFormDecoratorsProvider, sfPathProvider) {
var datepicker = function(name, schema, options) {
if (schema.type === 'string' && (schema.format === 'date' || schema.format === 'date-time')) {
var f = schemaFormProvider.stdFormObj(name, schema, options);
f.key = options.path;
f.type = 'datepicker';
options.lookup[sfPathProvider.stringify(options.path)] = f;
return f;
}
};
schemaFormProvider.defaults.string.unshift(datepicker);
//Add to the bootstrap directive
schemaFormDecoratorsProvider.addMapping(
'bootstrapDecorator',
'datepicker',
'directives/decorators/bootstrap/datepicker/datepicker.html'
);
schemaFormDecoratorsProvider.createDirective(
'datepicker',
'directives/decorators/bootstrap/datepicker/datepicker.html'
);
}
]);