cedar-embeddable-editor 0.9.1 → 0.9.2

package/src/app/modules/shared/components/date-picker/date-picker.component.spec.ts

@@ -1,25 +0,0 @@
-import { ComponentFixture, TestBed} from '@angular/core/testing';
-
-import {DatePickerComponent} from './date-picker.component';
-
-describe('DatePickerComponent', () => {
-  let component: DatePickerComponent;
-  let fixture: ComponentFixture<DatePickerComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      declarations: [DatePickerComponent]
-    })
-      .compileComponents();
-  });
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(DatePickerComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/src/app/modules/shared/components/date-picker/date-picker.component.ts

@@ -1,100 +0,0 @@
-import {Component, EventEmitter, Input, OnInit, Output} from '@angular/core';
-import {FormControl, Validators} from '@angular/forms';
-import {DateAdapter} from '@angular/material/core';
-import {MatDatepicker} from '@angular/material/datepicker';
-
-// Depending on whether rollup is used, moment needs to be imported differently.
-// Since Moment.js doesn't have a default export, we normally need to import using the `* as`
-// syntax. However, rollup creates a synthetic default module and we thus need to import it using
-// the `default as` syntax.
-import * as _moment from 'moment';
-// tslint:disable-next-line:no-duplicate-imports
-import {default as _rollupMoment, Moment} from 'moment';
-import {CustomDateAdapter} from '../../service/date-time/custom-date-adapter';
-import {DateTimeService} from '../../service/date-time/date-time.service';
-
-const moment = _rollupMoment || _moment;
-
-@Component({
-  selector: 'app-date-picker',
-  templateUrl: './date-picker.component.html',
-  styleUrls: ['./date-picker.component.scss'],
-  providers: [
-    // DateTimeService is added as a provider to allow it
-    // to be injected as a new instance per component, rather
-    // than a Singleton instance
-    DateTimeService,
-    CustomDateAdapter, // so we could inject services to 'CustomDateAdapter'
-    {provide: DateAdapter, useClass: CustomDateAdapter} // Parse MatDatePicker format
-  ]
-})
-
-export class DatePickerComponent implements OnInit {
-  static readonly YEAR_FORMAT = 'YYYY';
-  static readonly YEAR_MONTH_FORMAT = 'MM/YYYY';
-  static readonly YEAR_MONTH_DAY_FORMAT = 'MM/DD/YYYY';
-  yearFormat = DatePickerComponent.YEAR_FORMAT;
-  yearMonthFormat = DatePickerComponent.YEAR_MONTH_FORMAT;
-  yearMonthDayFormat = DatePickerComponent.YEAR_MONTH_DAY_FORMAT;
-
-  @Input() dateMonthYear: FormControl;
-  @Input() dateFormat = DatePickerComponent.YEAR_FORMAT;
-  @Input() required: boolean;
-  @Output() dateChangedEvent = new EventEmitter<Moment>();
-
-
-  public constructor(private _dateTimeService: DateTimeService) {
-  }
-
-  public ngOnInit(): void {
-    const validators: any[] = [];
-    this._dateTimeService.format = this.dateFormat;
-    const m = moment();
-
-    switch (this.dateFormat) {
-      case this.yearMonthFormat:
-        m.set('date', 1);
-        break;
-      case this.yearFormat:
-        m.set('date', 1);
-        m.set('month', 0);
-        break;
-    }
-    if (this.required) {
-      validators.push(Validators.required);
-    }
-    this.dateMonthYear = new FormControl(null, validators);
-    this.dateChangedEvent.emit(this.dateMonthYear.value);
-  }
-
-  chosenYearHandler(normalizedYear: Moment, datepicker: MatDatepicker<Moment>): void {
-    if (this.dateMonthYear.value == null){
-      this.dateMonthYear.setValue(moment());
-    }
-    const ctrlValue = this.dateMonthYear.value;
-    ctrlValue.year(normalizedYear.year());
-    this.dateMonthYear.setValue(ctrlValue);
-    if (this.dateFormat === this.yearFormat) {
-      datepicker.close();
-      this.dateChangedEvent.emit(this.dateMonthYear.value);
-    }
-  }
-
-  chosenMonthHandler(normalizedMonth: Moment, datepicker: MatDatepicker<Moment>): void {
-    const ctrlValue = this.dateMonthYear.value;
-    ctrlValue.month(normalizedMonth.month());
-    this.dateMonthYear.setValue(ctrlValue);
-
-    if (this.dateFormat === this.yearMonthFormat) {
-      datepicker.close();
-    }
-    this.dateChangedEvent.emit(this.dateMonthYear.value);
-  }
-
-  chosenDateHandler(event): void {
-    if (event) {
-      this.dateChangedEvent.emit(event.value);
-    }
-  }
-
-}

package/src/app/modules/shared/components/file-uploader/bytes/bytes.pipe.spec.ts

@@ -1,33 +0,0 @@
-import { BytesPipe } from './bytes.pipe';
-
-describe('BytesPipe', () => {
-  const pipe = new BytesPipe();
-
-  it('transforms NAN to -', () => {
-    expect(pipe.transform(NaN)).toBe('-');
-  });
-
-  it('transforms 0 to 0', () => {
-    expect(pipe.transform(0)).toBe('0');
-  });
-
-  it('transforms 1024 to 1.0 KB', () => {
-    expect(pipe.transform(1024)).toBe('1.0 KB');
-  });
-
-  it('transforms 1024*1024 to 1.0 MB', () => {
-    expect(pipe.transform(1024 * 1024)).toBe('1.0 MB');
-  });
-
-  it('transforms 1024*1024*1024 to 1.0 GB', () => {
-    expect(pipe.transform(1024 * 1024 * 1024)).toBe('1.0 GB');
-  });
-
-  it('transforms 1024*1024*1024*1024 to 1.0 TB', () => {
-    expect(pipe.transform(1024 * 1024 * 1024 * 1024)).toBe('1.0 TB');
-  });
-
-  it('transforms 1024*1024*1024*1024*1024 to 1.0 PB', () => {
-    expect(pipe.transform(1024 * 1024 * 1024 * 1024 * 1024)).toBe('1.0 PB');
-  });
-});

package/src/app/modules/shared/components/file-uploader/bytes/bytes.pipe.ts

@@ -1,16 +0,0 @@
-import {Pipe, PipeTransform} from '@angular/core';
-
-@Pipe({name: 'bytes'})
-export class BytesPipe implements PipeTransform {
-  public transform(bytes: number): string {
-    if (isNaN(parseFloat('' + bytes)) || !isFinite(bytes)) {
-      return '-';
-    }
-    if (bytes <= 0) {
-      return '0';
-    }
-    const units = ['bytes', 'KB', 'MB', 'GB', 'TB', 'PB'];
-    const num = Math.floor(Math.log(bytes) / Math.log(1024));
-    return (bytes / Math.pow(1024, Math.floor(num))).toFixed(1) + ' ' + units[num];
-  }
-}

package/src/app/modules/shared/components/file-uploader/file-upload-input-for/file-upload-input-for.directive.spec.ts

@@ -1,54 +0,0 @@
-import { TestBed } from '@angular/core/testing';
-
-import { BehaviorSubject } from 'rxjs';
-import { IInput } from '../mat-file-upload.type';
-import { CommonModule } from '@angular/common';
-
-import { FileUploadInputForDirective } from './file-upload-input-for.directive';
-import { Component } from '@angular/core';
-@Component({
-  template: ` <div
-    [fileUploadInputFor]="fileUploadQueue"
-    class="upload-drop-zone"
-  >
-    Just drag and drop files here
-  </div>`,
-})
-class FileDropComponent {}
-export class StubMatFileUploadQueueService {
-  inputValueSubject = new BehaviorSubject<IInput>(null);
-  inputValue$ = this.inputValueSubject.asObservable();
-
-  initialize(input: IInput): void {
-    this.inputValueSubject.next(input);
-  }
-
-  getInputValue(): IInput {
-    return this.inputValueSubject.getValue();
-  }
-}
-
-export class StubFile {
-  name = 'testName';
-  size = 1024;
-}
-
-describe('FileUploadInputForDirective', () => {
-  let component: FileDropComponent;
-  let fixture;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      imports: [CommonModule],
-      declarations: [FileUploadInputForDirective, FileDropComponent],
-    }).compileComponents();
-    fixture = TestBed.createComponent(FileDropComponent);
-    component = fixture.componentInstance;
-  });
-
-  describe('', () => {
-    it('should create', () => {
-      expect(component).toBeTruthy();
-    });
-  });
-});

