@wizishop/img-manager 0.2.48 → 0.2.52
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/assets/i18n/en.json +1 -1
- package/assets/i18n/es.json +1 -1
- package/assets/i18n/fr.json +1 -1
- package/assets/i18n/it.json +1 -1
- package/bundles/wizishop-img-manager.umd.js +6 -16
- package/bundles/wizishop-img-manager.umd.js.map +1 -1
- package/bundles/wizishop-img-manager.umd.min.js +1 -1
- package/bundles/wizishop-img-manager.umd.min.js.map +1 -1
- package/esm2015/lib/components/canva-btn/canva-btn.component.js +2 -13
- package/esm2015/lib/components/images-view/images-view.component.js +2 -2
- package/esm2015/lib/components/images-view/mosaic-view/img-card/img-card.component.js +3 -2
- package/esm2015/lib/components/img-selection/img-selection.component.js +2 -2
- package/esm2015/lib/services/user-settings.service.js +2 -2
- package/esm2015/lib/wz-img-manager.component.js +1 -2
- package/esm5/lib/components/canva-btn/canva-btn.component.js +2 -13
- package/esm5/lib/components/images-view/images-view.component.js +2 -2
- package/esm5/lib/components/images-view/mosaic-view/img-card/img-card.component.js +3 -2
- package/esm5/lib/components/img-selection/img-selection.component.js +2 -2
- package/esm5/lib/services/user-settings.service.js +2 -2
- package/esm5/lib/wz-img-manager.component.js +1 -2
- package/fesm2015/wizishop-img-manager.js +6 -16
- package/fesm2015/wizishop-img-manager.js.map +1 -1
- package/fesm5/wizishop-img-manager.js +6 -16
- package/fesm5/wizishop-img-manager.js.map +1 -1
- package/lib/components/canva-btn/canva-btn.component.d.ts +1 -4
- package/lib/components/images-view/mosaic-view/img-card/img-card.component.d.ts +1 -0
- package/package.json +1 -1
- package/wizishop-img-manager-0.2.52.tgz +0 -0
- package/wizishop-img-manager.metadata.json +1 -1
- package/wz-img-manager.scss +633 -547
- package/wizishop-img-manager-0.2.48.tgz +0 -0
|
@@ -348,7 +348,7 @@ let UserSettingsService = class UserSettingsService {
|
|
|
348
348
|
}
|
|
349
349
|
getUserDisplayPreference() {
|
|
350
350
|
const value = localStorage.getItem(this.userdisplayPreference);
|
|
351
|
-
return value == 'true'
|
|
351
|
+
return value == 'true';
|
|
352
352
|
}
|
|
353
353
|
};
|
|
354
354
|
UserSettingsService.ɵprov = ɵɵdefineInjectable({ factory: function UserSettingsService_Factory() { return new UserSettingsService(); }, token: UserSettingsService, providedIn: "root" });
|
|
@@ -570,7 +570,6 @@ let WzImgManagerComponent = class WzImgManagerComponent {
|
|
|
570
570
|
}
|
|
571
571
|
}
|
|
572
572
|
setCurrentTab(event) {
|
|
573
|
-
console.log(event);
|
|
574
573
|
if (event === 'img-edition') {
|
|
575
574
|
this.hideTab = true;
|
|
576
575
|
return;
|
|
@@ -1588,6 +1587,7 @@ let ImgCardComponent = class ImgCardComponent extends ImagesActionHandler {
|
|
|
1588
1587
|
this.focusInput = false;
|
|
1589
1588
|
this.toggleImgSelected = new EventEmitter();
|
|
1590
1589
|
this.isUploadSection = false;
|
|
1590
|
+
this.activeConfirmDelete = false;
|
|
1591
1591
|
}
|
|
1592
1592
|
ngOnInit() {
|
|
1593
1593
|
this.isUploadSection = this.tabDisplayed === 'img-upload';
|
|
@@ -1629,7 +1629,7 @@ __decorate([
|
|
|
1629
1629
|
ImgCardComponent = __decorate([
|
|
1630
1630
|
Component({
|
|
1631
1631
|
selector: 'img-card',
|
|
1632
|
-
template: "<div class=\"addCssPriority\" [@easeInOut]=\"'in'\" [ngClass]=\"{ 'fullSize': fullSize }\">\n <div class=\"img-card\">\n <div class=\"img-card__container\"\n [ngClass]=\"{\n 'smallDisplay': stateDisplayed === 'small' || isUploadSection,\n 'imgSelected': picture.selected,\n 'deletion': picture.deleted}\">\n <img\n class=\"img-card__container__img\"\n [src]=\"picture.file_name | imgSrc : '400'\"\n [alt]=\"picture.display_name\"\n (click)=\"onToggleImgSelected()\"\n (error)=\"picture.imgNotLoaded=true;onPictureNotLoading($event);\"\n />\n <div\n class=\"img-card__container__config\"\n *ngIf=\"!picture.deleted && stateDisplayed !== 'small'\"\n >\n <button class=\"size\"><i class=\"fal fa-image-polaroid\"></i><span>{{picture.raw_height}}x{{picture.raw_width}}</span></button>\n <button class=\"dl\" (click)=\"onDownloadImg(picture.display_name, picture.file_name)\"><i class=\"fal fa-download\"></i><span>{{ 'ImgManager.ImgCard.download' | translate }}</span></button>\n <button class=\"edit\" (click)=\"onEdit(picture)\"><i class=\"far fa-crop-alt\"></i><span>{{ 'ImgManager.ImgCard.edit' | translate }}</span></button>\n <button class=\"deleted\" (click)=\"
|
|
1632
|
+
template: "<div class=\"addCssPriority\" [@easeInOut]=\"'in'\" [ngClass]=\"{ 'fullSize': fullSize }\">\n <div class=\"img-card\">\n <div class=\"img-card__container\"\n [ngClass]=\"{\n 'smallDisplay': stateDisplayed === 'small' || isUploadSection,\n 'imgSelected': picture.selected,\n 'deletion': picture.deleted}\">\n <img\n class=\"img-card__container__img\"\n [src]=\"picture.file_name | imgSrc : '400'\"\n [alt]=\"picture.display_name\"\n (click)=\"onToggleImgSelected()\"\n (error)=\"picture.imgNotLoaded=true;onPictureNotLoading($event);\"\n />\n <div\n class=\"img-card__container__config\"\n *ngIf=\"!picture.deleted && stateDisplayed !== 'small'\"\n >\n <button class=\"size\"><i class=\"fal fa-image-polaroid\"></i><span>{{picture.raw_height}}x{{picture.raw_width}}</span></button>\n <button class=\"dl\" (click)=\"onDownloadImg(picture.display_name, picture.file_name)\"><i class=\"fal fa-download\"></i><span>{{ 'ImgManager.ImgCard.download' | translate }}</span></button>\n <button class=\"edit\" (click)=\"onEdit(picture)\"><i class=\"far fa-crop-alt\"></i><span>{{ 'ImgManager.ImgCard.edit' | translate }}</span></button>\n <button class=\"deleted\" (click)=\"activeConfirmDelete = true;\"><i class=\"fal fa-times\"></i><span>{{ 'ImgManager.ImgCard.del' | translate }}</span></button>\n <button class=\"selected\" (click)=\"onToggleImgSelected()\" *ngIf=\"stateDisplayed !== 'window'\">\n <i *ngIf=\"!picture.selected\" class=\"fal fa-square\"></i>\n <i *ngIf=\"picture.selected\" class=\"fas fa-check-square checked\"></i>\n <span>{{ 'ImgManager.ImgCard.select' | translate }}</span>\n </button>\n </div>\n <div class=\"img-card__container__delete\" [ngClass]=\"{ 'show' : activeConfirmDelete}\">\n <span>{{ 'ImgManager.ImgCard.confirmDeleteImg' | translate }}</span>\n <div>\n <button (click)=\"activeConfirmDelete = false;\">{{ 'no' | translate }}</button>\n <button (click)=\"onRemoveImg(picture);activeConfirmDelete = false;\">{{ 'yes' | translate }}</button>\n </div>\n </div>\n <div class=\"img-card__container__valid\" *ngIf=\"stateDisplayed === 'small' && tabDisplayed == 'img-upload'\">\n <i class=\"far fa-check\"></i>\n <span>{{ 'ImgManager.ImgCard.validImgSmall' | translate }}</span>\n </div>\n <div\n *ngIf=\"picture.imgNotLoaded\"\n class=\"img-card__container__overlay\"\n [ngClass]=\"{'img-card__container__overlay--smallDisplay': stateDisplayed === 'small' || isUploadSection}\">\n <i (click)=\"onToggleImgSelected()\" class=\"fad fa-folder-times\"></i>\n </div>\n <span btnLoadingAnim class=\"btnLoadingAnnimation\" *ngIf=\"picture.deleted\"></span>\n\n </div>\n <div\n class=\"img-card__nameContainer\"\n [ngClass]=\"{'smallNameDisplay': stateDisplayed === 'small' || isUploadSection, 'focus': focusInput}\">\n <input\n type=\"text\"\n class=\"wzImgMngInput img-card__nameContainer__name\"\n [(ngModel)]=\"picture.display_name\"\n (ngModelChange)=\"onNameChange(picture.id_file)\"\n (focus)=\"previousName=picture.display_name;focusInput = true;\"\n (blur)=\"focusInput = false;\"\n >\n <span>{{picture.display_name}}</span>\n </div>\n\n </div>\n</div>\n",
|
|
1633
1633
|
animations: [
|
|
1634
1634
|
easeInOut
|
|
1635
1635
|
]
|
|
@@ -1748,12 +1748,11 @@ ImgEditorComponent = __decorate([
|
|
|
1748
1748
|
], ImgEditorComponent);
|
|
1749
1749
|
|
|
1750
1750
|
let CanvaBtnComponent = class CanvaBtnComponent {
|
|
1751
|
-
constructor(canvaService, imgManager, wzImgEventService, translateService,
|
|
1751
|
+
constructor(canvaService, imgManager, wzImgEventService, translateService, alertService, renderer) {
|
|
1752
1752
|
this.canvaService = canvaService;
|
|
1753
1753
|
this.imgManager = imgManager;
|
|
1754
1754
|
this.wzImgEventService = wzImgEventService;
|
|
1755
1755
|
this.translateService = translateService;
|
|
1756
|
-
this.imgSelectionService = imgSelectionService;
|
|
1757
1756
|
this.alertService = alertService;
|
|
1758
1757
|
this.renderer = renderer;
|
|
1759
1758
|
this.showImgUploaded = new EventEmitter();
|
|
@@ -1789,12 +1788,10 @@ let CanvaBtnComponent = class CanvaBtnComponent {
|
|
|
1789
1788
|
if (mediaDTO) {
|
|
1790
1789
|
this.expectedWidth = parseInt(mediaDTO.image_width, 10);
|
|
1791
1790
|
this.expectedHeight = parseInt(mediaDTO.image_height, 10);
|
|
1792
|
-
this.imgExpectedByWiziblock = true;
|
|
1793
1791
|
}
|
|
1794
1792
|
else {
|
|
1795
1793
|
this.expectedWidth = undefined;
|
|
1796
1794
|
this.expectedHeight = undefined;
|
|
1797
|
-
this.imgExpectedByWiziblock = false;
|
|
1798
1795
|
}
|
|
1799
1796
|
});
|
|
1800
1797
|
this.subs.push(subExpectedImgSizesChange);
|
|
@@ -1834,11 +1831,6 @@ let CanvaBtnComponent = class CanvaBtnComponent {
|
|
|
1834
1831
|
const subUploadImg = this.imgManager.uploadFileByUrl(exportUrl, designTitle).subscribe((img) => {
|
|
1835
1832
|
this.imgLoading = false;
|
|
1836
1833
|
this.removeOverflowBody();
|
|
1837
|
-
// Close the img manager and display the img create in the wiziblock
|
|
1838
|
-
if (this.imgExpectedByWiziblock) {
|
|
1839
|
-
this.imgSelectionService.addImgSelected(img);
|
|
1840
|
-
return;
|
|
1841
|
-
}
|
|
1842
1834
|
this.wzImgEventService.emitImgAdded(img.id_file);
|
|
1843
1835
|
this.alertService.openAlert(this.successUploadPhoto);
|
|
1844
1836
|
}, error => {
|
|
@@ -1868,7 +1860,6 @@ CanvaBtnComponent.ctorParameters = () => [
|
|
|
1868
1860
|
{ type: ImgManagerService },
|
|
1869
1861
|
{ type: ImgEventService },
|
|
1870
1862
|
{ type: TranslateService },
|
|
1871
|
-
{ type: ImgSelectionService },
|
|
1872
1863
|
{ type: AlertService },
|
|
1873
1864
|
{ type: Renderer2 }
|
|
1874
1865
|
];
|
|
@@ -1889,7 +1880,6 @@ CanvaBtnComponent = __decorate([
|
|
|
1889
1880
|
ImgManagerService,
|
|
1890
1881
|
ImgEventService,
|
|
1891
1882
|
TranslateService,
|
|
1892
|
-
ImgSelectionService,
|
|
1893
1883
|
AlertService,
|
|
1894
1884
|
Renderer2])
|
|
1895
1885
|
], CanvaBtnComponent);
|
|
@@ -1945,7 +1935,7 @@ __decorate([
|
|
|
1945
1935
|
ImgSelectionComponent = __decorate([
|
|
1946
1936
|
Component({
|
|
1947
1937
|
selector: 'img-selection',
|
|
1948
|
-
template: "<div\n class=\"trash\"\n [ngClass]=\"{'trash--visible': dragStart}\"\n cdkDropList\n #unSelectList=\"cdkDropList\"\n (cdkDropListDropped)=\"removeImgFromSelection($event)\">\n\n <i class=\"far fa-trash\"></i>\n <p>{{'ImgManager.ImgSelection.unselect' | translate}}</p>\n</div>\n\n<div\n class=\"img-selection\"\n [ngClass]=\"{'img-selection--visible' : imgSelectedList && imgSelectedList.length}\">\n\n <div\n cdkDropList\n #selectionList=\"cdkDropList\"\n cdkDropListOrientation=\"horizontal\"\n class=\"list_img_selection\"\n (cdkDropListDropped)=\"drop($event)\"\n [cdkDropListConnectedTo]=\"[unSelectList]\"\n >\n\n <div\n class=\"img_box\"\n *ngFor=\"let picture of imgSelectedList; let index = index\"\n cdkDrag\n (cdkDragStarted)=\"dragStart = true;\"\n (cdkDragEnded)=\"dragStart = false;\"\n >\n\n <img\n class=\"drag__img\"\n [src]=\"picture.file_name | imgSrc : '
|
|
1938
|
+
template: "<div\n class=\"trash\"\n [ngClass]=\"{'trash--visible': dragStart}\"\n cdkDropList\n #unSelectList=\"cdkDropList\"\n (cdkDropListDropped)=\"removeImgFromSelection($event)\">\n\n <i class=\"far fa-trash\"></i>\n <p>{{'ImgManager.ImgSelection.unselect' | translate}}</p>\n</div>\n\n<div\n class=\"img-selection\"\n [ngClass]=\"{'img-selection--visible' : imgSelectedList && imgSelectedList.length}\">\n\n <div\n cdkDropList\n #selectionList=\"cdkDropList\"\n cdkDropListOrientation=\"horizontal\"\n class=\"list_img_selection\"\n (cdkDropListDropped)=\"drop($event)\"\n [cdkDropListConnectedTo]=\"[unSelectList]\"\n >\n\n <div\n class=\"img_box\"\n *ngFor=\"let picture of imgSelectedList; let index = index\"\n cdkDrag\n (cdkDragStarted)=\"dragStart = true;\"\n (cdkDragEnded)=\"dragStart = false;\"\n >\n\n <img\n *ngIf=\"index < 1\"\n class=\"drag__img\"\n [src]=\"picture.file_name | imgSrc : '400'\"\n [title]=\"picture.display_name\"\n />\n\n <img\n *ngIf=\"index > 0\"\n class=\"drag__img\"\n [src]=\"picture.file_name | imgSrc : '200'\"\n [title]=\"picture.display_name\"\n />\n\n </div>\n </div>\n</div>\n\n<!-- Loader -->\n<ng-container *ngIf=\"isLoading && !(imgSelectedList && imgSelectedList.length)\">\n <wz-loader></wz-loader>\n</ng-container>\n"
|
|
1949
1939
|
}),
|
|
1950
1940
|
__metadata("design:paramtypes", [ImgSelectionService])
|
|
1951
1941
|
], ImgSelectionComponent);
|
|
@@ -2871,7 +2861,7 @@ __decorate([
|
|
|
2871
2861
|
ImagesViewComponent = __decorate([
|
|
2872
2862
|
Component({
|
|
2873
2863
|
selector: 'images-view',
|
|
2874
|
-
template: "<div class=\"images-view\" [ngClass]=\"{'fullSize': fullSize, 'small': stateDisplayed === 'small'}\" [@easeInOut]=\"'in'\">\n <!-- Subheader : Img number and actions btn (sup img list, switch forma display) -->\n <div\n *ngIf=\"(stateDisplayed !== 'small' || tabDisplayed === 'img-upload')\"\n class=\"images-view__container\"\n [ngClass]=\"{'images-view__container--uploadTab': tabDisplayed === 'img-upload', 'images-view__container--window': stateDisplayed === 'window'}\"\n >\n\n <div *ngIf=\"tabDisplayed !== 'img-upload'\">\n <p class=\"mainColor\">{{ 'ImgManager.ImgLib.nbImg' | translate }} : {{length}}</p>\n </div>\n <div *ngIf=\"tabDisplayed === 'img-upload'\">\n <p class=\"mainColor\">{{ 'ImgManager.ImgLib.lastImgs' | translate }}</p>\n </div>\n\n <div class=\"field has-addons subHeaderActions\" *ngIf=\"tabDisplayed !== 'img-upload'\">\n\n <!-- For listforma : Display btn del multiple img & Confirm action -->\n <div class=\"images-view__container__boxAction\">\n\n\n <!-- S\u00E9lectionner -->\n <button\n class=\"button success images-view__container__boxAction__import\"\n @insertRemoveAnnim\n *ngIf=\"listDisplayed && nbImgToDelSelected && !confirmImgSup && !delListImgLoader && multipleImgMode\"\n (click)=\"selectImgChosen()\"\n >\n <i class=\"fal fa-check\"></i>\n {{ 'ImgManager.ImgLib.select' | translate }} ({{nbImgToDelSelected}})\n </button>\n\n <!-- Display btn del multiple img -->\n <button\n *ngIf=\"listDisplayed && nbImgToDelSelected && !confirmImgSup\"\n (click)=\"displayConfirmImgSup()\"\n class=\"button images-view__container__boxAction__delBtn danger\"\n @insertRemoveAnnim\n >\n <i class=\"fal fa-times\"></i>{{ 'ImgManager.ImgLib.delMlt' | translate }} ({{nbImgToDelSelected}})\n <span btnLoadingAnim *ngIf=\"delListImgLoader\" class=\"btnLoadingAnnimation\"></span>\n </button>\n\n <!-- Confirm action -->\n <div\n class=\"images-view__container__boxAction__confirmSup\"\n [ngClass]=\"{'images-view__container__boxAction__confirmSup--visible': confirmImgSup}\">\n <p class=\"images-view__container__boxAction__confirmSup__text\">{{ 'ImgManager.ImgLib.confirmSupQuestion' | translate:{nbImage: nbImgToDelSelected} }}</p>\n <div>\n <button\n class=\"button images-view__container__boxAction__confirmSup__cancel\"\n (click)=\"cancelSup()\"\n >\n {{ 'ImgManager.ImgLib.cancel' | translate }}\n </button>\n <button\n (click)=\"removeListImg()\"\n class=\"button images-view__container__delBtn danger\"\n >\n {{ 'ImgManager.ImgLib.confirm' | translate }}\n </button>\n </div>\n </div>\n\n </div>\n\n\n <!-- Swith mosaic/list forma -->\n <div class=\"field has-addons images-view__container__buttonBox\">\n <p class=\"control\">\n <button\n class=\"button is-lighted images-view__container__buttonBox__btn\"\n [ngClass]=\"{'actifDisplayed': !listDisplayed}\"\n (click)=\"onSwitchFormatDisplayed(false)\"\n >\n <span class=\"icon is-small\">\n <i class=\"far fa-th\"></i>\n </span>\n </button>\n </p>\n\n <p class=\"control\">\n <button class=\"button is-lighted images-view__container__buttonBox__btn\"\n [ngClass]=\"{'actifDisplayed': listDisplayed}\"\n (click)=\"onSwitchFormatDisplayed(true)\"\n >\n <span class=\"icon is-small\">\n <i class=\"fas fa-bars\"></i>\n </span>\n </button>\n </p>\n </div>\n </div>\n </div>\n</div>\n\n\n <!-- Images section -->\n<ng-scrollbar\n #scrollable\n [visibility]=\"'native'\"\n class=\"images-view__scroll\"\n [ngClass]=\"{\n 'images-view__scroll--hide--mosaic': displayPexelsResults && !listDisplayed,\n 'images-view__scroll--hide--mosaic--small': displayPexelsResults && !listDisplayed && stateDisplayed === 'small',\n 'images-view__scroll--hide--table': displayPexelsResults && listDisplayed,\n 'images-view__scroll--full': stateDisplayed === 'full',\n 'images-view__scroll--smallDisplay' : stateDisplayed === 'small' && tabDisplayed !== 'img-upload',\n 'images-view__scroll--smallUploadDisplay' : stateDisplayed === 'small' && tabDisplayed === 'img-upload',\n 'images-view__scroll--window': stateDisplayed === 'window'\n}\"\n>\n <div #imgLibContainer class=\"images-view__wrapper\">\n <div *ngIf=\"!listDisplayed || stateDisplayed === 'small'\" [@easeInOut]=\"'in'\">\n <mosaic-view\n [picturesList]=\"picturesList\"\n (picturesListChange)=\"onPicturesListChange()\"\n [tableFilters]=\"tableFilters\"\n (filtersChange)=\"onFiltersChange()\"\n [(disable)]=\"disable\"\n (pictureNameChange)=\"onRenamePicture($event)\"\n [nbFakeImg]=\"nbFakeImg\"\n [stateDisplayed]=\"stateDisplayed\"\n [tabDisplayed]=\"tabDisplayed\"\n [displayPexelsResults]=\"displayPexelsResults\"\n [isLoading]=\"isLoading\"\n [fullSize]=\"fullSize\"\n >\n </mosaic-view>\n </div>\n\n <div *ngIf=\"listDisplayed && stateDisplayed !== 'small'\" [@easeInOut]=\"'in'\">\n <table-view\n [picturesList]=\"picturesList\"\n (picturesListChange)=\"onPicturesListChange()\"\n [tableFilters]=\"tableFilters\"\n (filtersChange)=\"onFiltersChange()\"\n [(disable)]=\"disable\"\n (pictureNameChange)=\"onRenamePicture($event)\"\n [displayPexelsResults]=\"displayPexelsResults\"\n [stateDisplayed]=\"stateDisplayed\"\n [isLoading]=\"isLoading\"\n >\n </table-view>\n </div>\n\n </div>\n</ng-scrollbar>\n\n<!-- Pexels Section - When no img found -->\n<div\n *ngIf=\"displayPexelsResults\"\n class=\"images-view--pexels\"\n [@easeInOut]=\"'in'\">\n <pexels-lib\n [searchValue]=\"tableFilters.searchValue\"\n (showImgUploaded)=\"onShowImgUploaded()\"\n [disableSearch]=\"true\"\n >\n </pexels-lib>\n</div>\n",
|
|
2864
|
+
template: "<div class=\"images-view\" [ngClass]=\"{'fullSize': fullSize, 'small': stateDisplayed === 'small'}\" [@easeInOut]=\"'in'\">\n <!-- Subheader : Img number and actions btn (sup img list, switch forma display) -->\n <div\n *ngIf=\"(stateDisplayed !== 'small' || tabDisplayed === 'img-upload')\"\n class=\"images-view__container\"\n [ngClass]=\"{'images-view__container--uploadTab': tabDisplayed === 'img-upload', 'images-view__container--window': stateDisplayed === 'window'}\"\n >\n\n <div *ngIf=\"tabDisplayed !== 'img-upload'\">\n <p class=\"mainColor\">{{ 'ImgManager.ImgLib.nbImg' | translate }} : {{length}}</p>\n </div>\n <div *ngIf=\"tabDisplayed === 'img-upload'\">\n <p class=\"mainColor\">{{ 'ImgManager.ImgLib.lastImgs' | translate }}</p>\n </div>\n\n <div class=\"field has-addons subHeaderActions\" *ngIf=\"tabDisplayed !== 'img-upload'\">\n\n <!-- For listforma : Display btn del multiple img & Confirm action -->\n <div class=\"images-view__container__boxAction\">\n\n\n <!-- S\u00E9lectionner -->\n <button\n class=\"button success images-view__container__boxAction__import\"\n @insertRemoveAnnim\n *ngIf=\"listDisplayed && nbImgToDelSelected && !confirmImgSup && !delListImgLoader && multipleImgMode\"\n (click)=\"selectImgChosen()\"\n >\n <i class=\"fal fa-check\"></i>\n {{ 'ImgManager.ImgLib.select' | translate }} ({{nbImgToDelSelected}})\n </button>\n\n <!-- Display btn del multiple img -->\n <button\n *ngIf=\"listDisplayed && nbImgToDelSelected && !confirmImgSup\"\n (click)=\"displayConfirmImgSup()\"\n class=\"button images-view__container__boxAction__delBtn danger\"\n @insertRemoveAnnim\n >\n <i class=\"fal fa-times\"></i>{{ 'ImgManager.ImgLib.delMlt' | translate }} ({{nbImgToDelSelected}})\n <span btnLoadingAnim *ngIf=\"delListImgLoader\" class=\"btnLoadingAnnimation\"></span>\n </button>\n\n <!-- Confirm action -->\n <div\n class=\"images-view__container__boxAction__confirmSup\"\n [ngClass]=\"{'images-view__container__boxAction__confirmSup--visible': confirmImgSup}\">\n <p *ngIf=\"nbImgToDelSelected > 1\" class=\"images-view__container__boxAction__confirmSup__text\">{{ 'ImgManager.ImgLib.confirmSupQuestions' | translate:{nbImage: nbImgToDelSelected} }}</p>\n <p *ngIf=\"nbImgToDelSelected === 1\" class=\"images-view__container__boxAction__confirmSup__text\">{{ 'ImgManager.ImgLib.confirmSupQuestion' | translate:{nbImage: nbImgToDelSelected} }}</p>\n <div>\n <button\n class=\"button images-view__container__boxAction__confirmSup__cancel\"\n (click)=\"cancelSup()\"\n >\n {{ 'ImgManager.ImgLib.cancel' | translate }}\n </button>\n <button\n (click)=\"removeListImg()\"\n class=\"button images-view__container__delBtn danger\"\n >\n {{ 'ImgManager.ImgLib.confirm' | translate }}\n </button>\n </div>\n </div>\n\n </div>\n\n\n <!-- Swith mosaic/list forma -->\n <div class=\"field has-addons images-view__container__buttonBox\">\n <p class=\"control\">\n <button\n class=\"button is-lighted images-view__container__buttonBox__btn\"\n [ngClass]=\"{'actifDisplayed': !listDisplayed}\"\n (click)=\"onSwitchFormatDisplayed(false)\"\n >\n <span class=\"icon is-small\">\n <i class=\"far fa-th\"></i>\n </span>\n </button>\n </p>\n\n <p class=\"control\">\n <button class=\"button is-lighted images-view__container__buttonBox__btn\"\n [ngClass]=\"{'actifDisplayed': listDisplayed}\"\n (click)=\"onSwitchFormatDisplayed(true)\"\n >\n <span class=\"icon is-small\">\n <i class=\"fas fa-bars\"></i>\n </span>\n </button>\n </p>\n </div>\n </div>\n </div>\n</div>\n\n\n <!-- Images section -->\n<ng-scrollbar\n #scrollable\n [visibility]=\"'native'\"\n class=\"images-view__scroll\"\n [ngClass]=\"{\n 'images-view__scroll--hide--mosaic': displayPexelsResults && !listDisplayed,\n 'images-view__scroll--hide--mosaic--small': displayPexelsResults && !listDisplayed && stateDisplayed === 'small',\n 'images-view__scroll--hide--table': displayPexelsResults && listDisplayed,\n 'images-view__scroll--full': stateDisplayed === 'full',\n 'images-view__scroll--smallDisplay' : stateDisplayed === 'small' && tabDisplayed !== 'img-upload',\n 'images-view__scroll--smallUploadDisplay' : stateDisplayed === 'small' && tabDisplayed === 'img-upload',\n 'images-view__scroll--window': stateDisplayed === 'window'\n}\"\n>\n <div #imgLibContainer class=\"images-view__wrapper\">\n <div *ngIf=\"!listDisplayed || stateDisplayed === 'small'\" [@easeInOut]=\"'in'\">\n <mosaic-view\n [picturesList]=\"picturesList\"\n (picturesListChange)=\"onPicturesListChange()\"\n [tableFilters]=\"tableFilters\"\n (filtersChange)=\"onFiltersChange()\"\n [(disable)]=\"disable\"\n (pictureNameChange)=\"onRenamePicture($event)\"\n [nbFakeImg]=\"nbFakeImg\"\n [stateDisplayed]=\"stateDisplayed\"\n [tabDisplayed]=\"tabDisplayed\"\n [displayPexelsResults]=\"displayPexelsResults\"\n [isLoading]=\"isLoading\"\n [fullSize]=\"fullSize\"\n >\n </mosaic-view>\n </div>\n\n <div *ngIf=\"listDisplayed && stateDisplayed !== 'small'\" [@easeInOut]=\"'in'\">\n <table-view\n [picturesList]=\"picturesList\"\n (picturesListChange)=\"onPicturesListChange()\"\n [tableFilters]=\"tableFilters\"\n (filtersChange)=\"onFiltersChange()\"\n [(disable)]=\"disable\"\n (pictureNameChange)=\"onRenamePicture($event)\"\n [displayPexelsResults]=\"displayPexelsResults\"\n [stateDisplayed]=\"stateDisplayed\"\n [isLoading]=\"isLoading\"\n >\n </table-view>\n </div>\n\n </div>\n</ng-scrollbar>\n\n<!-- Pexels Section - When no img found -->\n<div\n *ngIf=\"displayPexelsResults\"\n class=\"images-view--pexels\"\n [@easeInOut]=\"'in'\">\n <pexels-lib\n [searchValue]=\"tableFilters.searchValue\"\n (showImgUploaded)=\"onShowImgUploaded()\"\n [disableSearch]=\"true\"\n >\n </pexels-lib>\n</div>\n",
|
|
2875
2865
|
animations: [
|
|
2876
2866
|
easeInOut,
|
|
2877
2867
|
insertRemove
|