@wizishop/img-manager 15.2.59 → 15.2.61

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.
Files changed (36) hide show
  1. package/assets/i18n/en.json +1 -1
  2. package/assets/i18n/es.json +1 -1
  3. package/assets/i18n/fr.json +1 -1
  4. package/assets/i18n/it.json +1 -1
  5. package/esm2020/lib/components/images-view/images-actions-handler.mjs +1 -4
  6. package/esm2020/lib/components/images-view/mosaic-view/img-card/img-card.component.mjs +3 -3
  7. package/esm2020/lib/components/images-view/table-view/table-view.component.mjs +3 -3
  8. package/esm2020/lib/components/img-editor/img-editor.component.mjs +7 -44
  9. package/esm2020/lib/components/img-tabs/img-tabs.component.mjs +3 -12
  10. package/esm2020/lib/dto/img-manager.dto.mjs +1 -1
  11. package/esm2020/lib/services/api.service.mjs +1 -1
  12. package/esm2020/lib/services/img-event.service.mjs +1 -8
  13. package/esm2020/lib/services/rename-picture.service.mjs +1 -4
  14. package/esm2020/lib/wz-img-manager.module.mjs +1 -7
  15. package/fesm2015/wizishop-img-manager.mjs +9 -257
  16. package/fesm2015/wizishop-img-manager.mjs.map +1 -1
  17. package/fesm2020/wizishop-img-manager.mjs +9 -256
  18. package/fesm2020/wizishop-img-manager.mjs.map +1 -1
  19. package/lib/components/images-view/images-actions-handler.d.ts +0 -1
  20. package/lib/components/img-editor/img-editor.component.d.ts +1 -8
  21. package/lib/components/img-tabs/img-tabs.component.d.ts +0 -1
  22. package/lib/dto/img-manager.dto.d.ts +0 -1
  23. package/lib/services/api.service.d.ts +0 -1
  24. package/lib/services/img-event.service.d.ts +0 -3
  25. package/lib/services/rename-picture.service.d.ts +0 -1
  26. package/lib/wz-img-manager.module.d.ts +44 -46
  27. package/package.json +1 -1
  28. package/wizishop-img-manager-15.2.61.tgz +0 -0
  29. package/wz-img-manager.scss +2 -183
  30. package/esm2020/lib/components/img-editor/info-video/info-video.component.mjs +0 -62
  31. package/esm2020/lib/components/img-editor/show-iframe/show-iframe.component.mjs +0 -54
  32. package/esm2020/lib/services/video-info.service.mjs +0 -87
  33. package/lib/components/img-editor/info-video/info-video.component.d.ts +0 -20
  34. package/lib/components/img-editor/show-iframe/show-iframe.component.d.ts +0 -15
  35. package/lib/services/video-info.service.d.ts +0 -23
  36. package/wizishop-img-manager-15.2.59.tgz +0 -0
@@ -18,7 +18,6 @@ import { NG_VALUE_ACCESSOR, FormsModule } from '@angular/forms';
18
18
  import * as i3$2 from '@angular/router';
19
19
  import * as i8 from 'ngx-scrollbar/reached-event';
20
20
  import { NgScrollbarReachedModule } from 'ngx-scrollbar/reached-event';
21
- import * as i1$1 from '@angular/platform-browser';
22
21
  import * as i4$1 from 'ngx-image-cropper';
23
22
  import { ImageCropperModule } from 'ngx-image-cropper';
24
23
  import { v4 } from 'uuid';
