@narmafzam/jalali-datepicker
Version:
just a jalali-datepicker
205 lines (183 loc) • 8.37 kB
JavaScript
let Hamster = require('hamsterjs');
class Navigator {
constructor(model) {
this.model = model;
this.liveAttach();
this._attachEvents();
return this;
}
liveAttach() {
if (this.model.options.navigator.scroll.enabled) {
let that = this;
let gridPlot = $('#' + that.model.view.id + ' .datepicker-grid-view')[0];
Hamster(gridPlot).wheel(function (event, delta) {
if (delta > 0) {
that.model.state.navigate('next');
} else {
that.model.state.navigate('prev');
}
that.model.view.render();
event.preventDefault();
});
if (this.model.options.timePicker.enabled) {
$('#' + that.model.view.id + ' .time-segment').each(function(){
Hamster(this).wheel(function (event, delta) {
let $target = $(event.target);
let key = $target.data('time-key') ? $target.data('time-key') : $target.parents('[data-time-key]').data('time-key');
if (key) {
if (delta > 0) {
that.timeUp(key);
} else {
that.timeDown(key);
}
}
that.model.view.render();
event.preventDefault();
});
});
}
}
}
timeUp(timekey) {
if (this.model.options.timePicker[timekey] == undefined) {
return;
}
let step, t, that = this;
if (timekey == 'meridian') {
step = 12;
if (this.model.state.view.meridian == 'PM') {
t = this.model.JalaliDate.date(this.model.state.selected.unixDate).add('hour', step).valueOf();
} else {
t = this.model.JalaliDate.date(this.model.state.selected.unixDate).subtract('hour', step).valueOf();
}
this.model.state.meridianToggle();
} else {
step = this.model.options.timePicker[timekey].step;
t = this.model.JalaliDate.date(this.model.state.selected.unixDate).add(timekey, step).valueOf();
}
this.model.state.setViewDateTime('unix', t);
this.model.state.setSelectedDateTime('unix', t);
this.model.view.renderTimePartial();
clearTimeout(this.scrollDelayTimeDown);
this.scrollDelayTimeUp = setTimeout(function () {
that.model.view.markSelectedDay();
}, 300);
}
timeDown(timekey) {
if (this.model.options.timePicker[timekey] == undefined) {
return;
}
let step, t, that = this;
if (timekey == 'meridian') {
step = 12;
if (this.model.state.view.meridian == 'AM') {
t = this.model.JalaliDate.date(this.model.state.selected.unixDate).add('hour', step).valueOf();
} else {
t = this.model.JalaliDate.date(this.model.state.selected.unixDate).subtract('hour', step).valueOf();
}
this.model.state.meridianToggle();
} else {
step = this.model.options.timePicker[timekey].step;
t = this.model.JalaliDate.date(this.model.state.selected.unixDate).subtract(timekey, step).valueOf();
}
this.model.state.setViewDateTime('unix', t);
this.model.state.setSelectedDateTime('unix', t);
this.model.view.renderTimePartial();
clearTimeout(this.scrollDelayTimeDown);
this.scrollDelayTimeDown = setTimeout(function () {
that.model.view.markSelectedDay();
}, 300);
}
_attachEvents() {
let that = this;
if (this.model.options.navigator.enabled) {
$(document).on('click', '#' + that.model.view.id + ' .btn', function () {
if ($(this).is('.ui-datepicker-next')) {
that.model.state.navigate('next');
that.model.view.render();
that.model.options.navigator.onNext(that.model);
}
else if ($(this).is('.ui-datepicker-title')) {
that.model.state.switchViewMode();
that.model.view.render();
that.model.options.navigator.onSwitch(that.model);
}
else if ($(this).is('.ui-datepicker-prev')) {
that.model.state.navigate('prev');
that.model.view.render();
that.model.options.navigator.onPrev(that.model);
}
});
}
if (this.model.options.timePicker.enabled) {
$(document).on('click', '#' + that.model.view.id + ' .up-btn', function () {
let timekey = $(this).data('time-key');
that.timeUp(timekey);
that.model.options.onSelect(that.model.state.selected.unix);
});
$(document).on('click', '#' + that.model.view.id + ' .down-btn', function () {
let timekey = $(this).data('time-key');
that.timeDown(timekey);
that.model.options.onSelect(that.model.state.selected.unix);
});
}
if (this.model.options.dayPicker.enabled) {
$(document).on('click', '#' + that.model.view.id + ' .datepicker-day-view td:not(.disabled)', function () {
let thisUnix = $(this).data('unix'), mustRender;
that.model.state.setSelectedDateTime('unix', thisUnix);
if (that.model.state.selected.month !== that.model.state.view.month) {
mustRender = true;
} else {
mustRender = false;
}
that.model.state.setViewDateTime('unix', that.model.state.selected.unixDate);
if (that.model.options.autoClose) {
that.model.view.hide();
that.model.options.onHide(that);
}
if (mustRender) {
that.model.view.render();
} else {
that.model.view.markSelectedDay();
}
that.model.options.dayPicker.onSelect(thisUnix);
that.model.options.onSelect(thisUnix);
});
}
if (this.model.options.monthPicker.enabled) {
$(document).on('click', '#' + that.model.view.id + ' .datepicker-month-view .month-item:not(.month-item-disable)', function () {
let month = $(this).data('month');
that.model.state.switchViewModeTo('day');
if (!that.model.options.onlySelectOnDate) {
that.model.state.setSelectedDateTime('month', month);
if (that.model.options.autoClose) {
that.model.view.hide();
that.model.options.onHide(that);
}
}
that.model.state.setViewDateTime('month', month);
that.model.view.render();
that.model.options.monthPicker.onSelect(month);
that.model.options.onSelect(that.model.state.selected.unix);
});
}
if (this.model.options.yearPicker.enabled) {
$(document).on('click', '#' + that.model.view.id + ' .datepicker-year-view .year-item:not(.year-item-disable)', function () {
let year = $(this).data('year');
that.model.state.switchViewModeTo('month');
if (!that.model.options.onlySelectOnDate) {
that.model.state.setSelectedDateTime('year', year);
if (that.model.options.autoClose) {
that.model.view.hide();
that.model.options.onHide(that);
}
}
that.model.state.setViewDateTime('year', year);
that.model.view.render();
that.model.options.yearPicker.onSelect(year);
that.model.options.onSelect(that.model.state.selected.unix);
});
}
}
}
module.exports = Navigator;