@wizishop/img-manager 15.2.63-beta → 15.2.63
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/esm2020/lib/components/images-view/images-actions-handler.mjs +2 -1
- package/esm2020/lib/components/images-view/images-view.component.mjs +12 -9
- package/esm2020/lib/components/images-view/table-view/table-view.component.mjs +3 -3
- package/esm2020/lib/components/img-editor/img-editor.component.mjs +3 -3
- package/esm2020/lib/components/img-editor/show-iframe/show-iframe.component.mjs +62 -11
- package/esm2020/lib/components/img-selection/img-selection.component.mjs +3 -3
- package/esm2020/lib/components/shared/table/table.component.mjs +2 -1
- package/esm2020/lib/dto/img-manager.dto.mjs +1 -1
- package/esm2020/lib/services/img-manager.service.mjs +4 -3
- package/esm2020/lib/services/table/filters-table.service.mjs +2 -1
- package/fesm2015/wizishop-img-manager.mjs +78 -22
- package/fesm2015/wizishop-img-manager.mjs.map +1 -1
- package/fesm2020/wizishop-img-manager.mjs +77 -21
- package/fesm2020/wizishop-img-manager.mjs.map +1 -1
- package/lib/components/images-view/images-view.component.d.ts +3 -2
- package/lib/components/img-editor/show-iframe/show-iframe.component.d.ts +2 -1
- package/lib/dto/img-manager.dto.d.ts +8 -0
- package/lib/services/img-manager.service.d.ts +8 -14
- package/lib/services/table/filters-table.service.d.ts +1 -0
- package/package.json +1 -1
- package/wizishop-img-manager-15.2.63.tgz +0 -0
- package/wz-img-manager.scss +124 -14
- package/wizishop-img-manager-15.2.63-beta.tgz +0 -0
|
@@ -10,6 +10,7 @@ export class FiltersTableService {
|
|
|
10
10
|
this.dataTableFilters = {
|
|
11
11
|
sort: undefined,
|
|
12
12
|
order: undefined,
|
|
13
|
+
type: '',
|
|
13
14
|
searchValue: undefined,
|
|
14
15
|
totalItems: 0,
|
|
15
16
|
itemsPerPage: 0,
|
|
@@ -57,4 +58,4 @@ FiltersTableService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0",
|
|
|
57
58
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: FiltersTableService, decorators: [{
|
|
58
59
|
type: Injectable
|
|
59
60
|
}], ctorParameters: function () { return [{ type: i1.NwbFilterRoutingBuilder }]; } });
|
|
60
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
61
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZmlsdGVycy10YWJsZS5zZXJ2aWNlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvd3otaW1nLW1hbmFnZXIvc3JjL2xpYi9zZXJ2aWNlcy90YWJsZS9maWx0ZXJzLXRhYmxlLnNlcnZpY2UudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFVBQVUsRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUMzQyxPQUFPLEVBQWtCLHVCQUF1QixFQUFFLE1BQU0seUJBQXlCLENBQUM7QUFDbEYsT0FBTyxFQUFFLE9BQU8sRUFBRSxNQUFNLE1BQU0sQ0FBQzs7O0FBVy9CLE1BQU0sT0FBTyxtQkFBbUI7SUFjOUIsWUFBb0Isb0JBQTZDO1FBQTdDLHlCQUFvQixHQUFwQixvQkFBb0IsQ0FBeUI7UUFiakUsaUJBQVksR0FBRyxJQUFJLEdBQUcsRUFBMEIsQ0FBQztRQUNqRCxxQkFBZ0IsR0FBaUI7WUFDL0IsSUFBSSxFQUFFLFNBQVM7WUFDZixLQUFLLEVBQUUsU0FBUztZQUNoQixJQUFJLEVBQUUsRUFBRTtZQUNSLFdBQVcsRUFBRSxTQUFTO1lBQ3RCLFVBQVUsRUFBRSxDQUFDO1lBQ2IsWUFBWSxFQUFFLENBQUM7WUFDZixXQUFXLEVBQUUsQ0FBQztTQUNmLENBQUM7UUFFTSxnQkFBVyxHQUFpQixJQUFJLE9BQU8sRUFBTyxDQUFDO0lBRWEsQ0FBQztJQUVyRSxtQkFBbUIsQ0FBQyxhQUFxQjtRQUN2QyxJQUFJLElBQUksQ0FBQyxZQUFZLENBQUMsR0FBRyxDQUFDLGFBQWEsQ0FBQyxFQUFFO1lBQ3hDLE9BQU8sSUFBSSxDQUFDLFlBQVksQ0FBQyxHQUFHLENBQUMsYUFBYSxDQUFDLENBQUM7U0FDN0M7UUFDRCxNQUFNLFdBQVcsR0FBbUIsSUFBSSxDQUFDLG9CQUFvQixDQUFDLEtBQUssQ0FBQyxJQUFJLENBQUMsZ0JBQWdCLEVBQUUsYUFBYSxDQUFDLENBQUM7UUFDMUcsSUFBSSxDQUFDLFlBQVksQ0FBQyxHQUFHLENBQUMsYUFBYSxFQUFFLFdBQVcsQ0FBQyxDQUFDO1FBQ2xELE9BQU8sV0FBVyxDQUFDO0lBQ3JCLENBQUM7SUFFRDs7Ozs7T0FLRztJQUNILGNBQWMsQ0FBQyxhQUFxQixFQUFFLFFBQWdCLEVBQUUsS0FBYztRQUNwRSxJQUFJLENBQUMsV0FBVyxDQUFDLElBQUksQ0FBQyxFQUFFLGFBQWEsRUFBRSxRQUFRLEVBQUUsS0FBSyxFQUFFLENBQUMsQ0FBQztJQUM1RCxDQUFDO0lBRUQsb0JBQW9CO1FBQ2xCLE9BQU8sSUFBSSxDQUFDLFdBQVcsQ0FBQyxZQUFZLEVBQUUsQ0FBQztJQUN6QyxDQUFDO0lBRUQsb0JBQW9CLENBQUMsYUFBcUIsRUFBRSxVQUFrQixFQUFFLFlBQW9CLEVBQUUsV0FBbUI7UUFDdkcsTUFBTSxXQUFXLEdBQUcsSUFBSSxDQUFDLG1CQUFtQixDQUFDLGFBQWEsQ0FBQyxDQUFDO1FBQzVELFdBQVcsQ0FBQyxTQUFTLENBQUM7WUFDcEIsWUFBWTtZQUNaLFdBQVc7U0FDWixDQUFDLENBQUM7SUFDTCxDQUFDO0lBRUQscUNBQXFDLENBQUMsYUFBcUIsRUFBRSxZQUFvQixFQUFFLFdBQW1CO1FBQ3BHLE1BQU0sV0FBVyxHQUFHLElBQUksQ0FBQyxtQkFBbUIsQ0FBQyxhQUFhLENBQUMsQ0FBQztRQUM1RCxXQUFXLENBQUMsU0FBUyxDQUFDO1lBQ3BCLFlBQVksRUFBRSxXQUFXLENBQUMsR0FBRyxDQUFDLGNBQWMsQ0FBQyxDQUFDLENBQUMsQ0FBQyxRQUFRLENBQUMsV0FBVyxDQUFDLEdBQUcsQ0FBQyxjQUFjLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQyxZQUFZO1lBQ3hHLFdBQVcsRUFBRSxXQUFXLENBQUMsR0FBRyxDQUFDLGFBQWEsQ0FBQyxDQUFDLENBQUMsQ0FBQyxRQUFRLENBQUMsV0FBVyxDQUFDLEdBQUcsQ0FBQyxhQUFhLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQyxXQUFXO1NBQ3JHLENBQUMsQ0FBQztJQUNMLENBQUM7O2dIQXJEVSxtQkFBbUI7b0hBQW5CLG1CQUFtQjsyRkFBbkIsbUJBQW1CO2tCQUQvQixVQUFVIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgSW5qZWN0YWJsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQgeyBOd2JGaWx0ZXJHcm91cCwgTndiRmlsdGVyUm91dGluZ0J1aWxkZXIgfSBmcm9tICdAd2l6aXNob3Avbmctd2l6aS1idWxtYSc7XHJcbmltcG9ydCB7IFN1YmplY3QgfSBmcm9tICdyeGpzJztcclxuaW1wb3J0IHsgUGFnaW5hdGlvbkZpbHRlcnMgfSBmcm9tICcuLi8uLi9jb21wb25lbnRzL3NoYXJlZC9wYWdpbmF0aW9uL3BhZ2luYXRpb24uY29tcG9uZW50JztcclxuXHJcbmV4cG9ydCBpbnRlcmZhY2UgVGFibGVGaWx0ZXJzIGV4dGVuZHMgUGFnaW5hdGlvbkZpbHRlcnMge1xyXG4gIHNvcnQ6IHN0cmluZztcclxuICBvcmRlcjogYm9vbGVhbjtcclxuICB0eXBlOiBzdHJpbmc7XHJcbiAgc2VhcmNoVmFsdWU6IHN0cmluZztcclxufVxyXG5cclxuQEluamVjdGFibGUoKVxyXG5leHBvcnQgY2xhc3MgRmlsdGVyc1RhYmxlU2VydmljZSB7XHJcbiAgZmlsdGVyR3JvdXBzID0gbmV3IE1hcDxzdHJpbmcsIE53YkZpbHRlckdyb3VwPigpO1xyXG4gIGRhdGFUYWJsZUZpbHRlcnM6IFRhYmxlRmlsdGVycyA9IHtcclxuICAgIHNvcnQ6IHVuZGVmaW5lZCxcclxuICAgIG9yZGVyOiB1bmRlZmluZWQsXHJcbiAgICB0eXBlOiAnJyxcclxuICAgIHNlYXJjaFZhbHVlOiB1bmRlZmluZWQsXHJcbiAgICB0b3RhbEl0ZW1zOiAwLFxyXG4gICAgaXRlbXNQZXJQYWdlOiAwLFxyXG4gICAgY3VycmVudFBhZ2U6IDBcclxuICB9O1xyXG5cclxuICBwcml2YXRlIHNvcnRTdWJqZWN0OiBTdWJqZWN0PGFueT4gPSBuZXcgU3ViamVjdDxhbnk+KCk7XHJcblxyXG4gIGNvbnN0cnVjdG9yKHByaXZhdGUgZmlsdGVyUm91dGluZ0J1aWxkZXI6IE53YkZpbHRlclJvdXRpbmdCdWlsZGVyKSB7fVxyXG5cclxuICBnZXRUYWJsZUZpbHRlckdyb3VwKGRhdGFUYWJsZU5hbWU6IHN0cmluZykge1xyXG4gICAgaWYgKHRoaXMuZmlsdGVyR3JvdXBzLmhhcyhkYXRhVGFibGVOYW1lKSkge1xyXG4gICAgICByZXR1cm4gdGhpcy5maWx0ZXJHcm91cHMuZ2V0KGRhdGFUYWJsZU5hbWUpO1xyXG4gICAgfVxyXG4gICAgY29uc3QgZmlsdGVyR3JvdXA6IE53YkZpbHRlckdyb3VwID0gdGhpcy5maWx0ZXJSb3V0aW5nQnVpbGRlci5ncm91cCh0aGlzLmRhdGFUYWJsZUZpbHRlcnMsIGRhdGFUYWJsZU5hbWUpO1xyXG4gICAgdGhpcy5maWx0ZXJHcm91cHMuc2V0KGRhdGFUYWJsZU5hbWUsIGZpbHRlckdyb3VwKTtcclxuICAgIHJldHVybiBmaWx0ZXJHcm91cDtcclxuICB9XHJcblxyXG4gIC8qKlxyXG4gICAqIFVzZSB0byByZXNldCB0aGUgb3RoZXJzIHNvcnRzIG9mIHRoZSB0YWJsZVxyXG4gICAqIEBwYXJhbSBkYXRhVGFibGVOYW1lXHJcbiAgICogQHBhcmFtIHNvcnROYW1lXHJcbiAgICogQHBhcmFtIG9yZGVyXHJcbiAgICovXHJcbiAgZW1pdFNvcnRDaGFuZ2UoZGF0YVRhYmxlTmFtZTogc3RyaW5nLCBzb3J0TmFtZTogc3RyaW5nLCBvcmRlcjogYm9vbGVhbikge1xyXG4gICAgdGhpcy5zb3J0U3ViamVjdC5uZXh0KHsgZGF0YVRhYmxlTmFtZSwgc29ydE5hbWUsIG9yZGVyIH0pO1xyXG4gIH1cclxuXHJcbiAgZ2V0U29ydENoYW5nZUxpc3RuZXIoKSB7XHJcbiAgICByZXR1cm4gdGhpcy5zb3J0U3ViamVjdC5hc09ic2VydmFibGUoKTtcclxuICB9XHJcblxyXG4gIHNldFBhZ2luYXRpb25GaWx0ZXJzKGRhdGFUYWJsZU5hbWU6IHN0cmluZywgdG90YWxJdGVtczogbnVtYmVyLCBpdGVtc1BlclBhZ2U6IG51bWJlciwgY3VycmVudFBhZ2U6IG51bWJlcikge1xyXG4gICAgY29uc3QgZmlsdGVyR3JvdXAgPSB0aGlzLmdldFRhYmxlRmlsdGVyR3JvdXAoZGF0YVRhYmxlTmFtZSk7XHJcbiAgICBmaWx0ZXJHcm91cC5zZXRWYWx1ZXMoe1xyXG4gICAgICBpdGVtc1BlclBhZ2UsXHJcbiAgICAgIGN1cnJlbnRQYWdlXHJcbiAgICB9KTtcclxuICB9XHJcblxyXG4gIHNldEluaXRpYWxQYWdpbmF0aW9uRmlsdGVyc0lmTm90RXhpc3QoZGF0YVRhYmxlTmFtZTogc3RyaW5nLCBpdGVtc1BlclBhZ2U6IG51bWJlciwgY3VycmVudFBhZ2U6IG51bWJlcikge1xyXG4gICAgY29uc3QgZmlsdGVyR3JvdXAgPSB0aGlzLmdldFRhYmxlRmlsdGVyR3JvdXAoZGF0YVRhYmxlTmFtZSk7XHJcbiAgICBmaWx0ZXJHcm91cC5zZXRWYWx1ZXMoe1xyXG4gICAgICBpdGVtc1BlclBhZ2U6IGZpbHRlckdyb3VwLmdldCgnaXRlbXNQZXJQYWdlJykgPyBwYXJzZUludChmaWx0ZXJHcm91cC5nZXQoJ2l0ZW1zUGVyUGFnZScpKSA6IGl0ZW1zUGVyUGFnZSxcclxuICAgICAgY3VycmVudFBhZ2U6IGZpbHRlckdyb3VwLmdldCgnY3VycmVudFBhZ2UnKSA/IHBhcnNlSW50KGZpbHRlckdyb3VwLmdldCgnY3VycmVudFBhZ2UnKSkgOiBjdXJyZW50UGFnZVxyXG4gICAgfSk7XHJcbiAgfVxyXG59XHJcbiJdfQ==
|
|
@@ -1086,11 +1086,12 @@ class ImgManagerService {
|
|
|
1086
1086
|
imageList: this.apiService.getShopImgList(params).pipe(take$1(1)),
|
|
1087
1087
|
imageTotal: this.apiService.getShopTotalImgList(params).pipe(take$1(1))
|
|
1088
1088
|
})), tap(() => this.isLoading$.next(false)));
|
|
1089
|
-
this.imageList$ = merge(this.fetchImagesList$, this.resetImageList$.pipe(tap(() => this.isLoading$.next(true)), tap(() => this.searchImagesParameters$.next(this.DEFAULT_SEARCH_PARAMS)), map$1(() => this.DEFAULT_DATA_LIST))).pipe(startWith(this.DEFAULT_DATA_LIST), shareReplay(1));
|
|
1089
|
+
this.imageList$ = merge(this.fetchImagesList$, this.resetImageList$.pipe(tap(() => this.isLoading$.next(true)), tap(() => this.searchImagesParameters$.next(this.DEFAULT_SEARCH_PARAMS)), map$1(() => this.DEFAULT_DATA_LIST))).pipe(startWith(this.DEFAULT_DATA_LIST), shareReplay({ bufferSize: 1, refCount: true }));
|
|
1090
1090
|
}
|
|
1091
1091
|
get DEFAULT_SEARCH_PARAMS() {
|
|
1092
1092
|
return {
|
|
1093
1093
|
limit: '30',
|
|
1094
|
+
type: '',
|
|
1094
1095
|
page: '1',
|
|
1095
1096
|
};
|
|
1096
1097
|
}
|
|
@@ -1154,7 +1155,7 @@ class ImgManagerService {
|
|
|
1154
1155
|
];
|
|
1155
1156
|
}
|
|
1156
1157
|
ngOnDestroy() {
|
|
1157
|
-
this.destroy$.next();
|
|
1158
|
+
this.destroy$.next(null);
|
|
1158
1159
|
this.destroy$.complete();
|
|
1159
1160
|
}
|
|
1160
1161
|
copyToClipboard(url) {
|
|
@@ -1311,6 +1312,7 @@ class ImagesActionHandler {
|
|
|
1311
1312
|
order: undefined,
|
|
1312
1313
|
searchValue: '',
|
|
1313
1314
|
totalItems: 0,
|
|
1315
|
+
type: '',
|
|
1314
1316
|
itemsPerPage: 30,
|
|
1315
1317
|
currentPage: 1
|
|
1316
1318
|
};
|
|
@@ -1803,26 +1805,78 @@ class EditorShowIframeComponent {
|
|
|
1803
1805
|
buildSafeIframeUrl(url) {
|
|
1804
1806
|
if (!url)
|
|
1805
1807
|
return null;
|
|
1806
|
-
if (
|
|
1807
|
-
const videoId = this.
|
|
1808
|
+
if (this.isYouTubeUrl(url)) {
|
|
1809
|
+
const { videoId, playlistId } = this.extractYouTubeIds(url);
|
|
1810
|
+
if (!videoId && playlistId) {
|
|
1811
|
+
const embed = `https://www.youtube.com/embed/videoseries?list=${encodeURIComponent(playlistId)}`;
|
|
1812
|
+
return this.sanitizer.bypassSecurityTrustResourceUrl(embed);
|
|
1813
|
+
}
|
|
1808
1814
|
if (!videoId)
|
|
1809
1815
|
return null;
|
|
1810
|
-
const
|
|
1816
|
+
const base = `https://www.youtube.com/embed/${encodeURIComponent(videoId)}`;
|
|
1817
|
+
const params = new URLSearchParams();
|
|
1818
|
+
params.set('playsinline', '1');
|
|
1819
|
+
if (playlistId)
|
|
1820
|
+
params.set('list', playlistId);
|
|
1821
|
+
const embed = params.toString() ? `${base}?${params.toString()}` : base;
|
|
1811
1822
|
return this.sanitizer.bypassSecurityTrustResourceUrl(embed);
|
|
1812
1823
|
}
|
|
1824
|
+
// --- Vimeo
|
|
1813
1825
|
if (url.includes('vimeo.com')) {
|
|
1814
1826
|
const videoId = this.extractVimeoId(url);
|
|
1815
1827
|
if (!videoId)
|
|
1816
1828
|
return null;
|
|
1817
|
-
const embed = `https://player.vimeo.com/video/${videoId}`;
|
|
1829
|
+
const embed = `https://player.vimeo.com/video/${encodeURIComponent(videoId)}`;
|
|
1818
1830
|
return this.sanitizer.bypassSecurityTrustResourceUrl(embed);
|
|
1819
1831
|
}
|
|
1820
1832
|
return null;
|
|
1821
1833
|
}
|
|
1822
|
-
|
|
1823
|
-
|
|
1824
|
-
|
|
1825
|
-
|
|
1834
|
+
isYouTubeUrl(url) {
|
|
1835
|
+
try {
|
|
1836
|
+
const u = new URL(url);
|
|
1837
|
+
return (u.hostname === 'youtu.be' ||
|
|
1838
|
+
u.hostname.endsWith('youtube.com') ||
|
|
1839
|
+
u.hostname.endsWith('youtube-nocookie.com'));
|
|
1840
|
+
}
|
|
1841
|
+
catch (_a) {
|
|
1842
|
+
return url.includes('youtube.com') || url.includes('youtu.be') || url.includes('youtube-nocookie.com');
|
|
1843
|
+
}
|
|
1844
|
+
}
|
|
1845
|
+
extractYouTubeIds(rawUrl) {
|
|
1846
|
+
var _a;
|
|
1847
|
+
try {
|
|
1848
|
+
const url = new URL(rawUrl);
|
|
1849
|
+
const host = url.hostname.toLowerCase();
|
|
1850
|
+
const playlistId = url.searchParams.get('list');
|
|
1851
|
+
if (host === 'youtu.be') {
|
|
1852
|
+
const id = (_a = url.pathname.split('/').filter(Boolean)[0]) !== null && _a !== void 0 ? _a : null;
|
|
1853
|
+
return { videoId: id, playlistId };
|
|
1854
|
+
}
|
|
1855
|
+
const v = url.searchParams.get('v');
|
|
1856
|
+
if (v)
|
|
1857
|
+
return { videoId: v, playlistId };
|
|
1858
|
+
const parts = url.pathname.split('/').filter(Boolean); // e.g. ["shorts","NquBrAU-iY8"]
|
|
1859
|
+
const idx = parts.findIndex(p => p === 'shorts' || p === 'embed');
|
|
1860
|
+
if (idx !== -1 && parts[idx + 1]) {
|
|
1861
|
+
return { videoId: parts[idx + 1], playlistId };
|
|
1862
|
+
}
|
|
1863
|
+
const liveIdx = parts.findIndex(p => p === 'live');
|
|
1864
|
+
if (liveIdx !== -1 && parts[liveIdx + 1]) {
|
|
1865
|
+
return { videoId: parts[liveIdx + 1], playlistId };
|
|
1866
|
+
}
|
|
1867
|
+
if (parts[0] === 'playlist' && playlistId) {
|
|
1868
|
+
return { videoId: null, playlistId };
|
|
1869
|
+
}
|
|
1870
|
+
return { videoId: null, playlistId };
|
|
1871
|
+
}
|
|
1872
|
+
catch (_b) {
|
|
1873
|
+
const playlistMatch = rawUrl.match(/[?&]list=([^&#]+)/);
|
|
1874
|
+
const playlistId = playlistMatch ? decodeURIComponent(playlistMatch[1]) : null;
|
|
1875
|
+
const regExp = /^.*(youtu\.be\/|v=|embed\/|shorts\/|live\/)([^#&?\/]+).*/;
|
|
1876
|
+
const match = rawUrl.match(regExp);
|
|
1877
|
+
const videoId = match && match[2] ? match[2] : null;
|
|
1878
|
+
return { videoId, playlistId };
|
|
1879
|
+
}
|
|
1826
1880
|
}
|
|
1827
1881
|
extractVimeoId(url) {
|
|
1828
1882
|
const regExp = /vimeo\.com\/(?:video\/)?(\d+)/;
|
|
@@ -1831,10 +1885,10 @@ class EditorShowIframeComponent {
|
|
|
1831
1885
|
}
|
|
1832
1886
|
}
|
|
1833
1887
|
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 });
|
|
1834
|
-
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 <
|
|
1888
|
+
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 <div class=\"video-container\">\r\n <iframe\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</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" }] });
|
|
1835
1889
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: EditorShowIframeComponent, decorators: [{
|
|
1836
1890
|
type: Component,
|
|
1837
|
-
args: [{ selector: 'show-iframe', template: "<div class=\"show-iframe\" *ngIf=\"safeUrl\">\r\n <
|
|
1891
|
+
args: [{ selector: 'show-iframe', template: "<div class=\"show-iframe\" *ngIf=\"safeUrl\">\r\n <div class=\"video-container\">\r\n <iframe\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</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" }]
|
|
1838
1892
|
}], ctorParameters: function () { return [{ type: i1$1.DomSanitizer }]; }, propDecorators: { videoLink: [{
|
|
1839
1893
|
type: Input
|
|
1840
1894
|
}] } });
|
|
@@ -2273,14 +2327,14 @@ class ImgEditorComponent {
|
|
|
2273
2327
|
}
|
|
2274
2328
|
}
|
|
2275
2329
|
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 });
|
|
2276
|
-
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 =
|
|
2330
|
+
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 = false;\">{{ 'ImgManager.ImgLib.informations' | translate }}</span></li>\r\n <li [ngClass]=\"{'active': isEditorLinkActive}\"><span (click)=\"isEditorLinkActive = true;\">{{ 'ImgManager.ImgLib.associateVideo' | translate }}</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: [
|
|
2277
2331
|
easeInOut
|
|
2278
2332
|
] });
|
|
2279
2333
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ImgEditorComponent, decorators: [{
|
|
2280
2334
|
type: Component,
|
|
2281
2335
|
args: [{ selector: 'img-editor', animations: [
|
|
2282
2336
|
easeInOut
|
|
2283
|
-
], 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 =
|
|
2337
|
+
], 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 = false;\">{{ 'ImgManager.ImgLib.informations' | translate }}</span></li>\r\n <li [ngClass]=\"{'active': isEditorLinkActive}\"><span (click)=\"isEditorLinkActive = true;\">{{ 'ImgManager.ImgLib.associateVideo' | translate }}</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" }]
|
|
2284
2338
|
}], ctorParameters: function () { return [{ type: ImgManagerService }, { type: RenamePictureService }]; }, propDecorators: { stateDisplayed: [{
|
|
2285
2339
|
type: Input
|
|
2286
2340
|
}], imgToEdit: [{
|
|
@@ -2673,6 +2727,7 @@ class FiltersTableService {
|
|
|
2673
2727
|
this.dataTableFilters = {
|
|
2674
2728
|
sort: undefined,
|
|
2675
2729
|
order: undefined,
|
|
2730
|
+
type: '',
|
|
2676
2731
|
searchValue: undefined,
|
|
2677
2732
|
totalItems: 0,
|
|
2678
2733
|
itemsPerPage: 0,
|
|
@@ -2836,6 +2891,7 @@ class TableComponent {
|
|
|
2836
2891
|
sort: this._filterGroup.get('sort'),
|
|
2837
2892
|
order: this._filterGroup.get('order'),
|
|
2838
2893
|
searchValue: this._filterGroup.get('searchValue'),
|
|
2894
|
+
type: this._filterGroup.get('type'),
|
|
2839
2895
|
itemsPerPage: this._filterGroup.get('itemsPerPage') ? parseInt(this._filterGroup.get('itemsPerPage')) : 0,
|
|
2840
2896
|
currentPage: this._filterGroup.get('currentPage') ? parseInt(this._filterGroup.get('currentPage')) : 0,
|
|
2841
2897
|
totalItems: this.tableFilters.totalItems
|
|
@@ -3275,14 +3331,14 @@ class TableViewComponent extends ImagesActionHandler {
|
|
|
3275
3331
|
}
|
|
3276
3332
|
}
|
|
3277
3333
|
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 });
|
|
3278
|
-
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
|
|
3334
|
+
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 *ngIf=\"picture.video_link\" class=\"table-view__row__container__imgContainer__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 <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> \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> \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> \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> \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> \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: [
|
|
3279
3335
|
listAnnimation
|
|
3280
3336
|
] });
|
|
3281
3337
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: TableViewComponent, decorators: [{
|
|
3282
3338
|
type: Component,
|
|
3283
3339
|
args: [{ selector: 'table-view', animations: [
|
|
3284
3340
|
listAnnimation
|
|
3285
|
-
], 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
|
|
3341
|
+
], 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 *ngIf=\"picture.video_link\" class=\"table-view__row__container__imgContainer__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 <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> \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> \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> \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> \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> \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" }]
|
|
3286
3342
|
}], ctorParameters: function () { return [{ type: ImgManagerService }, { type: ImgSelectionService }, { type: i3$1.HttpClient }, { type: ImgCDNService }, { type: ImgEventService }, { type: AlertService }, { type: i3.TranslateService }, { type: ApiService }]; } });
|
|
3287
3343
|
|
|
3288
3344
|
class ImagesViewComponent {
|
|
@@ -3409,6 +3465,7 @@ class ImagesViewComponent {
|
|
|
3409
3465
|
return {
|
|
3410
3466
|
sort: undefined,
|
|
3411
3467
|
order: undefined,
|
|
3468
|
+
type: searchImagesParameters.type,
|
|
3412
3469
|
searchValue: searchImagesParameters.search,
|
|
3413
3470
|
totalItems: imageTotal,
|
|
3414
3471
|
itemsPerPage: parseInt(searchImagesParameters.limit),
|
|
@@ -3541,7 +3598,7 @@ class ImagesViewComponent {
|
|
|
3541
3598
|
return total;
|
|
3542
3599
|
}
|
|
3543
3600
|
getParams(tableFilters) {
|
|
3544
|
-
return Object.assign({ limit: tableFilters.itemsPerPage.toString(), page: tableFilters.currentPage.toString() }, (tableFilters.searchValue && { search: tableFilters.searchValue.toString() }));
|
|
3601
|
+
return Object.assign({ limit: tableFilters.itemsPerPage.toString(), page: tableFilters.currentPage.toString(), type: tableFilters.type }, (tableFilters.searchValue && { search: tableFilters.searchValue.toString() }));
|
|
3545
3602
|
}
|
|
3546
3603
|
initVariables(loadingSuccess) {
|
|
3547
3604
|
this.nbImgToDelSelected = 0;
|
|
@@ -3592,7 +3649,7 @@ class ImagesViewComponent {
|
|
|
3592
3649
|
}
|
|
3593
3650
|
}
|
|
3594
3651
|
ImagesViewComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ImagesViewComponent, deps: [{ token: ImgManagerService }, { token: ImgEventService }, { token: ImgSelectionService }, { token: AlertService }, { token: UserSettingsService }, { token: RenamePictureService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
3595
|
-
ImagesViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: ImagesViewComponent, selector: "images-view", inputs: { stateDisplayed: "stateDisplayed", tabDisplayed: "tabDisplayed", fullSize: "fullSize", nbRowToShow: "nbRowToShow", listDisplayed: "listDisplayed", multipleImgMode: "multipleImgMode" }, outputs: { switchDisplayWindow: "switchDisplayWindow" }, viewQueries: [{ propertyName: "imgLibContainer", first: true, predicate: ["imgLibContainer"], descendants: true }], ngImport: i0, template: "<ng-container *ngIf=\"vm$ | async as vm\">\r\n\r\n <div class=\"images-view\" [ngClass]=\"{'fullSize': fullSize, 'small': stateDisplayed === 'small'}\" [@easeInOut]=\"'in'\">\r\n <!-- Subheader : Img number and actions btn (sup img list, switch forma display) -->\r\n <div\r\n *ngIf=\"(stateDisplayed !== 'small' || tabDisplayed === 'img-upload')\"\r\n class=\"images-view__container\"\r\n [ngClass]=\"{'images-view__container--uploadTab': tabDisplayed === 'img-upload', 'images-view__container--window': stateDisplayed === 'window'}\"\r\n >\r\n\r\n <div *ngIf=\"tabDisplayed !== 'img-upload'\">\r\n <p class=\"mainColor\" [ngClass]=\"{'images-view__container__total--hide': vm.displayPexelsResults}\">{{ 'ImgManager.ImgLib.nbImg' | translate }} : {{vm.imageTotal}}</p>\r\n </div>\r\n <div *ngIf=\"tabDisplayed === 'img-upload'\">\r\n <p class=\"mainColor\">{{ 'ImgManager.ImgLib.lastImgs' | translate }}</p>\r\n </div>\r\n\r\n <div class=\"field has-addons subHeaderActions\" *ngIf=\"tabDisplayed !== 'img-upload'\">\r\n\r\n <!-- For listforma : Display btn del multiple img & Confirm action -->\r\n <div class=\"images-view__container__boxAction\">\r\n\r\n\r\n <!-- Select -->\r\n <button\r\n class=\"button success images-view__container__boxAction__import\"\r\n @insertRemoveAnnim\r\n *ngIf=\"listDisplayed && nbImgToDelSelected && !confirmImgSup && !delListImgLoader && multipleImgMode\"\r\n (click)=\"selectImgChosen(vm.picturesList)\"\r\n type=\"button\"\r\n >\r\n <i class=\"fal fa-check\"></i>\r\n {{ 'ImgManager.ImgLib.select' | translate }} ({{nbImgToDelSelected}})\r\n </button>\r\n\r\n <!-- Display btn del multiple img -->\r\n <button\r\n *ngIf=\"listDisplayed && nbImgToDelSelected && !confirmImgSup\"\r\n (click)=\"displayConfirmImgSup()\"\r\n class=\"button images-view__container__boxAction__delBtn danger\"\r\n @insertRemoveAnnim\r\n type=\"button\"\r\n >\r\n <i class=\"fal fa-times\"></i>{{ 'ImgManager.ImgLib.delMlt' | translate }} ({{nbImgToDelSelected}})\r\n <span btnLoadingAnim *ngIf=\"delListImgLoader\" class=\"btnLoadingAnnimation\"></span>\r\n </button>\r\n\r\n <!-- Confirm action -->\r\n <div\r\n class=\"images-view__container__boxAction__confirmSup\"\r\n [ngClass]=\"{'images-view__container__boxAction__confirmSup--visible': confirmImgSup}\">\r\n <p *ngIf=\"nbImgToDelSelected > 1\" class=\"images-view__container__boxAction__confirmSup__text\">{{ 'ImgManager.ImgLib.confirmSupQuestions' | translate:{nbImage: nbImgToDelSelected} }}</p>\r\n <p *ngIf=\"nbImgToDelSelected === 1\" class=\"images-view__container__boxAction__confirmSup__text\">{{ 'ImgManager.ImgLib.confirmSupQuestion' | translate:{nbImage: nbImgToDelSelected} }}</p>\r\n <div>\r\n <button\r\n class=\"button images-view__container__boxAction__confirmSup__cancel\"\r\n (click)=\"cancelSup()\"\r\n type=\"button\"\r\n >\r\n {{ 'ImgManager.ImgLib.cancel' | translate }}\r\n </button>\r\n <button\r\n (click)=\"removeListImg(vm.picturesList)\"\r\n class=\"button images-view__container__delBtn danger\"\r\n type=\"button\"\r\n >\r\n {{ 'ImgManager.ImgLib.confirm' | translate }}\r\n </button>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n\r\n\r\n <!-- Swith mosaic/list forma -->\r\n <div class=\"field has-addons images-view__container__buttonBox\">\r\n <div class=\"control\">\r\n <div\r\n class=\"button is-lighted images-view__container__buttonBox__btn\"\r\n [ngClass]=\"{'actifDisplayed': !listDisplayed}\"\r\n (click)=\"onSwitchFormatDisplayed(false)\"\r\n >\r\n <span class=\"icon is-small\">\r\n <i class=\"fa-solid fa-th\"></i>\r\n </span>\r\n </div>\r\n </div>\r\n\r\n <div class=\"control\">\r\n <div class=\"button is-lighted images-view__container__buttonBox__btn\"\r\n [ngClass]=\"{'actifDisplayed': listDisplayed}\"\r\n (click)=\"onSwitchFormatDisplayed(true)\"\r\n >\r\n <span class=\"icon is-small\">\r\n <i class=\"fa-solid fa-bars\"></i>\r\n </span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n\r\n <!-- Images section -->\r\n <ng-scrollbar\r\n class=\"images-view__scroll\"\r\n [ngClass]=\"{\r\n 'images-view__scroll--hide--mosaic': vm.displayPexelsResults && !listDisplayed,\r\n 'images-view__scroll--hide--table': vm.displayPexelsResults && listDisplayed,\r\n 'images-view__scroll--full': stateDisplayed === 'full',\r\n 'images-view__scroll--smallDisplay' : stateDisplayed === 'small' && tabDisplayed !== 'img-upload',\r\n 'images-view__scroll--smallUploadDisplay' : stateDisplayed === 'small' && tabDisplayed === 'img-upload',\r\n 'images-view__scroll--window': stateDisplayed === 'window'\r\n }\"\r\n >\r\n <div #imgLibContainer class=\"images-view__wrapper\">\r\n\r\n <div *ngIf=\"!listDisplayed || stateDisplayed === 'small'\" [@easeInOut]=\"'in'\">\r\n <mosaic-view\r\n [picturesList]=\"vm.picturesList\"\r\n (picturesListChange)=\"onPicturesListChange(vm.picturesList)\"\r\n [tableFilters]=\"vm.tableFilters\"\r\n (filtersChange)=\"searchImagesParameters$.next(getParams(vm.tableFilters));\"\r\n [(disable)]=\"disable\"\r\n (pictureNameChange)=\"onRenamePicture($event)\"\r\n (switchDisplayWindow)=\"switchDisplayWindowMosaic()\"\r\n [nbFakeImg]=\"nbFakeImg\"\r\n [stateDisplayed]=\"stateDisplayed\"\r\n [tabDisplayed]=\"tabDisplayed\"\r\n [displayPexelsResults]=\"vm.displayPexelsResults\"\r\n [isLoading]=\"vm.isLoading\"\r\n [fullSize]=\"fullSize\"\r\n >\r\n </mosaic-view>\r\n </div>\r\n\r\n <div *ngIf=\"listDisplayed && stateDisplayed !== 'small'\" [@easeInOut]=\"'in'\">\r\n <table-view\r\n [picturesList]=\"vm.picturesList\"\r\n (picturesListChange)=\"onPicturesListChange(vm.picturesList)\"\r\n [tableFilters]=\"vm.tableFilters\"\r\n (filtersChange)=\"searchImagesParameters$.next(getParams(vm.tableFilters));\"\r\n [(disable)]=\"disable\"\r\n (pictureNameChange)=\"onRenamePicture($event)\"\r\n [displayPexelsResults]=\"vm.displayPexelsResults\"\r\n [stateDisplayed]=\"stateDisplayed\"\r\n [isLoading]=\"vm.isLoading\"\r\n >\r\n </table-view>\r\n </div>\r\n </div>\r\n </ng-scrollbar>\r\n\r\n <!-- Pexels Section - When no img found -->\r\n <div\r\n *ngIf=\"vm.displayPexelsResults\"\r\n class=\"images-view--pexels\"\r\n [@easeInOut]=\"'in'\">\r\n <pexels-lib\r\n [searchValue]=\"vm.tableFilters.searchValue\"\r\n [disableSearch]=\"true\"\r\n >\r\n </pexels-lib>\r\n </div>\r\n</ng-container>\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: PexelLibComponent, selector: "pexels-lib", inputs: ["stateDisplayed", "searchValue", "disableSearch"] }, { kind: "component", type: MosaicViewComponent, selector: "mosaic-view", inputs: ["tabDisplayed", "fullSize", "nbFakeImg"], outputs: ["switchDisplayWindow"] }, { kind: "component", type: TableViewComponent, selector: "table-view" }, { kind: "directive", type: LoadingDirective, selector: "[btnLoadingAnim]" }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], animations: [
|
|
3652
|
+
ImagesViewComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: ImagesViewComponent, selector: "images-view", inputs: { stateDisplayed: "stateDisplayed", tabDisplayed: "tabDisplayed", fullSize: "fullSize", nbRowToShow: "nbRowToShow", listDisplayed: "listDisplayed", multipleImgMode: "multipleImgMode" }, outputs: { switchDisplayWindow: "switchDisplayWindow" }, viewQueries: [{ propertyName: "imgLibContainer", first: true, predicate: ["imgLibContainer"], descendants: true }], ngImport: i0, template: "<ng-container *ngIf=\"vm$ | async as vm\">\r\n\r\n <div class=\"images-view\" [ngClass]=\"{'fullSize': fullSize, 'small': stateDisplayed === 'small'}\" [@easeInOut]=\"'in'\">\r\n <!-- Subheader : Img number and actions btn (sup img list, switch forma display) -->\r\n <div\r\n *ngIf=\"(stateDisplayed !== 'small' || tabDisplayed === 'img-upload')\"\r\n class=\"images-view__container\"\r\n [ngClass]=\"{'images-view__container--uploadTab': tabDisplayed === 'img-upload', 'images-view__container--window': stateDisplayed === 'window'}\"\r\n >\r\n\r\n <div *ngIf=\"tabDisplayed !== 'img-upload'\">\r\n <p class=\"mainColor\" [ngClass]=\"{'images-view__container__total--hide': vm.displayPexelsResults}\">{{ 'ImgManager.ImgLib.nbImg' | translate }} : {{vm.imageTotal}}</p>\r\n </div>\r\n <div *ngIf=\"tabDisplayed === 'img-upload'\">\r\n <p class=\"mainColor\">{{ 'ImgManager.ImgLib.lastImgs' | translate }}</p>\r\n </div>\r\n\r\n <div class=\"field has-addons subHeaderActions\" *ngIf=\"tabDisplayed !== 'img-upload'\">\r\n\r\n <!-- For listforma : Display btn del multiple img & Confirm action -->\r\n <div class=\"images-view__container__boxAction\">\r\n\r\n\r\n <!-- Select -->\r\n <button\r\n class=\"button success images-view__container__boxAction__import\"\r\n @insertRemoveAnnim\r\n *ngIf=\"listDisplayed && nbImgToDelSelected && !confirmImgSup && !delListImgLoader && multipleImgMode\"\r\n (click)=\"selectImgChosen(vm.picturesList)\"\r\n type=\"button\"\r\n >\r\n <i class=\"fal fa-check\"></i>\r\n {{ 'ImgManager.ImgLib.select' | translate }} ({{nbImgToDelSelected}})\r\n </button>\r\n\r\n <!-- Display btn del multiple img -->\r\n <button\r\n *ngIf=\"listDisplayed && nbImgToDelSelected && !confirmImgSup\"\r\n (click)=\"displayConfirmImgSup()\"\r\n class=\"button images-view__container__boxAction__delBtn danger\"\r\n @insertRemoveAnnim\r\n type=\"button\"\r\n >\r\n <i class=\"fal fa-times\"></i>{{ 'ImgManager.ImgLib.delMlt' | translate }} ({{nbImgToDelSelected}})\r\n <span btnLoadingAnim *ngIf=\"delListImgLoader\" class=\"btnLoadingAnnimation\"></span>\r\n </button>\r\n\r\n <!-- Confirm action -->\r\n <div\r\n class=\"images-view__container__boxAction__confirmSup\"\r\n [ngClass]=\"{'images-view__container__boxAction__confirmSup--visible': confirmImgSup}\">\r\n <p *ngIf=\"nbImgToDelSelected > 1\" class=\"images-view__container__boxAction__confirmSup__text\">{{ 'ImgManager.ImgLib.confirmSupQuestions' | translate:{nbImage: nbImgToDelSelected} }}</p>\r\n <p *ngIf=\"nbImgToDelSelected === 1\" class=\"images-view__container__boxAction__confirmSup__text\">{{ 'ImgManager.ImgLib.confirmSupQuestion' | translate:{nbImage: nbImgToDelSelected} }}</p>\r\n <div>\r\n <button\r\n class=\"button images-view__container__boxAction__confirmSup__cancel\"\r\n (click)=\"cancelSup()\"\r\n type=\"button\"\r\n >\r\n {{ 'ImgManager.ImgLib.cancel' | translate }}\r\n </button>\r\n <button\r\n (click)=\"removeListImg(vm.picturesList)\"\r\n class=\"button images-view__container__delBtn danger\"\r\n type=\"button\"\r\n >\r\n {{ 'ImgManager.ImgLib.confirm' | translate }}\r\n </button>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n\r\n\r\n <!-- Swith mosaic/list forma -->\r\n <div class=\"field has-addons images-view__container__buttonBox\">\r\n <div class=\"control\">\r\n <div\r\n class=\"button is-lighted images-view__container__buttonBox__btn\"\r\n [ngClass]=\"{'actifDisplayed': !listDisplayed}\"\r\n (click)=\"onSwitchFormatDisplayed(false)\"\r\n >\r\n <span class=\"icon is-small\">\r\n <i class=\"fa-solid fa-th\"></i>\r\n </span>\r\n </div>\r\n </div>\r\n\r\n <div class=\"control\">\r\n <div class=\"button is-lighted images-view__container__buttonBox__btn\"\r\n [ngClass]=\"{'actifDisplayed': listDisplayed}\"\r\n (click)=\"onSwitchFormatDisplayed(true)\"\r\n >\r\n <span class=\"icon is-small\">\r\n <i class=\"fa-solid fa-bars\"></i>\r\n </span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n\r\n <!-- Images section -->\r\n <ng-scrollbar\r\n class=\"images-view__scroll\"\r\n [ngClass]=\"{\r\n 'images-view__scroll--hide--mosaic': vm.displayPexelsResults && !listDisplayed,\r\n 'images-view__scroll--hide--table': vm.displayPexelsResults && listDisplayed,\r\n 'images-view__scroll--full': stateDisplayed === 'full',\r\n 'images-view__scroll--smallDisplay' : stateDisplayed === 'small' && tabDisplayed !== 'img-upload',\r\n 'images-view__scroll--smallUploadDisplay' : stateDisplayed === 'small' && tabDisplayed === 'img-upload',\r\n 'images-view__scroll--window': stateDisplayed === 'window'\r\n }\"\r\n >\r\n\r\n <div class=\"filter-video\" *ngIf=\"tabDisplayed !== 'img-upload'\">\r\n <label class=\"checkbox images-view__container__filterVideo\">\r\n <span>{{ 'ImgManager.ImgLib.filterVideo' | translate }}</span>\r\n <select [(ngModel)]=\"vm.tableFilters.type\" (ngModelChange)=\"searchImagesParameters$.next(getParams(vm.tableFilters));\">\r\n <option selected value=\"\">\r\n {{ 'ImgManager.ImgLib.allFiles' | translate }}\r\n </option>\r\n <option value=\"image\">\r\n {{ 'ImgManager.ImgLib.onlyImages' | translate }}\r\n </option>\r\n <option value=\"video\">\r\n {{ 'ImgManager.ImgLib.onlyVideos' | translate }}\r\n </option>\r\n </select>\r\n </label>\r\n </div>\r\n\r\n <div #imgLibContainer class=\"images-view__wrapper\">\r\n\r\n <div *ngIf=\"!listDisplayed || stateDisplayed === 'small'\" [@easeInOut]=\"'in'\">\r\n <mosaic-view\r\n [picturesList]=\"vm.picturesList\"\r\n (picturesListChange)=\"onPicturesListChange(vm.picturesList)\"\r\n [tableFilters]=\"vm.tableFilters\"\r\n (filtersChange)=\"searchImagesParameters$.next(getParams(vm.tableFilters));\"\r\n [(disable)]=\"disable\"\r\n (pictureNameChange)=\"onRenamePicture($event)\"\r\n (switchDisplayWindow)=\"switchDisplayWindowMosaic()\"\r\n [nbFakeImg]=\"nbFakeImg\"\r\n [stateDisplayed]=\"stateDisplayed\"\r\n [tabDisplayed]=\"tabDisplayed\"\r\n [displayPexelsResults]=\"vm.displayPexelsResults\"\r\n [isLoading]=\"vm.isLoading\"\r\n [fullSize]=\"fullSize\"\r\n >\r\n </mosaic-view>\r\n </div>\r\n\r\n <div *ngIf=\"listDisplayed && stateDisplayed !== 'small'\" [@easeInOut]=\"'in'\">\r\n <table-view\r\n [picturesList]=\"vm.picturesList\"\r\n (picturesListChange)=\"onPicturesListChange(vm.picturesList)\"\r\n [tableFilters]=\"vm.tableFilters\"\r\n (filtersChange)=\"searchImagesParameters$.next(getParams(vm.tableFilters));\"\r\n [(disable)]=\"disable\"\r\n (pictureNameChange)=\"onRenamePicture($event)\"\r\n [displayPexelsResults]=\"vm.displayPexelsResults\"\r\n [stateDisplayed]=\"stateDisplayed\"\r\n [isLoading]=\"vm.isLoading\"\r\n >\r\n </table-view>\r\n </div>\r\n </div>\r\n </ng-scrollbar>\r\n\r\n <!-- Pexels Section - When no img found -->\r\n <div\r\n *ngIf=\"vm.displayPexelsResults\"\r\n class=\"images-view--pexels\"\r\n [@easeInOut]=\"'in'\">\r\n <pexels-lib\r\n [searchValue]=\"vm.tableFilters.searchValue\"\r\n [disableSearch]=\"true\"\r\n >\r\n </pexels-lib>\r\n </div>\r\n</ng-container>\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.NgSelectOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$1.ɵNgSelectMultipleOption, selector: "option", inputs: ["ngValue", "value"] }, { kind: "directive", type: i2$1.SelectControlValueAccessor, selector: "select:not([multiple])[formControlName],select:not([multiple])[formControl],select:not([multiple])[ngModel]", inputs: ["compareWith"] }, { 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: 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: PexelLibComponent, selector: "pexels-lib", inputs: ["stateDisplayed", "searchValue", "disableSearch"] }, { kind: "component", type: MosaicViewComponent, selector: "mosaic-view", inputs: ["tabDisplayed", "fullSize", "nbFakeImg"], outputs: ["switchDisplayWindow"] }, { kind: "component", type: TableViewComponent, selector: "table-view" }, { kind: "directive", type: LoadingDirective, selector: "[btnLoadingAnim]" }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }], animations: [
|
|
3596
3653
|
easeInOut,
|
|
3597
3654
|
insertRemove
|
|
3598
3655
|
] });
|
|
@@ -3601,7 +3658,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImpor
|
|
|
3601
3658
|
args: [{ selector: 'images-view', animations: [
|
|
3602
3659
|
easeInOut,
|
|
3603
3660
|
insertRemove
|
|
3604
|
-
], template: "<ng-container *ngIf=\"vm$ | async as vm\">\r\n\r\n <div class=\"images-view\" [ngClass]=\"{'fullSize': fullSize, 'small': stateDisplayed === 'small'}\" [@easeInOut]=\"'in'\">\r\n <!-- Subheader : Img number and actions btn (sup img list, switch forma display) -->\r\n <div\r\n *ngIf=\"(stateDisplayed !== 'small' || tabDisplayed === 'img-upload')\"\r\n class=\"images-view__container\"\r\n [ngClass]=\"{'images-view__container--uploadTab': tabDisplayed === 'img-upload', 'images-view__container--window': stateDisplayed === 'window'}\"\r\n >\r\n\r\n <div *ngIf=\"tabDisplayed !== 'img-upload'\">\r\n <p class=\"mainColor\" [ngClass]=\"{'images-view__container__total--hide': vm.displayPexelsResults}\">{{ 'ImgManager.ImgLib.nbImg' | translate }} : {{vm.imageTotal}}</p>\r\n </div>\r\n <div *ngIf=\"tabDisplayed === 'img-upload'\">\r\n <p class=\"mainColor\">{{ 'ImgManager.ImgLib.lastImgs' | translate }}</p>\r\n </div>\r\n\r\n <div class=\"field has-addons subHeaderActions\" *ngIf=\"tabDisplayed !== 'img-upload'\">\r\n\r\n <!-- For listforma : Display btn del multiple img & Confirm action -->\r\n <div class=\"images-view__container__boxAction\">\r\n\r\n\r\n <!-- Select -->\r\n <button\r\n class=\"button success images-view__container__boxAction__import\"\r\n @insertRemoveAnnim\r\n *ngIf=\"listDisplayed && nbImgToDelSelected && !confirmImgSup && !delListImgLoader && multipleImgMode\"\r\n (click)=\"selectImgChosen(vm.picturesList)\"\r\n type=\"button\"\r\n >\r\n <i class=\"fal fa-check\"></i>\r\n {{ 'ImgManager.ImgLib.select' | translate }} ({{nbImgToDelSelected}})\r\n </button>\r\n\r\n <!-- Display btn del multiple img -->\r\n <button\r\n *ngIf=\"listDisplayed && nbImgToDelSelected && !confirmImgSup\"\r\n (click)=\"displayConfirmImgSup()\"\r\n class=\"button images-view__container__boxAction__delBtn danger\"\r\n @insertRemoveAnnim\r\n type=\"button\"\r\n >\r\n <i class=\"fal fa-times\"></i>{{ 'ImgManager.ImgLib.delMlt' | translate }} ({{nbImgToDelSelected}})\r\n <span btnLoadingAnim *ngIf=\"delListImgLoader\" class=\"btnLoadingAnnimation\"></span>\r\n </button>\r\n\r\n <!-- Confirm action -->\r\n <div\r\n class=\"images-view__container__boxAction__confirmSup\"\r\n [ngClass]=\"{'images-view__container__boxAction__confirmSup--visible': confirmImgSup}\">\r\n <p *ngIf=\"nbImgToDelSelected > 1\" class=\"images-view__container__boxAction__confirmSup__text\">{{ 'ImgManager.ImgLib.confirmSupQuestions' | translate:{nbImage: nbImgToDelSelected} }}</p>\r\n <p *ngIf=\"nbImgToDelSelected === 1\" class=\"images-view__container__boxAction__confirmSup__text\">{{ 'ImgManager.ImgLib.confirmSupQuestion' | translate:{nbImage: nbImgToDelSelected} }}</p>\r\n <div>\r\n <button\r\n class=\"button images-view__container__boxAction__confirmSup__cancel\"\r\n (click)=\"cancelSup()\"\r\n type=\"button\"\r\n >\r\n {{ 'ImgManager.ImgLib.cancel' | translate }}\r\n </button>\r\n <button\r\n (click)=\"removeListImg(vm.picturesList)\"\r\n class=\"button images-view__container__delBtn danger\"\r\n type=\"button\"\r\n >\r\n {{ 'ImgManager.ImgLib.confirm' | translate }}\r\n </button>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n\r\n\r\n <!-- Swith mosaic/list forma -->\r\n <div class=\"field has-addons images-view__container__buttonBox\">\r\n <div class=\"control\">\r\n <div\r\n class=\"button is-lighted images-view__container__buttonBox__btn\"\r\n [ngClass]=\"{'actifDisplayed': !listDisplayed}\"\r\n (click)=\"onSwitchFormatDisplayed(false)\"\r\n >\r\n <span class=\"icon is-small\">\r\n <i class=\"fa-solid fa-th\"></i>\r\n </span>\r\n </div>\r\n </div>\r\n\r\n <div class=\"control\">\r\n <div class=\"button is-lighted images-view__container__buttonBox__btn\"\r\n [ngClass]=\"{'actifDisplayed': listDisplayed}\"\r\n (click)=\"onSwitchFormatDisplayed(true)\"\r\n >\r\n <span class=\"icon is-small\">\r\n <i class=\"fa-solid fa-bars\"></i>\r\n </span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n\r\n <!-- Images section -->\r\n <ng-scrollbar\r\n class=\"images-view__scroll\"\r\n [ngClass]=\"{\r\n 'images-view__scroll--hide--mosaic': vm.displayPexelsResults && !listDisplayed,\r\n 'images-view__scroll--hide--table': vm.displayPexelsResults && listDisplayed,\r\n 'images-view__scroll--full': stateDisplayed === 'full',\r\n 'images-view__scroll--smallDisplay' : stateDisplayed === 'small' && tabDisplayed !== 'img-upload',\r\n 'images-view__scroll--smallUploadDisplay' : stateDisplayed === 'small' && tabDisplayed === 'img-upload',\r\n 'images-view__scroll--window': stateDisplayed === 'window'\r\n }\"\r\n >\r\n <div #imgLibContainer class=\"images-view__wrapper\">\r\n\r\n <div *ngIf=\"!listDisplayed || stateDisplayed === 'small'\" [@easeInOut]=\"'in'\">\r\n <mosaic-view\r\n [picturesList]=\"vm.picturesList\"\r\n (picturesListChange)=\"onPicturesListChange(vm.picturesList)\"\r\n [tableFilters]=\"vm.tableFilters\"\r\n (filtersChange)=\"searchImagesParameters$.next(getParams(vm.tableFilters));\"\r\n [(disable)]=\"disable\"\r\n (pictureNameChange)=\"onRenamePicture($event)\"\r\n (switchDisplayWindow)=\"switchDisplayWindowMosaic()\"\r\n [nbFakeImg]=\"nbFakeImg\"\r\n [stateDisplayed]=\"stateDisplayed\"\r\n [tabDisplayed]=\"tabDisplayed\"\r\n [displayPexelsResults]=\"vm.displayPexelsResults\"\r\n [isLoading]=\"vm.isLoading\"\r\n [fullSize]=\"fullSize\"\r\n >\r\n </mosaic-view>\r\n </div>\r\n\r\n <div *ngIf=\"listDisplayed && stateDisplayed !== 'small'\" [@easeInOut]=\"'in'\">\r\n <table-view\r\n [picturesList]=\"vm.picturesList\"\r\n (picturesListChange)=\"onPicturesListChange(vm.picturesList)\"\r\n [tableFilters]=\"vm.tableFilters\"\r\n (filtersChange)=\"searchImagesParameters$.next(getParams(vm.tableFilters));\"\r\n [(disable)]=\"disable\"\r\n (pictureNameChange)=\"onRenamePicture($event)\"\r\n [displayPexelsResults]=\"vm.displayPexelsResults\"\r\n [stateDisplayed]=\"stateDisplayed\"\r\n [isLoading]=\"vm.isLoading\"\r\n >\r\n </table-view>\r\n </div>\r\n </div>\r\n </ng-scrollbar>\r\n\r\n <!-- Pexels Section - When no img found -->\r\n <div\r\n *ngIf=\"vm.displayPexelsResults\"\r\n class=\"images-view--pexels\"\r\n [@easeInOut]=\"'in'\">\r\n <pexels-lib\r\n [searchValue]=\"vm.tableFilters.searchValue\"\r\n [disableSearch]=\"true\"\r\n >\r\n </pexels-lib>\r\n </div>\r\n</ng-container>\r\n" }]
|
|
3661
|
+
], template: "<ng-container *ngIf=\"vm$ | async as vm\">\r\n\r\n <div class=\"images-view\" [ngClass]=\"{'fullSize': fullSize, 'small': stateDisplayed === 'small'}\" [@easeInOut]=\"'in'\">\r\n <!-- Subheader : Img number and actions btn (sup img list, switch forma display) -->\r\n <div\r\n *ngIf=\"(stateDisplayed !== 'small' || tabDisplayed === 'img-upload')\"\r\n class=\"images-view__container\"\r\n [ngClass]=\"{'images-view__container--uploadTab': tabDisplayed === 'img-upload', 'images-view__container--window': stateDisplayed === 'window'}\"\r\n >\r\n\r\n <div *ngIf=\"tabDisplayed !== 'img-upload'\">\r\n <p class=\"mainColor\" [ngClass]=\"{'images-view__container__total--hide': vm.displayPexelsResults}\">{{ 'ImgManager.ImgLib.nbImg' | translate }} : {{vm.imageTotal}}</p>\r\n </div>\r\n <div *ngIf=\"tabDisplayed === 'img-upload'\">\r\n <p class=\"mainColor\">{{ 'ImgManager.ImgLib.lastImgs' | translate }}</p>\r\n </div>\r\n\r\n <div class=\"field has-addons subHeaderActions\" *ngIf=\"tabDisplayed !== 'img-upload'\">\r\n\r\n <!-- For listforma : Display btn del multiple img & Confirm action -->\r\n <div class=\"images-view__container__boxAction\">\r\n\r\n\r\n <!-- Select -->\r\n <button\r\n class=\"button success images-view__container__boxAction__import\"\r\n @insertRemoveAnnim\r\n *ngIf=\"listDisplayed && nbImgToDelSelected && !confirmImgSup && !delListImgLoader && multipleImgMode\"\r\n (click)=\"selectImgChosen(vm.picturesList)\"\r\n type=\"button\"\r\n >\r\n <i class=\"fal fa-check\"></i>\r\n {{ 'ImgManager.ImgLib.select' | translate }} ({{nbImgToDelSelected}})\r\n </button>\r\n\r\n <!-- Display btn del multiple img -->\r\n <button\r\n *ngIf=\"listDisplayed && nbImgToDelSelected && !confirmImgSup\"\r\n (click)=\"displayConfirmImgSup()\"\r\n class=\"button images-view__container__boxAction__delBtn danger\"\r\n @insertRemoveAnnim\r\n type=\"button\"\r\n >\r\n <i class=\"fal fa-times\"></i>{{ 'ImgManager.ImgLib.delMlt' | translate }} ({{nbImgToDelSelected}})\r\n <span btnLoadingAnim *ngIf=\"delListImgLoader\" class=\"btnLoadingAnnimation\"></span>\r\n </button>\r\n\r\n <!-- Confirm action -->\r\n <div\r\n class=\"images-view__container__boxAction__confirmSup\"\r\n [ngClass]=\"{'images-view__container__boxAction__confirmSup--visible': confirmImgSup}\">\r\n <p *ngIf=\"nbImgToDelSelected > 1\" class=\"images-view__container__boxAction__confirmSup__text\">{{ 'ImgManager.ImgLib.confirmSupQuestions' | translate:{nbImage: nbImgToDelSelected} }}</p>\r\n <p *ngIf=\"nbImgToDelSelected === 1\" class=\"images-view__container__boxAction__confirmSup__text\">{{ 'ImgManager.ImgLib.confirmSupQuestion' | translate:{nbImage: nbImgToDelSelected} }}</p>\r\n <div>\r\n <button\r\n class=\"button images-view__container__boxAction__confirmSup__cancel\"\r\n (click)=\"cancelSup()\"\r\n type=\"button\"\r\n >\r\n {{ 'ImgManager.ImgLib.cancel' | translate }}\r\n </button>\r\n <button\r\n (click)=\"removeListImg(vm.picturesList)\"\r\n class=\"button images-view__container__delBtn danger\"\r\n type=\"button\"\r\n >\r\n {{ 'ImgManager.ImgLib.confirm' | translate }}\r\n </button>\r\n </div>\r\n </div>\r\n\r\n </div>\r\n\r\n\r\n <!-- Swith mosaic/list forma -->\r\n <div class=\"field has-addons images-view__container__buttonBox\">\r\n <div class=\"control\">\r\n <div\r\n class=\"button is-lighted images-view__container__buttonBox__btn\"\r\n [ngClass]=\"{'actifDisplayed': !listDisplayed}\"\r\n (click)=\"onSwitchFormatDisplayed(false)\"\r\n >\r\n <span class=\"icon is-small\">\r\n <i class=\"fa-solid fa-th\"></i>\r\n </span>\r\n </div>\r\n </div>\r\n\r\n <div class=\"control\">\r\n <div class=\"button is-lighted images-view__container__buttonBox__btn\"\r\n [ngClass]=\"{'actifDisplayed': listDisplayed}\"\r\n (click)=\"onSwitchFormatDisplayed(true)\"\r\n >\r\n <span class=\"icon is-small\">\r\n <i class=\"fa-solid fa-bars\"></i>\r\n </span>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n </div>\r\n\r\n\r\n <!-- Images section -->\r\n <ng-scrollbar\r\n class=\"images-view__scroll\"\r\n [ngClass]=\"{\r\n 'images-view__scroll--hide--mosaic': vm.displayPexelsResults && !listDisplayed,\r\n 'images-view__scroll--hide--table': vm.displayPexelsResults && listDisplayed,\r\n 'images-view__scroll--full': stateDisplayed === 'full',\r\n 'images-view__scroll--smallDisplay' : stateDisplayed === 'small' && tabDisplayed !== 'img-upload',\r\n 'images-view__scroll--smallUploadDisplay' : stateDisplayed === 'small' && tabDisplayed === 'img-upload',\r\n 'images-view__scroll--window': stateDisplayed === 'window'\r\n }\"\r\n >\r\n\r\n <div class=\"filter-video\" *ngIf=\"tabDisplayed !== 'img-upload'\">\r\n <label class=\"checkbox images-view__container__filterVideo\">\r\n <span>{{ 'ImgManager.ImgLib.filterVideo' | translate }}</span>\r\n <select [(ngModel)]=\"vm.tableFilters.type\" (ngModelChange)=\"searchImagesParameters$.next(getParams(vm.tableFilters));\">\r\n <option selected value=\"\">\r\n {{ 'ImgManager.ImgLib.allFiles' | translate }}\r\n </option>\r\n <option value=\"image\">\r\n {{ 'ImgManager.ImgLib.onlyImages' | translate }}\r\n </option>\r\n <option value=\"video\">\r\n {{ 'ImgManager.ImgLib.onlyVideos' | translate }}\r\n </option>\r\n </select>\r\n </label>\r\n </div>\r\n\r\n <div #imgLibContainer class=\"images-view__wrapper\">\r\n\r\n <div *ngIf=\"!listDisplayed || stateDisplayed === 'small'\" [@easeInOut]=\"'in'\">\r\n <mosaic-view\r\n [picturesList]=\"vm.picturesList\"\r\n (picturesListChange)=\"onPicturesListChange(vm.picturesList)\"\r\n [tableFilters]=\"vm.tableFilters\"\r\n (filtersChange)=\"searchImagesParameters$.next(getParams(vm.tableFilters));\"\r\n [(disable)]=\"disable\"\r\n (pictureNameChange)=\"onRenamePicture($event)\"\r\n (switchDisplayWindow)=\"switchDisplayWindowMosaic()\"\r\n [nbFakeImg]=\"nbFakeImg\"\r\n [stateDisplayed]=\"stateDisplayed\"\r\n [tabDisplayed]=\"tabDisplayed\"\r\n [displayPexelsResults]=\"vm.displayPexelsResults\"\r\n [isLoading]=\"vm.isLoading\"\r\n [fullSize]=\"fullSize\"\r\n >\r\n </mosaic-view>\r\n </div>\r\n\r\n <div *ngIf=\"listDisplayed && stateDisplayed !== 'small'\" [@easeInOut]=\"'in'\">\r\n <table-view\r\n [picturesList]=\"vm.picturesList\"\r\n (picturesListChange)=\"onPicturesListChange(vm.picturesList)\"\r\n [tableFilters]=\"vm.tableFilters\"\r\n (filtersChange)=\"searchImagesParameters$.next(getParams(vm.tableFilters));\"\r\n [(disable)]=\"disable\"\r\n (pictureNameChange)=\"onRenamePicture($event)\"\r\n [displayPexelsResults]=\"vm.displayPexelsResults\"\r\n [stateDisplayed]=\"stateDisplayed\"\r\n [isLoading]=\"vm.isLoading\"\r\n >\r\n </table-view>\r\n </div>\r\n </div>\r\n </ng-scrollbar>\r\n\r\n <!-- Pexels Section - When no img found -->\r\n <div\r\n *ngIf=\"vm.displayPexelsResults\"\r\n class=\"images-view--pexels\"\r\n [@easeInOut]=\"'in'\">\r\n <pexels-lib\r\n [searchValue]=\"vm.tableFilters.searchValue\"\r\n [disableSearch]=\"true\"\r\n >\r\n </pexels-lib>\r\n </div>\r\n</ng-container>\r\n" }]
|
|
3605
3662
|
}], ctorParameters: function () { return [{ type: ImgManagerService }, { type: ImgEventService }, { type: ImgSelectionService }, { type: AlertService }, { type: UserSettingsService }, { type: RenamePictureService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { stateDisplayed: [{
|
|
3606
3663
|
type: Input
|
|
3607
3664
|
}], tabDisplayed: [{
|
|
@@ -3922,10 +3979,10 @@ class ImgSelectionComponent {
|
|
|
3922
3979
|
}
|
|
3923
3980
|
}
|
|
3924
3981
|
ImgSelectionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ImgSelectionComponent, deps: [{ token: ImgSelectionService }], target: i0.ɵɵFactoryTarget.Component });
|
|
3925
|
-
ImgSelectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: ImgSelectionComponent, selector: "img-selection", inputs: { tabDisplayed: "tabDisplayed" }, outputs: { imgManagerClosed: "imgManagerClosed" }, ngImport: i0, template: "<div\r\n class=\"trash\"\r\n cdkDropList\r\n #unSelectList=\"cdkDropList\"\r\n (cdkDropListDropped)=\"removeImgFromSelection($event)\">\r\n <p>{{'ImgManager.ImgSelection.unselect' | translate}}</p>\r\n</div>\r\n\r\n<ng-container *ngIf=\"vm$ | async as vm\">\r\n\r\n <div\r\n class=\"img-selection\"\r\n *ngIf=\"!vm.isLoading; else Loading\"\r\n [ngClass]=\"{'img-selection--visible' : vm.imgSelectedList && vm.imgSelectedList.length}\"\r\n >\r\n\r\n <div\r\n cdkDropList\r\n #selectionList=\"cdkDropList\"\r\n cdkDropListOrientation=\"horizontal\"\r\n class=\"list_img_selection\"\r\n (cdkDropListDropped)=\"drop($event)\"\r\n [cdkDropListConnectedTo]=\"[unSelectList]\"\r\n >\r\n\r\n <div\r\n class=\"img_box\"\r\n *ngFor=\"let picture of vm.imgSelectedList; let index = index\"\r\n cdkDrag\r\n (cdkDragStarted)=\"dragStart = true;\"\r\n (cdkDragEnded)=\"dragStart = false;\"\r\n >\r\n\r\n <img\r\n *ngIf=\"index < 1\"\r\n class=\"drag__img\"\r\n [src]=\"picture.file_name | imgSrc : '400'\"\r\n [title]=\"picture.display_name\"\r\n />\r\n\r\n <img\r\n *ngIf=\"index > 0\"\r\n class=\"drag__img\"\r\n [src]=\"picture.file_name | imgSrc : '200'\"\r\n [title]=\"picture.display_name\"\r\n />\r\n\r\n <div class=\"delete-btn\" (click)=\"removeImg(index)\">{{'ImgManager.ImgSelection.deleteImg' | translate}}</div>\r\n\r\n <span class=\"drag__tooltips\">{{'ImgManager.ImgSelection.tooltips' | translate}}</span>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n</ng-container>\r\n<!-- Loader -->\r\n<ng-template #Loading>\r\n <wz-loader></wz-loader>\r\n</ng-template>\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: i3$3.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i3$3.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "component", type: LoaderComponent, selector: "wz-loader", inputs: ["text", "small", "position"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "pipe", type: ImageSrcPipe, name: "imgSrc" }] });
|
|
3982
|
+
ImgSelectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.4", type: ImgSelectionComponent, selector: "img-selection", inputs: { tabDisplayed: "tabDisplayed" }, outputs: { imgManagerClosed: "imgManagerClosed" }, ngImport: i0, template: "<div\r\n class=\"trash\"\r\n cdkDropList\r\n #unSelectList=\"cdkDropList\"\r\n (cdkDropListDropped)=\"removeImgFromSelection($event)\">\r\n <p>{{'ImgManager.ImgSelection.unselect' | translate}}</p>\r\n</div>\r\n\r\n<ng-container *ngIf=\"vm$ | async as vm\">\r\n\r\n <div\r\n class=\"img-selection\"\r\n *ngIf=\"!vm.isLoading; else Loading\"\r\n [ngClass]=\"{'img-selection--visible' : vm.imgSelectedList && vm.imgSelectedList.length}\"\r\n >\r\n\r\n <div\r\n cdkDropList\r\n #selectionList=\"cdkDropList\"\r\n cdkDropListOrientation=\"horizontal\"\r\n class=\"list_img_selection\"\r\n (cdkDropListDropped)=\"drop($event)\"\r\n [cdkDropListConnectedTo]=\"[unSelectList]\"\r\n >\r\n\r\n <div\r\n class=\"img_box\"\r\n *ngFor=\"let picture of vm.imgSelectedList; let index = index\"\r\n cdkDrag\r\n (cdkDragStarted)=\"dragStart = true;\"\r\n (cdkDragEnded)=\"dragStart = false;\"\r\n >\r\n\r\n <img\r\n *ngIf=\"index < 1\"\r\n class=\"drag__img\"\r\n [src]=\"picture.file_name | imgSrc : '400'\"\r\n [title]=\"picture.display_name\"\r\n />\r\n\r\n <img\r\n *ngIf=\"index > 0\"\r\n class=\"drag__img\"\r\n [src]=\"picture.file_name | imgSrc : '200'\"\r\n [title]=\"picture.display_name\"\r\n />\r\n\r\n <div *ngIf=\"picture.video_link\" class=\"img_box__video\">\r\n <i class=\"fa-solid fa-play\"></i>\r\n </div>\r\n\r\n <div class=\"delete-btn\" (click)=\"removeImg(index)\">{{'ImgManager.ImgSelection.deleteImg' | translate}}</div>\r\n\r\n <span class=\"drag__tooltips\">{{'ImgManager.ImgSelection.tooltips' | translate}}</span>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n</ng-container>\r\n<!-- Loader -->\r\n<ng-template #Loading>\r\n <wz-loader></wz-loader>\r\n</ng-template>\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: i3$3.CdkDropList, selector: "[cdkDropList], cdk-drop-list", inputs: ["cdkDropListConnectedTo", "cdkDropListData", "cdkDropListOrientation", "id", "cdkDropListLockAxis", "cdkDropListDisabled", "cdkDropListSortingDisabled", "cdkDropListEnterPredicate", "cdkDropListSortPredicate", "cdkDropListAutoScrollDisabled", "cdkDropListAutoScrollStep"], outputs: ["cdkDropListDropped", "cdkDropListEntered", "cdkDropListExited", "cdkDropListSorted"], exportAs: ["cdkDropList"] }, { kind: "directive", type: i3$3.CdkDrag, selector: "[cdkDrag]", inputs: ["cdkDragData", "cdkDragLockAxis", "cdkDragRootElement", "cdkDragBoundary", "cdkDragStartDelay", "cdkDragFreeDragPosition", "cdkDragDisabled", "cdkDragConstrainPosition", "cdkDragPreviewClass", "cdkDragPreviewContainer"], outputs: ["cdkDragStarted", "cdkDragReleased", "cdkDragEnded", "cdkDragEntered", "cdkDragExited", "cdkDragDropped", "cdkDragMoved"], exportAs: ["cdkDrag"] }, { kind: "component", type: LoaderComponent, selector: "wz-loader", inputs: ["text", "small", "position"] }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }, { kind: "pipe", type: ImageSrcPipe, name: "imgSrc" }] });
|
|
3926
3983
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.4", ngImport: i0, type: ImgSelectionComponent, decorators: [{
|
|
3927
3984
|
type: Component,
|
|
3928
|
-
args: [{ selector: 'img-selection', template: "<div\r\n class=\"trash\"\r\n cdkDropList\r\n #unSelectList=\"cdkDropList\"\r\n (cdkDropListDropped)=\"removeImgFromSelection($event)\">\r\n <p>{{'ImgManager.ImgSelection.unselect' | translate}}</p>\r\n</div>\r\n\r\n<ng-container *ngIf=\"vm$ | async as vm\">\r\n\r\n <div\r\n class=\"img-selection\"\r\n *ngIf=\"!vm.isLoading; else Loading\"\r\n [ngClass]=\"{'img-selection--visible' : vm.imgSelectedList && vm.imgSelectedList.length}\"\r\n >\r\n\r\n <div\r\n cdkDropList\r\n #selectionList=\"cdkDropList\"\r\n cdkDropListOrientation=\"horizontal\"\r\n class=\"list_img_selection\"\r\n (cdkDropListDropped)=\"drop($event)\"\r\n [cdkDropListConnectedTo]=\"[unSelectList]\"\r\n >\r\n\r\n <div\r\n class=\"img_box\"\r\n *ngFor=\"let picture of vm.imgSelectedList; let index = index\"\r\n cdkDrag\r\n (cdkDragStarted)=\"dragStart = true;\"\r\n (cdkDragEnded)=\"dragStart = false;\"\r\n >\r\n\r\n <img\r\n *ngIf=\"index < 1\"\r\n class=\"drag__img\"\r\n [src]=\"picture.file_name | imgSrc : '400'\"\r\n [title]=\"picture.display_name\"\r\n />\r\n\r\n <img\r\n *ngIf=\"index > 0\"\r\n class=\"drag__img\"\r\n [src]=\"picture.file_name | imgSrc : '200'\"\r\n [title]=\"picture.display_name\"\r\n />\r\n\r\n <div class=\"delete-btn\" (click)=\"removeImg(index)\">{{'ImgManager.ImgSelection.deleteImg' | translate}}</div>\r\n\r\n <span class=\"drag__tooltips\">{{'ImgManager.ImgSelection.tooltips' | translate}}</span>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n</ng-container>\r\n<!-- Loader -->\r\n<ng-template #Loading>\r\n <wz-loader></wz-loader>\r\n</ng-template>\r\n" }]
|
|
3985
|
+
args: [{ selector: 'img-selection', template: "<div\r\n class=\"trash\"\r\n cdkDropList\r\n #unSelectList=\"cdkDropList\"\r\n (cdkDropListDropped)=\"removeImgFromSelection($event)\">\r\n <p>{{'ImgManager.ImgSelection.unselect' | translate}}</p>\r\n</div>\r\n\r\n<ng-container *ngIf=\"vm$ | async as vm\">\r\n\r\n <div\r\n class=\"img-selection\"\r\n *ngIf=\"!vm.isLoading; else Loading\"\r\n [ngClass]=\"{'img-selection--visible' : vm.imgSelectedList && vm.imgSelectedList.length}\"\r\n >\r\n\r\n <div\r\n cdkDropList\r\n #selectionList=\"cdkDropList\"\r\n cdkDropListOrientation=\"horizontal\"\r\n class=\"list_img_selection\"\r\n (cdkDropListDropped)=\"drop($event)\"\r\n [cdkDropListConnectedTo]=\"[unSelectList]\"\r\n >\r\n\r\n <div\r\n class=\"img_box\"\r\n *ngFor=\"let picture of vm.imgSelectedList; let index = index\"\r\n cdkDrag\r\n (cdkDragStarted)=\"dragStart = true;\"\r\n (cdkDragEnded)=\"dragStart = false;\"\r\n >\r\n\r\n <img\r\n *ngIf=\"index < 1\"\r\n class=\"drag__img\"\r\n [src]=\"picture.file_name | imgSrc : '400'\"\r\n [title]=\"picture.display_name\"\r\n />\r\n\r\n <img\r\n *ngIf=\"index > 0\"\r\n class=\"drag__img\"\r\n [src]=\"picture.file_name | imgSrc : '200'\"\r\n [title]=\"picture.display_name\"\r\n />\r\n\r\n <div *ngIf=\"picture.video_link\" class=\"img_box__video\">\r\n <i class=\"fa-solid fa-play\"></i>\r\n </div>\r\n\r\n <div class=\"delete-btn\" (click)=\"removeImg(index)\">{{'ImgManager.ImgSelection.deleteImg' | translate}}</div>\r\n\r\n <span class=\"drag__tooltips\">{{'ImgManager.ImgSelection.tooltips' | translate}}</span>\r\n\r\n </div>\r\n </div>\r\n </div>\r\n</ng-container>\r\n<!-- Loader -->\r\n<ng-template #Loading>\r\n <wz-loader></wz-loader>\r\n</ng-template>\r\n" }]
|
|
3929
3986
|
}], ctorParameters: function () { return [{ type: ImgSelectionService }]; }, propDecorators: { tabDisplayed: [{
|
|
3930
3987
|
type: Input
|
|
3931
3988
|
}], imgManagerClosed: [{
|
|
@@ -4349,4 +4406,3 @@ class ImgManagerConfigDto {
|
|
|
4349
4406
|
|
|
4350
4407
|
export { ApiService, CanvaButtonApi, CanvaService, ImageNotFoundService, ImgApiDto, ImgManagerConfigDto, ImgManagerService, ImgSelectionService, RenamePictureService, WzImgManagerComponent, WzImgManagerModule };
|
|
4351
4408
|
//# sourceMappingURL=wizishop-img-manager.mjs.map
|
|
4352
|
-
//# sourceMappingURL=wizishop-img-manager.mjs.map
|