UNPKG

chi-app-lib

Version:

This is a custom component (input dropdown grid textarea map captcha) published to npm.

1,375 lines (1,370 loc) 73.1 kB
(function (global, factory) { typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@angular/core'), require('@angular/common'), require('@angular/forms'), require('@angular/cdk/table'), require('@angular/material'), require('mapbox-gl')) : typeof define === 'function' && define.amd ? define('chi-app-lib', ['exports', '@angular/core', '@angular/common', '@angular/forms', '@angular/cdk/table', '@angular/material', 'mapbox-gl'], factory) : (global = global || self, factory(global['chi-app-lib'] = {}, global.ng.core, global.ng.common, global.ng.forms, global.ng.cdk.table, global.ng.material, global.mapboxGl)); }(this, function (exports, core, common, forms, table, material, mapboxGl) { 'use strict'; /** * @fileoverview added by tsickle * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ /** @type {?} */ var noop = (/** * @return {?} */ function () { }); var ɵ0 = noop; /** * Error when invalid control is dirty or touched */ var /** * Error when invalid control is dirty or touched */ MyErrorStateMatcher = /** @class */ (function () { function MyErrorStateMatcher() { } /** * @param {?} control * @param {?} form * @return {?} */ MyErrorStateMatcher.prototype.isErrorState = /** * @param {?} control * @param {?} form * @return {?} */ function (control, form) { return !!(control && control.invalid && (control.dirty || control.touched)); }; return MyErrorStateMatcher; }()); /** @type {?} */ var CHI_INPUT_COMPONENT_CONTROL_VALUE_ACCESSOR = { provide: forms.NG_VALUE_ACCESSOR, useExisting: core.forwardRef((/** * @return {?} */ function () { return ChiInputComponent; })), multi: true }; var ChiInputComponent = /** @class */ (function () { function ChiInputComponent(cdRef) { this.cdRef = cdRef; this.type = 'text'; this.direction = 'rtl'; this.floatLabel = 'auto'; // never // never this.pattern = ''; this.petternMessage = 'رقم غیر صحیح!'; this.showValidatorMessage = true; this.showSuffix = false; this.suffixIcon = 'close'; this.suffixClicked = new core.EventEmitter(); this.isValid = new core.EventEmitter(); this.matcher = new MyErrorStateMatcher(); this.id = 'chi-input' + this.idGenerator(); this.element = new forms.FormControl(''); // The internal data model this.innerValue = ''; // Placeholders for the callbacks which are later provided // by the Control Value Accessor this.onTouchedCallback = noop; this.onChangeCallback = noop; this.faNumberToEn = (/** * @param {?} value * @return {?} */ function (value) { if (!value) { return value; } /** @type {?} */ var d = ''; /** @type {?} */ var a = '۰۱۲۳۴۵۶۷۸۹'; /** @type {?} */ var b = '0123456789'; /** @type {?} */ var c = value.toString(); for (var i = 0, len = c.length; i < len; i++) { d += b[a.indexOf(c[i])] || c[i]; } return d; }); this.toPersianChar = (/** * @param {?} value * @return {?} */ function (value) { if (!value) { return value; } /** @type {?} */ var arabicChars = ['ي', 'ك', 'ى']; /** @type {?} */ var persianChars = ['ی', 'ک', 'ی']; for (var i = 0, charsLen = arabicChars.length; i < charsLen; i++) { value = value.replace(new RegExp(arabicChars[i], 'g'), persianChars[i]); } return value; }); } Object.defineProperty(ChiInputComponent.prototype, "value", { // // get accessor get: // // get accessor /** * @return {?} */ function () { return this.toPersianChar(this.faNumberToEn(this.innerValue)); }, // set accessor including call the onchange callback set: // set accessor including call the onchange callback /** * @param {?} v * @return {?} */ function (v) { var _this = this; if (v !== this.innerValue) { this.innerValue = v; this.onChangeCallback(v); setTimeout((/** * @param {?} _ * @return {?} */ function (_) { _this.isValid.emit(_this.element.valid); }), 100); } }, enumerable: true, configurable: true }); // Set touched on blur // Set touched on blur /** * @param {?} validate * @return {?} */ ChiInputComponent.prototype.onBlur = // Set touched on blur /** * @param {?} validate * @return {?} */ function (validate) { this.onTouchedCallback(); this.isValid.emit(this.element.valid); }; // From ControlValueAccessor interface // From ControlValueAccessor interface /** * @param {?} value * @return {?} */ ChiInputComponent.prototype.writeValue = // From ControlValueAccessor interface /** * @param {?} value * @return {?} */ function (value) { var _this = this; if (value !== this.innerValue) { this.innerValue = value; setTimeout((/** * @param {?} _ * @return {?} */ function (_) { _this.isValid.emit(_this.element.valid); }), 100); } }; // From ControlValueAccessor interface // From ControlValueAccessor interface /** * @param {?} fn * @return {?} */ ChiInputComponent.prototype.registerOnChange = // From ControlValueAccessor interface /** * @param {?} fn * @return {?} */ function (fn) { this.onChangeCallback = fn; }; // From ControlValueAccessor interface // From ControlValueAccessor interface /** * @param {?} fn * @return {?} */ ChiInputComponent.prototype.registerOnTouched = // From ControlValueAccessor interface /** * @param {?} fn * @return {?} */ function (fn) { this.onTouchedCallback = fn; }; /** * @param {?} event * @param {?} validate * @return {?} */ ChiInputComponent.prototype.changedInput = /** * @param {?} event * @param {?} validate * @return {?} */ function (event, validate) { var _this = this; setTimeout((/** * @param {?} _ * @return {?} */ function (_) { _this.isValid.emit(_this.element.valid); }), 100); }; /** * @param {?} validate * @return {?} */ ChiInputComponent.prototype.onFocused = /** * @param {?} validate * @return {?} */ function (validate) { this.isValid.emit(this.element.valid); }; /** * @return {?} */ ChiInputComponent.prototype.ngOnInit = /** * @return {?} */ function () { if (this.required && this.minLength && this.maxLength && this.pattern) { this.element = new forms.FormControl('', [ forms.Validators.required, forms.Validators.pattern(this.pattern), forms.Validators.minLength(this.minLength), forms.Validators.maxLength(this.maxLength) ]); } else if (this.required && !this.minLength && !this.maxLength && !this.pattern) { this.element = new forms.FormControl('', [forms.Validators.required]); } else if (!this.required && !this.minLength && !this.maxLength && this.pattern) { this.element = new forms.FormControl('', [forms.Validators.maxLength(this.maxLength)]); } else if (!this.required && this.minLength && !this.maxLength && !this.pattern) { this.element = new forms.FormControl('', [forms.Validators.minLength(this.minLength)]); } else if (!this.required && !this.minLength && this.maxLength && !this.pattern) { this.element = new forms.FormControl('', [forms.Validators.maxLength(this.maxLength)]); } else if (!this.required && this.minLength && this.maxLength && !this.pattern) { this.element = new forms.FormControl('', [forms.Validators.maxLength(this.maxLength), forms.Validators.minLength(this.minLength)]); } }; /** * @param {?} changes * @return {?} */ ChiInputComponent.prototype.ngOnChanges = /** * @param {?} changes * @return {?} */ function (changes) { /** @type {?} */ var name = changes.isDirty; if ((name || {})['currentValue']) { this.element.markAsDirty({ onlySelf: true }); } }; /** * @return {?} */ ChiInputComponent.prototype.ngAfterViewInit = /** * @return {?} */ function () { if (this.focuse) { this.inputEl.nativeElement.focus(); this.cdRef.detectChanges(); } }; /** * @return {?} */ ChiInputComponent.prototype.getErrorMessage = /** * @return {?} */ function () { return this.element.hasError('required') ? ' لا يمكن أن يكون هذا الحقل فارغًا!' : this.element.hasError('pattern') ? this.petternMessage : this.element.hasError('minlength') ? ' حداقل ' + this.minLength + ' کاراکتر وارد نمایید!' : this.element.hasError('maxlength') ? ' حداکثر ' + this.maxLength + ' کاراکتر وارد نمایید!' : ''; }; /** * @param {?} val * @return {?} */ ChiInputComponent.prototype.suffixClick = /** * @param {?} val * @return {?} */ function (val) { // if (this.element.invalid && this.suffixIcon !== 'close') { // return; // } if (this.suffixIcon === 'close') { this.value = ''; } this.suffixClicked.emit({ value: val, action: this.suffixIcon }); }; /** * @return {?} */ ChiInputComponent.prototype.idGenerator = /** * @return {?} */ function () { /** @type {?} */ var number = Math.random(); number.toString(36); return number.toString(36).substr(2, 9); }; ChiInputComponent.decorators = [ { type: core.Component, args: [{ selector: 'lib-chi-input', template: "<div class=\"element-container\" [ngClass]=\"className\" dir=\"{{direction}}\">\n <mat-form-field [hideRequiredMarker]=\"true\" floatLabel=\"{{floatLabel}}\">\n <input matInput\n id=\"{{id}}\"\n #input\n placeholder=\"{{placeHolder}}\"\n [formControl]=\"element\"\n required=\"{{required}}\"\n type=\"{{type}}\"\n [readonly]=\"readonly\"\n [(ngModel)]=\"value\"\n [minlength]=\"minLength\"\n [maxlength]=\"maxLength\"\n pattern=\"{{pattern}}\"\n (ngModelChange)=\"changedInput($event,element.valid)\"\n (focus)=\"onFocused(element.valid)\"\n (blur)=\"onBlur(element.valid)\"\n [errorStateMatcher]=\"matcher\">\n <button mat-button *ngIf=\"showSuffix\" matSuffix mat-icon-button aria-label=\"Clear\"\n [disabled]=\"!element.value\"\n (click)=\"suffixClick(value)\">\n <mat-icon>{{suffixIcon}}</mat-icon>\n </button>\n <mat-hint align=\"start\" *ngIf=\"hintText\"><strong>{{hintText}}</strong></mat-hint>\n <mat-error *ngIf=\"element.invalid&&showValidatorMessage\">{{getErrorMessage()}}</mat-error>\n </mat-form-field>\n</div>\n", providers: [CHI_INPUT_COMPONENT_CONTROL_VALUE_ACCESSOR], styles: [".element-container{display:flex;flex-direction:column}.element-container>*{width:100%}"] }] } ]; /** @nocollapse */ ChiInputComponent.ctorParameters = function () { return [ { type: core.ChangeDetectorRef } ]; }; ChiInputComponent.propDecorators = { type: [{ type: core.Input }], direction: [{ type: core.Input }], floatLabel: [{ type: core.Input }], pattern: [{ type: core.Input }], petternMessage: [{ type: core.Input }], className: [{ type: core.Input }], readonly: [{ type: core.Input }], required: [{ type: core.Input }], placeHolder: [{ type: core.Input }], hintText: [{ type: core.Input }], minLength: [{ type: core.Input }], maxLength: [{ type: core.Input }], showValidatorMessage: [{ type: core.Input }], showSuffix: [{ type: core.Input }], suffixIcon: [{ type: core.Input }], isDirty: [{ type: core.Input }], focuse: [{ type: core.Input }], suffixClicked: [{ type: core.Output }], isValid: [{ type: core.Output }], inputEl: [{ type: core.ViewChild, args: ['input', { static: false },] }] }; return ChiInputComponent; }()); if (false) { /** @type {?} */ ChiInputComponent.prototype.type; /** @type {?} */ ChiInputComponent.prototype.direction; /** @type {?} */ ChiInputComponent.prototype.floatLabel; /** @type {?} */ ChiInputComponent.prototype.pattern; /** @type {?} */ ChiInputComponent.prototype.petternMessage; /** @type {?} */ ChiInputComponent.prototype.className; /** @type {?} */ ChiInputComponent.prototype.readonly; /** @type {?} */ ChiInputComponent.prototype.required; /** @type {?} */ ChiInputComponent.prototype.placeHolder; /** @type {?} */ ChiInputComponent.prototype.hintText; /** @type {?} */ ChiInputComponent.prototype.minLength; /** @type {?} */ ChiInputComponent.prototype.maxLength; /** @type {?} */ ChiInputComponent.prototype.showValidatorMessage; /** @type {?} */ ChiInputComponent.prototype.showSuffix; /** @type {?} */ ChiInputComponent.prototype.suffixIcon; /** @type {?} */ ChiInputComponent.prototype.isDirty; /** @type {?} */ ChiInputComponent.prototype.focuse; /** @type {?} */ ChiInputComponent.prototype.suffixClicked; /** @type {?} */ ChiInputComponent.prototype.isValid; /** @type {?} */ ChiInputComponent.prototype.name; /** @type {?} */ ChiInputComponent.prototype.matcher; /** @type {?} */ ChiInputComponent.prototype.id; /** @type {?} */ ChiInputComponent.prototype.element; /** @type {?} */ ChiInputComponent.prototype.inputEl; /** * @type {?} * @private */ ChiInputComponent.prototype.innerValue; /** * @type {?} * @private */ ChiInputComponent.prototype.onTouchedCallback; /** * @type {?} * @private */ ChiInputComponent.prototype.onChangeCallback; /** @type {?} */ ChiInputComponent.prototype.faNumberToEn; /** @type {?} */ ChiInputComponent.prototype.toPersianChar; /** * @type {?} * @private */ ChiInputComponent.prototype.cdRef; } /** * @fileoverview added by tsickle * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ /** @type {?} */ var noop$1 = (/** * @return {?} */ function () { }); var ɵ0$1 = noop$1; /** * Error when invalid control is dirty or touched */ var /** * Error when invalid control is dirty or touched */ TextAreaErrorStateMatcher = /** @class */ (function () { function TextAreaErrorStateMatcher() { } /** * @param {?} control * @param {?} form * @return {?} */ TextAreaErrorStateMatcher.prototype.isErrorState = /** * @param {?} control * @param {?} form * @return {?} */ function (control, form) { return !!(control && control.invalid && (control.dirty || control.touched)); }; return TextAreaErrorStateMatcher; }()); /** @type {?} */ var Text_Area_Component_CONTROL_VALUE_ACCESSOR = { provide: forms.NG_VALUE_ACCESSOR, useExisting: core.forwardRef((/** * @return {?} */ function () { return TextAreaComponent; })), multi: true }; var TextAreaComponent = /** @class */ (function () { function TextAreaComponent() { this.type = 'text'; this.direction = 'rtl'; this.pattern = ''; this.showValidatorMessage = true; this.isValid = new core.EventEmitter(); this.matcher = new TextAreaErrorStateMatcher(); this.id = 'chi-textarea' + this.idGenerator(); this.element = new forms.FormControl(''); // The internal data model this.innerValue = ''; // Placeholders for the callbacks which are later provided // by the Control Value Accessor this.onTouchedCallback = noop$1; this.onChangeCallback = noop$1; if (this.required && this.minLength && this.maxLength && this.pattern) { this.element = new forms.FormControl('', [ forms.Validators.required, forms.Validators.pattern(this.pattern), forms.Validators.minLength(this.minLength), forms.Validators.maxLength(this.maxLength) ]); } else if (this.required && !this.minLength && !this.maxLength && !this.pattern) { this.element = new forms.FormControl('', [forms.Validators.required]); } else if (!this.required && !this.minLength && !this.maxLength && this.pattern) { this.element = new forms.FormControl('', [forms.Validators.maxLength(this.maxLength)]); } else if (!this.required && this.minLength && !this.maxLength && !this.pattern) { this.element = new forms.FormControl('', [forms.Validators.minLength(this.minLength)]); } else if (!this.required && !this.minLength && this.maxLength && !this.pattern) { this.element = new forms.FormControl('', [forms.Validators.maxLength(this.maxLength)]); } } Object.defineProperty(TextAreaComponent.prototype, "value", { // // get accessor get: // // get accessor /** * @return {?} */ function () { return this.innerValue; }, // set accessor including call the onchange callback set: // set accessor including call the onchange callback /** * @param {?} v * @return {?} */ function (v) { var _this = this; if (v !== this.innerValue) { this.innerValue = v; this.onChangeCallback(v); setTimeout((/** * @param {?} _ * @return {?} */ function (_) { _this.isValid.emit(_this.element.valid); }), 100); } }, enumerable: true, configurable: true }); // Set touched on blur // Set touched on blur /** * @param {?} validate * @return {?} */ TextAreaComponent.prototype.onBlur = // Set touched on blur /** * @param {?} validate * @return {?} */ function (validate) { this.onTouchedCallback(); this.isValid.emit(this.element.valid); }; // From ControlValueAccessor interface // From ControlValueAccessor interface /** * @param {?} value * @return {?} */ TextAreaComponent.prototype.writeValue = // From ControlValueAccessor interface /** * @param {?} value * @return {?} */ function (value) { var _this = this; if (value !== this.innerValue) { this.innerValue = value; setTimeout((/** * @param {?} _ * @return {?} */ function (_) { _this.isValid.emit(_this.element.valid); }), 100); } }; // From ControlValueAccessor interface // From ControlValueAccessor interface /** * @param {?} fn * @return {?} */ TextAreaComponent.prototype.registerOnChange = // From ControlValueAccessor interface /** * @param {?} fn * @return {?} */ function (fn) { this.onChangeCallback = fn; }; // From ControlValueAccessor interface // From ControlValueAccessor interface /** * @param {?} fn * @return {?} */ TextAreaComponent.prototype.registerOnTouched = // From ControlValueAccessor interface /** * @param {?} fn * @return {?} */ function (fn) { this.onTouchedCallback = fn; }; /** * @param {?} event * @param {?} validate * @return {?} */ TextAreaComponent.prototype.changedInput = /** * @param {?} event * @param {?} validate * @return {?} */ function (event, validate) { var _this = this; setTimeout((/** * @param {?} _ * @return {?} */ function (_) { _this.isValid.emit(_this.element.valid); }), 100); }; /** * @param {?} validate * @return {?} */ TextAreaComponent.prototype.onFocused = /** * @param {?} validate * @return {?} */ function (validate) { this.isValid.emit(this.element.valid); }; /** * @return {?} */ TextAreaComponent.prototype.ngOnInit = /** * @return {?} */ function () { }; /** * @param {?} changes * @return {?} */ TextAreaComponent.prototype.ngOnChanges = /** * @param {?} changes * @return {?} */ function (changes) { /** @type {?} */ var name = changes.isDirty; if ((name || {})['currentValue']) { this.element.markAsDirty({ onlySelf: true }); } }; /** * @return {?} */ TextAreaComponent.prototype.getErrorMessage = /** * @return {?} */ function () { return this.element.hasError('required') ? ' لا يمكن أن يكون هذا الحقل فارغًا!' : this.element.hasError('pattern') ? 'رقم غیر صحیح!' : this.element.hasError('minlength') ? ' حداقل ' + this.minLength + ' کاراکتر وارد نمایید!' : this.element.hasError('maxlength') ? ' حداکثر ' + this.maxLength + ' کاراکتر وارد نمایید!' : ''; }; /** * @param {?} val * @return {?} */ TextAreaComponent.prototype.getElement = /** * @param {?} val * @return {?} */ function (val) { // console.log(val); }; /** * @return {?} */ TextAreaComponent.prototype.idGenerator = /** * @return {?} */ function () { /** @type {?} */ var number = Math.random(); number.toString(36); return number.toString(36).substr(2, 9); }; TextAreaComponent.decorators = [ { type: core.Component, args: [{ selector: 'lib-text-area', template: "<div class=\"element-container\" [ngClass]=\"className\" dir=\"{{direction}}\">\n <mat-form-field [hideRequiredMarker]=\"true\">\n <textarea matInput\n id=\"{{id}}\"\n cdkTextareaAutosize\n cdkAutosizeMinRows=\"2\"\n cdkAutosizeMaxRows=\"5\"\n placeholder=\"{{placeHolder}}\"\n [formControl]=\"element\"\n required=\"{{required}}\"\n [(ngModel)]=\"value\"\n (input)=\"getElement($event)\"\n [disabled]=\"readonly\"\n [minlength]=\"minLength\"\n [maxlength]=\"maxLength\"\n (ngModelChange)=\"changedInput($event,element.valid)\"\n (focus)=\"onFocused(element.valid)\"\n (blur)=\"onBlur(element.valid)\"\n [errorStateMatcher]=\"matcher\">\n </textarea>\n\n <mat-hint align=\"end\" *ngIf=\"showCountValue\">\n {{(value || '').length}}/{{maxLength}}\n </mat-hint>\n\n <mat-hint align=\"start\" *ngIf=\"hintText\"><strong>{{hintText}}</strong></mat-hint>\n <mat-error *ngIf=\"element.invalid&&showValidatorMessage\">{{getErrorMessage()}}</mat-error>\n </mat-form-field>\n</div>\n", providers: [Text_Area_Component_CONTROL_VALUE_ACCESSOR], styles: [".element-container{display:flex;flex-direction:column}.element-container>*{width:100%}"] }] } ]; /** @nocollapse */ TextAreaComponent.ctorParameters = function () { return []; }; TextAreaComponent.propDecorators = { type: [{ type: core.Input }], direction: [{ type: core.Input }], pattern: [{ type: core.Input }], className: [{ type: core.Input }], readonly: [{ type: core.Input }], required: [{ type: core.Input }], placeHolder: [{ type: core.Input }], hintText: [{ type: core.Input }], minLength: [{ type: core.Input }], maxLength: [{ type: core.Input }], showCountValue: [{ type: core.Input }], isDirty: [{ type: core.Input }], showValidatorMessage: [{ type: core.Input }], isValid: [{ type: core.Output }] }; return TextAreaComponent; }()); if (false) { /** @type {?} */ TextAreaComponent.prototype.type; /** @type {?} */ TextAreaComponent.prototype.direction; /** @type {?} */ TextAreaComponent.prototype.pattern; /** @type {?} */ TextAreaComponent.prototype.className; /** @type {?} */ TextAreaComponent.prototype.readonly; /** @type {?} */ TextAreaComponent.prototype.required; /** @type {?} */ TextAreaComponent.prototype.placeHolder; /** @type {?} */ TextAreaComponent.prototype.hintText; /** @type {?} */ TextAreaComponent.prototype.minLength; /** @type {?} */ TextAreaComponent.prototype.maxLength; /** @type {?} */ TextAreaComponent.prototype.showCountValue; /** @type {?} */ TextAreaComponent.prototype.isDirty; /** @type {?} */ TextAreaComponent.prototype.showValidatorMessage; /** @type {?} */ TextAreaComponent.prototype.isValid; /** @type {?} */ TextAreaComponent.prototype.name; /** @type {?} */ TextAreaComponent.prototype.matcher; /** @type {?} */ TextAreaComponent.prototype.id; /** @type {?} */ TextAreaComponent.prototype.element; /** * @type {?} * @private */ TextAreaComponent.prototype.innerValue; /** * @type {?} * @private */ TextAreaComponent.prototype.onTouchedCallback; /** * @type {?} * @private */ TextAreaComponent.prototype.onChangeCallback; } /** * @fileoverview added by tsickle * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ var ChiMapComponent = /** @class */ (function () { function ChiMapComponent() { this.marker = []; this.id = this.idGenerator(); this.maxZoom = 18; this.minZoom = 5; this.zoom = 5; this.center = [51.4, 35.7]; this.southWest = { lat: 24.350969, lng: 44.0 }; this.northEast = { lat: 39.912996, lng: 63.5 }; this.mode = 'select'; // view // view this.zoomControl = true; this.dragging = true; this.zoomMarker = 17; this.showMarker = true; this.coordinate = new core.EventEmitter(); this.getMap = new core.EventEmitter(); // (mapboxgl as any).accessToken = 'pk.eyJ1IjoiZGFuc3dpY2siLCJhIjoieUZiWmwtVSJ9.0cPQywdbPVmvHiHJ6NwdXA'; } /** * @param {?} changes * @return {?} */ ChiMapComponent.prototype.ngOnChanges = /** * @param {?} changes * @return {?} */ function (changes) { /** @type {?} */ var height = changes.height; /** @type {?} */ var isDrag = changes.dragging; /** @type {?} */ var coordinateOrigin = changes.resetCoordinate; if ((coordinateOrigin || {})['currentValue']) { this.resetMarker(); } if ((isDrag || {})['currentValue'] === false || (isDrag || {})['currentValue'] === true) { this.disabledDrag(); } }; /** * @return {?} */ ChiMapComponent.prototype.ngOnInit = /** * @return {?} */ function () { var _this = this; setTimeout((/** * @param {?} _ * @return {?} */ function (_) { _this.initMap(); }), 100); }; /** * @return {?} */ ChiMapComponent.prototype.idGenerator = /** * @return {?} */ function () { /** @type {?} */ var number = Math.random(); number.toString(36); return number.toString(36).substr(2, 9); }; /** * @return {?} */ ChiMapComponent.prototype.disabledDrag = /** * @return {?} */ function () { if (!this.map) { return; } if (!this.dragging) { this.map.dragPan.disable(); } else { this.map.dragPan.enable(); } }; /** * @param {?} url * @param {?} resourceType * @return {?} */ ChiMapComponent.prototype.encryptTileUrl = /** * @param {?} url * @param {?} resourceType * @return {?} */ function (url, resourceType) { if (resourceType === 'Tile' && url.match('hash')) { /** @type {?} */ var arr = url.split('/'); url = url.split('hash')[0] + 'hash/' + hashThis(arr[arr.length - 3] + '/' + arr[arr.length - 2] + '/' + arr[arr.length - 1], true); return { url: url }; } if (resourceType === 'Tile' && url.match('google')) { /** @type {?} */ var arr = (url.split('pl&'))[1].split('/'); /** @type {?} */ var a = url.split('&'); url = (a[0] + '&' + a[1] + '&x=' + arr[arr.length - 2] + '&y=' + arr[arr.length - 1] + '&z=' + arr[arr.length - 3]).replace('.jpeg', ''); return { url: url }; } else { return { url: url }; } }; /** * @return {?} */ ChiMapComponent.prototype.initMap = /** * @return {?} */ function () { var _this = this; this.map = new mapboxGl.Map({ transformRequest: this.encryptTileUrl, container: 'chi-map' + this.id, // container id style: { 'version': 8, 'sources': { 'simple-tiles': { 'type': 'raster', // point to our third-party tiles. Note that some examples // show a 'url' property. This only applies to tilesets with // corresponding TileJSON (such as mapbox tiles). 'tiles': [this.mapUrl], 'tileSize': 256 } }, 'layers': [{ 'id': 'simple-tiles', 'type': 'raster', 'source': 'simple-tiles' }] }, center: this.center, zoom: this.minZoom, // starting zoom minZoom: this.minZoom, maxZoom: this.maxZoom, maxBounds: [[this.southWest.lng, this.southWest.lat], [this.northEast.lng, this.northEast.lat]] }); this.map.scrollZoom.setWheelZoomRate(1); /** @type {?} */ var nav = new mapboxGl.NavigationControl({ showCompass: false, showZoom: this.zoomControl }); this.map.addControl(nav, 'top-left'); // disable map rotation using right click + drag this.map.dragRotate.disable(); // disable map rotation using touch rotation gesture this.map.touchZoomRotate.disableRotation(); this.map.dragRotate.disable(); if (this.zoomControl) { this.map.scrollZoom.enable(); } else { this.map.scrollZoom.disable(); } this.disabledDrag(); if (this.mode === 'select') { this.map.on('dragstart', (/** * @param {?} evt * @return {?} */ function (evt) { _this.updateCoordinate(); })); this.map.on('drag', (/** * @param {?} evt * @return {?} */ function (evt) { _this.updateCoordinate(); })); this.map.on('dragend', (/** * @param {?} evt * @return {?} */ function (evt) { _this.updateCoordinate(); })); this.map.on('zoomend', (/** * @param {?} evt * @return {?} */ function (evt) { _this.updateCoordinate(); })); } if (this.showMarker) { this.setMarker(); } this.getMap.emit(this.map); }; /** * @return {?} */ ChiMapComponent.prototype.updateCoordinate = /** * @return {?} */ function () { /** @type {?} */ var center = this.map.getCenter(); this.updatePositionMarker(center.lat, center.lng); this.coordinate.emit(center); }; /** * @return {?} */ ChiMapComponent.prototype.setMarker = /** * @return {?} */ function () { var _this = this; /** @type {?} */ var positionMarker = this.coordinateMarker || this.map.getCenter(); /** @type {?} */ var geojson = { 'type': 'FeatureCollection', 'features': [ { 'type': 'Feature', 'properties': { 'iconSize': this.markerSize }, 'geometry': { 'type': 'Point', 'coordinates': positionMarker } } ] }; // add markers to map geojson.features.forEach((/** * @param {?} marker * @return {?} */ function (marker) { // create a DOM element for the marker /** @type {?} */ var el = document.createElement('div'); el.className = 'marker'; el.style.backgroundImage = 'url(' + _this.markerUrl + ')'; el.style.width = marker.properties.iconSize[0] + 'px'; el.style.height = marker.properties.iconSize[1] + 'px'; el.draggable = false; // add marker to map /** @type {?} */ var markerIcon = new mapboxGl.Marker(el, { offset: _this.markerAnchor }) .setLngLat(marker.geometry.coordinates) .addTo(_this.map); _this.marker.push(markerIcon); })); this.paneToMarker(positionMarker.lat, positionMarker.lng || positionMarker.lon); this.coordinate.emit(positionMarker); }; /** * @param {?} lat * @param {?} lng * @return {?} */ ChiMapComponent.prototype.paneToMarker = /** * @param {?} lat * @param {?} lng * @return {?} */ function (lat, lng) { this.map.flyTo({ // These options control the ending camera position: centered at // the target, at zoom level 9, and north up. center: [lng, lat], zoom: this.zoomMarker }); }; /** * @param {?} lat * @param {?} lng * @return {?} */ ChiMapComponent.prototype.updatePositionMarker = /** * @param {?} lat * @param {?} lng * @return {?} */ function (lat, lng) { for (var i = 0; i < this.marker.length; i++) { this.marker[i]._lngLat = { lat: lat, lng: lng }; this.marker[i]._update(); } }; /** * @return {?} */ ChiMapComponent.prototype.resetMarker = /** * @return {?} */ function () { this.updatePositionMarker(this.coordinateMarker.lat, this.coordinateMarker.lng); this.paneToMarker(this.coordinateMarker.lat, this.coordinateMarker.lng || this.coordinateMarker.lon); }; ChiMapComponent.decorators = [ { type: core.Component, args: [{ selector: 'lib-chi-map', template: "<div id=\"chi-map{{id}}\" [ngStyle]=\"{'width': width , 'height': height}\" class=\"chi-map\"></div>\n", styles: [".chi-map{position:relative;direction:rtl;z-index:10021;transition:height .5s ease-in-out}"] }] } ]; /** @nocollapse */ ChiMapComponent.ctorParameters = function () { return []; }; ChiMapComponent.propDecorators = { mapUrl: [{ type: core.Input }], maxZoom: [{ type: core.Input }], minZoom: [{ type: core.Input }], zoom: [{ type: core.Input }], center: [{ type: core.Input }], southWest: [{ type: core.Input }], northEast: [{ type: core.Input }], mode: [{ type: core.Input }], zoomControl: [{ type: core.Input }], dragging: [{ type: core.Input }], markerUrl: [{ type: core.Input }], markerSize: [{ type: core.Input }], markerAnchor: [{ type: core.Input }], coordinateMarker: [{ type: core.Input }], resetCoordinate: [{ type: core.Input }], zoomMarker: [{ type: core.Input }], width: [{ type: core.Input }], height: [{ type: core.Input }], showMarker: [{ type: core.Input }], coordinate: [{ type: core.Output }], getMap: [{ type: core.Output }] }; return ChiMapComponent; }()); if (false) { /** @type {?} */ ChiMapComponent.prototype.map; /** @type {?} */ ChiMapComponent.prototype.baseMaps; /** @type {?} */ ChiMapComponent.prototype.mapOptions; /** @type {?} */ ChiMapComponent.prototype.marker; /** @type {?} */ ChiMapComponent.prototype.id; /** @type {?} */ ChiMapComponent.prototype.mapUrl; /** @type {?} */ ChiMapComponent.prototype.maxZoom; /** @type {?} */ ChiMapComponent.prototype.minZoom; /** @type {?} */ ChiMapComponent.prototype.zoom; /** @type {?} */ ChiMapComponent.prototype.center; /** @type {?} */ ChiMapComponent.prototype.southWest; /** @type {?} */ ChiMapComponent.prototype.northEast; /** @type {?} */ ChiMapComponent.prototype.mode; /** @type {?} */ ChiMapComponent.prototype.zoomControl; /** @type {?} */ ChiMapComponent.prototype.dragging; /** @type {?} */ ChiMapComponent.prototype.markerUrl; /** @type {?} */ ChiMapComponent.prototype.markerSize; /** @type {?} */ ChiMapComponent.prototype.markerAnchor; /** @type {?} */ ChiMapComponent.prototype.coordinateMarker; /** @type {?} */ ChiMapComponent.prototype.resetCoordinate; /** @type {?} */ ChiMapComponent.prototype.zoomMarker; /** @type {?} */ ChiMapComponent.prototype.width; /** @type {?} */ ChiMapComponent.prototype.height; /** @type {?} */ ChiMapComponent.prototype.showMarker; /** @type {?} */ ChiMapComponent.prototype.coordinate; /** @type {?} */ ChiMapComponent.prototype.getMap; } /** * @fileoverview added by tsickle * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ var CaptchaComponent = /** @class */ (function () { function CaptchaComponent() { this.refreshIcon = 'refresh'; this.key = new core.EventEmitter(); this.id = 'captcha' + this.idGenerator(); } /** * @return {?} */ CaptchaComponent.prototype.ngOnInit = /** * @return {?} */ function () { this.createCpatcha(); }; /** * @param {?} changes * @return {?} */ CaptchaComponent.prototype.ngOnChanges = /** * @param {?} changes * @return {?} */ function (changes) { /** @type {?} */ var name = changes.isRefreshImage; if (name.currentValue) { this.createCpatcha(); } }; /** * @return {?} */ CaptchaComponent.prototype.createCpatcha = /** * @return {?} */ function () { /** @type {?} */ var captchaKey = Math.floor((1 + Math.random()) * 0x10000).toString(16).substring(1); this.imageLink = this.imageUrl + captchaKey; this.key.emit(captchaKey); this.isRefreshImage = false; }; /** * @return {?} */ CaptchaComponent.prototype.idGenerator = /** * @return {?} */ function () { /** @type {?} */ var number = Math.random(); number.toString(36); return number.toString(36).substr(2, 9); }; CaptchaComponent.decorators = [ { type: core.Component, args: [{ selector: 'lib-captcha', template: "<div class=\"element-container\" id=\"{{id}}\" [ngClass]=\"className\">\n <div>\n <img src=\"{{imageLink}}\" width=\"100%\">\n </div>\n <button mat-button mat-icon-button\n [ngClass]=\"iconClass\"\n (click)=\"createCpatcha()\">\n <mat-icon>{{refreshIcon}}</mat-icon>\n </button>\n</div>\n", styles: [".element-container{display:flex;flex-direction:row}.element-container>button{display:flex;place-content:center;justify-content:center}"] }] } ]; /** @nocollapse */ CaptchaComponent.ctorParameters = function () { return []; }; CaptchaComponent.propDecorators = { imageUrl: [{ type: core.Input }], className: [{ type: core.Input }], iconClass: [{ type: core.Input }], refreshIcon: [{ type: core.Input }], isRefreshImage: [{ type: core.Input }], key: [{ type: core.Output }] }; return CaptchaComponent; }()); if (false) { /** @type {?} */ CaptchaComponent.prototype.imageUrl; /** @type {?} */ CaptchaComponent.prototype.className; /** @type {?} */ CaptchaComponent.prototype.iconClass; /** @type {?} */ CaptchaComponent.prototype.refreshIcon; /** @type {?} */ CaptchaComponent.prototype.isRefreshImage; /** @type {?} */ CaptchaComponent.prototype.key; /** @type {?} */ CaptchaComponent.prototype.imageLink; /** @type {?} */ CaptchaComponent.prototype.id; } /** * @fileoverview added by tsickle * @suppress {checkTypes,constantProperty,extraRequire,missingOverride,missingReturn,unusedPrivateMembers,uselessCode} checked by tsc */ /** @type {?} */ var noop$2 = (/** * @return {?} */ function () { }); var ɵ0$2 = noop$2; /** * Error when invalid control is dirty or touched */ var /** * Error when invalid control is dirty or touched */ DropdownErrorStateMatcher = /** @class */ (function () { function DropdownErrorStateMatcher() { } /** * @param {?} control * @param {?} form * @return {?} */ DropdownErrorStateMatcher.prototype.isErrorState = /** * @param {?} control * @param {?} form * @return {?} */ function (control, form) { return !!(control && control.invalid && (control.dirty || control.touched)); }; return DropdownErrorStateMatcher; }()); /** @type {?} */ var DROPDOWN_COMPONENT_CONTROL_VALUE_ACCESSOR = { provide: forms.NG_VALUE_ACCESSOR, useExisting: core.forwardRef((/** * @return {?} */ function () { return DropdownComponent; })), multi: true }; var DropdownCom