@wizishop/img-manager 0.2.101 → 0.2.104
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/fr.json +1 -1
- package/bundles/wizishop-img-manager.umd.js +5 -5
- 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 -2
- package/esm2015/lib/components/images-view/images-view.component.js +2 -2
- package/esm2015/lib/components/img-editor/img-editor.component.js +2 -2
- package/esm2015/lib/components/pexels-lib/pexels-lib.component.js +2 -2
- package/esm2015/lib/components/upload-list/upload-list.component.js +2 -2
- package/esm5/lib/components/canva-btn/canva-btn.component.js +2 -2
- package/esm5/lib/components/images-view/images-view.component.js +2 -2
- package/esm5/lib/components/img-editor/img-editor.component.js +2 -2
- package/esm5/lib/components/pexels-lib/pexels-lib.component.js +2 -2
- package/esm5/lib/components/upload-list/upload-list.component.js +2 -2
- package/fesm2015/wizishop-img-manager.js +5 -5
- package/fesm2015/wizishop-img-manager.js.map +1 -1
- package/fesm5/wizishop-img-manager.js +5 -5
- package/fesm5/wizishop-img-manager.js.map +1 -1
- package/package.json +1 -1
- package/wizishop-img-manager-0.2.104.tgz +0 -0
- package/wizishop-img-manager.metadata.json +1 -1
- package/wz-img-manager.scss +70 -64
- package/wizishop-img-manager-0.2.101.tgz +0 -0
|
@@ -1218,7 +1218,7 @@ var UploadListComponent = /** @class */ (function () {
|
|
|
1218
1218
|
UploadListComponent = __decorate([
|
|
1219
1219
|
Component({
|
|
1220
1220
|
selector: 'upload-list',
|
|
1221
|
-
template: "<div class=\"upload-list\" [ngClass]=\"{'smallDisplay': stateDisplayed === 'small'}\" [@easeInOut]=\"'in'\">\n\n <
|
|
1221
|
+
template: "<div class=\"upload-list\" [ngClass]=\"{'smallDisplay': stateDisplayed === 'small'}\" [@easeInOut]=\"'in'\">\n\n <perfect-scrollbar\n #scrollable\n [config]=\"{ suppressScrollX: true }\"\n class=\"upload-list__scroll\"\n [ngClass]=\"{\n 'upload-list__scroll--smallDisplay': stateDisplayed === 'small',\n 'upload-list__scroll--window': stateDisplayed === 'window'}\"\n >\n <div class=\"upload-list__box\">\n <div class=\"upload-list__box__container\">\n <div>\n <p class=\"mainColor\">\n {{ picturesList? picturesList.length : '' }}\n <ng-container *ngIf=\"picturesList && picturesList.length > 1\">{{ 'ImgManager.UploadList.imgSuccessImport' | translate }}</ng-container>\n <ng-container *ngIf=\"picturesList && picturesList.length === 1\">{{ 'ImgManager.UploadList.imgSuccessImportOne' | translate }}</ng-container>\n </p>\n <div class=\"dropdown is-hoverable\">\n <div class=\"dropdown-trigger\">\n <i\n aria-haspopup=\"true\" aria-controls=\"dropdown-menuInfoSeo\"\n class=\"fas fa-info-circle\">\n </i>\n </div>\n <div class=\"dropdown-menu dropDownShadow\" id=\"dropdown-menuInfoSeo\" role=\"menu\">\n <div class=\"dropdown-content\">\n <div class=\"dropdown-item\">\n <p>{{ 'ImgManager.UploadList.seo.rezise' | translate }}</p>\n <p><i class=\"fal fa-check\"></i> 100%</p>\n </div>\n <div class=\"dropdown-item\">\n <p>{{ 'ImgManager.UploadList.seo.webp' | translate }}</p>\n <p><i class=\"fal fa-check\"></i> 100%</p>\n </div>\n <div class=\"dropdown-item\">\n <p>{{ 'ImgManager.UploadList.seo.cdn' | translate }}</p>\n <p><i class=\"fal fa-check\"></i> 100%</p>\n </div>\n <div class=\"dropdown-item\">\n <p>{{ 'ImgManager.UploadList.seo.lazyloading' | translate }}</p>\n <p><i class=\"fal fa-check\"></i> 100%</p>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n\n <div class=\"upload-list__box__cards\">\n <div class=\"upload-list__box__cards__card\" *ngFor=\"let picture of picturesList; let index = index;\">\n <img-card\n [picture]=\"picture\"\n [stateDisplayed]=\"stateDisplayed\"\n (toggleImgSelected)=\"onToggleSelectImg(index)\"\n (switchDisplayWindow)=\"switchDisplayWindowCard()\"\n (pictureNameChange)=\"onRenamePicture($event)\"\n ></img-card>\n <div class=\"upload-list__box__cards__card__btnBox\">\n <button class=\"button success upload-list__box__cards__card__btnBox__btn\"><i class=\"fal fa-check\"></i></button>\n </div>\n </div>\n </div>\n </div>\n </perfect-scrollbar>\n</div>\n",
|
|
1222
1222
|
animations: [
|
|
1223
1223
|
easeInOut
|
|
1224
1224
|
]
|
|
@@ -1687,7 +1687,7 @@ var PexelLibComponent = /** @class */ (function () {
|
|
|
1687
1687
|
PexelLibComponent = __decorate([
|
|
1688
1688
|
Component({
|
|
1689
1689
|
selector: 'pexels-lib',
|
|
1690
|
-
template: "<div class=\"pexels-lib\" #outerElement [@easeInOut]=\"'in'\">\n <
|
|
1690
|
+
template: "<div class=\"pexels-lib\" #outerElement [@easeInOut]=\"'in'\">\n <perfect-scrollbar\n scrollYMarginOffset=\"300\"\n class=\"pexels-lib__scroll\"\n [ngClass]=\"{'pexels-lib__scroll--smallDisplay': stateDisplayed === 'small'}\"\n (psYReachEnd)=\"onBottomReached()\"\n >\n <div\n *ngIf=\"!disableSearch\"\n class=\"pexels-lib__search\"\n [ngClass]=\"{'pexels-lib__search--smallDisplay': stateDisplayed === 'small'}\"\n >\n <wz-input-search\n [(ngModel)]=\"searchValue\"\n [placeholder]=\"'ImgManager.SearchBar.placeholder' | translate\"\n (changeDebounced)=\"onSearchNameChanged()\"\n [smallPadding]=\"stateDisplayed === 'small'\">\n </wz-input-search>\n </div>\n\n <div *ngIf=\"!initComponent\" class=\"pexels-lib__wrapper\">\n <p *ngIf=\"nbResult\" class=\"pexels-lib__wrapper__result-nb\">{{ 'ImgManager.PexelLib.nbImgFound' | translate }} : {{ nbResult }}</p>\n\n <div class=\"pexels-lib__wrapper__result\">\n\n <div *ngFor=\"let photosColumn of photosColumns; let indexCol = index;\" class=\"pexels-lib__wrapper__result__column\" [@listAnimation]=\"photosColumn.photos.length\">\n <div *ngFor=\"let photo of photosColumn.photos; let indexPhoto = index;\" class=\"pexels-lib__wrapper__result__column__element\">\n\n <img [alt]=\"photo.src.medium\" [src]=\"photo.src.medium\"\n class=\"pexels-lib__wrapper__result__column__element__img\"/>\n\n <div class=\"pexels-lib__wrapper__result__column__element__wrapper\">\n <span class=\"pexels-lib__wrapper__result__column__element__wrapper__infos\">\n {{ photo.width }} x {{ photo.height}}\n </span>\n\n <div class=\"dropdown is-up\" [ngClass]=\"{'is-hoverable': !photo.uploading}\">\n <div class=\"dropdown-trigger\">\n <button\n class=\"button pexels-lib__wrapper__result__column__element__wrapper__button\"\n aria-haspopup=\"true\"\n aria-controls=\"dropdown-menu\">\n\n <div *ngIf=\"!photo.uploading\" (click)=\"uploadPhoto(photo, photo.src.large2x)\">\n <span>{{ 'ImgManager.PexelLib.import' | translate }}</span>\n <span class=\"icon is-small\">\n <i class=\"fas fa-angle-up\" aria-hidden=\"true\"></i>\n </span>\n <ng-container *ngIf=\"photo.uploaded\">\n <i class=\"fal fa-check\"></i>\n </ng-container>\n </div>\n\n <ng-container *ngIf=\"photo.uploading\">\n {{ 'ImgManager.PexelLib.importation' | translate }}\n <span btnLoadingAnim class=\"btnLoadingAnnimation\"></span>\n </ng-container>\n\n </button>\n </div>\n <div class=\"dropdown-menu pexels-lib__wrapper__result__column__element__wrapper__dropdown\" id=\"dropdown-menu\" role=\"menu\">\n <div class=\"dropdown-content\">\n <div class=\"dropdown-content__wrapper\">\n <div class=\"dropdown-item\" (click)=\"uploadPhoto(photo, photo.src.portrait)\">\n <p>{{ 'ImgManager.PexelLib.portrait' | translate }}</p>\n <i class=\"fal fa-check iPortrait\"></i>\n </div>\n <div class=\"dropdown-item\" (click)=\"uploadPhoto(photo, photo.src.landscape)\">\n <p>{{ 'ImgManager.PexelLib.landscape' | translate }}</p>\n <i class=\"fal fa-check iLandscape\"></i>\n </div>\n <div class=\"dropdown-item\" (click)=\"uploadPhoto(photo, photo.src.large2x)\">\n <p>{{ 'ImgManager.PexelLib.original' | translate }}</p>\n <i class=\"fal fa-check iOriginal\"></i>\n </div>\n </div>\n </div>\n </div>\n </div>\n </div>\n\n </div>\n </div>\n </div>\n </div>\n <ng-container *ngIf=\"isLoading\">\n <wz-loader></wz-loader>\n </ng-container>\n <div\n *ngIf=\"!isLoading && !nbResult\"\n class=\"pexels-lib__alert\"\n [@easeInOut]=\"'in'\">\n <wz-alert [warning]=\"true\">\n {{ 'ImgManager.PexelLib.noResult' | translate }}\n </wz-alert>\n </div>\n\n </perfect-scrollbar>\n</div>\n",
|
|
1691
1691
|
animations: [
|
|
1692
1692
|
easeInOut,
|
|
1693
1693
|
listAnnimation
|
|
@@ -2046,7 +2046,7 @@ var ImgEditorComponent = /** @class */ (function () {
|
|
|
2046
2046
|
ImgEditorComponent = __decorate([
|
|
2047
2047
|
Component({
|
|
2048
2048
|
selector: 'img-editor',
|
|
2049
|
-
template: "<div class=\"img-editor\" [@easeInOut]=\"'in'\">\n\n <
|
|
2049
|
+
template: "<div class=\"img-editor\" [@easeInOut]=\"'in'\">\n\n <perfect-scrollbar\n class=\"img-editor__scroll\"\n [ngClass]=\"{\n 'img-editor__scroll--full': stateDisplayed === 'full',\n 'img-editor__scroll--smallDisplay': stateDisplayed === 'small',\n 'img-editor__scroll--window': stateDisplayed === 'window'\n }\"\n >\n <div class=\"columns\">\n <!-- Left section -->\n <div class=\"column is-one-third img-editor__infoSection\">\n\n <info-section\n [imgToEdit]=\"imgToEdit\"\n [(isNameModified)]=\"isNameModified\"\n >\n </info-section>\n\n <!-- Button Action Section -->\n\n <div class=\"img-editor__infoSection__actions\">\n <div>\n <button\n class=\"button img-editor__infoSection__actions__cancel\"\n (click)=\"onCancel()\"\n [disabled]=\"isLoading || (!isImgModified && !isNameModified)\"\n >\n {{ 'ImgManager.ImgLib.cancel' | translate }}\n </button>\n <div\n class=\"button danger button img-editor__infoSection__actions__save\"\n [ngClass]=\"{'img-editor__infoSection__actions__save--disable': isLoading}\"\n (click)=\"onSave()\"\n >\n {{ 'ImgManager.ImgEditor.saveBtn' | translate }}\n <span btnLoadingAnim *ngIf=\"isLoading\" class=\"btnLoadingAnnimation\"></span>\n </div>\n\n </div>\n </div>\n </div>\n\n\n <!-- Right section -->\n <div class=\"column img-editor__container\">\n <cropper\n [imgToEdit]=\"imgToEdit\"\n [(isImgModified)]=\"isImgModified\"\n (currentCroppedImageChange)=\"onImgCropped($event)\"\n (editClosed)=\"onEditClosed($event)\">\n </cropper>\n </div>\n </div>\n </perfect-scrollbar>\n</div>\n",
|
|
2050
2050
|
animations: [
|
|
2051
2051
|
easeInOut
|
|
2052
2052
|
]
|
|
@@ -2117,7 +2117,7 @@ var CanvaBtnComponent = /** @class */ (function () {
|
|
|
2117
2117
|
CanvaBtnComponent = __decorate([
|
|
2118
2118
|
Component({
|
|
2119
2119
|
selector: 'canva-btn',
|
|
2120
|
-
template: "<div class=\"canva dropdown is-right is-hoverable\"\n wzAutoHide (clickOutside)=\"openDropDownMenu = false;\"\n [ngClass]=\"{'is-up': stateDisplayed === 'small', 'noTooltip': stateDisplayed !== 'small'}\"\n >\n <div class=\"dropdown-trigger\">\n <div\n class=\"button canva-btn\"\n aria-controls=\"dropdown-menuCanva\"\n (click)=\"openDropDownMenu = true;\"\n >\n <span>{{'ImgManager.CanvaBtn.createImg' | translate}}</span>\n <img [src]=\"canvaLogoRouteAssets\" class=\"canva-btn__logo\">\n\n <span btnLoadingAnim class=\"btnLoadingAnnimation\" *ngIf=\"imgLoading\"></span>\n </div>\n </div>\n <div\n class=\"dropdown-menu dropDownShadow\"\n [ngClass]=\"{'displayDropDownMenu': openDropDownMenu }\"\n id=\"dropdown-menuCanva\"\n role=\"menu\">\n <
|
|
2120
|
+
template: "<div class=\"canva dropdown is-right is-hoverable\"\n wzAutoHide (clickOutside)=\"openDropDownMenu = false;\"\n [ngClass]=\"{'is-up': stateDisplayed === 'small', 'noTooltip': stateDisplayed !== 'small'}\"\n >\n <div class=\"dropdown-trigger\">\n <div\n class=\"button canva-btn\"\n aria-controls=\"dropdown-menuCanva\"\n (click)=\"openDropDownMenu = true;\"\n >\n <span>{{'ImgManager.CanvaBtn.createImg' | translate}}</span>\n <img [src]=\"canvaLogoRouteAssets\" class=\"canva-btn__logo\">\n\n <span btnLoadingAnim class=\"btnLoadingAnnimation\" *ngIf=\"imgLoading\"></span>\n </div>\n </div>\n <div\n class=\"dropdown-menu dropDownShadow\"\n [ngClass]=\"{'displayDropDownMenu': openDropDownMenu }\"\n id=\"dropdown-menuCanva\"\n role=\"menu\">\n <perfect-scrollbar\n class=\"smallScroll\"\n >\n <div class=\"dropdown-content\">\n <div class=\"dropdownTitle\">\n <p>{{'ImgManager.CanvaBtn.createImg.title' | translate}}</p>\n </div>\n\n <div class=\"infoItem\">\n <p>{{'ImgManager.CanvaBtn.info' | translate}}</p>\n </div>\n\n <ng-container >\n <div\n *ngIf=\"expectedWidth && expectedHeight\"\n class=\"dropdown-item-wrapper\"\n >\n <div class=\"dropdown-item expectedSizes\" (click)=\"onOpenCanva(expectedWidth, expectedHeight)\">\n <p>{{'ImgManager.CanvaBtn.recommanded' | translate}}</p><p>{{expectedWidth}}*{{expectedHeight}}</p>\n </div>\n </div>\n </ng-container>\n\n <div\n *ngFor=\"let format of availableFormat| keyvalue\"\n class=\"dropdown-item-wrapper\">\n <div\n (click)=\"onOpenCanva(format.value.width, format.value.height)\"\n class=\"dropdown-item\">\n <p>{{format.key | translate}}</p><p>{{format.value.width}}*{{format.value.height}}</p>\n </div>\n </div>\n </div>\n </perfect-scrollbar>\n </div>\n</div>\n"
|
|
2121
2121
|
}),
|
|
2122
2122
|
__metadata("design:paramtypes", [CanvaService])
|
|
2123
2123
|
], CanvaBtnComponent);
|
|
@@ -3195,7 +3195,7 @@ var ImagesViewComponent = /** @class */ (function () {
|
|
|
3195
3195
|
ImagesViewComponent = __decorate([
|
|
3196
3196
|
Component({
|
|
3197
3197
|
selector: 'images-view',
|
|
3198
|
-
template: "<div class=\"images-view\" [ngClass]=\"{'fullSize': fullSize, 'small': stateDisplayed === 'small'}\" [@easeInOut]=\"'in'\">\n <!-- Subheader : Img number and actions btn (sup img list, switch forma display) -->\n <div\n *ngIf=\"(stateDisplayed !== 'small' || tabDisplayed === 'img-upload')\"\n class=\"images-view__container\"\n [ngClass]=\"{'images-view__container--uploadTab': tabDisplayed === 'img-upload', 'images-view__container--window': stateDisplayed === 'window'}\"\n >\n\n <div *ngIf=\"tabDisplayed !== 'img-upload'\">\n <p class=\"mainColor\">{{ 'ImgManager.ImgLib.nbImg' | translate }} : {{length}}</p>\n </div>\n <div *ngIf=\"tabDisplayed === 'img-upload'\">\n <p class=\"mainColor\">{{ 'ImgManager.ImgLib.lastImgs' | translate }}</p>\n </div>\n\n <div class=\"field has-addons subHeaderActions\" *ngIf=\"tabDisplayed !== 'img-upload'\">\n\n <!-- For listforma : Display btn del multiple img & Confirm action -->\n <div class=\"images-view__container__boxAction\">\n\n\n <!-- S\u00E9lectionner -->\n <button\n class=\"button success images-view__container__boxAction__import\"\n @insertRemoveAnnim\n *ngIf=\"listDisplayed && nbImgToDelSelected && !confirmImgSup && !delListImgLoader && multipleImgMode\"\n (click)=\"selectImgChosen()\"\n >\n <i class=\"fal fa-check\"></i>\n {{ 'ImgManager.ImgLib.select' | translate }} ({{nbImgToDelSelected}})\n </button>\n\n <!-- Display btn del multiple img -->\n <button\n *ngIf=\"listDisplayed && nbImgToDelSelected && !confirmImgSup\"\n (click)=\"displayConfirmImgSup()\"\n class=\"button images-view__container__boxAction__delBtn danger\"\n @insertRemoveAnnim\n >\n <i class=\"fal fa-times\"></i>{{ 'ImgManager.ImgLib.delMlt' | translate }} ({{nbImgToDelSelected}})\n <span btnLoadingAnim *ngIf=\"delListImgLoader\" class=\"btnLoadingAnnimation\"></span>\n </button>\n\n <!-- Confirm action -->\n <div\n class=\"images-view__container__boxAction__confirmSup\"\n [ngClass]=\"{'images-view__container__boxAction__confirmSup--visible': confirmImgSup}\">\n <p *ngIf=\"nbImgToDelSelected > 1\" class=\"images-view__container__boxAction__confirmSup__text\">{{ 'ImgManager.ImgLib.confirmSupQuestions' | translate:{nbImage: nbImgToDelSelected} }}</p>\n <p *ngIf=\"nbImgToDelSelected === 1\" class=\"images-view__container__boxAction__confirmSup__text\">{{ 'ImgManager.ImgLib.confirmSupQuestion' | translate:{nbImage: nbImgToDelSelected} }}</p>\n <div>\n <button\n class=\"button images-view__container__boxAction__confirmSup__cancel\"\n (click)=\"cancelSup()\"\n >\n {{ 'ImgManager.ImgLib.cancel' | translate }}\n </button>\n <button\n (click)=\"removeListImg()\"\n class=\"button images-view__container__delBtn danger\"\n >\n {{ 'ImgManager.ImgLib.confirm' | translate }}\n </button>\n </div>\n </div>\n\n </div>\n\n\n <!-- Swith mosaic/list forma -->\n <div class=\"field has-addons images-view__container__buttonBox\">\n <div class=\"control\">\n <div\n class=\"button is-lighted images-view__container__buttonBox__btn\"\n [ngClass]=\"{'actifDisplayed': !listDisplayed}\"\n (click)=\"onSwitchFormatDisplayed(false)\"\n >\n <span class=\"icon is-small\">\n <i class=\"far fa-th\"></i>\n </span>\n </div>\n </div>\n\n <div class=\"control\">\n <div class=\"button is-lighted images-view__container__buttonBox__btn\"\n [ngClass]=\"{'actifDisplayed': listDisplayed}\"\n (click)=\"onSwitchFormatDisplayed(true)\"\n >\n <span class=\"icon is-small\">\n <i class=\"fas fa-bars\"></i>\n </span>\n </div>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n <!-- Images section -->\n<
|
|
3198
|
+
template: "<div class=\"images-view\" [ngClass]=\"{'fullSize': fullSize, 'small': stateDisplayed === 'small'}\" [@easeInOut]=\"'in'\">\n <!-- Subheader : Img number and actions btn (sup img list, switch forma display) -->\n <div\n *ngIf=\"(stateDisplayed !== 'small' || tabDisplayed === 'img-upload')\"\n class=\"images-view__container\"\n [ngClass]=\"{'images-view__container--uploadTab': tabDisplayed === 'img-upload', 'images-view__container--window': stateDisplayed === 'window'}\"\n >\n\n <div *ngIf=\"tabDisplayed !== 'img-upload'\">\n <p class=\"mainColor\">{{ 'ImgManager.ImgLib.nbImg' | translate }} : {{length}}</p>\n </div>\n <div *ngIf=\"tabDisplayed === 'img-upload'\">\n <p class=\"mainColor\">{{ 'ImgManager.ImgLib.lastImgs' | translate }}</p>\n </div>\n\n <div class=\"field has-addons subHeaderActions\" *ngIf=\"tabDisplayed !== 'img-upload'\">\n\n <!-- For listforma : Display btn del multiple img & Confirm action -->\n <div class=\"images-view__container__boxAction\">\n\n\n <!-- S\u00E9lectionner -->\n <button\n class=\"button success images-view__container__boxAction__import\"\n @insertRemoveAnnim\n *ngIf=\"listDisplayed && nbImgToDelSelected && !confirmImgSup && !delListImgLoader && multipleImgMode\"\n (click)=\"selectImgChosen()\"\n >\n <i class=\"fal fa-check\"></i>\n {{ 'ImgManager.ImgLib.select' | translate }} ({{nbImgToDelSelected}})\n </button>\n\n <!-- Display btn del multiple img -->\n <button\n *ngIf=\"listDisplayed && nbImgToDelSelected && !confirmImgSup\"\n (click)=\"displayConfirmImgSup()\"\n class=\"button images-view__container__boxAction__delBtn danger\"\n @insertRemoveAnnim\n >\n <i class=\"fal fa-times\"></i>{{ 'ImgManager.ImgLib.delMlt' | translate }} ({{nbImgToDelSelected}})\n <span btnLoadingAnim *ngIf=\"delListImgLoader\" class=\"btnLoadingAnnimation\"></span>\n </button>\n\n <!-- Confirm action -->\n <div\n class=\"images-view__container__boxAction__confirmSup\"\n [ngClass]=\"{'images-view__container__boxAction__confirmSup--visible': confirmImgSup}\">\n <p *ngIf=\"nbImgToDelSelected > 1\" class=\"images-view__container__boxAction__confirmSup__text\">{{ 'ImgManager.ImgLib.confirmSupQuestions' | translate:{nbImage: nbImgToDelSelected} }}</p>\n <p *ngIf=\"nbImgToDelSelected === 1\" class=\"images-view__container__boxAction__confirmSup__text\">{{ 'ImgManager.ImgLib.confirmSupQuestion' | translate:{nbImage: nbImgToDelSelected} }}</p>\n <div>\n <button\n class=\"button images-view__container__boxAction__confirmSup__cancel\"\n (click)=\"cancelSup()\"\n >\n {{ 'ImgManager.ImgLib.cancel' | translate }}\n </button>\n <button\n (click)=\"removeListImg()\"\n class=\"button images-view__container__delBtn danger\"\n >\n {{ 'ImgManager.ImgLib.confirm' | translate }}\n </button>\n </div>\n </div>\n\n </div>\n\n\n <!-- Swith mosaic/list forma -->\n <div class=\"field has-addons images-view__container__buttonBox\">\n <div class=\"control\">\n <div\n class=\"button is-lighted images-view__container__buttonBox__btn\"\n [ngClass]=\"{'actifDisplayed': !listDisplayed}\"\n (click)=\"onSwitchFormatDisplayed(false)\"\n >\n <span class=\"icon is-small\">\n <i class=\"far fa-th\"></i>\n </span>\n </div>\n </div>\n\n <div class=\"control\">\n <div class=\"button is-lighted images-view__container__buttonBox__btn\"\n [ngClass]=\"{'actifDisplayed': listDisplayed}\"\n (click)=\"onSwitchFormatDisplayed(true)\"\n >\n <span class=\"icon is-small\">\n <i class=\"fas fa-bars\"></i>\n </span>\n </div>\n </div>\n </div>\n </div>\n </div>\n</div>\n\n\n <!-- Images section -->\n<perfect-scrollbar\n [config]=\"{ suppressScrollX: true }\"\n class=\"images-view__scroll\"\n [ngClass]=\"{\n 'images-view__scroll--hide--mosaic': displayPexelsResults && !listDisplayed,\n 'images-view__scroll--hide--mosaic--small': displayPexelsResults && !listDisplayed && stateDisplayed === 'small',\n 'images-view__scroll--hide--table': displayPexelsResults && listDisplayed,\n 'images-view__scroll--full': stateDisplayed === 'full',\n 'images-view__scroll--smallDisplay' : stateDisplayed === 'small' && tabDisplayed !== 'img-upload',\n 'images-view__scroll--smallUploadDisplay' : stateDisplayed === 'small' && tabDisplayed === 'img-upload',\n 'images-view__scroll--window': stateDisplayed === 'window'\n}\"\n>\n <div #imgLibContainer class=\"images-view__wrapper\">\n <div *ngIf=\"!listDisplayed || stateDisplayed === 'small'\" [@easeInOut]=\"'in'\">\n <mosaic-view\n [picturesList]=\"picturesList\"\n (picturesListChange)=\"onPicturesListChange()\"\n [tableFilters]=\"tableFilters\"\n (filtersChange)=\"onFiltersChange()\"\n [(disable)]=\"disable\"\n (pictureNameChange)=\"onRenamePicture($event)\"\n (switchDisplayWindow)=\"switchDisplayWindowMosaic()\"\n [nbFakeImg]=\"nbFakeImg\"\n [stateDisplayed]=\"stateDisplayed\"\n [tabDisplayed]=\"tabDisplayed\"\n [displayPexelsResults]=\"displayPexelsResults\"\n [isLoading]=\"isLoading\"\n [fullSize]=\"fullSize\"\n >\n </mosaic-view>\n </div>\n\n <div *ngIf=\"listDisplayed && stateDisplayed !== 'small'\" [@easeInOut]=\"'in'\">\n <table-view\n [picturesList]=\"picturesList\"\n (picturesListChange)=\"onPicturesListChange()\"\n [tableFilters]=\"tableFilters\"\n (filtersChange)=\"onFiltersChange()\"\n [(disable)]=\"disable\"\n (pictureNameChange)=\"onRenamePicture($event)\"\n [displayPexelsResults]=\"displayPexelsResults\"\n [stateDisplayed]=\"stateDisplayed\"\n [isLoading]=\"isLoading\"\n >\n </table-view>\n </div>\n\n </div>\n</perfect-scrollbar>\n\n<!-- Pexels Section - When no img found -->\n<div\n *ngIf=\"displayPexelsResults\"\n class=\"images-view--pexels\"\n [@easeInOut]=\"'in'\">\n <pexels-lib\n [searchValue]=\"tableFilters.searchValue\"\n (showImgUploaded)=\"onShowImgUploaded()\"\n [disableSearch]=\"true\"\n >\n </pexels-lib>\n</div>\n",
|
|
3199
3199
|
animations: [
|
|
3200
3200
|
easeInOut,
|
|
3201
3201
|
insertRemove
|