@syncfusion/ej2-schedule 30.2.7 → 31.1.20

package/dist/es6/ej2-schedule.es2015.js

@@ -1033,6 +1033,8 @@ const MONTH_HEADER_WRAPPER = 'e-month-header-wrapper';
 const INLINE_SUBJECT_CLASS = 'e-inline-subject';
 /** @private */
 const INLINE_APPOINTMENT_CLASS = 'e-inline-appointment';
+/** @private */
+const INLINE_EDIT_CLASS = 'e-inline-edit';
 /** @hidden */
 const SCROLL_HIDDEN = 'e-scroll-hidden';
 /** @private */
@@ -3228,7 +3230,7 @@ class KeyboardInteraction {
     }
     processDelete(e) {
         let activeEle = document.activeElement;
-        if (this.parent.currentView === 'MonthAgenda') {
+        if (this.parent.currentView === 'MonthAgenda' || (!isNullOrUndefined(activeEle) && closest(activeEle, '.' + POPUP_WRAPPER_CLASS))) {
             const selectedEle = this.parent.eventBase.getSelectedEvents().element;
             activeEle = ((selectedEle && isNullOrUndefined(selectedEle.length)) ? selectedEle : selectedEle[0]);
         }
@@ -6702,7 +6704,7 @@ class EventBase {
         }
         const args = extend(this.parent.activeEventData, { cancel: false, originalEvent: eventData });
         this.parent.trigger(eventDoubleClick, args, (eventDoubleClickArgs) => {
-            if (!eventDoubleClickArgs.cancel) {
+            if (!eventDoubleClickArgs.cancel && this.parent.eventSettings.allowEditing) {
                 if (!isNullOrUndefined(this.parent.activeEventData.event) &&
                     isNullOrUndefined(this.parent.activeEventData.event[this.parent.eventFields.recurrenceID])) {
                     this.parent.eventWindow.openEditor(this.parent.activeEventData.event, 'Save');
@@ -7703,6 +7705,9 @@ class VerticalEvent extends EventBase {
         const record = this.splitEvent(eventObj, currentDates)[0];
         const eStart = new Date(record[this.parent.eventFields.startTime].getTime());
         const eEnd = new Date(record[this.parent.eventFields.endTime].getTime());
+        if (eStart.getTime() < this.parent.minDate.getTime() || eEnd.getTime() > this.parent.maxDate.getTime()) {
+            return;
+        }
         let appWidth = 0;
         let topValue = 1;
         const isDateRange = currentDates[0].getTime() <= eStart.getTime() &&
@@ -8215,13 +8220,15 @@ class MonthEvent extends EventBase {
             this.parent.notify(scrollUiUpdate, data);
             if (this.parent.currentView === 'Month' && this.parent.showWeekNumber) {
                 const totalCells = [].slice.call(this.parent.element.querySelectorAll('.e-content-wrap table tr td:first-child'));
-                const weekNumberCells = [].slice.call(this.parent.element.querySelectorAll('.' + WEEK_NUMBER_CLASS));
+                const weekNumberCells = [].slice.call(this.parent.element.querySelectorAll('td' + '.' + WEEK_NUMBER_CLASS));
                 weekNumberCells.forEach((cell, i) => {
                     const height = totalCells[parseInt(i.toString(), 10)].offsetHeight;
                     setStyleAttribute(cell, { 'height': height + 'px' });
                 });
-                this.parent.element.querySelector('.' + WEEK_NUMBER_WRAPPER_CLASS).scrollTop =
-                    this.parent.element.querySelector('.' + CONTENT_WRAP_CLASS).scrollTop;
+                const weekNumberWrapper = this.parent.element.querySelector('.' + WEEK_NUMBER_WRAPPER_CLASS);
+                if (!isNullOrUndefined(weekNumberWrapper)) {
+                    weekNumberWrapper.scrollTop = this.parent.element.querySelector('.' + CONTENT_WRAP_CLASS).scrollTop;
+                }
             }
         }
         this.parent.renderTemplates();
@@ -9452,6 +9459,7 @@ class InlineEdit {
     eventEdit(args) {
         let inlineSubject = args.element.querySelector('.' + INLINE_SUBJECT_CLASS);
         let subject;
+        addClass([args.element], INLINE_EDIT_CLASS);
         if (inlineSubject) {
             subject = inlineSubject.value;
         }
@@ -9459,11 +9467,9 @@ class InlineEdit {
             const subEle = args.element.querySelector('.' + SUBJECT_CLASS);
             if (!isNullOrUndefined(subEle)) {
                 addClass([subEle], DISABLE_CLASS);
-                subject = subEle.innerText;
-            }
-            else {
-                subject = args.data[this.parent.eventFields.subject];
             }
+            subject = !isNullOrUndefined(args.data) && args.data[this.parent.eventFields.subject] ||
+                this.parent.eventSettings.fields.subject.default || this.parent.localeObj.getConstant('addTitle');
             inlineSubject = this.inlineInputEle =
                 createElement('input', { className: INLINE_SUBJECT_CLASS, attrs: { value: subject } });
             if (closest(args.element, '.' + MORE_POPUP_WRAPPER_CLASS)) {
@@ -9485,7 +9491,12 @@ class InlineEdit {
                     args.element.querySelector('.e-appointment-details').prepend(inlineSubject);
                 }
                 else {
-                    innerWrapElement.prepend(inlineSubject);
+                    if (subEle && this.parent.activeViewOptions && !this.parent.activeViewOptions.eventTemplate) {
+                        innerWrapElement.insertBefore(inlineSubject, subEle);
+                    }
+                    else {
+                        innerWrapElement.prepend(inlineSubject);
+                    }
                 }
             }
             inlineSubject.focus();
@@ -9610,7 +9621,7 @@ class InlineEdit {
     }
     createInlineAppointmentElement(inlineData) {
         const inlineAppointmentElement = createElement('div', {
-            className: APPOINTMENT_CLASS + ' ' + INLINE_APPOINTMENT_CLASS
+            className: APPOINTMENT_CLASS + ' ' + INLINE_APPOINTMENT_CLASS + ' ' + INLINE_EDIT_CLASS
         });
         const inlineDetails = createElement('div', { className: APPOINTMENT_DETAILS });
         inlineAppointmentElement.appendChild(inlineDetails);
@@ -9636,6 +9647,7 @@ class InlineEdit {
         const inlineSubject = this.getInlineElement();
         if (inlineSubject) {
             const appointmentSubject = closest(inlineSubject, '.' + APPOINTMENT_CLASS);
+            removeClass([appointmentSubject], INLINE_EDIT_CLASS);
             const subject = appointmentSubject.querySelector('.' + SUBJECT_CLASS);
             if (!isNullOrUndefined(subject)) {
                 removeClass([subject], DISABLE_CLASS);
@@ -11058,7 +11070,11 @@ class QuickPopups {
         if (closest(target, '.' + APPOINTMENT_CLASS + ',.' + HEADER_CELLS_CLASS)) {
             this.parent.removeNewEventElement();
         }
-        if (!closest(target, '.' + MORE_POPUP_WRAPPER_CLASS) && (target.classList &&
+        const isQuickPopupClick = closest(target, '.' + POPUP_WRAPPER_CLASS) ||
+            closest(target, '.' + QUICK_DIALOG_CLASS);
+        const isEditButton = target.classList.contains(EDIT_EVENT_CLASS) ||
+            target.classList.contains(EDIT_CLASS) || target.classList.contains(EDIT_ICON_CLASS);
+        if (isEditButton || !isQuickPopupClick && !closest(target, '.' + MORE_POPUP_WRAPPER_CLASS) && (target.classList &&
             !target.classList.contains(MORE_INDICATOR_CLASS))
             && (!closest(target, '.' + MORE_POPUP_WRAPPER_CLASS + '.' + POPUP_OPEN))
             && !closest(target, '.' + WORK_CELLS_CLASS)) {
@@ -11204,6 +11220,10 @@ class EventTooltip {
             return;
         }
         if (args.target.classList.contains(RESOURCE_CELLS_CLASS) && this.parent.activeViewOptions.group.resources.length > 0) {
+            if (args.target.closest('.' + LEFT_INDENT_WRAP_CLASS)) {
+                args.cancel = true;
+                return;
+            }
             let resCollection;
             if (this.parent.activeView.isTimelineView()) {
                 const index = parseInt(args.target.getAttribute('data-group-index'), 10);
@@ -13697,9 +13717,9 @@ class EventWindow {
             const startObj = startDate.ej2_instances[0];
             const endObj = endDate.ej2_instances[0];
             startObj.min = this.parent.minDate;
-            startObj.max = this.parent.maxDate;
+            startObj.max = new Date(new Date(+this.parent.maxDate).setHours(23, 59, 59));
             endObj.min = this.parent.minDate;
-            endObj.max = this.parent.maxDate;
+            endObj.max = new Date(new Date(+this.parent.maxDate).setHours(23, 59, 59));
             startObj.dataBind();
             endObj.dataBind();
         }
@@ -19173,6 +19193,14 @@ let Schedule = class Schedule extends Component {
                 if (newProp.allowKeyboardInteraction || newProp.allowClipboard) {
                     this.keyboardInteractionModule = new KeyboardInteraction(this);
                 }
+                if (prop === 'allowClipboard') {
+                    if (newProp.allowClipboard) {
+                        EventHandler.add(document, 'paste', this.onDocumentPaste, this);
+                    }
+                    else {
+                        EventHandler.remove(document, 'paste', this.onDocumentPaste);
+                    }
+                }
                 break;
             case 'timezoneDataSource':
                 if (this.eventWindow) {
@@ -20114,12 +20142,18 @@ let Schedule = class Schedule extends Component {
      * @returns {void}
      */
     paste(targetElement) {
-        if (!this.allowClipboard || !this.allowKeyboardInteraction) {
+        if (!this.allowClipboard || !this.allowKeyboardInteraction || !targetElement) {
             return;
         }
         if (!targetElement.classList.contains('e-work-cells') && !targetElement.classList.contains('e-all-day-cells')) {
             return;
         }
+        if (!this.activeCellsData) {
+            const cellData = this.getCellDetails([targetElement]);
+            if (cellData) {
+                this.activeCellsData = cellData;
+            }
+        }
         const clipboardData = new DataTransfer();
         if (!isNullOrUndefined(navigator.clipboard)) {
             navigator.clipboard.readText()
@@ -21100,6 +21134,9 @@ class ActionBase {
         if (this.parent.activeViewOptions.group.resources.length > 0) {
             query = query.concat('[data-group-index = "' + cloneElement.getAttribute('data-group-index') + '"]');
         }
+        if (cloneElement.hasAttribute('data-guid')) {
+            query += '[data-guid="' + cloneElement.getAttribute('data-guid') + '"]';
+        }
         const elements = [].slice.call(this.parent.element.querySelectorAll(query));
         addClass(elements, EVENT_ACTION_CLASS);
         const eventWrappers = [].slice.call(this.parent.element.querySelectorAll('.' + CLONE_ELEMENT_CLASS));
@@ -21268,17 +21305,20 @@ class Resize extends ActionBase {
         }
     }
     resizeStart(e) {
-        if (e && e.type === 'touchstart' && (!this.parent.uiStateValues.isTapHold ||
-            !closest(e.target, '.' + APPOINTMENT_BORDER))) {
+        if ((e && e.type === 'touchstart' && (!this.parent.uiStateValues.isTapHold ||
+            !closest(e.target, '.' + APPOINTMENT_BORDER))) || closest(e.target, '.' + INLINE_EDIT_CLASS)) {
+            return;
+        }
+        const resizeTarget = closest(e.target, '.' + EVENT_RESIZE_CLASS);
+        this.actionObj.element = closest(resizeTarget, '.' + APPOINTMENT_CLASS);
+        this.actionObj.event = this.parent.eventBase.getEventByGuid(this.actionObj.element.getAttribute('data-guid'));
+        if (isNullOrUndefined(this.actionObj.event)) {
             return;
         }
         this.parent.eventBase.removeSelectedAppointmentClass();
         this.actionObj.action = 'resize';
         this.actionObj.slotInterval = this.parent.activeViewOptions.timeScale.interval / this.parent.activeViewOptions.timeScale.slotCount;
         this.actionObj.interval = this.actionObj.slotInterval;
-        const resizeTarget = closest(e.target, '.' + EVENT_RESIZE_CLASS);
-        this.actionObj.element = closest(resizeTarget, '.' + APPOINTMENT_CLASS);
-        this.actionObj.event = this.parent.eventBase.getEventByGuid(this.actionObj.element.getAttribute('data-guid'));
         const eventObj = extend({}, this.actionObj.event, null, true);
         const resizeArgs = {
             cancel: false,
@@ -21977,9 +22017,10 @@ class YearEvent extends TimelineEvent {
                             continue;
                         }
                     }
-                    const enableAppRender = this.maxOrIndicator || (overlapIndex < eventsPerRow) ||
-                        (this.cellHeight > availedHeight);
-                    if (this.parent.rowAutoHeight || enableAppRender || this.cellHeight > availedHeight) {
+                    if (this.maxHeight && this.parent.currentView.indexOf('Timeline') !== -1 && overlapIndex > 0) {
+                        continue;
+                    }
+                    if (this.parent.rowAutoHeight || this.shouldRenderAppointment(overlapIndex, availedHeight)) {
                         this.renderEvent(eventWrapper, eventData, row, leftValue, rightValue, monthStart, dayIndex);
                         if (this.parent.rowAutoHeight || this.cellHeight > availedHeight) {
                             this.updateCellHeight(rowTd, availedHeight);
@@ -22109,6 +22150,19 @@ class YearEvent extends TimelineEvent {
             });
         }
     }
+    shouldRenderAppointment(overlapIndex, availedHeight) {
+        const eventsPerRow = this.parent.rowAutoHeight ? 1 : this.parent.activeViewOptions.maxEventsPerRow;
+        if (this.parent.activeViewOptions.maxEventsPerRow && !this.parent.rowAutoHeight &&
+            !this.parent.eventSettings.enableIndicator) {
+            return overlapIndex < eventsPerRow;
+        }
+        else if (this.maxOrIndicator) {
+            return overlapIndex < 1;
+        }
+        else {
+            return this.cellHeight > availedHeight;
+        }
+    }
     renderResourceEvent(wrapper, resource, month, index, monthStart) {
         const eventWrapper = createElement('div', { className: APPOINTMENT_WRAPPER_CLASS });
         wrapper.appendChild(eventWrapper);
@@ -22145,7 +22199,10 @@ class YearEvent extends TimelineEvent {
                     continue;
                 }
             }
-            if (this.parent.rowAutoHeight || this.cellHeight > availedHeight) {
+            if (this.maxHeight && this.parent.currentView.indexOf('Timeline') !== -1 && overlapIndex > 0) {
+                continue;
+            }
+            if (this.parent.rowAutoHeight || this.shouldRenderAppointment(overlapIndex, availedHeight)) {
                 this.renderEvent(eventWrapper, eventData, month, leftValue, leftValue, monthStart, index);
                 this.updateCellHeight(td, availedHeight);
                 isSpannedCollection.push(eventData);
@@ -22162,6 +22219,10 @@ class YearEvent extends TimelineEvent {
             }
         }
     }
+    setMaxEventHeight(event, cell) {
+        const height = (cell.offsetHeight - this.cellHeader) - (this.maxHeight ? 0 : this.moreIndicatorHeight);
+        setStyleAttribute(event, { 'height': height + 'px', 'align-items': 'center' });
+    }
     // eslint-disable-next-line max-len
     renderEvent(wrapper, eventData, row, left, right, monthDate, rowIndex) {
         const eventObj = this.isSpannedEvent(eventData, monthDate);
@@ -22191,6 +22252,9 @@ class YearEvent extends TimelineEvent {
         setStyleAttribute(wrap, {
             'width': width + 'px', 'height': this.eventHeight + 'px', 'left': left + 'px', 'right': right + 'px', 'top': top + 'px'
         });
+        if (this.maxOrIndicator && this.parent.currentView.indexOf('Timeline') !== -1) {
+            this.setMaxEventHeight(wrap, rowTd);
+        }
         if (!this.isResource && this.parent.rowAutoHeight && this.parent.activeViewOptions.orientation === 'Vertical') {
             wrap.setAttribute('data-index', eventObj.Index.toString());
         }
@@ -22441,7 +22505,7 @@ class DragAndDrop extends ActionBase {
     }
     wireDragEvent(element) {
         new Draggable(element, {
-            abort: '.' + EVENT_RESIZE_CLASS,
+            abort: '.' + EVENT_RESIZE_CLASS + ', .' + INLINE_EDIT_CLASS,
             clone: true,
             isDragScroll: true,
             enableTailMode: this.parent.eventDragArea ? true : false,
@@ -22961,6 +23025,11 @@ class DragAndDrop extends ActionBase {
         this.actionObj.clone.style.top = formatUnit(td.offsetParent.offsetTop);
         this.actionObj.clone.style.left = formatUnit(td.offsetLeft);
         this.actionObj.clone.style.width = formatUnit(td.offsetWidth);
+        if (this.actionObj.cloneElement.length > 1) {
+            this.actionObj.cloneElement.forEach((element) => {
+                element.style.width = formatUnit(td.offsetWidth);
+            });
+        }
         let eventContainer = td;
         let eventWrapper;
         if (this.parent.activeView.isTimelineView()) {
@@ -23248,6 +23317,10 @@ class DragAndDrop extends ActionBase {
                         this.verticalEvent.getTopValue(eStart) : this.actionObj.element.offsetTop;
                     if (isNullOrUndefined(index)) {
                         if (i === 0) {
+                            if (this.actionObj.clone.classList.contains(ALLDAY_APPOINTMENT_CLASS)) {
+                                topValue = this.parent.element.querySelector('.' + ALLDAY_ROW_CLASS).offsetTop;
+                                appHeight = this.getAllDayEventHeight();
+                            }
                             this.actionObj.clone.style.top = formatUnit(topValue);
                             this.actionObj.clone.style.height = formatUnit(appHeight);
                         }
@@ -23257,9 +23330,7 @@ class DragAndDrop extends ActionBase {
                     }
                     else {
                         let appWidth = this.actionObj.cellWidth;
-                        if (event[this.parent.eventFields.isAllDay]) {
-                            topValue = this.parent.element.querySelector('.' + ALLDAY_ROW_CLASS).offsetTop;
-                            appHeight = this.getAllDayEventHeight();
+                        if (event[this.parent.eventFields.isAllDay] && this.parent.activeViewOptions.timeScale.enable) {
                             const timeDiff = event[this.parent.eventFields.endTime].getTime() -
                                 event[this.parent.eventFields.startTime].getTime();
                             const allDayDifference = Math.ceil(timeDiff / (1000 * 3600 * 24));
@@ -24795,7 +24866,7 @@ class VerticalView extends ViewBase {
             case 'dateHeader':
                 if (this.parent.activeViewOptions.dateHeaderTemplate) {
                     templateName = 'dateHeaderTemplate';
-                    const args = { date: date, type: type };
+                    const args = { date: date, type: type, groupIndex: groupIndex };
                     const viewName = this.parent.activeViewOptions.dateHeaderTemplateName;
                     cntEle = [].slice.call(this.parent.getDateHeaderTemplate()(args, this.parent, templateName, templateId + viewName + templateName, false, undefined, undefined, this.parent.root));
                 }
@@ -26443,10 +26514,11 @@ class Year extends ViewBase {
         const startDate = isDateColAvail ? dateCollection[0] : this.getStartDate();
         const endDate = isDateColAvail ? dateCollection[dateCollection.length - 1] : this.getEndDate();
         if (startDate.getFullYear() !== endDate.getFullYear()) {
-            return this.parent.globalize.formatDate(startDate, { skeleton: 'yMMM' }) + ' - ' + this.parent.globalize.formatDate(endDate, { skeleton: 'yMMM' });
+            return this.parent.globalize.formatDate(startDate, { format: 'MMM y', calendar: this.parent.getCalendarMode() })
+                + ' - ' + this.parent.globalize.formatDate(endDate, { format: 'MMM y', calendar: this.parent.getCalendarMode() });
         }
         else {
-            return this.parent.globalize.formatDate(isDateColAvail ? dateCollection[0] : date, { skeleton: 'y' });
+            return this.parent.globalize.formatDate(isDateColAvail ? dateCollection[0] : date, { skeleton: 'y', calendar: this.parent.getCalendarMode() });
         }
     }
     addEventListener() {
@@ -26700,7 +26772,8 @@ class AgendaBase extends ViewBase {
                                     rowSpan: 1, type: 'dateColumn', resource: resColl[parseInt((resColl.length - 1).toString(), 10)],
                                     groupOrder: resData[parseInt(res.toString(), 10)].groupOrder,
                                     resourceData: resData[parseInt(res.toString(), 10)].resourceData,
-                                    date: agendaDate
+                                    date: agendaDate,
+                                    groupIndex: resData[parseInt(res.toString(), 10)].groupIndex
                                 };
                                 if (!lastLevelInfo[parseInt(tempIndex.toString(), 10)]) {
                                     lastLevelInfo[parseInt(tempIndex.toString(), 10)] = [];
@@ -26793,7 +26866,7 @@ class AgendaBase extends ViewBase {
                         continue;
                     }
                     ntd.setAttribute('data-date', data.date.getTime().toString());
-                    ntd.appendChild(this.createDateHeaderElement(data.date));
+                    ntd.appendChild(this.createDateHeaderElement(data.date, data.groupIndex));
                     const className = [AGENDA_CELLS_CLASS, AGENDA_DATE_CLASS];
                     if (data.cssClass) {
                         className.push(data.cssClass);
@@ -26848,11 +26921,11 @@ class AgendaBase extends ViewBase {
             tBody.appendChild(ntr);
         }
     }
-    createDateHeaderElement(date) {
+    createDateHeaderElement(date, groupIndex) {
         let dateHeader;
         if (this.parent.activeViewOptions.dateHeaderTemplate) {
             dateHeader = createElement('div', { className: AGENDA_HEADER_CLASS });
-            const args = { date: date, type: 'dateHeader' };
+            const args = { date: date, type: 'dateHeader', groupIndex: groupIndex };
             const scheduleId = this.parent.element.id + '_';
             const viewName = this.parent.activeViewOptions.dateHeaderTemplateName;
             const templateId = scheduleId + viewName + 'dateHeaderTemplate';
@@ -26959,11 +27032,12 @@ class Agenda extends AgendaBase {
         this.parent.eventsProcessed = this.processAgendaEvents(eventCollection);
         const agendaDate = resetTime(this.parent.selectedDate);
         const tBody = this.element.querySelector('.' + CONTENT_TABLE_CLASS + ' tbody');
+        const contentArea = closest(tBody, '.' + CONTENT_WRAP_CLASS);
+        const scrollTop = contentArea.scrollTop;
         removeChildren(tBody);
         this.renderInitialContent(tBody, agendaDate);
         this.wireEventActions();
-        const contentArea = closest(tBody, '.' + CONTENT_WRAP_CLASS);
-        contentArea.scrollTop = 1;
+        contentArea.scrollTop = scrollTop;
         this.parent.notify(eventsLoaded, {});
         if (!this.parent.activeViewOptions.allowVirtualScrolling) {
             this.retainScrollPosition();