@@ -170,22 +169,15 @@ class ImgEventService {
170
169
  constructor() {
171
170
  this.imgRemoved$ = new BehaviorSubject(undefined);
172
171
  this.imgToEditEvent = new Subject();
173
- this.imgToVideoEvent = new Subject();
174
172
  this.imgAdded = new Subject();
175
173
  this.listDisplayedChange = new Subject();
176
174
  }
177
175
  emitImgToEdit(imgToEdit) {
178
176
  this.imgToEditEvent.next(imgToEdit);
179
177
  }
180
- emitImgToVideo(imgToEdit) {
181
- this.imgToVideoEvent.next(imgToEdit);
182
- }
183
178
  getImgToEditEventListener() {
184
179
  return this.imgToEditEvent.asObservable();
185
180
  }
186
- getImgToVideoEventListener() {
187
- return this.imgToVideoEvent.asObservable();
188
- }
189
181
  emitImgAdded(id_file) {
190
182
  this.imgAdded.next(id_file);
191
183
  }
@@ -619,9 +611,6 @@ class RenamePictureService {
619
611
  setPicturesList(picturesList) {
620
612
  this.picturesList = picturesList;
621
613
  }
622
- changeVideoLink(videoLink, idFile) {
623
- return this.apiService.changeVideoLink(videoLink, idFile).pipe(tap(() => this.imgManagerService.refreshImageList$.next()));
624
- }
625
614
  renamePicture(pictureNameUpdate) {
626
615
  const picture = this.getPictureById(pictureNameUpdate.id);
627
616
  if (!picture) {
@@ -746,9 +735,6 @@ class ImagesActionHandler {
746
735
  onEdit(picture) {
747
736
  this.imgEventCardService.emitImgToEdit(picture);
748
737
  }
749
- redirectToVideo(picture) {
750
- this.imgEventCardService.emitImgToVideo(picture);
751
- }
752
738
  copyLink(file_name) {
753
739
  const url = this.imgCDNService.getUrlImg('raw') + file_name;
754
740
  this.imgManager.copyToClipboard(url).then(success => {
@@ -926,14 +912,14 @@ class ImgCardComponent extends ImagesActionHandler {
926
912
  }
927
913
  }
928
914
  ImgCardComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ImgCardComponent, deps: [{ token: ImgManagerService }, { token: ImgSelectionService }, { token: i3$1.HttpClient }, { token: ImgCDNService }, { token: ImgEventService }, { token: AlertService }, { token: i3.TranslateService }, { token: ApiService }], target: i0.ɵɵFactoryTarget.Component });
929
- ImgCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", 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 }\">\r\n <div class=\"img-card\">\r\n <div class=\"img-card__container\"\r\n [ngClass]=\"{\r\n 'smallDisplay': stateDisplayed === 'small' || isUploadSection,\r\n 'imgSelected': picture.selected,\r\n 'deletion': picture.deleted}\">\r\n <img\r\n class=\"img-card__container__img\"\r\n [src]=\"picture.file_name | imgSrc : '400'\"\r\n [alt]=\"picture.display_name\"\r\n (click)=\"onToggleImgSelected()\"\r\n (error)=\"picture.imgNotLoaded=true;onPictureNotLoading($event);\"\r\n />\r\n <div class=\"hover-img-size\">\r\n <span>{{picture.raw_height}}x{{picture.raw_width}}</span>\r\n </div>\r\n <div\r\n class=\"img-card__container__config\"\r\n *ngIf=\"!picture.deleted && stateDisplayed !== 'small'\"\r\n >\r\n <button type=\"button\" class=\"size\" (click)=\"redirectToVideo(picture)\"><i class=\"fa-solid fa-play\"></i><span>{{ 'ImgManager.ImgEditor.AddVideo' | translate }}</span></button>\r\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>\r\n <button type=\"button\" class=\"edit\" (click)=\"onEdit(picture)\"><i class=\"far fa-crop-alt\"></i><span>{{ 'ImgManager.ImgCard.edit' | translate }}</span></button>\r\n <button type=\"button\" class=\"copy\" (click)=\"copyLink(picture.file_name)\"><i class=\"fal fa-copy\"></i><span>{{ 'ImgManager.ImgCard.copyLink' | translate }}</span></button>\r\n <button type=\"button\" class=\"deleted\" (click)=\"activeConfirmDelete = true;\"><i class=\"fal fa-times\"></i><span>{{ 'ImgManager.ImgCard.del' | translate }}</span></button>\r\n <button type=\"button\" class=\"selected\" (click)=\"onToggleImgSelected()\" *ngIf=\"stateDisplayed !== 'window'\">\r\n <i *ngIf=\"!picture.selected\" class=\"fal fa-square\"></i>\r\n <i *ngIf=\"picture.selected\" class=\"fa-solid fa-check-square checked\"></i>\r\n <span>{{ 'ImgManager.ImgCard.select' | translate }}</span>\r\n </button>\r\n </div>\r\n <div\r\n class=\"img-card__container__config img-card__container__config--small\"\r\n *ngIf=\"!picture.deleted && stateDisplayed === 'small'\"\r\n >\r\n <button class=\"show-edit\" (click)=\"displayLargeWindow()\"><i class=\"fa-solid fa-edit\"></i></button>\r\n </div>\r\n <div class=\"img-card__container__delete\" [ngClass]=\"{ 'show' : activeConfirmDelete}\">\r\n <span>{{ 'ImgManager.ImgCard.confirmDeleteImg' | translate }}</span>\r\n <div>\r\n <button (click)=\"activeConfirmDelete = false;\">{{ 'no' | translate }}</button>\r\n <button (click)=\"onRemoveImg(picture);activeConfirmDelete = false;\">{{ 'yes' | translate }}</button>\r\n </div>\r\n </div>\r\n <div class=\"img-card__container__valid\" *ngIf=\"stateDisplayed === 'small' && tabDisplayed == 'img-upload'\">\r\n <i class=\"far fa-check\"></i>\r\n <span>{{ 'ImgManager.ImgCard.validImgSmall' | translate }}</span>\r\n </div>\r\n <div\r\n *ngIf=\"picture.imgNotLoaded\"\r\n class=\"img-card__container__overlay\"\r\n [ngClass]=\"{'img-card__container__overlay--smallDisplay': stateDisplayed === 'small' || isUploadSection}\">\r\n <i (click)=\"onToggleImgSelected()\" class=\"fad fa-folder-times\"></i>\r\n </div>\r\n <span btnLoadingAnim class=\"btnLoadingAnnimation\" *ngIf=\"picture.deleted\"></span>\r\n <div *ngIf=\"picture.video_link\" class=\"img-card__container__video\">\r\n <i class=\"fa-solid fa-play\"></i>\r\n <span>{{ 'ImgManager.ImgEditor.Video' | translate }}</span>\r\n </div>\r\n </div>\r\n <div\r\n class=\"img-card__nameContainer\"\r\n [ngClass]=\"{'smallNameDisplay': stateDisplayed === 'small' || isUploadSection, 'focus': focusInput}\">\r\n <input\r\n type=\"text\"\r\n class=\"wzImgMngInput img-card__nameContainer__name\"\r\n [(ngModel)]=\"picture.display_name\"\r\n (ngModelChange)=\"onNameChange(picture.id_file)\"\r\n [ngModelOptions]=\"{standalone: true, updateOn: 'blur'}\"\r\n (focus)=\"previousName=picture.display_name;focusInput = true;\"\r\n (blur)=\"focusInput = false;\"\r\n >\r\n <span>{{picture.display_name}}</span>\r\n </div>\r\n\r\n </div>\r\n</div>\r\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: i3.TranslatePipe, name: "translate" }, { kind: "pipe", type: ImageSrcPipe, name: "imgSrc" }], animations: [
915
+ ImgCardComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", 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 }\">\r\n <div class=\"img-card\">\r\n <div class=\"img-card__container\"\r\n [ngClass]=\"{\r\n 'smallDisplay': stateDisplayed === 'small' || isUploadSection,\r\n 'imgSelected': picture.selected,\r\n 'deletion': picture.deleted}\">\r\n <img\r\n class=\"img-card__container__img\"\r\n [src]=\"picture.file_name | imgSrc : '400'\"\r\n [alt]=\"picture.display_name\"\r\n (click)=\"onToggleImgSelected()\"\r\n (error)=\"picture.imgNotLoaded=true;onPictureNotLoading($event);\"\r\n />\r\n <div\r\n class=\"img-card__container__config\"\r\n *ngIf=\"!picture.deleted && stateDisplayed !== 'small'\"\r\n >\r\n <button type=\"button\" class=\"size\"><i class=\"fal fa-image-polaroid\"></i><span>{{picture.raw_height}}x{{picture.raw_width}}</span></button>\r\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>\r\n <button type=\"button\" class=\"edit\" (click)=\"onEdit(picture)\"><i class=\"far fa-crop-alt\"></i><span>{{ 'ImgManager.ImgCard.edit' | translate }}</span></button>\r\n <button type=\"button\" class=\"copy\" (click)=\"copyLink(picture.file_name)\"><i class=\"fal fa-copy\"></i><span>{{ 'ImgManager.ImgCard.copyLink' | translate }}</span></button>\r\n <button type=\"button\" class=\"deleted\" (click)=\"activeConfirmDelete = true;\"><i class=\"fal fa-times\"></i><span>{{ 'ImgManager.ImgCard.del' | translate }}</span></button>\r\n <button type=\"button\" class=\"selected\" (click)=\"onToggleImgSelected()\" *ngIf=\"stateDisplayed !== 'window'\">\r\n <i *ngIf=\"!picture.selected\" class=\"fal fa-square\"></i>\r\n <i *ngIf=\"picture.selected\" class=\"fa-solid fa-check-square checked\"></i>\r\n <span>{{ 'ImgManager.ImgCard.select' | translate }}</span>\r\n </button>\r\n </div>\r\n <div\r\n class=\"img-card__container__config img-card__container__config--small\"\r\n *ngIf=\"!picture.deleted && stateDisplayed === 'small'\"\r\n >\r\n <button class=\"show-edit\" (click)=\"displayLargeWindow()\"><i class=\"fa-solid fa-edit\"></i></button>\r\n </div>\r\n <div class=\"img-card__container__delete\" [ngClass]=\"{ 'show' : activeConfirmDelete}\">\r\n <span>{{ 'ImgManager.ImgCard.confirmDeleteImg' | translate }}</span>\r\n <div>\r\n <button (click)=\"activeConfirmDelete = false;\">{{ 'no' | translate }}</button>\r\n <button (click)=\"onRemoveImg(picture);activeConfirmDelete = false;\">{{ 'yes' | translate }}</button>\r\n </div>\r\n </div>\r\n <div class=\"img-card__container__valid\" *ngIf=\"stateDisplayed === 'small' && tabDisplayed == 'img-upload'\">\r\n <i class=\"far fa-check\"></i>\r\n <span>{{ 'ImgManager.ImgCard.validImgSmall' | translate }}</span>\r\n </div>\r\n <div\r\n *ngIf=\"picture.imgNotLoaded\"\r\n class=\"img-card__container__overlay\"\r\n [ngClass]=\"{'img-card__container__overlay--smallDisplay': stateDisplayed === 'small' || isUploadSection}\">\r\n <i (click)=\"onToggleImgSelected()\" class=\"fad fa-folder-times\"></i>\r\n </div>\r\n <span btnLoadingAnim class=\"btnLoadingAnnimation\" *ngIf=\"picture.deleted\"></span>\r\n\r\n </div>\r\n <div\r\n class=\"img-card__nameContainer\"\r\n [ngClass]=\"{'smallNameDisplay': stateDisplayed === 'small' || isUploadSection, 'focus': focusInput}\">\r\n <input\r\n type=\"text\"\r\n class=\"wzImgMngInput img-card__nameContainer__name\"\r\n [(ngModel)]=\"picture.display_name\"\r\n (ngModelChange)=\"onNameChange(picture.id_file)\"\r\n [ngModelOptions]=\"{standalone: true, updateOn: 'blur'}\"\r\n (focus)=\"previousName=picture.display_name;focusInput = true;\"\r\n (blur)=\"focusInput = false;\"\r\n >\r\n <span>{{picture.display_name}}</span>\r\n </div>\r\n\r\n </div>\r\n</div>\r\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: i3.TranslatePipe, name: "translate" }, { kind: "pipe", type: ImageSrcPipe, name: "imgSrc" }], animations: [
930
916
  easeInOut
931
917
  ] });
932
918
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ImgCardComponent, decorators: [{
933
919
  type: Component,
934
920
  args: [{ selector: 'img-card', animations: [
935
921
  easeInOut
936
- ], template: "<div class=\"addCssPriority\" [@easeInOut]=\"'in'\" [ngClass]=\"{ 'fullSize': fullSize }\">\r\n <div class=\"img-card\">\r\n <div class=\"img-card__container\"\r\n [ngClass]=\"{\r\n 'smallDisplay': stateDisplayed === 'small' || isUploadSection,\r\n 'imgSelected': picture.selected,\r\n 'deletion': picture.deleted}\">\r\n <img\r\n class=\"img-card__container__img\"\r\n [src]=\"picture.file_name | imgSrc : '400'\"\r\n [alt]=\"picture.display_name\"\r\n (click)=\"onToggleImgSelected()\"\r\n (error)=\"picture.imgNotLoaded=true;onPictureNotLoading($event);\"\r\n />\r\n <div class=\"hover-img-size\">\r\n <span>{{picture.raw_height}}x{{picture.raw_width}}</span>\r\n </div>\r\n <div\r\n class=\"img-card__container__config\"\r\n *ngIf=\"!picture.deleted && stateDisplayed !== 'small'\"\r\n >\r\n <button type=\"button\" class=\"size\" (click)=\"redirectToVideo(picture)\"><i class=\"fa-solid fa-play\"></i><span>{{ 'ImgManager.ImgEditor.AddVideo' | translate }}</span></button>\r\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>\r\n <button type=\"button\" class=\"edit\" (click)=\"onEdit(picture)\"><i class=\"far fa-crop-alt\"></i><span>{{ 'ImgManager.ImgCard.edit' | translate }}</span></button>\r\n <button type=\"button\" class=\"copy\" (click)=\"copyLink(picture.file_name)\"><i class=\"fal fa-copy\"></i><span>{{ 'ImgManager.ImgCard.copyLink' | translate }}</span></button>\r\n <button type=\"button\" class=\"deleted\" (click)=\"activeConfirmDelete = true;\"><i class=\"fal fa-times\"></i><span>{{ 'ImgManager.ImgCard.del' | translate }}</span></button>\r\n <button type=\"button\" class=\"selected\" (click)=\"onToggleImgSelected()\" *ngIf=\"stateDisplayed !== 'window'\">\r\n <i *ngIf=\"!picture.selected\" class=\"fal fa-square\"></i>\r\n <i *ngIf=\"picture.selected\" class=\"fa-solid fa-check-square checked\"></i>\r\n <span>{{ 'ImgManager.ImgCard.select' | translate }}</span>\r\n </button>\r\n </div>\r\n <div\r\n class=\"img-card__container__config img-card__container__config--small\"\r\n *ngIf=\"!picture.deleted && stateDisplayed === 'small'\"\r\n >\r\n <button class=\"show-edit\" (click)=\"displayLargeWindow()\"><i class=\"fa-solid fa-edit\"></i></button>\r\n </div>\r\n <div class=\"img-card__container__delete\" [ngClass]=\"{ 'show' : activeConfirmDelete}\">\r\n <span>{{ 'ImgManager.ImgCard.confirmDeleteImg' | translate }}</span>\r\n <div>\r\n <button (click)=\"activeConfirmDelete = false;\">{{ 'no' | translate }}</button>\r\n <button (click)=\"onRemoveImg(picture);activeConfirmDelete = false;\">{{ 'yes' | translate }}</button>\r\n </div>\r\n </div>\r\n <div class=\"img-card__container__valid\" *ngIf=\"stateDisplayed === 'small' && tabDisplayed == 'img-upload'\">\r\n <i class=\"far fa-check\"></i>\r\n <span>{{ 'ImgManager.ImgCard.validImgSmall' | translate }}</span>\r\n </div>\r\n <div\r\n *ngIf=\"picture.imgNotLoaded\"\r\n class=\"img-card__container__overlay\"\r\n [ngClass]=\"{'img-card__container__overlay--smallDisplay': stateDisplayed === 'small' || isUploadSection}\">\r\n <i (click)=\"onToggleImgSelected()\" class=\"fad fa-folder-times\"></i>\r\n </div>\r\n <span btnLoadingAnim class=\"btnLoadingAnnimation\" *ngIf=\"picture.deleted\"></span>\r\n <div *ngIf=\"picture.video_link\" class=\"img-card__container__video\">\r\n <i class=\"fa-solid fa-play\"></i>\r\n <span>{{ 'ImgManager.ImgEditor.Video' | translate }}</span>\r\n </div>\r\n </div>\r\n <div\r\n class=\"img-card__nameContainer\"\r\n [ngClass]=\"{'smallNameDisplay': stateDisplayed === 'small' || isUploadSection, 'focus': focusInput}\">\r\n <input\r\n type=\"text\"\r\n class=\"wzImgMngInput img-card__nameContainer__name\"\r\n [(ngModel)]=\"picture.display_name\"\r\n (ngModelChange)=\"onNameChange(picture.id_file)\"\r\n [ngModelOptions]=\"{standalone: true, updateOn: 'blur'}\"\r\n (focus)=\"previousName=picture.display_name;focusInput = true;\"\r\n (blur)=\"focusInput = false;\"\r\n >\r\n <span>{{picture.display_name}}</span>\r\n </div>\r\n\r\n </div>\r\n</div>\r\n" }]
922
+ ], template: "<div class=\"addCssPriority\" [@easeInOut]=\"'in'\" [ngClass]=\"{ 'fullSize': fullSize }\">\r\n <div class=\"img-card\">\r\n <div class=\"img-card__container\"\r\n [ngClass]=\"{\r\n 'smallDisplay': stateDisplayed === 'small' || isUploadSection,\r\n 'imgSelected': picture.selected,\r\n 'deletion': picture.deleted}\">\r\n <img\r\n class=\"img-card__container__img\"\r\n [src]=\"picture.file_name | imgSrc : '400'\"\r\n [alt]=\"picture.display_name\"\r\n (click)=\"onToggleImgSelected()\"\r\n (error)=\"picture.imgNotLoaded=true;onPictureNotLoading($event);\"\r\n />\r\n <div\r\n class=\"img-card__container__config\"\r\n *ngIf=\"!picture.deleted && stateDisplayed !== 'small'\"\r\n >\r\n <button type=\"button\" class=\"size\"><i class=\"fal fa-image-polaroid\"></i><span>{{picture.raw_height}}x{{picture.raw_width}}</span></button>\r\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>\r\n <button type=\"button\" class=\"edit\" (click)=\"onEdit(picture)\"><i class=\"far fa-crop-alt\"></i><span>{{ 'ImgManager.ImgCard.edit' | translate }}</span></button>\r\n <button type=\"button\" class=\"copy\" (click)=\"copyLink(picture.file_name)\"><i class=\"fal fa-copy\"></i><span>{{ 'ImgManager.ImgCard.copyLink' | translate }}</span></button>\r\n <button type=\"button\" class=\"deleted\" (click)=\"activeConfirmDelete = true;\"><i class=\"fal fa-times\"></i><span>{{ 'ImgManager.ImgCard.del' | translate }}</span></button>\r\n <button type=\"button\" class=\"selected\" (click)=\"onToggleImgSelected()\" *ngIf=\"stateDisplayed !== 'window'\">\r\n <i *ngIf=\"!picture.selected\" class=\"fal fa-square\"></i>\r\n <i *ngIf=\"picture.selected\" class=\"fa-solid fa-check-square checked\"></i>\r\n <span>{{ 'ImgManager.ImgCard.select' | translate }}</span>\r\n </button>\r\n </div>\r\n <div\r\n class=\"img-card__container__config img-card__container__config--small\"\r\n *ngIf=\"!picture.deleted && stateDisplayed === 'small'\"\r\n >\r\n <button class=\"show-edit\" (click)=\"displayLargeWindow()\"><i class=\"fa-solid fa-edit\"></i></button>\r\n </div>\r\n <div class=\"img-card__container__delete\" [ngClass]=\"{ 'show' : activeConfirmDelete}\">\r\n <span>{{ 'ImgManager.ImgCard.confirmDeleteImg' | translate }}</span>\r\n <div>\r\n <button (click)=\"activeConfirmDelete = false;\">{{ 'no' | translate }}</button>\r\n <button (click)=\"onRemoveImg(picture);activeConfirmDelete = false;\">{{ 'yes' | translate }}</button>\r\n </div>\r\n </div>\r\n <div class=\"img-card__container__valid\" *ngIf=\"stateDisplayed === 'small' && tabDisplayed == 'img-upload'\">\r\n <i class=\"far fa-check\"></i>\r\n <span>{{ 'ImgManager.ImgCard.validImgSmall' | translate }}</span>\r\n </div>\r\n <div\r\n *ngIf=\"picture.imgNotLoaded\"\r\n class=\"img-card__container__overlay\"\r\n [ngClass]=\"{'img-card__container__overlay--smallDisplay': stateDisplayed === 'small' || isUploadSection}\">\r\n <i (click)=\"onToggleImgSelected()\" class=\"fad fa-folder-times\"></i>\r\n </div>\r\n <span btnLoadingAnim class=\"btnLoadingAnnimation\" *ngIf=\"picture.deleted\"></span>\r\n\r\n </div>\r\n <div\r\n class=\"img-card__nameContainer\"\r\n [ngClass]=\"{'smallNameDisplay': stateDisplayed === 'small' || isUploadSection, 'focus': focusInput}\">\r\n <input\r\n type=\"text\"\r\n class=\"wzImgMngInput img-card__nameContainer__name\"\r\n [(ngModel)]=\"picture.display_name\"\r\n (ngModelChange)=\"onNameChange(picture.id_file)\"\r\n [ngModelOptions]=\"{standalone: true, updateOn: 'blur'}\"\r\n (focus)=\"previousName=picture.display_name;focusInput = true;\"\r\n (blur)=\"focusInput = false;\"\r\n >\r\n <span>{{picture.display_name}}</span>\r\n </div>\r\n\r\n </div>\r\n</div>\r\n" }]
937
923
  }], ctorParameters: function () { return [{ type: ImgManagerService }, { type: ImgSelectionService }, { type: i3$1.HttpClient }, { type: ImgCDNService }, { type: ImgEventService }, { type: AlertService }, { type: i3.TranslateService }, { type: ApiService }]; }, propDecorators: { tabDisplayed: [{
938
924
  type: Input
939
925
  }], fullSize: [{
@@ -1651,191 +1637,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImpor
1651
1637
  type: Output
1652
1638
  }] } });
1653
1639
 
