jquery.uam-time-input.js
2.99 KB
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
(function($) {
var delay = (function() {
var timer = 0;
return function(callback, ms){
clearTimeout (timer);
timer = setTimeout(callback, ms);
};
})();
var convertRawChunksToTime = function(chunks) {
var caps = [999, 24, 60, 60];
chunks = chunks.map(function(num) { return parseInt(num); });
for (var i = 4; i >= 0; i--) {
if (chunks[i] >= caps[i]) {
if (i - 1 >= 0) {
var times = Math.floor(chunks[i] / caps[i]);
chunks[i-1] += times;
chunks[i] = chunks[i] - (times * caps[i]);
} else {
chunks[i] = caps[i];
}
}
}
return chunks;
};
var formatChunks = function(chunks) {
return chunks[0].toString().padStart(3, 0) + '-'
+ chunks.slice(1, 4).map(function (element) {
return element.toString().padStart(2, 0);
}).join(':');
};
var convertChunksToSeconds = function(chunks) {
var multiples = [24, 60, 60, 1];
return chunks.reduce(function (sum, value, index) {
var multiplier = multiples.slice(index, multiples.length).reduce(function (product, value) {
return product * value;
});
return sum + value * multiplier;
}, 0);
};
$.uamTimeInput = function(targetInput) {
var $input = $(targetInput);
var $newInput = $input.clone().attr('name', '');
$input.hide().before($newInput);
var existingValue = $input.val();
if (existingValue !== '') {
$newInput.val(formatChunks(convertRawChunksToTime([0, 0, 0, existingValue * 1])));
}
$newInput.on('keyup', function (event) {
var $this = $(this);
var selection = window.getSelection().toString();
var rawInput = $this.val();
if (selection !== ''
|| rawInput === ''
|| $.inArray(event.keyCode, [38, 40, 37, 39]) !== -1
) {
return;
}
var domElement = $this.get(0);
var cursorStart = domElement.selectionStart;
var cursorEnd = domElement.selectionEnd;
var inputRegex = /(\d{3})(\d{2})(\d{2})(\d{2})/g;
var inputValue = rawInput.replace(/^\D+|:|-/g, '')
.substr(0, 9)
.padStart(9, 0);
var chunks = inputRegex.exec(inputValue);
chunks = convertRawChunksToTime([chunks[1], chunks[2], chunks[3], chunks[4]]);
$input.val(convertChunksToSeconds(chunks));
delay(function () {
$this.val(formatChunks(chunks));
domElement.setSelectionRange(cursorStart, cursorEnd);
}, 1000);
});
};
$.fn.uamTimeInput = function () {
this.each(function() {
$.uamTimeInput(this);
});
return this;
}
})(jQuery);