gnezim
115 lines
3.8 KiB
JavaScript
115 lines
3.8 KiB
JavaScript
import { forwardRef, EventEmitter, Component, ChangeDetectionStrategy, ViewEncapsulation, ChangeDetectorRef, Input, Output, NgModule } from '@angular/core';
|
|
import { CommonModule } from '@angular/common';
|
|
import { NG_VALUE_ACCESSOR } from '@angular/forms';
|
|
|
|
const RATING_VALUE_ACCESSOR = {
|
|
provide: NG_VALUE_ACCESSOR,
|
|
useExisting: forwardRef(() => Rating),
|
|
multi: true
|
|
};
|
|
class Rating {
|
|
constructor(cd) {
|
|
this.cd = cd;
|
|
this.stars = 5;
|
|
this.cancel = true;
|
|
this.iconOnClass = 'pi pi-star';
|
|
this.iconOffClass = 'pi pi-star-o';
|
|
this.iconCancelClass = 'pi pi-ban';
|
|
this.onRate = new EventEmitter();
|
|
this.onCancel = new EventEmitter();
|
|
this.onModelChange = () => { };
|
|
this.onModelTouched = () => { };
|
|
}
|
|
ngOnInit() {
|
|
this.starsArray = [];
|
|
for (let i = 0; i < this.stars; i++) {
|
|
this.starsArray[i] = i;
|
|
}
|
|
}
|
|
rate(event, i) {
|
|
if (!this.readonly && !this.disabled) {
|
|
this.value = (i + 1);
|
|
this.onModelChange(this.value);
|
|
this.onModelTouched();
|
|
this.onRate.emit({
|
|
originalEvent: event,
|
|
value: (i + 1)
|
|
});
|
|
}
|
|
event.preventDefault();
|
|
}
|
|
clear(event) {
|
|
if (!this.readonly && !this.disabled) {
|
|
this.value = null;
|
|
this.onModelChange(this.value);
|
|
this.onModelTouched();
|
|
this.onCancel.emit(event);
|
|
}
|
|
event.preventDefault();
|
|
}
|
|
writeValue(value) {
|
|
this.value = value;
|
|
this.cd.detectChanges();
|
|
}
|
|
registerOnChange(fn) {
|
|
this.onModelChange = fn;
|
|
}
|
|
registerOnTouched(fn) {
|
|
this.onModelTouched = fn;
|
|
}
|
|
setDisabledState(val) {
|
|
this.disabled = val;
|
|
this.cd.markForCheck();
|
|
}
|
|
}
|
|
Rating.decorators = [
|
|
{ type: Component, args: [{
|
|
selector: 'p-rating',
|
|
template: `
|
|
<div class="p-rating" [ngClass]="{'p-readonly': readonly, 'p-disabled': disabled}">
|
|
<span [attr.tabindex]="(disabled || readonly) ? null : '0'" *ngIf="cancel" (click)="clear($event)" (keydown.enter)="clear($event)" class="p-rating-icon p-rating-cancel" [ngClass]="iconCancelClass" [ngStyle]="iconCancelStyle"></span>
|
|
<span *ngFor="let star of starsArray;let i=index" class="p-rating-icon" [attr.tabindex]="(disabled || readonly) ? null : '0'" (click)="rate($event,i)" (keydown.enter)="rate($event,i)"
|
|
[ngClass]="(!value || i >= value) ? iconOffClass : iconOnClass"
|
|
[ngStyle]="(!value || i >= value) ? iconOffStyle : iconOnStyle"></span>
|
|
</div>
|
|
`,
|
|
providers: [RATING_VALUE_ACCESSOR],
|
|
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
encapsulation: ViewEncapsulation.None,
|
|
styles: [".p-rating-icon{cursor:pointer}.p-rating.p-rating-readonly .p-rating-icon{cursor:default}"]
|
|
},] }
|
|
];
|
|
Rating.ctorParameters = () => [
|
|
{ type: ChangeDetectorRef }
|
|
];
|
|
Rating.propDecorators = {
|
|
disabled: [{ type: Input }],
|
|
readonly: [{ type: Input }],
|
|
stars: [{ type: Input }],
|
|
cancel: [{ type: Input }],
|
|
iconOnClass: [{ type: Input }],
|
|
iconOnStyle: [{ type: Input }],
|
|
iconOffClass: [{ type: Input }],
|
|
iconOffStyle: [{ type: Input }],
|
|
iconCancelClass: [{ type: Input }],
|
|
iconCancelStyle: [{ type: Input }],
|
|
onRate: [{ type: Output }],
|
|
onCancel: [{ type: Output }]
|
|
};
|
|
class RatingModule {
|
|
}
|
|
RatingModule.decorators = [
|
|
{ type: NgModule, args: [{
|
|
imports: [CommonModule],
|
|
exports: [Rating],
|
|
declarations: [Rating]
|
|
},] }
|
|
];
|
|
|
|
/**
|
|
* Generated bundle index. Do not edit.
|
|
*/
|
|
|
|
export { RATING_VALUE_ACCESSOR, Rating, RatingModule };
|
|
//# sourceMappingURL=primeng-rating.js.map
|