@colijnit/sharedcomponents 1.0.25 → 1.0.27

package/projects/sharedcomponents/src/lib/components/circular-gauge/co-circular-gauge.component.ts

@@ -1,139 +0,0 @@
-import { Component, HostBinding, Input, ViewChild, ViewEncapsulation } from "@angular/core";
-import {
-  AxisModel,
-  CircularGaugeComponent,
-} from "@syncfusion/ej2-angular-circulargauge";
-import { AnnotationModel } from "@syncfusion/ej2-circulargauge/src/circular-gauge/axes/axis-model";
-
-enum GaugeColor {
-  Low = '#E0E0E0',
-  Medium = '#F88952',
-  High = '#5FDCB3',
-}
-
-@Component({
-  selector: "co-circular-gauge",
-  template: `
-    <div class="circular-gauge-wrapper">
-      <ejs-circulargauge
-        class="circular-gauge"
-        [width]="'100%'"
-        [axes]="getAxes()">
-      </ejs-circulargauge>
-    </div>
-  `,
-  encapsulation: ViewEncapsulation.None
-})
-export class CoCircularGaugeComponent {
-
-  @ViewChild('circulargauge')
-  public circulargauge: CircularGaugeComponent;
-
-  @Input()
-  public set value(value: number) {
-    this._value = value;
-    this._setColor();
-  }
-
-  public get value(): number {
-    return this._value;
-  }
-
-  public get color(): string {
-    return this._color;
-  }
-
-  @HostBinding("class.co-circular-gauge")
-  public showClass() {
-    return true;
-  }
-
-  private _value: number;
-  private _color: GaugeColor = GaugeColor.Low;
-
-  public majorTicks: Object = {
-    height: 0,
-  };
-
-  public minorTicks: Object = {
-    height: 0
-  };
-
-  public labelStyle: Object = {
-    position: 'Inside', useRangeColor: true,
-    font: {size: '0px', fontFamily: 'inherit'}
-  };
-
-  public lineStyle: Object = {
-    width: 0
-  };
-
-  public ranges: Object[] = [
-    {
-      start: 1, end: 100,
-      radius: '13px',
-      startWidth: 3, endWidth: 3,
-      color: '#E0E0E0',
-      roundedCornerRadius: 0
-    },
-  ];
-
-  public getAxes(): AxisModel[] {
-    return [{
-      minimum: 0,
-      maximum: 100,
-      radius: '15px',
-      startAngle: 1,
-      endAngle: 360,
-      majorTicks: this.majorTicks,
-      minorTicks: this.minorTicks,
-      labelStyle: this.labelStyle,
-      lineStyle: this.lineStyle,
-      ranges: this.ranges,
-      pointers: this.getPointers(),
-      annotations: this.getAnnotations(),
-    }];
-  }
-
-  public getPointers(): Object[] {
-    if (this.value) {
-
-      return [{
-        roundedCornerRadius: 0,
-        value: this.value,
-        type: 'RangeBar',
-        radius: '13px',
-        color: this.color,
-        border: {
-          width: 0
-        },
-        animation: {
-          enable: false
-        },
-        pointerWidth: 3
-      }]
-    }
-  };
-
-  public getAnnotations(): AnnotationModel[] {
-    if (this.value) {
-      return [{
-        content: '<div class="annotation">' +
-          this.value + '%</div>',
-        angle: 90,
-        radius: '50%',
-        zIndex: '10',
-      }];
-    }
-  }
-
-  private _setColor(): void {
-    if (this.value == 0) {
-      this._color = GaugeColor.Low;
-    } else if (this.value >= 0 && this.value < 100) {
-      this._color = GaugeColor.Medium;
-    } else if (this.value == 100) {
-      this._color = GaugeColor.High;
-    }
-  }
-}

package/projects/sharedcomponents/src/lib/components/circular-gauge/co-circular-gauge.module.ts

@@ -1,19 +0,0 @@
-import { NgModule } from "@angular/core";
-import { CommonModule } from "@angular/common";
-import { CircularGaugeModule } from "@syncfusion/ej2-angular-circulargauge";
-import { CoCircularGaugeComponent } from "./co-circular-gauge.component";
-
-@NgModule({
-  imports: [
-    CommonModule,
-    CircularGaugeModule
-  ],
-  declarations: [
-    CoCircularGaugeComponent
-  ],
-  exports: [
-    CoCircularGaugeComponent
-  ]
-})
-export class CoCircularGaugeModule {
-}

package/projects/sharedcomponents/src/lib/components/date-planning/component/agenda/agenda-base-view.component.ts

