ng-star-rate
Version:
A simple star rating library
116 lines (110 loc) • 9.65 kB
JavaScript
import { Component, Output, Input, EventEmitter, ElementRef, NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { CommonModule } from '@angular/common';
/**
* @fileoverview added by tsickle
* @suppress {checkTypes} checked by tsc
*/
var RatingComponent = /** @class */ (function () {
function RatingComponent(el) {
this.el = el;
this.ratingSelection = new EventEmitter();
}
/**
* @return {?}
*/
RatingComponent.prototype.ngOnInit = /**
* @return {?}
*/
function () {
var /** @type {?} */ style = "\n .active {color :" + this.selctedColor + "; }\n .list:hover .star {color: " + this.selctedColor + "; }\n ";
this.createStyle(style);
this.generateRating();
};
/**
* @param {?} style
* @return {?}
*/
RatingComponent.prototype.createStyle = /**
* @param {?} style
* @return {?}
*/
function (style) {
var /** @type {?} */ styleElement = document.createElement('style');
styleElement.appendChild(document.createTextNode(style));
this.el.nativeElement.appendChild(styleElement);
};
/**
* @return {?}
*/
RatingComponent.prototype.generateRating = /**
* @return {?}
*/
function () {
this.stars = Array.from({ length: this.maxRating }, function (v, k) { return k + 1; });
};
/**
* @param {?} item
* @return {?}
*/
RatingComponent.prototype.rate = /**
* @param {?} item
* @return {?}
*/
function (item) {
this.star = (item <= this.maxRating && item >= 0) ?
(this.star = this.star === item ? item - 1 : item) : this.star;
this.ratingSelection.emit(this.star);
};
RatingComponent.decorators = [
{ type: Component, args: [{
selector: 'lib-star-rate',
// templateUrl: './rating.component.html',
template: "\n <div class=\"rating\">\n <ul class=\"list\">\n <li\n id=\"starId\"\n class=\"star\"\n *ngFor=\"let item of stars\"\n [ngClass]=\"{'active': item <= star}\"\n (click)=\"rate(item)\">\n <i class=\"fa\" [ngClass]=\"item <= star ? 'fa-star' : 'fa-star-o'\" aria-hidden=\"true\"></i>\n </li>\n </ul>\n <span *ngIf=\"showRatingCounter\">{{ star }} of {{ maxRating }}</span>\n </div>\n ",
styles: [
"\n .rating {\n font-family: \"Avenir\", Helvetica, Arial, sans-serif;\n font-size: 22px;\n color: #a7a8a8;\n }\n .list {\n margin: 0 0 5px 0;\n padding: 0;\n list-style-type: none;\n }\n .star {\n display: inline-block;\n cursor: pointer;\n }\n .star:hover ~ .star:not(.active) {\n color: inherit;\n }\n "
]
},] },
];
/** @nocollapse */
RatingComponent.ctorParameters = function () { return [
{ type: ElementRef }
]; };
RatingComponent.propDecorators = {
selctedColor: [{ type: Input }],
star: [{ type: Input }],
maxRating: [{ type: Input }],
showRatingCounter: [{ type: Input }],
ratingSelection: [{ type: Output }]
};
return RatingComponent;
}());
/**
* @fileoverview added by tsickle
* @suppress {checkTypes} checked by tsc
*/
var StarRateModule = /** @class */ (function () {
function StarRateModule() {
}
StarRateModule.decorators = [
{ type: NgModule, args: [{
declarations: [RatingComponent],
imports: [
BrowserModule,
CommonModule
],
exports: [RatingComponent]
},] },
];
return StarRateModule;
}());
/**
* @fileoverview added by tsickle
* @suppress {checkTypes} checked by tsc
*/
/**
* @fileoverview added by tsickle
* @suppress {checkTypes} checked by tsc
*/
export { StarRateModule, RatingComponent };
//# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibmctc3Rhci1yYXRlLmpzLm1hcCIsInNvdXJjZXMiOlsibmc6Ly9uZy1zdGFyLXJhdGUvbGliL3JhdGluZy9yYXRpbmcuY29tcG9uZW50LnRzIiwibmc6Ly9uZy1zdGFyLXJhdGUvbGliL3N0YXItcmF0ZS5tb2R1bGUudHMiXSwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBPbkluaXQsIE91dHB1dCwgSW5wdXQsIEV2ZW50RW1pdHRlciwgRWxlbWVudFJlZiB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdsaWItc3Rhci1yYXRlJyxcbiAgLy8gdGVtcGxhdGVVcmw6ICcuL3JhdGluZy5jb21wb25lbnQuaHRtbCcsXG4gIHRlbXBsYXRlOiBgXG4gIDxkaXYgY2xhc3M9XCJyYXRpbmdcIj5cbiAgICA8dWwgY2xhc3M9XCJsaXN0XCI+XG4gICAgICA8bGlcbiAgICAgICAgaWQ9XCJzdGFySWRcIlxuICAgICAgICBjbGFzcz1cInN0YXJcIlxuICAgICAgICAqbmdGb3I9XCJsZXQgaXRlbSBvZiBzdGFyc1wiXG4gICAgICAgIFtuZ0NsYXNzXT1cInsnYWN0aXZlJzogaXRlbSA8PSBzdGFyfVwiXG4gICAgICAgIChjbGljayk9XCJyYXRlKGl0ZW0pXCI+XG4gICAgICAgIDxpIGNsYXNzPVwiZmFcIiBbbmdDbGFzc109XCJpdGVtIDw9IHN0YXIgPyAnZmEtc3RhcicgOiAnZmEtc3Rhci1vJ1wiIGFyaWEtaGlkZGVuPVwidHJ1ZVwiPjwvaT5cbiAgICAgIDwvbGk+XG4gICAgPC91bD5cbiAgICA8c3BhbiAqbmdJZj1cInNob3dSYXRpbmdDb3VudGVyXCI+e3sgc3RhciB9fSBvZiB7eyBtYXhSYXRpbmcgfX08L3NwYW4+XG4gIDwvZGl2PlxuICBgLFxuICBzdHlsZXM6IFtcbiAgICBgXG4gICAgICAucmF0aW5nIHtcbiAgICAgICAgZm9udC1mYW1pbHk6IFwiQXZlbmlyXCIsIEhlbHZldGljYSwgQXJpYWwsIHNhbnMtc2VyaWY7XG4gICAgICAgIGZvbnQtc2l6ZTogMjJweDtcbiAgICAgICAgY29sb3I6ICNhN2E4YTg7XG4gICAgICB9XG4gICAgICAubGlzdCB7XG4gICAgICAgIG1hcmdpbjogMCAwIDVweCAwO1xuICAgICAgICBwYWRkaW5nOiAwO1xuICAgICAgICBsaXN0LXN0eWxlLXR5cGU6IG5vbmU7XG4gICAgICB9XG4gICAgICAuc3RhciB7XG4gICAgICAgIGRpc3BsYXk6IGlubGluZS1ibG9jaztcbiAgICAgICAgY3Vyc29yOiBwb2ludGVyO1xuICAgICAgfVxuICAgICAgLnN0YXI6aG92ZXIgfiAuc3Rhcjpub3QoLmFjdGl2ZSkge1xuICAgICAgICBjb2xvcjogaW5oZXJpdDtcbiAgICAgIH1cbiAgYFxuICBdXG59KVxuZXhwb3J0IGNsYXNzIFJhdGluZ0NvbXBvbmVudCBpbXBsZW1lbnRzIE9uSW5pdCB7XG4gIEBJbnB1dCgpIHNlbGN0ZWRDb2xvcjogc3RyaW5nO1xuICBASW5wdXQoKSBzdGFyOiBudW1iZXI7XG4gIEBJbnB1dCgpIG1heFJhdGluZzogbnVtYmVyO1xuICBASW5wdXQoKSBzaG93UmF0aW5nQ291bnRlcjogYm9vbGVhbjtcbiAgQE91dHB1dCgpIHJhdGluZ1NlbGVjdGlvbjogRXZlbnRFbWl0dGVyPG51bWJlcj4gPSBuZXcgRXZlbnRFbWl0dGVyPG51bWJlcj4oKTtcbiAgc3RhcnM6IEFycmF5PG51bWJlcj47XG5cbiAgY29uc3RydWN0b3IocHJpdmF0ZSBlbDogRWxlbWVudFJlZikgeyB9XG5cbiAgbmdPbkluaXQoKSB7XG4gICAgY29uc3Qgc3R5bGUgPSBgXG4gICAgLmFjdGl2ZSB7Y29sb3IgOiR7dGhpcy5zZWxjdGVkQ29sb3J9OyB9XG4gICAgLmxpc3Q6aG92ZXIgLnN0YXIge2NvbG9yOiAke3RoaXMuc2VsY3RlZENvbG9yfTsgfVxuICAgYDtcbiAgICB0aGlzLmNyZWF0ZVN0eWxlKHN0eWxlKTtcbiAgICB0aGlzLmdlbmVyYXRlUmF0aW5nKCk7XG4gIH1cblxuICBjcmVhdGVTdHlsZShzdHlsZTogc3RyaW5nKTogdm9pZCB7XG4gICAgY29uc3Qgc3R5bGVFbGVtZW50ID0gZG9jdW1lbnQuY3JlYXRlRWxlbWVudCgnc3R5bGUnKTtcbiAgICBzdHlsZUVsZW1lbnQuYXBwZW5kQ2hpbGQoZG9jdW1lbnQuY3JlYXRlVGV4dE5vZGUoc3R5bGUpKTtcbiAgICB0aGlzLmVsLm5hdGl2ZUVsZW1lbnQuYXBwZW5kQ2hpbGQoc3R5bGVFbGVtZW50KTtcbiAgfVxuXG4gIGdlbmVyYXRlUmF0aW5nKCkge1xuICAgIHRoaXMuc3RhcnMgPSBBcnJheS5mcm9tKHsgbGVuZ3RoOiB0aGlzLm1heFJhdGluZyB9LCAodiwgaykgPT4gayArIDEpO1xuICB9XG5cbiAgcmF0ZShpdGVtOiBudW1iZXIpIHtcbiAgICB0aGlzLnN0YXIgPSAoaXRlbSA8PSB0aGlzLm1heFJhdGluZyAmJiBpdGVtID49IDApID9cbiAgICAgICh0aGlzLnN0YXIgPSB0aGlzLnN0YXIgPT09IGl0ZW0gPyBpdGVtIC0gMSA6IGl0ZW0pIDogdGhpcy5zdGFyO1xuICAgIHRoaXMucmF0aW5nU2VsZWN0aW9uLmVtaXQodGhpcy5zdGFyKTtcbiAgfVxufVxuIiwiaW1wb3J0IHsgTmdNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IEJyb3dzZXJNb2R1bGUgfSBmcm9tICdAYW5ndWxhci9wbGF0Zm9ybS1icm93c2VyJztcbmltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XG5pbXBvcnQgeyBSYXRpbmdDb21wb25lbnQgfSBmcm9tICcuL3JhdGluZy9yYXRpbmcuY29tcG9uZW50JztcblxuQE5nTW9kdWxlKHtcbiAgZGVjbGFyYXRpb25zOiBbUmF0aW5nQ29tcG9uZW50XSxcbiAgaW1wb3J0czogW1xuICAgIEJyb3dzZXJNb2R1bGUsXG4gICAgQ29tbW9uTW9kdWxlXG4gIF0sXG4gIGV4cG9ydHM6IFtSYXRpbmdDb21wb25lbnRdXG59KVxuZXhwb3J0IGNsYXNzIFN0YXJSYXRlTW9kdWxlIHsgfVxuIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7Ozs7O0FBQUE7SUFrREUseUJBQW9CLEVBQWM7UUFBZCxPQUFFLEdBQUYsRUFBRSxDQUFZOytCQUhnQixJQUFJLFlBQVksRUFBVTtLQUdyQzs7OztJQUV2QyxrQ0FBUTs7O0lBQVI7UUFDRSxxQkFBTSxLQUFLLEdBQUcsMkJBQ0ksSUFBSSxDQUFDLFlBQVksMkNBQ1AsSUFBSSxDQUFDLFlBQVksYUFDN0MsQ0FBQztRQUNELElBQUksQ0FBQyxXQUFXLENBQUMsS0FBSyxDQUFDLENBQUM7UUFDeEIsSUFBSSxDQUFDLGNBQWMsRUFBRSxDQUFDO0tBQ3ZCOzs7OztJQUVELHFDQUFXOzs7O0lBQVgsVUFBWSxLQUFhO1FBQ3ZCLHFCQUFNLFlBQVksR0FBRyxRQUFRLENBQUMsYUFBYSxDQUFDLE9BQU8sQ0FBQyxDQUFDO1FBQ3JELFlBQVksQ0FBQyxXQUFXLENBQUMsUUFBUSxDQUFDLGNBQWMsQ0FBQyxLQUFLLENBQUMsQ0FBQyxDQUFDO1FBQ3pELElBQUksQ0FBQyxFQUFFLENBQUMsYUFBYSxDQUFDLFdBQVcsQ0FBQyxZQUFZLENBQUMsQ0FBQztLQUNqRDs7OztJQUVELHdDQUFjOzs7SUFBZDtRQUNFLElBQUksQ0FBQyxLQUFLLEdBQUcsS0FBSyxDQUFDLElBQUksQ0FBQyxFQUFFLE1BQU0sRUFBRSxJQUFJLENBQUMsU0FBUyxFQUFFLEVBQUUsVUFBQyxDQUFDLEVBQUUsQ0FBQyxJQUFLLE9BQUEsQ0FBQyxHQUFHLENBQUMsR0FBQSxDQUFDLENBQUM7S0FDdEU7Ozs7O0lBRUQsOEJBQUk7Ozs7SUFBSixVQUFLLElBQVk7UUFDZixJQUFJLENBQUMsSUFBSSxHQUFHLENBQUMsSUFBSSxJQUFJLElBQUksQ0FBQyxTQUFTLElBQUksSUFBSSxJQUFJLENBQUM7YUFDN0MsSUFBSSxDQUFDLElBQUksR0FBRyxJQUFJLENBQUMsSUFBSSxLQUFLLElBQUksR0FBRyxJQUFJLEdBQUcsQ0FBQyxHQUFHLElBQUksSUFBSSxJQUFJLENBQUMsSUFBSSxDQUFDO1FBQ2pFLElBQUksQ0FBQyxlQUFlLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsQ0FBQztLQUN0Qzs7Z0JBekVGLFNBQVMsU0FBQztvQkFDVCxRQUFRLEVBQUUsZUFBZTs7b0JBRXpCLFFBQVEsRUFBRSxnY0FjVDtvQkFDRCxNQUFNLEVBQUU7d0JBQ04sMFpBa0JEO3FCQUNBO2lCQUNGOzs7O2dCQXpDd0QsVUFBVTs7OytCQTJDaEUsS0FBSzt1QkFDTCxLQUFLOzRCQUNMLEtBQUs7b0NBQ0wsS0FBSztrQ0FDTCxNQUFNOzswQkEvQ1Q7Ozs7Ozs7QUNBQTs7OztnQkFLQyxRQUFRLFNBQUM7b0JBQ1IsWUFBWSxFQUFFLENBQUMsZUFBZSxDQUFDO29CQUMvQixPQUFPLEVBQUU7d0JBQ1AsYUFBYTt3QkFDYixZQUFZO3FCQUNiO29CQUNELE9BQU8sRUFBRSxDQUFDLGVBQWUsQ0FBQztpQkFDM0I7O3lCQVpEOzs7Ozs7Ozs7Ozs7Ozs7In0=