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 toggleSelected option implementation

Browse Source
This commit is contained in:
t1m0n 2015-10-28 11:24:33 +03:00
parent 7ef2686c3d
commit 807923600e
6 changed files with 74 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
dist/css/datepicker.css vendored
View File

@ -81,7 +81,7 @@
color: #fff;
background: skyblue; }
.datepicker--cell-day.-another-month- {
.datepicker--cell-day.-other-month- {
color: #ddd; }
.datepicker--cell-month {

42
dist/js/datepicker.js vendored
View File

@ -16,13 +16,17 @@ var Datepicker;
weekends: [6, 0],
defaultView: 'days',
dateFormat: 'dd.mm.yyyy',
toggleSelected: true,
showOtherMonths: '',
selectOtherMonths: '',
//TODO сделать минимальные, максимальные даты
minDate: '',
maxData: '',
maxDate: '',
//TODO возможно добавить огрнаичивать число выделяемых дат
multipleDates: true,
multipleDates: false,
multipleDatesSeparator: ',',
// navigation
@ -100,6 +104,10 @@ var Datepicker;
},
_triggerOnChange: function (cellType) {
if (!this.selectedDates.length) {
return this.opts.onChange('', '', this);
}
var selectedDates = this.selectedDates,
parsedSelected = Datepicker.getParsedDate(selectedDates[0]),
formattedDates = this.formatDate(this.opts.dateFormat, selectedDates[0]),
@ -187,6 +195,19 @@ var Datepicker;
this.views[this.currentView]._render()
},
removeDate: function (date) {
var selected = this.selectedDates,
_this = this;
return selected.some(function (curDate, i) {
if (Datepicker.isSame(curDate, date)) {
selected.splice(i, 1);
_this.views[_this.currentView]._render();
return true
}
})
},
_isSelected: function (checkDate, cellType) {
return this.selectedDates.some(function (date) {
return Datepicker.isSame(date, checkDate, cellType)
@ -469,7 +490,7 @@ Datepicker.Cell = function () {
d = Datepicker.getParsedDate(date);
if (this.d.isWeekend(d.day)) _class += " -weekend-";
if (d.month != this.d.parsedDate.month) _class += " -another-month-";
if (d.month != this.d.parsedDate.month) _class += " -other-month-";
if (Datepicker.isSame(currentDate, date)) _class += ' -current-';
if (this.d._isSelected(date, 'day')) _class += ' -selected-';
@ -576,11 +597,20 @@ Datepicker.Cell = function () {
days: function (el) {
var date = el.data('date'),
month = el.data('month'),
d = this.d.parsedDate;
d = this.d.parsedDate,
selectedDate = new Date(d.year, month, date),
alreadySelected = this.d._isSelected(selectedDate, 'day'),
triggerOnChange = true;
this.d.selectDate(new Date(d.year, month, date));
if (!alreadySelected) {
this.d.selectDate(selectedDate);
} else if (alreadySelected && this.opts.toggleSelected){
this.d.removeDate(selectedDate);
} else if (alreadySelected && !this.opts.toggleSelected) {
triggerOnChange = false;
}
if (this.d.opts.onChange) {
if (triggerOnChange) {
this.d._triggerOnChange()
}
},

1
index.html
View File

@ -18,7 +18,6 @@
$('.calendar').datepicker({
onChange: function (dateString, date, inst) {
console.log(dateString);
console.log(date[0].getFullYear());
}
});
</script>

17
js/datepicker/body.js
View File

@ -90,7 +90,7 @@
d = Datepicker.getParsedDate(date);
if (this.d.isWeekend(d.day)) _class += " -weekend-";
if (d.month != this.d.parsedDate.month) _class += " -another-month-";
if (d.month != this.d.parsedDate.month) _class += " -other-month-";
if (Datepicker.isSame(currentDate, date)) _class += ' -current-';
if (this.d._isSelected(date, 'day')) _class += ' -selected-';
@ -197,11 +197,20 @@
days: function (el) {
var date = el.data('date'),
month = el.data('month'),
d = this.d.parsedDate;
d = this.d.parsedDate,
selectedDate = new Date(d.year, month, date),
alreadySelected = this.d._isSelected(selectedDate, 'day'),
triggerOnChange = true;
this.d.selectDate(new Date(d.year, month, date));
if (!alreadySelected) {
this.d.selectDate(selectedDate);
} else if (alreadySelected && this.opts.toggleSelected){
this.d.removeDate(selectedDate);
} else if (alreadySelected && !this.opts.toggleSelected) {
triggerOnChange = false;
}
if (this.d.opts.onChange) {
if (triggerOnChange) {
this.d._triggerOnChange()
}
},

26
js/datepicker/datepicker.js
View File

@ -16,13 +16,17 @@ var Datepicker;
weekends: [6, 0],
defaultView: 'days',
dateFormat: 'dd.mm.yyyy',
toggleSelected: true,
showOtherMonths: '',
selectOtherMonths: '',
//TODO сделать минимальные, максимальные даты
minDate: '',
maxData: '',
maxDate: '',
//TODO возможно добавить огрнаичивать число выделяемых дат
multipleDates: true,
multipleDates: false,
multipleDatesSeparator: ',',
// navigation
@ -30,7 +34,6 @@ var Datepicker;
nextHtml: '&raquo;',
// events
// TODO сделать с множественными датами
onChange: ''
};
@ -101,6 +104,10 @@ var Datepicker;
},
_triggerOnChange: function (cellType) {
if (!this.selectedDates.length) {
return this.opts.onChange('', '', this);
}
var selectedDates = this.selectedDates,
parsedSelected = Datepicker.getParsedDate(selectedDates[0]),
formattedDates = this.formatDate(this.opts.dateFormat, selectedDates[0]),
@ -188,6 +195,19 @@ var Datepicker;
this.views[this.currentView]._render()
},
removeDate: function (date) {
var selected = this.selectedDates,
_this = this;
return selected.some(function (curDate, i) {
if (Datepicker.isSame(curDate, date)) {
selected.splice(i, 1);
_this.views[_this.currentView]._render();
return true
}
})
},
_isSelected: function (checkDate, cellType) {
return this.selectedDates.some(function (date) {
return Datepicker.isSame(date, checkDate, cellType)

2
sass/datepicker/_cell.scss
View File

@ -43,7 +43,7 @@
// -------------------------------------------------
.datepicker--cell-day {
&.-another-month- {
&.-other-month- {
color: $colorAnotherMonth;
}
}