package/src/app/modules/shared/components/file-uploader/file-upload-input-for/file-upload-input-for.directive.ts

@@ -1,67 +0,0 @@
-import {Directive, ElementRef, EventEmitter, HostBinding, HostListener, Input, Output} from '@angular/core';
-
-/**
- * A material design file upload queue component.
- */
-@Directive({
-  selector: 'input[fileUploadInputFor], div[fileUploadInputFor], mat-card[fileUploadInputFor]',
-})
-export class FileUploadInputForDirective {
-
-  private _queue: any = null;
-  private _element: HTMLElement;
-  @Output() public onFileSelected: EventEmitter<File[]> = new EventEmitter<File[]>();
-  @HostBinding('class.fileover') fileOver: boolean;
-
-
-  constructor(private element: ElementRef) {
-    this._element = this.element.nativeElement;
-  }
-
-  @Input('fileUploadInputFor')
-  set fileUploadQueue(value: any) {
-    if (value) {
-      this._queue = value;
-    }
-  }
-
-  @HostListener('change')
-  public onChange(): any {
-    const files = this.element.nativeElement.files;
-    this.onFileSelected.emit(files);
-
-    for (let i = 0; i < files.length; i++) {
-      this._queue.add(files[i]);
-    }
-    this.element.nativeElement.value = '';
-  }
-
-  @HostListener('drop', ['$event'])
-  public onDrop(event: any): any {
-    const files = event.dataTransfer.files;
-    this.onFileSelected.emit(files);
-
-    for (let i = 0; i < files.length; i++) {
-      this._queue.add(files[i]);
-    }
-    event.preventDefault();
-    event.stopPropagation();
-    this.element.nativeElement.value = '';
-    this.fileOver = false;
-  }
-
-  @HostListener('dragover', ['$event'])
-  public onDropOver(event: any): any {
-    event.preventDefault();
-    event.stopPropagation();
-    this.fileOver = true;
-  }
-
-  @HostListener('dragleave', ['$event'])
-  public onDragLeave(event): void {
-    event.preventDefault();
-    event.stopPropagation();
-    this.fileOver = false;
-  }
-
-}

