added onlyTimepicker option, closes #102, #75, #108

This commit is contained in:
t1m0n 2016-08-28 13:16:14 +03:00
parent d3a578daab
commit e8facd22b0
11 changed files with 69 additions and 21 deletions

View File

@ -221,6 +221,8 @@
.datepicker--content {
box-sizing: content-box;
padding: 4px; }
.-only-timepicker- .datepicker--content {
display: none; }
.datepicker--pointer {
position: absolute;
@ -297,6 +299,8 @@
border-bottom: 1px solid #efefef;
min-height: 32px;
padding: 4px; }
.-only-timepicker- .datepicker--nav {
display: none; }
.datepicker--nav-title,
.datepicker--nav-action {
@ -409,6 +413,8 @@
-ms-flex: 0 1 138px;
flex: 0 1 138px;
max-width: 138px; }
.-only-timepicker- .datepicker--time {
border-top: none; }
.datepicker--time-sliders {
-webkit-flex: 0 1 153px;

File diff suppressed because one or more lines are too long

23
dist/js/datepicker.js vendored
View File

@ -65,7 +65,7 @@
// timepicker
timepicker: false,
onlyTimePicker: false,
onlyTimepicker: false,
dateTimeSeparator: ' ',
timeFormat: '',
minHours: 0,
@ -161,7 +161,7 @@
this._setPositionClasses(this.opts.position);
this._bindEvents()
}
if (this.opts.keyboardNav && !this.opts.onlyTimePicker) {
if (this.opts.keyboardNav && !this.opts.onlyTimepicker) {
this._bindKeyboardEvents();
}
this.$datepicker.on('mousedown', this._onMouseDownDatepicker.bind(this));
@ -177,7 +177,7 @@
this._bindTimepickerEvents();
}
if (this.opts.onlyTimePicker) {
if (this.opts.onlyTimepicker) {
this.$datepicker.addClass('-only-timepicker-');
}
@ -250,7 +250,7 @@
this.loc.dateFormat = [this.loc.dateFormat, this.loc.timeFormat].join(this.opts.dateTimeSeparator);
}
if (this.opts.onlyTimePicker) {
if (this.opts.onlyTimepicker) {
this.loc.dateFormat = this.loc.timeFormat;
}
@ -610,7 +610,7 @@
this._syncWithMinMaxDates();
this._defineLocale(this.opts.language);
this.nav._addButtonsIfNeed();
this.nav._render();
if (!this.opts.onlyTimepicker) this.nav._render();
this.views[this.currentView]._render();
if (this.elIsInput && !this.opts.inline) {
@ -624,6 +624,10 @@
this.$datepicker.addClass(this.opts.classes)
}
if (this.opts.onlyTimepicker) {
this.$datepicker.addClass('-only-timepicker-');
}
if (this.opts.timepicker) {
if (lastSelectedDate) this.timepicker._handleDate(lastSelectedDate);
this.timepicker._updateRanges();
@ -1479,8 +1483,9 @@
this.d = d;
this.type = type;
this.opts = opts;
this.$el = $('');
if (this.opts.onlyTimePicker) return;
if (this.opts.onlyTimepicker) return;
this.init();
};
@ -1702,7 +1707,7 @@
},
_render: function () {
if (this.opts.onlyTimePicker) return;
if (this.opts.onlyTimepicker) return;
this._renderTypes[this.type].bind(this)();
},
@ -1721,7 +1726,7 @@
},
show: function () {
if (this.opts.onlyTimePicker) return;
if (this.opts.onlyTimepicker) return;
this.$el.addClass('active');
this.acitve = true;
},
@ -1815,7 +1820,7 @@
},
_buildBaseHtml: function () {
if (!this.opts.onlyTimePicker) {
if (!this.opts.onlyTimepicker) {
this._render();
}
this._addButtonsIfNeed();

File diff suppressed because one or more lines are too long

View File

@ -21,8 +21,9 @@
this.d = d;
this.type = type;
this.opts = opts;
this.$el = $('');
if (this.opts.onlyTimePicker) return;
if (this.opts.onlyTimepicker) return;
this.init();
};
@ -244,7 +245,7 @@
},
_render: function () {
if (this.opts.onlyTimePicker) return;
if (this.opts.onlyTimepicker) return;
this._renderTypes[this.type].bind(this)();
},
@ -263,7 +264,7 @@
},
show: function () {
if (this.opts.onlyTimePicker) return;
if (this.opts.onlyTimepicker) return;
this.$el.addClass('active');
this.acitve = true;
},