@@ -1,68 +0,0 @@
-import {Directive, EventEmitter, Inject, Input, LOCALE_ID, Output} from "@angular/core";
-import {LanguageCode} from "../../../../enum/language-code.enum";
-import {AgendaEvent} from "../../../../model/agenda-event.model";
-import {AgendaEventPerDay} from "../../../../model/agenda-event-per-day.model";
-import {DateUtils} from "../../../../utils/date-utils";
-import {IconCacheService} from "../../../../service/icon-cache.service";
-
-@Directive()
-export abstract class AgendaBaseViewComponent {
-
-    @Input()
-    public set selectedDate(value: Date) {
-        this._selectedDate = value;
-        this._dateIsSet();
-    }
-
-    @Input()
-    public set eventsPerDay(value: AgendaEventPerDay[]) {
-        this._eventsPerDay = value;
-        this._eventsAreSet();
-    }
-
-    @Output()
-    public eventChecked: EventEmitter<AgendaEvent> = new EventEmitter<AgendaEvent>();
-
-    public get selectedDate(): Date {
-        return this._selectedDate;
-    }
-
-    public get eventsPerDate(): AgendaEventPerDay[] {
-        return this._eventsPerDay;
-    }
-
-    private _selectedDate: Date;
-    private _eventsPerDay: AgendaEventPerDay[] = [];
-
-    constructor(
-        @Inject(LOCALE_ID) protected readonly locale: LanguageCode,
-        public iconCacheService: IconCacheService
-    ) {
-    }
-
-    //overridable by descendents
-    protected prepareViewData(): void {
-    }
-
-    protected getEventsFromDate(date: Date): AgendaEvent[] {
-        let events: AgendaEvent[] = [];
-        if (this.eventsPerDate) {
-            const len: number = this.eventsPerDate.length;
-            for (let i: number = 0; i < len; i++) {
-                if (DateUtils.DatesEqual(date, this.eventsPerDate[i].date)) {
-                    events = this.eventsPerDate[i].events;
-                    break;
-                }
-            }
-        }
-        return events;
-    }
-
-    private _dateIsSet(): void {
-        this.prepareViewData();
-    }
-
-    private _eventsAreSet(): void {
-        this.prepareViewData();
-    }
-}

package/projects/sharedcomponents/src/lib/components/date-planning/component/agenda/agenda-day-view.component.ts

@@ -1,31 +0,0 @@
-import {Component, ViewEncapsulation} from "@angular/core";
-import {AgendaEvent} from "../../../../model/agenda-event.model";
-import {AgendaBaseViewComponent} from "./agenda-base-view.component";
-
-
-@Component({
-    selector: "agenda-day-view",
-    template: `
-        <div class="view-wrapper">
-            <agenda-hour-view-labels [date]="selectedDate"></agenda-hour-view-labels>
-            <agenda-hour-view [date]="selectedDate">
-                <agenda-events
-                        [halfHourHeight]="40"
-                        [events]="events"
-                        (eventChecked)="eventChecked.emit($event)"
-                ></agenda-events>
-            </agenda-hour-view>
-        </div>
-    `,
-  encapsulation: ViewEncapsulation.None
-})
-export class AgendaDayViewComponent extends AgendaBaseViewComponent {
-
-    public events: AgendaEvent[] = [];
-
-    protected prepareViewData(): void {
-        if (this.eventsPerDate && this.eventsPerDate.length > 0) {
-            this.events = this.eventsPerDate[0].events;
-        }
-    }
-}

package/projects/sharedcomponents/src/lib/components/date-planning/component/agenda/agenda-event.component.ts

@@ -1,67 +0,0 @@
-import {
-  Component,
-  ElementRef,
-  EventEmitter,
-  Input,
-  OnDestroy,
-  OnInit,
-  Output,
-  Renderer2,
-  ViewEncapsulation
-} from "@angular/core";
-import {AgendaEvent} from "../../../../model/agenda-event.model";
-import {NULL_AGENDA_EVENT} from "../../../../model/agenda-null-objects";
-import {Icon} from "../../../../enum/icon.enum";
-
-
-@Component({
-    selector: "agenda-event",
-    template: `
-        <div class="agenda-event-wrapper" [class.checkable]="event.showCheckbox" [class.selected]="event.checked" (click)="checkEvent($event)">
-            <div [textContent]="event.fromToRepresentation" class="event-description"></div>
-            <icon *ngIf="event.showCheckbox" icon="check_round_open" [class.checked]="event.checked"></icon>
-        </div>
-    `,
-  encapsulation: ViewEncapsulation.None
-})
-export class AgendaEventComponent implements OnInit, OnDestroy {
-
-    public readonly icons: typeof Icon = Icon;
-
-    @Input()
-    public event: AgendaEvent = NULL_AGENDA_EVENT;
-
-    @Input()
-    public halfHourHeight: number;
-
-    @Output()
-    public eventChecked: EventEmitter<AgendaEvent> = new EventEmitter<AgendaEvent>();
-
-    constructor(
-        private _elementRef: ElementRef,
-        private _renderer: Renderer2
-    ) {
-    }
-
-    ngOnDestroy(): void {
-        this._elementRef = undefined;
-    }
-
-    ngOnInit(): void {
-        const hourTo: number = this.event.from.getHours();
-        const minutesTo: number = this.event.from.getMinutes();
-        const multiply: number = hourTo + (minutesTo / 60);
-        const top: number = multiply * (this.halfHourHeight * 2);
-        this._renderer.setStyle(this._elementRef.nativeElement, "top", top + "px");
-
-        const hours: number = Math.abs(this.event.to.getTime() - this.event.from.getTime()) / 3600000;
-        const height: number = hours * (this.halfHourHeight * 2) - 1;
-        this._renderer.setStyle(this._elementRef.nativeElement, "height", height + "px");
-    }
-
-    public checkEvent(event: MouseEvent): void {
-        this.event.checked = !this.event.checked;
-        this.eventChecked.emit(this.event);
-    }
-
-}