package/src/app/modules/shared/components/file-uploader/file-uploader.component.html

@@ -1,26 +0,0 @@
-<input type="file" #singleFile id="singleFile"
-       [fileUploadInputFor]="fileUploadQueue"
-       [multiple]="false" [accept]="'.json'" style="display: none;"/>
-<div *ngIf="showSuccess" class="notify-success template-card status-box">{{successMessage}}
-  <button type="button" class="close" (click)="clearSuccess()">
-    <span aria-hidden="true">&times;</span>
-  </button>
-</div>
-<div *ngIf="showError" class="notify-error template-card status-box">{{errorMessage}}
-  <button type="button" class="close" (click)="clearError()">
-    <span aria-hidden="true">&times;</span>
-  </button>
-</div>
-<mat-card class="template-card container" [fileUploadInputFor]="fileUploadQueue" appDnd>
-  <h3><img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAABmJLR0QA/wD/AP+gvaeTAAABoElEQVRoge2YPU7DQBCFP/HT01DFEQ1Q01NxAw7BMSgoKZE4RWSlInABEnMELkCJJWJKpJjCtmSCDbvr2fXfPmnkaLUzb15mNLs2eHh4jBpLIK2wVWlPZGG9bEudhHdq1s9r1lPLv1Vy0ELxr7QFbf66ivQOgxGyV7P+AmxcJtIxfg9riPg563vL78dvW/BTy8MxVKdGAIRAQvUNVtISYA6c6AhRmRoBEDsQsG0xMJEUEuZ7HnQCN8AEWOScM1WniP9fbIp2ciGiwDTn/JAM2tahWck7mAOxTkjbdy0xqLTN6Fvr1iWZytQyrUgK3Bj4NeUVD1j4mVamc0JMxWjxqkwtCSEmbabFa3NqVd2fdCrTaSE6YjonZAO8ApfAGXAgmNuvzdu2qtijixR4Aq6AL+DIwF+Z95lqIeWzxVTIPbAL7ANvwJ2mf2fGbxnXwCfqbSXFKx7wELhogdduwCa8g38f6R2aCEnyZyCRiCKm+XMtGXRO1qsL3IgJgMecM5QMfAq8Y+fb1V8WA8eSQiD7FDQjK7VtAWuySoiL8PAYA74BrJ0x93i8VhIAAAAASUVORK5CYII=" style="vertical-align: middle"/>&nbsp;&nbsp; {{'Uploader.DragAndDrop' | translate}} &nbsp;&nbsp;<label for="singleFile" class="mat-focus-indicator mat-raised-button mat-button-base mat-primary">{{'Uploader.Browse' | translate}}</label></h3>
-</mat-card>
-<mat-file-upload-queue #fileUploadQueue [fileAlias]="fileAlias" [httpUrl]="httpUrl">
-  <mat-file-upload [file]="file" [id]="i" *ngFor="let file of fileUploadQueue.files; let i = index"
-                   (onUpload)="onFileUploaded($event)"
-  ></mat-file-upload>
-</mat-file-upload-queue>
-
-
-
-
-