1654
- class VideoInfoService {
1655
- constructor(http) {
1656
- this.http = http;
1657
- this.YT_API_KEY = '';
1658
- this.YT_API_URL = 'https://www.googleapis.com/youtube/v3/videos';
1659
- }
1660
- getVideoInfo(videoUrl) {
1661
- if (!videoUrl)
1662
- return null;
1663
- if (this.isYouTube(videoUrl)) {
1664
- const id = this.extractYoutubeId(videoUrl);
1665
- return this.getYouTubeInfo(id);
1666
- }
1667
- if (this.isVimeo(videoUrl)) {
1668
- const id = this.extractVimeoId(videoUrl);
1669
- return this.getVimeoInfo(id);
1670
- }
1671
- return null;
1672
- }
1673
- isYouTube(url) {
1674
- return url.includes('youtube.com') || url.includes('youtu.be');
1675
- }
1676
- isVimeo(url) {
1677
- return url.includes('vimeo.com');
1678
- }
1679
- extractYoutubeId(url) {
1680
- const regExp = /^.*(youtu.be\/|v=|embed\/)([^#\&\?]*).*/;
1681
- const match = url.match(regExp);
1682
- return match && match[2] ? match[2] : null;
1683
- }
1684
- extractVimeoId(url) {
1685
- const regExp = /vimeo\.com\/(?:video\/)?(\d+)/;
1686
- const match = url.match(regExp);
1687
- return match ? match[1] : null;
1688
- }
1689
- getYouTubeInfo(id) {
1690
- return this.http.get(`${this.YT_API_URL}?id=${id}&part=contentDetails,snippet&key=${this.YT_API_KEY}`)
1691
- .pipe(map(res => {
1692
- const item = res.items?.[0];
1693
- if (!item)
1694
- return null;
1695
- return {
1696
- duration: this.formatYoutubeDuration(item.contentDetails.duration),
1697
- publishDate: this.formatDate(item.snippet.publishedAt)
1698
- };
1699
- }));
1700
- }
1701
- formatYoutubeDuration(duration) {
1702
- const match = duration.match(/PT(\d+M)?(\d+S)?/);
1703
- const minutes = match?.[1] ? parseInt(match[1]) : 0;
1704
- const seconds = match?.[2] ? parseInt(match[2]) : 0;
1705
- return `${minutes} min ${seconds} sec`;
1706
- }
1707
- getVimeoInfo(id) {
1708
- return this.http.get(`https://vimeo.com/api/v2/video/${id}.json`)
1709
- .pipe(map(res => {
1710
- const item = res?.[0];
1711
- if (!item)
1712
- return null;
1713
- return {
1714
- duration: this.formatVimeoDuration(item.duration),
1715
- publishDate: this.formatDate(item.upload_date)
1716
- };
1717
- }));
1718
- }
1719
- formatVimeoDuration(seconds) {
1720
- const min = Math.floor(seconds / 60);
1721
- const sec = seconds % 60;
1722
- return `${min} min ${sec} sec`;
1723
- }
1724
- formatDate(dateStr) {
1725
- const d = new Date(dateStr);
1726
- return d.toLocaleDateString('fr-FR');
1727
- }
1728
- }
1729
- VideoInfoService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: VideoInfoService, deps: [{ token: i3$1.HttpClient }], target: i0.ɵɵFactoryTarget.Injectable });
1730
- VideoInfoService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: VideoInfoService, providedIn: 'root' });
1731
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: VideoInfoService, decorators: [{
1732
- type: Injectable,
1733
- args: [{ providedIn: 'root' }]
1734
- }], ctorParameters: function () { return [{ type: i3$1.HttpClient }]; } });
1735
-
1736
- class EditorInfoVideoComponent {
1737
- constructor(videoInfoService) {
1738
- this.videoInfoService = videoInfoService;
1739
- this.videoLink = '';
1740
- this.videoLinkChange = new EventEmitter();
1741
- this.isVideoModified = false;
1742
- this.isVideoModifiedChange = new EventEmitter();
1743
- this.deleteVideo = new EventEmitter();
1744
- this.videoDuration = '';
1745
- this.videoPublishDate = '';
1746
- }
1747
- ngOnInit() {
1748
- this.loadVideoInfos();
1749
- }
1750
- onVideoLinkChange(value) {
1751
- this.videoLink = value;
1752
- this.videoLinkChange.emit(value);
1753
- this.isVideoModifiedChange.emit(true);
1754
- this.loadVideoInfos();
1755
- }
1756
- loadVideoInfos() {
1757
- const obs = this.videoInfoService.getVideoInfo(this.videoLink);
1758
- if (!obs) {
1759
- this.videoDuration = '';
1760
- this.videoPublishDate = '';
1761
- return;
1762
- }
1763
- obs.subscribe(data => {
1764
- if (!data)
1765
- return;
1766
- this.videoDuration = data.duration;
1767
- this.videoPublishDate = data.publishDate;
1768
- });
1769
- }
1770
- onDelete() {
1771
- this.deleteVideo.emit();
1772
- }
1773
- }
1774
- EditorInfoVideoComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: EditorInfoVideoComponent, deps: [{ token: VideoInfoService }], target: i0.ɵɵFactoryTarget.Component });
1775
- EditorInfoVideoComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: EditorInfoVideoComponent, selector: "info-video", inputs: { videoLink: "videoLink", isVideoModified: "isVideoModified" }, outputs: { videoLinkChange: "videoLinkChange", isVideoModifiedChange: "isVideoModifiedChange", deleteVideo: "deleteVideo" }, ngImport: i0, template: "<div class=\"info-video\">\r\n <div class=\"info-video__wrapper\">\r\n\r\n <div class=\"info-video__wrapper__top\">\r\n <label for=\"input-video\">\r\n {{ 'ImgManager.ImgEditor.UrlVideo' | translate }}\r\n <i class=\"fa-solid fa-circle-info\"></i>\r\n </label>\r\n\r\n <input\r\n type=\"text\"\r\n id=\"input-video\"\r\n [ngModel]=\"videoLink\"\r\n (ngModelChange)=\"onVideoLinkChange($event)\"\r\n />\r\n\r\n <span>{{ 'ImgManager.ImgEditor.tooltipsIframe' | translate }}</span>\r\n </div>\r\n\r\n <a *ngIf=\"videoLink\" (click)=\"onDelete()\">{{ 'ImgManager.ImgEditor.deleteVideo' | translate }}</a>\r\n </div>\r\n</div>\r\n", dependencies: [{ 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: "pipe", type: i3.TranslatePipe, name: "translate" }] });
1776
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: EditorInfoVideoComponent, decorators: [{
1777
- type: Component,
1778
- args: [{ selector: 'info-video', template: "<div class=\"info-video\">\r\n <div class=\"info-video__wrapper\">\r\n\r\n <div class=\"info-video__wrapper__top\">\r\n <label for=\"input-video\">\r\n {{ 'ImgManager.ImgEditor.UrlVideo' | translate }}\r\n <i class=\"fa-solid fa-circle-info\"></i>\r\n </label>\r\n\r\n <input\r\n type=\"text\"\r\n id=\"input-video\"\r\n [ngModel]=\"videoLink\"\r\n (ngModelChange)=\"onVideoLinkChange($event)\"\r\n />\r\n\r\n <span>{{ 'ImgManager.ImgEditor.tooltipsIframe' | translate }}</span>\r\n </div>\r\n\r\n <a *ngIf=\"videoLink\" (click)=\"onDelete()\">{{ 'ImgManager.ImgEditor.deleteVideo' | translate }}</a>\r\n </div>\r\n</div>\r\n" }]
1779
- }], ctorParameters: function () { return [{ type: VideoInfoService }]; }, propDecorators: { videoLink: [{
1780
- type: Input
1781
- }], videoLinkChange: [{
1782
- type: Output
1783
- }], isVideoModified: [{
1784
- type: Input
1785
- }], isVideoModifiedChange: [{
1786
- type: Output
1787
- }], deleteVideo: [{
1788
- type: Output
1789
- }] } });
1790
-
1791
- class EditorShowIframeComponent {
1792
- constructor(sanitizer) {
1793
- this.sanitizer = sanitizer;
1794
- this.videoLink = '';
1795
- this.safeUrl = null;
1796
- }
1797
- ngOnChanges() {
1798
- this.safeUrl = this.buildSafeIframeUrl(this.videoLink);
1799
- }
1800
- buildSafeIframeUrl(url) {
1801
- if (!url)
1802
- return null;
1803
- if (url.includes('youtube.com') || url.includes('youtu.be')) {
1804
- const videoId = this.extractYoutubeId(url);
1805
- if (!videoId)
1806
- return null;
1807
- const embed = `https://www.youtube.com/embed/${videoId}`;
1808
- return this.sanitizer.bypassSecurityTrustResourceUrl(embed);
1809
- }
1810
- if (url.includes('vimeo.com')) {
1811
- const videoId = this.extractVimeoId(url);
1812
- if (!videoId)
1813
- return null;
1814
- const embed = `https://player.vimeo.com/video/${videoId}`;
1815
- return this.sanitizer.bypassSecurityTrustResourceUrl(embed);
1816
- }
1817
- return null;
1818
- }
1819
- extractYoutubeId(url) {
1820
- const regExp = /^.*(youtu.be\/|v=|embed\/)([^#\&\?]*).*/;
1821
- const match = url.match(regExp);
1822
- return match && match[2].length > 0 ? match[2] : null;
1823
- }
1824
- extractVimeoId(url) {
1825
- const regExp = /vimeo\.com\/(?:video\/)?(\d+)/;
1826
- const match = url.match(regExp);
1827
- return match ? match[1] : null;
1828
- }
1829
- }
1830
- EditorShowIframeComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: EditorShowIframeComponent, deps: [{ token: i1$1.DomSanitizer }], target: i0.ɵɵFactoryTarget.Component });
1831
- EditorShowIframeComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: EditorShowIframeComponent, selector: "show-iframe", inputs: { videoLink: "videoLink" }, usesOnChanges: true, ngImport: i0, template: "<div class=\"show-iframe\" *ngIf=\"safeUrl\">\r\n <iframe\r\n width=\"100%\"\r\n [src]=\"safeUrl\"\r\n frameborder=\"0\"\r\n allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\"\r\n allowfullscreen>\r\n </iframe>\r\n</div>\r\n\r\n<div class=\"show-iframe__none\" *ngIf=\"!safeUrl\">\r\n <p>{{ 'ImgManager.ImgEditor.NoVideo' | translate }}</p>\r\n</div>\r\n", dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] });
1832
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: EditorShowIframeComponent, decorators: [{
1833
- type: Component,
1834
- args: [{ selector: 'show-iframe', template: "<div class=\"show-iframe\" *ngIf=\"safeUrl\">\r\n <iframe\r\n width=\"100%\"\r\n [src]=\"safeUrl\"\r\n frameborder=\"0\"\r\n allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\"\r\n allowfullscreen>\r\n </iframe>\r\n</div>\r\n\r\n<div class=\"show-iframe__none\" *ngIf=\"!safeUrl\">\r\n <p>{{ 'ImgManager.ImgEditor.NoVideo' | translate }}</p>\r\n</div>\r\n" }]
1835
- }], ctorParameters: function () { return [{ type: i1$1.DomSanitizer }]; }, propDecorators: { videoLink: [{
1836
- type: Input
1837
- }] } });
1838
-
1839
1640
  const insertRemove = // the fade-in/fade-out animation.
