UNPKG

com.phloxui

Version:

PhloxUI Ng2+ Framework

1,089 lines (1,088 loc) 638 kB
/** * @fileoverview added by tsickle * @suppress {checkTypes} checked by tsc */ import * as tslib_1 from "tslib"; import { Component, ElementRef, Input, ViewChild, EventEmitter, Output } from '@angular/core'; import { AbstractDataEditorView } from './AbstractDataEditorView'; import { AbstractDataEditor } from './AbstractDataEditor'; import { DefaultCalendarEntryMapper } from './DefaultCalendarEntryMapper'; import { CalendarEntryWrapper } from './CalendarEntryWrapper'; import { DefaultCalendarEntryListPopover } from './DefaultCalendarEntryListPopover.component'; import { DefaultComponentCalendarEntry } from './DefaultComponentCalendarEntry.component'; import { CHANGE_EVENT } from '../../share/CustomEventType'; import { TabModel, SimpleListModel, CalendarViewModel, CalendarEntryPopoverModel, CalendarEntryListPopoverModel, ComponentCalendarEntryModel, DefaultSelectItemModel } from '../model/models'; import { TabPane } from '../TabPane.component'; import { SimpleListPane } from '../SimpleListPane.component'; import { CalendarEntryPopover } from './calendar.internal/CalendarEntryPopover.component'; import { StringDataView } from '../dataview/StringDataView.component'; import { DateTimeUtils } from '../../share/utils/DateTimeUtils'; import { Option } from '../../decorator/Option.decorator'; import { I18N } from '../../decorator/I18N.decorator'; import { ParrotsEditorSettingFactory } from '../../service/ParrotsEditorSettingFactory.service'; import { EventUtils } from '../../share/utils/EventUtils'; import { NeedFocusService } from "../../service/NeedFocusService.service"; const /** @type {?} */ TYPE_NAME = "phx-calendar-view"; const /** @type {?} */ DAY_VIEW = 'DAY'; const /** @type {?} */ WEEK_VIEW = 'WEEK'; const /** @type {?} */ MONTH_VIEW = 'MONTH'; const /** @type {?} */ AGENDA_VIEW = 'AGENDA'; export class CalendarView extends AbstractDataEditorView { /** * @param {?} elementRef * @param {?} editorSettingFactory * @param {?} needFocusService */ constructor(elementRef, editorSettingFactory, needFocusService) { super(editorSettingFactory, elementRef); this.AGENDA_CONTENT_SELECTOR = ".agenda-view > .left > .wrapper > .timeline > .content-wrapper > .content"; this.DAY_CONTENT_SELECTOR = ".day-view > .left > .wrapper > .timeline > .content > .wrapper"; this.WEEK_CONTENT_SELECTOR = ".week-view > .left > .timeline > .timeline-wrapper > .content"; this.MONTH_CONTENT_SELECTOR = ".month-view > .container-wrapper > .container"; this.elementRef = elementRef; this.needFocusService = needFocusService; this.editable = false; this.monthDayContainer = []; this.dayTimeContainer = []; this.weekDayContainer = []; this.agendaRowContainer = []; this.weekRowContainer = []; this.dayRowContainer = []; this.monthRowContainer = []; this.monthMoreRowContainer = []; this.calendarData = []; this.entryWrappers = []; this.currentView = MONTH_VIEW; this.showAddTabBtn = false; this.showBtnGroup = false; this.firstTabAdding = false; this.today = Date.today(); this.defaultRowHeight = 46; this.defaultEntryWidth = 140; this.defaultEntryPadding = 3; this.defaultRowBorderWeight = 1; this.defaultWeekEntryWidth = 14.285714285714285714285714285714; // as percent this.defaultMonthEntryWidth = 14.285714285714285714285714285714; // as percent this.defaultMonthEntryHeight = 15; // as pt this.defaultMonthHeight = 20; // as percent this.defaultAgendaScrollDelay = 1000; this.currentTimeTop = "0pt"; this.defaultDropdownIdx = 0; this.currentEntryMapper = null; this.isAgendaScrolling = false; this.dropdownShow = false; this.dropdownItems = []; this.agendaPosition = []; this.agendaMap = {}; this.viewChangeEvent = new EventEmitter(); this.isAgendaViewClicked = false; this.defaultTopArrowPopover = 10; this.isMonthEntryClick = false; this.isDayEntryClick = false; this.isWeekEntryClick = false; this.i18NResource = { header: { view: { day: "Day", week: "Week", month: "Month", agenda: "Agenda" } }, body: { calendar: { sunday: "Sun", monday: "Mon", tuesday: "Tue", wednesday: "Wed", thursday: "Thu", friday: "Fri", saturday: "Sat" }, agenda: { header: "Timeline" }, entry: { more: "More", item: "item(s)" } } }; // month this.resetMonthDayContainer(); // week this.resetWeekDayContainer(); // day for (let /** @type {?} */ i = 0; i < 24; i++) { let /** @type {?} */ label = ((i < 10) ? "0" + (i) : i) + ":00"; let /** @type {?} */ item = { label: label, time: Date.parse(label) }; this.dayTimeContainer.push(item); } // tab this.tabComponentType = SimpleListPane; this.tabComponentModel = new SimpleListModel('id', StringDataView, 'date', StringDataView); this.timelineData = []; this.noteData = []; // dropdown this.dropdownCompoType = StringDataView; // set model this.dayEntryModel = new CalendarEntryPopoverModel(DefaultComponentCalendarEntry, new ComponentCalendarEntryModel("", null, null, null), 0, 0, 'left'); this.dayEntrySelected = null; this.weekEntryModel = new CalendarEntryPopoverModel(DefaultComponentCalendarEntry, new ComponentCalendarEntryModel("", null, null, null), 0, 0, 'left'); this.weekEntrySelected = null; this.monthEntryModel = new CalendarEntryPopoverModel(DefaultComponentCalendarEntry, new ComponentCalendarEntryModel("", null, null, null), 0, 0, 'left'); this.monthEntrySelected = null; this.monthMoreEntryModel = new CalendarEntryPopoverModel(DefaultCalendarEntryListPopover, new CalendarEntryListPopoverModel("", null, null), 0, 0, 'left'); this.monthMoreEntrySelected = null; //! remove here // this.createTestData(); } /** * @return {?} */ ngOnInit() { super.ngOnInit(); this.applyI18N(this.i18NResource); this.initEditor(); this.currentMonth = new Date(); this.currentEntryMapper = this.getCalendarDropdownMapper(this.defaultDropdownIdx); this.setCalendarMonth(this.currentMonth); if (this.tabPane !== null && typeof this.tabPane !== 'undefined') { //! test data this.timelineData.push({ id: 'AAAAA', date: new Date() }); this.timelineData.push({ id: 'BBBBB', date: this.today }); let /** @type {?} */ timeLineModel = new TabModel("Incoming", null, this.tabComponentType, this.tabComponentModel, this.timelineData); this.tabPane.addTab(timeLineModel); let /** @type {?} */ noteModel = new TabModel("Passed", null, this.tabComponentType, this.tabComponentModel, this.noteData); this.tabPane.addTab(noteModel); //! end test data } // has model when init this.dropdownItems = this.getCalendarDropdownLabelArray(); // set moreMonthType let /** @type {?} */ dayPopoverType = this.getEntryPopoverType(DAY_VIEW); this.dayEntryModel.model.type = dayPopoverType; let /** @type {?} */ weekPopoverType = this.getEntryPopoverType(WEEK_VIEW); this.weekEntryModel.model.type = weekPopoverType; let /** @type {?} */ monthPopoverType = this.getEntryPopoverType(MONTH_VIEW); this.monthEntryModel.model.type = monthPopoverType; this.monthMoreEntryModel.model.type = monthPopoverType; } /** * @return {?} */ ngOnDestroy() { if (this.editor != null && (typeof this.editor !== 'undefined')) { this.editor.removeViewComponent(this); } } /** * @return {?} */ initEditor() { if (this.editor != null && (typeof this.editor !== 'undefined')) { this.editor.addViewComponent(this); if (this.showEvent !== null && (typeof this.showEvent !== 'undefined')) { this.showEvent.subscribe((event) => { this.reloadPage(); }); } let /** @type {?} */ updateEvent = this.editor.getDataUpdateEvent(); if (updateEvent !== null && (typeof updateEvent !== 'undefined')) { updateEvent.subscribe((event) => { let /** @type {?} */ data = null; if (event.detail !== null && typeof event.detail !== 'undefined') { if (event.detail.data !== null && typeof event.detail.data !== 'undefined') { data = event.detail.data.data; } } if (data !== null) { // close popover this.closePopover(null); for (let /** @type {?} */ d of data) { this.replaceCalendarData(d); } this.closeAllPopover(); // rerender this.reRenderViewData(this.currentView, this.currentMonth); } }); } let /** @type {?} */ deleteEvent = this.editor.getDataDeleteEvent(); if (deleteEvent !== null && (typeof deleteEvent !== 'undefined')) { deleteEvent.subscribe((event) => { let /** @type {?} */ data = null; if (event.detail !== null && typeof event.detail !== 'undefined') { if (event.detail.data !== null && typeof event.detail.data !== 'undefined') { data = event.detail.data.data; } } if (data !== null && typeof data !== 'undefined') { for (let /** @type {?} */ d of data) { this.removeData(d); } this.closeAllPopover(); // rerender this.reRenderViewData(this.currentView, this.currentMonth); } }); } let /** @type {?} */ revertEvent = this.editor.getDataRevertEvent(); if (revertEvent !== null && (typeof revertEvent !== 'undefined')) { revertEvent.subscribe((event) => { let /** @type {?} */ data = null; if (event.detail !== null && typeof event.detail !== 'undefined') { if (event.detail.data !== null && typeof event.detail.data !== 'undefined') { data = event.detail.data.data; } } if (data !== null) { for (let /** @type {?} */ d of data) { this.replaceCalendarData(d); } this.closeAllPopover(); // rerender this.reRenderViewData(this.currentView, this.currentMonth); } }); } let /** @type {?} */ dataReloadEvent = this.editor.getDataReloadEvent(); if (dataReloadEvent !== null && (typeof dataReloadEvent !== 'undefined')) { dataReloadEvent.subscribe((event) => { this.reloadPage(); }); } } } /** * @return {?} */ closeAllPopover() { this.closePopover(null); } /** * @return {?} */ getCalendarDropdownMapperArray() { let /** @type {?} */ mappers = []; if (this.model !== null && typeof this.model !== 'undefined') { if (this.model instanceof CalendarViewModel) { let /** @type {?} */ cvModel = /** @type {?} */ (this.model); let /** @type {?} */ entryMappers = cvModel.entryMappers; if (entryMappers !== null && typeof entryMappers !== 'undefined' && Array.isArray(entryMappers)) { for (let /** @type {?} */ m of entryMappers) { mappers.push(m); } } if (cvModel.fromDateTimeField !== null && typeof cvModel.fromDateTimeField !== 'undefined' && cvModel.toDateTimeField !== null && typeof cvModel.toDateTimeField !== 'undefined' && cvModel.titleField !== null && typeof cvModel.titleField !== 'undefined') { mappers.push(new DefaultCalendarEntryMapper('DEFAULT', cvModel.titleField, cvModel.fromDateTimeField, cvModel.toDateTimeField)); } } } return mappers; } /** * @param {?} index * @return {?} */ getCalendarDropdownMapper(index) { if (index === null || typeof index === 'undefined') { return null; } let /** @type {?} */ mapperArray = this.getCalendarDropdownMapperArray(); if (index >= 0 && index < mapperArray.length) { let /** @type {?} */ mapper = mapperArray[index]; if (mapper !== null) { return mapper; } } return null; } /** * @return {?} */ getCalendarDropdownLabelArray() { let /** @type {?} */ entryMappers = this.getCalendarDropdownMapperArray(); let /** @type {?} */ labelArray = []; for (let /** @type {?} */ i = 0; i < entryMappers.length; i++) { let /** @type {?} */ mapper = entryMappers[i]; let /** @type {?} */ label = mapper.getLabel(); labelArray.push(new DefaultSelectItemModel(label, i)); } return labelArray; } /** * @param {?} index * @return {?} */ getCalendarDropdownLabel(index) { if (index < 0) { return null; } let /** @type {?} */ container = this.getCalendarDropdownLabelArray(); if (index < container.length) { return container[index]; } return null; } /** * @param {?} view * @param {?=} $event * @return {?} */ closePopover(view, $event) { let /** @type {?} */ closeDay = false; let /** @type {?} */ closeWeek = false; let /** @type {?} */ closeMonth = false; if (view !== null && typeof view !== 'undefined') { if (DAY_VIEW === view) { closeDay = true; } else if (WEEK_VIEW === view) { closeWeek = true; } else if (MONTH_VIEW === view) { closeMonth = true; } else if (AGENDA_VIEW === view) { // do more when agenda has popover } } else { // close all closeDay = true; closeWeek = true; closeMonth = true; } if (closeDay) { if (this.dayEntryPopover !== null && typeof this.dayEntryPopover !== 'undefined') { if (this.dayEntrySelected !== null && typeof this.dayEntrySelected !== 'undefined') { if (this.dayEntrySelected.selected) { this.dayEntrySelected.selected = false; this.dayEntrySelected = null; this.dayEntryPopover.hide(); // if autosave just save to editor if (this.dayEntryPopover.isAutoSave() && this.dayEntryPopover.isDataDirty()) { this.dayEntryPopover.onAutoSaved($event); let /** @type {?} */ popoverData = this.dayEntryPopover.getData(); if (this.editor !== undefined && this.editor !== null) { this.editor.updateData(popoverData); } } this.dayEntryPopover.onPopoverClosed($event); } } } } if (closeWeek) { if (this.weekEntryPopover !== null && typeof this.weekEntryPopover !== 'undefined') { if (this.weekEntrySelected !== null && typeof this.weekEntrySelected !== 'undefined') { if (this.weekEntrySelected.selected) { this.weekEntrySelected.selected = false; this.weekEntrySelected = null; this.weekEntryPopover.hide(); // if autosave just save to editor if (this.weekEntryPopover.isAutoSave() && this.weekEntryPopover.isDataDirty()) { this.weekEntryPopover.onAutoSaved($event); let /** @type {?} */ popoverData = this.weekEntryPopover.getData(); if (this.editor !== undefined && this.editor !== null) { this.editor.updateData(popoverData); } } this.weekEntryPopover.onPopoverClosed($event); } } } } if (closeMonth) { if (this.monthEntryPopover !== null && typeof this.monthEntryPopover !== 'undefined') { if (this.monthEntrySelected !== null && typeof this.monthEntrySelected !== 'undefined') { if (this.monthEntrySelected.selected) { this.monthEntrySelected.selected = false; this.monthEntrySelected = null; this.monthEntryPopover.hide(); // if autosave just save to editor if (this.monthEntryPopover.isAutoSave() && this.monthEntryPopover.isDataDirty()) { this.monthEntryPopover.onAutoSaved($event); let /** @type {?} */ popoverData = this.monthEntryPopover.getData(); if (this.editor !== undefined && this.editor !== null) { this.editor.updateData(popoverData); } } this.monthEntryPopover.onPopoverClosed($event); } } } if (this.monthMoreEntryPopover !== null && typeof this.monthMoreEntryPopover !== 'undefined') { if (this.monthMoreEntrySelected !== null && typeof this.monthMoreEntrySelected !== 'undefined') { if (this.monthMoreEntrySelected.selected) { this.monthMoreEntrySelected.selected = false; this.monthMoreEntrySelected = null; this.monthMoreEntryPopover.hide(); } } } } } /** * @param {?} data * @return {?} */ removeData(data) { if (data === null && typeof data === 'undefined') { return; } if (this.editor !== null && typeof this.editor !== 'undefined') { let /** @type {?} */ comparator = this.editor.getDataComparator(); let /** @type {?} */ dataIndex = -1; for (let /** @type {?} */ i = 0; i < this.calendarData.length; i++) { let /** @type {?} */ item = this.calendarData[i]; if (comparator !== null) { if (comparator.equals(item, data)) { dataIndex = i; break; } } else { break; } } if (dataIndex > -1) { this.calendarData.splice(dataIndex, 1); } let /** @type {?} */ wrapperIndex = -1; for (let /** @type {?} */ i = 0; i < this.entryWrappers.length; i++) { let /** @type {?} */ entryWrapper = this.entryWrappers[i]; if (comparator !== null) { if (comparator.equals(entryWrapper.getData(), data)) { wrapperIndex = i; break; } } else { break; } } if (wrapperIndex > -1) { this.entryWrappers.splice(wrapperIndex, 1); } } } /** * @param {?} data * @return {?} */ replaceCalendarData(data) { if (data === null && typeof data === 'undefined') { return; } if (this.editor !== null && typeof this.editor !== 'undefined') { let /** @type {?} */ comparator = this.editor.getDataComparator(); let /** @type {?} */ dataIndex = -1; for (let /** @type {?} */ i = 0; i < this.calendarData.length; i++) { let /** @type {?} */ item = this.calendarData[i]; if (comparator !== null) { if (comparator.equals(item, data)) { dataIndex = i; break; } } else { break; } } let /** @type {?} */ cloneObj = null; if (dataIndex > -1) { cloneObj = JSON.parse(JSON.stringify(data)); this.calendarData[dataIndex] = cloneObj; } let /** @type {?} */ wrapperIndex = -1; for (let /** @type {?} */ i = 0; i < this.entryWrappers.length; i++) { let /** @type {?} */ entryWrapper = this.entryWrappers[i]; if (comparator !== null) { if (comparator.equals(entryWrapper.getData(), data)) { wrapperIndex = i; break; } } else { break; } } if (wrapperIndex > -1) { if (cloneObj !== null) { this.entryWrappers[wrapperIndex].setData(cloneObj); } } } } /** * @return {?} */ reloadDataToCalendar() { this.calendarData = []; this.entryWrappers = []; if (this.editor !== null && typeof this.editor !== 'undefined' && this.editor.getData() !== null) { for (let /** @type {?} */ dataObj of this.editor.getData()) { let /** @type {?} */ cloneObj = JSON.parse(JSON.stringify(dataObj)); this.calendarData.push(cloneObj); } } } /** * @return {?} */ reloadPage() { this.reloadDataToCalendar(); this.setCalendarMonth(this.currentMonth); } /** * @param {?} view * @return {?} */ getEntryPopoverType(view) { let /** @type {?} */ defaultType = null; if (this.model !== null && typeof this.model !== 'undefined') { if (this.model instanceof CalendarViewModel) { let /** @type {?} */ cvModel = /** @type {?} */ (this.model); let /** @type {?} */ popoverOption = cvModel.popoverTypeOption; let /** @type {?} */ selectedType = null; if (popoverOption !== null && typeof popoverOption !== 'undefined') { if (popoverOption.default !== null && typeof popoverOption.default !== 'undefined') { defaultType = popoverOption.default; } if (view !== null && typeof view !== 'undefined') { if (DAY_VIEW === view) { selectedType = popoverOption.day; } else if (WEEK_VIEW === view) { selectedType = popoverOption.week; } else if (MONTH_VIEW === view) { selectedType = popoverOption.month; } else if (AGENDA_VIEW === view) { selectedType = popoverOption.agenda; } } if (selectedType !== null && typeof selectedType !== 'undefined') { return selectedType; } } } } return defaultType; } /** * @return {?} */ createTestData() { this.calendarData = []; let /** @type {?} */ testTime1 = new Date().clearTime(); let /** @type {?} */ testTime2 = new Date(testTime1).addHours(2); let /** @type {?} */ testTime1Over = new Date().clearTime(); let /** @type {?} */ testTime2Over = new Date(testTime1Over).addDays(7).addHours(2); let /** @type {?} */ testTime3Over = new Date().clearTime(); let /** @type {?} */ testTime4Over = new Date(testTime3Over).addDays(12); let /** @type {?} */ testTime3 = new Date().clearTime().addDays(1).addHours(5); let /** @type {?} */ testTime4 = new Date(testTime3).addHours(2); let /** @type {?} */ testTime5 = new Date().clearTime().addDays(-1).addHours(5); let /** @type {?} */ testTime6 = new Date(testTime5).addHours(2); let /** @type {?} */ testTime51 = new Date().clearTime().addDays(-1).addHours(5); let /** @type {?} */ testTime61 = new Date(testTime5).addHours(2); let /** @type {?} */ testTime7 = new Date(testTime5).addMinutes(15); let /** @type {?} */ testTime8 = new Date(testTime7).addHours(2); let /** @type {?} */ testTime9 = new Date(testTime5).addMinutes(30); let /** @type {?} */ testTime10 = new Date(testTime9).addHours(2); let /** @type {?} */ testTime11 = new Date().clearTime().addDays(-1).addHours(7); // 7 & 3 let /** @type {?} */ testTime12 = new Date(testTime11).addHours(3); let /** @type {?} */ testTime13 = new Date().clearTime().addDays(4); let /** @type {?} */ testTime14 = new Date(testTime13).addDays(14).addHours(7); this.calendarData.push({ id: 'AAAAA', date1: testTime1, date2: testTime2 }); this.calendarData.push({ id: 'BBBBB', date1: testTime3, date2: testTime4 }); this.calendarData.push({ id: 'CCCCC', date1: testTime5, date2: testTime6 }); this.calendarData.push({ id: 'DDDDD', date1: testTime7, date2: testTime8 }); this.calendarData.push({ id: 'EEEEE', date1: testTime9, date2: testTime10 }); this.calendarData.push({ id: 'GGGGG', date1: testTime11, date2: testTime12 }); this.calendarData.push({ id: 'HHHHH', date1: testTime13, date2: testTime14 }); // this.calendarData.push({ id: 'AAAAA', date1: testTime1Over, date2: testTime2Over }); // this.calendarData.push({ id: 'AAAAA', date1: testTime3Over, date2: testTime4Over }); // this.calendarData.push({ id: 'BBBBB', date1: testTime51, date2: testTime61 }); // this.calendarData.push({ id: 'BBBBB', date1: testTime51, date2: testTime61 }); } /** * @return {?} */ setCurrentTimeIndicator() { let /** @type {?} */ currentTime = new Date(); let /** @type {?} */ newTop = '0pt'; let /** @type {?} */ minInHour = currentTime.getMinutes() / 60; let /** @type {?} */ totalHour = currentTime.getHours() + minInHour; if (totalHour > 0) { newTop = (this.defaultRowHeight * totalHour) + 'pt'; } this.currentTimeTop = newTop; } /** * @param {?} dataObj * @return {?} */ getResolveWrapperObject(dataObj) { if (dataObj === null || typeof dataObj === 'undefined') { return null; } let /** @type {?} */ fromTime = null; let /** @type {?} */ toTime = null; let /** @type {?} */ title = null; let /** @type {?} */ calendarEntry = null; if (this.currentEntryMapper !== null && typeof this.currentEntryMapper !== 'undefined') { let /** @type {?} */ cEntryWrapper = this.getCalendarEntryWrapper(dataObj); if (cEntryWrapper === null) { cEntryWrapper = new CalendarEntryWrapper(dataObj, this.currentEntryMapper, this.elementRef); this.entryWrappers.push(cEntryWrapper); } calendarEntry = cEntryWrapper.getCalendarEntry(); if (calendarEntry !== null && typeof calendarEntry !== 'undefined') { title = calendarEntry.title; fromTime = calendarEntry.startDateTime; toTime = calendarEntry.endDateTime; } } return this.getWrapperObject(fromTime, toTime, title, calendarEntry); } /** * @param {?} fromDate * @param {?} toDate * @param {?} title * @param {?} calendarEntry * @return {?} */ getWrapperObject(fromDate, toDate, title, calendarEntry) { let /** @type {?} */ result = { fromTime: fromDate, toTime: toDate, title: title, top: '0pt', left: '0pt', selected: false, height: this.defaultRowHeight + 'pt', entry: calendarEntry }; return result; } /** * @param {?} wrapperObjectArray * @return {?} */ getWrapperObjectContainer(wrapperObjectArray) { let /** @type {?} */ result = null; if (wrapperObjectArray === null || typeof wrapperObjectArray === 'undefined') { return result; } let /** @type {?} */ startDate = null; let /** @type {?} */ endDate = null; for (let /** @type {?} */ item of wrapperObjectArray) { let /** @type {?} */ fromTime = item.fromTime; let /** @type {?} */ toTime = item.toTime; if (fromTime === null || typeof fromTime === 'undefined') { continue; } if (toTime === null || typeof toTime === 'undefined') { continue; } if (startDate !== null) { if (startDate.isAfter(fromTime)) { startDate = fromTime; } } else { startDate = fromTime; } if (endDate !== null) { if (endDate.isBefore(toTime)) { endDate = toTime; } } else { endDate = toTime; } } result = { startDate: startDate, endDate: endDate, date: startDate, data: wrapperObjectArray }; return result; } /** * @return {?} */ resetMonthDayContainer() { this.monthDayContainer = []; let /** @type {?} */ count = 1; for (let /** @type {?} */ i = 0; i < 5; i++) { let /** @type {?} */ container = []; for (let /** @type {?} */ j = 0; j < 7; j++) { if (count >= 32) { count = 1; } let /** @type {?} */ item = { day: '' }; container.push(item); count += 1; } this.monthDayContainer.push(container); } } /** * @return {?} */ resetWeekDayContainer() { this.weekDayContainer = []; for (let /** @type {?} */ i = 0; i < 7; i++) { let /** @type {?} */ container = []; let /** @type {?} */ label = i + ""; let /** @type {?} */ item = { label: label, data: container }; this.weekDayContainer.push(item); } } /** * @return {?} */ nextMonth() { if (this.currentMonth != null && (typeof this.currentMonth !== 'undefined')) { let /** @type {?} */ date = new Date(this.currentMonth).addMonths(1); this.setCalendarMonth(date); } } /** * @return {?} */ prevMonth() { if (this.currentMonth != null && (typeof this.currentMonth !== 'undefined')) { let /** @type {?} */ date = new Date(this.currentMonth).addMonths(-1); this.setCalendarMonth(date); } } /** * @return {?} */ nextWeek() { if (this.currentMonth != null && (typeof this.currentMonth !== 'undefined')) { let /** @type {?} */ date = new Date(this.currentMonth).addWeeks(1); this.setCalendarMonth(date); } } /** * @return {?} */ prevWeek() { if (this.currentMonth != null && (typeof this.currentMonth !== 'undefined')) { let /** @type {?} */ date = new Date(this.currentMonth).addWeeks(-1); this.setCalendarMonth(date); } } /** * @param {?} $event * @param {?} entryData * @return {?} */ onDayEntryClicked($event, entryData) { if ($event !== null && typeof $event !== 'undefined') { $event.stopPropagation(); $event.cancelBubble = true; } let /** @type {?} */ tgWidth = 0; let /** @type {?} */ tgHeight = 0; let /** @type {?} */ tgTop = 0; let /** @type {?} */ tgLeft = 0; let /** @type {?} */ show = false; let /** @type {?} */ extraLeftPopover = 5; if (this.dayEntryPopover !== null && typeof this.dayEntryPopover !== 'undefined') { if (this.dayEntrySelected !== null && typeof this.dayEntrySelected !== 'undefined') { if (this.dayEntrySelected === entryData) { if (this.dayEntrySelected.selected) { this.dayEntrySelected.selected = false; this.dayEntrySelected = null; show = false; } else { this.dayEntrySelected.selected = true; this.dayEntryPopover.setCalendarEntryMapper(entryData.entry.wrapper.getEntryMapper()); this.dayEntryPopover.setData(entryData.entry.wrapper.data); show = true; } } else { // set old entry false this.dayEntrySelected.selected = false; // set new entry true this.dayEntrySelected = entryData; this.dayEntrySelected.selected = true; this.dayEntryPopover.setCalendarEntryMapper(entryData.entry.wrapper.getEntryMapper()); this.dayEntryPopover.setData(entryData.entry.wrapper.data); show = true; } } else { this.dayEntrySelected = entryData; this.dayEntrySelected.selected = true; this.dayEntryPopover.setCalendarEntryMapper(entryData.entry.wrapper.getEntryMapper()); this.dayEntryPopover.setData(entryData.entry.wrapper.data); show = true; } if (this.dayEntrydelayTimer !== null && typeof this.dayEntrydelayTimer !== 'undefined') { clearTimeout(this.dayEntrydelayTimer); this.dayEntrydelayTimer = null; } let /** @type {?} */ title = null; let /** @type {?} */ selectedDate = null; if (entryData !== null && typeof entryData !== 'undefined') { selectedDate = entryData.fromTime; title = entryData.title; } this.dayEntrydelayTimer = setTimeout(() => { if (typeof $(this.elementRef.nativeElement).find('.day-view') !== 'undefined') { let /** @type {?} */ ele = $(this.elementRef.nativeElement).find('.day-view').find('.entry.selected'); if (typeof ele !== 'undefined') { tgWidth = $(ele).width(); tgHeight = $(ele).height(); if (typeof $(ele).position() !== 'undefined') { tgTop = $(ele).position().top; tgLeft = $(ele).position().left; } } let /** @type {?} */ popoverPosition = 'left'; let /** @type {?} */ popoverWidth = $(this.elementRef.nativeElement).find('.day-view').find('.phx-calendar-entry-popover').width(); let /** @type {?} */ popoverHeight = $(this.elementRef.nativeElement).find('.day-view').find('.phx-calendar-entry-popover').height(); let /** @type {?} */ arrowTop = $(this.elementRef.nativeElement).find('.day-view').find('.phx-calendar-entry-popover >.container-wrapper >.container-after').position().top; let /** @type {?} */ contentWidth = $(this.elementRef.nativeElement).find(this.DAY_CONTENT_SELECTOR).width(); let /** @type {?} */ contentHeight = $(this.elementRef.nativeElement).find(this.DAY_CONTENT_SELECTOR).height(); let /** @type {?} */ newLeft = tgLeft + tgWidth + extraLeftPopover; if (typeof tgWidth !== 'undefined' && typeof popoverWidth !== 'undefined' && typeof contentWidth !== 'undefined') { let /** @type {?} */ popoverMaxLeft = newLeft + popoverWidth; if (popoverMaxLeft > contentWidth) { // render right newLeft = tgLeft - extraLeftPopover - popoverWidth; popoverPosition = 'right'; } } let /** @type {?} */ newArrowTop = this.defaultTopArrowPopover; // default if (typeof tgTop !== 'undefined' && typeof tgHeight !== 'undefined' && typeof popoverHeight !== 'undefined') { let /** @type {?} */ lastPopoverBound = tgTop + popoverHeight; if (lastPopoverBound > contentHeight) { // recal top let /** @type {?} */ difVal = lastPopoverBound - contentHeight; tgTop = tgTop - difVal; newArrowTop = difVal; } } this.dayEntryModel.top = tgTop; this.dayEntryModel.left = newLeft; this.dayEntryModel.position = popoverPosition; this.dayEntryModel.model.title = title; this.dayEntryModel.model.description = selectedDate === null ? '' : selectedDate.toString("dd/MM/yyyy"); this.dayEntryModel.model.date = selectedDate; this.dayEntryPopover.setArrowTop(newArrowTop); } if (show) { this.isDayEntryClick = true; this.needFocusService.setFocusingComponent(this); this.dayEntryPopover.show(); } else { this.isDayEntryClick = false; this.dayEntryPopover.hide(); } }, 5); } } /** * @param {?} $event * @param {?} entryData * @return {?} */ onWeekEntryClicked($event, entryData) { if ($event !== null && typeof $event !== 'undefined') { $event.stopPropagation(); $event.cancelBubble = true; } let /** @type {?} */ tgWidth = 0; let /** @type {?} */ tgHeight = 0; let /** @type {?} */ tgTop = 0; let /** @type {?} */ tgLeft = 0; let /** @type {?} */ show = false; let /** @type {?} */ extraLeftPopover = 5; if (this.weekEntryPopover !== null && typeof this.weekEntryPopover !== 'undefined') { if (this.weekEntrySelected !== null && typeof this.weekEntrySelected !== 'undefined') { if (this.weekEntrySelected === entryData) { if (this.weekEntrySelected.selected) { this.weekEntrySelected.selected = false; this.weekEntrySelected = null; show = false; } else { this.weekEntrySelected.selected = true; this.weekEntryPopover.setCalendarEntryMapper(entryData.entry.wrapper.getEntryMapper()); this.weekEntryPopover.setData(entryData.entry.wrapper.data); show = true; } } else { // set old entry false this.weekEntrySelected.selected = false; // set new entry true this.weekEntrySelected = entryData; this.weekEntrySelected.selected = true; this.weekEntryPopover.setCalendarEntryMapper(entryData.entry.wrapper.getEntryMapper()); this.weekEntryPopover.setData(entryData.entry.wrapper.data); show = true; } } else { this.weekEntrySelected = entryData; this.weekEntrySelected.selected = true; this.weekEntryPopover.setData(entryData.entry.wrapper.data); show = true; } if (this.weekEntrydelayTimer !== null && typeof this.weekEntrydelayTimer !== 'undefined') { clearTimeout(this.weekEntrydelayTimer); this.weekEntrydelayTimer = null; } let /** @type {?} */ title = null; let /** @type {?} */ selectedDate = null; if (entryData !== null && typeof entryData !== 'undefined') { selectedDate = entryData.fromTime; title = entryData.title; } this.weekEntrydelayTimer = setTimeout(() => { if (typeof $(this.elementRef.nativeElement).find('.week-view') !== 'undefined') { let /** @type {?} */ ele = $(this.elementRef.nativeElement).find('.week-view').find('.entry-wrapper.selected'); if (typeof ele !== 'undefined') { tgWidth = $(ele).width(); tgHeight = $(ele).height(); if (typeof $(ele).position() !== 'undefined') { tgTop = $(ele).position().top; tgLeft = $(ele).position().left; } } let /** @type {?} */ popoverPosition = 'left'; let /** @type {?} */ popoverWidth = $(this.elementRef.nativeElement).find('.week-view').find('.phx-calendar-entry-popover').width(); let /** @type {?} */ popoverHeight = $(this.elementRef.nativeElement).find('.week-view').find('.phx-calendar-entry-popover').height(); let /** @type {?} */ arrowTop = $(this.elementRef.nativeElement).find('.week-view').find('.phx-calendar-entry-popover >.container-wrapper >.container-after').position().top; let /** @type {?} */ contentWidth = $(this.elementRef.nativeElement).find(this.WEEK_CONTENT_SELECTOR).width(); let /** @type {?} */ contentHeight = $(this.elementRef.nativeElement).find(this.WEEK_CONTENT_SELECTOR).height(); let /** @type {?} */ newLeft = tgLeft + tgWidth + extraLeftPopover; if (typeof tgWidth !== 'undefined' && typeof popoverWidth !== 'undefined' && typeof contentWidth !== 'undefined') { let /** @type {?} */ popoverMaxLeft = newLeft + popoverWidth; if (popoverMaxLeft > contentWidth) { // render right newLeft = tgLeft - extraLeftPopover - popoverWidth; popoverPosition = 'right'; } } let /** @type {?} */ newArrowTop = this.defaultTopArrowPopover; // default if (typeof tgTop !== 'undefined' && typeof tgHeight !== 'undefined' && typeof popoverHeight !== 'undefined') { let /** @type {?} */ lastPopoverBound = tgTop + popoverHeight; if (lastPopoverBound > contentHeight) { // recal top let /** @type {?} */ difVal = lastPopoverBound - contentHeight; tgTop = tgTop - difVal; newArrowTop = difVal; } } this.weekEntryModel.top = tgTop; this.weekEntryModel.left = newLeft; this.weekEntryModel.position = popoverPosition; this.weekEntryModel.model.title = title; this.weekEntryModel.model.description = selectedDate === null ? '' : selectedDate.toString("dd/MM/yyyy"); this.weekEntryModel.model.date = selectedDate; this.weekEntryPopover.setArrowTop(newArrowTop); } if (show) { this.isWeekEntryClick = true; this.needFocusService.setFocusingComponent(this); this.weekEntryPopover.show(); } else { this.isWeekEntryClick = false; this.weekEntryPopover.hide(); } }, 5); } } /** * @param {?} $event * @param {?} entryData * @return {?} */ onMonthEntryClicked($event, entryData) { if ($event !== null && typeof $event !== 'undefined') { $event.stopPropagation(); $event.cancelBubble = true; } let /** @type {?} */ tgWidth = 0; let /** @type {?} */ tgHeight = 0; let /** @type {?} */ tgTop = 0; let /** @type {?} */ tgLeft = 0; let /** @type {?} */ tgInnerWidth = 0; let /** @type {?} */ show = false; let /** @type {?} */ extraLeftPopover = 5; if (this.monthEntryPopover !== null && typeof this.monthEntryPopover !== 'undefined') { if (this.monthEntrySelected !== null && typeof this.monthEntrySelected !== 'undefined') { if (this.monthEntrySelected === entryData) { if (this.monthEntrySelected.selected) { this.monthEntrySelected.selected = false; this.monthEntrySelected = null; show = false; } else { this.monthEntrySelected.selected = true; this.monthEntryPopover.setCalendarEntryMapper(entryData.entry.wrapper.getEntryMapper()); this.monthEntryPopover.setData(entryData.entry.wrapper.data); show = true; } } else { // set old entry false this.monthEntrySelected.selected = false; // set new entry true this.monthEntrySelected = entryData; this.monthEntrySelected.selected = true; this.monthEntryPopover.setCalendarEntryMapper(entryData.entry.wrapper.getEntryMapper()); this.monthEntryPopover.setData(entryData.entry.wrapper.data); show = true; } } else { this.monthEntrySelected = entryData; this.monthEntrySelected.selected = true; this.monthEntryPopover.setCalendarEntryMapper(entryData.entry.wrapper.getEntryMapper()); this.monthEntryPopover.setData(entryData.entry.wrapper.data); show = true; } if (this.monthEntrydelayTimer !== null && typeof this.monthEntrydelayTimer !== 'undefined') { clearTimeout(this.monthEntrydelayTimer); this.monthEntrydelayTimer = null; } let /** @type {?} */ title = null; let /** @type {?} */ selectedDate = null; if (entryData !== null && typeof entryData !== 'undefined') { selectedDate = entryData.fromTime; title = entryData.title; } this.monthEntrydelayTimer = setTimeout(() => { if (typeof $(this.elementRef.nativeElement).find('.month-view') !== 'undefined') { let /** @type {?} */ ele = $(this.elementRef.nativeElement).find('.month-view').find('.entry-wrapper.selected'); if (typeof ele !== 'undefined') { tgWidth = $(ele).width(); tgHeight = $(ele).height(); if (typeof $(ele).position() !== 'undefined') { tgTop = $(ele).position().top; tgLeft = $(ele).position().left; }