package/src/app/modules/shared/components/file-uploader/file-uploader.component.scss

@@ -1,55 +0,0 @@
-.container {
-  width: 100%;
-  text-align: center;
-  border: dashed 1px #979797;
-  position: relative;
-  margin: 0 auto;
-  cursor: copy;
-
-  input {
-    opacity: 0;
-    position: absolute;
-    z-index: 2;
-    width: 100%;
-    height: 100%;
-    top: 0;
-    left: 0;
-  }
-
-  h3 {
-    font-size: 20px;
-    font-weight: 600;
-    color: #38424c;
-    margin: 0;
-  }
-}
-
-.fileover {
-  animation: shake 1s;
-  animation-iteration-count: infinite;
-  background-color: #ffffff;
-}
-
-/* Shake animation */
-@keyframes shake {
-  10%, 50%, 90% {
-    transform: translateY(-1px);
-  }
-
-  20%, 80% {
-    transform: translateY(0px);
-  }
-
-  30%,  70% {
-    transform: translateY(1px);
-  }
-
-  40%, 60% {
-    transform: translateY(0px);
-  }
-}
-
-.status-box {
-  max-width: 90%;
-  margin: 0 auto;
-}

package/src/app/modules/shared/components/file-uploader/file-uploader.component.spec.ts