1840
1641
  trigger('insertRemoveAnnim', [
1841
1642
  transition(':enter', [
@@ -2162,62 +1963,33 @@ class ImgEditorComponent {
2162
1963
  constructor(imgManagerService, renamePictureService) {
2163
1964
  this.imgManagerService = imgManagerService;
2164
1965
  this.renamePictureService = renamePictureService;
2165
- this._isVideoEdit = false;
2166
1966
  this.editClosed = new EventEmitter();
2167
1967
  this.isLoading = false;
2168
1968
  this.isImgModified = false;
2169
1969
  this.isNameModified = false;
2170
1970
  this.currentCroppedImage = ''; // Img modified return in base64 by the cropper
2171
- this.isEditorLinkActive = false;
2172
- this.isVideoModified = false;
2173
1971
  this.msgFailSave = 'ImgManager.ImgEditor.msgFailSave';
2174
1972
  this.msgFailLoad = 'ImgManager.ImgEditor.msgFailLoad';
2175
1973
  this.msgSuccessEdit = "Les modifications de l'image ont bien été enregistrées.";
2176
1974
  }
2177
- set isVideoEdit(value) {
2178
- this._isVideoEdit = value;
2179
- if (value === true) {
2180
- this.isEditorLinkActive = true;
2181
- }
2182
- }
2183
- get isVideoEdit() {
2184
- return this._isVideoEdit;
2185
- }
2186
1975
  ngOnInit() {
2187
1976
  this.previousName = this.imgToEdit.display_name;
2188
- this.previousVideoLink = this.imgToEdit.video_link;
2189
1977
  }
2190
1978
  onSave() {
2191
1979
  if (this.isLoading) {
2192
1980
  return;
2193
1981
  }
2194
1982
  this.isLoading = true;
2195
- if (!this.isImgModified && !this.isNameModified && !this.isVideoModified) {
1983
+ if (!this.isImgModified && !this.isNameModified) {
2196
1984
  this.isLoading = false;
2197
1985
  this.onEditClosed();
2198
1986
  }
2199
1987
  const obsReplaceImg = this.imgManagerService.replaceImg(this.currentCroppedImage, this.imgToEdit.id_file);
2200
1988
  const obsChangeImgName = this.renamePictureService.changeImageName(this.imgToEdit.display_name, this.imgToEdit.id_file);
2201
- const obsChangeVideoLink = this.renamePictureService.changeVideoLink(this.imgToEdit.video_link, this.imgToEdit.id_file);
2202
1989
  if (this.isImgModified && this.isNameModified) {
2203
1990
  this.renameAndReplaceImg(obsChangeImgName, obsReplaceImg);
2204
1991
  return;
2205
1992
  }
2206
- if (this.isVideoModified && !this.isImgModified && !this.isNameModified) {
2207
- obsChangeVideoLink.subscribe({
2208
- next: () => {
2209
- this.isLoading = false;
2210
- this.previousVideoLink = this.imgToEdit.video_link;
2211
- this.onEditClosed(this.msgSuccessEdit);
2212
- },
2213
- error: () => {
2214
- this.isLoading = false;
2215
- this.imgToEdit.video_link = this.previousVideoLink;
2216
- this.onEditClosed(this.msgFailSave);
2217
- }
2218
- });
2219
- return;
2220
- }
2221
1993
  if (this.isImgModified) {
2222
1994
  obsReplaceImg.subscribe({
2223
1995
  next: data => {
@@ -2262,10 +2034,6 @@ class ImgEditorComponent {
2262
2034
  onImgCropped(imgBase64) {
2263
2035
  this.currentCroppedImage = imgBase64;
2264
2036
  }
2265
- onDeleteVideo() {
2266
- this.imgToEdit.video_link = null;
2267
- this.isVideoModified = true;
2268
- }
2269
2037
  renameAndReplaceImg(obsChangeImgName, obsReplaceImg) {
2270
2038
  // Avoid to use forkjoin, because it can create conflict and loose the img
2271
2039
  obsChangeImgName.subscribe({
@@ -2286,20 +2054,18 @@ class ImgEditorComponent {
2286
2054
  }
2287
2055
  }
2288
2056
  ImgEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ImgEditorComponent, deps: [{ token: ImgManagerService }, { token: RenamePictureService }], target: i0.ɵɵFactoryTarget.Component });
2289
- ImgEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: ImgEditorComponent, selector: "img-editor", inputs: { stateDisplayed: "stateDisplayed", imgToEdit: "imgToEdit", isVideoEdit: "isVideoEdit" }, outputs: { editClosed: "editClosed" }, ngImport: i0, template: "<div class=\"img-editor\" [@easeInOut]=\"'in'\">\r\n\r\n <!-- Button Action Section -->\r\n\r\n <div class=\"img-editor__infoSection__actions\">\r\n <div>\r\n <button\r\n type=\"button\"\r\n class=\"button img-editor__infoSection__actions__cancel\"\r\n (click)=\"onCancel()\"\r\n [disabled]=\"isLoading || (!isImgModified && !isNameModified)\"\r\n >\r\n {{ 'ImgManager.ImgLib.cancel' | translate }}\r\n </button>\r\n <div\r\n class=\"button danger button img-editor__infoSection__actions__save\"\r\n [ngClass]=\"{'img-editor__infoSection__actions__save--disable': isLoading}\"\r\n (click)=\"onSave()\"\r\n >\r\n {{ 'ImgManager.ImgEditor.saveBtn' | translate }}\r\n <span btnLoadingAnim *ngIf=\"isLoading\" class=\"btnLoadingAnnimation\"></span>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n\r\n <ng-scrollbar\r\n class=\"img-editor__scroll\"\r\n style=\"min-height: 500px\"\r\n [ngClass]=\"{\r\n 'img-editor__scroll--full': stateDisplayed === 'full',\r\n 'img-editor__scroll--smallDisplay': stateDisplayed === 'small',\r\n 'img-editor__scroll--window': stateDisplayed === 'window'\r\n }\"\r\n >\r\n\r\n <div class=\"columns\">\r\n <!-- Left section -->\r\n <div class=\"column is-one-third img-editor__infoSection\">\r\n\r\n <ul class=\"img-editorVideo__tabs\">\r\n <li [ngClass]=\"{'active': !isEditorLinkActive}\"><span (click)=\"isEditorLinkActive = !isEditorLinkActive\">Informations</span></li>\r\n <li [ngClass]=\"{'active': isEditorLinkActive}\"><span (click)=\"isEditorLinkActive = !isEditorLinkActive\">Associer une vid\u00E9o</span></li>\r\n </ul>\r\n\r\n <info-section\r\n *ngIf=\"!isEditorLinkActive\"\r\n [imgToEdit]=\"imgToEdit\"\r\n [(isNameModified)]=\"isNameModified\"\r\n >\r\n </info-section>\r\n <info-video\r\n *ngIf=\"isEditorLinkActive\"\r\n [(videoLink)]=\"imgToEdit.video_link\"\r\n [(isVideoModified)]=\"isVideoModified\"\r\n (deleteVideo)=\"onDeleteVideo()\">\r\n </info-video>\r\n </div>\r\n\r\n\r\n <!-- Right section -->\r\n <div class=\"column img-editor__container\">\r\n <cropper\r\n *ngIf=\"!isEditorLinkActive\"\r\n [imgToEdit]=\"imgToEdit\"\r\n [(isImgModified)]=\"isImgModified\"\r\n (currentCroppedImageChange)=\"onImgCropped($event)\"\r\n (editClosed)=\"onEditClosed($event)\">\r\n </cropper>\r\n <show-iframe\r\n style=\"display: block;width: 100%\"\r\n [videoLink]=\"imgToEdit.video_link\"\r\n *ngIf=\"isEditorLinkActive\">\r\n\r\n </show-iframe>\r\n </div>\r\n </div>\r\n </ng-scrollbar>\r\n</div>\r\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: i4.NgScrollbar, selector: "ng-scrollbar", inputs: ["disabled", "sensorDisabled", "pointerEventsDisabled", "viewportPropagateMouseMove", "autoHeightDisabled", "autoWidthDisabled", "viewClass", "trackClass", "thumbClass", "minThumbSize", "trackClickScrollDuration", "pointerEventsMethod", "track", "visibility", "appearance", "position", "sensorDebounce", "scrollAuditTime"], outputs: ["updated"], exportAs: ["ngScrollbar"] }, { kind: "component", type: EditorInfoSectionComponent, selector: "info-section", inputs: ["imgToEdit", "isNameModified"], outputs: ["isNameModifiedChange"] }, { kind: "component", type: EditorInfoVideoComponent, selector: "info-video", inputs: ["videoLink", "isVideoModified"], outputs: ["videoLinkChange", "isVideoModifiedChange", "deleteVideo"] }, { kind: "component", type: EditorShowIframeComponent, selector: "show-iframe", inputs: ["videoLink"] }, { kind: "component", type: CropperComponent, selector: "cropper", inputs: ["imgToEdit", "isImgModified"], outputs: ["isImgModifiedChange", "editClosed", "currentCroppedImageChange"] }, { kind: "directive", type: LoadingDirective, selector: "[btnLoadingAnim]" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], animations: [
2057
+ ImgEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: ImgEditorComponent, selector: "img-editor", inputs: { stateDisplayed: "stateDisplayed", imgToEdit: "imgToEdit" }, outputs: { editClosed: "editClosed" }, ngImport: i0, template: "<div class=\"img-editor\" [@easeInOut]=\"'in'\">\r\n\r\n <!-- Button Action Section -->\r\n\r\n <div class=\"img-editor__infoSection__actions\">\r\n <div>\r\n <button\r\n type=\"button\"\r\n class=\"button img-editor__infoSection__actions__cancel\"\r\n (click)=\"onCancel()\"\r\n [disabled]=\"isLoading || (!isImgModified && !isNameModified)\"\r\n >\r\n {{ 'ImgManager.ImgLib.cancel' | translate }}\r\n </button>\r\n <div\r\n class=\"button danger button img-editor__infoSection__actions__save\"\r\n [ngClass]=\"{'img-editor__infoSection__actions__save--disable': isLoading}\"\r\n (click)=\"onSave()\"\r\n >\r\n {{ 'ImgManager.ImgEditor.saveBtn' | translate }}\r\n <span btnLoadingAnim *ngIf=\"isLoading\" class=\"btnLoadingAnnimation\"></span>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n\r\n <ng-scrollbar\r\n class=\"img-editor__scroll\"\r\n [ngClass]=\"{\r\n 'img-editor__scroll--full': stateDisplayed === 'full',\r\n 'img-editor__scroll--smallDisplay': stateDisplayed === 'small',\r\n 'img-editor__scroll--window': stateDisplayed === 'window'\r\n }\"\r\n >\r\n <div class=\"columns\">\r\n <!-- Left section -->\r\n <div class=\"column is-one-third img-editor__infoSection\">\r\n\r\n <info-section\r\n [imgToEdit]=\"imgToEdit\"\r\n [(isNameModified)]=\"isNameModified\"\r\n >\r\n </info-section>\r\n </div>\r\n\r\n\r\n <!-- Right section -->\r\n <div class=\"column img-editor__container\">\r\n <cropper\r\n [imgToEdit]=\"imgToEdit\"\r\n [(isImgModified)]=\"isImgModified\"\r\n (currentCroppedImageChange)=\"onImgCropped($event)\"\r\n (editClosed)=\"onEditClosed($event)\">\r\n </cropper>\r\n </div>\r\n </div>\r\n </ng-scrollbar>\r\n</div>\r\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: i4.NgScrollbar, selector: "ng-scrollbar", inputs: ["disabled", "sensorDisabled", "pointerEventsDisabled", "viewportPropagateMouseMove", "autoHeightDisabled", "autoWidthDisabled", "viewClass", "trackClass", "thumbClass", "minThumbSize", "trackClickScrollDuration", "pointerEventsMethod", "track", "visibility", "appearance", "position", "sensorDebounce", "scrollAuditTime"], outputs: ["updated"], exportAs: ["ngScrollbar"] }, { 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: i3.TranslatePipe, name: "translate" }], animations: [
2290
2058
  easeInOut
2291
2059
  ] });
2292
2060
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ImgEditorComponent, decorators: [{
2293
2061
  type: Component,
2294
2062
  args: [{ selector: 'img-editor', animations: [
2295
2063
  easeInOut
2296
- ], template: "<div class=\"img-editor\" [@easeInOut]=\"'in'\">\r\n\r\n <!-- Button Action Section -->\r\n\r\n <div class=\"img-editor__infoSection__actions\">\r\n <div>\r\n <button\r\n type=\"button\"\r\n class=\"button img-editor__infoSection__actions__cancel\"\r\n (click)=\"onCancel()\"\r\n [disabled]=\"isLoading || (!isImgModified && !isNameModified)\"\r\n >\r\n {{ 'ImgManager.ImgLib.cancel' | translate }}\r\n </button>\r\n <div\r\n class=\"button danger button img-editor__infoSection__actions__save\"\r\n [ngClass]=\"{'img-editor__infoSection__actions__save--disable': isLoading}\"\r\n (click)=\"onSave()\"\r\n >\r\n {{ 'ImgManager.ImgEditor.saveBtn' | translate }}\r\n <span btnLoadingAnim *ngIf=\"isLoading\" class=\"btnLoadingAnnimation\"></span>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n\r\n <ng-scrollbar\r\n class=\"img-editor__scroll\"\r\n style=\"min-height: 500px\"\r\n [ngClass]=\"{\r\n 'img-editor__scroll--full': stateDisplayed === 'full',\r\n 'img-editor__scroll--smallDisplay': stateDisplayed === 'small',\r\n 'img-editor__scroll--window': stateDisplayed === 'window'\r\n }\"\r\n >\r\n\r\n <div class=\"columns\">\r\n <!-- Left section -->\r\n <div class=\"column is-one-third img-editor__infoSection\">\r\n\r\n <ul class=\"img-editorVideo__tabs\">\r\n <li [ngClass]=\"{'active': !isEditorLinkActive}\"><span (click)=\"isEditorLinkActive = !isEditorLinkActive\">Informations</span></li>\r\n <li [ngClass]=\"{'active': isEditorLinkActive}\"><span (click)=\"isEditorLinkActive = !isEditorLinkActive\">Associer une vid\u00E9o</span></li>\r\n </ul>\r\n\r\n <info-section\r\n *ngIf=\"!isEditorLinkActive\"\r\n [imgToEdit]=\"imgToEdit\"\r\n [(isNameModified)]=\"isNameModified\"\r\n >\r\n </info-section>\r\n <info-video\r\n *ngIf=\"isEditorLinkActive\"\r\n [(videoLink)]=\"imgToEdit.video_link\"\r\n [(isVideoModified)]=\"isVideoModified\"\r\n (deleteVideo)=\"onDeleteVideo()\">\r\n </info-video>\r\n </div>\r\n\r\n\r\n <!-- Right section -->\r\n <div class=\"column img-editor__container\">\r\n <cropper\r\n *ngIf=\"!isEditorLinkActive\"\r\n [imgToEdit]=\"imgToEdit\"\r\n [(isImgModified)]=\"isImgModified\"\r\n (currentCroppedImageChange)=\"onImgCropped($event)\"\r\n (editClosed)=\"onEditClosed($event)\">\r\n </cropper>\r\n <show-iframe\r\n style=\"display: block;width: 100%\"\r\n [videoLink]=\"imgToEdit.video_link\"\r\n *ngIf=\"isEditorLinkActive\">\r\n\r\n </show-iframe>\r\n </div>\r\n </div>\r\n </ng-scrollbar>\r\n</div>\r\n" }]
2064
+ ], template: "<div class=\"img-editor\" [@easeInOut]=\"'in'\">\r\n\r\n <!-- Button Action Section -->\r\n\r\n <div class=\"img-editor__infoSection__actions\">\r\n <div>\r\n <button\r\n type=\"button\"\r\n class=\"button img-editor__infoSection__actions__cancel\"\r\n (click)=\"onCancel()\"\r\n [disabled]=\"isLoading || (!isImgModified && !isNameModified)\"\r\n >\r\n {{ 'ImgManager.ImgLib.cancel' | translate }}\r\n </button>\r\n <div\r\n class=\"button danger button img-editor__infoSection__actions__save\"\r\n [ngClass]=\"{'img-editor__infoSection__actions__save--disable': isLoading}\"\r\n (click)=\"onSave()\"\r\n >\r\n {{ 'ImgManager.ImgEditor.saveBtn' | translate }}\r\n <span btnLoadingAnim *ngIf=\"isLoading\" class=\"btnLoadingAnnimation\"></span>\r\n </div>\r\n\r\n </div>\r\n </div>\r\n\r\n <ng-scrollbar\r\n class=\"img-editor__scroll\"\r\n [ngClass]=\"{\r\n 'img-editor__scroll--full': stateDisplayed === 'full',\r\n 'img-editor__scroll--smallDisplay': stateDisplayed === 'small',\r\n 'img-editor__scroll--window': stateDisplayed === 'window'\r\n }\"\r\n >\r\n <div class=\"columns\">\r\n <!-- Left section -->\r\n <div class=\"column is-one-third img-editor__infoSection\">\r\n\r\n <info-section\r\n [imgToEdit]=\"imgToEdit\"\r\n [(isNameModified)]=\"isNameModified\"\r\n >\r\n </info-section>\r\n </div>\r\n\r\n\r\n <!-- Right section -->\r\n <div class=\"column img-editor__container\">\r\n <cropper\r\n [imgToEdit]=\"imgToEdit\"\r\n [(isImgModified)]=\"isImgModified\"\r\n (currentCroppedImageChange)=\"onImgCropped($event)\"\r\n (editClosed)=\"onEditClosed($event)\">\r\n </cropper>\r\n </div>\r\n </div>\r\n </ng-scrollbar>\r\n</div>\r\n" }]
2297
2065
  }], ctorParameters: function () { return [{ type: ImgManagerService }, { type: RenamePictureService }]; }, propDecorators: { stateDisplayed: [{
2298
2066
  type: Input
2299
2067
  }], imgToEdit: [{
2300
2068
  type: Input
2301
- }], isVideoEdit: [{
2302
- type: Input
2303
2069
  }], editClosed: [{
2304
2070
  type: Output
2305
2071
  }] } });
@@ -3278,14 +3044,14 @@ class TableViewComponent extends ImagesActionHandler {
3278
3044
  }
3279
3045
  }
3280
3046
  TableViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: TableViewComponent, deps: [{ token: ImgManagerService }, { token: ImgSelectionService }, { token: i3$1.HttpClient }, { token: ImgCDNService }, { token: ImgEventService }, { token: AlertService }, { token: i3.TranslateService }, { token: ApiService }], target: i0.ɵɵFactoryTarget.Component });
3281
- TableViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: TableViewComponent, selector: "table-view", usesInheritance: true, ngImport: i0, template: "<div class=\"table-view\" [@listAnimation]=\"picturesList.length\">\r\n <wz-table\r\n [checkbox]=\"true\"\r\n (toggleAllCheckBox)=\"onToggleAllCheckBoxRow($event)\"\r\n [(tableFilters)]=\"tableFilters\"\r\n (tableFiltersChange)=\"onFiltersChange()\"\r\n [placeholder]=\"'ImgManager.SearchBar.placeholder' | translate\"\r\n [disablePagniation]=\"displayPexelsResults\"\r\n [isLoading]=\"isLoading\"\r\n >\r\n <!-- Header Section -->\r\n <div\r\n headerCell\r\n [headerName]=\"'ImgManager.ImgList.titleImgName' | translate\"\r\n columnSize=\"2\"\r\n sortName=\"name\"\r\n ></div>\r\n <div\r\n headerCell\r\n centerCell=\"center\"\r\n [headerName]=\"'ImgManager.ImgList.titleResolution' | translate\"\r\n ></div>\r\n <div headerCell columnSize=\"0\"></div>\r\n\r\n <!-- Body Section -->\r\n <div\r\n tableRow\r\n checkBoxRow\r\n [checkBoxValue]=\"picture.delSelected\"\r\n (checkBoxValueChange)=\"onToggleDelSelection(index)\"\r\n *ngFor=\"let picture of picturesList; let index = index\"\r\n >\r\n\r\n <div tableColumn columnSize=\"2\">\r\n <div class=\"table-view__row__container\">\r\n <div\r\n class=\"table-view__row__container__imgContainer\"\r\n [ngClass]=\"{'imgSelected': picture.selected}\"\r\n (click)=\"onToggleSelectImg(index)\">\r\n <img\r\n class=\"table-view__row__container__imgContainer__img\"\r\n [src]=\"picture.file_name | imgSrc : '100'\"\r\n alt=\"picture.display_name\"\r\n [ngClass]=\"{'pictureDeletion': picture.deleted}\"\r\n (error)=\"picture.imgNotLoaded=true;onPictureNotLoading($event);\"\r\n />\r\n <!-- If the img is not loaded, or the link is broken, an icon is displayed -->\r\n <div\r\n *ngIf=\"picture.imgNotLoaded\"\r\n class=\"table-view__row__container__imgContainer__overlay\"\r\n >\r\n <i class=\"fad fa-folder-times\"></i>\r\n </div>\r\n </div>\r\n <input\r\n type=\"text\"\r\n class=\"wzImgMngInput table-view__row__container__name\"\r\n [(ngModel)]=\"picture.display_name\"\r\n (focus)=\"previousName=picture.display_name\"\r\n (blur)=\"onNameChange(picture.id_file)\"\r\n (click)=\"onToggleDelSelection(index)\"\r\n [ngClass]=\"{'desabled': picture.deleted}\"\r\n [disabled]=\"picture.deleted\"\r\n >\r\n </div>\r\n </div>\r\n\r\n <div\r\n tableColumn\r\n centerCell=\"center\"\r\n (click)=\"onToggleDelSelection(index)\"\r\n >\r\n <p class=\"grey\">{{picture.raw_height}}x{{picture.raw_width}}</p>\r\n </div>\r\n\r\n <div tableColumn centerCell=\"center\" columnSize=\"0\" class=\"table-view__dropdown-options\">\r\n <!-- Dropdown -->\r\n <dropdown dropdownId=\"dropdown-options\" [disable]=\"picture.deleted\">\r\n <ng-container label>\r\n <div class=\"table-view__dropdown-options__label rotate\">\r\n <span> <i class=\"far fa-ellipsis-h is-size-4\" aria-haspopup=\"true\" aria-controls=\"dropdown-menu\"> </i> </span>\r\n </div>\r\n </ng-container>\r\n <ng-container item>\r\n <div\r\n class=\"dropdown-item\"\r\n (click)=\"onDownloadImg(picture.display_name, picture.file_name)\"\r\n >\r\n <i class=\"far fa-download download\"></i>&nbsp;\r\n <p>{{ 'ImgManager.ImgList.download' | translate }}</p>\r\n </div>\r\n </ng-container>\r\n <ng-container item>\r\n <div\r\n class=\"dropdown-item\"\r\n (click)=\"redirectToVideo(picture)\"\r\n >\r\n <i class=\"fa-solid fa-play\"></i>&nbsp;\r\n <p>{{ 'ImgManager.ImgEditor.AddVideo' | translate }}</p>\r\n </div>\r\n </ng-container>\r\n <ng-container item>\r\n <div\r\n class=\"dropdown-item\"\r\n (click)=\"onEdit(picture)\"\r\n >\r\n <i class=\"far fa-crop-alt edit\"></i>&nbsp;\r\n <p>{{ 'ImgManager.ImgList.edit' | translate }}</p>\r\n </div>\r\n </ng-container>\r\n <ng-container item>\r\n <div\r\n class=\"dropdown-item\"\r\n (click)=\"copyImageLink(picture.file_name)\"\r\n >\r\n <i class=\"far fa-copy copy\"></i>&nbsp;\r\n <p>{{ 'ImgManager.ImgList.Link' | translate }}</p>\r\n </div>\r\n </ng-container>\r\n <ng-container item>\r\n <div\r\n class=\"dropdown-item\"\r\n (click)=\"onRemoveImg(picture)\"\r\n >\r\n <i class=\"fal fa-times deleted\"></i>&nbsp;\r\n <p>{{ 'ImgManager.ImgList.remove' | translate }}</p>\r\n </div>\r\n </ng-container>\r\n </dropdown>\r\n </div>\r\n </div>\r\n </wz-table>\r\n</div>\r\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.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: "component", type: DropdownComponent, selector: "dropdown", inputs: ["dropDownMenuClass", "disable"] }, { kind: "component", type: TableComponent, selector: "wz-table", inputs: ["tableFilters", "tableRoutingName", "placeholder", "checkbox", "disableSearch", "disablePagniation", "isLoading"], outputs: ["tableFiltersChange", "toggleAllCheckBox"] }, { kind: "directive", type: TableColumn, selector: "[tableColumn]", inputs: ["columnSize", "centerCell"] }, { kind: "directive", type: CheckBoxRow, selector: "[checkBoxRow]", inputs: ["checkBoxId", "checkBoxName", "checkBoxValue"], outputs: ["checkBoxValueChange"] }, { kind: "directive", type: TableColumnHeader, selector: "[headerCell]", inputs: ["headerName", "columnSize", "filterRouting", "tableName", "sortName", "centerCell", "tableFilters"], outputs: ["onSortChange", "tableFiltersChange"] }, { kind: "directive", type: TableRow, selector: "[tableRow]" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "pipe", type: ImageSrcPipe, name: "imgSrc" }], animations: [
3047
+ TableViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: TableViewComponent, selector: "table-view", usesInheritance: true, ngImport: i0, template: "<div class=\"table-view\" [@listAnimation]=\"picturesList.length\">\r\n <wz-table\r\n [checkbox]=\"true\"\r\n (toggleAllCheckBox)=\"onToggleAllCheckBoxRow($event)\"\r\n [(tableFilters)]=\"tableFilters\"\r\n (tableFiltersChange)=\"onFiltersChange()\"\r\n [placeholder]=\"'ImgManager.SearchBar.placeholder' | translate\"\r\n [disablePagniation]=\"displayPexelsResults\"\r\n [isLoading]=\"isLoading\"\r\n >\r\n <!-- Header Section -->\r\n <div\r\n headerCell\r\n [headerName]=\"'ImgManager.ImgList.titleImgName' | translate\"\r\n columnSize=\"2\"\r\n sortName=\"name\"\r\n ></div>\r\n <div\r\n headerCell\r\n centerCell=\"center\"\r\n [headerName]=\"'ImgManager.ImgList.titleResolution' | translate\"\r\n ></div>\r\n <div headerCell columnSize=\"0\"></div>\r\n\r\n <!-- Body Section -->\r\n <div\r\n tableRow\r\n checkBoxRow\r\n [checkBoxValue]=\"picture.delSelected\"\r\n (checkBoxValueChange)=\"onToggleDelSelection(index)\"\r\n *ngFor=\"let picture of picturesList; let index = index\"\r\n >\r\n\r\n <div tableColumn columnSize=\"2\">\r\n <div class=\"table-view__row__container\">\r\n <div\r\n class=\"table-view__row__container__imgContainer\"\r\n [ngClass]=\"{'imgSelected': picture.selected}\"\r\n (click)=\"onToggleSelectImg(index)\">\r\n <img\r\n class=\"table-view__row__container__imgContainer__img\"\r\n [src]=\"picture.file_name | imgSrc : '100'\"\r\n alt=\"picture.display_name\"\r\n [ngClass]=\"{'pictureDeletion': picture.deleted}\"\r\n (error)=\"picture.imgNotLoaded=true;onPictureNotLoading($event);\"\r\n />\r\n <!-- If the img is not loaded, or the link is broken, an icon is displayed -->\r\n <div\r\n *ngIf=\"picture.imgNotLoaded\"\r\n class=\"table-view__row__container__imgContainer__overlay\"\r\n >\r\n <i class=\"fad fa-folder-times\"></i>\r\n </div>\r\n </div>\r\n <input\r\n type=\"text\"\r\n class=\"wzImgMngInput table-view__row__container__name\"\r\n [(ngModel)]=\"picture.display_name\"\r\n (focus)=\"previousName=picture.display_name\"\r\n (blur)=\"onNameChange(picture.id_file)\"\r\n (click)=\"onToggleDelSelection(index)\"\r\n [ngClass]=\"{'desabled': picture.deleted}\"\r\n [disabled]=\"picture.deleted\"\r\n >\r\n </div>\r\n </div>\r\n\r\n <div\r\n tableColumn\r\n centerCell=\"center\"\r\n (click)=\"onToggleDelSelection(index)\"\r\n >\r\n <p class=\"grey\">{{picture.raw_height}}x{{picture.raw_width}}</p>\r\n </div>\r\n\r\n <div tableColumn centerCell=\"center\" columnSize=\"0\" class=\"table-view__dropdown-options\">\r\n <!-- Dropdown -->\r\n <dropdown dropdownId=\"dropdown-options\" [disable]=\"picture.deleted\">\r\n <ng-container label>\r\n <div class=\"table-view__dropdown-options__label rotate\">\r\n <span> <i class=\"far fa-ellipsis-h is-size-4\" aria-haspopup=\"true\" aria-controls=\"dropdown-menu\"> </i> </span>\r\n </div>\r\n </ng-container>\r\n <ng-container item>\r\n <div\r\n class=\"dropdown-item\"\r\n (click)=\"onDownloadImg(picture.display_name, picture.file_name)\"\r\n >\r\n <i class=\"far fa-download download\"></i>&nbsp;\r\n <p>{{ 'ImgManager.ImgList.download' | translate }}</p>\r\n </div>\r\n </ng-container>\r\n <ng-container item>\r\n <div\r\n class=\"dropdown-item\"\r\n (click)=\"onEdit(picture)\"\r\n >\r\n <i class=\"far fa-crop-alt edit\"></i>&nbsp;\r\n <p>{{ 'ImgManager.ImgList.edit' | translate }}</p>\r\n </div>\r\n </ng-container>\r\n <ng-container item>\r\n <div\r\n class=\"dropdown-item\"\r\n (click)=\"copyImageLink(picture.file_name)\"\r\n >\r\n <i class=\"far fa-copy copy\"></i>&nbsp;\r\n <p>{{ 'ImgManager.ImgList.Link' | translate }}</p>\r\n </div>\r\n </ng-container>\r\n <ng-container item>\r\n <div\r\n class=\"dropdown-item\"\r\n (click)=\"onRemoveImg(picture)\"\r\n >\r\n <i class=\"fal fa-times deleted\"></i>&nbsp;\r\n <p>{{ 'ImgManager.ImgList.remove' | translate }}</p>\r\n </div>\r\n </ng-container>\r\n </dropdown>\r\n </div>\r\n </div>\r\n </wz-table>\r\n</div>\r\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.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: "component", type: DropdownComponent, selector: "dropdown", inputs: ["dropDownMenuClass", "disable"] }, { kind: "component", type: TableComponent, selector: "wz-table", inputs: ["tableFilters", "tableRoutingName", "placeholder", "checkbox", "disableSearch", "disablePagniation", "isLoading"], outputs: ["tableFiltersChange", "toggleAllCheckBox"] }, { kind: "directive", type: TableColumn, selector: "[tableColumn]", inputs: ["columnSize", "centerCell"] }, { kind: "directive", type: CheckBoxRow, selector: "[checkBoxRow]", inputs: ["checkBoxId", "checkBoxName", "checkBoxValue"], outputs: ["checkBoxValueChange"] }, { kind: "directive", type: TableColumnHeader, selector: "[headerCell]", inputs: ["headerName", "columnSize", "filterRouting", "tableName", "sortName", "centerCell", "tableFilters"], outputs: ["onSortChange", "tableFiltersChange"] }, { kind: "directive", type: TableRow, selector: "[tableRow]" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "pipe", type: ImageSrcPipe, name: "imgSrc" }], animations: [
3282
3048
  listAnnimation
3283
3049
  ] });
