@wizishop/angular-components 0.0.162 → 0.0.167
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 +5506 -5442
- package/bundles/wizishop-angular-components.umd.js +39 -7
- 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/block-with-checkbox/block-with-checkbox.component.js +16 -5
- package/esm2015/lib/components/mosaic/mosaic.component.js +26 -5
- package/fesm2015/wizishop-angular-components.js +39 -7
- package/fesm2015/wizishop-angular-components.js.map +1 -1
- package/lib/components/block-with-checkbox/block-with-checkbox.component.d.ts +5 -0
- package/lib/components/mosaic/mosaic.component.d.ts +9 -1
- package/package.json +1 -1
- package/wizishop-angular-components-0.0.167.tgz +0 -0
- package/wizishop-angular-components.metadata.json +1 -1
- package/wizishop-angular-components-0.0.162.tgz +0 -0
|
@@ -7,13 +7,18 @@ export class BlockWithCheckboxComponent {
|
|
|
7
7
|
this.copyAction = new EventEmitter();
|
|
8
8
|
this.worldAction = new EventEmitter();
|
|
9
9
|
this.checkboxAction = new EventEmitter();
|
|
10
|
+
this.nameRadio = 'wacBlockCheckboxRadio';
|
|
11
|
+
this.isFirst = false;
|
|
12
|
+
this.opacity = '.45';
|
|
10
13
|
}
|
|
11
14
|
ngOnInit() {
|
|
15
|
+
this.randomLabelName = 'radioBlock' + Math.random() * (900 - 700) + 700;
|
|
12
16
|
}
|
|
13
17
|
eventSelected(event) {
|
|
14
|
-
|
|
15
|
-
|
|
18
|
+
console.log(event);
|
|
19
|
+
this.selected = event.target.checked;
|
|
16
20
|
this.checkboxAction.emit(this.selected);
|
|
21
|
+
this.isFirst = false;
|
|
17
22
|
}
|
|
18
23
|
eventCopy() {
|
|
19
24
|
this.copyAction.emit(true);
|
|
@@ -21,11 +26,14 @@ export class BlockWithCheckboxComponent {
|
|
|
21
26
|
eventWorld() {
|
|
22
27
|
this.worldAction.emit(true);
|
|
23
28
|
}
|
|
29
|
+
removeFirstClass() {
|
|
30
|
+
document.querySelectorAll('.firstWacRadioBLock')[0].classList.remove('firstWacRadioBLock');
|
|
31
|
+
}
|
|
24
32
|
}
|
|
25
33
|
BlockWithCheckboxComponent.decorators = [
|
|
26
34
|
{ type: Component, args: [{
|
|
27
35
|
selector: 'wac-block-with-checkbox',
|
|
28
|
-
template: "<div class=\"block-with-checkbox\">\n <div class=\"block-with-checkbox__left\">\n <div class=\"wac-radio-block\">\n <div class=\"wac-radio__row\">\n <input type=\"
|
|
36
|
+
template: "<div class=\"block-with-checkbox\" [ngClass]=\"{'selected': inputRadioA.checked, 'firstWacRadioBLock': isFirst}\" [style.opacity]=\"opacity\" (mouseover)=\"removeFirstClass()\">\n <div class=\"block-with-checkbox__left\" (click)=\"inputRadioA.click()\">\n <div class=\"wac-radio-block\">\n <div class=\"wac-radio__row\">\n <input #inputRadioA [name]=\"nameRadio\" type=\"radio\" [value]=\"selected\" (change)=\"eventSelected($event)\" [id]=\"randomLabelName\">\n <label [for]=\"randomLabelName\"></label>\n </div>\n </div>\n </div>\n <div class=\"block-with-checkbox__center\" (click)=\"inputRadioA.click()\">\n <ng-content></ng-content>\n </div>\n <div class=\"block-with-checkbox__right\">\n <div><wac-button extraClasses=\"is-blue opacity static-width\" [iconFontSize]=\"18\" [icon]=\"iconCopy\" (click)=\"eventCopy()\"></wac-button></div>\n <div><wac-button extraClasses=\"is-green opacity static-width\" [iconFontSize]=\"18\" [icon]=\"iconWorld\" (click)=\"eventWorld()\"></wac-button></div>\n </div>\n</div>\n"
|
|
29
37
|
},] }
|
|
30
38
|
];
|
|
31
39
|
BlockWithCheckboxComponent.ctorParameters = () => [];
|
|
@@ -35,6 +43,9 @@ BlockWithCheckboxComponent.propDecorators = {
|
|
|
35
43
|
iconWorld: [{ type: Input }],
|
|
36
44
|
copyAction: [{ type: Output }],
|
|
37
45
|
worldAction: [{ type: Output }],
|
|
38
|
-
checkboxAction: [{ type: Output }]
|
|
46
|
+
checkboxAction: [{ type: Output }],
|
|
47
|
+
nameRadio: [{ type: Input }],
|
|
48
|
+
isFirst: [{ type: Input }],
|
|
49
|
+
opacity: [{ type: Input }]
|
|
39
50
|
};
|
|
40
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
51
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmxvY2std2l0aC1jaGVja2JveC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9hbmd1bGFyLWNvbXBvbmVudHMvc3JjL2xpYi9jb21wb25lbnRzL2Jsb2NrLXdpdGgtY2hlY2tib3gvYmxvY2std2l0aC1jaGVja2JveC5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFDLFNBQVMsRUFBRSxZQUFZLEVBQUUsS0FBSyxFQUFVLE1BQU0sRUFBQyxNQUFNLGVBQWUsQ0FBQztBQU03RSxNQUFNLE9BQU8sMEJBQTBCO0lBK0JyQztRQTVCQSxhQUFRLEdBQUcsS0FBSyxDQUFDO1FBR2pCLGFBQVEsR0FBRyxrQkFBa0IsQ0FBQztRQUc5QixjQUFTLEdBQUcsa0JBQWtCLENBQUM7UUFHL0IsZUFBVSxHQUFHLElBQUksWUFBWSxFQUFXLENBQUM7UUFHekMsZ0JBQVcsR0FBRyxJQUFJLFlBQVksRUFBVyxDQUFDO1FBRzFDLG1CQUFjLEdBQUcsSUFBSSxZQUFZLEVBQVcsQ0FBQztRQUs3QyxjQUFTLEdBQUcsdUJBQXVCLENBQUM7UUFHcEMsWUFBTyxHQUFHLEtBQUssQ0FBQztRQUdoQixZQUFPLEdBQUcsS0FBSyxDQUFDO0lBRUEsQ0FBQztJQUVqQixRQUFRO1FBQ04sSUFBSSxDQUFDLGVBQWUsR0FBRyxZQUFZLEdBQUcsSUFBSSxDQUFDLE1BQU0sRUFBRSxHQUFHLENBQUMsR0FBRyxHQUFHLEdBQUcsQ0FBQyxHQUFHLEdBQUcsQ0FBQztJQUMxRSxDQUFDO0lBRUQsYUFBYSxDQUFDLEtBQUs7UUFDakIsT0FBTyxDQUFDLEdBQUcsQ0FBQyxLQUFLLENBQUMsQ0FBQztRQUNuQixJQUFJLENBQUMsUUFBUSxHQUFHLEtBQUssQ0FBQyxNQUFNLENBQUMsT0FBTyxDQUFDO1FBQ3JDLElBQUksQ0FBQyxjQUFjLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxRQUFRLENBQUMsQ0FBQztRQUN4QyxJQUFJLENBQUMsT0FBTyxHQUFHLEtBQUssQ0FBQztJQUN2QixDQUFDO0lBRUQsU0FBUztRQUNQLElBQUksQ0FBQyxVQUFVLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxDQUFDO0lBQzdCLENBQUM7SUFFRCxVQUFVO1FBQ1IsSUFBSSxDQUFDLFdBQVcsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLENBQUM7SUFDOUIsQ0FBQztJQUVELGdCQUFnQjtRQUNkLFFBQVEsQ0FBQyxnQkFBZ0IsQ0FBQyxxQkFBcUIsQ0FBQyxDQUFDLENBQUMsQ0FBQyxDQUFDLFNBQVMsQ0FBQyxNQUFNLENBQUMsb0JBQW9CLENBQUMsQ0FBQztJQUM3RixDQUFDOzs7WUExREYsU0FBUyxTQUFDO2dCQUNULFFBQVEsRUFBRSx5QkFBeUI7Z0JBQ25DLGtqQ0FBbUQ7YUFDcEQ7Ozs7dUJBR0UsS0FBSzt1QkFHTCxLQUFLO3dCQUdMLEtBQUs7eUJBR0wsTUFBTTswQkFHTixNQUFNOzZCQUdOLE1BQU07d0JBS04sS0FBSztzQkFHTCxLQUFLO3NCQUdMLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge0NvbXBvbmVudCwgRXZlbnRFbWl0dGVyLCBJbnB1dCwgT25Jbml0LCBPdXRwdXR9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICd3YWMtYmxvY2std2l0aC1jaGVja2JveCcsXG4gIHRlbXBsYXRlVXJsOiAnLi9ibG9jay13aXRoLWNoZWNrYm94LmNvbXBvbmVudC5odG1sJyxcbn0pXG5leHBvcnQgY2xhc3MgQmxvY2tXaXRoQ2hlY2tib3hDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xuXG4gIEBJbnB1dCgpXG4gIHNlbGVjdGVkID0gZmFsc2U7XG5cbiAgQElucHV0KClcbiAgaWNvbkNvcHkgPSAnZmEtc29saWQgZmEtY29weSc7XG5cbiAgQElucHV0KClcbiAgaWNvbldvcmxkID0gJ2ZhLXRoaW4gZmEtZ2xvYmUnO1xuXG4gIEBPdXRwdXQoKVxuICBjb3B5QWN0aW9uID0gbmV3IEV2ZW50RW1pdHRlcjxib29sZWFuPigpO1xuXG4gIEBPdXRwdXQoKVxuICB3b3JsZEFjdGlvbiA9IG5ldyBFdmVudEVtaXR0ZXI8Ym9vbGVhbj4oKTtcblxuICBAT3V0cHV0KClcbiAgY2hlY2tib3hBY3Rpb24gPSBuZXcgRXZlbnRFbWl0dGVyPGJvb2xlYW4+KCk7XG5cbiAgcmFuZG9tTGFiZWxOYW1lOiBzdHJpbmc7XG5cbiAgQElucHV0KClcbiAgbmFtZVJhZGlvID0gJ3dhY0Jsb2NrQ2hlY2tib3hSYWRpbyc7XG5cbiAgQElucHV0KClcbiAgaXNGaXJzdCA9IGZhbHNlO1xuXG4gIEBJbnB1dCgpXG4gIG9wYWNpdHkgPSAnLjQ1JztcblxuICBjb25zdHJ1Y3RvcigpIHsgfVxuXG4gIG5nT25Jbml0KCk6IHZvaWQge1xuICAgIHRoaXMucmFuZG9tTGFiZWxOYW1lID0gJ3JhZGlvQmxvY2snICsgTWF0aC5yYW5kb20oKSAqICg5MDAgLSA3MDApICsgNzAwO1xuICB9XG5cbiAgZXZlbnRTZWxlY3RlZChldmVudCkge1xuICAgIGNvbnNvbGUubG9nKGV2ZW50KTtcbiAgICB0aGlzLnNlbGVjdGVkID0gZXZlbnQudGFyZ2V0LmNoZWNrZWQ7XG4gICAgdGhpcy5jaGVja2JveEFjdGlvbi5lbWl0KHRoaXMuc2VsZWN0ZWQpO1xuICAgIHRoaXMuaXNGaXJzdCA9IGZhbHNlO1xuICB9XG5cbiAgZXZlbnRDb3B5KCkge1xuICAgIHRoaXMuY29weUFjdGlvbi5lbWl0KHRydWUpO1xuICB9XG5cbiAgZXZlbnRXb3JsZCgpIHtcbiAgICB0aGlzLndvcmxkQWN0aW9uLmVtaXQodHJ1ZSk7XG4gIH1cblxuICByZW1vdmVGaXJzdENsYXNzKCkge1xuICAgIGRvY3VtZW50LnF1ZXJ5U2VsZWN0b3JBbGwoJy5maXJzdFdhY1JhZGlvQkxvY2snKVswXS5jbGFzc0xpc3QucmVtb3ZlKCdmaXJzdFdhY1JhZGlvQkxvY2snKTtcbiAgfVxufVxuIl19
|
|
@@ -1,20 +1,41 @@
|
|
|
1
|
-
import { Component, Input } from '@angular/core';
|
|
1
|
+
import { Component, EventEmitter, Input, Output } from '@angular/core';
|
|
2
2
|
export class MosaicComponent {
|
|
3
3
|
constructor() {
|
|
4
4
|
this.isLoading = true;
|
|
5
|
+
this.import = new EventEmitter();
|
|
5
6
|
}
|
|
6
7
|
ngOnInit() {
|
|
8
|
+
if (this.items) {
|
|
9
|
+
const splitItems = this.sliceIntoChunks(this.items, (this.items.length / 3));
|
|
10
|
+
this.columnLeft = splitItems[0];
|
|
11
|
+
this.columnCenter = splitItems[1];
|
|
12
|
+
this.columnRight = splitItems[2];
|
|
13
|
+
}
|
|
14
|
+
this.isLoading = false;
|
|
15
|
+
}
|
|
16
|
+
emitIndex(index) {
|
|
17
|
+
this.import.emit(index);
|
|
18
|
+
}
|
|
19
|
+
sliceIntoChunks(arr, chunkSize) {
|
|
20
|
+
const res = [];
|
|
21
|
+
for (let i = 0; i < arr.length; i += chunkSize) {
|
|
22
|
+
const chunk = arr.slice(i, i + chunkSize);
|
|
23
|
+
res.push(chunk);
|
|
24
|
+
}
|
|
25
|
+
return res;
|
|
7
26
|
}
|
|
8
27
|
}
|
|
9
28
|
MosaicComponent.decorators = [
|
|
10
29
|
{ type: Component, args: [{
|
|
11
30
|
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\"></div>\n <div class=\"wac-mosaic__wrapper__column\" *ngIf=\"
|
|
13
|
-
styles: [".wac-mosaic__loader{min-height:400px;width:100%;display:flex;justify-content:center;align-items:center}"]
|
|
31
|
+
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 class=\"hover\">\n <wac-button [icon]=\"iconButtons\" [label]=\"labelButtons\" [extraClasses]=\"'is-success'\" (click)=\"emitIndex(i)\"></wac-button>\n </div>\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 class=\"hover\">\n <wac-button [icon]=\"iconButtons\" [label]=\"labelButtons\" [extraClasses]=\"'is-success'\" (click)=\"emitIndex(i + this.columnLeft.length)\"></wac-button>\n </div>\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 class=\"hover\">\n <wac-button [icon]=\"iconButtons\" [label]=\"labelButtons\" [extraClasses]=\"'is-success'\" (click)=\"emitIndex(i + this.columnLeft.length + this.columnCenter.length)\"></wac-button>\n </div>\n </div>\n </div>\n </div>\n</div>\n"
|
|
14
32
|
},] }
|
|
15
33
|
];
|
|
16
34
|
MosaicComponent.ctorParameters = () => [];
|
|
17
35
|
MosaicComponent.propDecorators = {
|
|
18
|
-
items: [{ type: Input }]
|
|
36
|
+
items: [{ type: Input }],
|
|
37
|
+
labelButtons: [{ type: Input }],
|
|
38
|
+
iconButtons: [{ type: Input }],
|
|
39
|
+
import: [{ type: Output }]
|
|
19
40
|
};
|
|
20
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
41
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibW9zYWljLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2FuZ3VsYXItY29tcG9uZW50cy9zcmMvbGliL2NvbXBvbmVudHMvbW9zYWljL21vc2FpYy5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFDLFNBQVMsRUFBRSxZQUFZLEVBQUUsS0FBSyxFQUFVLE1BQU0sRUFBQyxNQUFNLGVBQWUsQ0FBQztBQU03RSxNQUFNLE9BQU8sZUFBZTtJQW9CMUI7UUFmQSxjQUFTLEdBQUcsSUFBSSxDQUFDO1FBU2pCLFdBQU0sR0FBRyxJQUFJLFlBQVksRUFBTyxDQUFDO0lBTWpCLENBQUM7SUFFakIsUUFBUTtRQUNOLElBQUksSUFBSSxDQUFDLEtBQUssRUFBRTtZQUNkLE1BQU0sVUFBVSxHQUFHLElBQUksQ0FBQyxlQUFlLENBQUMsSUFBSSxDQUFDLEtBQUssRUFBRSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsTUFBTSxHQUFHLENBQUMsQ0FBQyxDQUFDLENBQUM7WUFDN0UsSUFBSSxDQUFDLFVBQVUsR0FBRyxVQUFVLENBQUMsQ0FBQyxDQUFDLENBQUM7WUFDaEMsSUFBSSxDQUFDLFlBQVksR0FBRyxVQUFVLENBQUMsQ0FBQyxDQUFDLENBQUM7WUFDbEMsSUFBSSxDQUFDLFdBQVcsR0FBRyxVQUFVLENBQUMsQ0FBQyxDQUFDLENBQUM7U0FDbEM7UUFDRCxJQUFJLENBQUMsU0FBUyxHQUFHLEtBQUssQ0FBQztJQUN6QixDQUFDO0lBRUQsU0FBUyxDQUFDLEtBQUs7UUFDYixJQUFJLENBQUMsTUFBTSxDQUFDLElBQUksQ0FBQyxLQUFLLENBQUMsQ0FBQztJQUMxQixDQUFDO0lBRUQsZUFBZSxDQUFDLEdBQUcsRUFBRSxTQUFTO1FBQzVCLE1BQU0sR0FBRyxHQUFHLEVBQUUsQ0FBQztRQUNmLEtBQUssSUFBSSxDQUFDLEdBQUcsQ0FBQyxFQUFFLENBQUMsR0FBRyxHQUFHLENBQUMsTUFBTSxFQUFFLENBQUMsSUFBSSxTQUFTLEVBQUU7WUFDOUMsTUFBTSxLQUFLLEdBQUcsR0FBRyxDQUFDLEtBQUssQ0FBQyxDQUFDLEVBQUUsQ0FBQyxHQUFHLFNBQVMsQ0FBQyxDQUFDO1lBQzFDLEdBQUcsQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUM7U0FDakI7UUFDRCxPQUFPLEdBQUcsQ0FBQztJQUNiLENBQUM7OztZQS9DRixTQUFTLFNBQUM7Z0JBQ1QsUUFBUSxFQUFFLFlBQVk7Z0JBQ3RCLHloREFBc0M7YUFDdkM7Ozs7b0JBR0UsS0FBSzsyQkFLTCxLQUFLOzBCQUdMLEtBQUs7cUJBR0wsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7Q29tcG9uZW50LCBFdmVudEVtaXR0ZXIsIElucHV0LCBPbkluaXQsIE91dHB1dH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ3dhYy1tb3NhaWMnLFxuICB0ZW1wbGF0ZVVybDogJy4vbW9zYWljLmNvbXBvbmVudC5odG1sJ1xufSlcbmV4cG9ydCBjbGFzcyBNb3NhaWNDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xuXG4gIEBJbnB1dCgpXG4gIGl0ZW1zOiBbXTtcblxuICBpc0xvYWRpbmcgPSB0cnVlO1xuXG4gIEBJbnB1dCgpXG4gIGxhYmVsQnV0dG9uczogc3RyaW5nO1xuXG4gIEBJbnB1dCgpXG4gIGljb25CdXR0b25zOiBzdHJpbmc7XG5cbiAgQE91dHB1dCgpXG4gIGltcG9ydCA9IG5ldyBFdmVudEVtaXR0ZXI8YW55PigpO1xuXG4gIGNvbHVtbkxlZnQ6IFtdO1xuICBjb2x1bW5SaWdodDogW107XG4gIGNvbHVtbkNlbnRlcjogW107XG5cbiAgY29uc3RydWN0b3IoKSB7IH1cblxuICBuZ09uSW5pdCgpOiB2b2lkIHtcbiAgICBpZiAodGhpcy5pdGVtcykge1xuICAgICAgY29uc3Qgc3BsaXRJdGVtcyA9IHRoaXMuc2xpY2VJbnRvQ2h1bmtzKHRoaXMuaXRlbXMsICh0aGlzLml0ZW1zLmxlbmd0aCAvIDMpKTtcbiAgICAgIHRoaXMuY29sdW1uTGVmdCA9IHNwbGl0SXRlbXNbMF07XG4gICAgICB0aGlzLmNvbHVtbkNlbnRlciA9IHNwbGl0SXRlbXNbMV07XG4gICAgICB0aGlzLmNvbHVtblJpZ2h0ID0gc3BsaXRJdGVtc1syXTtcbiAgICB9XG4gICAgdGhpcy5pc0xvYWRpbmcgPSBmYWxzZTtcbiAgfVxuXG4gIGVtaXRJbmRleChpbmRleCkge1xuICAgIHRoaXMuaW1wb3J0LmVtaXQoaW5kZXgpO1xuICB9XG5cbiAgc2xpY2VJbnRvQ2h1bmtzKGFyciwgY2h1bmtTaXplKSB7XG4gICAgY29uc3QgcmVzID0gW107XG4gICAgZm9yIChsZXQgaSA9IDA7IGkgPCBhcnIubGVuZ3RoOyBpICs9IGNodW5rU2l6ZSkge1xuICAgICAgY29uc3QgY2h1bmsgPSBhcnIuc2xpY2UoaSwgaSArIGNodW5rU2l6ZSk7XG4gICAgICByZXMucHVzaChjaHVuayk7XG4gICAgfVxuICAgIHJldHVybiByZXM7XG4gIH1cblxufVxuIl19
|
|
@@ -3784,13 +3784,18 @@ class BlockWithCheckboxComponent {
|
|
|
3784
3784
|
this.copyAction = new EventEmitter();
|
|
3785
3785
|
this.worldAction = new EventEmitter();
|
|
3786
3786
|
this.checkboxAction = new EventEmitter();
|
|
3787
|
+
this.nameRadio = 'wacBlockCheckboxRadio';
|
|
3788
|
+
this.isFirst = false;
|
|
3789
|
+
this.opacity = '.45';
|
|
3787
3790
|
}
|
|
3788
3791
|
ngOnInit() {
|
|
3792
|
+
this.randomLabelName = 'radioBlock' + Math.random() * (900 - 700) + 700;
|
|
3789
3793
|
}
|
|
3790
3794
|
eventSelected(event) {
|
|
3791
|
-
|
|
3792
|
-
|
|
3795
|
+
console.log(event);
|
|
3796
|
+
this.selected = event.target.checked;
|
|
3793
3797
|
this.checkboxAction.emit(this.selected);
|
|
3798
|
+
this.isFirst = false;
|
|
3794
3799
|
}
|
|
3795
3800
|
eventCopy() {
|
|
3796
3801
|
this.copyAction.emit(true);
|
|
@@ -3798,11 +3803,14 @@ class BlockWithCheckboxComponent {
|
|
|
3798
3803
|
eventWorld() {
|
|
3799
3804
|
this.worldAction.emit(true);
|
|
3800
3805
|
}
|
|
3806
|
+
removeFirstClass() {
|
|
3807
|
+
document.querySelectorAll('.firstWacRadioBLock')[0].classList.remove('firstWacRadioBLock');
|
|
3808
|
+
}
|
|
3801
3809
|
}
|
|
3802
3810
|
BlockWithCheckboxComponent.decorators = [
|
|
3803
3811
|
{ type: Component, args: [{
|
|
3804
3812
|
selector: 'wac-block-with-checkbox',
|
|
3805
|
-
template: "<div class=\"block-with-checkbox\">\n <div class=\"block-with-checkbox__left\">\n <div class=\"wac-radio-block\">\n <div class=\"wac-radio__row\">\n <input type=\"
|
|
3813
|
+
template: "<div class=\"block-with-checkbox\" [ngClass]=\"{'selected': inputRadioA.checked, 'firstWacRadioBLock': isFirst}\" [style.opacity]=\"opacity\" (mouseover)=\"removeFirstClass()\">\n <div class=\"block-with-checkbox__left\" (click)=\"inputRadioA.click()\">\n <div class=\"wac-radio-block\">\n <div class=\"wac-radio__row\">\n <input #inputRadioA [name]=\"nameRadio\" type=\"radio\" [value]=\"selected\" (change)=\"eventSelected($event)\" [id]=\"randomLabelName\">\n <label [for]=\"randomLabelName\"></label>\n </div>\n </div>\n </div>\n <div class=\"block-with-checkbox__center\" (click)=\"inputRadioA.click()\">\n <ng-content></ng-content>\n </div>\n <div class=\"block-with-checkbox__right\">\n <div><wac-button extraClasses=\"is-blue opacity static-width\" [iconFontSize]=\"18\" [icon]=\"iconCopy\" (click)=\"eventCopy()\"></wac-button></div>\n <div><wac-button extraClasses=\"is-green opacity static-width\" [iconFontSize]=\"18\" [icon]=\"iconWorld\" (click)=\"eventWorld()\"></wac-button></div>\n </div>\n</div>\n"
|
|
3806
3814
|
},] }
|
|
3807
3815
|
];
|
|
3808
3816
|
BlockWithCheckboxComponent.ctorParameters = () => [];
|
|
@@ -3812,7 +3820,10 @@ BlockWithCheckboxComponent.propDecorators = {
|
|
|
3812
3820
|
iconWorld: [{ type: Input }],
|
|
3813
3821
|
copyAction: [{ type: Output }],
|
|
3814
3822
|
worldAction: [{ type: Output }],
|
|
3815
|
-
checkboxAction: [{ type: Output }]
|
|
3823
|
+
checkboxAction: [{ type: Output }],
|
|
3824
|
+
nameRadio: [{ type: Input }],
|
|
3825
|
+
isFirst: [{ type: Input }],
|
|
3826
|
+
opacity: [{ type: Input }]
|
|
3816
3827
|
};
|
|
3817
3828
|
|
|
3818
3829
|
class ConfirmDeleteComponent {
|
|
@@ -3853,20 +3864,41 @@ ConfirmDeleteComponent.propDecorators = {
|
|
|
3853
3864
|
class MosaicComponent {
|
|
3854
3865
|
constructor() {
|
|
3855
3866
|
this.isLoading = true;
|
|
3867
|
+
this.import = new EventEmitter();
|
|
3856
3868
|
}
|
|
3857
3869
|
ngOnInit() {
|
|
3870
|
+
if (this.items) {
|
|
3871
|
+
const splitItems = this.sliceIntoChunks(this.items, (this.items.length / 3));
|
|
3872
|
+
this.columnLeft = splitItems[0];
|
|
3873
|
+
this.columnCenter = splitItems[1];
|
|
3874
|
+
this.columnRight = splitItems[2];
|
|
3875
|
+
}
|
|
3876
|
+
this.isLoading = false;
|
|
3877
|
+
}
|
|
3878
|
+
emitIndex(index) {
|
|
3879
|
+
this.import.emit(index);
|
|
3880
|
+
}
|
|
3881
|
+
sliceIntoChunks(arr, chunkSize) {
|
|
3882
|
+
const res = [];
|
|
3883
|
+
for (let i = 0; i < arr.length; i += chunkSize) {
|
|
3884
|
+
const chunk = arr.slice(i, i + chunkSize);
|
|
3885
|
+
res.push(chunk);
|
|
3886
|
+
}
|
|
3887
|
+
return res;
|
|
3858
3888
|
}
|
|
3859
3889
|
}
|
|
3860
3890
|
MosaicComponent.decorators = [
|
|
3861
3891
|
{ type: Component, args: [{
|
|
3862
3892
|
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\"></div>\n <div class=\"wac-mosaic__wrapper__column\" *ngIf=\"
|
|
3864
|
-
styles: [".wac-mosaic__loader{min-height:400px;width:100%;display:flex;justify-content:center;align-items:center}"]
|
|
3893
|
+
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 class=\"hover\">\n <wac-button [icon]=\"iconButtons\" [label]=\"labelButtons\" [extraClasses]=\"'is-success'\" (click)=\"emitIndex(i)\"></wac-button>\n </div>\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 class=\"hover\">\n <wac-button [icon]=\"iconButtons\" [label]=\"labelButtons\" [extraClasses]=\"'is-success'\" (click)=\"emitIndex(i + this.columnLeft.length)\"></wac-button>\n </div>\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 class=\"hover\">\n <wac-button [icon]=\"iconButtons\" [label]=\"labelButtons\" [extraClasses]=\"'is-success'\" (click)=\"emitIndex(i + this.columnLeft.length + this.columnCenter.length)\"></wac-button>\n </div>\n </div>\n </div>\n </div>\n</div>\n"
|
|
3865
3894
|
},] }
|
|
3866
3895
|
];
|
|
3867
3896
|
MosaicComponent.ctorParameters = () => [];
|
|
3868
3897
|
MosaicComponent.propDecorators = {
|
|
3869
|
-
items: [{ type: Input }]
|
|
3898
|
+
items: [{ type: Input }],
|
|
3899
|
+
labelButtons: [{ type: Input }],
|
|
3900
|
+
iconButtons: [{ type: Input }],
|
|
3901
|
+
import: [{ type: Output }]
|
|
3870
3902
|
};
|
|
3871
3903
|
|
|
3872
3904
|
const components = [
|