@@ -1,25 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { FileUploaderComponent } from './file-uploader.component';
-
-describe('FileUploaderComponent', () => {
-  let component: FileUploaderComponent;
-  let fixture: ComponentFixture<FileUploaderComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      declarations: [ FileUploaderComponent ]
-    })
-    .compileComponents();
-  });
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(FileUploaderComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/src/app/modules/shared/components/file-uploader/file-uploader.component.ts

@@ -1,67 +0,0 @@
-import {Component, EventEmitter, Input, OnInit, Output, ViewEncapsulation} from '@angular/core';
-import {HttpErrorResponse, HttpResponse} from '@angular/common/http';
-import {TranslateService} from '@ngx-translate/core';
-
-
-@Component({
-    selector: 'app-file-uploader',
-    templateUrl: './file-uploader.component.html',
-    styleUrls: ['./file-uploader.component.scss'],
-    encapsulation: ViewEncapsulation.None
-})
-export class FileUploaderComponent implements OnInit {
-
-    // Number of milliseconds to display the file upload success message
-    private static readonly SUCCESS_MESSAGE_TIMEOUT = 5000;
-
-    @Input() fileAlias: string;
-    @Input() httpUrl: string;
-    @Output() fileUploaded = new EventEmitter<object>();
-    showSuccess = false;
-    showError = false;
-    successMessage = '';
-    errorMessage = '';
-
-    protected translateService: TranslateService;
-
-    constructor(translateService: TranslateService) {
-        this.translateService = translateService;
-    }
-
-    ngOnInit(): void {
-    }
-
-    onFileUploaded(event): void {
-        if (event && event.event instanceof HttpResponse) {
-            this.clearError();
-            const fileName = event.file.name;
-            this.successMessage = this.translateService.instant('Uploader.Success', {fileName});
-            this.showSuccess = true;
-            setTimeout(() => {
-                this.clearSuccess();
-            }, FileUploaderComponent.SUCCESS_MESSAGE_TIMEOUT);
-        } else if (typeof event === 'object' && event.event instanceof HttpErrorResponse) {
-            this.clearSuccess();
-            const fileName = event.file.name;
-            let responseMessage = '';
-            const response = event.event;
-            if (response.message && response.message.length > 0) {
-                responseMessage = response.message;
-            }
-            this.errorMessage = this.translateService.instant('Uploader.Error', {fileName, responseMessage});
-            this.showError = true;
-        }
-        this.fileUploaded.emit(event);
-    }
-
-    clearSuccess(): void {
-        this.showSuccess = false;
-        this.successMessage = '';
-    }
-
-    clearError(): void {
-        this.showError = false;
-        this.errorMessage = '';
-    }
-
-}

package/src/app/modules/shared/components/file-uploader/mat-file-upload/mat-file-upload.component.html

@@ -1,42 +0,0 @@
-<ng-container *ngIf="uploadProgress$ | async as uploadProgress">
-  <mat-card class="template-card upload-progress-card">
-    <div class="flex-container-file-upload">
-      <div class="flex-child1">
-        <div class="file-icon">
-          <svg id="fileIcon" xmlns="http://www.w3.org/2000/svg" x="0px" y="0px" viewBox="0 0 58 58"
-               style="enable-background:new 0 0 58 58;" xml:space="preserve">
-            <polygon style="fill:#EDEADA;" points="51.5,14 37.5,0 6.5,0 6.5,58 51.5,58 " />
-            <g>
-              <path style="fill:#CEC9AE;" d="M16.5,23h25c0.552,0,1-0.447,1-1s-0.448-1-1-1h-25c-0.552,0-1,0.447-1,1S15.948,23,16.5,23z" />
-              <path style="fill:#CEC9AE;" d="M16.5,15h10c0.552,0,1-0.447,1-1s-0.448-1-1-1h-10c-0.552,0-1,0.447-1,1S15.948,15,16.5,15z" />
-              <path style="fill:#CEC9AE;" d="M41.5,29h-25c-0.552,0-1,0.447-1,1s0.448,1,1,1h25c0.552,0,1-0.447,1-1S42.052,29,41.5,29z" />
-              <path style="fill:#CEC9AE;" d="M41.5,37h-25c-0.552,0-1,0.447-1,1s0.448,1,1,1h25c0.552,0,1-0.447,1-1S42.052,37,41.5,37z" />
-              <path style="fill:#CEC9AE;" d="M41.5,45h-25c-0.552,0-1,0.447-1,1s0.448,1,1,1h25c0.552,0,1-0.447,1-1S42.052,45,41.5,45z" />
-            </g>
-            <polygon style="fill:#CEC9AE;" points="37.5,0 37.5,14 51.5,14 " />
-          </svg>
-        </div>
-      </div>
-      <div class="flex-child2">
-        <span class="file-summary">{{file.name}} ({{file.size | bytes}})</span>
-        <span class="upload-progress">
-          <mat-progress-bar
-            [value]="uploadProgress.progressPercentage"
-          ></mat-progress-bar>
-          <button style="margin-left: 15px;"
-            mat-icon-button
-            [attr.aria-label]="fileUploadAriaLabel"
-            (click)="upload()"
-            [disabled]="uploadInProgress$ | async"
-          ><mat-icon>upload_file</mat-icon></button>
-          <button
-            mat-icon-button
-            [attr.aria-label]="cancelAriaLabel"
-            (click)="remove()"
-          ><mat-icon>close</mat-icon></button>
-        </span>
-        <span class="file-summary">{{uploadProgress.progressPercentage}}% ({{uploadProgress.loaded | bytes}} of {{uploadProgress.total | bytes}})</span>
-      </div>
-    </div>
-  </mat-card>
-</ng-container>

package/src/app/modules/shared/components/file-uploader/mat-file-upload/mat-file-upload.component.scss

@@ -1,31 +0,0 @@
-.file-summary {
-  font-size: 0.85rem;
-}
-
-.upload-progress {
-  display: flex;
-  align-content: center;
-  align-items: center;
-  height: 10px;
-
-  ::ng-deep .mat-progress-bar .mat-progress-bar-element {
-    transition: none;
-  }
-}
-
-.flex-container-file-upload {
-  display: flex;
-
-  .flex-child1 {
-    width: 50px;
-    margin-right: 15px;
-  }
-
-  .flex-child2 {
-    flex: 1 100%;
-  }
-}
-
-.upload-progress-card {
-  margin-bottom: 5px;
-}