angular-schedule
Version:
A simple and light schedule package for angular.
924 lines (908 loc) • 40.5 kB
JavaScript
import { Injectable, ɵɵdefineInjectable, InjectionToken, EventEmitter, Component, ChangeDetectionStrategy, Inject, ElementRef, ViewContainerRef, ViewChild, ViewChildren, Input, Output, Directive, Renderer2, HostListener, NgModule } from '@angular/core';
import { __spread } from 'tslib';
import { fromEvent } from 'rxjs';
import { Overlay, OverlayModule } from '@angular/cdk/overlay';
import { TemplatePortal } from '@angular/cdk/portal';
import { filter, take } from 'rxjs/operators';
import { CommonModule } from '@angular/common';
/**
* @fileoverview added by tsickle
* Generated from: lib/scheduler.service.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var SchedulerService = /** @class */ (function () {
function SchedulerService() {
}
SchedulerService.decorators = [
{ type: Injectable, args: [{
providedIn: 'root'
},] }
];
/** @nocollapse */
SchedulerService.ctorParameters = function () { return []; };
/** @nocollapse */ SchedulerService.ngInjectableDef = ɵɵdefineInjectable({ factory: function SchedulerService_Factory() { return new SchedulerService(); }, token: SchedulerService, providedIn: "root" });
return SchedulerService;
}());
/**
* @fileoverview added by tsickle
* Generated from: lib/lib.config.token.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/** @type {?} */
var USER_OPTIONS = new InjectionToken('scheduler user options');
/**
* @fileoverview added by tsickle
* Generated from: lib/scheduler.component.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var SchedulerComponent = /** @class */ (function () {
function SchedulerComponent(libConfig, elementRef, overlay, viewContainerRef) {
this.libConfig = libConfig;
this.elementRef = elementRef;
this.overlay = overlay;
this.viewContainerRef = viewContainerRef;
this.isSelecting = false;
this.finishedSelecting = new EventEmitter();
this.editInfo = new EventEmitter();
this.excludedDay = new EventEmitter();
this.includedDay = new EventEmitter();
}
/**
* @param {?} changes
* @return {?}
*/
SchedulerComponent.prototype.ngOnChanges = /**
* @param {?} changes
* @return {?}
*/
function (changes) {
if (changes.showBy) {
this.generateAllDates();
}
};
/**
* @return {?}
*/
SchedulerComponent.prototype.ngOnInit = /**
* @return {?}
*/
function () { };
/**
* @return {?}
*/
SchedulerComponent.prototype.ngAfterViewInit = /**
* @return {?}
*/
function () {
this.scrollToToday();
};
/**
* @return {?}
*/
SchedulerComponent.prototype.generateAllDates = /**
* @return {?}
*/
function () {
/** @type {?} */
var CURRENT_MONTH = new Date().getMonth();
/** @type {?} */
var CURRENT_YEAR = new Date().getFullYear();
/** @type {?} */
var MONTHS_IN_PAST = this.libConfig.monthsInPast || 4;
/** @type {?} */
var MONTHS_IN_FUTURE = this.libConfig.monthsInFuture || 12;
/** @type {?} */
var pastMonth = CURRENT_MONTH - MONTHS_IN_PAST < 0
? CURRENT_MONTH - MONTHS_IN_PAST + 12
: CURRENT_MONTH - MONTHS_IN_PAST;
/** @type {?} */
var pastYear = pastMonth >= 9 ? CURRENT_YEAR - 1 : CURRENT_YEAR;
/** @type {?} */
var TO_DATE = this.calculateToDate(CURRENT_YEAR, CURRENT_MONTH, MONTHS_IN_FUTURE);
/** @type {?} */
var DATEOBJ = [];
while (pastYear <= TO_DATE.getFullYear()) {
/** @type {?} */
var FRAME = pastYear === TO_DATE.getFullYear() ? TO_DATE.getMonth() : 11;
if (this.showBy === 'day') {
for (var index = pastMonth; index <= FRAME; index++) {
DATEOBJ.push({
month: new Date(Date.UTC(pastYear, pastMonth, 1)),
weekDays: this.generateDates(pastYear, pastMonth),
});
pastMonth = pastMonth === 11 ? 0 : pastMonth + 1;
}
}
else {
DATEOBJ.push({
month: new Date(Date.UTC(pastYear, pastMonth, 1)),
weekDays: this.generateMonths(pastYear, pastMonth, FRAME),
});
for (var index = pastMonth; index <= FRAME; index++) {
pastMonth = pastMonth === 11 ? 0 : pastMonth + 1;
}
}
pastYear += 1;
}
this.days = DATEOBJ;
};
/**
* @param {?} year
* @param {?} month
* @param {?} toMonths
* @return {?}
*/
SchedulerComponent.prototype.calculateToDate = /**
* @param {?} year
* @param {?} month
* @param {?} toMonths
* @return {?}
*/
function (year, month, toMonths) {
/** @type {?} */
var NEW_MONTH = month + toMonths > 12 ? (month + toMonths) % 12 : month + toMonths;
/** @type {?} */
var ADD_TO_YEAR = month + toMonths > 12 ? Math.floor((month + toMonths) / 12) : 0;
return new Date(Date.UTC(year + ADD_TO_YEAR, NEW_MONTH, 1));
};
/**
* @param {?} year
* @param {?} month
* @return {?}
*/
SchedulerComponent.prototype.generateDates = /**
* @param {?} year
* @param {?} month
* @return {?}
*/
function (year, month) {
/** @type {?} */
var DATEOBJ = new Date(Date.UTC(year, month, 1));
/** @type {?} */
var WEEKDAYS = [];
while (DATEOBJ.getMonth() === month) {
WEEKDAYS.push(new Date(DATEOBJ));
DATEOBJ.setDate(DATEOBJ.getDate() + 1);
}
return WEEKDAYS;
};
/**
* @param {?} day
* @return {?}
*/
SchedulerComponent.prototype.excludeIncludeCheck = /**
* @param {?} day
* @return {?}
*/
function (day) {
return false;
};
/**
* @param {?} start
* @param {?} end
* @param {?} current
* @return {?}
*/
SchedulerComponent.prototype.calculateFromTo = /**
* @param {?} start
* @param {?} end
* @param {?} current
* @return {?}
*/
function (start, end, current) {
/** @type {?} */
var FROM = new Date(start);
/** @type {?} */
var TO = new Date(end);
/** @type {?} */
var CHECK = new Date(current);
/** @type {?} */
var SKIP_DAYS = this.libConfig.skipDays || [0, 6];
if (this.showBy === 'day') {
return (CHECK >= FROM && CHECK <= TO && !SKIP_DAYS.includes(CHECK.getDay()));
}
return CHECK >= FROM && CHECK <= TO;
};
/**
* @param {?} start
* @param {?} end
* @param {?} current
* @return {?}
*/
SchedulerComponent.prototype.isDayOff = /**
* @param {?} start
* @param {?} end
* @param {?} current
* @return {?}
*/
function (start, end, current) {
/** @type {?} */
var FROM = new Date(start);
/** @type {?} */
var TO = new Date(end);
/** @type {?} */
var CHECK = new Date(current);
/** @type {?} */
var SKIP_DAYS = this.libConfig.skipDays || [0, 6];
return (CHECK >= FROM &&
CHECK <= TO &&
SKIP_DAYS.includes(CHECK.getDay()) &&
this.showBy !== 'month');
};
/**
* @param {?} ev
* @return {?}
*/
SchedulerComponent.prototype.enter = /**
* @param {?} ev
* @return {?}
*/
function (ev) {
if (this.isSelecting) {
if (ev.target.classList.contains('selected')) {
ev.target.classList.remove('selected');
if (ev.target.parentNode.nextSibling.lastChild.classList.contains('selected')) {
ev.target.parentNode.nextSibling.lastChild.classList.remove('selected');
}
}
else {
ev.target.classList.add('selected');
if (!ev.target.parentNode.previousSibling.lastChild.classList.contains('selected')) {
ev.target.parentNode.previousSibling.lastChild.classList.add('selected');
}
}
}
};
/**
* @param {?} ev
* @param {?} day
* @param {?} user
* @return {?}
*/
SchedulerComponent.prototype.startSelect = /**
* @param {?} ev
* @param {?} day
* @param {?} user
* @return {?}
*/
function (ev, day, user) {
// tslint:disable-next-line:curly
if (ev.button !== 0)
return;
this.startUser = user;
this.isSelecting = true;
ev.target.classList.add('selected');
this.startDay = day;
};
/**
* @param {?} ev
* @param {?} endDay
* @param {?} user
* @return {?}
*/
SchedulerComponent.prototype.endSelect = /**
* @param {?} ev
* @param {?} endDay
* @param {?} user
* @return {?}
*/
function (ev, endDay, user) {
if (this.startUser !== user) {
throw "Start and end row doesn't match! You might have started selecting in one row and ended up in another one.";
}
// tslint:disable-next-line:curly
if (ev.button !== 0)
return;
ev.target.classList.add('selected');
this.isSelecting = false;
this.selections.forEach((/**
* @param {?} el
* @return {?}
*/
function (el) {
return el.nativeElement.classList.remove('selected');
}));
/** @type {?} */
var DATA = {
endDay: ((/** @type {?} */ (endDay))).toISOString(),
user: user,
startDay: this.startDay.toISOString(),
};
this.finishedSelecting.emit(DATA);
};
/**
* @param {?} ev
* @return {?}
*/
SchedulerComponent.prototype.reCalc = /**
* @param {?} ev
* @return {?}
*/
function (ev) {
if (this.isSelecting) {
/** @type {?} */
var RECT = this.container.nativeElement.getBoundingClientRect();
/** @type {?} */
var X = ev.clientX - RECT.left;
if (X > 1000) {
this.container.nativeElement.scrollLeft += 40;
}
}
};
/**
* @return {?}
*/
SchedulerComponent.prototype.scrollToToday = /**
* @return {?}
*/
function () {
/** @type {?} */
var ELEM = (/** @type {?} */ (this.elementRef.nativeElement.querySelector('.bottomData__title.today')));
ELEM.scrollIntoView();
};
/**
* @param {?} year
* @param {?} month
* @param {?} toMonth
* @return {?}
*/
SchedulerComponent.prototype.generateMonths = /**
* @param {?} year
* @param {?} month
* @param {?} toMonth
* @return {?}
*/
function (year, month, toMonth) {
/** @type {?} */
var counter = month;
/** @type {?} */
var months = [];
while (counter <= toMonth) {
((/** @type {?} */ (months))) = __spread(months, [new Date(Date.UTC(year, counter, 1))]);
counter++;
}
return months;
};
/**
* @param {?} ev
* @param {?} user
* @param {?} project
* @param {?} weekday
* @return {?}
*/
SchedulerComponent.prototype.open = /**
* @param {?} ev
* @param {?} user
* @param {?} project
* @param {?} weekday
* @return {?}
*/
function (ev, user, project, weekday) {
var _this = this;
if (this.showBy === 'day') {
var x = ev.x, y = ev.y;
ev.preventDefault();
this.close();
/** @type {?} */
var positionStrategy = this.overlay
.position()
.flexibleConnectedTo({ x: x, y: y })
.withPositions([
{
originX: 'end',
originY: 'bottom',
overlayX: 'end',
overlayY: 'top',
},
]);
this.overlayRef = this.overlay.create({
positionStrategy: positionStrategy,
scrollStrategy: this.overlay.scrollStrategies.close(),
});
this.overlayRef.attach(new TemplatePortal(this.userMenu, this.viewContainerRef, {
$implicit: { user: user, project: project, weekday: weekday },
}));
this.sub = fromEvent(document, 'click')
.pipe(filter((/**
* @param {?} event
* @return {?}
*/
function (event) {
/** @type {?} */
var clickTarget = (/** @type {?} */ (event.target));
return (!!_this.overlayRef &&
!_this.overlayRef.overlayElement.contains(clickTarget));
})), take(1))
.subscribe((/**
* @return {?}
*/
function () { return _this.close(); }));
}
};
/**
* @return {?}
*/
SchedulerComponent.prototype.close = /**
* @return {?}
*/
function () {
this.sub && this.sub.unsubscribe();
if (this.overlayRef) {
this.overlayRef.dispose();
this.overlayRef = null;
}
};
/**
* @param {?} data
* @return {?}
*/
SchedulerComponent.prototype.excludeDay = /**
* @param {?} data
* @return {?}
*/
function (data) {
this.close();
this.excludedDay.emit(data);
};
/**
* @param {?} data
* @return {?}
*/
SchedulerComponent.prototype.includeDay = /**
* @param {?} data
* @return {?}
*/
function (data) {
this.close();
this.includedDay.emit(data);
};
/**
* @param {?} day
* @return {?}
*/
SchedulerComponent.prototype.isToday = /**
* @param {?} day
* @return {?}
*/
function (day) {
return new Date(day).toDateString() === new Date().toDateString();
};
/**
* @param {?} index
* @param {?} el
* @return {?}
*/
SchedulerComponent.prototype.trackPersons = /**
* @param {?} index
* @param {?} el
* @return {?}
*/
function (index, el) {
return el.id;
};
/**
* @param {?} index
* @return {?}
*/
SchedulerComponent.prototype.trackMonths = /**
* @param {?} index
* @return {?}
*/
function (index) {
return index;
};
/**
* @param {?} index
* @return {?}
*/
SchedulerComponent.prototype.trackDays = /**
* @param {?} index
* @return {?}
*/
function (index) {
return index;
};
/**
* @param {?} index
* @param {?} el
* @return {?}
*/
SchedulerComponent.prototype.trackData = /**
* @param {?} index
* @param {?} el
* @return {?}
*/
function (index, el) {
return el.id;
};
SchedulerComponent.decorators = [
{ type: Component, args: [{
selector: 'ngx-scheduler',
template: "\n\t\t<button\n\t\t\t*ngIf=\"libConfig?.showToday\"\n\t\t\tclass=\"scrollToToday\"\n\t\t\t(click)=\"scrollToToday()\"\n\t\t>\n\t\t\t{{ todayButtonLabel || 'Today' }}\n\t\t</button>\n\t\t<div class=\"table\">\n\t\t\t<div class=\"left\">\n\t\t\t\t<div class=\"spacer\"></div>\n\t\t\t\t<div\n\t\t\t\t\t*ngFor=\"let person of persons; trackBy: trackPersons\"\n\t\t\t\t\t[ngStyle]=\"{\n\t\t\t\t\t\theight:\n\t\t\t\t\t\t\tperson.data.length * 30 >= 60\n\t\t\t\t\t\t\t\t? (person?.data.length + 3) * 30 + 'px'\n\t\t\t\t\t\t\t\t: '100px'\n\t\t\t\t\t}\"\n\t\t\t\t\tclass=\"who\"\n\t\t\t\t>\n\t\t\t\t\t<strong>{{ person?.name }}</strong>\n\t\t\t\t\t<br />\n\t\t\t\t\t<small [innerText]=\"person?.departments || ''\"></small>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t\t<div #container class=\"right\">\n\t\t\t\t<div class=\"header\">\n\t\t\t\t\t<div\n\t\t\t\t\t\t*ngFor=\"let day of days; trackBy: trackMonths\"\n\t\t\t\t\t\tclass=\"headerData\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<div class=\"topData\">\n\t\t\t\t\t\t\t<strong\n\t\t\t\t\t\t\t\t>{{\n\t\t\t\t\t\t\t\t\tshowBy === 'day'\n\t\t\t\t\t\t\t\t\t\t? (day.month | date: 'MMM yyyy')\n\t\t\t\t\t\t\t\t\t\t: (day.month | date: 'yyyy')\n\t\t\t\t\t\t\t\t}}\n\t\t\t\t\t\t\t</strong>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t\t<div class=\"bottomData\">\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclass=\"bottomData__title\"\n\t\t\t\t\t\t\t\t*ngFor=\"let weekday of day?.weekDays; trackBy: trackDays\"\n\t\t\t\t\t\t\t\t[class.today]=\"isToday(weekday)\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<strong>{{\n\t\t\t\t\t\t\t\t\tshowBy === 'day'\n\t\t\t\t\t\t\t\t\t\t? (weekday | date: 'dd EEE')\n\t\t\t\t\t\t\t\t\t\t: (weekday | date: 'MMMM')\n\t\t\t\t\t\t\t\t}}</strong>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t\t<div>\n\t\t\t\t\t<div\n\t\t\t\t\t\tclass=\"pos-rel\"\n\t\t\t\t\t\t*ngFor=\"let person of persons; let i = index; trackBy: trackPersons\"\n\t\t\t\t\t>\n\t\t\t\t\t\t<div *ngFor=\"let day of days; trackBy: trackMonths\" class=\"body\">\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tclass=\"bodyData\"\n\t\t\t\t\t\t\t\t[ngStyle]=\"{\n\t\t\t\t\t\t\t\t\theight:\n\t\t\t\t\t\t\t\t\t\tperson?.data.length * 30 >= 60\n\t\t\t\t\t\t\t\t\t\t\t? (person?.data.length + 3) * 30 + 'px'\n\t\t\t\t\t\t\t\t\t\t\t: '100px',\n\t\t\t\t\t\t\t\t\t'background-color': isToday(weekday)\n\t\t\t\t\t\t\t\t\t\t? 'rgba(241, 229, 188, .5)'\n\t\t\t\t\t\t\t\t\t\t: '#fff'\n\t\t\t\t\t\t\t\t}\"\n\t\t\t\t\t\t\t\t*ngFor=\"let weekday of day?.weekDays; trackBy: trackDays\"\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<label\n\t\t\t\t\t\t\t\t\tclass=\"projectLabel\"\n\t\t\t\t\t\t\t\t\t*ngFor=\"let project of person?.data; trackBy: trackData\"\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t(contextmenu)=\"open($event, person.id, project, weekday)\"\n\t\t\t\t\t\t\t\t\t\t[showTooltip]=\"libConfig?.showTooltip\"\n\t\t\t\t\t\t\t\t\t\t[tooltip]=\"project?.description || ''\"\n\t\t\t\t\t\t\t\t\t\t[placement]=\"placement\"\n\t\t\t\t\t\t\t\t\t\t[delay]=\"delay\"\n\t\t\t\t\t\t\t\t\t\t[ngStyle]=\"{ backgroundColor: project?.color }\"\n\t\t\t\t\t\t\t\t\t\t*ngIf=\"\n\t\t\t\t\t\t\t\t\t\t\t(calculateFromTo(project?.from, project?.to, weekday) &&\n\t\t\t\t\t\t\t\t\t\t\t\t!project?.excludeDays.includes(weekday)) ||\n\t\t\t\t\t\t\t\t\t\t\tproject?.includeDays.includes(weekday)\n\t\t\t\t\t\t\t\t\t\t\"\n\t\t\t\t\t\t\t\t\t\t(click)=\"\n\t\t\t\t\t\t\t\t\t\t\teditInfo.emit({ person: person?.id, project: project })\n\t\t\t\t\t\t\t\t\t\t\"\n\t\t\t\t\t\t\t\t\t\t>{{ project?.name }} {{ project?.hours }}</span\n\t\t\t\t\t\t\t\t\t>\n\n\t\t\t\t\t\t\t\t\t<span\n\t\t\t\t\t\t\t\t\t\t(contextmenu)=\"\n\t\t\t\t\t\t\t\t\t\t\topen($event, person.id, project, weekday);\n\t\t\t\t\t\t\t\t\t\t\t$event.preventDefault()\n\t\t\t\t\t\t\t\t\t\t\"\n\t\t\t\t\t\t\t\t\t\t*ngIf=\"\n\t\t\t\t\t\t\t\t\t\t\t(isDayOff(project?.from, project?.to, weekday) &&\n\t\t\t\t\t\t\t\t\t\t\t\t!project?.includeDays.includes(weekday)) ||\n\t\t\t\t\t\t\t\t\t\t\tproject?.excludeDays.includes(weekday)\n\t\t\t\t\t\t\t\t\t\t\"\n\t\t\t\t\t\t\t\t\t\tclass=\"dayOff\"\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t{{ dayOffLabel || 'Day off' }}</span\n\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t</label>\n\t\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\t\t#selectionDiv\n\t\t\t\t\t\t\t\t\tclass=\"selectionDiv\"\n\t\t\t\t\t\t\t\t\t(mousedown)=\"startSelect($event, weekday, person?.id)\"\n\t\t\t\t\t\t\t\t\t(mouseenter)=\"enter($event)\"\n\t\t\t\t\t\t\t\t\t(mousemove)=\"reCalc($event)\"\n\t\t\t\t\t\t\t\t\t(mouseup)=\"endSelect($event, weekday, person?.id)\"\n\t\t\t\t\t\t\t\t\t[ngStyle]=\"{\n\t\t\t\t\t\t\t\t\t\twidth: '100%',\n\t\t\t\t\t\t\t\t\t\theight:\n\t\t\t\t\t\t\t\t\t\t\tperson.data.length * 30 >= 60\n\t\t\t\t\t\t\t\t\t\t\t\t? (person?.data.length + 3) * 30 -\n\t\t\t\t\t\t\t\t\t\t\t\t person?.data.length * 30 +\n\t\t\t\t\t\t\t\t\t\t\t\t 'px'\n\t\t\t\t\t\t\t\t\t\t\t\t: 100 - person?.data.length * 30 + 'px'\n\t\t\t\t\t\t\t\t\t}\"\n\t\t\t\t\t\t\t\t></div>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</div>\n\t\t\t\t\t</div>\n\t\t\t\t</div>\n\t\t\t</div>\n\t\t</div>\n\n\t\t<ng-template #userMenu let-data>\n\t\t\t<section class=\"user-menu\">\n\t\t\t\t<div\n\t\t\t\t\t*ngIf=\"\n\t\t\t\t\t\t(calculateFromTo(\n\t\t\t\t\t\t\tdata?.project?.from,\n\t\t\t\t\t\t\tdata?.project?.to,\n\t\t\t\t\t\t\tdata?.weekday\n\t\t\t\t\t\t) &&\n\t\t\t\t\t\t\t!data?.project?.excludeDays.includes(data?.weekday)) ||\n\t\t\t\t\t\tdata?.project?.includeDays.includes(data?.weekday)\n\t\t\t\t\t\"\n\t\t\t\t\t(click)=\"excludeDay(data)\"\n\t\t\t\t>\n\t\t\t\t\tExclude day\n\t\t\t\t</div>\n\t\t\t\t<div\n\t\t\t\t\t*ngIf=\"\n\t\t\t\t\t\t(isDayOff(data?.project?.from, data?.project?.to, data?.weekday) &&\n\t\t\t\t\t\t\t!data?.project?.includeDays.includes(data?.weekday)) ||\n\t\t\t\t\t\tdata?.project?.excludeDays.includes(data?.weekday)\n\t\t\t\t\t\"\n\t\t\t\t\t(click)=\"includeDay(data)\"\n\t\t\t\t>\n\t\t\t\t\tInclude day\n\t\t\t\t</div>\n\t\t\t</section>\n\t\t</ng-template>\n\t",
changeDetection: ChangeDetectionStrategy.OnPush,
styles: ["\n\t\t\t* {\n\t\t\t\tbox-sizing: border-box;\n\t\t\t\tborder-collapse: collapse;\n\t\t\t\t-webkit-user-select: none;\n\t\t\t\t-moz-user-select: none;\n\t\t\t\t-ms-user-select: none;\n\t\t\t\tuser-select: none;\n\t\t\t}\n\t\t\t.table {\n\t\t\t\tborder: 1px solid #d5d5d5;\n\t\t\t\tbackground-color: #f5f5f5;\n\t\t\t\tborder-spacing: 0;\n\t\t\t\tdisplay: flex;\n\t\t\t}\n\t\t\t.table .spacer {\n\t\t\t\twidth: 300px;\n\t\t\t\theight: 70px;\n\t\t\t\tborder: 1px solid #d5d5d5;\n\t\t\t}\n\t\t\t.table .who {\n\t\t\t\theight: 100px;\n\t\t\t\tpadding: 8px 16px;\n\t\t\t\tborder: 1px solid #d5d5d5;\n\t\t\t\tbackground-color: #fff;\n\t\t\t}\n\t\t\t.table .who strong {\n\t\t\t\tfont-size: 16px;\n\t\t\t\tcolor: #1a1a1a;\n\t\t\t}\n\n\t\t\t.table .right {\n\t\t\t\toverflow-x: auto;\n\t\t\t\toverflow-y: hidden;\n\t\t\t}\n\t\t\t.table .right .header {\n\t\t\t\tdisplay: flex;\n\t\t\t}\n\t\t\t.table .right .header .topData {\n\t\t\t\theight: 40px;\n\t\t\t\tdisplay: flex;\n\t\t\t\talign-items: center;\n\t\t\t\tjustify-content: center;\n\t\t\t\tborder-right: 1px solid #d5d5d5;\n\t\t\t\tborder-left: 1px solid #d5d5d5;\n\t\t\t}\n\t\t\t.table .right .header .bottomData {\n\t\t\t\theight: 30px;\n\t\t\t\tdisplay: flex;\n\t\t\t}\n\t\t\t.table .right .header .bottomData__title {\n\t\t\t\tfont-size: 12px;\n\t\t\t\tfont-weight: 600;\n\t\t\t\tcolor: #1a1a1a;\n\t\t\t\tborder: 1px solid #d5d5d5;\n\t\t\t\twidth: 100px;\n\t\t\t\tmin-width: 100px;\n\t\t\t\tpadding: 9px;\n\t\t\t\ttext-align: left;\n\t\t\t}\n\n\t\t\t.pos-rel {\n\t\t\t\tdisplay: flex;\n\t\t\t}\n\t\t\t.selected {\n\t\t\t\tbackground-color: #f7f9fa;\n\t\t\t\tborder-bottom: 2px solid #dce2e6;\n\t\t\t\tborder-top: 2px solid #dce2e6;\n\t\t\t\tborder-left-color: transparent;\n\t\t\t\tborder-right-color: transparent;\n\t\t\t}\n\t\t\t.selected:first-of-type {\n\t\t\t\tborder-left-color: #dce2e6;\n\t\t\t}\n\t\t\t.body {\n\t\t\t\tdisplay: flex;\n\t\t\t\tposition: relative;\n\t\t\t}\n\t\t\t.bodyData {\n\t\t\t\tbackground-color: #fff;\n\t\t\t\tborder: 1px solid #d5d5d5;\n\t\t\t\theight: 100px;\n\t\t\t\twidth: 100px;\n\t\t\t\tmin-width: 100px;\n\t\t\t}\n\t\t\t.projectLabel {\n\t\t\t\tposition: relative;\n\t\t\t\tmargin-bottom: 5px;\n\t\t\t\tdisplay: block;\n\t\t\t\theight: 25px;\n\t\t\t\t-webkit-user-select: none;\n\t\t\t\t-moz-user-select: none;\n\t\t\t\t-ms-user-select: none;\n\t\t\t\tuser-select: none;\n\t\t\t}\n\t\t\t.projectLabel span {\n\t\t\t\tcolor: #fff;\n\t\t\t\twidth: 100%;\n\t\t\t\tdisplay: block;\n\t\t\t\tpadding: 5px;\n\t\t\t\tfont-size: 12px;\n\t\t\t\t-webkit-user-select: none;\n\t\t\t\t-moz-user-select: none;\n\t\t\t\t-ms-user-select: none;\n\t\t\t\tuser-select: none;\n\t\t\t\tposition: relative;\n\t\t\t}\n\t\t\t.dayOff {\n\t\t\t\tbackground: #f2f0eb 0% 0% no-repeat padding-box;\n\t\t\t\tcolor: #27241d !important;\n\t\t\t}\n\t\t\t.today {\n\t\t\t\tbackground-color: rgba(241, 229, 188, 0.5);\n\t\t\t}\n\t\t\t.scrollToToday {\n\t\t\t\tbackground: #f2f0eb 0% 0% no-repeat padding-box;\n\t\t\t\tborder-radius: 4px;\n\t\t\t\tborder: 0;\n\t\t\t\theight: 36px;\n\t\t\t\tdisplay: flex;\n\t\t\t\talign-items: center;\n\t\t\t\tjustify-content: center;\n\t\t\t\tletter-spacing: 0px;\n\t\t\t\tcolor: #27241d;\n\t\t\t\tfont-size: 14px;\n\t\t\t\tline-height: 21px;\n\t\t\t\tpadding: 0 15px;\n\t\t\t\tmargin-bottom: 10px;\n\t\t\t}\n\n\t\t\t.ng-tooltip {\n\t\t\t\tposition: absolute;\n\t\t\t\tmax-width: 150px;\n\t\t\t\tfont-size: 14px;\n\t\t\t\ttext-align: center;\n\t\t\t\tcolor: #f8f8f2;\n\t\t\t\tpadding: 3px 8px;\n\t\t\t\tbackground: #282a36;\n\t\t\t\tborder-radius: 4px;\n\t\t\t\tz-index: 1000;\n\t\t\t\topacity: 0;\n\t\t\t}\n\t\t\t.ng-tooltip:after {\n\t\t\t\tcontent: '';\n\t\t\t\tposition: absolute;\n\t\t\t\tborder-style: solid;\n\t\t\t}\n\t\t\t.ng-tooltip-top:after {\n\t\t\t\ttop: 100%;\n\t\t\t\tleft: 50%;\n\t\t\t\tmargin-left: -5px;\n\t\t\t\tborder-width: 5px;\n\t\t\t\tborder-color: black transparent transparent transparent;\n\t\t\t}\n\t\t\t.ng-tooltip-bottom:after {\n\t\t\t\tbottom: 100%;\n\t\t\t\tleft: 50%;\n\t\t\t\tmargin-left: -5px;\n\t\t\t\tborder-width: 5px;\n\t\t\t\tborder-color: transparent transparent black transparent;\n\t\t\t}\n\t\t\t.ng-tooltip-left:after {\n\t\t\t\ttop: 50%;\n\t\t\t\tleft: 100%;\n\t\t\t\tmargin-top: -5px;\n\t\t\t\tborder-width: 5px;\n\t\t\t\tborder-color: transparent transparent transparent black;\n\t\t\t}\n\t\t\t.ng-tooltip-right:after {\n\t\t\t\ttop: 50%;\n\t\t\t\tright: 100%;\n\t\t\t\tmargin-top: -5px;\n\t\t\t\tborder-width: 5px;\n\t\t\t\tborder-color: transparent black transparent transparent;\n\t\t\t}\n\t\t\t.ng-tooltip-show {\n\t\t\t\topacity: 1;\n\t\t\t}\n\t\t\t.my-menu {\n\t\t\t\tbackground-color: #fff;\n\t\t\t\tborder: 1px solid rosybrown;\n\t\t\t\tpadding: 20px;\n\t\t\t}\n\n\t\t\t.user-menu {\n\t\t\t\tbackground-color: #fafafa;\n\t\t\t\tpadding: 4pt;\n\t\t\t\tfont-size: 10pt;\n\t\t\t\tz-index: 1000;\n\t\t\t\tbox-shadow: 0 0 12pt rgba(0, 0, 0, 0.25);\n\t\t\t\tborder-radius: 4pt;\n\t\t\t\tpadding: 0.5em 0 0.5em 0;\n\t\t\t\tanimation: fadeIn 0.1s ease-out;\n\t\t\t\topacity: 1;\n\t\t\t\tdisplay: block;\n\t\t\t}\n\n\t\t\t.user-menu hr {\n\t\t\t\tborder: none;\n\t\t\t\tborder-bottom: 1px solid #eee;\n\t\t\t}\n\n\t\t\t.user-menu div {\n\t\t\t\tcursor: pointer;\n\t\t\t\tdisplay: block;\n\t\t\t\ttext-decoration: none;\n\t\t\t\tcolor: #333;\n\t\t\t\tpadding: 0.5em 2em 0.5em 0.75em;\n\t\t\t\tmax-width: 18em;\n\t\t\t\twhite-space: nowrap;\n\t\t\t\toverflow: hidden;\n\t\t\t\ttext-overflow: ellipsis;\n\t\t\t}\n\n\t\t\t.user-menu div:hover {\n\t\t\t\tbackground-color: #333;\n\t\t\t\tcolor: #fff;\n\t\t\t}\n\n\t\t\t.user-menu div::before {\n\t\t\t\tcontent: '';\n\t\t\t\tfloat: left;\n\t\t\t\tmargin-right: 0.75em;\n\t\t\t\twidth: 0.5em;\n\t\t\t\theight: 1em;\n\t\t\t\tdisplay: inline-block;\n\t\t\t}\n\n\t\t\t/* Animatinons */\n\t\t\t@-webkit-keyframes fadeIn {\n\t\t\t\tfrom {\n\t\t\t\t\topacity: 0;\n\t\t\t\t}\n\t\t\t\tto {\n\t\t\t\t\topacity: 1;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t@keyframes fadeIn {\n\t\t\t\tfrom {\n\t\t\t\t\topacity: 0;\n\t\t\t\t}\n\t\t\t\tto {\n\t\t\t\t\topacity: 1;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t@-webkit-keyframes fadeOut {\n\t\t\t\tfrom {\n\t\t\t\t\topacity: 1;\n\t\t\t\t}\n\t\t\t\tto {\n\t\t\t\t\topacity: 0;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t@keyframes fadeOut {\n\t\t\t\tfrom {\n\t\t\t\t\topacity: 1;\n\t\t\t\t}\n\t\t\t\tto {\n\t\t\t\t\topacity: 0;\n\t\t\t\t}\n\t\t\t}\n\n\t\t\t.is-fadingIn {\n\t\t\t\t-webkit-animation: fadeIn 0.1s ease-out;\n\t\t\t\tanimation: fadeIn 0.1s ease-out;\n\t\t\t\topacity: 1;\n\t\t\t\tdisplay: block;\n\t\t\t}\n\n\t\t\t.is-fadingOut {\n\t\t\t\t-webkit-animation: fadeOut 0.1s ease-out;\n\t\t\t\tanimation: fadeOut 0.1s ease-out;\n\t\t\t\topacity: 0;\n\t\t\t\tdisplay: block;\n\t\t\t}\n\t\t"]
}] }
];
/** @nocollapse */
SchedulerComponent.ctorParameters = function () { return [
{ type: undefined, decorators: [{ type: Inject, args: [USER_OPTIONS,] }] },
{ type: ElementRef },
{ type: Overlay },
{ type: ViewContainerRef }
]; };
SchedulerComponent.propDecorators = {
container: [{ type: ViewChild, args: ['container', { static: true },] }],
userMenu: [{ type: ViewChild, args: ['userMenu', { static: true },] }],
selections: [{ type: ViewChildren, args: ['selectionDiv',] }],
persons: [{ type: Input }],
showBy: [{ type: Input }],
delay: [{ type: Input }],
dayOffLabel: [{ type: Input }],
todayButtonLabel: [{ type: Input }],
placement: [{ type: Input }],
finishedSelecting: [{ type: Output }],
editInfo: [{ type: Output }],
excludedDay: [{ type: Output }],
includedDay: [{ type: Output }]
};
return SchedulerComponent;
}());
if (false) {
/** @type {?} */
SchedulerComponent.prototype.days;
/** @type {?} */
SchedulerComponent.prototype.isSelecting;
/** @type {?} */
SchedulerComponent.prototype.startDay;
/** @type {?} */
SchedulerComponent.prototype.startUser;
/** @type {?} */
SchedulerComponent.prototype.sub;
/** @type {?} */
SchedulerComponent.prototype.overlayRef;
/** @type {?} */
SchedulerComponent.prototype.container;
/** @type {?} */
SchedulerComponent.prototype.userMenu;
/** @type {?} */
SchedulerComponent.prototype.selections;
/** @type {?} */
SchedulerComponent.prototype.persons;
/** @type {?} */
SchedulerComponent.prototype.showBy;
/** @type {?} */
SchedulerComponent.prototype.delay;
/** @type {?} */
SchedulerComponent.prototype.dayOffLabel;
/** @type {?} */
SchedulerComponent.prototype.todayButtonLabel;
/** @type {?} */
SchedulerComponent.prototype.placement;
/** @type {?} */
SchedulerComponent.prototype.finishedSelecting;
/** @type {?} */
SchedulerComponent.prototype.editInfo;
/** @type {?} */
SchedulerComponent.prototype.excludedDay;
/** @type {?} */
SchedulerComponent.prototype.includedDay;
/** @type {?} */
SchedulerComponent.prototype.libConfig;
/**
* @type {?}
* @private
*/
SchedulerComponent.prototype.elementRef;
/** @type {?} */
SchedulerComponent.prototype.overlay;
/** @type {?} */
SchedulerComponent.prototype.viewContainerRef;
}
/**
* @fileoverview added by tsickle
* Generated from: lib/tooltip.directive.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var TooltipDirective = /** @class */ (function () {
function TooltipDirective(el, renderer) {
this.el = el;
this.renderer = renderer;
this.offset = 10;
}
/**
* @return {?}
*/
TooltipDirective.prototype.onMouseEnter = /**
* @return {?}
*/
function () {
if (!this.tooltip && this.tooltipTitle !== '' && this.showTooltip) {
this.show();
}
};
/**
* @return {?}
*/
TooltipDirective.prototype.onMouseLeave = /**
* @return {?}
*/
function () {
if (this.tooltip) {
this.hide();
}
};
/**
* @return {?}
*/
TooltipDirective.prototype.show = /**
* @return {?}
*/
function () {
this.create();
this.setPosition();
this.renderer.addClass(this.tooltip, 'ng-tooltip-show');
};
/**
* @return {?}
*/
TooltipDirective.prototype.hide = /**
* @return {?}
*/
function () {
var _this = this;
this.renderer.removeClass(this.tooltip, 'ng-tooltip-show');
window.setTimeout((/**
* @return {?}
*/
function () {
_this.renderer.removeChild(document.body, _this.tooltip);
_this.tooltip = null;
}), this.delay);
};
/**
* @return {?}
*/
TooltipDirective.prototype.create = /**
* @return {?}
*/
function () {
this.tooltip = this.renderer.createElement('span');
this.renderer.appendChild(this.tooltip, this.renderer.createText(this.tooltipTitle));
this.renderer.appendChild(document.body, this.tooltip);
this.renderer.addClass(this.tooltip, 'ng-tooltip');
this.renderer.addClass(this.tooltip, "ng-tooltip-" + this.placement);
this.renderer.setStyle(this.tooltip, '-webkit-transition', "opacity " + this.delay + "ms");
this.renderer.setStyle(this.tooltip, '-moz-transition', "opacity " + this.delay + "ms");
this.renderer.setStyle(this.tooltip, '-o-transition', "opacity " + this.delay + "ms");
this.renderer.setStyle(this.tooltip, 'transition', "opacity " + this.delay + "ms");
};
/**
* @return {?}
*/
TooltipDirective.prototype.setPosition = /**
* @return {?}
*/
function () {
/** @type {?} */
var hostPos = this.el.nativeElement.getBoundingClientRect();
/** @type {?} */
var tooltipPos = this.tooltip.getBoundingClientRect();
/** @type {?} */
var scrollPos = window.pageYOffset ||
document.documentElement.scrollTop ||
document.body.scrollTop ||
0;
/** @type {?} */
var top;
/** @type {?} */
var left;
if (this.placement === 'top') {
top = hostPos.top - tooltipPos.height - this.offset;
left = hostPos.left + (hostPos.width - tooltipPos.width) / 2;
}
if (this.placement === 'bottom') {
top = hostPos.bottom + this.offset;
left = hostPos.left + (hostPos.width - tooltipPos.width) / 2;
}
if (this.placement === 'left') {
top = hostPos.top + (hostPos.height - tooltipPos.height) / 2;
left = hostPos.left - tooltipPos.width - this.offset;
}
if (this.placement === 'right') {
top = hostPos.top + (hostPos.height - tooltipPos.height) / 2;
left = hostPos.right + this.offset;
}
this.renderer.setStyle(this.tooltip, 'top', top + scrollPos + "px");
this.renderer.setStyle(this.tooltip, 'left', left + "px");
};
TooltipDirective.decorators = [
{ type: Directive, args: [{
selector: '[tooltip]',
},] }
];
/** @nocollapse */
TooltipDirective.ctorParameters = function () { return [
{ type: ElementRef },
{ type: Renderer2 }
]; };
TooltipDirective.propDecorators = {
tooltipTitle: [{ type: Input, args: ['tooltip',] }],
placement: [{ type: Input }],
delay: [{ type: Input }],
showTooltip: [{ type: Input }],
onMouseEnter: [{ type: HostListener, args: ['mouseenter',] }],
onMouseLeave: [{ type: HostListener, args: ['mouseleave',] }]
};
return TooltipDirective;
}());
if (false) {
/** @type {?} */
TooltipDirective.prototype.tooltipTitle;
/** @type {?} */
TooltipDirective.prototype.placement;
/** @type {?} */
TooltipDirective.prototype.delay;
/** @type {?} */
TooltipDirective.prototype.showTooltip;
/** @type {?} */
TooltipDirective.prototype.tooltip;
/** @type {?} */
TooltipDirective.prototype.offset;
/**
* @type {?}
* @private
*/
TooltipDirective.prototype.el;
/**
* @type {?}
* @private
*/
TooltipDirective.prototype.renderer;
}
/**
* @fileoverview added by tsickle
* Generated from: lib/scheduler.module.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
var SchedulerModule = /** @class */ (function () {
function SchedulerModule() {
}
/**
* @param {?=} libConfig
* @return {?}
*/
SchedulerModule.forRoot = /**
* @param {?=} libConfig
* @return {?}
*/
function (libConfig) {
return {
ngModule: SchedulerModule,
providers: [
{
provide: USER_OPTIONS,
useValue: libConfig,
},
],
};
};
SchedulerModule.decorators = [
{ type: NgModule, args: [{
declarations: [SchedulerComponent, TooltipDirective],
imports: [CommonModule, OverlayModule],
exports: [SchedulerComponent, TooltipDirective],
},] }
];
return SchedulerModule;
}());
/**
* @fileoverview added by tsickle
* Generated from: lib/interfaces/day.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @record
*/
function Day() { }
if (false) {
/** @type {?} */
Day.prototype.month;
/** @type {?} */
Day.prototype.weekDays;
}
/**
* @fileoverview added by tsickle
* Generated from: lib/interfaces/person.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @record
*/
function Person() { }
if (false) {
/** @type {?} */
Person.prototype.id;
/** @type {?} */
Person.prototype.name;
/** @type {?|undefined} */
Person.prototype.departments;
/** @type {?} */
Person.prototype.data;
}
/**
* @fileoverview added by tsickle
* Generated from: lib/interfaces/placement.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @fileoverview added by tsickle
* Generated from: lib/interfaces/project.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @record
*/
function Project() { }
if (false) {
/** @type {?} */
Project.prototype.id;
/** @type {?} */
Project.prototype.name;
/** @type {?} */
Project.prototype.color;
/** @type {?} */
Project.prototype.from;
/** @type {?} */
Project.prototype.to;
/** @type {?|undefined} */
Project.prototype.hours;
/** @type {?|undefined} */
Project.prototype.description;
/** @type {?} */
Project.prototype.includeDays;
/** @type {?} */
Project.prototype.excludeDays;
}
/**
* @fileoverview added by tsickle
* Generated from: lib/interfaces/scheduler.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @record
*/
function LibConfig() { }
if (false) {
/** @type {?|undefined} */
LibConfig.prototype.showTooltip;
/** @type {?|undefined} */
LibConfig.prototype.showToday;
/** @type {?|undefined} */
LibConfig.prototype.monthsInPast;
/** @type {?|undefined} */
LibConfig.prototype.monthsInFuture;
/** @type {?|undefined} */
LibConfig.prototype.skipDays;
}
/**
* @fileoverview added by tsickle
* Generated from: lib/interfaces/showBy.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @fileoverview added by tsickle
* Generated from: lib/interfaces/index.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @fileoverview added by tsickle
* Generated from: public-api.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
/**
* @fileoverview added by tsickle
* Generated from: angular-schedule.ts
* @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc
*/
export { SchedulerComponent, SchedulerModule, SchedulerService, TooltipDirective, USER_OPTIONS };
//# sourceMappingURL=angular-schedule.js.map