UNPKG

@schoolbelle/common

Version:

1,300 lines (1,276 loc) 121 kB
import { BsModalRef, BsModalService, ModalModule } from 'ngx-bootstrap/modal'; import { trigger, style, transition, animate } from '@angular/animations'; import { Router, NavigationError } from '@angular/router'; import { BsDropdownModule } from 'ngx-bootstrap/dropdown'; import { CommonModule } from '@angular/common'; import { getSelectionRange, isIE, setSelectionRange } from '@schoolbelle/common/functions'; import { FormControl, FormsModule, ReactiveFormsModule, NG_VALUE_ACCESSOR, FormGroup, NG_VALIDATORS } from '@angular/forms'; import { parse, format, parseNumber, formatNumber, AsYouType, getCountryCallingCode, isValidNumber } from 'libphonenumber-js'; import { Component, Input, EventEmitter, Injectable, NgModule, ApplicationRef, ViewEncapsulation, Injector, ComponentFactoryResolver, NgZone, ChangeDetectionStrategy, InjectionToken, LOCALE_ID, forwardRef, ChangeDetectorRef, Output, Inject, Directive, Attribute, HostListener, ElementRef, Renderer2, Pipe, defineInjectable, inject } from '@angular/core'; import { debounceTime, filter, take, tap, switchMap, distinctUntilChanged, map, takeWhile, startWith } from 'rxjs/operators'; import { fromEvent, merge, Subscription, of, Subject } from 'rxjs'; import { find, orderBy, forEach, isArray, isPlainObject, get as get$1, set as set$1, unset, isEqual, cloneDeep, isEmpty, values, defaults as defaults$1 } from 'lodash-es'; import { times, defaults, get, set } from 'lodash'; /** * @fileoverview added by tsickle * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ class DialogAbstractComponent { /** * @param {?} modalRef */ constructor(modalRef) { this.modalRef = modalRef; this.subscription = new Subscription(); this.action = new EventEmitter(); } /** * @return {?} */ ngOnInit() { this.subscription.add(merge(fromEvent(document, 'keydown'), fromEvent(document, 'keypress')) .pipe(debounceTime(0), filter((/** * @param {?} e * @return {?} */ (e) => { return e.which === 13; }))) .subscribe((/** * @param {?} e * @return {?} */ (e) => { this.enter(); }))); } /** * @return {?} */ ngOnDestroy() { this.subscription.unsubscribe(); } /** * @return {?} */ enter() { } /** * @param {?=} result * @return {?} */ ok(result = true) { this.modalRef.hide(); this.action.emit(result); } /** * @return {?} */ cancel() { this.modalRef.hide(); this.action.emit(false); } } DialogAbstractComponent.decorators = [ { type: Component, args: [{ template: '' }] } ]; /** @nocollapse */ DialogAbstractComponent.ctorParameters = () => [ { type: BsModalRef } ]; DialogAbstractComponent.propDecorators = { title: [{ type: Input }], message: [{ type: Input }] }; /** * @fileoverview added by tsickle * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ class DialogConfirmComponent extends DialogAbstractComponent { constructor() { super(...arguments); this.showNeverShowItAgainCheckbox = false; this.neverShowItAgain = false; } /** * @return {?} */ enter() { this.ok(); } } DialogConfirmComponent.decorators = [ { type: Component, args: [{ selector: 'dialog-confirm', template: "<div *ngIf=\"title\" class=\"modal-header d-block\" [innerHTML]=\"title\"></div>\n<div *ngIf=\"message\" class=\"modal-body\" [innerHTML]=\"message\"></div>\n<div class=\"modal-footer justify-content-start border-top-0\">\n <label *ngIf=\"showNeverShowItAgainCheckbox\" class=\"custom-control custom-checkbox\">\n <input type=\"checkbox\" class=\"custom-control-input\" [(ngModel)]=\"neverShowItAgain\">\n <p class=\"custom-control-label\" i18n>See no more.</p>\n </label> \n <button type=\"button\" class=\"btn btn-outline-secondary ml-auto\" (click)=\"modalRef.hide(); action.emit(false)\" i18n>No</button>\n <button type=\"button\" class=\"btn btn-primary\" (click)=\"modalRef.hide(); action.emit(true)\" i18n>Yes</button>\n</div>\n" }] } ]; /** * @fileoverview added by tsickle * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ class DialogAlertComponent extends DialogAbstractComponent { constructor() { super(...arguments); this.showNeverShowItAgainCheckbox = false; this.neverShowItAgain = false; } /** * @return {?} */ enter() { this.ok(); } } DialogAlertComponent.decorators = [ { type: Component, args: [{ selector: 'dialog-alert', template: "<div *ngIf=\"title\" class=\"modal-header\" [innerHTML]=\"title\"></div>\n<div *ngIf=\"message\" class=\"modal-body\" [innerHTML]=\"message\"></div>\n<div class=\"modal-footer justify-content-start border-top-0\">\n <label *ngIf=\"showNeverShowItAgainCheckbox\" class=\"custom-control custom-checkbox\">\n <input type=\"checkbox\" class=\"custom-control-input\" [(ngModel)]=\"neverShowItAgain\">\n <p class=\"custom-control-label\" i18n>See no more.</p>\n </label> \n <button type=\"button\" class=\"btn btn-secondary ml-auto\" (click)=\"modalRef.hide(); action.emit(true)\" i18n>Ok</button>\n</div>\n\n" }] } ]; /** * @fileoverview added by tsickle * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ class DialogSelectComponent extends DialogAbstractComponent { constructor() { super(...arguments); this.selections = []; } /** * @param {?} i * @return {?} */ select(i) { this.modalRef.hide(); this.action.emit(i); } } DialogSelectComponent.decorators = [ { type: Component, args: [{ selector: 'dialog-select', template: "<div *ngIf=\"title\" class=\"modal-header\" [innerHTML]=\"title\"></div>\n<div class=\"modal-body\">\n <button class=\"btn btn-block btn-secondary\" *ngFor=\"let selection of selections; let i = index;\" (click)=\"select(i)\" [innerHTML]=\"selection.html || selection\" [ngClass]=\"selection.class || ''\"></button>\n <button type=\"button\" class=\"btn btn-block btn-outline-secondary\" (click)=\"cancel()\" i18n>Cancel</button>\n</div>\n" }] } ]; DialogSelectComponent.propDecorators = { selections: [{ type: Input }] }; /** * @fileoverview added by tsickle * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ class DialogPromptComponent extends DialogAbstractComponent { constructor() { super(...arguments); this.validators = []; } /** * @return {?} */ ngOnInit() { super.ngOnInit(); this.input = new FormControl('', this.validators); } /** * @return {?} */ enter() { if (!this.input.invalid) this.ok(this.input.value); } } DialogPromptComponent.decorators = [ { type: Component, args: [{ selector: 'dialog-prompt', template: "<div *ngIf=\"title\" class=\"modal-header\" [innerHTML]=\"title\"></div>\n<div *ngIf=\"message\" class=\"modal-body\">\n <p [innerHTML]=\"message\"></p>\n <div class=\"px-3\">\n <input class=\"form-control text-center\" \n [ngClass]=\"{'is-invalid':input.dirty && input.invalid}\"\n [formControl]=\"input\" [type]=\"type\" placeholder=\"\" autofocus (keyup.enter)=\"ok(input.value)\">\n </div>\n</div>\n<div class=\"modal-footer justify-content-start border-top-0\">\n <button type=\"button\" class=\"btn btn-outline-secondary ml-auto\" (click)=\"cancel()\" i18n>Cancel</button>\n <button type=\"button\" class=\"btn btn-primary\" \n [ngClass]=\"{\n 'btn-primary':!input.invalid,\n 'btn-secondary':input.invalid\n }\"\n [disabled]=\"input.invalid\" \n (click)=\"ok(input.value)\" i18n>Ok</button>\n</div>\n" }] } ]; DialogPromptComponent.propDecorators = { type: [{ type: Input }] }; /** * @fileoverview added by tsickle * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ class DialogService { /** * @param {?} modalService */ constructor(modalService) { this.modalService = modalService; this.neverShowItAgainList = []; } /** * @param {?=} title * @param {?=} message * @param {?=} showNeverShowItAgainCheckbox * @param {?=} options * @return {?} */ confirm(title = '', message = '', showNeverShowItAgainCheckbox = false, options = {}) { return of(null).pipe(switchMap((/** * @return {?} */ () => { /** @type {?} */ const dialogKey = `${title}|${message}`; if (this.neverShowItAgainList.includes(dialogKey)) return of(true); /** @type {?} */ const modalRef = this.modalService.show(DialogConfirmComponent, Object.assign({}, options, { backdrop: 'static', initialState: { title, message, showNeverShowItAgainCheckbox } })); return (/** @type {?} */ (modalRef.content.action.pipe(take(1), tap((/** * @return {?} */ () => { if (modalRef.content.neverShowItAgain === true) this.neverShowItAgainList.push(dialogKey); }))))); }))); } /** * @param {?=} title * @param {?=} message * @param {?=} showNeverShowItAgainCheckbox * @param {?=} options * @return {?} */ alert(title = '', message = '', showNeverShowItAgainCheckbox = false, options = {}) { return of(null).pipe(switchMap((/** * @return {?} */ () => { /** @type {?} */ const dialogKey = `${title}|${message}`; if (this.neverShowItAgainList.includes(dialogKey)) return of(true); /** @type {?} */ const modalRef = this.modalService.show(DialogAlertComponent, Object.assign({}, options, { backdrop: 'static', initialState: { title, message, showNeverShowItAgainCheckbox } })); return modalRef.content.action.pipe(take(1), tap((/** * @return {?} */ () => { if (modalRef.content.neverShowItAgain === true) this.neverShowItAgainList.push(dialogKey); }))); }))); } /** * @param {?=} title * @param {?=} selections * @param {?=} options * @return {?} */ select(title = '', selections, options = {}) { return of(null).pipe(switchMap((/** * @return {?} */ () => { /** @type {?} */ const modalRef = this.modalService.show(DialogSelectComponent, Object.assign({}, options, { backdrop: 'static', initialState: { title, selections } })); return modalRef.content.action.pipe(take(1)); }))); } /** * @param {?=} title * @param {?=} message * @param {?=} type * @param {?=} validators * @param {?=} options * @return {?} */ prompt(title = '', message = '', type, validators = [], options = {}) { return of(null).pipe(switchMap((/** * @return {?} */ () => { /** @type {?} */ const modalRef = this.modalService.show(DialogPromptComponent, Object.assign({}, options, { backdrop: 'static', initialState: { title, message, type, validators } })); return (/** @type {?} */ (modalRef.content.action.pipe(take(1)))); }))); } } DialogService.decorators = [ { type: Injectable } ]; /** @nocollapse */ DialogService.ctorParameters = () => [ { type: BsModalService } ]; /** * @fileoverview added by tsickle * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ class DialogModule { /** * @return {?} */ static forRoot() { return { ngModule: DialogModule, providers: [ DialogService, ...ModalModule.forRoot().providers, ] }; } } DialogModule.decorators = [ { type: NgModule, args: [{ imports: [ CommonModule, ModalModule.forRoot(), FormsModule, ReactiveFormsModule, ], entryComponents: [ DialogConfirmComponent, DialogAlertComponent, DialogSelectComponent, DialogPromptComponent, ], declarations: [ DialogAbstractComponent, DialogConfirmComponent, DialogAlertComponent, DialogSelectComponent, DialogPromptComponent, ], },] } ]; /** * @fileoverview added by tsickle * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ /** * @fileoverview added by tsickle * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ class PromiseTrackerService { /** * @param {?} appRef */ constructor(appRef) { this.appRef = appRef; this.promiseList = []; this.delayJustFinished = false; } /** * @param {?} options * @return {?} */ reset(options) { this.minDuration = options.minDuration; this.promiseList = []; options.promiseList.forEach((/** * @param {?} promise * @return {?} */ promise => { if (!promise || promise['busyFulfilled']) { return; } this.addPromise(promise, options.onActivateTick); })); if (this.promiseList.length === 0) { return; } this.delayJustFinished = false; if (options.delay) { this.delayPromise = setTimeout((/** * @return {?} */ () => { this.delayPromise = null; this.delayJustFinished = true; }), options.delay); } if (options.minDuration) { this.durationPromise = setTimeout((/** * @return {?} */ () => { this.durationPromise = null; }), options.minDuration + (options.delay || 0)); } } /** * @private * @param {?} promise * @param {?} onActivateTick * @return {?} */ addPromise(promise, onActivateTick) { if (this.promiseList.indexOf(promise) !== -1) { return; } this.promiseList.push(promise); if (promise instanceof Promise) { promise.then.call(promise, (/** * @return {?} */ () => this.finishPromise(promise, onActivateTick)), (/** * @return {?} */ () => this.finishPromise(promise, onActivateTick))); } else if (promise instanceof Subscription) { promise.add((/** * @return {?} */ () => this.finishPromise(promise, onActivateTick))); } } /** * @private * @param {?} promise * @param {?} onActivateTick * @return {?} */ finishPromise(promise, onActivateTick) { promise['busyFulfilled'] = true; /** @type {?} */ const index = this.promiseList.indexOf(promise); if (index === -1) { return; } this.promiseList.splice(index, 1); if (onActivateTick === true) this.appRef.tick(); } /** * @return {?} */ isActive() { if (this.delayPromise) { return false; } if (!this.delayJustFinished) { if (this.durationPromise) { return true; } return this.promiseList.length > 0; } this.delayJustFinished = false; if (this.promiseList.length === 0) { this.durationPromise = null; } return this.promiseList.length > 0; } } PromiseTrackerService.decorators = [ { type: Injectable } ]; /** @nocollapse */ PromiseTrackerService.ctorParameters = () => [ { type: ApplicationRef } ]; /** * @fileoverview added by tsickle * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ /** @type {?} */ const inactiveStyle = style({ opacity: 0 }); /** @type {?} */ const timing = '.3s ease'; class LoadingBackdropComponent { /** * @param {?} tracker */ constructor(tracker) { this.tracker = tracker; } /** * @return {?} */ isActive() { return this.tracker.isActive(); } } LoadingBackdropComponent.decorators = [ { type: Component, args: [{ selector: 'div[bs-loading-backdrop]', template: ` <div class="ng-busy-backdrop" @fadeInOut *ngIf="isActive()"> </div> `, animations: [ trigger('fadeInOut', [ transition('void => *', [inactiveStyle, animate(timing)]), transition('* => void', [animate(timing, inactiveStyle)]) ]) ] }] } ]; /** @nocollapse */ LoadingBackdropComponent.ctorParameters = () => [ { type: PromiseTrackerService } ]; /** * @fileoverview added by tsickle * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ /** @type {?} */ const inactiveStyle$1 = style({ opacity: 0, transform: 'translateY(-40px)' }); /** @type {?} */ const timing$1 = '.3s ease'; class LoadingComponent { /** * @param {?} tracker */ constructor(tracker) { this.tracker = tracker; } /** * @return {?} */ ngDoCheck() { if (this.message === this.lastMessage) { return; } this.lastMessage = this.message; } /** * @return {?} */ isActive() { return this.tracker.isActive(); } } LoadingComponent.decorators = [ { type: Component, args: [{ selector: 'div[bs-loading]', template: "\n\n\n<div [class]=\"wrapperClass\" *ngIf=\"isActive()\" @flyInOut>\n <div class=\"ng-busy-default-wrapper\">\n <div class=\"ng-busy-default-sign\">\n <!-- <div class=\"ng-busy-default-spinner\">\n <div class=\"bar1\"></div>\n <div class=\"bar2\"></div>\n <div class=\"bar3\"></div>\n <div class=\"bar4\"></div>\n <div class=\"bar5\"></div>\n <div class=\"bar6\"></div>\n <div class=\"bar7\"></div>\n <div class=\"bar8\"></div>\n <div class=\"bar9\"></div>\n <div class=\"bar10\"></div>\n <div class=\"bar11\"></div>\n <div class=\"bar12\"></div>\n </div> -->\n <div style=\"display: flex;align-items: center;\">\n <div class=\"lds-css ng-scope\"><div style=\"width:100%;height:100%\" class=\"lds-bars\"><div></div><div></div><div></div><div></div></div><style type=\"text/css\">@keyframes lds-bars {\n 0% {\n opacity: 1;\n }\n 50% {\n opacity: 0.5;\n }\n 100% {\n opacity: 1;\n }\n }\n @-webkit-keyframes lds-bars {\n 0% {\n opacity: 1;\n }\n 50% {\n opacity: 0.5;\n }\n 100% {\n opacity: 1;\n }\n }\n .lds-bars {\n position: relative;\n }\n .lds-bars div {\n position: absolute;\n width: 30px;\n height: 80px;\n top: 60px;\n -webkit-animation: lds-bars 0.8s cubic-bezier(0.5, 0, 0.5, 1) infinite;\n animation: lds-bars 0.8s cubic-bezier(0.5, 0, 0.5, 1) infinite;\n }\n .lds-bars div:nth-child(1) {\n left: 25px;\n background: #ff5a29;\n -webkit-animation-delay: -0.48s;\n animation-delay: -0.48s;\n }\n .lds-bars div:nth-child(2) {\n left: 65px;\n background: #ffd000;\n -webkit-animation-delay: -0.32s;\n animation-delay: -0.32s;\n }\n .lds-bars div:nth-child(3) {\n left: 105px;\n background: #68c578;\n -webkit-animation-delay: -0.16s;\n animation-delay: -0.16s;\n }\n .lds-bars div:nth-child(4) {\n left: 145px;\n background: #1fb9ec;\n }\n .lds-bars {\n width: 50px !important;\n height: 50px !important;\n -webkit-transform: translate(-25px, -25px) scale(0.25) translate(25px, 25px);\n transform: translate(-25px, -25px) scale(0.25) translate(25px, 25px);\n }\n </style></div>\n\n\n\n <div class=\"ng-busy-default-text\">{{message}}</div>\n </div>\n </div>\n </div>\n</div>\n", animations: [ trigger('flyInOut', [ transition('void => *', [inactiveStyle$1, animate(timing$1)]), transition('* => void', [animate(timing$1, inactiveStyle$1)]) ]) ], encapsulation: ViewEncapsulation.None, styles: [".ng-busy,.ng-busy>*,.ng-busy>ng-component>*{position:absolute;top:0;left:0;right:0;bottom:0}.ng-busy-backdrop{position:fixed;top:0;left:0;right:0;bottom:0;background:#fff;opacity:.7}.ng-busy-default-wrapper{text-align:center}.ng-busy-default-sign{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);display:inline-block;z-index:1;padding:12px 14px;border:none;border-top:0;border-radius:0 0 4px 4px;box-shadow:0 0 0 rgba(255,255,255,.1);background:0 0;color:#333;width:-webkit-max-content;width:-moz-max-content;width:max-content}.ng-busy-default-text{display:inline-block;margin-left:6px;max-width:400px;font-size:14px;text-align:left}.ng-busy-default-spinner{position:relative;display:inline-block;width:25px;height:25px;vertical-align:middle}.ng-busy-default-spinner div{position:absolute;left:44.5%;top:37%;width:10%;height:26%;background:#666;border-radius:50px;box-shadow:0 0 3px rgba(0,0,0,.2);opacity:0;-webkit-animation:1s linear infinite busy-spinner-anim;animation:1s linear infinite busy-spinner-anim}.ng-busy-default-spinner .bar1{transform:rotate(0) translate(0,-142%);-webkit-animation-delay:-1s;animation-delay:-1s}.ng-busy-default-spinner .bar2{transform:rotate(30deg) translate(0,-142%);-webkit-animation-delay:-.91666667s;animation-delay:-.91666667s}.ng-busy-default-spinner .bar3{transform:rotate(60deg) translate(0,-142%);-webkit-animation-delay:-.83333333s;animation-delay:-.83333333s}.ng-busy-default-spinner .bar4{transform:rotate(90deg) translate(0,-142%);-webkit-animation-delay:-.75s;animation-delay:-.75s}.ng-busy-default-spinner .bar5{transform:rotate(120deg) translate(0,-142%);-webkit-animation-delay:-.66666667s;animation-delay:-.66666667s}.ng-busy-default-spinner .bar6{transform:rotate(150deg) translate(0,-142%);-webkit-animation-delay:-.58333333s;animation-delay:-.58333333s}.ng-busy-default-spinner .bar7{transform:rotate(180deg) translate(0,-142%);-webkit-animation-delay:-.5s;animation-delay:-.5s}.ng-busy-default-spinner .bar8{transform:rotate(210deg) translate(0,-142%);-webkit-animation-delay:-.41666667s;animation-delay:-.41666667s}.ng-busy-default-spinner .bar9{transform:rotate(240deg) translate(0,-142%);-webkit-animation-delay:-.33333333s;animation-delay:-.33333333s}.ng-busy-default-spinner .bar10{transform:rotate(270deg) translate(0,-142%);-webkit-animation-delay:-.25s;animation-delay:-.25s}.ng-busy-default-spinner .bar11{transform:rotate(300deg) translate(0,-142%);-webkit-animation-delay:-.16666667s;animation-delay:-.16666667s}.ng-busy-default-spinner .bar12{transform:rotate(330deg) translate(0,-142%);-webkit-animation-delay:-83.33333ms;animation-delay:-83.33333ms}@-webkit-keyframes busy-spinner-anim{from{opacity:1}to{opacity:.25}}@keyframes busy-spinner-anim{from{opacity:1}to{opacity:.25}}"] }] } ]; /** @nocollapse */ LoadingComponent.ctorParameters = () => [ { type: PromiseTrackerService } ]; /** * @fileoverview added by tsickle * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ class LoadingConfig { /** * @param {?=} config */ constructor(config = {}) { for (let option in BUSY_CONFIG_DEFAULTS) { this[option] = config[option] != null ? config[option] : BUSY_CONFIG_DEFAULTS[option]; } } } /** @type {?} */ const BUSY_CONFIG_DEFAULTS = { delay: 0, minDuration: 0, backdrop: true, message: 'Please wait...', wrapperClass: 'ng-busy', onActivateTick: false, }; /** * @fileoverview added by tsickle * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ class LoadingService { /** * @param {?} _applicationRef * @param {?} _injector * @param {?} tracker * @param {?} _componentFactoryResolver */ constructor(_applicationRef, _injector, tracker, _componentFactoryResolver) { this._applicationRef = _applicationRef; this._injector = _injector; this.tracker = tracker; this._backdropFactory = _componentFactoryResolver.resolveComponentFactory(LoadingBackdropComponent); this._loadingFactory = _componentFactoryResolver.resolveComponentFactory(LoadingComponent); /** @type {?} */ let options = this.normalizeOptions(null); this.tracker.reset({ promiseList: options.busy, delay: options.delay, minDuration: options.minDuration, onActivateTick: options.onActivateTick, }); /** @type {?} */ const containerEl = document.querySelector('body'); /** @type {?} */ let backdropCmptRef; /** @type {?} */ let loadingCmptRef; // create backdrop backdropCmptRef = this._backdropFactory.create(this._injector); this._applicationRef.attachView(backdropCmptRef.hostView); containerEl.appendChild(backdropCmptRef.location.nativeElement); // create loading loadingCmptRef = this._loadingFactory.create(this._injector); this._applicationRef.attachView(loadingCmptRef.hostView); containerEl.appendChild(loadingCmptRef.location.nativeElement); /** @type {?} */ const instance = loadingCmptRef.instance; instance.message = options.message; instance.wrapperClass = options.wrapperClass; this.backdropCmptRef = backdropCmptRef; this.loadingCmptRef = loadingCmptRef; ((/** @type {?} */ (this.backdropCmptRef.location.nativeElement))).style.position = 'relative'; ((/** @type {?} */ (this.loadingCmptRef.location.nativeElement))).style.position = 'relative'; // this.backdropCmptRef.location.nativeElement.style.zIndex = 2000; // this.loadingCmptRef.location.nativeElement.style.zIndex = 2001; } /** * @param {?=} options * @return {?} */ open(options = undefined) { options = this.normalizeOptions(options); if (options.busy.length === 0) { this._fakeBusy = new Subject().subscribe(); this._fakeBusy = new Promise((/** * @param {?} resolve * @return {?} */ resolve => { if (options.maxDuration) setTimeout((/** * @return {?} */ () => resolve()), options.maxDuration); })); options.busy.push(this._fakeBusy); } else if (this._fakeBusy) { this._fakeBusy = null; } this.tracker.reset({ promiseList: options.busy, delay: options.delay, minDuration: options.minDuration, onActivateTick: options.onActivateTick, }); /** @type {?} */ const instance = this.loadingCmptRef.instance; instance.message = options.message; instance.wrapperClass = options.wrapperClass; if (options.onActivateTick === true) this._applicationRef.tick(); this.zIndex(options.zIndex); return this.loadingCmptRef; } /** * @param {?} options * @return {?} */ update(options) { options = this.normalizeOptions(options); /** @type {?} */ const instance = this.loadingCmptRef.instance; if (options.message) instance.message = options.message; if (options.wrapperClass) instance.wrapperClass = options.wrapperClass; if (options.onActivateTick === true) this._applicationRef.tick(); return this.loadingCmptRef; } /** * @return {?} */ close() { if (this._fakeBusy) this._fakeBusy = null; /** @type {?} */ let options = this.normalizeOptions(undefined); this.tracker.reset({ promiseList: options.busy, delay: options.delay, minDuration: options.minDuration, onActivateTick: options.onActivateTick, }); /** @type {?} */ const instance = this.loadingCmptRef.instance; instance.message = options.message; instance.wrapperClass = options.wrapperClass; if (options.onActivateTick === true) this._applicationRef.tick(); return this.loadingCmptRef; } /** * @param {?=} zIndex * @return {?} */ zIndex(zIndex = 2000) { this.backdropCmptRef.location.nativeElement.style.zIndex = zIndex; this.loadingCmptRef.location.nativeElement.style.zIndex = zIndex + 1; } /** * @private * @param {?} options * @return {?} */ normalizeOptions(options) { if (!options) { options = { busy: null }; } else if (Array.isArray(options) || options instanceof Promise || options instanceof Subscription) { options = { busy: options }; } options = Object.assign({}, new LoadingConfig(), options); if (!Array.isArray(options.busy)) { options.busy = options.busy ? [options.busy] : []; } return options; } } LoadingService.decorators = [ { type: Injectable } ]; /** @nocollapse */ LoadingService.ctorParameters = () => [ { type: ApplicationRef }, { type: Injector }, { type: PromiseTrackerService }, { type: ComponentFactoryResolver } ]; /** * @fileoverview added by tsickle * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ class LoadingModule { /** * @param {?=} config * @return {?} */ static forRoot(config = {}) { return { ngModule: LoadingModule, providers: [ LoadingService, PromiseTrackerService, { provide: LoadingConfig, useValue: config } ] }; } } LoadingModule.decorators = [ { type: NgModule, args: [{ imports: [CommonModule], declarations: [LoadingComponent, LoadingBackdropComponent], entryComponents: [LoadingComponent, LoadingBackdropComponent] },] } ]; /** * @fileoverview added by tsickle * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ /** * @fileoverview added by tsickle * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ class LoadingChunkErrorHandlerService { /** * @param {?} router * @param {?} zone */ constructor(router, zone) { this.router = router; this.zone = zone; // filter router events of type NavigationError this.navigationError$ = this.router.events.pipe(filter((/** * @param {?} e * @return {?} */ (e) => e instanceof NavigationError))); this.initErrorHandler(); } /** * @return {?} */ initErrorHandler() { this.navigationError$.subscribe((/** * @param {?} event * @return {?} */ (event) => { /** @type {?} */ let showPopup = false; // handle known error messages that can be retried if (event.error.message.startsWith('Loading chunk')) { showPopup = true; } if (showPopup) { // display a popup however you want... // if (confirm('웹사이트가 업데이트 되었습니다. 새로고침후 사용해주세요.')) { window.location.reload(); // } // mark the error as handled to avoid global handler this._errorHandled = event.error; } // normal global error handler this.zone.onError.subscribe((/** * @param {?} error * @return {?} */ (error) => { // ignore errors that were already handled but couldn't be cancelled if (error.rejection === this._errorHandled) { this._errorHandled = undefined; return; } // Whatever you want to do here for true unhandled errors console.warn(error); })); })); } } LoadingChunkErrorHandlerService.decorators = [ { type: Injectable, args: [{ providedIn: 'root', },] } ]; /** @nocollapse */ LoadingChunkErrorHandlerService.ctorParameters = () => [ { type: Router }, { type: NgZone } ]; /** @nocollapse */ LoadingChunkErrorHandlerService.ngInjectableDef = defineInjectable({ factory: function LoadingChunkErrorHandlerService_Factory() { return new LoadingChunkErrorHandlerService(inject(Router), inject(NgZone)); }, token: LoadingChunkErrorHandlerService, providedIn: "root" }); /** * @fileoverview added by tsickle * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ /** * @fileoverview added by tsickle * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ class PhoneNumberPipe { /** * @param {?} value * @param {?=} args * @return {?} */ transform(value, args = 'National') { if (!value) { return value; } try { return format(parse(value, { extended: true, defaultCountry: 'KR' }), args); } catch (e) { return value; } } } PhoneNumberPipe.decorators = [ { type: Pipe, args: [{ name: 'phoneNumber' },] } ]; /** * @fileoverview added by tsickle * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ /** @type {?} */ const DEFAULT_COUNTRY_CALLING_CODE = new InjectionToken('DEFAULT_COUNTRY_CALLING_CODE'); /** * @fileoverview added by tsickle * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ /** @type {?} */ const IntlTelInputComponentValueAccessor = { provide: NG_VALUE_ACCESSOR, useExisting: forwardRef((/** * @return {?} */ () => PhoneNumberInputComponent)), multi: true }; class PhoneNumberInputComponent { /** * @param {?} cdRef * @param {?} elementRef * @param {?} renderer * @param {?} countryCallingCode */ constructor(cdRef, elementRef, renderer, countryCallingCode) { this.cdRef = cdRef; this.elementRef = elementRef; this.renderer = renderer; this.countryCallingCode = countryCallingCode; this.size = 'md'; this.placeholder = ''; this.type = 'tel'; this.autocomplete = 'off'; this.blur = new EventEmitter(); this.focus = new EventEmitter(); this.phoneNumberChange = new EventEmitter(); this.isContrySelectOpen = false; this.onChange = (/** * @param {?} _ * @return {?} */ _ => { }); this.onTouched = (/** * @return {?} */ () => { }); this.subscriptions = new Subscription(); } /** * @private * @param {?} countryDialCode * @param {?} tel * @return {?} */ updatePhonenumberProperties(countryDialCode, tel) { tel = tel.replace(/^0/, ''); tel = tel.replace(/\D/g, ''); this.value = '+' + countryDialCode + tel; if (this.value === '+') this.value = undefined; } /** * @param {?=} value * @return {?} */ writeValue(value = '') { /** @type {?} */ let parsed = null; /** @type {?} */ let tel = ''; /** @type {?} */ let countryDialCode = ''; if (value && typeof value === 'string') { try { parsed = parseNumber(value, { extended: true, defaultCountry: 'KR' }); if (((/** @type {?} */ (parsed))).countryCallingCode) countryDialCode = ((/** @type {?} */ (parsed))).countryCallingCode || ''; tel = formatNumber((/** @type {?} */ (parsed)), 'National').replace(/\D/g, '') || ''; // for testing phone numbers starting with 00 if (value.match(/^\+8200/)) tel = '00' + tel; this.updatePhonenumberProperties(countryDialCode, tel); } catch (e) { } } // if only +defaultCountryDialCode is present, set countryDialCode to it. if (!countryDialCode && value === `+${this.countryCallingCode}`) countryDialCode = this.countryCallingCode; if (countryDialCode !== this.countryDialCode.value) this.countryDialCode.setValue(countryDialCode, { emitEvent: false }); if (tel !== this.tel.value) this.tel.setValue(tel, { emitEvent: false }); if (!this.cdRef['destroyed']) this.cdRef.detectChanges(); if (value !== this.value) this.onChange(this.value); } /** * @param {?} fn * @return {?} */ registerOnChange(fn) { this.onChange = fn; } /** * @param {?} fn * @return {?} */ registerOnTouched(fn) { this.onTouched = fn; } /** * @param {?} isDisabled * @return {?} */ setDisabledState(isDisabled) { this.disabled = isDisabled; if (isDisabled) { this.tel.disable(); this.countryDialCode.disable(); } else { this.tel.enable(); this.countryDialCode.enable(); } } /** * @return {?} */ updateIntlTel() { /** @type {?} */ let countryDialCode = this.countryDialCode.value; /** @type {?} */ let tel = this.tel.value // .replace(/\D/g, ''); ; // .replace(/\D/g, ''); this.updatePhonenumberProperties(countryDialCode, tel); this.onChange(this.value); this.phoneNumberChange.next({ countryDialCode, national: tel, intltel: this.value }); } /** * This allows the "clear search" X button to properly update the value for Edge & IE browsers * @param {?} $event * @return {?} */ detectSearchClear($event) { if ($event.target) { /** @type {?} */ const inputEl = (/** @type {?} */ ($event.target)); /** @type {?} */ const beforeVal = inputEl.value; setTimeout((/** * @return {?} */ () => { /** @type {?} */ const afterVal = inputEl.value; if (beforeVal !== '' && afterVal === '') { this.writeValue(''); this.updateIntlTel(); } }), 1); } } /** * @return {?} */ createFormControls() { this.tel = new FormControl({ value: '', disabled: this.disabled }); this.countryDialCode = new FormControl({ value: '', disabled: this.disabled }); } /** * @return {?} */ createForm() { this.form = new FormGroup({ countryDialCode: this.countryDialCode, tel: this.tel }); } /** * @param {?} $event * @return {?} */ onFocus($event) { this.renderer.addClass(this.elementRef.nativeElement, 'focus'); this.focus.next($event); } /** * @param {?} $event * @return {?} */ onBlur($event) { setTimeout((/** * @return {?} */ () => { if (this.isContrySelectOpen) return; this.renderer.removeClass(this.elementRef.nativeElement, 'focus'); this.blur.next($event); }), 100); // take quite a bit time to get correct the isContrySelectOpen value } /** * @param {?} bool * @return {?} */ onCountryDropdownOpenChange(bool) { this.isContrySelectOpen = bool; if (!bool && this.countryDialCode.value) { /** @type {?} */ const input = this.elementRef.nativeElement.querySelector('input'); input.focus(); } } /** * @return {?} */ ngOnInit() { this.readonly = this.elementRef.nativeElement.hasAttribute('readonly'); this.createFormControls(); this.createForm(); // if tel input is cleared, clear countryDialCode too. // if tel input is entered with no countryDialCode, fill countryDialCode. this.subscriptions.add(this.tel.valueChanges.pipe(map((/** * @param {?} v * @return {?} */ v => v ? true : false)), distinctUntilChanged()) .subscribe((/** * @param {?} bool * @return {?} */ (bool) => { if (!bool && this.countryDialCode.value) { this.countryDialCode.setValue(''); } else if (bool && !this.countryDialCode.value) { this.countryDialCode.setValue(this.countryCallingCode); } }))); this.subscriptions.add(this.form.valueChanges.pipe(distinctUntilChanged((/** * @param {?} a * @param {?} b * @return {?} */ (a, b) => { return (a.tel || '').replace(/\D/g, '') === (b.tel || '').replace(/\D/g, '') && a.countryDialCode === b.countryDialCode; })), debounceTime(10)).subscribe((/** * @return {?} */ () => this.updateIntlTel()))); } /** * @return {?} */ ngOnDestroy() { this.subscriptions.unsubscribe(); } } PhoneNumberInputComponent.decorators = [ { type: Component, args: [{ selector: 'phone-number-input', template: "<div class=\"phone-number-container\" [ngClass]=\"{'input-group-lg':size === 'lg', 'input-group-sm':size === 'sm', 'input-group':size === 'md' }\" class=\"d-flex\">\n <country-select \n [readonly]=\"readonly\"\n [formControl]=\"countryDialCode\" \n [size]=\"size\"\n (onOpenChange)=\"onCountryDropdownOpenChange($event)\"\n required></country-select>\n <input\n [readonly]=\"readonly\"\n [tabindex]=\"tabindex\"\n class=\"flex-grow-1 form-control bg-transparent\"\n [formControl]=\"tel\"\n [countryDialCode]=\"countryDialCode.value\"\n (focus)=\"onFocus($event)\" \n (blur)=\"onBlur($event)\" \n (mouseup)=\"detectSearchClear($event)\"\n local-tel \n required \n [type]=\"type\"\n [autocomplete]=\"autocomplete\"\n [placeholder]=\"placeholder\">\n</div>\n", providers: [IntlTelInputComponentValueAccessor], changeDetection: ChangeDetectionStrategy.OnPush, styles: [".phone-number-container{margin-top:-1px;min-width:180px}input{border:none;padding:.375em;display:block;width:100%;line-height:1.5;color:inherit!important;text-align:inherit}input:focus{outline:0;box-shadow:none}input:disabled,input[readonly]{background-color:#e9ecef;opacity:1}"] }] } ]; /** @nocollapse */ PhoneNumberInputComponent.ctorParameters = () => [ { type: ChangeDetectorRef }, { type: ElementRef }, { type: Renderer2 }, { type: undefined, decorators: [{ type: Inject, args: [DEFAULT_COUNTRY_CALLING_CODE,] }] } ]; PhoneNumberInputComponent.propDecorators = { ngClass: [{ type: Input, args: ['ngClass',] }], size: [{ type: Input, args: ['size',] }], placeholder: [{ type: Input, args: ['placeholder',] }], type: [{ type: Input, args: ['type',] }], autocomplete: [{ type: Input, args: ['autocomplete',] }], tabindex: [{ type: Input, args: ['tabindex',] }], blur: [{ type: Output }], focus: [{ type: Output }], phoneNumberChange: [{ type: Output }] }; /** * @fileoverview added by tsickle * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ /** @type {?} */ const INTL_TEL_INPUT_CONFIG = new InjectionToken('IntlTelCountryConfigInterface'); /** * @fileoverview added by tsickle * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ /** @type {?} */ const IntlTelCountryConfigDefault = { preSelectedCountry: (/** @type {?} */ ('KR')), allowedCountries: (/** @type {?} */ (['KR', 'RU', 'VN'])), preferredCountries: [] }; /** * @fileoverview added by tsickle * @suppress {checkTypes,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ class CountryCode { constructor() { this.allCountries = [ ['Afghanistan (‫افغانستان‬‎)', 'af', '93'], ['Albania (Shqipëri)', 'al', '355'], ['Algeria (‫الجزائر‬‎)', 'dz', '213'], ['American Samoa', 'as', '1684'], ['Andorra', 'ad', '376'], ['Angola', 'ao', '244'], ['Anguilla', 'ai', '1264'], ['Antigua and Barbuda', 'ag', '1268'], ['Argentina', 'ar', '54'], ['Armenia (Հայաստան)', 'am', '374'], ['Aruba', 'aw', '297'], ['Australia', 'au', '61', 0], ['Austria (Österreich)', 'at', '43'], ['Azerbaijan (Azərbaycan)', 'az', '994'], ['Bahamas', 'bs', '1242'], ['Bahrain (‫البحرين‬‎)', 'bh', '973'], ['Bangladesh (বাংলাদেশ)', 'bd', '880'], ['Barbados', 'bb', '1246'], ['Belarus (Беларусь)', 'by', '375'], ['Belgium (België)', 'be', '32'], ['Belize', 'bz', '501'], ['Benin (Bénin)', 'bj', '229'], ['Bermuda', 'bm', '1441'], ['Bhutan (འབྲུག)', 'bt', '975'], ['Bolivia', 'bo', '591'], ['Bosnia and Herzegovina (Босна и Херцеговина)', 'ba', '387'], ['Botswana', 'bw', '267'], ['Brazil (Brasil)', 'br', '55'], ['British Indian Ocean Territory', 'io', '246'], ['British Virgin Islands', 'vg', '1284'], ['Brunei', 'bn', '673'], ['Bulgaria (България)', 'bg', '359'], ['Burkina Faso', 'bf', '226'], ['Burundi (Uburundi)', 'bi', '257'], ['Cambodia (កម្ពុជា)', 'kh', '855'], ['Cameroon (Cameroun)', 'cm', '237'], [ 'Canada', 'ca', '1', 1, [ '204', '226', '236', '249', '250', '289', '306', '343', '365', '387', '403', '416', '418', '431', '437', '438', '450', '506', '514', '519', '548', '579', '581', '587', '604', '613', '639', '647', '672', '705', '709', '742',