all files / schedule/popups/ event-tooltip.js

93.81% Statements 106/113
90.16% Branches 55/61
100% Functions 13/13
93.81% Lines 106/113
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 151 152 153 154 155 156 157 158 159 160 161 162 163 164 165 166 167 168 169 170 171 172 173 174 175 176 177 178 179 180 181 182 183 184 185 186 187 188 189 190   20× 20×                             20×   20× 20×   20× 19×   20×   36× 36×       36×     36×                         32× 32×     32× 11× 11× 11× 11× 11×     21× 21× 21× 21× 21×   21× 21× 21×   21× 21× 21× 21× 21×     21×     21×     21× 21× 21× 21× 21× 21× 21× 15×       15×         21×   21×       21× 21×   21×   32× 32×         35×   35× 35×   32×           32× 32×   31×     32× 30× 30×   32× 32×     35×     20× 20× 20× 20×        
define(["require", "exports", "@syncfusion/ej2-base", "@syncfusion/ej2-popups", "../base/css-constant", "../base/util", "../base/constant"], function (require, exports, ej2_base_1, ej2_popups_1, cls, util, events) {
    "use strict";
    Object.defineProperty(exports, "__esModule", { value: true });
    var EventTooltip = (function () {
        function EventTooltip(parent) {
            this.parent = parent;
            this.tooltipObj = new ej2_popups_1.Tooltip({
                animation: { close: { effect: 'FadeOut' } },
                content: 'No title',
                position: 'BottomRight',
                offsetY: 10,
                mouseTrail: this.parent.isAdaptive ? false : true,
                showTipPointer: false,
                cssClass: this.parent.cssClass + ' ' + cls.EVENT_TOOLTIP_ROOT_CLASS,
                target: this.getTargets(),
                beforeRender: this.onBeforeRender.bind(this),
                beforeClose: this.onTooltipClose.bind(this),
                beforeOpen: this.onTooltipOpen.bind(this),
                enableRtl: this.parent.enableRtl,
                enableHtmlSanitizer: this.parent.enableHtmlSanitizer
            });
            this.tooltipObj.appendTo(this.parent.element);
        }
        EventTooltip.prototype.getTargets = function () {
            var targets = [];
            if (this.parent.activeViewOptions.group.headerTooltipTemplate) {
                targets.push('.' + cls.RESOURCE_CELLS_CLASS);
            }
            if (this.parent.eventSettings.enableTooltip) {
                targets.push('.' + cls.APPOINTMENT_CLASS);
            }
            return targets.join(',');
        };
        EventTooltip.prototype.onBeforeRender = function (args) {
            var _this = this;
            Iif (this.parent.uiStateValues.isSwipeScroll) {
                args.cancel = true;
                return;
            }
            Iif (!ej2_base_1.isNullOrUndefined(args.target.getAttribute('data-tooltip-id'))) {
                return;
            }
            if (args.target.classList.contains(cls.RESOURCE_CELLS_CLASS) && this.parent.activeViewOptions.group.resources.length > 0) {
                if (args.target.closest('.' + cls.LEFT_INDENT_WRAP_CLASS)) {
                    args.cancel = true;
                    return;
                }
                var resCollection = void 0;
                Eif (this.parent.activeView.isTimelineView()) {
                    var index = parseInt(args.target.getAttribute('data-group-index'), 10);
                    resCollection = this.parent.resourceBase.lastResourceLevel[parseInt(index.toString(), 10)];
                }
                else {
                    var rowIndex = args.target.parentNode.sectionRowIndex;
                    var cellIndex = args.target.cellIndex;
                    resCollection =
                        this.parent.activeView.getColumnLevels()[parseInt(rowIndex.toString(), 10)][parseInt(cellIndex.toString(), 10)];
                }
                var data = {
                    resource: resCollection.resource,
                    resourceData: resCollection.resourceData
                };
                var contentContainer = ej2_base_1.createElement('div');
                var templateId = this.parent.element.id + '_headerTooltipTemplate';
                var tooltipTemplate = [].slice.call(this.parent.getHeaderTooltipTemplate()(data, this.parent, 'headerTooltipTemplate', templateId, false));
                ej2_base_1.append(tooltipTemplate, contentContainer);
                this.setContent(contentContainer);
                this.parent.renderTemplates();
                return;
            }
            var record = this.parent.eventBase.getEventByGuid(args.target.getAttribute('data-guid'));
            Iif (ej2_base_1.isNullOrUndefined(record)) {
                return;
            }
            if (!ej2_base_1.isNullOrUndefined(this.parent.eventSettings.tooltipTemplate)) {
                var contentContainer = ej2_base_1.createElement('div');
                var templateId = this.parent.element.id + '_tooltipTemplate';
                var tooltipTemplate = [].slice.call(this.parent.getEventTooltipTemplate()(record, this.parent, 'tooltipTemplate', templateId, false));
                ej2_base_1.append(tooltipTemplate, contentContainer);
                this.setContent(contentContainer);
            }
            else {
                var globalize = this.parent.globalize;
                var fields = this.parent.eventFields;
                var eventStart = new Date('' + record[fields.startTime]);
                var eventEnd = new Date('' + record[fields.endTime]);
                eventEnd = ((eventEnd.getTime() - eventStart.getTime() !== 0) && eventEnd.getHours() === 0 && eventEnd.getMinutes() === 0) ?
                    new Date(eventEnd.setMilliseconds(-1000)) : eventEnd;
                var startDate = util.resetTime(new Date('' + eventStart));
                var endDate = util.resetTime(new Date('' + eventEnd));
                var tooltipSubject = (record[fields.subject] || this.parent.eventSettings.fields.subject.default
                    || this.parent.localeObj.getConstant('addTitle'));
                var tooltipLocation = !ej2_base_1.isNullOrUndefined(record[fields.location]) ? record[fields.location] : '';
                var startMonthDate = '';
                var startMonthYearDate = '';
                var endMonthYearDate = '';
                startMonthDate = globalize.formatDate(eventStart, {
                    type: 'date', skeleton: 'MMMd', calendar: this.parent.getCalendarMode()
                });
                startMonthYearDate = globalize.formatDate(eventStart, {
                    type: 'date', skeleton: 'medium', calendar: this.parent.getCalendarMode()
                });
                endMonthYearDate = globalize.formatDate(eventEnd, {
                    type: 'date', skeleton: 'medium', calendar: this.parent.getCalendarMode()
                });
                startMonthDate = util.capitalizeFirstWord(startMonthDate, 'single');
                startMonthYearDate = util.capitalizeFirstWord(startMonthYearDate, 'single');
                endMonthYearDate = util.capitalizeFirstWord(endMonthYearDate, 'single');
                var startTime = this.parent.getTimeString(eventStart);
                var endTime = this.parent.getTimeString(eventEnd);
                var tooltipDetails = void 0;
                if (startDate.getTime() === endDate.getTime()) {
                    tooltipDetails =
                        globalize.formatDate(eventStart, {
                            type: 'date', skeleton: 'long', calendar: this.parent.getCalendarMode()
                        });
                    tooltipDetails = util.capitalizeFirstWord(tooltipDetails, 'single');
                }
                else {
                    tooltipDetails = (startDate.getFullYear() === endDate.getFullYear()) ? (startMonthDate + ' - ' + endMonthYearDate) :
                        (startMonthYearDate + ' - ' + endMonthYearDate);
                }
                var tooltipTime = (record[fields.isAllDay]) ? this.parent.localeObj.getConstant('allDay') :
                    (startTime + ' - ' + endTime);
                var content_1 = '<div><div class="e-subject">' + tooltipSubject + '</div>' +
                    '<div class="e-location">' + tooltipLocation + '</div>' +
                    '<div class="e-details">' + tooltipDetails + '</div>' +
                    '<div class="e-all-day">' + tooltipTime + '</div></div>';
                var contentTemp = function () {
                    return content_1;
                };
                this.setContent(ej2_base_1.initializeCSPTemplate(contentTemp));
            }
            this.parent.renderTemplates(function () {
                if (_this.parent && _this.parent.isReact && !ej2_base_1.isNullOrUndefined(_this.parent.eventSettings.tooltipTemplate)) {
                    var wraps = (document.querySelector('.' + cls.TOOLTIP_HIDDEN_CLASS));
                    if (wraps) {
                        ej2_base_1.removeClass([wraps], cls.TOOLTIP_HIDDEN_CLASS);
                    }
                }
            });
        };
        EventTooltip.prototype.onTooltipOpen = function (args) {
            if (args.element && this.parent.isReact && !ej2_base_1.isNullOrUndefined(this.parent.eventSettings.tooltipTemplate)) {
                ej2_base_1.addClass([args.element], cls.TOOLTIP_HIDDEN_CLASS);
            }
            var record = this.parent.eventBase.getEventByGuid(args.target.getAttribute('data-guid'));
            if (ej2_base_1.isNullOrUndefined(record)) {
                return;
            }
            var callbackArgs = {
                cancel: false,
                data: record,
                content: args.element,
                target: args.target
            };
            this.parent.trigger(events.tooltipOpen, callbackArgs, function (callbackArgs) {
                if (callbackArgs.cancel) {
                    args.cancel = true;
                    return;
                }
                args.element = callbackArgs.content;
            });
        };
        EventTooltip.prototype.onTooltipClose = function (args) {
            if (args.element) {
                ej2_base_1.removeClass([args.element], cls.POPUP_OPEN);
                ej2_base_1.addClass([args.element], cls.POPUP_CLOSE);
            }
            Eif (!(this.parent.isReact && this.parent.eventWindow.dialogObject && this.parent.eventWindow.dialogObject.visible)) {
                this.parent.resetTemplates(['tooltipTemplate', 'headerTooltipTemplate']);
            }
        };
        EventTooltip.prototype.setContent = function (content) {
            this.tooltipObj.setProperties({ content: content, windowCollision: true }, true);
        };
        EventTooltip.prototype.close = function () {
            this.tooltipObj.close();
        };
        EventTooltip.prototype.destroy = function () {
            this.tooltipObj.destroy();
            ej2_base_1.addClass([this.parent.element], 'e-control');
            this.tooltipObj = null;
            this.parent = null;
        };
        return EventTooltip;
    }());
    exports.EventTooltip = EventTooltip;
});