@wizishop/angular-components 0.0.162 → 0.0.164
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/angular-components.scss +4581 -4554
- package/bundles/wizishop-angular-components.umd.js +16 -2
- package/bundles/wizishop-angular-components.umd.js.map +1 -1
- package/bundles/wizishop-angular-components.umd.min.js +1 -1
- package/bundles/wizishop-angular-components.umd.min.js.map +1 -1
- package/esm2015/lib/components/mosaic/mosaic.component.js +17 -3
- package/fesm2015/wizishop-angular-components.js +16 -2
- package/fesm2015/wizishop-angular-components.js.map +1 -1
- package/lib/components/mosaic/mosaic.component.d.ts +4 -0
- package/package.json +1 -1
- package/wizishop-angular-components-0.0.164.tgz +0 -0
- package/wizishop-angular-components.metadata.json +1 -1
- package/wizishop-angular-components-0.0.162.tgz +0 -0
|
@@ -4,17 +4,31 @@ export class MosaicComponent {
|
|
|
4
4
|
this.isLoading = true;
|
|
5
5
|
}
|
|
6
6
|
ngOnInit() {
|
|
7
|
+
if (this.items) {
|
|
8
|
+
const splitItems = this.sliceIntoChunks(this.items, (this.items.length / 3));
|
|
9
|
+
this.columnLeft = splitItems[0];
|
|
10
|
+
this.columnCenter = splitItems[1];
|
|
11
|
+
this.columnRight = splitItems[2];
|
|
12
|
+
}
|
|
13
|
+
this.isLoading = false;
|
|
14
|
+
}
|
|
15
|
+
sliceIntoChunks(arr, chunkSize) {
|
|
16
|
+
const res = [];
|
|
17
|
+
for (let i = 0; i < arr.length; i += chunkSize) {
|
|
18
|
+
const chunk = arr.slice(i, i + chunkSize);
|
|
19
|
+
res.push(chunk);
|
|
20
|
+
}
|
|
21
|
+
return res;
|
|
7
22
|
}
|
|
8
23
|
}
|
|
9
24
|
MosaicComponent.decorators = [
|
|
10
25
|
{ type: Component, args: [{
|
|
11
26
|
selector: 'wac-mosaic',
|
|
12
|
-
template: "<div class=\"wac-mosaic__loader\" *ngIf=\"isLoading\">\n <wac-loader></wac-loader>\n</div>\n<div class=\"wac-mosaic\" *ngIf=\"!isLoading\">\n <div class=\"wac-mosaic__wrapper\">\n <div class=\"wac-mosaic__wrapper__column\"
|
|
13
|
-
styles: [".wac-mosaic__loader{min-height:400px;width:100%;display:flex;justify-content:center;align-items:center}"]
|
|
27
|
+
template: "<div class=\"wac-mosaic__loader\" *ngIf=\"isLoading\">\n <wac-loader></wac-loader>\n</div>\n<div class=\"wac-mosaic\" *ngIf=\"!isLoading\">\n <div class=\"wac-mosaic__wrapper\">\n <div class=\"wac-mosaic__wrapper__column\" *ngIf=\"columnLeft\">\n <div class=\"wac-mosaic__wrapper__column__item\" *ngFor=\"let img of columnLeft; let i = index;\">\n <img [src]=\"img\" />\n </div>\n </div>\n <div class=\"wac-mosaic__wrapper__column\" *ngIf=\"columnCenter\" >\n <div class=\"wac-mosaic__wrapper__column__item\" *ngFor=\"let img of columnCenter; let i = index;\">\n <img [src]=\"img\" />\n </div>\n </div>\n <div class=\"wac-mosaic__wrapper__column\" *ngIf=\"columnRight\">\n <div class=\"wac-mosaic__wrapper__column__item\" *ngFor=\"let img of columnRight; let i = index;\">\n <img [src]=\"img\" />\n </div>\n </div>\n </div>\n</div>\n"
|
|
14
28
|
},] }
|
|
15
29
|
];
|
|
16
30
|
MosaicComponent.ctorParameters = () => [];
|
|
17
31
|
MosaicComponent.propDecorators = {
|
|
18
32
|
items: [{ type: Input }]
|
|
19
33
|
};
|
|
20
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
34
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibW9zYWljLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2FuZ3VsYXItY29tcG9uZW50cy9zcmMvbGliL2NvbXBvbmVudHMvbW9zYWljL21vc2FpYy5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFDLFNBQVMsRUFBRSxLQUFLLEVBQVMsTUFBTSxlQUFlLENBQUM7QUFNdkQsTUFBTSxPQUFPLGVBQWU7SUFXMUI7UUFOQSxjQUFTLEdBQUcsSUFBSSxDQUFDO0lBTUQsQ0FBQztJQUVqQixRQUFRO1FBQ04sSUFBSSxJQUFJLENBQUMsS0FBSyxFQUFFO1lBQ2QsTUFBTSxVQUFVLEdBQUcsSUFBSSxDQUFDLGVBQWUsQ0FBQyxJQUFJLENBQUMsS0FBSyxFQUFFLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxNQUFNLEdBQUcsQ0FBQyxDQUFDLENBQUMsQ0FBQztZQUM3RSxJQUFJLENBQUMsVUFBVSxHQUFHLFVBQVUsQ0FBQyxDQUFDLENBQUMsQ0FBQztZQUNoQyxJQUFJLENBQUMsWUFBWSxHQUFHLFVBQVUsQ0FBQyxDQUFDLENBQUMsQ0FBQztZQUNsQyxJQUFJLENBQUMsV0FBVyxHQUFHLFVBQVUsQ0FBQyxDQUFDLENBQUMsQ0FBQztTQUNsQztRQUNELElBQUksQ0FBQyxTQUFTLEdBQUcsS0FBSyxDQUFDO0lBQ3pCLENBQUM7SUFFRCxlQUFlLENBQUMsR0FBRyxFQUFFLFNBQVM7UUFDNUIsTUFBTSxHQUFHLEdBQUcsRUFBRSxDQUFDO1FBQ2YsS0FBSyxJQUFJLENBQUMsR0FBRyxDQUFDLEVBQUUsQ0FBQyxHQUFHLEdBQUcsQ0FBQyxNQUFNLEVBQUUsQ0FBQyxJQUFJLFNBQVMsRUFBRTtZQUM5QyxNQUFNLEtBQUssR0FBRyxHQUFHLENBQUMsS0FBSyxDQUFDLENBQUMsRUFBRSxDQUFDLEdBQUcsU0FBUyxDQUFDLENBQUM7WUFDMUMsR0FBRyxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQztTQUNqQjtRQUNELE9BQU8sR0FBRyxDQUFDO0lBQ2IsQ0FBQzs7O1lBbENGLFNBQVMsU0FBQztnQkFDVCxRQUFRLEVBQUUsWUFBWTtnQkFDdEIscTVCQUFzQzthQUN2Qzs7OztvQkFHRSxLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtDb21wb25lbnQsIElucHV0LCBPbkluaXR9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICd3YWMtbW9zYWljJyxcbiAgdGVtcGxhdGVVcmw6ICcuL21vc2FpYy5jb21wb25lbnQuaHRtbCdcbn0pXG5leHBvcnQgY2xhc3MgTW9zYWljQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0IHtcblxuICBASW5wdXQoKVxuICBpdGVtczogW107XG5cbiAgaXNMb2FkaW5nID0gdHJ1ZTtcblxuICBjb2x1bW5MZWZ0OiBbXTtcbiAgY29sdW1uUmlnaHQ6IFtdO1xuICBjb2x1bW5DZW50ZXI6IFtdO1xuXG4gIGNvbnN0cnVjdG9yKCkgeyB9XG5cbiAgbmdPbkluaXQoKTogdm9pZCB7XG4gICAgaWYgKHRoaXMuaXRlbXMpIHtcbiAgICAgIGNvbnN0IHNwbGl0SXRlbXMgPSB0aGlzLnNsaWNlSW50b0NodW5rcyh0aGlzLml0ZW1zLCAodGhpcy5pdGVtcy5sZW5ndGggLyAzKSk7XG4gICAgICB0aGlzLmNvbHVtbkxlZnQgPSBzcGxpdEl0ZW1zWzBdO1xuICAgICAgdGhpcy5jb2x1bW5DZW50ZXIgPSBzcGxpdEl0ZW1zWzFdO1xuICAgICAgdGhpcy5jb2x1bW5SaWdodCA9IHNwbGl0SXRlbXNbMl07XG4gICAgfVxuICAgIHRoaXMuaXNMb2FkaW5nID0gZmFsc2U7XG4gIH1cblxuICBzbGljZUludG9DaHVua3MoYXJyLCBjaHVua1NpemUpIHtcbiAgICBjb25zdCByZXMgPSBbXTtcbiAgICBmb3IgKGxldCBpID0gMDsgaSA8IGFyci5sZW5ndGg7IGkgKz0gY2h1bmtTaXplKSB7XG4gICAgICBjb25zdCBjaHVuayA9IGFyci5zbGljZShpLCBpICsgY2h1bmtTaXplKTtcbiAgICAgIHJlcy5wdXNoKGNodW5rKTtcbiAgICB9XG4gICAgcmV0dXJuIHJlcztcbiAgfVxuXG59XG4iXX0=
|
|
@@ -3855,13 +3855,27 @@ class MosaicComponent {
|
|
|
3855
3855
|
this.isLoading = true;
|
|
3856
3856
|
}
|
|
3857
3857
|
ngOnInit() {
|
|
3858
|
+
if (this.items) {
|
|
3859
|
+
const splitItems = this.sliceIntoChunks(this.items, (this.items.length / 3));
|
|
3860
|
+
this.columnLeft = splitItems[0];
|
|
3861
|
+
this.columnCenter = splitItems[1];
|
|
3862
|
+
this.columnRight = splitItems[2];
|
|
3863
|
+
}
|
|
3864
|
+
this.isLoading = false;
|
|
3865
|
+
}
|
|
3866
|
+
sliceIntoChunks(arr, chunkSize) {
|
|
3867
|
+
const res = [];
|
|
3868
|
+
for (let i = 0; i < arr.length; i += chunkSize) {
|
|
3869
|
+
const chunk = arr.slice(i, i + chunkSize);
|
|
3870
|
+
res.push(chunk);
|
|
3871
|
+
}
|
|
3872
|
+
return res;
|
|
3858
3873
|
}
|
|
3859
3874
|
}
|
|
3860
3875
|
MosaicComponent.decorators = [
|
|
3861
3876
|
{ type: Component, args: [{
|
|
3862
3877
|
selector: 'wac-mosaic',
|
|
3863
|
-
template: "<div class=\"wac-mosaic__loader\" *ngIf=\"isLoading\">\n <wac-loader></wac-loader>\n</div>\n<div class=\"wac-mosaic\" *ngIf=\"!isLoading\">\n <div class=\"wac-mosaic__wrapper\">\n <div class=\"wac-mosaic__wrapper__column\"
|
|
3864
|
-
styles: [".wac-mosaic__loader{min-height:400px;width:100%;display:flex;justify-content:center;align-items:center}"]
|
|
3878
|
+
template: "<div class=\"wac-mosaic__loader\" *ngIf=\"isLoading\">\n <wac-loader></wac-loader>\n</div>\n<div class=\"wac-mosaic\" *ngIf=\"!isLoading\">\n <div class=\"wac-mosaic__wrapper\">\n <div class=\"wac-mosaic__wrapper__column\" *ngIf=\"columnLeft\">\n <div class=\"wac-mosaic__wrapper__column__item\" *ngFor=\"let img of columnLeft; let i = index;\">\n <img [src]=\"img\" />\n </div>\n </div>\n <div class=\"wac-mosaic__wrapper__column\" *ngIf=\"columnCenter\" >\n <div class=\"wac-mosaic__wrapper__column__item\" *ngFor=\"let img of columnCenter; let i = index;\">\n <img [src]=\"img\" />\n </div>\n </div>\n <div class=\"wac-mosaic__wrapper__column\" *ngIf=\"columnRight\">\n <div class=\"wac-mosaic__wrapper__column__item\" *ngFor=\"let img of columnRight; let i = index;\">\n <img [src]=\"img\" />\n </div>\n </div>\n </div>\n</div>\n"
|
|
3865
3879
|
},] }
|
|
3866
3880
|
];
|
|
3867
3881
|
MosaicComponent.ctorParameters = () => [];
|