jingrow/air-datepicker
1
0
Fork 0
mirror of https://github.com/frappe/air-datepicker.git synced 2026-01-14 11:01:22 +08:00
Code Issues Packages Projects Releases Wiki Activity

add current time

Browse Source
This commit is contained in:
t1m0n 2016-01-26 15:43:34 +03:00
parent 36090db009
commit 97d0402721
6 changed files with 40 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
dist/css/datepicker.css vendored
View File

@ -392,12 +392,18 @@
Timepicker Timepicker
------------------------------------------------- */ ------------------------------------------------- */
.datepicker--time { .datepicker--time {
padding: 4px; } padding: 4px;
position: relative; }
.datepicker--time-label { .datepicker--time-label {
display: block; display: block;
font-size: 12px; } font-size: 12px; }
.datepicker--time-current {
font-size: 12px;
position: absolute;
right: 4px; }
.datepicker--time-row { .datepicker--time-row {
display: -webkit-flex; display: -webkit-flex;
display: -ms-flexbox; display: -ms-flexbox;

2
dist/css/datepicker.min.css vendored
View File

File diff suppressed because one or more lines are too long

13
dist/js/datepicker.js vendored
View File

@ -1717,7 +1717,8 @@ var Datepicker;
(function (window, $, datepicker) { (function (window, $, datepicker) {
var template = '<div class="datepicker--time">' + var template = '<div class="datepicker--time">' +
' <label class="datepicker--time-label">#{hourLabel}</label>' + '<div class="datepicker--time-current">#{hourValue}:#{minValue}</div>' +
'<label class="datepicker--time-label">#{hourLabel}</label>' +
'<div class="datepicker--time-row">' + '<div class="datepicker--time-row">' +
' <input type="range" name="hours" value="#{hourValue}" min="#{hourMin}" max="#{hourMax}" step="#{hourStep}"/>' + ' <input type="range" name="hours" value="#{hourValue}" min="#{hourMin}" max="#{hourMax}" step="#{hourStep}"/>' +
'</div>' + '</div>' +
@ -1767,9 +1768,18 @@ var Datepicker;
this.$timepicker = $(_template).appendTo(this.d.$datepicker); this.$timepicker = $(_template).appendTo(this.d.$datepicker);
this.$ranges = $('[type="range"]', this.$timepicker); this.$ranges = $('[type="range"]', this.$timepicker);
this.$currentTime = $('.datepicker--time-current', this.$timepicker);
}, },
_render: function () { _render: function () {
},
_updateTime: function () {
var h = this.hours < 10 ? '0'+this.hours : this.hours,
m = this.minutes < 10 ? '0' + this.minutes : this.minutes,
html = h + ':' + m;
this.$currentTime.html(html);
}, },
_onChangeRange: function (e) { _onChangeRange: function (e) {
@ -1778,6 +1788,7 @@ var Datepicker;
name = $target.attr('name'); name = $target.attr('name');
this[name] = value; this[name] = value;
this._updateTime();
this.d._trigger('timeChange', [this.hours, this.minutes]) this.d._trigger('timeChange', [this.hours, this.minutes])
} }
}; };

2
dist/js/datepicker.min.js vendored
View File

File diff suppressed because one or more lines are too long

13
src/js/timepicker.js
View File

@ -1,6 +1,7 @@
(function (window, $, datepicker) { (function (window, $, datepicker) {
var template = '<div class="datepicker--time">' + var template = '<div class="datepicker--time">' +
' <label class="datepicker--time-label">#{hourLabel}</label>' + '<div class="datepicker--time-current">#{hourValue}:#{minValue}</div>' +
'<label class="datepicker--time-label">#{hourLabel}</label>' +
'<div class="datepicker--time-row">' + '<div class="datepicker--time-row">' +
' <input type="range" name="hours" value="#{hourValue}" min="#{hourMin}" max="#{hourMax}" step="#{hourStep}"/>' + ' <input type="range" name="hours" value="#{hourValue}" min="#{hourMin}" max="#{hourMax}" step="#{hourStep}"/>' +
'</div>' + '</div>' +
@ -50,9 +51,18 @@
this.$timepicker = $(_template).appendTo(this.d.$datepicker); this.$timepicker = $(_template).appendTo(this.d.$datepicker);
this.$ranges = $('[type="range"]', this.$timepicker); this.$ranges = $('[type="range"]', this.$timepicker);
this.$currentTime = $('.datepicker--time-current', this.$timepicker);
}, },
_render: function () { _render: function () {
},
_updateTime: function () {
var h = this.hours < 10 ? '0'+this.hours : this.hours,
m = this.minutes < 10 ? '0' + this.minutes : this.minutes,
html = h + ':' + m;
this.$currentTime.html(html);
}, },
_onChangeRange: function (e) { _onChangeRange: function (e) {
@ -61,6 +71,7 @@
name = $target.attr('name'); name = $target.attr('name');
this[name] = value; this[name] = value;
this._updateTime();
this.d._trigger('timeChange', [this.hours, this.minutes]) this.d._trigger('timeChange', [this.hours, this.minutes])
} }
}; };

7
src/sass/timepicker.scss
View File

@ -6,6 +6,7 @@
.datepicker--time { .datepicker--time {
padding: $datepickerPadding; padding: $datepickerPadding;
position: relative;
} }
.datepicker--time-label { .datepicker--time-label {
@ -13,6 +14,12 @@
font-size: 12px; font-size: 12px;
} }
.datepicker--time-current {
font-size: 12px;
position: absolute;
right: $datepickerPadding;
}
.datepicker--time-row { .datepicker--time-row {
display: flex; display: flex;
align-items: center; align-items: center;