@wizishop/img-manager 14.0.10 → 14.0.12
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/assets/i18n/en.json +1 -1
- package/assets/i18n/fr.json +1 -1
- package/esm2020/lib/components/images-view/images-view.component.mjs +3 -3
- package/esm2020/lib/components/images-view/mosaic-view/img-card/img-card.component.mjs +3 -3
- package/esm2020/lib/components/img-editor/img-editor.component.mjs +3 -3
- package/esm2020/lib/components/img-editor/info-section/info-section.component.mjs +3 -3
- package/esm2020/lib/components/img-upload/img-upload.component.mjs +17 -10
- package/esm2020/lib/components/pexels-lib/pexels-lib.component.mjs +3 -3
- package/esm2020/lib/components/upload-list/upload-list.component.mjs +3 -3
- package/esm2020/lib/wz-img-manager.component.mjs +3 -3
- package/fesm2015/wizishop-img-manager.mjs +24 -18
- package/fesm2015/wizishop-img-manager.mjs.map +1 -1
- package/fesm2020/wizishop-img-manager.mjs +24 -18
- package/fesm2020/wizishop-img-manager.mjs.map +1 -1
- package/lib/components/img-upload/img-upload.component.d.ts +3 -1
- package/package.json +1 -1
- package/wizishop-img-manager-14.0.12.tgz +0 -0
- package/wz-img-manager.scss +225 -225
- package/wizishop-img-manager-14.0.10.tgz +0 -0
|
@@ -727,10 +727,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.3", ngImpor
|
|
|
727
727
|
}] } });
|
|
728
728
|
|
|
729
729
|
class ImgUploadComponent {
|
|
730
|
-
constructor(imgManager, alertService, externalConfigService) {
|
|
730
|
+
constructor(imgManager, alertService, externalConfigService, translateService) {
|
|
731
731
|
this.imgManager = imgManager;
|
|
732
732
|
this.alertService = alertService;
|
|
733
733
|
this.externalConfigService = externalConfigService;
|
|
734
|
+
this.translateService = translateService;
|
|
734
735
|
this.files = [];
|
|
735
736
|
this.isLoading = false;
|
|
736
737
|
this.imgUploaded = new EventEmitter();
|
|
@@ -766,7 +767,12 @@ class ImgUploadComponent {
|
|
|
766
767
|
continue;
|
|
767
768
|
}
|
|
768
769
|
if (!this.isSizeValid(file.size)) {
|
|
769
|
-
|
|
770
|
+
// ImgManager.ImgUpload.ErrorImgSize
|
|
771
|
+
this.alertService.openAlert(this.translateService.instant('ImgManager.ImgUpload.ErrorImgSize', {
|
|
772
|
+
fileName: file.name,
|
|
773
|
+
fileSize: this.getImageSizeInKo(file.size),
|
|
774
|
+
maxFileSize: this.getImageSizeInKo(this.MAX_IMAGE_SIZE)
|
|
775
|
+
}));
|
|
770
776
|
this.isLoading = false;
|
|
771
777
|
continue;
|
|
772
778
|
}
|
|
@@ -813,7 +819,7 @@ class ImgUploadComponent {
|
|
|
813
819
|
this.dragAndDropBox.nativeElement.style = '';
|
|
814
820
|
}
|
|
815
821
|
}
|
|
816
|
-
ImgUploadComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: ImgUploadComponent, deps: [{ token: ImgManagerService }, { token: AlertService }, { token: ImgManagerConfigService }], target: i0.ɵɵFactoryTarget.Component });
|
|
822
|
+
ImgUploadComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: ImgUploadComponent, deps: [{ token: ImgManagerService }, { token: AlertService }, { token: ImgManagerConfigService }, { token: i7.TranslateService }], target: i0.ɵɵFactoryTarget.Component });
|
|
817
823
|
ImgUploadComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.3", type: ImgUploadComponent, selector: "img-upload", inputs: { stateDisplayed: "stateDisplayed" }, outputs: { imgUploaded: "imgUploaded" }, viewQueries: [{ propertyName: "dragAndDropBox", first: true, predicate: ["dragAndDropBox"], descendants: true }], ngImport: i0, template: "<div\n class=\"img-upload has-text-centered\"\n [ngClass]=\"{'img-upload--small': stateDisplayed === 'small'}\"\n (click)=\"fileInput.click()\"\n appDragDrop\n (onFileDropped)=\"filesChangeByDragAndDrop($any($event))\"\n #dragAndDropBox\n [@easeInOut]=\"'in'\"\n>\n <input hidden type=\"file\" #fileInput (change)=\"filesChangeByClick($event)\" accept=\"image/*\" multiple >\n <div class=\"img-upload__container\" [ngClass]=\"{'img-upload__container--small': stateDisplayed === 'small'}\">\n\n <div class=\"img-upload__container__wrapper\">\n\n <div class=\"img-upload__container__loader\" *ngIf=\"isLoading\">\n <wz-loader [small]=\"true\" [position]=\"'relative'\"></wz-loader>\n </div>\n\n <ng-container *ngIf=\"!isLoading\">\n <div class=\"blueColor img-upload__container__dropImgIconDiv\">\n <img *ngIf=\"assetsIcon\" [src]=\"assetsIcon\" alt=\"icon picture\" />\n <p>{{ 'ImgManager.ImgUpload.dropImg' | translate }}</p>\n </div>\n\n <p class=\"img-upload__container__or\">{{ 'ImgManager.ImgUpload.or' | translate }}</p>\n\n <div class=\"img-upload__container__text\">\n <i class=\"fal fa-file-upload\"></i>{{ 'ImgManager.ImgUpload.selectImg' | translate }}\n </div>\n </ng-container>\n\n </div>\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: LoaderComponent, selector: "wz-loader", inputs: ["text", "small", "position"] }, { kind: "directive", type: DragDropDirective, selector: "[appDragDrop]", outputs: ["onFileDropped"] }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }], animations: [
|
|
818
824
|
easeInOut
|
|
819
825
|
] });
|
|
@@ -822,7 +828,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.3", ngImpor
|
|
|
822
828
|
args: [{ selector: 'img-upload', animations: [
|
|
823
829
|
easeInOut
|
|
824
830
|
], template: "<div\n class=\"img-upload has-text-centered\"\n [ngClass]=\"{'img-upload--small': stateDisplayed === 'small'}\"\n (click)=\"fileInput.click()\"\n appDragDrop\n (onFileDropped)=\"filesChangeByDragAndDrop($any($event))\"\n #dragAndDropBox\n [@easeInOut]=\"'in'\"\n>\n <input hidden type=\"file\" #fileInput (change)=\"filesChangeByClick($event)\" accept=\"image/*\" multiple >\n <div class=\"img-upload__container\" [ngClass]=\"{'img-upload__container--small': stateDisplayed === 'small'}\">\n\n <div class=\"img-upload__container__wrapper\">\n\n <div class=\"img-upload__container__loader\" *ngIf=\"isLoading\">\n <wz-loader [small]=\"true\" [position]=\"'relative'\"></wz-loader>\n </div>\n\n <ng-container *ngIf=\"!isLoading\">\n <div class=\"blueColor img-upload__container__dropImgIconDiv\">\n <img *ngIf=\"assetsIcon\" [src]=\"assetsIcon\" alt=\"icon picture\" />\n <p>{{ 'ImgManager.ImgUpload.dropImg' | translate }}</p>\n </div>\n\n <p class=\"img-upload__container__or\">{{ 'ImgManager.ImgUpload.or' | translate }}</p>\n\n <div class=\"img-upload__container__text\">\n <i class=\"fal fa-file-upload\"></i>{{ 'ImgManager.ImgUpload.selectImg' | translate }}\n </div>\n </ng-container>\n\n </div>\n </div>\n</div>\n" }]
|
|
825
|
-
}], ctorParameters: function () { return [{ type: ImgManagerService }, { type: AlertService }, { type: ImgManagerConfigService }]; }, propDecorators: { stateDisplayed: [{
|
|
831
|
+
}], ctorParameters: function () { return [{ type: ImgManagerService }, { type: AlertService }, { type: ImgManagerConfigService }, { type: i7.TranslateService }]; }, propDecorators: { stateDisplayed: [{
|
|
826
832
|
type: Input
|
|
827
833
|
}], imgUploaded: [{
|
|
828
834
|
type: Output
|
|
@@ -1220,7 +1226,7 @@ class PexelLibComponent {
|
|
|
1220
1226
|
}
|
|
1221
1227
|
}
|
|
1222
1228
|
PexelLibComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: PexelLibComponent, deps: [{ token: PexelsService }, { token: ImgManagerService }, { token: AlertService }, { token: i7.TranslateService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1223
|
-
PexelLibComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.3", type: PexelLibComponent, selector: "pexels-lib", inputs: { stateDisplayed: "stateDisplayed", searchValue: "searchValue", disableSearch: "disableSearch" }, outputs: { showImgUploaded: "showImgUploaded" }, viewQueries: [{ propertyName: "content", first: true, predicate: ["outerElement"], descendants: true }], ngImport: i0, template: "<div class=\"pexels-lib\" #outerElement [@easeInOut]=\"'in'\">\n <perfect-scrollbar\n scrollYMarginOffset=\"300\"\n class=\"pexels-lib__scroll\"\n [ngClass]=\"{'pexels-lib__scroll--smallDisplay': stateDisplayed === 'small'}\"\n (psYReachEnd)=\"onBottomReached()\"\n >\n <div\n *ngIf=\"!disableSearch\"\n class=\"pexels-lib__search\"\n [ngClass]=\"{'pexels-lib__search--smallDisplay': stateDisplayed === 'small'}\"\n >\n <wz-input-search\n [(ngModel)]=\"searchValue\"\n [placeholder]=\"'ImgManager.SearchBar.placeholder' | translate\"\n (changeDebounced)=\"onSearchNameChanged()\"\n [smallPadding]=\"stateDisplayed === 'small'\">\n </wz-input-search>\n </div>\n\n <div *ngIf=\"!initComponent\" class=\"pexels-lib__wrapper\">\n <p *ngIf=\"nbResult\" class=\"pexels-lib__wrapper__result-nb\">{{ 'ImgManager.PexelLib.nbImgFound' | translate }} : {{ nbResult }}</p>\n\n <div class=\"pexels-lib__wrapper__result\">\n\n <div *ngFor=\"let photosColumn of photosColumns; let indexCol = index;\" class=\"pexels-lib__wrapper__result__column\" [@listAnimation]=\"photosColumn.photos.length\">\n <div *ngFor=\"let photo of photosColumn.photos; let indexPhoto = index;\" class=\"pexels-lib__wrapper__result__column__element\">\n\n <img [alt]=\"photo.src.medium\" [src]=\"photo.src.medium\"\n class=\"pexels-lib__wrapper__result__column__element__img\"/>\n\n <div class=\"pexels-lib__wrapper__result__column__element__wrapper\">\n <span class=\"pexels-lib__wrapper__result__column__element__wrapper__infos\">\n {{ photo.width }} x {{ photo.height}}\n </span>\n\n <div class=\"dropdown is-up\" [ngClass]=\"{'is-hoverable': !photo.uploading}\">\n <div class=\"dropdown-trigger\">\n <button\n class=\"button pexels-lib__wrapper__result__column__element__wrapper__button\"\n aria-haspopup=\"true\"\n aria-controls=\"dropdown-menu\">\n\n <div *ngIf=\"!photo.uploading\" (click)=\"uploadPhoto(photo, photo.src.large2x)\">\n <span>{{ 'ImgManager.PexelLib.import' | translate }}</span>\n <span class=\"icon is-small\">\n <i class=\"fas fa-angle-up\" aria-hidden=\"true\"></i>\n </span>\n <ng-container *ngIf=\"photo.uploaded\">\n <i class=\"fal fa-check\"></i>\n </ng-container>\n </div>\n\n <ng-container *ngIf=\"photo.uploading\">\n {{ 'ImgManager.PexelLib.importation' | translate }}\n <span btnLoadingAnim class=\"btnLoadingAnnimation\"></span>\n </ng-container>\n\n </button>\n </div>\n <div class=\"dropdown-menu pexels-lib__wrapper__result__column__element__wrapper__dropdown\" id=\"dropdown-menu\" role=\"menu\">\n <div class=\"dropdown-content\">\n <div class=\"dropdown-content__wrapper\">\n <div class=\"dropdown-item\" (click)=\"uploadPhoto(photo, photo.src.portrait)\">\n <p>{{ 'ImgManager.PexelLib.portrait' | translate }}</p>\n <i class=\"fal fa-check iPortrait\"></i>\n </div>\n <div class=\"dropdown-item\" (click)=\"uploadPhoto(photo, photo.src.landscape)\">\n <p>{{ 'ImgManager.PexelLib.landscape' | translate }}</p>\n <i class=\"fal fa-check iLandscape\"></i>\n </div>\n <div class=\"dropdown-item\" (click)=\"uploadPhoto(photo, photo.src.large2x)\">\n <p>{{ 'ImgManager.PexelLib.original' | translate }}</p>\n <i class=\"fal fa-check iOriginal\"></i>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n\n </div>\n </div>\n </div>\n </div>\n <ng-container *ngIf=\"isLoading\">\n <wz-loader></wz-loader>\n </ng-container>\n <div\n *ngIf=\"!isLoading && !nbResult\"\n class=\"pexels-lib__alert\"\n [@easeInOut]=\"'in'\">\n <wz-alert [warning]=\"true\">\n {{ 'ImgManager.PexelLib.noResult' | translate }}\n </wz-alert>\n </div>\n\n </perfect-scrollbar>\n</div>\n", dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3$1.PerfectScrollbarComponent, selector: "perfect-scrollbar", inputs: ["disabled", "usePSClass", "autoPropagation", "scrollIndicators", "config"], outputs: ["psScrollY", "psScrollX", "psScrollUp", "psScrollDown", "psScrollLeft", "psScrollRight", "psYReachEnd", "psYReachStart", "psXReachEnd", "psXReachStart"], exportAs: ["ngxPerfectScrollbar"] }, { kind: "component", type: LoaderComponent, selector: "wz-loader", inputs: ["text", "small", "position"] }, { kind: "component", type: InputSearchComponent, selector: "wz-input-search", inputs: ["placeholder", "smallPadding", "id"], outputs: ["changeDebounced"] }, { kind: "component", type: AlertComponent, selector: "wz-alert", inputs: ["icon", "warning", "success", "iconClass"] }, { kind: "directive", type: LoadingDirective, selector: "[btnLoadingAnim]" }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }], animations: [
|
|
1229
|
+
PexelLibComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.3", type: PexelLibComponent, selector: "pexels-lib", inputs: { stateDisplayed: "stateDisplayed", searchValue: "searchValue", disableSearch: "disableSearch" }, outputs: { showImgUploaded: "showImgUploaded" }, viewQueries: [{ propertyName: "content", first: true, predicate: ["outerElement"], descendants: true }], ngImport: i0, template: "<div class=\"pexels-lib\" #outerElement [@easeInOut]=\"'in'\">\n <perfect-scrollbar\n scrollYMarginOffset=\"300\"\n class=\"pexels-lib__scroll\"\n [ngClass]=\"{'pexels-lib__scroll--smallDisplay': stateDisplayed === 'small'}\"\n (psYReachEnd)=\"onBottomReached()\"\n >\n <div\n *ngIf=\"!disableSearch\"\n class=\"pexels-lib__search\"\n [ngClass]=\"{'pexels-lib__search--smallDisplay': stateDisplayed === 'small'}\"\n >\n <wz-input-search\n [(ngModel)]=\"searchValue\"\n [placeholder]=\"'ImgManager.SearchBar.placeholder' | translate\"\n (changeDebounced)=\"onSearchNameChanged()\"\n [smallPadding]=\"stateDisplayed === 'small'\">\n </wz-input-search>\n </div>\n\n <div *ngIf=\"!initComponent\" class=\"pexels-lib__wrapper\">\n <p *ngIf=\"nbResult\" class=\"pexels-lib__wrapper__result-nb\">{{ 'ImgManager.PexelLib.nbImgFound' | translate }} : {{ nbResult }}</p>\n\n <div class=\"pexels-lib__wrapper__result\">\n\n <div *ngFor=\"let photosColumn of photosColumns; let indexCol = index;\" class=\"pexels-lib__wrapper__result__column\" [@listAnimation]=\"photosColumn.photos.length\">\n <div *ngFor=\"let photo of photosColumn.photos; let indexPhoto = index;\" class=\"pexels-lib__wrapper__result__column__element\">\n\n <img [alt]=\"photo.src.medium\" [src]=\"photo.src.medium\"\n class=\"pexels-lib__wrapper__result__column__element__img\"/>\n\n <div class=\"pexels-lib__wrapper__result__column__element__wrapper\">\n <span class=\"pexels-lib__wrapper__result__column__element__wrapper__infos\">\n {{ photo.width }} x {{ photo.height}}\n </span>\n\n <div class=\"dropdown is-up\" [ngClass]=\"{'is-hoverable': !photo.uploading}\">\n <div class=\"dropdown-trigger\">\n <button\n type=\"button\"\n class=\"button pexels-lib__wrapper__result__column__element__wrapper__button\"\n aria-haspopup=\"true\"\n aria-controls=\"dropdown-menu\">\n\n <div *ngIf=\"!photo.uploading\" (click)=\"uploadPhoto(photo, photo.src.large2x)\">\n <span>{{ 'ImgManager.PexelLib.import' | translate }}</span>\n <span class=\"icon is-small\">\n <i class=\"fas fa-angle-up\" aria-hidden=\"true\"></i>\n </span>\n <ng-container *ngIf=\"photo.uploaded\">\n <i class=\"fal fa-check\"></i>\n </ng-container>\n </div>\n\n <ng-container *ngIf=\"photo.uploading\">\n {{ 'ImgManager.PexelLib.importation' | translate }}\n <span btnLoadingAnim class=\"btnLoadingAnnimation\"></span>\n </ng-container>\n\n </button>\n </div>\n <div class=\"dropdown-menu pexels-lib__wrapper__result__column__element__wrapper__dropdown\" id=\"dropdown-menu\" role=\"menu\">\n <div class=\"dropdown-content\">\n <div class=\"dropdown-content__wrapper\">\n <div class=\"dropdown-item\" (click)=\"uploadPhoto(photo, photo.src.portrait)\">\n <p>{{ 'ImgManager.PexelLib.portrait' | translate }}</p>\n <i class=\"fal fa-check iPortrait\"></i>\n </div>\n <div class=\"dropdown-item\" (click)=\"uploadPhoto(photo, photo.src.landscape)\">\n <p>{{ 'ImgManager.PexelLib.landscape' | translate }}</p>\n <i class=\"fal fa-check iLandscape\"></i>\n </div>\n <div class=\"dropdown-item\" (click)=\"uploadPhoto(photo, photo.src.large2x)\">\n <p>{{ 'ImgManager.PexelLib.original' | translate }}</p>\n <i class=\"fal fa-check iOriginal\"></i>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n\n </div>\n </div>\n </div>\n </div>\n <ng-container *ngIf=\"isLoading\">\n <wz-loader></wz-loader>\n </ng-container>\n <div\n *ngIf=\"!isLoading && !nbResult\"\n class=\"pexels-lib__alert\"\n [@easeInOut]=\"'in'\">\n <wz-alert [warning]=\"true\">\n {{ 'ImgManager.PexelLib.noResult' | translate }}\n </wz-alert>\n </div>\n\n </perfect-scrollbar>\n</div>\n", dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i3$1.PerfectScrollbarComponent, selector: "perfect-scrollbar", inputs: ["disabled", "usePSClass", "autoPropagation", "scrollIndicators", "config"], outputs: ["psScrollY", "psScrollX", "psScrollUp", "psScrollDown", "psScrollLeft", "psScrollRight", "psYReachEnd", "psYReachStart", "psXReachEnd", "psXReachStart"], exportAs: ["ngxPerfectScrollbar"] }, { kind: "component", type: LoaderComponent, selector: "wz-loader", inputs: ["text", "small", "position"] }, { kind: "component", type: InputSearchComponent, selector: "wz-input-search", inputs: ["placeholder", "smallPadding", "id"], outputs: ["changeDebounced"] }, { kind: "component", type: AlertComponent, selector: "wz-alert", inputs: ["icon", "warning", "success", "iconClass"] }, { kind: "directive", type: LoadingDirective, selector: "[btnLoadingAnim]" }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }], animations: [
|
|
1224
1230
|
easeInOut,
|
|
1225
1231
|
listAnnimation
|
|
1226
1232
|
] });
|
|
@@ -1229,7 +1235,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.3", ngImpor
|
|
|
1229
1235
|
args: [{ selector: 'pexels-lib', animations: [
|
|
1230
1236
|
easeInOut,
|
|
1231
1237
|
listAnnimation
|
|
1232
|
-
], template: "<div class=\"pexels-lib\" #outerElement [@easeInOut]=\"'in'\">\n <perfect-scrollbar\n scrollYMarginOffset=\"300\"\n class=\"pexels-lib__scroll\"\n [ngClass]=\"{'pexels-lib__scroll--smallDisplay': stateDisplayed === 'small'}\"\n (psYReachEnd)=\"onBottomReached()\"\n >\n <div\n *ngIf=\"!disableSearch\"\n class=\"pexels-lib__search\"\n [ngClass]=\"{'pexels-lib__search--smallDisplay': stateDisplayed === 'small'}\"\n >\n <wz-input-search\n [(ngModel)]=\"searchValue\"\n [placeholder]=\"'ImgManager.SearchBar.placeholder' | translate\"\n (changeDebounced)=\"onSearchNameChanged()\"\n [smallPadding]=\"stateDisplayed === 'small'\">\n </wz-input-search>\n </div>\n\n <div *ngIf=\"!initComponent\" class=\"pexels-lib__wrapper\">\n <p *ngIf=\"nbResult\" class=\"pexels-lib__wrapper__result-nb\">{{ 'ImgManager.PexelLib.nbImgFound' | translate }} : {{ nbResult }}</p>\n\n <div class=\"pexels-lib__wrapper__result\">\n\n <div *ngFor=\"let photosColumn of photosColumns; let indexCol = index;\" class=\"pexels-lib__wrapper__result__column\" [@listAnimation]=\"photosColumn.photos.length\">\n <div *ngFor=\"let photo of photosColumn.photos; let indexPhoto = index;\" class=\"pexels-lib__wrapper__result__column__element\">\n\n <img [alt]=\"photo.src.medium\" [src]=\"photo.src.medium\"\n class=\"pexels-lib__wrapper__result__column__element__img\"/>\n\n <div class=\"pexels-lib__wrapper__result__column__element__wrapper\">\n <span class=\"pexels-lib__wrapper__result__column__element__wrapper__infos\">\n {{ photo.width }} x {{ photo.height}}\n </span>\n\n <div class=\"dropdown is-up\" [ngClass]=\"{'is-hoverable': !photo.uploading}\">\n <div class=\"dropdown-trigger\">\n <button\n class=\"button pexels-lib__wrapper__result__column__element__wrapper__button\"\n aria-haspopup=\"true\"\n aria-controls=\"dropdown-menu\">\n\n <div *ngIf=\"!photo.uploading\" (click)=\"uploadPhoto(photo, photo.src.large2x)\">\n <span>{{ 'ImgManager.PexelLib.import' | translate }}</span>\n <span class=\"icon is-small\">\n <i class=\"fas fa-angle-up\" aria-hidden=\"true\"></i>\n </span>\n <ng-container *ngIf=\"photo.uploaded\">\n <i class=\"fal fa-check\"></i>\n </ng-container>\n </div>\n\n <ng-container *ngIf=\"photo.uploading\">\n {{ 'ImgManager.PexelLib.importation' | translate }}\n <span btnLoadingAnim class=\"btnLoadingAnnimation\"></span>\n </ng-container>\n\n </button>\n </div>\n <div class=\"dropdown-menu pexels-lib__wrapper__result__column__element__wrapper__dropdown\" id=\"dropdown-menu\" role=\"menu\">\n <div class=\"dropdown-content\">\n <div class=\"dropdown-content__wrapper\">\n <div class=\"dropdown-item\" (click)=\"uploadPhoto(photo, photo.src.portrait)\">\n <p>{{ 'ImgManager.PexelLib.portrait' | translate }}</p>\n <i class=\"fal fa-check iPortrait\"></i>\n </div>\n <div class=\"dropdown-item\" (click)=\"uploadPhoto(photo, photo.src.landscape)\">\n <p>{{ 'ImgManager.PexelLib.landscape' | translate }}</p>\n <i class=\"fal fa-check iLandscape\"></i>\n </div>\n <div class=\"dropdown-item\" (click)=\"uploadPhoto(photo, photo.src.large2x)\">\n <p>{{ 'ImgManager.PexelLib.original' | translate }}</p>\n <i class=\"fal fa-check iOriginal\"></i>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n\n </div>\n </div>\n </div>\n </div>\n <ng-container *ngIf=\"isLoading\">\n <wz-loader></wz-loader>\n </ng-container>\n <div\n *ngIf=\"!isLoading && !nbResult\"\n class=\"pexels-lib__alert\"\n [@easeInOut]=\"'in'\">\n <wz-alert [warning]=\"true\">\n {{ 'ImgManager.PexelLib.noResult' | translate }}\n </wz-alert>\n </div>\n\n </perfect-scrollbar>\n</div>\n" }]
|
|
1238
|
+
], template: "<div class=\"pexels-lib\" #outerElement [@easeInOut]=\"'in'\">\n <perfect-scrollbar\n scrollYMarginOffset=\"300\"\n class=\"pexels-lib__scroll\"\n [ngClass]=\"{'pexels-lib__scroll--smallDisplay': stateDisplayed === 'small'}\"\n (psYReachEnd)=\"onBottomReached()\"\n >\n <div\n *ngIf=\"!disableSearch\"\n class=\"pexels-lib__search\"\n [ngClass]=\"{'pexels-lib__search--smallDisplay': stateDisplayed === 'small'}\"\n >\n <wz-input-search\n [(ngModel)]=\"searchValue\"\n [placeholder]=\"'ImgManager.SearchBar.placeholder' | translate\"\n (changeDebounced)=\"onSearchNameChanged()\"\n [smallPadding]=\"stateDisplayed === 'small'\">\n </wz-input-search>\n </div>\n\n <div *ngIf=\"!initComponent\" class=\"pexels-lib__wrapper\">\n <p *ngIf=\"nbResult\" class=\"pexels-lib__wrapper__result-nb\">{{ 'ImgManager.PexelLib.nbImgFound' | translate }} : {{ nbResult }}</p>\n\n <div class=\"pexels-lib__wrapper__result\">\n\n <div *ngFor=\"let photosColumn of photosColumns; let indexCol = index;\" class=\"pexels-lib__wrapper__result__column\" [@listAnimation]=\"photosColumn.photos.length\">\n <div *ngFor=\"let photo of photosColumn.photos; let indexPhoto = index;\" class=\"pexels-lib__wrapper__result__column__element\">\n\n <img [alt]=\"photo.src.medium\" [src]=\"photo.src.medium\"\n class=\"pexels-lib__wrapper__result__column__element__img\"/>\n\n <div class=\"pexels-lib__wrapper__result__column__element__wrapper\">\n <span class=\"pexels-lib__wrapper__result__column__element__wrapper__infos\">\n {{ photo.width }} x {{ photo.height}}\n </span>\n\n <div class=\"dropdown is-up\" [ngClass]=\"{'is-hoverable': !photo.uploading}\">\n <div class=\"dropdown-trigger\">\n <button\n type=\"button\"\n class=\"button pexels-lib__wrapper__result__column__element__wrapper__button\"\n aria-haspopup=\"true\"\n aria-controls=\"dropdown-menu\">\n\n <div *ngIf=\"!photo.uploading\" (click)=\"uploadPhoto(photo, photo.src.large2x)\">\n <span>{{ 'ImgManager.PexelLib.import' | translate }}</span>\n <span class=\"icon is-small\">\n <i class=\"fas fa-angle-up\" aria-hidden=\"true\"></i>\n </span>\n <ng-container *ngIf=\"photo.uploaded\">\n <i class=\"fal fa-check\"></i>\n </ng-container>\n </div>\n\n <ng-container *ngIf=\"photo.uploading\">\n {{ 'ImgManager.PexelLib.importation' | translate }}\n <span btnLoadingAnim class=\"btnLoadingAnnimation\"></span>\n </ng-container>\n\n </button>\n </div>\n <div class=\"dropdown-menu pexels-lib__wrapper__result__column__element__wrapper__dropdown\" id=\"dropdown-menu\" role=\"menu\">\n <div class=\"dropdown-content\">\n <div class=\"dropdown-content__wrapper\">\n <div class=\"dropdown-item\" (click)=\"uploadPhoto(photo, photo.src.portrait)\">\n <p>{{ 'ImgManager.PexelLib.portrait' | translate }}</p>\n <i class=\"fal fa-check iPortrait\"></i>\n </div>\n <div class=\"dropdown-item\" (click)=\"uploadPhoto(photo, photo.src.landscape)\">\n <p>{{ 'ImgManager.PexelLib.landscape' | translate }}</p>\n <i class=\"fal fa-check iLandscape\"></i>\n </div>\n <div class=\"dropdown-item\" (click)=\"uploadPhoto(photo, photo.src.large2x)\">\n <p>{{ 'ImgManager.PexelLib.original' | translate }}</p>\n <i class=\"fal fa-check iOriginal\"></i>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n\n </div>\n </div>\n </div>\n </div>\n <ng-container *ngIf=\"isLoading\">\n <wz-loader></wz-loader>\n </ng-container>\n <div\n *ngIf=\"!isLoading && !nbResult\"\n class=\"pexels-lib__alert\"\n [@easeInOut]=\"'in'\">\n <wz-alert [warning]=\"true\">\n {{ 'ImgManager.PexelLib.noResult' | translate }}\n </wz-alert>\n </div>\n\n </perfect-scrollbar>\n</div>\n" }]
|
|
1233
1239
|
}], ctorParameters: function () { return [{ type: PexelsService }, { type: ImgManagerService }, { type: AlertService }, { type: i7.TranslateService }]; }, propDecorators: { stateDisplayed: [{
|
|
1234
1240
|
type: Input
|
|
1235
1241
|
}], searchValue: [{
|
|
@@ -1479,14 +1485,14 @@ class ImgCardComponent extends ImagesActionHandler {
|
|
|
1479
1485
|
}
|
|
1480
1486
|
}
|
|
1481
1487
|
ImgCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: ImgCardComponent, deps: [{ token: ImgManagerService }, { token: ImgSelectionService }, { token: i3.HttpClient }, { token: ImgCDNService }, { token: ImgEventService }, { token: AlertService }, { token: i7.TranslateService }, { token: ImgManagerConfigService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1482
|
-
ImgCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.3", type: ImgCardComponent, selector: "img-card", inputs: { tabDisplayed: "tabDisplayed", fullSize: "fullSize", picture: "picture", index: "index" }, outputs: { toggleImgSelected: "toggleImgSelected", switchDisplayWindow: "switchDisplayWindow" }, usesInheritance: true, ngImport: i0, template: "<div class=\"addCssPriority\" [@easeInOut]=\"'in'\" [ngClass]=\"{ 'fullSize': fullSize }\">\n <div class=\"img-card\">\n <div class=\"img-card__container\"\n [ngClass]=\"{\n 'smallDisplay': stateDisplayed === 'small' || isUploadSection,\n 'imgSelected': picture.selected,\n 'deletion': picture.deleted}\">\n <img\n class=\"img-card__container__img\"\n [src]=\"picture.file_name | imgSrc : '400'\"\n [alt]=\"picture.display_name\"\n (click)=\"onToggleImgSelected()\"\n (error)=\"picture.imgNotLoaded=true;onPictureNotLoading($event);\"\n />\n <div\n class=\"img-card__container__config\"\n *ngIf=\"!picture.deleted && stateDisplayed !== 'small'\"\n >\n <button class=\"size\"><i class=\"fal fa-image-polaroid\"></i><span>{{picture.raw_height}}x{{picture.raw_width}}</span></button>\n <button class=\"dl\" (click)=\"onDownloadImg(picture.display_name, picture.file_name)\"><i class=\"fal fa-download\"></i><span>{{ 'ImgManager.ImgCard.download' | translate }}</span></button>\n <button class=\"edit\" (click)=\"onEdit(picture)\"><i class=\"far fa-crop-alt\"></i><span>{{ 'ImgManager.ImgCard.edit' | translate }}</span></button>\n <button class=\"deleted\" (click)=\"activeConfirmDelete = true;\"><i class=\"fal fa-times\"></i><span>{{ 'ImgManager.ImgCard.del' | translate }}</span></button>\n <button class=\"selected\" (click)=\"onToggleImgSelected()\" *ngIf=\"stateDisplayed !== 'window'\">\n <i *ngIf=\"!picture.selected\" class=\"fal fa-square\"></i>\n <i *ngIf=\"picture.selected\" class=\"fas fa-check-square checked\"></i>\n <span>{{ 'ImgManager.ImgCard.select' | translate }}</span>\n </button>\n </div>\n <div\n class=\"img-card__container__config img-card__container__config--small\"\n *ngIf=\"!picture.deleted && stateDisplayed === 'small'\"\n >\n <button class=\"show-edit\" (click)=\"displayLargeWindow()\"><i class=\"fas fa-edit\"></i></button>\n </div>\n <div class=\"img-card__container__delete\" [ngClass]=\"{ 'show' : activeConfirmDelete}\">\n <span>{{ 'ImgManager.ImgCard.confirmDeleteImg' | translate }}</span>\n <div>\n <button (click)=\"activeConfirmDelete = false;\">{{ 'no' | translate }}</button>\n <button (click)=\"onRemoveImg(picture);activeConfirmDelete = false;\">{{ 'yes' | translate }}</button>\n </div>\n </div>\n <div class=\"img-card__container__valid\" *ngIf=\"stateDisplayed === 'small' && tabDisplayed == 'img-upload'\">\n <i class=\"far fa-check\"></i>\n <span>{{ 'ImgManager.ImgCard.validImgSmall' | translate }}</span>\n </div>\n <div\n *ngIf=\"picture.imgNotLoaded\"\n class=\"img-card__container__overlay\"\n [ngClass]=\"{'img-card__container__overlay--smallDisplay': stateDisplayed === 'small' || isUploadSection}\">\n <i (click)=\"onToggleImgSelected()\" class=\"fad fa-folder-times\"></i>\n </div>\n <span btnLoadingAnim class=\"btnLoadingAnnimation\" *ngIf=\"picture.deleted\"></span>\n\n </div>\n <div\n class=\"img-card__nameContainer\"\n [ngClass]=\"{'smallNameDisplay': stateDisplayed === 'small' || isUploadSection, 'focus': focusInput}\">\n <input\n type=\"text\"\n class=\"wzImgMngInput img-card__nameContainer__name\"\n [(ngModel)]=\"picture.display_name\"\n (ngModelChange)=\"onNameChange(picture.id_file)\"\n (focus)=\"previousName=picture.display_name;focusInput = true;\"\n (blur)=\"focusInput = false;\"\n >\n <span>{{picture.display_name}}</span>\n </div>\n\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: LoadingDirective, selector: "[btnLoadingAnim]" }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }, { kind: "pipe", type: ImageSrcPipe, name: "imgSrc" }], animations: [
|
|
1488
|
+
ImgCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.3", type: ImgCardComponent, selector: "img-card", inputs: { tabDisplayed: "tabDisplayed", fullSize: "fullSize", picture: "picture", index: "index" }, outputs: { toggleImgSelected: "toggleImgSelected", switchDisplayWindow: "switchDisplayWindow" }, usesInheritance: true, ngImport: i0, template: "<div class=\"addCssPriority\" [@easeInOut]=\"'in'\" [ngClass]=\"{ 'fullSize': fullSize }\">\n <div class=\"img-card\">\n <div class=\"img-card__container\"\n [ngClass]=\"{\n 'smallDisplay': stateDisplayed === 'small' || isUploadSection,\n 'imgSelected': picture.selected,\n 'deletion': picture.deleted}\">\n <img\n class=\"img-card__container__img\"\n [src]=\"picture.file_name | imgSrc : '400'\"\n [alt]=\"picture.display_name\"\n (click)=\"onToggleImgSelected()\"\n (error)=\"picture.imgNotLoaded=true;onPictureNotLoading($event);\"\n />\n <div\n class=\"img-card__container__config\"\n *ngIf=\"!picture.deleted && stateDisplayed !== 'small'\"\n >\n <button type=\"button\" class=\"size\"><i class=\"fal fa-image-polaroid\"></i><span>{{picture.raw_height}}x{{picture.raw_width}}</span></button>\n <button type=\"button\" class=\"dl\" (click)=\"onDownloadImg(picture.display_name, picture.file_name)\"><i class=\"fal fa-download\"></i><span>{{ 'ImgManager.ImgCard.download' | translate }}</span></button>\n <button type=\"button\" class=\"edit\" (click)=\"onEdit(picture)\"><i class=\"far fa-crop-alt\"></i><span>{{ 'ImgManager.ImgCard.edit' | translate }}</span></button>\n <button type=\"button\" class=\"deleted\" (click)=\"activeConfirmDelete = true;\"><i class=\"fal fa-times\"></i><span>{{ 'ImgManager.ImgCard.del' | translate }}</span></button>\n <button type=\"button\" class=\"selected\" (click)=\"onToggleImgSelected()\" *ngIf=\"stateDisplayed !== 'window'\">\n <i *ngIf=\"!picture.selected\" class=\"fal fa-square\"></i>\n <i *ngIf=\"picture.selected\" class=\"fas fa-check-square checked\"></i>\n <span>{{ 'ImgManager.ImgCard.select' | translate }}</span>\n </button>\n </div>\n <div\n class=\"img-card__container__config img-card__container__config--small\"\n *ngIf=\"!picture.deleted && stateDisplayed === 'small'\"\n >\n <button class=\"show-edit\" (click)=\"displayLargeWindow()\"><i class=\"fas fa-edit\"></i></button>\n </div>\n <div class=\"img-card__container__delete\" [ngClass]=\"{ 'show' : activeConfirmDelete}\">\n <span>{{ 'ImgManager.ImgCard.confirmDeleteImg' | translate }}</span>\n <div>\n <button (click)=\"activeConfirmDelete = false;\">{{ 'no' | translate }}</button>\n <button (click)=\"onRemoveImg(picture);activeConfirmDelete = false;\">{{ 'yes' | translate }}</button>\n </div>\n </div>\n <div class=\"img-card__container__valid\" *ngIf=\"stateDisplayed === 'small' && tabDisplayed == 'img-upload'\">\n <i class=\"far fa-check\"></i>\n <span>{{ 'ImgManager.ImgCard.validImgSmall' | translate }}</span>\n </div>\n <div\n *ngIf=\"picture.imgNotLoaded\"\n class=\"img-card__container__overlay\"\n [ngClass]=\"{'img-card__container__overlay--smallDisplay': stateDisplayed === 'small' || isUploadSection}\">\n <i (click)=\"onToggleImgSelected()\" class=\"fad fa-folder-times\"></i>\n </div>\n <span btnLoadingAnim class=\"btnLoadingAnnimation\" *ngIf=\"picture.deleted\"></span>\n\n </div>\n <div\n class=\"img-card__nameContainer\"\n [ngClass]=\"{'smallNameDisplay': stateDisplayed === 'small' || isUploadSection, 'focus': focusInput}\">\n <input\n type=\"text\"\n class=\"wzImgMngInput img-card__nameContainer__name\"\n [(ngModel)]=\"picture.display_name\"\n (ngModelChange)=\"onNameChange(picture.id_file)\"\n (focus)=\"previousName=picture.display_name;focusInput = true;\"\n (blur)=\"focusInput = false;\"\n >\n <span>{{picture.display_name}}</span>\n </div>\n\n </div>\n</div>\n", dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: LoadingDirective, selector: "[btnLoadingAnim]" }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }, { kind: "pipe", type: ImageSrcPipe, name: "imgSrc" }], animations: [
|
|
1483
1489
|
easeInOut
|
|
1484
1490
|
] });
|
|
1485
1491
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: ImgCardComponent, decorators: [{
|
|
1486
1492
|
type: Component,
|
|
1487
1493
|
args: [{ selector: 'img-card', animations: [
|
|
1488
1494
|
easeInOut
|
|
1489
|
-
], template: "<div class=\"addCssPriority\" [@easeInOut]=\"'in'\" [ngClass]=\"{ 'fullSize': fullSize }\">\n <div class=\"img-card\">\n <div class=\"img-card__container\"\n [ngClass]=\"{\n 'smallDisplay': stateDisplayed === 'small' || isUploadSection,\n 'imgSelected': picture.selected,\n 'deletion': picture.deleted}\">\n <img\n class=\"img-card__container__img\"\n [src]=\"picture.file_name | imgSrc : '400'\"\n [alt]=\"picture.display_name\"\n (click)=\"onToggleImgSelected()\"\n (error)=\"picture.imgNotLoaded=true;onPictureNotLoading($event);\"\n />\n <div\n class=\"img-card__container__config\"\n *ngIf=\"!picture.deleted && stateDisplayed !== 'small'\"\n >\n <button class=\"size\"><i class=\"fal fa-image-polaroid\"></i><span>{{picture.raw_height}}x{{picture.raw_width}}</span></button>\n <button class=\"dl\" (click)=\"onDownloadImg(picture.display_name, picture.file_name)\"><i class=\"fal fa-download\"></i><span>{{ 'ImgManager.ImgCard.download' | translate }}</span></button>\n <button class=\"edit\" (click)=\"onEdit(picture)\"><i class=\"far fa-crop-alt\"></i><span>{{ 'ImgManager.ImgCard.edit' | translate }}</span></button>\n <button class=\"deleted\" (click)=\"activeConfirmDelete = true;\"><i class=\"fal fa-times\"></i><span>{{ 'ImgManager.ImgCard.del' | translate }}</span></button>\n <button class=\"selected\" (click)=\"onToggleImgSelected()\" *ngIf=\"stateDisplayed !== 'window'\">\n <i *ngIf=\"!picture.selected\" class=\"fal fa-square\"></i>\n <i *ngIf=\"picture.selected\" class=\"fas fa-check-square checked\"></i>\n <span>{{ 'ImgManager.ImgCard.select' | translate }}</span>\n </button>\n </div>\n <div\n class=\"img-card__container__config img-card__container__config--small\"\n *ngIf=\"!picture.deleted && stateDisplayed === 'small'\"\n >\n <button class=\"show-edit\" (click)=\"displayLargeWindow()\"><i class=\"fas fa-edit\"></i></button>\n </div>\n <div class=\"img-card__container__delete\" [ngClass]=\"{ 'show' : activeConfirmDelete}\">\n <span>{{ 'ImgManager.ImgCard.confirmDeleteImg' | translate }}</span>\n <div>\n <button (click)=\"activeConfirmDelete = false;\">{{ 'no' | translate }}</button>\n <button (click)=\"onRemoveImg(picture);activeConfirmDelete = false;\">{{ 'yes' | translate }}</button>\n </div>\n </div>\n <div class=\"img-card__container__valid\" *ngIf=\"stateDisplayed === 'small' && tabDisplayed == 'img-upload'\">\n <i class=\"far fa-check\"></i>\n <span>{{ 'ImgManager.ImgCard.validImgSmall' | translate }}</span>\n </div>\n <div\n *ngIf=\"picture.imgNotLoaded\"\n class=\"img-card__container__overlay\"\n [ngClass]=\"{'img-card__container__overlay--smallDisplay': stateDisplayed === 'small' || isUploadSection}\">\n <i (click)=\"onToggleImgSelected()\" class=\"fad fa-folder-times\"></i>\n </div>\n <span btnLoadingAnim class=\"btnLoadingAnnimation\" *ngIf=\"picture.deleted\"></span>\n\n </div>\n <div\n class=\"img-card__nameContainer\"\n [ngClass]=\"{'smallNameDisplay': stateDisplayed === 'small' || isUploadSection, 'focus': focusInput}\">\n <input\n type=\"text\"\n class=\"wzImgMngInput img-card__nameContainer__name\"\n [(ngModel)]=\"picture.display_name\"\n (ngModelChange)=\"onNameChange(picture.id_file)\"\n (focus)=\"previousName=picture.display_name;focusInput = true;\"\n (blur)=\"focusInput = false;\"\n >\n <span>{{picture.display_name}}</span>\n </div>\n\n </div>\n</div>\n" }]
|
|
1495
|
+
], template: "<div class=\"addCssPriority\" [@easeInOut]=\"'in'\" [ngClass]=\"{ 'fullSize': fullSize }\">\n <div class=\"img-card\">\n <div class=\"img-card__container\"\n [ngClass]=\"{\n 'smallDisplay': stateDisplayed === 'small' || isUploadSection,\n 'imgSelected': picture.selected,\n 'deletion': picture.deleted}\">\n <img\n class=\"img-card__container__img\"\n [src]=\"picture.file_name | imgSrc : '400'\"\n [alt]=\"picture.display_name\"\n (click)=\"onToggleImgSelected()\"\n (error)=\"picture.imgNotLoaded=true;onPictureNotLoading($event);\"\n />\n <div\n class=\"img-card__container__config\"\n *ngIf=\"!picture.deleted && stateDisplayed !== 'small'\"\n >\n <button type=\"button\" class=\"size\"><i class=\"fal fa-image-polaroid\"></i><span>{{picture.raw_height}}x{{picture.raw_width}}</span></button>\n <button type=\"button\" class=\"dl\" (click)=\"onDownloadImg(picture.display_name, picture.file_name)\"><i class=\"fal fa-download\"></i><span>{{ 'ImgManager.ImgCard.download' | translate }}</span></button>\n <button type=\"button\" class=\"edit\" (click)=\"onEdit(picture)\"><i class=\"far fa-crop-alt\"></i><span>{{ 'ImgManager.ImgCard.edit' | translate }}</span></button>\n <button type=\"button\" class=\"deleted\" (click)=\"activeConfirmDelete = true;\"><i class=\"fal fa-times\"></i><span>{{ 'ImgManager.ImgCard.del' | translate }}</span></button>\n <button type=\"button\" class=\"selected\" (click)=\"onToggleImgSelected()\" *ngIf=\"stateDisplayed !== 'window'\">\n <i *ngIf=\"!picture.selected\" class=\"fal fa-square\"></i>\n <i *ngIf=\"picture.selected\" class=\"fas fa-check-square checked\"></i>\n <span>{{ 'ImgManager.ImgCard.select' | translate }}</span>\n </button>\n </div>\n <div\n class=\"img-card__container__config img-card__container__config--small\"\n *ngIf=\"!picture.deleted && stateDisplayed === 'small'\"\n >\n <button class=\"show-edit\" (click)=\"displayLargeWindow()\"><i class=\"fas fa-edit\"></i></button>\n </div>\n <div class=\"img-card__container__delete\" [ngClass]=\"{ 'show' : activeConfirmDelete}\">\n <span>{{ 'ImgManager.ImgCard.confirmDeleteImg' | translate }}</span>\n <div>\n <button (click)=\"activeConfirmDelete = false;\">{{ 'no' | translate }}</button>\n <button (click)=\"onRemoveImg(picture);activeConfirmDelete = false;\">{{ 'yes' | translate }}</button>\n </div>\n </div>\n <div class=\"img-card__container__valid\" *ngIf=\"stateDisplayed === 'small' && tabDisplayed == 'img-upload'\">\n <i class=\"far fa-check\"></i>\n <span>{{ 'ImgManager.ImgCard.validImgSmall' | translate }}</span>\n </div>\n <div\n *ngIf=\"picture.imgNotLoaded\"\n class=\"img-card__container__overlay\"\n [ngClass]=\"{'img-card__container__overlay--smallDisplay': stateDisplayed === 'small' || isUploadSection}\">\n <i (click)=\"onToggleImgSelected()\" class=\"fad fa-folder-times\"></i>\n </div>\n <span btnLoadingAnim class=\"btnLoadingAnnimation\" *ngIf=\"picture.deleted\"></span>\n\n </div>\n <div\n class=\"img-card__nameContainer\"\n [ngClass]=\"{'smallNameDisplay': stateDisplayed === 'small' || isUploadSection, 'focus': focusInput}\">\n <input\n type=\"text\"\n class=\"wzImgMngInput img-card__nameContainer__name\"\n [(ngModel)]=\"picture.display_name\"\n (ngModelChange)=\"onNameChange(picture.id_file)\"\n (focus)=\"previousName=picture.display_name;focusInput = true;\"\n (blur)=\"focusInput = false;\"\n >\n <span>{{picture.display_name}}</span>\n </div>\n\n </div>\n</div>\n" }]
|
|
1490
1496
|
}], ctorParameters: function () { return [{ type: ImgManagerService }, { type: ImgSelectionService }, { type: i3.HttpClient }, { type: ImgCDNService }, { type: ImgEventService }, { type: AlertService }, { type: i7.TranslateService }, { type: ImgManagerConfigService }]; }, propDecorators: { tabDisplayed: [{
|
|
1491
1497
|
type: Input
|
|
1492
1498
|
}], fullSize: [{
|
|
@@ -1551,14 +1557,14 @@ class UploadListComponent {
|
|
|
1551
1557
|
}
|
|
1552
1558
|
}
|
|
1553
1559
|
UploadListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: UploadListComponent, deps: [{ token: ImgSelectionService }, { token: RenamePictureService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1554
|
-
UploadListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.3", type: UploadListComponent, selector: "upload-list", inputs: { stateDisplayed: "stateDisplayed", tabDisplayed: "tabDisplayed", multipleImgMode: "multipleImgMode" }, outputs: { switchDisplayWindow: "switchDisplayWindow" }, ngImport: i0, template: "<div class=\"upload-list\" [ngClass]=\"{'smallDisplay': stateDisplayed === 'small'}\" [@easeInOut]=\"'in'\">\n\n <perfect-scrollbar\n #scrollable\n [config]=\"{ suppressScrollX: true }\"\n class=\"upload-list__scroll\"\n [ngClass]=\"{\n 'upload-list__scroll--smallDisplay': stateDisplayed === 'small',\n 'upload-list__scroll--window': stateDisplayed === 'window'}\"\n >\n <div class=\"upload-list__box\">\n <div class=\"upload-list__box__container\">\n <div>\n <p class=\"mainColor\">\n {{ picturesList? picturesList.length : '' }}\n <ng-container *ngIf=\"picturesList && picturesList.length > 1\">{{ 'ImgManager.UploadList.imgSuccessImport' | translate }}</ng-container>\n <ng-container *ngIf=\"picturesList && picturesList.length === 1\">{{ 'ImgManager.UploadList.imgSuccessImportOne' | translate }}</ng-container>\n </p>\n <div class=\"dropdown is-hoverable\">\n <div class=\"dropdown-trigger\">\n <i\n aria-haspopup=\"true\" aria-controls=\"dropdown-menuInfoSeo\"\n class=\"fas fa-info-circle\">\n </i>\n </div>\n <div class=\"dropdown-menu dropDownShadow\" id=\"dropdown-menuInfoSeo\" role=\"menu\">\n <div class=\"dropdown-content\">\n <div class=\"dropdown-item\">\n <p>{{ 'ImgManager.UploadList.seo.rezise' | translate }}</p>\n <p><i class=\"fal fa-check\"></i> 100%</p>\n </div>\n <div class=\"dropdown-item\">\n <p>{{ 'ImgManager.UploadList.seo.webp' | translate }}</p>\n <p><i class=\"fal fa-check\"></i> 100%</p>\n </div>\n <div class=\"dropdown-item\">\n <p>{{ 'ImgManager.UploadList.seo.cdn' | translate }}</p>\n <p><i class=\"fal fa-check\"></i> 100%</p>\n </div>\n <div class=\"dropdown-item\">\n <p>{{ 'ImgManager.UploadList.seo.lazyloading' | translate }}</p>\n <p><i class=\"fal fa-check\"></i> 100%</p>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"upload-list__box__cards\">\n <div class=\"upload-list__box__cards__card\" *ngFor=\"let picture of picturesList; let index = index;\">\n <img-card\n [picture]=\"picture\"\n [stateDisplayed]=\"stateDisplayed\"\n (toggleImgSelected)=\"onToggleSelectImg(index)\"\n (switchDisplayWindow)=\"switchDisplayWindowCard()\"\n (pictureNameChange)=\"onRenamePicture($event)\"\n ></img-card>\n <div class=\"upload-list__box__cards__card__btnBox\">\n <button class=\"button success upload-list__box__cards__card__btnBox__btn\"><i class=\"fal fa-check\"></i></button>\n </div>\n </div>\n </div>\n </div>\n </perfect-scrollbar>\n</div>\n", dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3$1.PerfectScrollbarComponent, selector: "perfect-scrollbar", inputs: ["disabled", "usePSClass", "autoPropagation", "scrollIndicators", "config"], outputs: ["psScrollY", "psScrollX", "psScrollUp", "psScrollDown", "psScrollLeft", "psScrollRight", "psYReachEnd", "psYReachStart", "psXReachEnd", "psXReachStart"], exportAs: ["ngxPerfectScrollbar"] }, { kind: "component", type: ImgCardComponent, selector: "img-card", inputs: ["tabDisplayed", "fullSize", "picture", "index"], outputs: ["toggleImgSelected", "switchDisplayWindow"] }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }], animations: [
|
|
1560
|
+
UploadListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.3", type: UploadListComponent, selector: "upload-list", inputs: { stateDisplayed: "stateDisplayed", tabDisplayed: "tabDisplayed", multipleImgMode: "multipleImgMode" }, outputs: { switchDisplayWindow: "switchDisplayWindow" }, ngImport: i0, template: "<div class=\"upload-list\" [ngClass]=\"{'smallDisplay': stateDisplayed === 'small'}\" [@easeInOut]=\"'in'\">\n\n <perfect-scrollbar\n #scrollable\n [config]=\"{ suppressScrollX: true }\"\n class=\"upload-list__scroll\"\n [ngClass]=\"{\n 'upload-list__scroll--smallDisplay': stateDisplayed === 'small',\n 'upload-list__scroll--window': stateDisplayed === 'window'}\"\n >\n <div class=\"upload-list__box\">\n <div class=\"upload-list__box__container\">\n <div>\n <p class=\"mainColor\">\n {{ picturesList? picturesList.length : '' }}\n <ng-container *ngIf=\"picturesList && picturesList.length > 1\">{{ 'ImgManager.UploadList.imgSuccessImport' | translate }}</ng-container>\n <ng-container *ngIf=\"picturesList && picturesList.length === 1\">{{ 'ImgManager.UploadList.imgSuccessImportOne' | translate }}</ng-container>\n </p>\n <div class=\"dropdown is-hoverable\">\n <div class=\"dropdown-trigger\">\n <i\n aria-haspopup=\"true\" aria-controls=\"dropdown-menuInfoSeo\"\n class=\"fas fa-info-circle\">\n </i>\n </div>\n <div class=\"dropdown-menu dropDownShadow\" id=\"dropdown-menuInfoSeo\" role=\"menu\">\n <div class=\"dropdown-content\">\n <div class=\"dropdown-item\">\n <p>{{ 'ImgManager.UploadList.seo.rezise' | translate }}</p>\n <p><i class=\"fal fa-check\"></i> 100%</p>\n </div>\n <div class=\"dropdown-item\">\n <p>{{ 'ImgManager.UploadList.seo.webp' | translate }}</p>\n <p><i class=\"fal fa-check\"></i> 100%</p>\n </div>\n <div class=\"dropdown-item\">\n <p>{{ 'ImgManager.UploadList.seo.cdn' | translate }}</p>\n <p><i class=\"fal fa-check\"></i> 100%</p>\n </div>\n <div class=\"dropdown-item\">\n <p>{{ 'ImgManager.UploadList.seo.lazyloading' | translate }}</p>\n <p><i class=\"fal fa-check\"></i> 100%</p>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"upload-list__box__cards\">\n <div class=\"upload-list__box__cards__card\" *ngFor=\"let picture of picturesList; let index = index;\">\n <img-card\n [picture]=\"picture\"\n [stateDisplayed]=\"stateDisplayed\"\n (toggleImgSelected)=\"onToggleSelectImg(index)\"\n (switchDisplayWindow)=\"switchDisplayWindowCard()\"\n (pictureNameChange)=\"onRenamePicture($event)\"\n ></img-card>\n <div class=\"upload-list__box__cards__card__btnBox\">\n <button type=\"button\" class=\"button success upload-list__box__cards__card__btnBox__btn\"><i class=\"fal fa-check\"></i></button>\n </div>\n </div>\n </div>\n </div>\n </perfect-scrollbar>\n</div>\n", dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3$1.PerfectScrollbarComponent, selector: "perfect-scrollbar", inputs: ["disabled", "usePSClass", "autoPropagation", "scrollIndicators", "config"], outputs: ["psScrollY", "psScrollX", "psScrollUp", "psScrollDown", "psScrollLeft", "psScrollRight", "psYReachEnd", "psYReachStart", "psXReachEnd", "psXReachStart"], exportAs: ["ngxPerfectScrollbar"] }, { kind: "component", type: ImgCardComponent, selector: "img-card", inputs: ["tabDisplayed", "fullSize", "picture", "index"], outputs: ["toggleImgSelected", "switchDisplayWindow"] }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }], animations: [
|
|
1555
1561
|
easeInOut
|
|
1556
1562
|
] });
|
|
1557
1563
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: UploadListComponent, decorators: [{
|
|
1558
1564
|
type: Component,
|
|
1559
1565
|
args: [{ selector: 'upload-list', animations: [
|
|
1560
1566
|
easeInOut
|
|
1561
|
-
], template: "<div class=\"upload-list\" [ngClass]=\"{'smallDisplay': stateDisplayed === 'small'}\" [@easeInOut]=\"'in'\">\n\n <perfect-scrollbar\n #scrollable\n [config]=\"{ suppressScrollX: true }\"\n class=\"upload-list__scroll\"\n [ngClass]=\"{\n 'upload-list__scroll--smallDisplay': stateDisplayed === 'small',\n 'upload-list__scroll--window': stateDisplayed === 'window'}\"\n >\n <div class=\"upload-list__box\">\n <div class=\"upload-list__box__container\">\n <div>\n <p class=\"mainColor\">\n {{ picturesList? picturesList.length : '' }}\n <ng-container *ngIf=\"picturesList && picturesList.length > 1\">{{ 'ImgManager.UploadList.imgSuccessImport' | translate }}</ng-container>\n <ng-container *ngIf=\"picturesList && picturesList.length === 1\">{{ 'ImgManager.UploadList.imgSuccessImportOne' | translate }}</ng-container>\n </p>\n <div class=\"dropdown is-hoverable\">\n <div class=\"dropdown-trigger\">\n <i\n aria-haspopup=\"true\" aria-controls=\"dropdown-menuInfoSeo\"\n class=\"fas fa-info-circle\">\n </i>\n </div>\n <div class=\"dropdown-menu dropDownShadow\" id=\"dropdown-menuInfoSeo\" role=\"menu\">\n <div class=\"dropdown-content\">\n <div class=\"dropdown-item\">\n <p>{{ 'ImgManager.UploadList.seo.rezise' | translate }}</p>\n <p><i class=\"fal fa-check\"></i> 100%</p>\n </div>\n <div class=\"dropdown-item\">\n <p>{{ 'ImgManager.UploadList.seo.webp' | translate }}</p>\n <p><i class=\"fal fa-check\"></i> 100%</p>\n </div>\n <div class=\"dropdown-item\">\n <p>{{ 'ImgManager.UploadList.seo.cdn' | translate }}</p>\n <p><i class=\"fal fa-check\"></i> 100%</p>\n </div>\n <div class=\"dropdown-item\">\n <p>{{ 'ImgManager.UploadList.seo.lazyloading' | translate }}</p>\n <p><i class=\"fal fa-check\"></i> 100%</p>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"upload-list__box__cards\">\n <div class=\"upload-list__box__cards__card\" *ngFor=\"let picture of picturesList; let index = index;\">\n <img-card\n [picture]=\"picture\"\n [stateDisplayed]=\"stateDisplayed\"\n (toggleImgSelected)=\"onToggleSelectImg(index)\"\n (switchDisplayWindow)=\"switchDisplayWindowCard()\"\n (pictureNameChange)=\"onRenamePicture($event)\"\n ></img-card>\n <div class=\"upload-list__box__cards__card__btnBox\">\n <button class=\"button success upload-list__box__cards__card__btnBox__btn\"><i class=\"fal fa-check\"></i></button>\n </div>\n </div>\n </div>\n </div>\n </perfect-scrollbar>\n</div>\n" }]
|
|
1567
|
+
], template: "<div class=\"upload-list\" [ngClass]=\"{'smallDisplay': stateDisplayed === 'small'}\" [@easeInOut]=\"'in'\">\n\n <perfect-scrollbar\n #scrollable\n [config]=\"{ suppressScrollX: true }\"\n class=\"upload-list__scroll\"\n [ngClass]=\"{\n 'upload-list__scroll--smallDisplay': stateDisplayed === 'small',\n 'upload-list__scroll--window': stateDisplayed === 'window'}\"\n >\n <div class=\"upload-list__box\">\n <div class=\"upload-list__box__container\">\n <div>\n <p class=\"mainColor\">\n {{ picturesList? picturesList.length : '' }}\n <ng-container *ngIf=\"picturesList && picturesList.length > 1\">{{ 'ImgManager.UploadList.imgSuccessImport' | translate }}</ng-container>\n <ng-container *ngIf=\"picturesList && picturesList.length === 1\">{{ 'ImgManager.UploadList.imgSuccessImportOne' | translate }}</ng-container>\n </p>\n <div class=\"dropdown is-hoverable\">\n <div class=\"dropdown-trigger\">\n <i\n aria-haspopup=\"true\" aria-controls=\"dropdown-menuInfoSeo\"\n class=\"fas fa-info-circle\">\n </i>\n </div>\n <div class=\"dropdown-menu dropDownShadow\" id=\"dropdown-menuInfoSeo\" role=\"menu\">\n <div class=\"dropdown-content\">\n <div class=\"dropdown-item\">\n <p>{{ 'ImgManager.UploadList.seo.rezise' | translate }}</p>\n <p><i class=\"fal fa-check\"></i> 100%</p>\n </div>\n <div class=\"dropdown-item\">\n <p>{{ 'ImgManager.UploadList.seo.webp' | translate }}</p>\n <p><i class=\"fal fa-check\"></i> 100%</p>\n </div>\n <div class=\"dropdown-item\">\n <p>{{ 'ImgManager.UploadList.seo.cdn' | translate }}</p>\n <p><i class=\"fal fa-check\"></i> 100%</p>\n </div>\n <div class=\"dropdown-item\">\n <p>{{ 'ImgManager.UploadList.seo.lazyloading' | translate }}</p>\n <p><i class=\"fal fa-check\"></i> 100%</p>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"upload-list__box__cards\">\n <div class=\"upload-list__box__cards__card\" *ngFor=\"let picture of picturesList; let index = index;\">\n <img-card\n [picture]=\"picture\"\n [stateDisplayed]=\"stateDisplayed\"\n (toggleImgSelected)=\"onToggleSelectImg(index)\"\n (switchDisplayWindow)=\"switchDisplayWindowCard()\"\n (pictureNameChange)=\"onRenamePicture($event)\"\n ></img-card>\n <div class=\"upload-list__box__cards__card__btnBox\">\n <button type=\"button\" class=\"button success upload-list__box__cards__card__btnBox__btn\"><i class=\"fal fa-check\"></i></button>\n </div>\n </div>\n </div>\n </div>\n </perfect-scrollbar>\n</div>\n" }]
|
|
1562
1568
|
}], ctorParameters: function () { return [{ type: ImgSelectionService }, { type: RenamePictureService }]; }, propDecorators: { stateDisplayed: [{
|
|
1563
1569
|
type: Input
|
|
1564
1570
|
}], tabDisplayed: [{
|
|
@@ -1634,10 +1640,10 @@ class EditorInfoSectionComponent {
|
|
|
1634
1640
|
}
|
|
1635
1641
|
}
|
|
1636
1642
|
EditorInfoSectionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: EditorInfoSectionComponent, deps: [{ token: AlertService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1637
|
-
EditorInfoSectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.3", type: EditorInfoSectionComponent, selector: "info-section", inputs: { imgToEdit: "imgToEdit", isNameModified: "isNameModified" }, outputs: { isNameModifiedChange: "isNameModifiedChange" }, ngImport: i0, template: "\n<!-- Img properties -->\n<div class=\"img-editor__infoSection__propertyEditable\">\n <p class=\"mainColor\">\n {{ 'ImgManager.UploadList.properties.imgName' | translate }}\n <span class=\"img-editor__infoSection__propertyEditable__tooltips\" [nwbToolTip]=\"'ImgManager.ImgEditor.NameInfo' | translate\" [nwbToolTipIsMultiline]=\"true\" nwbToolTipPosition=\"right\"><i class=\"fas fa-info-circle\"></i></span>\n </p>\n <input\n type=\"text\"\n class=\"img-editor__infoSection__propertyEditable__input\"\n placeholder=\"{{'ImgManager.ImgEditor.nameEx' | translate}} \"\n [(ngModel)]=\"imgToEdit.display_name\"\n debounceKeyUp\n [debounceTime]=\"500\"\n (onEventChange)=\"onNameChange()\">\n</div>\n<div class=\"img-editor__infoSection__propertyEditable\">\n <p class=\"mainColor\">{{ 'ImgManager.UploadList.properties.imgURL' | translate }}</p>\n <button [copy-clipboard]=\"imgToEdit.file_name | imgSrc : 'raw'\" (copied)=\"copyToClipBoard($event)\" ><span class=\"img-editor__infoSection__propertyEditable__span\">{{imgToEdit.file_name}}</span> <i class=\"far fa-copy\"></i></button>\n</div>\n<div class=\"img-editor__infoSection__property\">\n <p class=\"mainColor\">{{ 'ImgManager.UploadList.properties.imgSize' | translate }} :</p>\n <p>{{imgToEdit.raw_height}}*{{imgToEdit.raw_width}}px</p>\n</div>\n<div class=\"img-editor__infoSection__property\">\n <p class=\"mainColor\">{{ 'ImgManager.UploadList.properties.imgWeight' | translate }} :</p>\n <p >{{getFileSize()}} ko</p>\n</div>\n\n<!-- SEO info -->\n\n<span class=\"img-editor__infoSection__divider\"></span>\n\n<div class=\"img-editor__infoSection__titleSEO\">\n <p class=\"mainColor\">{{ 'ImgManager.UploadList.seo.title' | translate }}</p>\n</div>\n\n<div class=\"img-editor__infoSection__propertySEO\">\n <p class=\"mainColor\">{{ 'ImgManager.UploadList.seo.rezise' | translate }}</p>\n <p><i class=\"fal fa-check\"></i> 100%</p>\n <p class=\"img-editor__infoSection__propertySEO__tooltips\" [nwbToolTip]=\"'ImgManager.UploadList.seo.reziseTooltips' | translate\" [nwbToolTipIsMultiline]=\"true\" nwbToolTipPosition=\"right\"><i class=\"fas fa-info-circle\"></i></p>\n</div>\n<div class=\"img-editor__infoSection__propertySEO\">\n <p class=\"mainColor\">{{ 'ImgManager.UploadList.seo.webp' | translate }}</p>\n <p><i class=\"fal fa-check\"></i> 100%</p>\n <p class=\"img-editor__infoSection__propertySEO__tooltips\" [nwbToolTip]=\"'ImgManager.UploadList.seo.webpTooltips' | translate\" [nwbToolTipIsMultiline]=\"true\" nwbToolTipPosition=\"right\"><i class=\"fas fa-info-circle\"></i></p>\n</div>\n<div class=\"img-editor__infoSection__propertySEO\">\n <p class=\"mainColor\">{{ 'ImgManager.UploadList.seo.cdn' | translate }}</p>\n <p><i class=\"fal fa-check\"></i> 100%</p>\n <p class=\"img-editor__infoSection__propertySEO__tooltips\" [nwbToolTip]=\"'ImgManager.UploadList.seo.cdnTooltips' | translate\" [nwbToolTipIsMultiline]=\"true\" nwbToolTipPosition=\"right\"><i class=\"fas fa-info-circle\"></i></p>\n\n</div>\n<div class=\"img-editor__infoSection__propertySEO\">\n <p class=\"mainColor\">{{ 'ImgManager.UploadList.seo.lazyloading' | translate }}</p>\n <p><i class=\"fal fa-check\"></i> 100%</p>\n <p class=\"img-editor__infoSection__propertySEO__tooltips\" [nwbToolTip]=\"'ImgManager.UploadList.seo.lazyloadingTooltips' | translate\" [nwbToolTipIsMultiline]=\"true\" nwbToolTipPosition=\"right\"><i class=\"fas fa-info-circle\"></i></p>\n</div>\n", dependencies: [{ kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1.NwbToolTipDirective, selector: "[nwbToolTip]", inputs: ["nwbToolTip", "nwbToolTipPosition", "nwbToolTipIsMultiline"] }, { kind: "directive", type: CopyClipboardDirective, selector: "[copy-clipboard]", inputs: ["copy-clipboard"], outputs: ["copied"] }, { kind: "directive", type: DebounceKeyupDirective, selector: "input[debounceKeyUp]" }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }, { kind: "pipe", type: ImageSrcPipe, name: "imgSrc" }] });
|
|
1643
|
+
EditorInfoSectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.3", type: EditorInfoSectionComponent, selector: "info-section", inputs: { imgToEdit: "imgToEdit", isNameModified: "isNameModified" }, outputs: { isNameModifiedChange: "isNameModifiedChange" }, ngImport: i0, template: "\n<!-- Img properties -->\n<div class=\"img-editor__infoSection__propertyEditable\">\n <p class=\"mainColor\">\n {{ 'ImgManager.UploadList.properties.imgName' | translate }}\n <span class=\"img-editor__infoSection__propertyEditable__tooltips\" [nwbToolTip]=\"'ImgManager.ImgEditor.NameInfo' | translate\" [nwbToolTipIsMultiline]=\"true\" nwbToolTipPosition=\"right\"><i class=\"fas fa-info-circle\"></i></span>\n </p>\n <input\n type=\"text\"\n class=\"img-editor__infoSection__propertyEditable__input\"\n placeholder=\"{{'ImgManager.ImgEditor.nameEx' | translate}} \"\n [(ngModel)]=\"imgToEdit.display_name\"\n debounceKeyUp\n [debounceTime]=\"500\"\n (onEventChange)=\"onNameChange()\">\n</div>\n<div class=\"img-editor__infoSection__propertyEditable\">\n <p class=\"mainColor\">{{ 'ImgManager.UploadList.properties.imgURL' | translate }}</p>\n <button type=\"button\" [copy-clipboard]=\"imgToEdit.file_name | imgSrc : 'raw'\" (copied)=\"copyToClipBoard($event)\" ><span class=\"img-editor__infoSection__propertyEditable__span\">{{imgToEdit.file_name}}</span> <i class=\"far fa-copy\"></i></button>\n</div>\n<div class=\"img-editor__infoSection__property\">\n <p class=\"mainColor\">{{ 'ImgManager.UploadList.properties.imgSize' | translate }} :</p>\n <p>{{imgToEdit.raw_height}}*{{imgToEdit.raw_width}}px</p>\n</div>\n<div class=\"img-editor__infoSection__property\">\n <p class=\"mainColor\">{{ 'ImgManager.UploadList.properties.imgWeight' | translate }} :</p>\n <p >{{getFileSize()}} ko</p>\n</div>\n\n<!-- SEO info -->\n\n<span class=\"img-editor__infoSection__divider\"></span>\n\n<div class=\"img-editor__infoSection__titleSEO\">\n <p class=\"mainColor\">{{ 'ImgManager.UploadList.seo.title' | translate }}</p>\n</div>\n\n<div class=\"img-editor__infoSection__propertySEO\">\n <p class=\"mainColor\">{{ 'ImgManager.UploadList.seo.rezise' | translate }}</p>\n <p><i class=\"fal fa-check\"></i> 100%</p>\n <p class=\"img-editor__infoSection__propertySEO__tooltips\" [nwbToolTip]=\"'ImgManager.UploadList.seo.reziseTooltips' | translate\" [nwbToolTipIsMultiline]=\"true\" nwbToolTipPosition=\"right\"><i class=\"fas fa-info-circle\"></i></p>\n</div>\n<div class=\"img-editor__infoSection__propertySEO\">\n <p class=\"mainColor\">{{ 'ImgManager.UploadList.seo.webp' | translate }}</p>\n <p><i class=\"fal fa-check\"></i> 100%</p>\n <p class=\"img-editor__infoSection__propertySEO__tooltips\" [nwbToolTip]=\"'ImgManager.UploadList.seo.webpTooltips' | translate\" [nwbToolTipIsMultiline]=\"true\" nwbToolTipPosition=\"right\"><i class=\"fas fa-info-circle\"></i></p>\n</div>\n<div class=\"img-editor__infoSection__propertySEO\">\n <p class=\"mainColor\">{{ 'ImgManager.UploadList.seo.cdn' | translate }}</p>\n <p><i class=\"fal fa-check\"></i> 100%</p>\n <p class=\"img-editor__infoSection__propertySEO__tooltips\" [nwbToolTip]=\"'ImgManager.UploadList.seo.cdnTooltips' | translate\" [nwbToolTipIsMultiline]=\"true\" nwbToolTipPosition=\"right\"><i class=\"fas fa-info-circle\"></i></p>\n\n</div>\n<div class=\"img-editor__infoSection__propertySEO\">\n <p class=\"mainColor\">{{ 'ImgManager.UploadList.seo.lazyloading' | translate }}</p>\n <p><i class=\"fal fa-check\"></i> 100%</p>\n <p class=\"img-editor__infoSection__propertySEO__tooltips\" [nwbToolTip]=\"'ImgManager.UploadList.seo.lazyloadingTooltips' | translate\" [nwbToolTipIsMultiline]=\"true\" nwbToolTipPosition=\"right\"><i class=\"fas fa-info-circle\"></i></p>\n</div>\n", dependencies: [{ kind: "directive", type: i2$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1.NwbToolTipDirective, selector: "[nwbToolTip]", inputs: ["nwbToolTip", "nwbToolTipPosition", "nwbToolTipIsMultiline"] }, { kind: "directive", type: CopyClipboardDirective, selector: "[copy-clipboard]", inputs: ["copy-clipboard"], outputs: ["copied"] }, { kind: "directive", type: DebounceKeyupDirective, selector: "input[debounceKeyUp]" }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }, { kind: "pipe", type: ImageSrcPipe, name: "imgSrc" }] });
|
|
1638
1644
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: EditorInfoSectionComponent, decorators: [{
|
|
1639
1645
|
type: Component,
|
|
1640
|
-
args: [{ selector: 'info-section', template: "\n<!-- Img properties -->\n<div class=\"img-editor__infoSection__propertyEditable\">\n <p class=\"mainColor\">\n {{ 'ImgManager.UploadList.properties.imgName' | translate }}\n <span class=\"img-editor__infoSection__propertyEditable__tooltips\" [nwbToolTip]=\"'ImgManager.ImgEditor.NameInfo' | translate\" [nwbToolTipIsMultiline]=\"true\" nwbToolTipPosition=\"right\"><i class=\"fas fa-info-circle\"></i></span>\n </p>\n <input\n type=\"text\"\n class=\"img-editor__infoSection__propertyEditable__input\"\n placeholder=\"{{'ImgManager.ImgEditor.nameEx' | translate}} \"\n [(ngModel)]=\"imgToEdit.display_name\"\n debounceKeyUp\n [debounceTime]=\"500\"\n (onEventChange)=\"onNameChange()\">\n</div>\n<div class=\"img-editor__infoSection__propertyEditable\">\n <p class=\"mainColor\">{{ 'ImgManager.UploadList.properties.imgURL' | translate }}</p>\n <button [copy-clipboard]=\"imgToEdit.file_name | imgSrc : 'raw'\" (copied)=\"copyToClipBoard($event)\" ><span class=\"img-editor__infoSection__propertyEditable__span\">{{imgToEdit.file_name}}</span> <i class=\"far fa-copy\"></i></button>\n</div>\n<div class=\"img-editor__infoSection__property\">\n <p class=\"mainColor\">{{ 'ImgManager.UploadList.properties.imgSize' | translate }} :</p>\n <p>{{imgToEdit.raw_height}}*{{imgToEdit.raw_width}}px</p>\n</div>\n<div class=\"img-editor__infoSection__property\">\n <p class=\"mainColor\">{{ 'ImgManager.UploadList.properties.imgWeight' | translate }} :</p>\n <p >{{getFileSize()}} ko</p>\n</div>\n\n<!-- SEO info -->\n\n<span class=\"img-editor__infoSection__divider\"></span>\n\n<div class=\"img-editor__infoSection__titleSEO\">\n <p class=\"mainColor\">{{ 'ImgManager.UploadList.seo.title' | translate }}</p>\n</div>\n\n<div class=\"img-editor__infoSection__propertySEO\">\n <p class=\"mainColor\">{{ 'ImgManager.UploadList.seo.rezise' | translate }}</p>\n <p><i class=\"fal fa-check\"></i> 100%</p>\n <p class=\"img-editor__infoSection__propertySEO__tooltips\" [nwbToolTip]=\"'ImgManager.UploadList.seo.reziseTooltips' | translate\" [nwbToolTipIsMultiline]=\"true\" nwbToolTipPosition=\"right\"><i class=\"fas fa-info-circle\"></i></p>\n</div>\n<div class=\"img-editor__infoSection__propertySEO\">\n <p class=\"mainColor\">{{ 'ImgManager.UploadList.seo.webp' | translate }}</p>\n <p><i class=\"fal fa-check\"></i> 100%</p>\n <p class=\"img-editor__infoSection__propertySEO__tooltips\" [nwbToolTip]=\"'ImgManager.UploadList.seo.webpTooltips' | translate\" [nwbToolTipIsMultiline]=\"true\" nwbToolTipPosition=\"right\"><i class=\"fas fa-info-circle\"></i></p>\n</div>\n<div class=\"img-editor__infoSection__propertySEO\">\n <p class=\"mainColor\">{{ 'ImgManager.UploadList.seo.cdn' | translate }}</p>\n <p><i class=\"fal fa-check\"></i> 100%</p>\n <p class=\"img-editor__infoSection__propertySEO__tooltips\" [nwbToolTip]=\"'ImgManager.UploadList.seo.cdnTooltips' | translate\" [nwbToolTipIsMultiline]=\"true\" nwbToolTipPosition=\"right\"><i class=\"fas fa-info-circle\"></i></p>\n\n</div>\n<div class=\"img-editor__infoSection__propertySEO\">\n <p class=\"mainColor\">{{ 'ImgManager.UploadList.seo.lazyloading' | translate }}</p>\n <p><i class=\"fal fa-check\"></i> 100%</p>\n <p class=\"img-editor__infoSection__propertySEO__tooltips\" [nwbToolTip]=\"'ImgManager.UploadList.seo.lazyloadingTooltips' | translate\" [nwbToolTipIsMultiline]=\"true\" nwbToolTipPosition=\"right\"><i class=\"fas fa-info-circle\"></i></p>\n</div>\n" }]
|
|
1646
|
+
args: [{ selector: 'info-section', template: "\n<!-- Img properties -->\n<div class=\"img-editor__infoSection__propertyEditable\">\n <p class=\"mainColor\">\n {{ 'ImgManager.UploadList.properties.imgName' | translate }}\n <span class=\"img-editor__infoSection__propertyEditable__tooltips\" [nwbToolTip]=\"'ImgManager.ImgEditor.NameInfo' | translate\" [nwbToolTipIsMultiline]=\"true\" nwbToolTipPosition=\"right\"><i class=\"fas fa-info-circle\"></i></span>\n </p>\n <input\n type=\"text\"\n class=\"img-editor__infoSection__propertyEditable__input\"\n placeholder=\"{{'ImgManager.ImgEditor.nameEx' | translate}} \"\n [(ngModel)]=\"imgToEdit.display_name\"\n debounceKeyUp\n [debounceTime]=\"500\"\n (onEventChange)=\"onNameChange()\">\n</div>\n<div class=\"img-editor__infoSection__propertyEditable\">\n <p class=\"mainColor\">{{ 'ImgManager.UploadList.properties.imgURL' | translate }}</p>\n <button type=\"button\" [copy-clipboard]=\"imgToEdit.file_name | imgSrc : 'raw'\" (copied)=\"copyToClipBoard($event)\" ><span class=\"img-editor__infoSection__propertyEditable__span\">{{imgToEdit.file_name}}</span> <i class=\"far fa-copy\"></i></button>\n</div>\n<div class=\"img-editor__infoSection__property\">\n <p class=\"mainColor\">{{ 'ImgManager.UploadList.properties.imgSize' | translate }} :</p>\n <p>{{imgToEdit.raw_height}}*{{imgToEdit.raw_width}}px</p>\n</div>\n<div class=\"img-editor__infoSection__property\">\n <p class=\"mainColor\">{{ 'ImgManager.UploadList.properties.imgWeight' | translate }} :</p>\n <p >{{getFileSize()}} ko</p>\n</div>\n\n<!-- SEO info -->\n\n<span class=\"img-editor__infoSection__divider\"></span>\n\n<div class=\"img-editor__infoSection__titleSEO\">\n <p class=\"mainColor\">{{ 'ImgManager.UploadList.seo.title' | translate }}</p>\n</div>\n\n<div class=\"img-editor__infoSection__propertySEO\">\n <p class=\"mainColor\">{{ 'ImgManager.UploadList.seo.rezise' | translate }}</p>\n <p><i class=\"fal fa-check\"></i> 100%</p>\n <p class=\"img-editor__infoSection__propertySEO__tooltips\" [nwbToolTip]=\"'ImgManager.UploadList.seo.reziseTooltips' | translate\" [nwbToolTipIsMultiline]=\"true\" nwbToolTipPosition=\"right\"><i class=\"fas fa-info-circle\"></i></p>\n</div>\n<div class=\"img-editor__infoSection__propertySEO\">\n <p class=\"mainColor\">{{ 'ImgManager.UploadList.seo.webp' | translate }}</p>\n <p><i class=\"fal fa-check\"></i> 100%</p>\n <p class=\"img-editor__infoSection__propertySEO__tooltips\" [nwbToolTip]=\"'ImgManager.UploadList.seo.webpTooltips' | translate\" [nwbToolTipIsMultiline]=\"true\" nwbToolTipPosition=\"right\"><i class=\"fas fa-info-circle\"></i></p>\n</div>\n<div class=\"img-editor__infoSection__propertySEO\">\n <p class=\"mainColor\">{{ 'ImgManager.UploadList.seo.cdn' | translate }}</p>\n <p><i class=\"fal fa-check\"></i> 100%</p>\n <p class=\"img-editor__infoSection__propertySEO__tooltips\" [nwbToolTip]=\"'ImgManager.UploadList.seo.cdnTooltips' | translate\" [nwbToolTipIsMultiline]=\"true\" nwbToolTipPosition=\"right\"><i class=\"fas fa-info-circle\"></i></p>\n\n</div>\n<div class=\"img-editor__infoSection__propertySEO\">\n <p class=\"mainColor\">{{ 'ImgManager.UploadList.seo.lazyloading' | translate }}</p>\n <p><i class=\"fal fa-check\"></i> 100%</p>\n <p class=\"img-editor__infoSection__propertySEO__tooltips\" [nwbToolTip]=\"'ImgManager.UploadList.seo.lazyloadingTooltips' | translate\" [nwbToolTipIsMultiline]=\"true\" nwbToolTipPosition=\"right\"><i class=\"fas fa-info-circle\"></i></p>\n</div>\n" }]
|
|
1641
1647
|
}], ctorParameters: function () { return [{ type: AlertService }]; }, propDecorators: { imgToEdit: [{
|
|
1642
1648
|
type: Input
|
|
1643
1649
|
}], isNameModified: [{
|
|
@@ -2034,14 +2040,14 @@ class ImgEditorComponent {
|
|
|
2034
2040
|
}
|
|
2035
2041
|
}
|
|
2036
2042
|
ImgEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: ImgEditorComponent, deps: [{ token: ImgManagerService }], target: i0.ɵɵFactoryTarget.Component });
|
|
2037
|
-
ImgEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.3", type: ImgEditorComponent, selector: "img-editor", inputs: { stateDisplayed: "stateDisplayed", imgToEdit: "imgToEdit" }, outputs: { editClosed: "editClosed" }, ngImport: i0, template: "<div class=\"img-editor\" [@easeInOut]=\"'in'\">\n\n <!-- Button Action Section -->\n\n <div class=\"img-editor__infoSection__actions\">\n <div>\n <button\n class=\"button img-editor__infoSection__actions__cancel\"\n (click)=\"onCancel()\"\n [disabled]=\"isLoading || (!isImgModified && !isNameModified)\"\n >\n {{ 'ImgManager.ImgLib.cancel' | translate }}\n </button>\n <div\n class=\"button danger button img-editor__infoSection__actions__save\"\n [ngClass]=\"{'img-editor__infoSection__actions__save--disable': isLoading}\"\n (click)=\"onSave()\"\n >\n {{ 'ImgManager.ImgEditor.saveBtn' | translate }}\n <span btnLoadingAnim *ngIf=\"isLoading\" class=\"btnLoadingAnnimation\"></span>\n </div>\n\n </div>\n </div>\n\n <perfect-scrollbar\n [config]=\"{suppressScrollX: true}\"\n class=\"img-editor__scroll\"\n [ngClass]=\"{\n 'img-editor__scroll--full': stateDisplayed === 'full',\n 'img-editor__scroll--smallDisplay': stateDisplayed === 'small',\n 'img-editor__scroll--window': stateDisplayed === 'window'\n }\"\n >\n <div class=\"columns\">\n <!-- Left section -->\n <div class=\"column is-one-third img-editor__infoSection\">\n\n <info-section\n [imgToEdit]=\"imgToEdit\"\n [(isNameModified)]=\"isNameModified\"\n >\n </info-section>\n </div>\n\n\n <!-- Right section -->\n <div class=\"column img-editor__container\">\n <cropper\n [imgToEdit]=\"imgToEdit\"\n [(isImgModified)]=\"isImgModified\"\n (currentCroppedImageChange)=\"onImgCropped($event)\"\n (editClosed)=\"onEditClosed($event)\">\n </cropper>\n </div>\n </div>\n </perfect-scrollbar>\n</div>\n", dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3$1.PerfectScrollbarComponent, selector: "perfect-scrollbar", inputs: ["disabled", "usePSClass", "autoPropagation", "scrollIndicators", "config"], outputs: ["psScrollY", "psScrollX", "psScrollUp", "psScrollDown", "psScrollLeft", "psScrollRight", "psYReachEnd", "psYReachStart", "psXReachEnd", "psXReachStart"], exportAs: ["ngxPerfectScrollbar"] }, { kind: "component", type: EditorInfoSectionComponent, selector: "info-section", inputs: ["imgToEdit", "isNameModified"], outputs: ["isNameModifiedChange"] }, { kind: "component", type: CropperComponent, selector: "cropper", inputs: ["imgToEdit", "isImgModified"], outputs: ["isImgModifiedChange", "editClosed", "currentCroppedImageChange"] }, { kind: "directive", type: LoadingDirective, selector: "[btnLoadingAnim]" }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }], animations: [
|
|
2043
|
+
ImgEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.3", type: ImgEditorComponent, selector: "img-editor", inputs: { stateDisplayed: "stateDisplayed", imgToEdit: "imgToEdit" }, outputs: { editClosed: "editClosed" }, ngImport: i0, template: "<div class=\"img-editor\" [@easeInOut]=\"'in'\">\n\n <!-- Button Action Section -->\n\n <div class=\"img-editor__infoSection__actions\">\n <div>\n <button\n type=\"button\"\n class=\"button img-editor__infoSection__actions__cancel\"\n (click)=\"onCancel()\"\n [disabled]=\"isLoading || (!isImgModified && !isNameModified)\"\n >\n {{ 'ImgManager.ImgLib.cancel' | translate }}\n </button>\n <div\n class=\"button danger button img-editor__infoSection__actions__save\"\n [ngClass]=\"{'img-editor__infoSection__actions__save--disable': isLoading}\"\n (click)=\"onSave()\"\n >\n {{ 'ImgManager.ImgEditor.saveBtn' | translate }}\n <span btnLoadingAnim *ngIf=\"isLoading\" class=\"btnLoadingAnnimation\"></span>\n </div>\n\n </div>\n </div>\n\n <perfect-scrollbar\n [config]=\"{suppressScrollX: true}\"\n class=\"img-editor__scroll\"\n [ngClass]=\"{\n 'img-editor__scroll--full': stateDisplayed === 'full',\n 'img-editor__scroll--smallDisplay': stateDisplayed === 'small',\n 'img-editor__scroll--window': stateDisplayed === 'window'\n }\"\n >\n <div class=\"columns\">\n <!-- Left section -->\n <div class=\"column is-one-third img-editor__infoSection\">\n\n <info-section\n [imgToEdit]=\"imgToEdit\"\n [(isNameModified)]=\"isNameModified\"\n >\n </info-section>\n </div>\n\n\n <!-- Right section -->\n <div class=\"column img-editor__container\">\n <cropper\n [imgToEdit]=\"imgToEdit\"\n [(isImgModified)]=\"isImgModified\"\n (currentCroppedImageChange)=\"onImgCropped($event)\"\n (editClosed)=\"onEditClosed($event)\">\n </cropper>\n </div>\n </div>\n </perfect-scrollbar>\n</div>\n", dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3$1.PerfectScrollbarComponent, selector: "perfect-scrollbar", inputs: ["disabled", "usePSClass", "autoPropagation", "scrollIndicators", "config"], outputs: ["psScrollY", "psScrollX", "psScrollUp", "psScrollDown", "psScrollLeft", "psScrollRight", "psYReachEnd", "psYReachStart", "psXReachEnd", "psXReachStart"], exportAs: ["ngxPerfectScrollbar"] }, { kind: "component", type: EditorInfoSectionComponent, selector: "info-section", inputs: ["imgToEdit", "isNameModified"], outputs: ["isNameModifiedChange"] }, { kind: "component", type: CropperComponent, selector: "cropper", inputs: ["imgToEdit", "isImgModified"], outputs: ["isImgModifiedChange", "editClosed", "currentCroppedImageChange"] }, { kind: "directive", type: LoadingDirective, selector: "[btnLoadingAnim]" }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }], animations: [
|
|
2038
2044
|
easeInOut
|
|
2039
2045
|
] });
|
|
2040
2046
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: ImgEditorComponent, decorators: [{
|
|
2041
2047
|
type: Component,
|
|
2042
2048
|
args: [{ selector: 'img-editor', animations: [
|
|
2043
2049
|
easeInOut
|
|
2044
|
-
], template: "<div class=\"img-editor\" [@easeInOut]=\"'in'\">\n\n <!-- Button Action Section -->\n\n <div class=\"img-editor__infoSection__actions\">\n <div>\n <button\n class=\"button img-editor__infoSection__actions__cancel\"\n (click)=\"onCancel()\"\n [disabled]=\"isLoading || (!isImgModified && !isNameModified)\"\n >\n {{ 'ImgManager.ImgLib.cancel' | translate }}\n </button>\n <div\n class=\"button danger button img-editor__infoSection__actions__save\"\n [ngClass]=\"{'img-editor__infoSection__actions__save--disable': isLoading}\"\n (click)=\"onSave()\"\n >\n {{ 'ImgManager.ImgEditor.saveBtn' | translate }}\n <span btnLoadingAnim *ngIf=\"isLoading\" class=\"btnLoadingAnnimation\"></span>\n </div>\n\n </div>\n </div>\n\n <perfect-scrollbar\n [config]=\"{suppressScrollX: true}\"\n class=\"img-editor__scroll\"\n [ngClass]=\"{\n 'img-editor__scroll--full': stateDisplayed === 'full',\n 'img-editor__scroll--smallDisplay': stateDisplayed === 'small',\n 'img-editor__scroll--window': stateDisplayed === 'window'\n }\"\n >\n <div class=\"columns\">\n <!-- Left section -->\n <div class=\"column is-one-third img-editor__infoSection\">\n\n <info-section\n [imgToEdit]=\"imgToEdit\"\n [(isNameModified)]=\"isNameModified\"\n >\n </info-section>\n </div>\n\n\n <!-- Right section -->\n <div class=\"column img-editor__container\">\n <cropper\n [imgToEdit]=\"imgToEdit\"\n [(isImgModified)]=\"isImgModified\"\n (currentCroppedImageChange)=\"onImgCropped($event)\"\n (editClosed)=\"onEditClosed($event)\">\n </cropper>\n </div>\n </div>\n </perfect-scrollbar>\n</div>\n" }]
|
|
2050
|
+
], template: "<div class=\"img-editor\" [@easeInOut]=\"'in'\">\n\n <!-- Button Action Section -->\n\n <div class=\"img-editor__infoSection__actions\">\n <div>\n <button\n type=\"button\"\n class=\"button img-editor__infoSection__actions__cancel\"\n (click)=\"onCancel()\"\n [disabled]=\"isLoading || (!isImgModified && !isNameModified)\"\n >\n {{ 'ImgManager.ImgLib.cancel' | translate }}\n </button>\n <div\n class=\"button danger button img-editor__infoSection__actions__save\"\n [ngClass]=\"{'img-editor__infoSection__actions__save--disable': isLoading}\"\n (click)=\"onSave()\"\n >\n {{ 'ImgManager.ImgEditor.saveBtn' | translate }}\n <span btnLoadingAnim *ngIf=\"isLoading\" class=\"btnLoadingAnnimation\"></span>\n </div>\n\n </div>\n </div>\n\n <perfect-scrollbar\n [config]=\"{suppressScrollX: true}\"\n class=\"img-editor__scroll\"\n [ngClass]=\"{\n 'img-editor__scroll--full': stateDisplayed === 'full',\n 'img-editor__scroll--smallDisplay': stateDisplayed === 'small',\n 'img-editor__scroll--window': stateDisplayed === 'window'\n }\"\n >\n <div class=\"columns\">\n <!-- Left section -->\n <div class=\"column is-one-third img-editor__infoSection\">\n\n <info-section\n [imgToEdit]=\"imgToEdit\"\n [(isNameModified)]=\"isNameModified\"\n >\n </info-section>\n </div>\n\n\n <!-- Right section -->\n <div class=\"column img-editor__container\">\n <cropper\n [imgToEdit]=\"imgToEdit\"\n [(isImgModified)]=\"isImgModified\"\n (currentCroppedImageChange)=\"onImgCropped($event)\"\n (editClosed)=\"onEditClosed($event)\">\n </cropper>\n </div>\n </div>\n </perfect-scrollbar>\n</div>\n" }]
|
|
2045
2051
|
}], ctorParameters: function () { return [{ type: ImgManagerService }]; }, propDecorators: { stateDisplayed: [{
|
|
2046
2052
|
type: Input
|
|
2047
2053
|
}], imgToEdit: [{
|
|
@@ -3450,7 +3456,7 @@ class ImagesViewComponent {
|
|
|
3450
3456
|
}
|
|
3451
3457
|
}
|
|
3452
3458
|
ImagesViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: ImagesViewComponent, deps: [{ token: ImgManagerService }, { token: ImgEventService }, { token: ImgSelectionService }, { token: AlertService }, { token: UserSettingsService }, { token: RenamePictureService }], target: i0.ɵɵFactoryTarget.Component });
|
|
3453
|
-
ImagesViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.3", type: ImagesViewComponent, selector: "images-view", inputs: { stateDisplayed: "stateDisplayed", tabDisplayed: "tabDisplayed", fullSize: "fullSize", maxLengthCardShow: "maxLengthCardShow", nbRowToShow: "nbRowToShow", listDisplayed: "listDisplayed", multipleImgMode: "multipleImgMode" }, outputs: { switchDisplayWindow: "switchDisplayWindow" }, viewQueries: [{ propertyName: "imgLibContainer", first: true, predicate: ["imgLibContainer"], descendants: true }], ngImport: i0, template: "<div class=\"images-view\" [ngClass]=\"{'fullSize': fullSize, 'small': stateDisplayed === 'small'}\" [@easeInOut]=\"'in'\">\n <!-- Subheader : Img number and actions btn (sup img list, switch forma display) -->\n <div\n *ngIf=\"(stateDisplayed !== 'small' || tabDisplayed === 'img-upload')\"\n class=\"images-view__container\"\n [ngClass]=\"{'images-view__container--uploadTab': tabDisplayed === 'img-upload', 'images-view__container--window': stateDisplayed === 'window'}\"\n >\n\n <div *ngIf=\"tabDisplayed !== 'img-upload'\">\n <p class=\"mainColor\">{{ 'ImgManager.ImgLib.nbImg' | translate }} : {{length}}</p>\n </div>\n <div *ngIf=\"tabDisplayed === 'img-upload'\">\n <p class=\"mainColor\">{{ 'ImgManager.ImgLib.lastImgs' | translate }}</p>\n </div>\n\n <div class=\"field has-addons subHeaderActions\" *ngIf=\"tabDisplayed !== 'img-upload'\">\n\n <!-- For listforma : Display btn del multiple img & Confirm action -->\n <div class=\"images-view__container__boxAction\">\n\n\n <!-- S\u00E9lectionner -->\n <button\n class=\"button success images-view__container__boxAction__import\"\n @insertRemoveAnnim\n *ngIf=\"listDisplayed && nbImgToDelSelected && !confirmImgSup && !delListImgLoader && multipleImgMode\"\n (click)=\"selectImgChosen()\"\n >\n <i class=\"fal fa-check\"></i>\n {{ 'ImgManager.ImgLib.select' | translate }} ({{nbImgToDelSelected}})\n </button>\n\n <!-- Display btn del multiple img -->\n <button\n *ngIf=\"listDisplayed && nbImgToDelSelected && !confirmImgSup\"\n (click)=\"displayConfirmImgSup()\"\n class=\"button images-view__container__boxAction__delBtn danger\"\n @insertRemoveAnnim\n >\n <i class=\"fal fa-times\"></i>{{ 'ImgManager.ImgLib.delMlt' | translate }} ({{nbImgToDelSelected}})\n <span btnLoadingAnim *ngIf=\"delListImgLoader\" class=\"btnLoadingAnnimation\"></span>\n </button>\n\n <!-- Confirm action -->\n <div\n class=\"images-view__container__boxAction__confirmSup\"\n [ngClass]=\"{'images-view__container__boxAction__confirmSup--visible': confirmImgSup}\">\n <p *ngIf=\"nbImgToDelSelected > 1\" class=\"images-view__container__boxAction__confirmSup__text\">{{ 'ImgManager.ImgLib.confirmSupQuestions' | translate:{nbImage: nbImgToDelSelected} }}</p>\n <p *ngIf=\"nbImgToDelSelected === 1\" class=\"images-view__container__boxAction__confirmSup__text\">{{ 'ImgManager.ImgLib.confirmSupQuestion' | translate:{nbImage: nbImgToDelSelected} }}</p>\n <div>\n <button\n class=\"button images-view__container__boxAction__confirmSup__cancel\"\n (click)=\"cancelSup()\"\n >\n {{ 'ImgManager.ImgLib.cancel' | translate }}\n </button>\n <button\n (click)=\"removeListImg()\"\n class=\"button images-view__container__delBtn danger\"\n >\n {{ 'ImgManager.ImgLib.confirm' | translate }}\n </button>\n </div>\n </div>\n\n </div>\n\n\n <!-- Swith mosaic/list forma -->\n <div class=\"field has-addons images-view__container__buttonBox\">\n <div class=\"control\">\n <div\n class=\"button is-lighted images-view__container__buttonBox__btn\"\n [ngClass]=\"{'actifDisplayed': !listDisplayed}\"\n (click)=\"onSwitchFormatDisplayed(false)\"\n >\n <span class=\"icon is-small\">\n <i class=\"far fa-th\"></i>\n </span>\n </div>\n </div>\n\n <div class=\"control\">\n <div class=\"button is-lighted images-view__container__buttonBox__btn\"\n [ngClass]=\"{'actifDisplayed': listDisplayed}\"\n (click)=\"onSwitchFormatDisplayed(true)\"\n >\n <span class=\"icon is-small\">\n <i class=\"fas fa-bars\"></i>\n </span>\n </div>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n <!-- Images section -->\n<perfect-scrollbar\n [config]=\"{ suppressScrollX: true }\"\n class=\"images-view__scroll\"\n [ngClass]=\"{\n 'images-view__scroll--hide--mosaic': displayPexelsResults && !listDisplayed,\n 'images-view__scroll--hide--mosaic--small': displayPexelsResults && !listDisplayed && stateDisplayed === 'small',\n 'images-view__scroll--hide--table': displayPexelsResults && listDisplayed,\n 'images-view__scroll--full': stateDisplayed === 'full',\n 'images-view__scroll--smallDisplay' : stateDisplayed === 'small' && tabDisplayed !== 'img-upload',\n 'images-view__scroll--smallUploadDisplay' : stateDisplayed === 'small' && tabDisplayed === 'img-upload',\n 'images-view__scroll--window': stateDisplayed === 'window'\n}\"\n>\n <div #imgLibContainer class=\"images-view__wrapper\">\n <div *ngIf=\"!listDisplayed || stateDisplayed === 'small'\" [@easeInOut]=\"'in'\">\n <mosaic-view\n [picturesList]=\"picturesList\"\n (picturesListChange)=\"onPicturesListChange()\"\n [tableFilters]=\"tableFilters\"\n (filtersChange)=\"onFiltersChange()\"\n [(disable)]=\"disable\"\n (pictureNameChange)=\"onRenamePicture($event)\"\n (switchDisplayWindow)=\"switchDisplayWindowMosaic()\"\n [nbFakeImg]=\"nbFakeImg\"\n [stateDisplayed]=\"stateDisplayed\"\n [tabDisplayed]=\"tabDisplayed\"\n [displayPexelsResults]=\"displayPexelsResults\"\n [isLoading]=\"isLoading\"\n [fullSize]=\"fullSize\"\n >\n </mosaic-view>\n </div>\n\n <div *ngIf=\"listDisplayed && stateDisplayed !== 'small'\" [@easeInOut]=\"'in'\">\n <table-view\n [picturesList]=\"picturesList\"\n (picturesListChange)=\"onPicturesListChange()\"\n [tableFilters]=\"tableFilters\"\n (filtersChange)=\"onFiltersChange()\"\n [(disable)]=\"disable\"\n (pictureNameChange)=\"onRenamePicture($event)\"\n [displayPexelsResults]=\"displayPexelsResults\"\n [stateDisplayed]=\"stateDisplayed\"\n [isLoading]=\"isLoading\"\n >\n </table-view>\n </div>\n\n </div>\n</perfect-scrollbar>\n\n<!-- Pexels Section - When no img found -->\n<div\n *ngIf=\"displayPexelsResults\"\n class=\"images-view--pexels\"\n [@easeInOut]=\"'in'\">\n <pexels-lib\n [searchValue]=\"tableFilters.searchValue\"\n (showImgUploaded)=\"onShowImgUploaded()\"\n [disableSearch]=\"true\"\n >\n </pexels-lib>\n</div>\n", dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3$1.PerfectScrollbarComponent, selector: "perfect-scrollbar", inputs: ["disabled", "usePSClass", "autoPropagation", "scrollIndicators", "config"], outputs: ["psScrollY", "psScrollX", "psScrollUp", "psScrollDown", "psScrollLeft", "psScrollRight", "psYReachEnd", "psYReachStart", "psXReachEnd", "psXReachStart"], exportAs: ["ngxPerfectScrollbar"] }, { kind: "component", type: PexelLibComponent, selector: "pexels-lib", inputs: ["stateDisplayed", "searchValue", "disableSearch"], outputs: ["showImgUploaded"] }, { kind: "component", type: MosaicViewComponent, selector: "mosaic-view", inputs: ["tabDisplayed", "fullSize", "nbFakeImg"], outputs: ["switchDisplayWindow"] }, { kind: "component", type: TableViewComponent, selector: "table-view" }, { kind: "directive", type: LoadingDirective, selector: "[btnLoadingAnim]" }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }], animations: [
|
|
3459
|
+
ImagesViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.3", type: ImagesViewComponent, selector: "images-view", inputs: { stateDisplayed: "stateDisplayed", tabDisplayed: "tabDisplayed", fullSize: "fullSize", maxLengthCardShow: "maxLengthCardShow", nbRowToShow: "nbRowToShow", listDisplayed: "listDisplayed", multipleImgMode: "multipleImgMode" }, outputs: { switchDisplayWindow: "switchDisplayWindow" }, viewQueries: [{ propertyName: "imgLibContainer", first: true, predicate: ["imgLibContainer"], descendants: true }], ngImport: i0, template: "<div class=\"images-view\" [ngClass]=\"{'fullSize': fullSize, 'small': stateDisplayed === 'small'}\" [@easeInOut]=\"'in'\">\n <!-- Subheader : Img number and actions btn (sup img list, switch forma display) -->\n <div\n *ngIf=\"(stateDisplayed !== 'small' || tabDisplayed === 'img-upload')\"\n class=\"images-view__container\"\n [ngClass]=\"{'images-view__container--uploadTab': tabDisplayed === 'img-upload', 'images-view__container--window': stateDisplayed === 'window'}\"\n >\n\n <div *ngIf=\"tabDisplayed !== 'img-upload'\">\n <p class=\"mainColor\">{{ 'ImgManager.ImgLib.nbImg' | translate }} : {{length}}</p>\n </div>\n <div *ngIf=\"tabDisplayed === 'img-upload'\">\n <p class=\"mainColor\">{{ 'ImgManager.ImgLib.lastImgs' | translate }}</p>\n </div>\n\n <div class=\"field has-addons subHeaderActions\" *ngIf=\"tabDisplayed !== 'img-upload'\">\n\n <!-- For listforma : Display btn del multiple img & Confirm action -->\n <div class=\"images-view__container__boxAction\">\n\n\n <!-- S\u00E9lectionner -->\n <button\n class=\"button success images-view__container__boxAction__import\"\n @insertRemoveAnnim\n *ngIf=\"listDisplayed && nbImgToDelSelected && !confirmImgSup && !delListImgLoader && multipleImgMode\"\n (click)=\"selectImgChosen()\"\n type=\"button\"\n >\n <i class=\"fal fa-check\"></i>\n {{ 'ImgManager.ImgLib.select' | translate }} ({{nbImgToDelSelected}})\n </button>\n\n <!-- Display btn del multiple img -->\n <button\n *ngIf=\"listDisplayed && nbImgToDelSelected && !confirmImgSup\"\n (click)=\"displayConfirmImgSup()\"\n class=\"button images-view__container__boxAction__delBtn danger\"\n @insertRemoveAnnim\n type=\"button\"\n >\n <i class=\"fal fa-times\"></i>{{ 'ImgManager.ImgLib.delMlt' | translate }} ({{nbImgToDelSelected}})\n <span btnLoadingAnim *ngIf=\"delListImgLoader\" class=\"btnLoadingAnnimation\"></span>\n </button>\n\n <!-- Confirm action -->\n <div\n class=\"images-view__container__boxAction__confirmSup\"\n [ngClass]=\"{'images-view__container__boxAction__confirmSup--visible': confirmImgSup}\">\n <p *ngIf=\"nbImgToDelSelected > 1\" class=\"images-view__container__boxAction__confirmSup__text\">{{ 'ImgManager.ImgLib.confirmSupQuestions' | translate:{nbImage: nbImgToDelSelected} }}</p>\n <p *ngIf=\"nbImgToDelSelected === 1\" class=\"images-view__container__boxAction__confirmSup__text\">{{ 'ImgManager.ImgLib.confirmSupQuestion' | translate:{nbImage: nbImgToDelSelected} }}</p>\n <div>\n <button\n class=\"button images-view__container__boxAction__confirmSup__cancel\"\n (click)=\"cancelSup()\"\n type=\"button\"\n >\n {{ 'ImgManager.ImgLib.cancel' | translate }}\n </button>\n <button\n (click)=\"removeListImg()\"\n class=\"button images-view__container__delBtn danger\"\n type=\"button\"\n >\n {{ 'ImgManager.ImgLib.confirm' | translate }}\n </button>\n </div>\n </div>\n\n </div>\n\n\n <!-- Swith mosaic/list forma -->\n <div class=\"field has-addons images-view__container__buttonBox\">\n <div class=\"control\">\n <div\n class=\"button is-lighted images-view__container__buttonBox__btn\"\n [ngClass]=\"{'actifDisplayed': !listDisplayed}\"\n (click)=\"onSwitchFormatDisplayed(false)\"\n >\n <span class=\"icon is-small\">\n <i class=\"far fa-th\"></i>\n </span>\n </div>\n </div>\n\n <div class=\"control\">\n <div class=\"button is-lighted images-view__container__buttonBox__btn\"\n [ngClass]=\"{'actifDisplayed': listDisplayed}\"\n (click)=\"onSwitchFormatDisplayed(true)\"\n >\n <span class=\"icon is-small\">\n <i class=\"fas fa-bars\"></i>\n </span>\n </div>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n <!-- Images section -->\n<perfect-scrollbar\n [config]=\"{ suppressScrollX: true }\"\n class=\"images-view__scroll\"\n [ngClass]=\"{\n 'images-view__scroll--hide--mosaic': displayPexelsResults && !listDisplayed,\n 'images-view__scroll--hide--mosaic--small': displayPexelsResults && !listDisplayed && stateDisplayed === 'small',\n 'images-view__scroll--hide--table': displayPexelsResults && listDisplayed,\n 'images-view__scroll--full': stateDisplayed === 'full',\n 'images-view__scroll--smallDisplay' : stateDisplayed === 'small' && tabDisplayed !== 'img-upload',\n 'images-view__scroll--smallUploadDisplay' : stateDisplayed === 'small' && tabDisplayed === 'img-upload',\n 'images-view__scroll--window': stateDisplayed === 'window'\n}\"\n>\n <div #imgLibContainer class=\"images-view__wrapper\">\n <div *ngIf=\"!listDisplayed || stateDisplayed === 'small'\" [@easeInOut]=\"'in'\">\n <mosaic-view\n [picturesList]=\"picturesList\"\n (picturesListChange)=\"onPicturesListChange()\"\n [tableFilters]=\"tableFilters\"\n (filtersChange)=\"onFiltersChange()\"\n [(disable)]=\"disable\"\n (pictureNameChange)=\"onRenamePicture($event)\"\n (switchDisplayWindow)=\"switchDisplayWindowMosaic()\"\n [nbFakeImg]=\"nbFakeImg\"\n [stateDisplayed]=\"stateDisplayed\"\n [tabDisplayed]=\"tabDisplayed\"\n [displayPexelsResults]=\"displayPexelsResults\"\n [isLoading]=\"isLoading\"\n [fullSize]=\"fullSize\"\n >\n </mosaic-view>\n </div>\n\n <div *ngIf=\"listDisplayed && stateDisplayed !== 'small'\" [@easeInOut]=\"'in'\">\n <table-view\n [picturesList]=\"picturesList\"\n (picturesListChange)=\"onPicturesListChange()\"\n [tableFilters]=\"tableFilters\"\n (filtersChange)=\"onFiltersChange()\"\n [(disable)]=\"disable\"\n (pictureNameChange)=\"onRenamePicture($event)\"\n [displayPexelsResults]=\"displayPexelsResults\"\n [stateDisplayed]=\"stateDisplayed\"\n [isLoading]=\"isLoading\"\n >\n </table-view>\n </div>\n\n </div>\n</perfect-scrollbar>\n\n<!-- Pexels Section - When no img found -->\n<div\n *ngIf=\"displayPexelsResults\"\n class=\"images-view--pexels\"\n [@easeInOut]=\"'in'\">\n <pexels-lib\n [searchValue]=\"tableFilters.searchValue\"\n (showImgUploaded)=\"onShowImgUploaded()\"\n [disableSearch]=\"true\"\n >\n </pexels-lib>\n</div>\n", dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3$1.PerfectScrollbarComponent, selector: "perfect-scrollbar", inputs: ["disabled", "usePSClass", "autoPropagation", "scrollIndicators", "config"], outputs: ["psScrollY", "psScrollX", "psScrollUp", "psScrollDown", "psScrollLeft", "psScrollRight", "psYReachEnd", "psYReachStart", "psXReachEnd", "psXReachStart"], exportAs: ["ngxPerfectScrollbar"] }, { kind: "component", type: PexelLibComponent, selector: "pexels-lib", inputs: ["stateDisplayed", "searchValue", "disableSearch"], outputs: ["showImgUploaded"] }, { kind: "component", type: MosaicViewComponent, selector: "mosaic-view", inputs: ["tabDisplayed", "fullSize", "nbFakeImg"], outputs: ["switchDisplayWindow"] }, { kind: "component", type: TableViewComponent, selector: "table-view" }, { kind: "directive", type: LoadingDirective, selector: "[btnLoadingAnim]" }, { kind: "pipe", type: i7.TranslatePipe, name: "translate" }], animations: [
|
|
3454
3460
|
easeInOut,
|
|
3455
3461
|
insertRemove
|
|
3456
3462
|
] });
|
|
@@ -3459,7 +3465,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.3", ngImpor
|
|
|
3459
3465
|
args: [{ selector: 'images-view', animations: [
|
|
3460
3466
|
easeInOut,
|
|
3461
3467
|
insertRemove
|
|
3462
|
-
], template: "<div class=\"images-view\" [ngClass]=\"{'fullSize': fullSize, 'small': stateDisplayed === 'small'}\" [@easeInOut]=\"'in'\">\n <!-- Subheader : Img number and actions btn (sup img list, switch forma display) -->\n <div\n *ngIf=\"(stateDisplayed !== 'small' || tabDisplayed === 'img-upload')\"\n class=\"images-view__container\"\n [ngClass]=\"{'images-view__container--uploadTab': tabDisplayed === 'img-upload', 'images-view__container--window': stateDisplayed === 'window'}\"\n >\n\n <div *ngIf=\"tabDisplayed !== 'img-upload'\">\n <p class=\"mainColor\">{{ 'ImgManager.ImgLib.nbImg' | translate }} : {{length}}</p>\n </div>\n <div *ngIf=\"tabDisplayed === 'img-upload'\">\n <p class=\"mainColor\">{{ 'ImgManager.ImgLib.lastImgs' | translate }}</p>\n </div>\n\n <div class=\"field has-addons subHeaderActions\" *ngIf=\"tabDisplayed !== 'img-upload'\">\n\n <!-- For listforma : Display btn del multiple img & Confirm action -->\n <div class=\"images-view__container__boxAction\">\n\n\n <!-- S\u00E9lectionner -->\n <button\n class=\"button success images-view__container__boxAction__import\"\n @insertRemoveAnnim\n *ngIf=\"listDisplayed && nbImgToDelSelected && !confirmImgSup && !delListImgLoader && multipleImgMode\"\n (click)=\"selectImgChosen()\"\n >\n <i class=\"fal fa-check\"></i>\n {{ 'ImgManager.ImgLib.select' | translate }} ({{nbImgToDelSelected}})\n </button>\n\n <!-- Display btn del multiple img -->\n <button\n *ngIf=\"listDisplayed && nbImgToDelSelected && !confirmImgSup\"\n (click)=\"displayConfirmImgSup()\"\n class=\"button images-view__container__boxAction__delBtn danger\"\n @insertRemoveAnnim\n >\n <i class=\"fal fa-times\"></i>{{ 'ImgManager.ImgLib.delMlt' | translate }} ({{nbImgToDelSelected}})\n <span btnLoadingAnim *ngIf=\"delListImgLoader\" class=\"btnLoadingAnnimation\"></span>\n </button>\n\n <!-- Confirm action -->\n <div\n class=\"images-view__container__boxAction__confirmSup\"\n [ngClass]=\"{'images-view__container__boxAction__confirmSup--visible': confirmImgSup}\">\n <p *ngIf=\"nbImgToDelSelected > 1\" class=\"images-view__container__boxAction__confirmSup__text\">{{ 'ImgManager.ImgLib.confirmSupQuestions' | translate:{nbImage: nbImgToDelSelected} }}</p>\n <p *ngIf=\"nbImgToDelSelected === 1\" class=\"images-view__container__boxAction__confirmSup__text\">{{ 'ImgManager.ImgLib.confirmSupQuestion' | translate:{nbImage: nbImgToDelSelected} }}</p>\n <div>\n <button\n class=\"button images-view__container__boxAction__confirmSup__cancel\"\n (click)=\"cancelSup()\"\n >\n {{ 'ImgManager.ImgLib.cancel' | translate }}\n </button>\n <button\n (click)=\"removeListImg()\"\n class=\"button images-view__container__delBtn danger\"\n >\n {{ 'ImgManager.ImgLib.confirm' | translate }}\n </button>\n </div>\n </div>\n\n </div>\n\n\n <!-- Swith mosaic/list forma -->\n <div class=\"field has-addons images-view__container__buttonBox\">\n <div class=\"control\">\n <div\n class=\"button is-lighted images-view__container__buttonBox__btn\"\n [ngClass]=\"{'actifDisplayed': !listDisplayed}\"\n (click)=\"onSwitchFormatDisplayed(false)\"\n >\n <span class=\"icon is-small\">\n <i class=\"far fa-th\"></i>\n </span>\n </div>\n </div>\n\n <div class=\"control\">\n <div class=\"button is-lighted images-view__container__buttonBox__btn\"\n [ngClass]=\"{'actifDisplayed': listDisplayed}\"\n (click)=\"onSwitchFormatDisplayed(true)\"\n >\n <span class=\"icon is-small\">\n <i class=\"fas fa-bars\"></i>\n </span>\n </div>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n <!-- Images section -->\n<perfect-scrollbar\n [config]=\"{ suppressScrollX: true }\"\n class=\"images-view__scroll\"\n [ngClass]=\"{\n 'images-view__scroll--hide--mosaic': displayPexelsResults && !listDisplayed,\n 'images-view__scroll--hide--mosaic--small': displayPexelsResults && !listDisplayed && stateDisplayed === 'small',\n 'images-view__scroll--hide--table': displayPexelsResults && listDisplayed,\n 'images-view__scroll--full': stateDisplayed === 'full',\n 'images-view__scroll--smallDisplay' : stateDisplayed === 'small' && tabDisplayed !== 'img-upload',\n 'images-view__scroll--smallUploadDisplay' : stateDisplayed === 'small' && tabDisplayed === 'img-upload',\n 'images-view__scroll--window': stateDisplayed === 'window'\n}\"\n>\n <div #imgLibContainer class=\"images-view__wrapper\">\n <div *ngIf=\"!listDisplayed || stateDisplayed === 'small'\" [@easeInOut]=\"'in'\">\n <mosaic-view\n [picturesList]=\"picturesList\"\n (picturesListChange)=\"onPicturesListChange()\"\n [tableFilters]=\"tableFilters\"\n (filtersChange)=\"onFiltersChange()\"\n [(disable)]=\"disable\"\n (pictureNameChange)=\"onRenamePicture($event)\"\n (switchDisplayWindow)=\"switchDisplayWindowMosaic()\"\n [nbFakeImg]=\"nbFakeImg\"\n [stateDisplayed]=\"stateDisplayed\"\n [tabDisplayed]=\"tabDisplayed\"\n [displayPexelsResults]=\"displayPexelsResults\"\n [isLoading]=\"isLoading\"\n [fullSize]=\"fullSize\"\n >\n </mosaic-view>\n </div>\n\n <div *ngIf=\"listDisplayed && stateDisplayed !== 'small'\" [@easeInOut]=\"'in'\">\n <table-view\n [picturesList]=\"picturesList\"\n (picturesListChange)=\"onPicturesListChange()\"\n [tableFilters]=\"tableFilters\"\n (filtersChange)=\"onFiltersChange()\"\n [(disable)]=\"disable\"\n (pictureNameChange)=\"onRenamePicture($event)\"\n [displayPexelsResults]=\"displayPexelsResults\"\n [stateDisplayed]=\"stateDisplayed\"\n [isLoading]=\"isLoading\"\n >\n </table-view>\n </div>\n\n </div>\n</perfect-scrollbar>\n\n<!-- Pexels Section - When no img found -->\n<div\n *ngIf=\"displayPexelsResults\"\n class=\"images-view--pexels\"\n [@easeInOut]=\"'in'\">\n <pexels-lib\n [searchValue]=\"tableFilters.searchValue\"\n (showImgUploaded)=\"onShowImgUploaded()\"\n [disableSearch]=\"true\"\n >\n </pexels-lib>\n</div>\n" }]
|
|
3468
|
+
], template: "<div class=\"images-view\" [ngClass]=\"{'fullSize': fullSize, 'small': stateDisplayed === 'small'}\" [@easeInOut]=\"'in'\">\n <!-- Subheader : Img number and actions btn (sup img list, switch forma display) -->\n <div\n *ngIf=\"(stateDisplayed !== 'small' || tabDisplayed === 'img-upload')\"\n class=\"images-view__container\"\n [ngClass]=\"{'images-view__container--uploadTab': tabDisplayed === 'img-upload', 'images-view__container--window': stateDisplayed === 'window'}\"\n >\n\n <div *ngIf=\"tabDisplayed !== 'img-upload'\">\n <p class=\"mainColor\">{{ 'ImgManager.ImgLib.nbImg' | translate }} : {{length}}</p>\n </div>\n <div *ngIf=\"tabDisplayed === 'img-upload'\">\n <p class=\"mainColor\">{{ 'ImgManager.ImgLib.lastImgs' | translate }}</p>\n </div>\n\n <div class=\"field has-addons subHeaderActions\" *ngIf=\"tabDisplayed !== 'img-upload'\">\n\n <!-- For listforma : Display btn del multiple img & Confirm action -->\n <div class=\"images-view__container__boxAction\">\n\n\n <!-- S\u00E9lectionner -->\n <button\n class=\"button success images-view__container__boxAction__import\"\n @insertRemoveAnnim\n *ngIf=\"listDisplayed && nbImgToDelSelected && !confirmImgSup && !delListImgLoader && multipleImgMode\"\n (click)=\"selectImgChosen()\"\n type=\"button\"\n >\n <i class=\"fal fa-check\"></i>\n {{ 'ImgManager.ImgLib.select' | translate }} ({{nbImgToDelSelected}})\n </button>\n\n <!-- Display btn del multiple img -->\n <button\n *ngIf=\"listDisplayed && nbImgToDelSelected && !confirmImgSup\"\n (click)=\"displayConfirmImgSup()\"\n class=\"button images-view__container__boxAction__delBtn danger\"\n @insertRemoveAnnim\n type=\"button\"\n >\n <i class=\"fal fa-times\"></i>{{ 'ImgManager.ImgLib.delMlt' | translate }} ({{nbImgToDelSelected}})\n <span btnLoadingAnim *ngIf=\"delListImgLoader\" class=\"btnLoadingAnnimation\"></span>\n </button>\n\n <!-- Confirm action -->\n <div\n class=\"images-view__container__boxAction__confirmSup\"\n [ngClass]=\"{'images-view__container__boxAction__confirmSup--visible': confirmImgSup}\">\n <p *ngIf=\"nbImgToDelSelected > 1\" class=\"images-view__container__boxAction__confirmSup__text\">{{ 'ImgManager.ImgLib.confirmSupQuestions' | translate:{nbImage: nbImgToDelSelected} }}</p>\n <p *ngIf=\"nbImgToDelSelected === 1\" class=\"images-view__container__boxAction__confirmSup__text\">{{ 'ImgManager.ImgLib.confirmSupQuestion' | translate:{nbImage: nbImgToDelSelected} }}</p>\n <div>\n <button\n class=\"button images-view__container__boxAction__confirmSup__cancel\"\n (click)=\"cancelSup()\"\n type=\"button\"\n >\n {{ 'ImgManager.ImgLib.cancel' | translate }}\n </button>\n <button\n (click)=\"removeListImg()\"\n class=\"button images-view__container__delBtn danger\"\n type=\"button\"\n >\n {{ 'ImgManager.ImgLib.confirm' | translate }}\n </button>\n </div>\n </div>\n\n </div>\n\n\n <!-- Swith mosaic/list forma -->\n <div class=\"field has-addons images-view__container__buttonBox\">\n <div class=\"control\">\n <div\n class=\"button is-lighted images-view__container__buttonBox__btn\"\n [ngClass]=\"{'actifDisplayed': !listDisplayed}\"\n (click)=\"onSwitchFormatDisplayed(false)\"\n >\n <span class=\"icon is-small\">\n <i class=\"far fa-th\"></i>\n </span>\n </div>\n </div>\n\n <div class=\"control\">\n <div class=\"button is-lighted images-view__container__buttonBox__btn\"\n [ngClass]=\"{'actifDisplayed': listDisplayed}\"\n (click)=\"onSwitchFormatDisplayed(true)\"\n >\n <span class=\"icon is-small\">\n <i class=\"fas fa-bars\"></i>\n </span>\n </div>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n <!-- Images section -->\n<perfect-scrollbar\n [config]=\"{ suppressScrollX: true }\"\n class=\"images-view__scroll\"\n [ngClass]=\"{\n 'images-view__scroll--hide--mosaic': displayPexelsResults && !listDisplayed,\n 'images-view__scroll--hide--mosaic--small': displayPexelsResults && !listDisplayed && stateDisplayed === 'small',\n 'images-view__scroll--hide--table': displayPexelsResults && listDisplayed,\n 'images-view__scroll--full': stateDisplayed === 'full',\n 'images-view__scroll--smallDisplay' : stateDisplayed === 'small' && tabDisplayed !== 'img-upload',\n 'images-view__scroll--smallUploadDisplay' : stateDisplayed === 'small' && tabDisplayed === 'img-upload',\n 'images-view__scroll--window': stateDisplayed === 'window'\n}\"\n>\n <div #imgLibContainer class=\"images-view__wrapper\">\n <div *ngIf=\"!listDisplayed || stateDisplayed === 'small'\" [@easeInOut]=\"'in'\">\n <mosaic-view\n [picturesList]=\"picturesList\"\n (picturesListChange)=\"onPicturesListChange()\"\n [tableFilters]=\"tableFilters\"\n (filtersChange)=\"onFiltersChange()\"\n [(disable)]=\"disable\"\n (pictureNameChange)=\"onRenamePicture($event)\"\n (switchDisplayWindow)=\"switchDisplayWindowMosaic()\"\n [nbFakeImg]=\"nbFakeImg\"\n [stateDisplayed]=\"stateDisplayed\"\n [tabDisplayed]=\"tabDisplayed\"\n [displayPexelsResults]=\"displayPexelsResults\"\n [isLoading]=\"isLoading\"\n [fullSize]=\"fullSize\"\n >\n </mosaic-view>\n </div>\n\n <div *ngIf=\"listDisplayed && stateDisplayed !== 'small'\" [@easeInOut]=\"'in'\">\n <table-view\n [picturesList]=\"picturesList\"\n (picturesListChange)=\"onPicturesListChange()\"\n [tableFilters]=\"tableFilters\"\n (filtersChange)=\"onFiltersChange()\"\n [(disable)]=\"disable\"\n (pictureNameChange)=\"onRenamePicture($event)\"\n [displayPexelsResults]=\"displayPexelsResults\"\n [stateDisplayed]=\"stateDisplayed\"\n [isLoading]=\"isLoading\"\n >\n </table-view>\n </div>\n\n </div>\n</perfect-scrollbar>\n\n<!-- Pexels Section - When no img found -->\n<div\n *ngIf=\"displayPexelsResults\"\n class=\"images-view--pexels\"\n [@easeInOut]=\"'in'\">\n <pexels-lib\n [searchValue]=\"tableFilters.searchValue\"\n (showImgUploaded)=\"onShowImgUploaded()\"\n [disableSearch]=\"true\"\n >\n </pexels-lib>\n</div>\n" }]
|
|
3463
3469
|
}], ctorParameters: function () { return [{ type: ImgManagerService }, { type: ImgEventService }, { type: ImgSelectionService }, { type: AlertService }, { type: UserSettingsService }, { type: RenamePictureService }]; }, propDecorators: { stateDisplayed: [{
|
|
3464
3470
|
type: Input
|
|
3465
3471
|
}], tabDisplayed: [{
|
|
@@ -3934,10 +3940,10 @@ class WzImgManagerComponent {
|
|
|
3934
3940
|
}
|
|
3935
3941
|
}
|
|
3936
3942
|
WzImgManagerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: WzImgManagerComponent, deps: [{ token: ImgSelectionService }, { token: ImgManagerConfigService }, { token: UserSettingsService }, { token: CanvaService }, { token: ImgEventService }, { token: DomService }], target: i0.ɵɵFactoryTarget.Component });
|
|
3937
|
-
WzImgManagerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.3", type: WzImgManagerComponent, selector: "wz-img-manager", inputs: { stateDisplayed: "stateDisplayed", showSelection: "showSelection", externalConfig: "externalConfig", forceToOpenCanva: "forceToOpenCanva", multipleImgMode: "multipleImgMode", showImgManagerModule: "showImgManagerModule" }, outputs: { imgManagerClosed: "imgManagerClosed" }, host: { listeners: { "document:keydown.escape": "onKeydownHandler($event)" } }, ngImport: i0, template: "<div class=\"wz-img-manager\">\n <!-- Img slection handler -->\n <div class=\"wz-img-manager__selectionHandler\" *ngIf=\"showSelection\">\n <img-selection></img-selection>\n </div>\n\n <!-- Img manager module -->\n <div\n *ngIf=\"_showImgManagerModule\"\n class=\"wz-img-manager__module\"\n [ngClass]=\"{\n 'wz-img-manager__module--small': stateDisplayed === 'small',\n 'wz-img-manager__module--full': stateDisplayed === 'full',\n 'wz-img-manager__module--window': stateDisplayed === 'window',\n 'wz-img-manager__module--edit': hideTab}\"\n >\n\n <div class=\"wz-img-manager__module__header\" *ngIf=\"stateDisplayed !== 'window'\">\n <button (click)=\"openSmall()\" *ngIf=\"stateDisplayed === 'full'\"><span>Expand</span><i class=\"fal fa-compress-alt\"></i></button>\n <button (click)=\"openSmall()\" *ngIf=\"stateDisplayed === 'closed'\"><span>Expand</span><i class=\"fal fa-expand-alt\"></i></button>\n <button (click)=\"openFull()\" *ngIf=\"stateDisplayed === 'small'\"><span>Expand</span><i class=\"fal fa-expand-alt\"></i></button>\n <button (click)=\"onClose()\" *ngIf=\"stateDisplayed !== 'closed'\"><span>Close</span><i class=\"fal fa-times\"></i></button>\n </div>\n\n <div\n class=\"wz-img-manager__module__content wz-block\"\n [ngClass]=\"{'wz-block--window': stateDisplayed === 'window'}\">\n <img-tabs\n [stateDisplayed]=\"stateDisplayed\"\n [multipleImgMode]=\"multipleImgMode\"\n [listDisplayed]=\"listDisplayed\"\n (imgManagerClosed)=\"onImgManagerClosed()\"\n (switchDisplayWindow)=\"changeDisplayTab()\"\n (currentTab)=\"setCurrentTab($event)\">\n </img-tabs>\n </div>\n </div>\n\n</div>\n", dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ImgTabsComponent, selector: "img-tabs", inputs: ["multipleImgMode", "stateDisplayed", "listDisplayed"], outputs: ["imgManagerClosed", "currentTab", "switchDisplayWindow"] }, { kind: "component", type: ImgSelectionComponent, selector: "img-selection", inputs: ["tabDisplayed"], outputs: ["imgManagerClosed"] }] });
|
|
3943
|
+
WzImgManagerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.1.3", type: WzImgManagerComponent, selector: "wz-img-manager", inputs: { stateDisplayed: "stateDisplayed", showSelection: "showSelection", externalConfig: "externalConfig", forceToOpenCanva: "forceToOpenCanva", multipleImgMode: "multipleImgMode", showImgManagerModule: "showImgManagerModule" }, outputs: { imgManagerClosed: "imgManagerClosed" }, host: { listeners: { "document:keydown.escape": "onKeydownHandler($event)" } }, ngImport: i0, template: "<div class=\"wz-img-manager\">\n <!-- Img slection handler -->\n <div class=\"wz-img-manager__selectionHandler\" *ngIf=\"showSelection\">\n <img-selection></img-selection>\n </div>\n\n <!-- Img manager module -->\n <div\n *ngIf=\"_showImgManagerModule\"\n class=\"wz-img-manager__module\"\n [ngClass]=\"{\n 'wz-img-manager__module--small': stateDisplayed === 'small',\n 'wz-img-manager__module--full': stateDisplayed === 'full',\n 'wz-img-manager__module--window': stateDisplayed === 'window',\n 'wz-img-manager__module--edit': hideTab}\"\n >\n\n <div class=\"wz-img-manager__module__header\" *ngIf=\"stateDisplayed !== 'window'\">\n <button (click)=\"openSmall()\" *ngIf=\"stateDisplayed === 'full'\" type=\"button\"><span>Expand</span><i class=\"fal fa-compress-alt\"></i></button>\n <button (click)=\"openSmall()\" *ngIf=\"stateDisplayed === 'closed'\" type=\"button\"><span>Expand</span><i class=\"fal fa-expand-alt\"></i></button>\n <button (click)=\"openFull()\" *ngIf=\"stateDisplayed === 'small'\" type=\"button\"><span>Expand</span><i class=\"fal fa-expand-alt\"></i></button>\n <button (click)=\"onClose()\" *ngIf=\"stateDisplayed !== 'closed'\" type=\"button\"><span>Close</span><i class=\"fal fa-times\"></i></button>\n </div>\n\n <div\n class=\"wz-img-manager__module__content wz-block\"\n [ngClass]=\"{'wz-block--window': stateDisplayed === 'window'}\">\n <img-tabs\n [stateDisplayed]=\"stateDisplayed\"\n [multipleImgMode]=\"multipleImgMode\"\n [listDisplayed]=\"listDisplayed\"\n (imgManagerClosed)=\"onImgManagerClosed()\"\n (switchDisplayWindow)=\"changeDisplayTab()\"\n (currentTab)=\"setCurrentTab($event)\">\n </img-tabs>\n </div>\n </div>\n\n</div>\n", dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ImgTabsComponent, selector: "img-tabs", inputs: ["multipleImgMode", "stateDisplayed", "listDisplayed"], outputs: ["imgManagerClosed", "currentTab", "switchDisplayWindow"] }, { kind: "component", type: ImgSelectionComponent, selector: "img-selection", inputs: ["tabDisplayed"], outputs: ["imgManagerClosed"] }] });
|
|
3938
3944
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.1.3", ngImport: i0, type: WzImgManagerComponent, decorators: [{
|
|
3939
3945
|
type: Component,
|
|
3940
|
-
args: [{ selector: 'wz-img-manager', template: "<div class=\"wz-img-manager\">\n <!-- Img slection handler -->\n <div class=\"wz-img-manager__selectionHandler\" *ngIf=\"showSelection\">\n <img-selection></img-selection>\n </div>\n\n <!-- Img manager module -->\n <div\n *ngIf=\"_showImgManagerModule\"\n class=\"wz-img-manager__module\"\n [ngClass]=\"{\n 'wz-img-manager__module--small': stateDisplayed === 'small',\n 'wz-img-manager__module--full': stateDisplayed === 'full',\n 'wz-img-manager__module--window': stateDisplayed === 'window',\n 'wz-img-manager__module--edit': hideTab}\"\n >\n\n <div class=\"wz-img-manager__module__header\" *ngIf=\"stateDisplayed !== 'window'\">\n <button (click)=\"openSmall()\" *ngIf=\"stateDisplayed === 'full'\"><span>Expand</span><i class=\"fal fa-compress-alt\"></i></button>\n <button (click)=\"openSmall()\" *ngIf=\"stateDisplayed === 'closed'\"><span>Expand</span><i class=\"fal fa-expand-alt\"></i></button>\n <button (click)=\"openFull()\" *ngIf=\"stateDisplayed === 'small'\"><span>Expand</span><i class=\"fal fa-expand-alt\"></i></button>\n <button (click)=\"onClose()\" *ngIf=\"stateDisplayed !== 'closed'\"><span>Close</span><i class=\"fal fa-times\"></i></button>\n </div>\n\n <div\n class=\"wz-img-manager__module__content wz-block\"\n [ngClass]=\"{'wz-block--window': stateDisplayed === 'window'}\">\n <img-tabs\n [stateDisplayed]=\"stateDisplayed\"\n [multipleImgMode]=\"multipleImgMode\"\n [listDisplayed]=\"listDisplayed\"\n (imgManagerClosed)=\"onImgManagerClosed()\"\n (switchDisplayWindow)=\"changeDisplayTab()\"\n (currentTab)=\"setCurrentTab($event)\">\n </img-tabs>\n </div>\n </div>\n\n</div>\n" }]
|
|
3946
|
+
args: [{ selector: 'wz-img-manager', template: "<div class=\"wz-img-manager\">\n <!-- Img slection handler -->\n <div class=\"wz-img-manager__selectionHandler\" *ngIf=\"showSelection\">\n <img-selection></img-selection>\n </div>\n\n <!-- Img manager module -->\n <div\n *ngIf=\"_showImgManagerModule\"\n class=\"wz-img-manager__module\"\n [ngClass]=\"{\n 'wz-img-manager__module--small': stateDisplayed === 'small',\n 'wz-img-manager__module--full': stateDisplayed === 'full',\n 'wz-img-manager__module--window': stateDisplayed === 'window',\n 'wz-img-manager__module--edit': hideTab}\"\n >\n\n <div class=\"wz-img-manager__module__header\" *ngIf=\"stateDisplayed !== 'window'\">\n <button (click)=\"openSmall()\" *ngIf=\"stateDisplayed === 'full'\" type=\"button\"><span>Expand</span><i class=\"fal fa-compress-alt\"></i></button>\n <button (click)=\"openSmall()\" *ngIf=\"stateDisplayed === 'closed'\" type=\"button\"><span>Expand</span><i class=\"fal fa-expand-alt\"></i></button>\n <button (click)=\"openFull()\" *ngIf=\"stateDisplayed === 'small'\" type=\"button\"><span>Expand</span><i class=\"fal fa-expand-alt\"></i></button>\n <button (click)=\"onClose()\" *ngIf=\"stateDisplayed !== 'closed'\" type=\"button\"><span>Close</span><i class=\"fal fa-times\"></i></button>\n </div>\n\n <div\n class=\"wz-img-manager__module__content wz-block\"\n [ngClass]=\"{'wz-block--window': stateDisplayed === 'window'}\">\n <img-tabs\n [stateDisplayed]=\"stateDisplayed\"\n [multipleImgMode]=\"multipleImgMode\"\n [listDisplayed]=\"listDisplayed\"\n (imgManagerClosed)=\"onImgManagerClosed()\"\n (switchDisplayWindow)=\"changeDisplayTab()\"\n (currentTab)=\"setCurrentTab($event)\">\n </img-tabs>\n </div>\n </div>\n\n</div>\n" }]
|
|
3941
3947
|
}], ctorParameters: function () { return [{ type: ImgSelectionService }, { type: ImgManagerConfigService }, { type: UserSettingsService }, { type: CanvaService }, { type: ImgEventService }, { type: DomService }]; }, propDecorators: { stateDisplayed: [{
|
|
3942
3948
|
type: Input
|
|
3943
3949
|
}], showSelection: [{
|