@syncfusion/ej2-schedule 25.2.3 → 25.2.6

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

@@ -1806,10 +1806,11 @@ class ScheduleTouch {
         this.touchRightDirection = this.parent.enableRtl ? 'Left' : 'Right';
     }
     scrollHandler(e) {
-        if (this.parent.currentView === 'Agenda' || this.parent.uiStateValues.action || !this.parent.allowSwiping ||
-            (e.originalEvent && e.originalEvent.target &&
-                (e.originalEvent.target.classList.contains(APPOINTMENT_CLASS) ||
-                    closest(e.originalEvent.target, '.' + APPOINTMENT_CLASS)) && !this.parent.isAdaptive)) {
+        const blockSwipe = !this.parent.isAdaptive && e.originalEvent && e.originalEvent.target &&
+            !isNullOrUndefined(closest(e.originalEvent.target, '.' + APPOINTMENT_CLASS));
+        this.parent.uiStateValues.isTouchScroll = blockSwipe && e.originalEvent.type === 'touchmove' && !this.parent.uiStateValues.action;
+        if (blockSwipe || this.parent.currentView === 'Agenda' || this.parent.uiStateValues.action || !this.parent.allowSwiping ||
+            this.parent.uiStateValues.isTapHold) {
             return;
         }
         if (!this.timeStampStart) {
@@ -1866,7 +1867,8 @@ class ScheduleTouch {
         }
     }
     swipeHandler(e) {
-        if (!this.isScrollTriggered || this.parent.uiStateValues.action || !this.parent.allowSwiping) {
+        if (!this.isScrollTriggered || this.parent.uiStateValues.action || !this.parent.allowSwiping ||
+            this.parent.uiStateValues.isTapHold) {
             return;
         }
         this.isScrollTriggered = false;
@@ -1896,11 +1898,27 @@ class ScheduleTouch {
     }
     tapHoldHandler(e) {
         const target = closest(e.originalEvent.target, '.' + APPOINTMENT_CLASS);
-        if (!isNullOrUndefined(target) && this.parent.isAdaptive) {
-            this.parent.quickPopup.tapHoldEventPopup(e.originalEvent);
-            return;
+        if (!isNullOrUndefined(target)) {
+            this.parent.uiStateValues.isTapHold = true;
+            if (this.parent.isAdaptive) {
+                if (Browser.isIos) {
+                    EventHandler.add(this.element, 'touchend', this.preventEventClick, this);
+                }
+                this.parent.quickPopup.tapHoldEventPopup(e.originalEvent);
+            }
+            else if (['Agenda', 'MonthAgenda', 'Year'].indexOf(this.parent.currentView) < 0) {
+                this.parent.selectedElements = [];
+                this.parent.eventBase.getSelectedEventElements(target);
+                if (this.parent.resizeModule && closest(e.originalEvent.target, '.' + EVENT_RESIZE_CLASS)) {
+                    this.parent.resizeModule.resizeStart(e.originalEvent);
+                }
+            }
         }
     }
+    preventEventClick(e) {
+        e.preventDefault();
+        EventHandler.remove(this.element, 'touchend', this.preventEventClick);
+    }
     renderPanel(clsName, nextPrevType) {
         if (!this.currentPanel) {
             this.currentPanel = {
@@ -6061,6 +6079,10 @@ class EventBase {
             }
         }
         else if (!closest(element, '.' + POPUP_OPEN)) {
+            if (this.parent.uiStateValues.isTapHold && closest(element, '.' + WORK_CELLS_CLASS + ',.' + ALLDAY_CELLS_CLASS)) {
+                return;
+            }
+            this.parent.uiStateValues.isTapHold = false;
             this.removeSelectedAppointmentClass();
             this.parent.selectedElements = [];
         }
@@ -6069,7 +6091,7 @@ class EventBase {
         const isReadOnly = (!isNullOrUndefined(event)) ? event[this.parent.eventFields.isReadonly] : false;
         EventHandler.add(element, 'click', this.eventClick, this);
         if (!this.parent.isAdaptive && !this.parent.activeViewOptions.readonly && !isReadOnly) {
-            EventHandler.add(element, 'touchstart', this.eventTouchClick, this);
+            EventHandler.add(element, 'touchend', this.eventTouchClick, this);
             EventHandler.add(element, 'dblclick', this.eventDoubleClick, this);
         }
         if (!this.parent.activeViewOptions.readonly && !isReadOnly && !isPreventCrud) {
@@ -6082,6 +6104,10 @@ class EventBase {
         }
     }
     eventTouchClick(e) {
+        if (this.parent.uiStateValues.isTouchScroll || this.parent.uiStateValues.isTapHold || this.parent.uiStateValues.action) {
+            this.parent.uiStateValues.isTouchScroll = this.parent.uiStateValues.isTapHold = false;
+            return;
+        }
         setTimeout(() => this.isDoubleTapped = false, 250);
         e.preventDefault();
         if (this.isDoubleTapped) {
@@ -6192,7 +6218,7 @@ class EventBase {
         if (this.parent.quickPopup) {
             this.parent.quickPopup.quickPopupHide(true);
         }
-        if (eventData.type === 'touchstart') {
+        if (eventData.type === 'touchend') {
             this.activeEventData(eventData, true);
         }
         this.removeSelectedAppointmentClass();
@@ -6479,8 +6505,8 @@ class EventBase {
             const scheduleId = this.parent.element.id + '_';
             const viewName = this.parent.activeViewOptions.eventTemplateName;
             const templateId = scheduleId + viewName + 'eventTemplate';
-            const templateName = 'eventTemplate' + (isResourceEventTemplate &&
-                this.parent.currentView.indexOf('Year') === -1 ? '_' + resIndex : '');
+            const templateName = isResourceEventTemplate && this.parent.currentView.indexOf('Year') === -1 ?
+                this.parent.getEventTemplateName(resIndex) : 'eventTemplate';
             templateElement = this.parent.getAppointmentTemplate()(record, this.parent, templateName, templateId, false);
         }
         else {
@@ -7045,7 +7071,7 @@ class VerticalEvent extends EventBase {
             const viewName = this.parent.activeViewOptions.eventTemplateName;
             const templateId = elementId + viewName + 'eventTemplate';
             const resIndex = this.parent.uiStateValues.isGroupAdaptive ? this.parent.uiStateValues.groupIndex : resource;
-            const templateName = 'eventTemplate' + (this.isResourceEventTemplate ? '_' + resIndex : '');
+            const templateName = this.isResourceEventTemplate ? this.parent.getEventTemplateName(resIndex) : 'eventTemplate';
             templateElement = this.parent.getAppointmentTemplate()(record, this.parent, templateName, templateId, false);
         }
         else {
@@ -7924,7 +7950,7 @@ class MonthEvent extends EventBase {
             const scheduleId = this.parent.element.id + '_';
             const viewName = this.parent.activeViewOptions.eventTemplateName;
             const templateId = scheduleId + viewName + 'eventTemplate';
-            const eventTemplate = 'eventTemplate' + (this.isResourceEventTemplate ? '_' + resIndex : '');
+            const eventTemplate = this.isResourceEventTemplate ? this.parent.getEventTemplateName(resIndex) : 'eventTemplate';
             templateElement = this.parent.getAppointmentTemplate()(eventObj, this.parent, eventTemplate, templateId, false);
         }
         else {
@@ -9483,7 +9509,6 @@ class QuickPopups {
     }
     tapHoldEventPopup(e) {
         const target = closest(e.target, '.' + APPOINTMENT_CLASS);
-        this.isMultipleEventSelect = false;
         this.parent.selectedElements = [];
         this.isMultipleEventSelect = true;
         this.parent.eventBase.getSelectedEventElements(target);
@@ -14205,11 +14230,18 @@ class Render {
     }
     initializeLayout(viewName) {
         if (this.parent.activeView) {
-            const templates = [
-                'cellTemplate', 'eventTemplate', 'tooltipTemplate', 'majorSlotTemplate', 'minorSlotTemplate',
+            let templates = [
+                'cellTemplate', 'tooltipTemplate', 'majorSlotTemplate', 'minorSlotTemplate',
                 'headerTooltipTemplate', 'dateHeaderTemplate', 'dayHeaderTemplate', 'monthHeaderTemplate',
                 'headerIndentTemplate', 'resourceHeaderTemplate', 'cellHeaderTemplate', 'dateRangeTemplate'
             ];
+            if (this.parent.activeEventTemplates.length > 0) {
+                templates = templates.concat(this.parent.activeEventTemplates);
+                this.parent.activeEventTemplates = [];
+            }
+            else {
+                templates.push('eventTemplate');
+            }
             this.parent.resetTemplates(templates);
             this.parent.activeView.removeEventListener();
             this.parent.activeView.destroy();
@@ -15145,6 +15177,13 @@ class WorkCellInteraction {
             this.parent.eventWindow.openEditor(this.parent.activeCellsData, 'Add');
             return;
         }
+        const isWorkCell = target.classList.contains(WORK_CELLS_CLASS) ||
+            target.classList.contains(ALLDAY_CELLS_CLASS);
+        if (this.parent.uiStateValues.isTapHold && !this.parent.uiStateValues.action && isWorkCell) {
+            this.parent.uiStateValues.isTapHold = false;
+            this.parent.eventBase.removeSelectedAppointmentClass();
+            this.parent.selectedElements = [];
+        }
         const navigateEle = closest(e.target, '.' + NAVIGATE_CLASS);
         const navigateView = this.parent.getNavigateView();
         const sameView = this.parent.currentView === navigateView;
@@ -15160,8 +15199,6 @@ class WorkCellInteraction {
                 closest(e.target, '.' + MORE_INDICATOR_CLASS))) {
                 return;
             }
-            const isWorkCell = target.classList.contains(WORK_CELLS_CLASS) ||
-                target.classList.contains(ALLDAY_CELLS_CLASS);
             if (isWorkCell && e.shiftKey && e.which === 1 && this.parent.keyboardInteractionModule) {
                 this.parent.keyboardInteractionModule.onMouseSelection(e);
                 return;
@@ -15239,7 +15276,7 @@ class WorkCellInteraction {
             return true;
         }
         target = closest(e.target, '.' + HEADER_CELLS_CLASS);
-        if (this.parent.activeView.isTimelineView() && !isNullOrUndefined(target)) {
+        if (this.parent.activeView && this.parent.activeView.isTimelineView() && !isNullOrUndefined(target)) {
             return true;
         }
         return false;
@@ -16336,7 +16373,8 @@ class ResourceBase {
     getResourceRenderDates() {
         // eslint-disable-next-line prefer-spread
         const resourceDates = [].concat.apply([], this.lastResourceLevel.map((e) => e.renderDates));
-        const removeDuplicateDates = (dateColl) => dateColl.filter((date, index, dates) => dates.map((dateObj) => dateObj.getTime()).indexOf(date.getTime()) === index);
+        const time = resourceDates.map((dateObj) => dateObj.getTime());
+        const removeDuplicateDates = (dateColl) => dateColl.filter((date, index) => time.indexOf(date.getTime()) === index);
         const renderDates = removeDuplicateDates(resourceDates);
         renderDates.sort((a, b) => a.getTime() - b.getTime());
         return renderDates;
@@ -16496,7 +16534,8 @@ class ResourceBase {
                     index = resource.dataSource.map((e) => e[resource.idField]).indexOf(id);
                 }
             }
-            const offsetTarget = this.parent.element.querySelector(`.${HEADER_ROW_CLASS}:nth-child(${levelIndex + 1})`);
+            const offsetTarget = this.parent.currentView === 'Month' ? this.parent.element.querySelector(`.${DATE_HEADER_WRAP_CLASS} tbody tr:nth-child(${levelIndex + 1})`)
+                : this.parent.element.querySelector(`.${HEADER_ROW_CLASS}:nth-child(${levelIndex + 1})`);
             const offset = [].slice.call(offsetTarget.children).map((node) => node.offsetLeft);
             scrollElement.scrollLeft = offset[parseInt(index.toString(), 10)];
         }
@@ -16687,6 +16726,13 @@ let Schedule = class Schedule extends Component {
             this.element.appendChild(this.createElement('div', { className: TABLE_CONTAINER_CLASS }));
         }
     }
+    getEventTemplateName(resIndex) {
+        const templateName = 'eventTemplate_' + resIndex;
+        if (this.activeEventTemplates.indexOf(templateName) < 0) {
+            this.activeEventTemplates.push(templateName);
+        }
+        return templateName;
+    }
     /**
      * Method to render react templates
      *
@@ -17273,6 +17319,7 @@ let Schedule = class Schedule extends Component {
         this.resourceCollection = [];
         this.currentAction = null;
         this.selectedElements = [];
+        this.activeEventTemplates = [];
         this.setViewOptions();
     }
     getDefaultLocale() {
@@ -17741,7 +17788,7 @@ let Schedule = class Schedule extends Component {
     }
     onScheduleResize() {
         if (isNullOrUndefined(this.activeView) || ((this.isAdaptive || isMobile()) && document.activeElement
-            && document.activeElement.classList.contains(SUBJECT_CLASS))) {
+            && document.activeElement.classList.contains(SUBJECT_CLASS)) || this.uiStateValues.isTapHold) {
             return;
         }
         if (this.virtualScrollModule && this.activeView.isTimelineView()) {
@@ -20070,6 +20117,10 @@ class Resize extends ActionBase {
         }
     }
     resizeStart(e) {
+        if (e && e.type === 'touchstart' && (!this.parent.uiStateValues.isTapHold ||
+            !closest(e.target, '.' + APPOINTMENT_BORDER))) {
+            return;
+        }
         this.actionObj.action = 'resize';
         this.actionObj.slotInterval = this.parent.activeViewOptions.timeScale.interval / this.parent.activeViewOptions.timeScale.slotCount;
         this.actionObj.interval = this.actionObj.slotInterval;
@@ -20133,6 +20184,9 @@ class Resize extends ActionBase {
         });
     }
     resizing(e) {
+        if (e && e.type === 'touchmove') {
+            e.preventDefault();
+        }
         if (this.parent.quickPopup) {
             this.parent.quickPopup.quickPopupHide();
         }
@@ -20322,7 +20376,7 @@ class Resize extends ActionBase {
         this.removeCloneElementClasses();
         this.removeCloneElement();
         this.actionClass('removeClass');
-        this.parent.uiStateValues.action = false;
+        this.parent.uiStateValues.action = this.parent.uiStateValues.isTapHold = false;
         const resizeArgs = { cancel: false, data: this.getChangedData(), element: this.actionObj.element, event: e };
         this.parent.trigger(resizeStop, resizeArgs, (resizeEventArgs) => {
             if (resizeEventArgs.cancel) {
@@ -21228,7 +21282,6 @@ class DragAndDrop extends ActionBase {
             abort: '.' + EVENT_RESIZE_CLASS,
             clone: true,
             isDragScroll: true,
-            enableTapHold: this.parent.isAdaptive,
             enableTailMode: (this.parent.eventDragArea) ? true : false,
             cursorAt: (this.parent.eventDragArea) ? { left: -20, top: -20 } : { left: 0, top: 0 },
             dragArea: this.dragArea,
@@ -21246,6 +21299,10 @@ class DragAndDrop extends ActionBase {
             this.parent.element.querySelector('.' + CONTENT_TABLE_CLASS);
     }
     dragHelper(e) {
+        if (e.sender && e.sender.type === 'touchmove' && (!this.parent.uiStateValues.isTapHold ||
+            !e.element.classList.contains(APPOINTMENT_BORDER))) {
+            return null;
+        }
         this.setDragActionDefaultValues();
         this.actionObj.element = e.element;
         this.actionObj.action = 'drag';
@@ -21454,6 +21511,9 @@ class DragAndDrop extends ActionBase {
         return this.multiData;
     }
     drag(e) {
+        if (e.event && e.event.type === 'touchmove') {
+            e.event.preventDefault();
+        }
         if (this.parent.quickPopup) {
             this.parent.quickPopup.quickPopupHide(true);
         }
@@ -21543,7 +21603,7 @@ class DragAndDrop extends ActionBase {
         clearInterval(this.actionObj.scrollInterval);
         this.actionObj.scrollInterval = null;
         this.actionClass('removeClass');
-        this.parent.uiStateValues.action = false;
+        this.parent.uiStateValues.action = this.parent.uiStateValues.isTapHold = false;
         if (this.isAllowDrop(e)) {
             return;
         }
@@ -22525,10 +22585,27 @@ class ViewBase {
         // Method to refresh the date header
     }
     refreshResourceHeader() {
-        remove(this.element.querySelector('tbody').lastElementChild.firstElementChild);
-        const resTd = createElement('td');
-        resTd.appendChild(this.parent.resourceBase.createResourceColumn());
-        prepend([resTd], this.element.querySelector('tbody').lastElementChild);
+        const resTbl = this.element.querySelector('.' + RESOURCE_COLUMN_TABLE_CLASS);
+        const resourceTd = Array.from(resTbl.querySelectorAll('.' + RESOURCE_CELLS_CLASS));
+        resourceTd.forEach((currentElement) => {
+            const children = Array.from(currentElement.children);
+            children.forEach((child) => {
+                if (!child.classList.contains(RESOURCE_EXPAND_CLASS) && !child.classList.contains(RESOURCE_COLLAPSE_CLASS)) {
+                    remove(child);
+                }
+            });
+        });
+        if (!isNullOrUndefined(this.parent.resourceBase.renderedResources) && this.parent.resourceBase.renderedResources.length > 0) {
+            for (let i = 0; i < resourceTd.length; i++) {
+                const element = resourceTd[parseInt(i.toString(), 10)];
+                const data = this.parent.resourceBase.renderedResources[parseInt(i.toString(), 10)];
+                if (this.parent.activeView && !isNullOrUndefined(element) && !isNullOrUndefined(data)
+                    && parseInt(element.getAttribute('data-group-index'), 10) === data.groupIndex) {
+                    this.parent.activeView.setResourceHeaderContent(element, data, RESOURCE_TEXT_CLASS);
+                }
+            }
+        }
+        this.parent.renderTemplates();
         this.parent.notify(contentReady, {});
     }
     getDayName(date) {
@@ -23124,7 +23201,7 @@ class VerticalView extends ViewBase {
             this.parent.uiStateValues.top = target.scrollTop;
         }
         this.parent.uiStateValues.left = target.scrollLeft;
-        if (!isNullOrUndefined(this.parent.quickPopup)) {
+        if (!isNullOrUndefined(this.parent.quickPopup) && !this.parent.uiStateValues.isTapHold) {
             this.parent.quickPopup.quickPopupHide();
         }
         this.setPersistence();
@@ -23484,6 +23561,10 @@ class VerticalView extends ViewBase {
         remove(this.element.querySelector('tbody tr'));
         this.renderHeader();
         this.parent.notify(contentReady, {});
+        const dateHeader = this.element.querySelector('.' + DATE_HEADER_WRAP_CLASS);
+        if (dateHeader) {
+            dateHeader.scrollLeft = this.parent.uiStateValues.left;
+        }
     }
     renderLayout(type) {
         this.setPanel(createElement('div', { className: TABLE_WRAP_CLASS }));
@@ -24185,6 +24266,14 @@ class Month extends ViewBase {
         remove(this.element.querySelector('tbody tr'));
         this.renderHeader();
         this.parent.notify(contentReady, {});
+        const dateHeader = this.element.querySelector('.' + DATE_HEADER_WRAP_CLASS);
+        const contentWrapper = this.element.querySelector('.' + CONTENT_WRAP_CLASS);
+        if (dateHeader) {
+            dateHeader.scrollLeft = this.parent.uiStateValues.left;
+        }
+        if (contentWrapper) {
+            contentWrapper.scrollLeft = this.parent.uiStateValues.left;
+        }
     }
     wireCellEvents(element) {
         EventHandler.add(element, 'mousedown', this.parent.workCellAction.cellMouseDown, this.parent.workCellAction);