Lea/web-apps
1
0
Fork 0
Code Issues Pull requests Packages Projects Releases Wiki Activity

[Calendar] Add key events support . Refactoring

Browse source
This commit is contained in:
Julia Radzhabova 2019-11-01 13:36:36 +03:00
parent e7a6314590
commit dd4f32a925
2 changed files with 89 additions and 41 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

47
apps/common/main/lib/component/Calendar.js
View file

@ -66,7 +66,6 @@ define([
Common.UI.BaseView.prototype.initialize.call(this, options);
var me = this;
me.cmpEl = me.$el || $(this.el);
this.monthNames = [this.textJanuary, this.textFebruary, this.textMarch, this.textApril, this.textMay, this.textJune, this.textJuly, this.textAugust, this.textSeptember, this.textOctober, this.textNovember, this.textDecember];
this.dayNamesShort = [this.textShortSunday, this.textShortMonday, this.textShortTuesday, this.textShortWednesday, this.textShortThursday, this.textShortFriday, this.textShortSaturday];
@ -77,15 +76,17 @@ define([
me.options.firstday = options.firstday;
}
me.enableKeyEvents= me.options.enableKeyEvents;
me._state = undefined; // 0 - month, 1 - months, 2 - years
me.render();
},
render: function () {
(this.$el || $(this.el)).html(this.template());
var me = this;
me.cmpEl = me.$el || $(this.el);
me.cmpEl.html(this.template());
me.currentDate = me.options.date || new Date();
@ -103,6 +104,10 @@ define([
me.btnNext.render(me.cmpEl.find('#next-arrow'));
me.btnNext.on('click', _.bind(me.onClickNext, me));
me.cmpEl.on('keydown', function(e) {
me.trigger('calendar:keydown', me, e);
});
me.renderMonth(me.currentDate);
this.trigger('render:after', this);
@ -211,6 +216,7 @@ define([
tmpYear++;
}
if (!me.yearPicker) {
me.yearPicker = new Common.UI.DataView({
el: me.cmpEl.find('.calendar-content'),
store: new Common.UI.DataViewStore(arrYears),
@ -222,6 +228,17 @@ define([
date.setFullYear(year);
me.renderMonths(date);
});
me.enableKeyEvents && this.yearPicker.on('item:keydown', function(view, record, e) {
if (e.keyCode==Common.UI.Keys.ESC) {
Common.NotificationCenter.trigger('dataview:blur');
}
});
} else
me.yearPicker.store.reset(arrYears);
me.enableKeyEvents && _.delay(function() {
me.monthPicker.cmpEl.find('.dataview').focus();
}, 10);
},
renderMonths: function (date) {
@ -273,6 +290,7 @@ define([
});
}
if (!me.monthsPicker) {
me.monthsPicker = new Common.UI.DataView({
el: me.cmpEl.find('.calendar-content'),
store: new Common.UI.DataViewStore(arrMonths),
@ -285,6 +303,17 @@ define([
date.setFullYear(year, month);
me.renderMonth(date);
});
me.enableKeyEvents && this.monthsPicker.on('item:keydown', function(view, record, e) {
if (e.keyCode==Common.UI.Keys.ESC) {
Common.NotificationCenter.trigger('dataview:blur');
}
});
} else
me.monthsPicker.store.reset(arrMonths);
me.enableKeyEvents && _.delay(function() {
me.monthPicker.cmpEl.find('.dataview').focus();
}, 10);
},
renderMonth: function (date) {
@ -381,6 +410,7 @@ define([
}
}
if (!me.monthPicker) {
me.monthPicker = new Common.UI.DataView({
el: me.cmpEl.find('.calendar-content'),
store: new Common.UI.DataViewStore(arrDays),
@ -396,6 +426,17 @@ define([
me.selectedDate.setFullYear(year, month, day);
me.trigger('date:click', me, me.selectedDate);
});
me.enableKeyEvents && this.monthPicker.on('item:keydown', function(view, record, e) {
if (e.keyCode==Common.UI.Keys.ESC) {
Common.NotificationCenter.trigger('dataview:blur');
}
});
} else
me.monthPicker.store.reset(arrDays);
me.enableKeyEvents && _.delay(function() {
me.monthPicker.cmpEl.find('.dataview').focus();
}, 10);
},
daysInMonth: function (date) {

7
apps/documenteditor/main/app/controller/Links.js
View file

@ -414,11 +414,18 @@ define([
if (!this.cmpCalendar) {
this.cmpCalendar = new Common.UI.Calendar({
el: documentHolderView.cmpEl.find('#id-document-calendar-control'),
enableKeyEvents: true,
firstday: 1
});
this.cmpCalendar.on('date:click', function (cmp, date) {
me.selectDate = new Date(date);
});
this.cmpCalendar.on('calendar:keydown', function (cmp, e) {
if (e.keyCode==Common.UI.Keys.ESC) {
controlsContainer.hide();
me.api.asc_UncheckContentControlButtons();
}
});
}
this.cmpCalendar.setDate(this.selectDate ? this.selectDate : new Date());