package/projects/sharedcomponents/src/lib/components/date-planning/component/agenda/agenda-events.component.ts

@@ -1,48 +0,0 @@
-import {Component, EventEmitter, Input, Output, ViewEncapsulation} from "@angular/core";
-import {CalendarView} from "../../../../enum/calendar-view.enum";
-import {AgendaEvent} from "../../../../model/agenda-event.model";
-
-
-@Component({
-    selector: "agenda-events",
-    template: `
-        <ng-container *ngIf="view !== viewTypes.WeekSelectView">
-            <agenda-event
-                    *ngFor="let event of events"
-                    [halfHourHeight]="halfHourHeight"
-                    [event]="event"
-                    (eventChecked)="eventChecked.emit($event)"
-            ></agenda-event>
-        </ng-container>
-        <ng-container *ngIf="view === viewTypes.WeekSelectView">
-            <agenda-select-event
-                    *ngFor="let event of events"
-                    [event]="event"
-                    (eventChecked)="eventChecked.emit($event)"
-            ></agenda-select-event>
-        </ng-container>
-    `,
-  encapsulation: ViewEncapsulation.None
-})
-export class AgendaEventsComponent {
-
-    public readonly viewTypes: typeof CalendarView = CalendarView;
-
-    @Input()
-    public view: CalendarView = CalendarView.WeekView;
-
-    @Input()
-    public type: string = "";
-
-    @Input()
-    public events: AgendaEvent[] = [];
-
-    @Input()
-    public halfHourHeight: number;
-
-    @Output()
-    public readonly eventChecked: EventEmitter<AgendaEvent> = new EventEmitter<AgendaEvent>();
-
-    constructor() {
-    }
-}

package/projects/sharedcomponents/src/lib/components/date-planning/component/agenda/agenda-half-hour-cell.component.ts

@@ -1,81 +0,0 @@
-import {Component, ElementRef, Input, OnDestroy, Renderer2, ViewChild, ViewEncapsulation} from "@angular/core";
-import {DateUtils} from "../../../../utils/date-utils";
-
-
-@Component({
-    selector: "agenda-half-hour-cell",
-    template: `
-        <div id="{{id}}" class="cell-wrapper">
-            <div *ngIf="showLabel" [class.show]="showLabel" class="half-hour-label">
-                <div [textContent]="date | date:'HH:mm'"></div>
-            </div>
-            <div *ngIf="showCurrentTime" id="currentTime" class="current-time" #currentTime></div>
-            <div class="content-wrapper">
-                <ng-content></ng-content>
-            </div>
-        </div>
-    `,
-  encapsulation: ViewEncapsulation.None
-})
-export class AgendaHalfHourCellComponent implements OnDestroy {
-
-    @ViewChild("currentTime")
-    public currentTimeElement: ElementRef;
-
-    @Input()
-    public set date(value: Date) {
-        this._date = value;
-        this._checkDate();
-        this._checkWorkingDayStart();
-    }
-
-    public get date(): Date {
-        return this._date;
-    }
-
-    @Input()
-    public showLabel: boolean = false;
-
-    public showCurrentTime: boolean = false;
-
-    public currentTimeTop: number = 0;
-
-    public id: string;
-
-    private _date: Date;
-    private _id: string;
-
-    constructor(
-        private _renderer: Renderer2
-    ) {
-    }
-
-    ngOnDestroy(): void {
-        this.currentTimeElement = undefined;
-    }
-
-    private _checkDate(): void {
-        const checkDate: Date = new Date();
-        const minutesFrom: number = this.date.getMinutes();
-        const minutesTo: number = minutesFrom + 30;
-
-        if (DateUtils.DatesEqual(this.date, checkDate)) {
-            if (checkDate.getHours() === this.date.getHours() && (checkDate.getMinutes() > minutesFrom && checkDate.getMinutes() < minutesTo)) {
-                this.currentTimeTop = (Math.max(checkDate.getMinutes(), .01) / 60) * 100;
-                this._positionCurrentTime();
-                this.showCurrentTime = true;
-            }
-        }
-    }
-
-    private _checkWorkingDayStart(): void {
-        this.id = (this._date.getHours() === 8 && this._date.getMinutes() === 30) ? "dayStart" : "";
-    }
-
-    private _positionCurrentTime(): void {
-        if (this.currentTimeElement) {
-            this._renderer.setStyle(this.currentTimeElement.nativeElement, "top", this.currentTimeTop + "%");
-            this.currentTimeElement.nativeElement.scrollIntoView();
-        }
-    }
-}