angular-xdan-datetimepicker/datetimepicker.js at master · tyaslab/angular-xdan-datetimepicker · GitHub

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
118
119
120
121
122
123
124
125
126
127
var datetimepicker = angular.module('xdan.datetimepicker', []);

datetimepicker.directive('xdanDatetimepicker', function() {
    return {
        require: '?ngModel',
        scope: {
            user_options: '=xdanDatetimepicker',
            picker_type_option: '@pickerType',
            view_format_option: '@viewFormat',
            model_format_option: '@modelFormat'
        },
        template: '<input type="text">',
        link: function(scope, element, attrs, ngModelController) {
            // The most famous date format in my country ;)
            var DEFAULT_VIEW_DATE_FORMAT = 'd-m-Y',
                DEFAULT_VIEW_TIME_FORMAT = 'H:i',
                DEFAULT_VIEW_FORMAT = DEFAULT_VIEW_DATE_FORMAT + ' ' + DEFAULT_VIEW_TIME_FORMAT,

                DEFAULT_MODEL_DATE_FORMAT = 'Y-m-d',
                DEFAULT_MODEL_TIME_FORMAT= 'H:i:s',
                DEFAULT_MODEL_FORMAT = DEFAULT_MODEL_DATE_FORMAT + ' ' + DEFAULT_MODEL_TIME_FORMAT;

            if (scope.picker_type_option) {
                scope.picker_type = scope.picker_type_option;
            } else {
                scope.picker_type = 'datetime';
            }

            if (scope.view_format_option) {
                scope.view_format = scope.view_format_option;
            } else {
                if (scope.picker_type == 'date') {
                    scope.view_format = DEFAULT_VIEW_DATE_FORMAT;
                } else if (scope.picker_type == 'time') {
                    scope.view_format = DEFAULT_VIEW_TIME_FORMAT;
                } else {
                    scope.view_format = DEFAULT_VIEW_FORMAT;
                }

            }

            if (scope.model_format_option && scope.picker_type == 'datetime') {
                scope.model_format = scope.model_format_option;
            } else {
                if (scope.picker_type == 'date') {
                    scope.model_format = DEFAULT_MODEL_DATE_FORMAT;
                } else if (scope.picker_type == 'time') {
                    scope.model_format = DEFAULT_MODEL_TIME_FORMAT;
                } else {
                    scope.model_format = DEFAULT_MODEL_FORMAT;
                }

            }

            // default options
            // I hate scrollMonth!!!
            scope.options = {
                scrollMonth: false,
                format: scope.view_format
            };

            if (scope.user_options) {
                angular.extend(scope.options, scope.user_options);
            }

            // last override!
            if (scope.picker_type == 'date') {
                scope.options.datepicker = true;
                scope.options.timepicker = false;
            } else if (scope.picker_type == 'time') {
                scope.options.datepicker = false;
                scope.options.timepicker = true;
            } else if (scope.picker_type == 'datetime') {
                scope.options.datepicker = true;
                scope.options.timepicker = true;
            }

            if (scope.user_options.onChangeDateTime) {
                scope.options.onChangeDateTime = function(current_time, input) {
                    scope.user_options.onChangeDateTime();
                    if (ngModelController) {
                        if (scope.picker_type == 'datetime') {
                            ngModelController.$setViewValue(current_time);
                        } else {
                            ngModelController.$setViewValue(current_time.dateFormat(scope.model_format));
                        }
                    }
                };
            } else {
                scope.options.onChangeDateTime = function(current_time, input) {
                    if (ngModelController) {
                        if (scope.picker_type != 'datetime') {
                            ngModelController.$setViewValue(current_time.dateFormat(scope.model_format));
                        } else {
                            ngModelController.$setViewValue(current_time);
                        }
                    }
                }
            }

            if (ngModelController) {
                ngModelController.$render = function() {
                    element.find('input[type=text]').datetimepicker(scope.options);
                };

                ngModelController.$formatters.push(function(modelValue) {
                    var date;
                    // todo: parse date/time/datetime
                    if (modelValue) {
                        if (scope.picker_type == 'date') {
                            date = new Date(modelValue + ' 00:00:00');
                        } else if (scope.picker_type == 'time') {
                            date = new Date('1970-01-01 ' + modelValue);
                        } else {
                            date = new Date(modelValue);
                        }

                        date = date.dateFormat(scope.options.format);
                        element.find('input[type=text]').val(date);
                    }

                    return modelValue
                });
            }
        }
    }
});