3284
3050
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: TableViewComponent, decorators: [{
3285
3051
  type: Component,
3286
3052
  args: [{ selector: 'table-view', animations: [
3287
3053
  listAnnimation
3288
- ], template: "<div class=\"table-view\" [@listAnimation]=\"picturesList.length\">\r\n <wz-table\r\n [checkbox]=\"true\"\r\n (toggleAllCheckBox)=\"onToggleAllCheckBoxRow($event)\"\r\n [(tableFilters)]=\"tableFilters\"\r\n (tableFiltersChange)=\"onFiltersChange()\"\r\n [placeholder]=\"'ImgManager.SearchBar.placeholder' | translate\"\r\n [disablePagniation]=\"displayPexelsResults\"\r\n [isLoading]=\"isLoading\"\r\n >\r\n <!-- Header Section -->\r\n <div\r\n headerCell\r\n [headerName]=\"'ImgManager.ImgList.titleImgName' | translate\"\r\n columnSize=\"2\"\r\n sortName=\"name\"\r\n ></div>\r\n <div\r\n headerCell\r\n centerCell=\"center\"\r\n [headerName]=\"'ImgManager.ImgList.titleResolution' | translate\"\r\n ></div>\r\n <div headerCell columnSize=\"0\"></div>\r\n\r\n <!-- Body Section -->\r\n <div\r\n tableRow\r\n checkBoxRow\r\n [checkBoxValue]=\"picture.delSelected\"\r\n (checkBoxValueChange)=\"onToggleDelSelection(index)\"\r\n *ngFor=\"let picture of picturesList; let index = index\"\r\n >\r\n\r\n <div tableColumn columnSize=\"2\">\r\n <div class=\"table-view__row__container\">\r\n <div\r\n class=\"table-view__row__container__imgContainer\"\r\n [ngClass]=\"{'imgSelected': picture.selected}\"\r\n (click)=\"onToggleSelectImg(index)\">\r\n <img\r\n class=\"table-view__row__container__imgContainer__img\"\r\n [src]=\"picture.file_name | imgSrc : '100'\"\r\n alt=\"picture.display_name\"\r\n [ngClass]=\"{'pictureDeletion': picture.deleted}\"\r\n (error)=\"picture.imgNotLoaded=true;onPictureNotLoading($event);\"\r\n />\r\n <!-- If the img is not loaded, or the link is broken, an icon is displayed -->\r\n <div\r\n *ngIf=\"picture.imgNotLoaded\"\r\n class=\"table-view__row__container__imgContainer__overlay\"\r\n >\r\n <i class=\"fad fa-folder-times\"></i>\r\n </div>\r\n </div>\r\n <input\r\n type=\"text\"\r\n class=\"wzImgMngInput table-view__row__container__name\"\r\n [(ngModel)]=\"picture.display_name\"\r\n (focus)=\"previousName=picture.display_name\"\r\n (blur)=\"onNameChange(picture.id_file)\"\r\n (click)=\"onToggleDelSelection(index)\"\r\n [ngClass]=\"{'desabled': picture.deleted}\"\r\n [disabled]=\"picture.deleted\"\r\n >\r\n </div>\r\n </div>\r\n\r\n <div\r\n tableColumn\r\n centerCell=\"center\"\r\n (click)=\"onToggleDelSelection(index)\"\r\n >\r\n <p class=\"grey\">{{picture.raw_height}}x{{picture.raw_width}}</p>\r\n </div>\r\n\r\n <div tableColumn centerCell=\"center\" columnSize=\"0\" class=\"table-view__dropdown-options\">\r\n <!-- Dropdown -->\r\n <dropdown dropdownId=\"dropdown-options\" [disable]=\"picture.deleted\">\r\n <ng-container label>\r\n <div class=\"table-view__dropdown-options__label rotate\">\r\n <span> <i class=\"far fa-ellipsis-h is-size-4\" aria-haspopup=\"true\" aria-controls=\"dropdown-menu\"> </i> </span>\r\n </div>\r\n </ng-container>\r\n <ng-container item>\r\n <div\r\n class=\"dropdown-item\"\r\n (click)=\"onDownloadImg(picture.display_name, picture.file_name)\"\r\n >\r\n <i class=\"far fa-download download\"></i>&nbsp;\r\n <p>{{ 'ImgManager.ImgList.download' | translate }}</p>\r\n </div>\r\n </ng-container>\r\n <ng-container item>\r\n <div\r\n class=\"dropdown-item\"\r\n (click)=\"redirectToVideo(picture)\"\r\n >\r\n <i class=\"fa-solid fa-play\"></i>&nbsp;\r\n <p>{{ 'ImgManager.ImgEditor.AddVideo' | translate }}</p>\r\n </div>\r\n </ng-container>\r\n <ng-container item>\r\n <div\r\n class=\"dropdown-item\"\r\n (click)=\"onEdit(picture)\"\r\n >\r\n <i class=\"far fa-crop-alt edit\"></i>&nbsp;\r\n <p>{{ 'ImgManager.ImgList.edit' | translate }}</p>\r\n </div>\r\n </ng-container>\r\n <ng-container item>\r\n <div\r\n class=\"dropdown-item\"\r\n (click)=\"copyImageLink(picture.file_name)\"\r\n >\r\n <i class=\"far fa-copy copy\"></i>&nbsp;\r\n <p>{{ 'ImgManager.ImgList.Link' | translate }}</p>\r\n </div>\r\n </ng-container>\r\n <ng-container item>\r\n <div\r\n class=\"dropdown-item\"\r\n (click)=\"onRemoveImg(picture)\"\r\n >\r\n <i class=\"fal fa-times deleted\"></i>&nbsp;\r\n <p>{{ 'ImgManager.ImgList.remove' | translate }}</p>\r\n </div>\r\n </ng-container>\r\n </dropdown>\r\n </div>\r\n </div>\r\n </wz-table>\r\n</div>\r\n" }]
3054
+ ], template: "<div class=\"table-view\" [@listAnimation]=\"picturesList.length\">\r\n <wz-table\r\n [checkbox]=\"true\"\r\n (toggleAllCheckBox)=\"onToggleAllCheckBoxRow($event)\"\r\n [(tableFilters)]=\"tableFilters\"\r\n (tableFiltersChange)=\"onFiltersChange()\"\r\n [placeholder]=\"'ImgManager.SearchBar.placeholder' | translate\"\r\n [disablePagniation]=\"displayPexelsResults\"\r\n [isLoading]=\"isLoading\"\r\n >\r\n <!-- Header Section -->\r\n <div\r\n headerCell\r\n [headerName]=\"'ImgManager.ImgList.titleImgName' | translate\"\r\n columnSize=\"2\"\r\n sortName=\"name\"\r\n ></div>\r\n <div\r\n headerCell\r\n centerCell=\"center\"\r\n [headerName]=\"'ImgManager.ImgList.titleResolution' | translate\"\r\n ></div>\r\n <div headerCell columnSize=\"0\"></div>\r\n\r\n <!-- Body Section -->\r\n <div\r\n tableRow\r\n checkBoxRow\r\n [checkBoxValue]=\"picture.delSelected\"\r\n (checkBoxValueChange)=\"onToggleDelSelection(index)\"\r\n *ngFor=\"let picture of picturesList; let index = index\"\r\n >\r\n\r\n <div tableColumn columnSize=\"2\">\r\n <div class=\"table-view__row__container\">\r\n <div\r\n class=\"table-view__row__container__imgContainer\"\r\n [ngClass]=\"{'imgSelected': picture.selected}\"\r\n (click)=\"onToggleSelectImg(index)\">\r\n <img\r\n class=\"table-view__row__container__imgContainer__img\"\r\n [src]=\"picture.file_name | imgSrc : '100'\"\r\n alt=\"picture.display_name\"\r\n [ngClass]=\"{'pictureDeletion': picture.deleted}\"\r\n (error)=\"picture.imgNotLoaded=true;onPictureNotLoading($event);\"\r\n />\r\n <!-- If the img is not loaded, or the link is broken, an icon is displayed -->\r\n <div\r\n *ngIf=\"picture.imgNotLoaded\"\r\n class=\"table-view__row__container__imgContainer__overlay\"\r\n >\r\n <i class=\"fad fa-folder-times\"></i>\r\n </div>\r\n </div>\r\n <input\r\n type=\"text\"\r\n class=\"wzImgMngInput table-view__row__container__name\"\r\n [(ngModel)]=\"picture.display_name\"\r\n (focus)=\"previousName=picture.display_name\"\r\n (blur)=\"onNameChange(picture.id_file)\"\r\n (click)=\"onToggleDelSelection(index)\"\r\n [ngClass]=\"{'desabled': picture.deleted}\"\r\n [disabled]=\"picture.deleted\"\r\n >\r\n </div>\r\n </div>\r\n\r\n <div\r\n tableColumn\r\n centerCell=\"center\"\r\n (click)=\"onToggleDelSelection(index)\"\r\n >\r\n <p class=\"grey\">{{picture.raw_height}}x{{picture.raw_width}}</p>\r\n </div>\r\n\r\n <div tableColumn centerCell=\"center\" columnSize=\"0\" class=\"table-view__dropdown-options\">\r\n <!-- Dropdown -->\r\n <dropdown dropdownId=\"dropdown-options\" [disable]=\"picture.deleted\">\r\n <ng-container label>\r\n <div class=\"table-view__dropdown-options__label rotate\">\r\n <span> <i class=\"far fa-ellipsis-h is-size-4\" aria-haspopup=\"true\" aria-controls=\"dropdown-menu\"> </i> </span>\r\n </div>\r\n </ng-container>\r\n <ng-container item>\r\n <div\r\n class=\"dropdown-item\"\r\n (click)=\"onDownloadImg(picture.display_name, picture.file_name)\"\r\n >\r\n <i class=\"far fa-download download\"></i>&nbsp;\r\n <p>{{ 'ImgManager.ImgList.download' | translate }}</p>\r\n </div>\r\n </ng-container>\r\n <ng-container item>\r\n <div\r\n class=\"dropdown-item\"\r\n (click)=\"onEdit(picture)\"\r\n >\r\n <i class=\"far fa-crop-alt edit\"></i>&nbsp;\r\n <p>{{ 'ImgManager.ImgList.edit' | translate }}</p>\r\n </div>\r\n </ng-container>\r\n <ng-container item>\r\n <div\r\n class=\"dropdown-item\"\r\n (click)=\"copyImageLink(picture.file_name)\"\r\n >\r\n <i class=\"far fa-copy copy\"></i>&nbsp;\r\n <p>{{ 'ImgManager.ImgList.Link' | translate }}</p>\r\n </div>\r\n </ng-container>\r\n <ng-container item>\r\n <div\r\n class=\"dropdown-item\"\r\n (click)=\"onRemoveImg(picture)\"\r\n >\r\n <i class=\"fal fa-times deleted\"></i>&nbsp;\r\n <p>{{ 'ImgManager.ImgList.remove' | translate }}</p>\r\n </div>\r\n </ng-container>\r\n </dropdown>\r\n </div>\r\n </div>\r\n </wz-table>\r\n</div>\r\n" }]
3289
3055
  }], ctorParameters: function () { return [{ type: ImgManagerService }, { type: ImgSelectionService }, { type: i3$1.HttpClient }, { type: ImgCDNService }, { type: ImgEventService }, { type: AlertService }, { type: i3.TranslateService }, { type: ApiService }]; } });