View File

@ -65,7 +65,7 @@
// timepicker
timepicker: false,
onlyTimePicker: false,
onlyTimepicker: false,
dateTimeSeparator: ' ',
timeFormat: '',
minHours: 0,
@ -161,7 +161,7 @@
this._setPositionClasses(this.opts.position);
this._bindEvents()
}
if (this.opts.keyboardNav && !this.opts.onlyTimePicker) {
if (this.opts.keyboardNav && !this.opts.onlyTimepicker) {
this._bindKeyboardEvents();
}
this.$datepicker.on('mousedown', this._onMouseDownDatepicker.bind(this));
@ -177,7 +177,7 @@
this._bindTimepickerEvents();
}
if (this.opts.onlyTimePicker) {
if (this.opts.onlyTimepicker) {
this.$datepicker.addClass('-only-timepicker-');
}
@ -250,7 +250,7 @@
this.loc.dateFormat = [this.loc.dateFormat, this.loc.timeFormat].join(this.opts.dateTimeSeparator);
}
if (this.opts.onlyTimePicker) {
if (this.opts.onlyTimepicker) {
this.loc.dateFormat = this.loc.timeFormat;
}
@ -610,7 +610,7 @@
this._syncWithMinMaxDates();
this._defineLocale(this.opts.language);
this.nav._addButtonsIfNeed();
this.nav._render();
if (!this.opts.onlyTimepicker) this.nav._render();
this.views[this.currentView]._render();
if (this.elIsInput && !this.opts.inline) {
@ -624,6 +624,10 @@
this.$datepicker.addClass(this.opts.classes)
}
if (this.opts.onlyTimepicker) {
this.$datepicker.addClass('-only-timepicker-');
}
if (this.opts.timepicker) {
if (lastSelectedDate) this.timepicker._handleDate(lastSelectedDate);
this.timepicker._updateRanges();

View File

@ -30,7 +30,7 @@
},
_buildBaseHtml: function () {
if (!this.opts.onlyTimePicker) {
if (!this.opts.onlyTimepicker) {
this._render();
}
this._addButtonsIfNeed();

View File

@ -70,6 +70,10 @@
.datepicker--content {
box-sizing: content-box;
padding: $datepickerPadding;
.-only-timepicker- & {
display: none;
}
}
// Pointer

View File

@ -10,6 +10,10 @@
border-bottom: 1px solid map_get($datepickerBorderColor, nav);
min-height: $datepickerNavigationHeight;
padding: $datepickerPadding;
.-only-timepicker- & {
display: none;
}
}
.datepicker--nav-title,

View File

@ -71,6 +71,10 @@ $rangeThumbBg: #dedede;
max-width: 138px;
}
}
.-only-timepicker- & {
border-top: none;
}
}
.datepicker--time-sliders {

View File

@ -856,6 +856,26 @@ describe('Options', function () {
})
});
describe('onlyTimepicker', function () {
it('only timepicker should be visible', function () {
dp = $input.datepicker({
timepicker: true,
onlyTimepicker: true
}).data('datepicker');
var $time = $('.datepicker--time', dp.$datepicker),
$cells = $('.datepicker--cells', dp.$datepicker),
$nav = $('.datepicker--nav-title', dp.$datepicker),
_class = dp.$datepicker.hasClass('-only-timepicker-');
expect($time).to.have.length(1);
expect($cells).to.have.length(0);
expect($nav).to.have.length(0);
expect(_class).to.be.equal(true);
})
});
describe('dateTimeSeparator', function () {
it('should define separator between date string and time', function () {
var date = new Date(2016,2,9,11,24);