Skip to content

Commit

Permalink
Updates
Browse files Browse the repository at this point in the history 
- added built-in method: setI18n
  • Loading branch information
@dmuy
dmuy committed Nov 27, 2021
1 parent 04f1593 commit 4c394d0
Show file tree
Hide file tree
Showing 5 changed files with 198 additions and 79 deletions.
11 changes: 7 additions & 4 deletions demo/index.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -51,7 +51,7 @@ <h1>duDatepicker</h1>
</div>
<h2>Date picker</h2>
<table id="mycalendar"></table>
<input type="text" id="datepicker1" data-maxdate="today">
<input type="text" id="datepicker1" data-maxdate="today" value="11/15/2021-11/18/2021">
<input type="text" id="datepicker2">
<h3>Range</h3>
<input type="text" id="daterange">
Expand Down Expand Up @@ -86,6 +86,7 @@ <h3>Multi select</h3>
duDatepicker('#datepicker1', {
range: true, clearBtn: true,
format: 'mm/dd/yyyy',
// value: '11/15/2021-11/18/2021',
// i18n: {
// months: months,
// shortMonths: months.map(function(m) { return m.substr(0, 3) }),
Expand All @@ -94,7 +95,7 @@ <h3>Multi select</h3>
// shorterDays: days.map(function(d) { return d.substr(0, 2) }),
// firstDay: 1
// },
i18n: new duDatepicker.i18n.Locale(months, null, days, null, null, 1),
// i18n: new duDatepicker.i18n.Locale(months, null, days, null, null, 1),
// firstDay: 7,
// disabledDays: ['Sat', 'Sun'],
// disabledDates: ['11/10/2021', '11/20/2021'],
Expand Down Expand Up @@ -123,11 +124,12 @@ <h3>Multi select</h3>
// duDatepicker('#datepicker1', 'setTheme', 'blue')
// duDatepicker('#datepicker1', 'setDisabled', ['11/10/2021', '11/20/2021'])
duDatepicker('#datepicker1', 'set', {
setValue: '11/15/2021-11/18/2021',
// setValue: '11/15/2021-11/18/2021',
setTheme: 'blue',
setDisabled: ['11/10/2021', '11/20/2021'],
setDisabledDays: ['domenica'],
setMinYear: 1990
setMinYear: 1990,
setI18n: new duDatepicker.i18n.Locale(months, null, days, null, null, 1)
})

duDatepicker('#datepicker2, #datepicker3', {
Expand All @@ -144,6 +146,7 @@ <h3>Multi select</h3>
})

duDatepicker('#datepicker2', 'set', {
setI18n: 'ru',
setPriorYears: 10,
setLaterYears: 5,
setMinYear: 2000,
Expand Down
135 changes: 97 additions & 38 deletions dist/duDatepicker.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2918,7 +2918,7 @@
/**
* Parses date string using default or specified format
* @param {string} date Date string to parse
* @param {string=} dateFormat Format of the date string; `config.format` will be used if not specified
* @param {string=} format Format of the date string; `config.format` will be used if not specified
*/
parseDate: function parseDate(date, format) {
var _ = this,
Expand Down Expand Up @@ -3415,10 +3415,10 @@
var _date = new Date();

if (_.config.range) {
var value = _.input.value,
_range = value.split(_.config.rangeDelim);
var value = _.input.value || _.config.value || '',
_range = value ? value.split(_.config.rangeDelim) : [];

if (value !== '' && _range.length < 2) throw new Error('duDatePicker: Invalid date range value');
if (value !== '' && _range.length < 2) throw new Error('Invalid date range value.');

var _from = value === '' ? null : hf.parseDate.call(_, _range[0]).date,
_to = value === '' ? null : hf.parseDate.call(_, _range[1]).date;
Expand All @@ -3437,6 +3437,8 @@
formattedTo = hf.formatDate.call(_, _to, _.config.format),
outTo = hf.formatDate.call(_, _to, _.config.outFormat || _.config.format);
_.input.value = valueDisp;
_.rangeFrom = hf.dateToJson(_from);
_.rangeTo = hf.dateToJson(_to);
hf.setAttributes(_.input, {
'value': valueDisp,
'data-range-from': outFrom,
Expand Down Expand Up @@ -3571,8 +3573,7 @@
picker = _.datepicker,
header = picker.header,
calendarHolder = picker.calendarHolder,
buttons = calendarHolder.buttons,
_selected = _.selected ? _.selected : new Date(); // Setup header
buttons = calendarHolder.buttons; // Setup header


if (!_.config.inline) {
Expand All @@ -3598,36 +3599,7 @@
} // Setup months view


var _month = 0;

for (var r = 1; r < 4; r++) {
var monthRow = hf.createElem('div', {
class: 'dudp__month-row'
});

for (var i = 0; i < 4; i++) {
var monthElem = hf.createElem('span', {
class: 'dudp__month'
});
if (_month === _selected.month) monthElem.classList.add('selected');
monthElem.innerText = _.config.i18n.shortMonths[_month];
monthElem.dataset.month = _month;
hf.appendTo(monthElem, monthRow);
hf.addEvent(monthElem, 'click', function (e) {
var _this = this,
_data = _this.dataset.month;

_.viewMonth = _data;

_._setupCalendar();

_._switchView('calendar');
});
_month++;
}

hf.appendTo(monthRow, calendarHolder.monthsView);
} // Setup years view
_._setupMonths(); // Setup years view


hf.appendTo(_._getYears(), calendarHolder.yearsView);
Expand Down Expand Up @@ -4029,6 +4001,45 @@

return _years;
}
}, {
key: "_setupMonths",
value: function _setupMonths() {
var _ = this,
calendarHolder = _.datepicker.calendarHolder,
_month = 0,
_selected = _.selected ? _.selected : new Date();

hf.empty(calendarHolder.monthsView);

for (var r = 1; r < 4; r++) {
var monthRow = hf.createElem('div', {
class: 'dudp__month-row'
});

for (var i = 0; i < 4; i++) {
var monthElem = hf.createElem('span', {
class: 'dudp__month'
});
if (_month === _selected.month) monthElem.classList.add('selected');
monthElem.innerText = _.config.i18n.shortMonths[_month];
monthElem.dataset.month = _month;
hf.appendTo(monthElem, monthRow);
hf.addEvent(monthElem, 'click', function (e) {
var _this = this,
_data = _this.dataset.month;

_.viewMonth = _data;

_._setupCalendar();

_._switchView('calendar');
});
_month++;
}

hf.appendTo(monthRow, calendarHolder.monthsView);
}
}
/**
* Sets up the calendar views
*/
Expand Down Expand Up @@ -4327,11 +4338,13 @@
/**
* Sets the value of the input
* @param {(string|Date|string[])} value The new input value. If the value specified is a string, it will be parsed using `config.format`.
* @param {Boolean} triggerEvt Determines if change events should be triggered
*/

}, {
key: "setValue",
value: function setValue(value) {
var triggerEvt = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
if (typeof value === 'undefined') throw new Error('Expecting a value.');

var _ = this,
Expand Down Expand Up @@ -4430,8 +4443,10 @@
};
}

hf.triggerChange(_.input, changeData);
if (_.config.events && _.config.events.dateChanged) _.config.events.dateChanged.call(_, changeData, _);
if (triggerEvt) {
hf.triggerChange(_.input, changeData);
if (_.config.events && _.config.events.dateChanged) _.config.events.dateChanged.call(_, changeData, _);
}
}
/**
* Returns formatted string representation of specified date
Expand Down Expand Up @@ -4546,6 +4561,50 @@
value: function setDisabledDays(days) {
this.config.disabledDays = days;
}
/**
* Sets the internationalization configuration
* @param {(string|Object)} i18n Internationalization name or instance
*/

}, {
key: "setI18n",
value: function setI18n(i18n) {
var _ = this;

if (typeof i18n === 'string') _.config.i18n = duDatepicker.i18n[i18n];else if (_typeof(i18n) == 'object') _.config.i18n = i18n; // refresh UI

var i18nConfig = _.config.i18n,
picker = _.datepicker;

if (i18nConfig.dict) {
_.dict = hf.extend(_.dict, i18nConfig.dict);
picker.calendarHolder.buttons.btnClear.innerText = _.dict.btnClear;
picker.calendarHolder.buttons.btnOk.innerText = _.dict.btnOk;
picker.calendarHolder.buttons.btnCancel.innerText = _.dict.btnCancel;
} // reset selected value


var format = _.config.format;

if (_.config.range && _.rangeFrom && _.input.value) {
var rangeFrom = hf.jsonToDate(_.rangeFrom),
rangeTo = hf.jsonToDate(_.rangeTo);

_.setValue([hf.formatDate.call(_, rangeFrom, format), hf.formatDate.call(_, rangeTo, format)].join(_.config.rangeDelim), false);
} else if (_.config.multiple && _.selectedDates.length > 0 && _.input.value) {
_.setValue(_.selectedDates.map(function (sd) {
return hf.formatDate.call(_, sd, format);
}), false);
} else if (_.selected && _.input.value) {
var sd = _.selected;

_.setValue(new Date(sd.year, sd.month, sd.date), false);
}

_._setupMonths();

_._setupCalendar();
}
/**
* Shows the date picker
*/
Expand Down
2 changes: 1 addition & 1 deletion dist/duDatepicker.min.js
View file

Large diffs are not rendered by default.

Loading

0 comments on commit 4c394d0

Please sign in to comment.