3290
3056
 
3291
3057
  class ImagesViewComponent {
@@ -3827,7 +3593,6 @@ class ImgTabsComponent {
3827
3593
  tabs: string[] = ['img-upload', 'images-view', 'pexels-lib', 'img-edition']; */
3828
3594
  this.editTab = false;
3829
3595
  this.imgUpload = false;
3830
- this.isVideoEdit = false;
3831
3596
  this.snackBarNewVersionConfig = {
3832
3597
  message: '',
3833
3598
  duration: 3000
@@ -3838,14 +3603,6 @@ class ImgTabsComponent {
3838
3603
  this.tabActive = this.tabs[3];
3839
3604
  this.imgToEdit = imgToEdit;
3840
3605
  this.editTab = true;
3841
- this.isVideoEdit = false;
3842
- this.currentTab.emit(this.tabs[3]);
3843
- });
3844
- this.imgEventEditService.getImgToVideoEventListener().subscribe(imgToEdit => {
3845
- this.tabActive = this.tabs[3];
3846
- this.imgToEdit = imgToEdit;
3847
- this.editTab = true;
3848
- this.isVideoEdit = true;
3849
3606
  this.currentTab.emit(this.tabs[3]);
3850
3607
  });
3851
3608
  }
@@ -3879,10 +3636,10 @@ class ImgTabsComponent {
3879
3636
  }
3880
3637
  }
3881
3638
  ImgTabsComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ImgTabsComponent, deps: [{ token: ImgEventService }, { token: AlertService }, { token: i3$2.Router }], target: i0.ɵɵFactoryTarget.Component });
3882
- ImgTabsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: ImgTabsComponent, selector: "img-tabs", inputs: { multipleImgMode: "multipleImgMode", stateDisplayed: "stateDisplayed", listDisplayed: "listDisplayed" }, outputs: { imgManagerClosed: "imgManagerClosed", currentTab: "currentTab", switchDisplayWindow: "switchDisplayWindow" }, viewQueries: [{ propertyName: "imgUploadedComponent", first: true, predicate: ["imgUploadedImg"], descendants: true }], ngImport: i0, template: "<div\r\n class=\"img-tabs\" [ngClass]=\"{'small': stateDisplayed === 'small'}\">\r\n <div class=\"wrapper-tabs\">\r\n <div\r\n class=\"tabs\"\r\n [ngClass]=\"\r\n {\r\n 'tabs--notWindow': stateDisplayed !== 'window',\r\n 'tabs--notDisplayed': stateDisplayed === 'window' && tabActive.value === tabs[3].value\r\n }\">\r\n\r\n <ul>\r\n <li class=\"is-active\" [ngClass]=\"{'is-active': tabActive.value === tabs[0].value}\" (click)=\"toggleTabs(tabs[0])\"><a>{{ tabs[0].name | translate }}</a></li>\r\n <li [ngClass]=\"{'is-active': tabActive.value === tabs[1].value}\" (click)=\"toggleTabs(tabs[1])\"><a>{{ tabs[1].name | translate }}</a></li>\r\n <li [ngClass]=\"{'is-active': tabActive.value === tabs[2].value}\" (click)=\"toggleTabs(tabs[2])\"><a>{{ tabs[2].name | translate }}</a></li>\r\n <li [ngClass]=\"{'is-active': tabActive.value === tabs[3].value}\" *ngIf=\"editTab\"><a>{{ tabs[3].name | translate }}</a></li>\r\n </ul>\r\n <div\r\n class=\"img-tabs__canva\"\r\n [ngClass]=\"{'img-tabs__canva--window': stateDisplayed === 'window'}\">\r\n <canva-btn\r\n (showImgUploaded)=\"onShowImgUploaded()\"\r\n [stateDisplayed]=\"stateDisplayed\">\r\n </canva-btn>\r\n </div>\r\n </div>\r\n <div class=\"select-mobile-page\">\r\n <wac-select\r\n [(ngModel)]=\"tabActive\"\r\n name=\"tabs\"\r\n [items]=\"tabs\"\r\n ></wac-select>\r\n </div>\r\n </div>\r\n\r\n <!-- Upload section -->\r\n <div\r\n class=\"columns img-tabs__tabsFirst\"\r\n [ngClass]=\"{\r\n 'img-tabs__tabsFirst--small': stateDisplayed === 'small',\r\n 'img-tabs__tabsFirst--window': stateDisplayed === 'window'\r\n }\"\r\n *ngIf=\"tabActive.value === tabs[0].value\">\r\n <div class=\"column img-tabs__tabsFirst__upload\">\r\n <img-upload\r\n [stateDisplayed]=\"stateDisplayed\"\r\n (imgUploaded)=\"onImgUploaded($event)\"\r\n ></img-upload>\r\n </div>\r\n <div class=\"column img-tabs__tabsFirst__list\" [ngClass]=\"{\r\n 'img-tabs__tabsFirst__list--upload': imgUpload\r\n }\">\r\n <images-view\r\n *ngIf=\"!imgUpload\"\r\n [stateDisplayed]=\"stateDisplayed\"\r\n [listDisplayed]=\"false\"\r\n [multipleImgMode]=\"multipleImgMode\"\r\n [tabDisplayed]=\"tabActive.value\"\r\n [nbRowToShow]=\"2\"\r\n (switchDisplayWindow)=\"switchDisplayWindowImgView()\"\r\n [fullSize]=\"false\">\r\n </images-view>\r\n\r\n\r\n <div [hidden]=\"!imgUpload\">\r\n <upload-list\r\n #imgUploadedImg\r\n [stateDisplayed]=\"stateDisplayed\"\r\n [tabDisplayed]=\"tabActive.value\"\r\n [multipleImgMode]=\"multipleImgMode\"\r\n (switchDisplayWindow)=\"switchDisplayWindowImgView()\"\r\n >\r\n </upload-list>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <!-- Images section -->\r\n <div class=\"columns img-tabs__tabsSecond\" *ngIf=\"tabActive.value === tabs[1].value\">\r\n <div class=\"column\">\r\n\r\n <images-view\r\n [stateDisplayed]=\"stateDisplayed\"\r\n [listDisplayed]=\"listDisplayed\"\r\n [multipleImgMode]=\"multipleImgMode\"\r\n [tabDisplayed]=\"tabActive.value\"\r\n (switchDisplayWindow)=\"switchDisplayWindowImgView()\"\r\n [fullSize]=\"true\">\r\n </images-view>\r\n\r\n </div>\r\n </div>\r\n\r\n <!-- Pexels img section -->\r\n <div class=\"columns img-tabs__tabsThird\" *ngIf=\"tabActive.value === tabs[2].value\">\r\n <div class=\"column\">\r\n <pexels-lib\r\n [stateDisplayed]=\"stateDisplayed\"\r\n (showImgUploaded)=\"onShowImgUploaded()\">\r\n </pexels-lib>\r\n </div>\r\n </div>\r\n\r\n <!--Edition section -->\r\n <div class=\"columns img-tabs__tabsEdit\" *ngIf=\"tabActive.value === tabs[3].value\">\r\n <div class=\"column\">\r\n <img-editor\r\n [stateDisplayed]=\"stateDisplayed\"\r\n [imgToEdit]=\"imgToEdit\"\r\n [isVideoEdit]=\"isVideoEdit\"\r\n (editClosed)=\"onEditClosed($event)\">\r\n </img-editor>\r\n </div>\r\n </div>\r\n\r\n</div>\r\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.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: ImgUploadComponent, selector: "img-upload", inputs: ["stateDisplayed"], outputs: ["imgUploaded"] }, { kind: "component", type: PexelLibComponent, selector: "pexels-lib", inputs: ["stateDisplayed", "searchValue", "disableSearch"] }, { kind: "component", type: UploadListComponent, selector: "upload-list", inputs: ["stateDisplayed", "tabDisplayed", "multipleImgMode"], outputs: ["switchDisplayWindow"] }, { kind: "component", type: ImgEditorComponent, selector: "img-editor", inputs: ["stateDisplayed", "imgToEdit", "isVideoEdit"], outputs: ["editClosed"] }, { kind: "component", type: CanvaBtnComponent, selector: "canva-btn", inputs: ["stateDisplayed"], outputs: ["showImgUploaded"] }, { kind: "component", type: ImagesViewComponent, selector: "images-view", inputs: ["stateDisplayed", "tabDisplayed", "fullSize", "nbRowToShow", "listDisplayed", "multipleImgMode"], outputs: ["switchDisplayWindow"] }, { kind: "component", type: SelectComponent, selector: "wac-select", inputs: ["items", "placeholder", "label", "maxWidthItems", "search", "type", "callToAction", "maxWidth", "disabled"], outputs: ["selectValue", "clickOnCallToAction"] }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] });
3639
+ ImgTabsComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: ImgTabsComponent, selector: "img-tabs", inputs: { multipleImgMode: "multipleImgMode", stateDisplayed: "stateDisplayed", listDisplayed: "listDisplayed" }, outputs: { imgManagerClosed: "imgManagerClosed", currentTab: "currentTab", switchDisplayWindow: "switchDisplayWindow" }, viewQueries: [{ propertyName: "imgUploadedComponent", first: true, predicate: ["imgUploadedImg"], descendants: true }], ngImport: i0, template: "<div\r\n class=\"img-tabs\" [ngClass]=\"{'small': stateDisplayed === 'small'}\">\r\n <div class=\"wrapper-tabs\">\r\n <div\r\n class=\"tabs\"\r\n [ngClass]=\"\r\n {\r\n 'tabs--notWindow': stateDisplayed !== 'window',\r\n 'tabs--notDisplayed': stateDisplayed === 'window' && tabActive.value === tabs[3].value\r\n }\">\r\n\r\n <ul>\r\n <li class=\"is-active\" [ngClass]=\"{'is-active': tabActive.value === tabs[0].value}\" (click)=\"toggleTabs(tabs[0])\"><a>{{ tabs[0].name | translate }}</a></li>\r\n <li [ngClass]=\"{'is-active': tabActive.value === tabs[1].value}\" (click)=\"toggleTabs(tabs[1])\"><a>{{ tabs[1].name | translate }}</a></li>\r\n <li [ngClass]=\"{'is-active': tabActive.value === tabs[2].value}\" (click)=\"toggleTabs(tabs[2])\"><a>{{ tabs[2].name | translate }}</a></li>\r\n <li [ngClass]=\"{'is-active': tabActive.value === tabs[3].value}\" *ngIf=\"editTab\"><a>{{ tabs[3].name | translate }}</a></li>\r\n </ul>\r\n <div\r\n class=\"img-tabs__canva\"\r\n [ngClass]=\"{'img-tabs__canva--window': stateDisplayed === 'window'}\">\r\n <canva-btn\r\n (showImgUploaded)=\"onShowImgUploaded()\"\r\n [stateDisplayed]=\"stateDisplayed\">\r\n </canva-btn>\r\n </div>\r\n </div>\r\n <div class=\"select-mobile-page\">\r\n <wac-select\r\n [(ngModel)]=\"tabActive\"\r\n name=\"tabs\"\r\n [items]=\"tabs\"\r\n ></wac-select>\r\n </div>\r\n </div>\r\n\r\n <!-- Upload section -->\r\n <div\r\n class=\"columns img-tabs__tabsFirst\"\r\n [ngClass]=\"{\r\n 'img-tabs__tabsFirst--small': stateDisplayed === 'small',\r\n 'img-tabs__tabsFirst--window': stateDisplayed === 'window'\r\n }\"\r\n *ngIf=\"tabActive.value === tabs[0].value\">\r\n <div class=\"column img-tabs__tabsFirst__upload\">\r\n <img-upload\r\n [stateDisplayed]=\"stateDisplayed\"\r\n (imgUploaded)=\"onImgUploaded($event)\"\r\n ></img-upload>\r\n </div>\r\n <div class=\"column img-tabs__tabsFirst__list\" [ngClass]=\"{\r\n 'img-tabs__tabsFirst__list--upload': imgUpload\r\n }\">\r\n <images-view\r\n *ngIf=\"!imgUpload\"\r\n [stateDisplayed]=\"stateDisplayed\"\r\n [listDisplayed]=\"false\"\r\n [multipleImgMode]=\"multipleImgMode\"\r\n [tabDisplayed]=\"tabActive.value\"\r\n [nbRowToShow]=\"2\"\r\n (switchDisplayWindow)=\"switchDisplayWindowImgView()\"\r\n [fullSize]=\"false\">\r\n </images-view>\r\n\r\n\r\n <div [hidden]=\"!imgUpload\">\r\n <upload-list\r\n #imgUploadedImg\r\n [stateDisplayed]=\"stateDisplayed\"\r\n [tabDisplayed]=\"tabActive.value\"\r\n [multipleImgMode]=\"multipleImgMode\"\r\n (switchDisplayWindow)=\"switchDisplayWindowImgView()\"\r\n >\r\n </upload-list>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <!-- Images section -->\r\n <div class=\"columns img-tabs__tabsSecond\" *ngIf=\"tabActive.value === tabs[1].value\">\r\n <div class=\"column\">\r\n\r\n <images-view\r\n [stateDisplayed]=\"stateDisplayed\"\r\n [listDisplayed]=\"listDisplayed\"\r\n [multipleImgMode]=\"multipleImgMode\"\r\n [tabDisplayed]=\"tabActive.value\"\r\n (switchDisplayWindow)=\"switchDisplayWindowImgView()\"\r\n [fullSize]=\"true\">\r\n </images-view>\r\n\r\n </div>\r\n </div>\r\n\r\n <!-- Pexels img section -->\r\n <div class=\"columns img-tabs__tabsThird\" *ngIf=\"tabActive.value === tabs[2].value\">\r\n <div class=\"column\">\r\n <pexels-lib\r\n [stateDisplayed]=\"stateDisplayed\"\r\n (showImgUploaded)=\"onShowImgUploaded()\">\r\n </pexels-lib>\r\n </div>\r\n </div>\r\n\r\n <!--Edition section -->\r\n <div class=\"columns img-tabs__tabsEdit\" *ngIf=\"tabActive.value === tabs[3].value\">\r\n <div class=\"column\">\r\n <img-editor\r\n [stateDisplayed]=\"stateDisplayed\"\r\n [imgToEdit]=\"imgToEdit\"\r\n (editClosed)=\"onEditClosed($event)\">\r\n </img-editor>\r\n </div>\r\n </div>\r\n\r\n</div>\r\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.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: ImgUploadComponent, selector: "img-upload", inputs: ["stateDisplayed"], outputs: ["imgUploaded"] }, { kind: "component", type: PexelLibComponent, selector: "pexels-lib", inputs: ["stateDisplayed", "searchValue", "disableSearch"] }, { kind: "component", type: UploadListComponent, selector: "upload-list", inputs: ["stateDisplayed", "tabDisplayed", "multipleImgMode"], outputs: ["switchDisplayWindow"] }, { kind: "component", type: ImgEditorComponent, selector: "img-editor", inputs: ["stateDisplayed", "imgToEdit"], outputs: ["editClosed"] }, { kind: "component", type: CanvaBtnComponent, selector: "canva-btn", inputs: ["stateDisplayed"], outputs: ["showImgUploaded"] }, { kind: "component", type: ImagesViewComponent, selector: "images-view", inputs: ["stateDisplayed", "tabDisplayed", "fullSize", "nbRowToShow", "listDisplayed", "multipleImgMode"], outputs: ["switchDisplayWindow"] }, { kind: "component", type: SelectComponent, selector: "wac-select", inputs: ["items", "placeholder", "label", "maxWidthItems", "search", "type", "callToAction", "maxWidth", "disabled"], outputs: ["selectValue", "clickOnCallToAction"] }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] });
3883
3640
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ImgTabsComponent, decorators: [{
3884
3641
  type: Component,
3885
- args: [{ selector: 'img-tabs', template: "<div\r\n class=\"img-tabs\" [ngClass]=\"{'small': stateDisplayed === 'small'}\">\r\n <div class=\"wrapper-tabs\">\r\n <div\r\n class=\"tabs\"\r\n [ngClass]=\"\r\n {\r\n 'tabs--notWindow': stateDisplayed !== 'window',\r\n 'tabs--notDisplayed': stateDisplayed === 'window' && tabActive.value === tabs[3].value\r\n }\">\r\n\r\n <ul>\r\n <li class=\"is-active\" [ngClass]=\"{'is-active': tabActive.value === tabs[0].value}\" (click)=\"toggleTabs(tabs[0])\"><a>{{ tabs[0].name | translate }}</a></li>\r\n <li [ngClass]=\"{'is-active': tabActive.value === tabs[1].value}\" (click)=\"toggleTabs(tabs[1])\"><a>{{ tabs[1].name | translate }}</a></li>\r\n <li [ngClass]=\"{'is-active': tabActive.value === tabs[2].value}\" (click)=\"toggleTabs(tabs[2])\"><a>{{ tabs[2].name | translate }}</a></li>\r\n <li [ngClass]=\"{'is-active': tabActive.value === tabs[3].value}\" *ngIf=\"editTab\"><a>{{ tabs[3].name | translate }}</a></li>\r\n </ul>\r\n <div\r\n class=\"img-tabs__canva\"\r\n [ngClass]=\"{'img-tabs__canva--window': stateDisplayed === 'window'}\">\r\n <canva-btn\r\n (showImgUploaded)=\"onShowImgUploaded()\"\r\n [stateDisplayed]=\"stateDisplayed\">\r\n </canva-btn>\r\n </div>\r\n </div>\r\n <div class=\"select-mobile-page\">\r\n <wac-select\r\n [(ngModel)]=\"tabActive\"\r\n name=\"tabs\"\r\n [items]=\"tabs\"\r\n ></wac-select>\r\n </div>\r\n </div>\r\n\r\n <!-- Upload section -->\r\n <div\r\n class=\"columns img-tabs__tabsFirst\"\r\n [ngClass]=\"{\r\n 'img-tabs__tabsFirst--small': stateDisplayed === 'small',\r\n 'img-tabs__tabsFirst--window': stateDisplayed === 'window'\r\n }\"\r\n *ngIf=\"tabActive.value === tabs[0].value\">\r\n <div class=\"column img-tabs__tabsFirst__upload\">\r\n <img-upload\r\n [stateDisplayed]=\"stateDisplayed\"\r\n (imgUploaded)=\"onImgUploaded($event)\"\r\n ></img-upload>\r\n </div>\r\n <div class=\"column img-tabs__tabsFirst__list\" [ngClass]=\"{\r\n 'img-tabs__tabsFirst__list--upload': imgUpload\r\n }\">\r\n <images-view\r\n *ngIf=\"!imgUpload\"\r\n [stateDisplayed]=\"stateDisplayed\"\r\n [listDisplayed]=\"false\"\r\n [multipleImgMode]=\"multipleImgMode\"\r\n [tabDisplayed]=\"tabActive.value\"\r\n [nbRowToShow]=\"2\"\r\n (switchDisplayWindow)=\"switchDisplayWindowImgView()\"\r\n [fullSize]=\"false\">\r\n </images-view>\r\n\r\n\r\n <div [hidden]=\"!imgUpload\">\r\n <upload-list\r\n #imgUploadedImg\r\n [stateDisplayed]=\"stateDisplayed\"\r\n [tabDisplayed]=\"tabActive.value\"\r\n [multipleImgMode]=\"multipleImgMode\"\r\n (switchDisplayWindow)=\"switchDisplayWindowImgView()\"\r\n >\r\n </upload-list>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <!-- Images section -->\r\n <div class=\"columns img-tabs__tabsSecond\" *ngIf=\"tabActive.value === tabs[1].value\">\r\n <div class=\"column\">\r\n\r\n <images-view\r\n [stateDisplayed]=\"stateDisplayed\"\r\n [listDisplayed]=\"listDisplayed\"\r\n [multipleImgMode]=\"multipleImgMode\"\r\n [tabDisplayed]=\"tabActive.value\"\r\n (switchDisplayWindow)=\"switchDisplayWindowImgView()\"\r\n [fullSize]=\"true\">\r\n </images-view>\r\n\r\n </div>\r\n </div>\r\n\r\n <!-- Pexels img section -->\r\n <div class=\"columns img-tabs__tabsThird\" *ngIf=\"tabActive.value === tabs[2].value\">\r\n <div class=\"column\">\r\n <pexels-lib\r\n [stateDisplayed]=\"stateDisplayed\"\r\n (showImgUploaded)=\"onShowImgUploaded()\">\r\n </pexels-lib>\r\n </div>\r\n </div>\r\n\r\n <!--Edition section -->\r\n <div class=\"columns img-tabs__tabsEdit\" *ngIf=\"tabActive.value === tabs[3].value\">\r\n <div class=\"column\">\r\n <img-editor\r\n [stateDisplayed]=\"stateDisplayed\"\r\n [imgToEdit]=\"imgToEdit\"\r\n [isVideoEdit]=\"isVideoEdit\"\r\n (editClosed)=\"onEditClosed($event)\">\r\n </img-editor>\r\n </div>\r\n </div>\r\n\r\n</div>\r\n" }]
3642
+ args: [{ selector: 'img-tabs', template: "<div\r\n class=\"img-tabs\" [ngClass]=\"{'small': stateDisplayed === 'small'}\">\r\n <div class=\"wrapper-tabs\">\r\n <div\r\n class=\"tabs\"\r\n [ngClass]=\"\r\n {\r\n 'tabs--notWindow': stateDisplayed !== 'window',\r\n 'tabs--notDisplayed': stateDisplayed === 'window' && tabActive.value === tabs[3].value\r\n }\">\r\n\r\n <ul>\r\n <li class=\"is-active\" [ngClass]=\"{'is-active': tabActive.value === tabs[0].value}\" (click)=\"toggleTabs(tabs[0])\"><a>{{ tabs[0].name | translate }}</a></li>\r\n <li [ngClass]=\"{'is-active': tabActive.value === tabs[1].value}\" (click)=\"toggleTabs(tabs[1])\"><a>{{ tabs[1].name | translate }}</a></li>\r\n <li [ngClass]=\"{'is-active': tabActive.value === tabs[2].value}\" (click)=\"toggleTabs(tabs[2])\"><a>{{ tabs[2].name | translate }}</a></li>\r\n <li [ngClass]=\"{'is-active': tabActive.value === tabs[3].value}\" *ngIf=\"editTab\"><a>{{ tabs[3].name | translate }}</a></li>\r\n </ul>\r\n <div\r\n class=\"img-tabs__canva\"\r\n [ngClass]=\"{'img-tabs__canva--window': stateDisplayed === 'window'}\">\r\n <canva-btn\r\n (showImgUploaded)=\"onShowImgUploaded()\"\r\n [stateDisplayed]=\"stateDisplayed\">\r\n </canva-btn>\r\n </div>\r\n </div>\r\n <div class=\"select-mobile-page\">\r\n <wac-select\r\n [(ngModel)]=\"tabActive\"\r\n name=\"tabs\"\r\n [items]=\"tabs\"\r\n ></wac-select>\r\n </div>\r\n </div>\r\n\r\n <!-- Upload section -->\r\n <div\r\n class=\"columns img-tabs__tabsFirst\"\r\n [ngClass]=\"{\r\n 'img-tabs__tabsFirst--small': stateDisplayed === 'small',\r\n 'img-tabs__tabsFirst--window': stateDisplayed === 'window'\r\n }\"\r\n *ngIf=\"tabActive.value === tabs[0].value\">\r\n <div class=\"column img-tabs__tabsFirst__upload\">\r\n <img-upload\r\n [stateDisplayed]=\"stateDisplayed\"\r\n (imgUploaded)=\"onImgUploaded($event)\"\r\n ></img-upload>\r\n </div>\r\n <div class=\"column img-tabs__tabsFirst__list\" [ngClass]=\"{\r\n 'img-tabs__tabsFirst__list--upload': imgUpload\r\n }\">\r\n <images-view\r\n *ngIf=\"!imgUpload\"\r\n [stateDisplayed]=\"stateDisplayed\"\r\n [listDisplayed]=\"false\"\r\n [multipleImgMode]=\"multipleImgMode\"\r\n [tabDisplayed]=\"tabActive.value\"\r\n [nbRowToShow]=\"2\"\r\n (switchDisplayWindow)=\"switchDisplayWindowImgView()\"\r\n [fullSize]=\"false\">\r\n </images-view>\r\n\r\n\r\n <div [hidden]=\"!imgUpload\">\r\n <upload-list\r\n #imgUploadedImg\r\n [stateDisplayed]=\"stateDisplayed\"\r\n [tabDisplayed]=\"tabActive.value\"\r\n [multipleImgMode]=\"multipleImgMode\"\r\n (switchDisplayWindow)=\"switchDisplayWindowImgView()\"\r\n >\r\n </upload-list>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n <!-- Images section -->\r\n <div class=\"columns img-tabs__tabsSecond\" *ngIf=\"tabActive.value === tabs[1].value\">\r\n <div class=\"column\">\r\n\r\n <images-view\r\n [stateDisplayed]=\"stateDisplayed\"\r\n [listDisplayed]=\"listDisplayed\"\r\n [multipleImgMode]=\"multipleImgMode\"\r\n [tabDisplayed]=\"tabActive.value\"\r\n (switchDisplayWindow)=\"switchDisplayWindowImgView()\"\r\n [fullSize]=\"true\">\r\n </images-view>\r\n\r\n </div>\r\n </div>\r\n\r\n <!-- Pexels img section -->\r\n <div class=\"columns img-tabs__tabsThird\" *ngIf=\"tabActive.value === tabs[2].value\">\r\n <div class=\"column\">\r\n <pexels-lib\r\n [stateDisplayed]=\"stateDisplayed\"\r\n (showImgUploaded)=\"onShowImgUploaded()\">\r\n </pexels-lib>\r\n </div>\r\n </div>\r\n\r\n <!--Edition section -->\r\n <div class=\"columns img-tabs__tabsEdit\" *ngIf=\"tabActive.value === tabs[3].value\">\r\n <div class=\"column\">\r\n <img-editor\r\n [stateDisplayed]=\"stateDisplayed\"\r\n [imgToEdit]=\"imgToEdit\"\r\n (editClosed)=\"onEditClosed($event)\">\r\n </img-editor>\r\n </div>\r\n </div>\r\n\r\n</div>\r\n" }]
3886
3643
  }], ctorParameters: function () { return [{ type: ImgEventService }, { type: AlertService }, { type: i3$2.Router }]; }, propDecorators: { multipleImgMode: [{
3887
3644
  type: Input
3888
3645
  }], stateDisplayed: [{
@@ -4182,8 +3939,6 @@ const components = [
4182
3939
  UploadListComponent,
4183
3940
  ImgEditorComponent,
4184
3941
  EditorInfoSectionComponent,
4185
- EditorInfoVideoComponent,
4186
- EditorShowIframeComponent,
4187
3942
  CanvaBtnComponent,
4188
3943
  ImgSelectionComponent,
4189
3944
  LoaderComponent,
@@ -4255,8 +4010,6 @@ WzImgManagerModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", vers
4255
4010
  UploadListComponent,
4256
4011
  ImgEditorComponent,
4257
4012
  EditorInfoSectionComponent,
4258
- EditorInfoVideoComponent,
4259
- EditorShowIframeComponent,
4260
4013
  CanvaBtnComponent,
4261
4014
  ImgSelectionComponent,
4262
4015
  LoaderComponent,