Skip to content

Commit

Permalink
feat(control component): implement separate component for reactive fo…
Browse files Browse the repository at this point in the history
…rm control

Closes #87
  • Loading branch information
BioPhoton committed Apr 20, 2018
1 parent 944254d commit 4df3b9f
Show file tree
Hide file tree
Showing 31 changed files with 871 additions and 190 deletions.
Binary file modified @packaged/angular-star-rating.tgz
Binary file not shown.
@@ -1 +1 @@
{"__symbolic":"module","version":4,"metadata":{"ClickEvent":{"__symbolic":"interface"},"HoverRatingChangeEvent":{"__symbolic":"interface"},"RatingChangeEvent":{"__symbolic":"interface"},"StarRatingConfig":{"__symbolic":"class","members":{}},"StarRatingUtils":{"__symbolic":"class","members":{},"statics":{"getHalfStarVisible":{"__symbolic":"function","parameters":["rating"],"value":{"__symbolic":"binop","operator":">","left":{"__symbolic":"call","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"Math"},"member":"abs"},"arguments":[{"__symbolic":"binop","operator":"%","left":{"__symbolic":"reference","name":"rating"},"right":1}]},"right":0}},"isDigitKeyEventCode":{"__symbolic":"function","parameters":["eventCode"],"value":{"__symbolic":"binop","operator":"===","left":{"__symbolic":"call","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"eventCode"},"member":"indexOf"},"arguments":["Digit"]},"right":0}}}},"StarRating":{"__symbolic":"class","members":{"setRating":[{"__symbolic":"method"}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"StarRatingConfigService"}]}],"svgVisible":[{"__symbolic":"method"}],"interactionPossible":[{"__symbolic":"method"}],"setColor":[{"__symbolic":"method"}],"setHalfStarVisible":[{"__symbolic":"method"}],"getComponentClassNames":[{"__symbolic":"method"}],"increment":[{"__symbolic":"method"}],"decrement":[{"__symbolic":"method"}],"reset":[{"__symbolic":"method"}]}},"StarRatingConfigService":{"__symbolic":"class","members":{"getColor":[{"__symbolic":"method"}],"getHalfStarVisible":[{"__symbolic":"method"}]}},"StarRatingComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","name":"StarRating"},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":15,"character":1},"arguments":[{"selector":"star-rating-comp","providers":[{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR","line":10,"character":11},"useExisting":{"__symbolic":"reference","name":"StarRatingComponent"},"multi":true}],"inputs":["getHalfStarVisible","getColor","showHalfStars","hoverEnabled","rating","step","disabled","readOnly","space","starType","size","speed","numOfStars","direction","staticColor","labelPosition","labelText","id"],"outputs":["starClickChange","ratingChange","hoverRatingChange"],"styles":[],"template":"<div id=\"{{id}}\"\n class=\"rating {{getComponentClassNames()}}\"\n tabindex=\"0\"\n (keydown)=\"onKeyDown($event)\"\n (blur)=\"onBlur($event)\"\n (focus)=\"onFocus($event)\"\n (mouseleave)=\"onStarHover(0)\">\n <div *ngIf=\"labelText\" class=\"label-value\">{{labelText}}</div>\n <div class=\"star-container\">\n <div class=\"star\"\n (mouseenter)=\"onStarHover(star)\"\n *ngFor=\"let star of stars\"\n (click)=\"onStarClicked(star)\">\n <i *ngIf=\"!svgVisible()\" class=\"star-empty {{classEmpty}}\"></i>\n <i *ngIf=\"!svgVisible()\" class=\"star-half {{classHalf}}\"></i>\n <i *ngIf=\"!svgVisible()\" class=\"star-filled {{classFilled}}\"></i>\n <svg *ngIf=\"svgVisible()\" class=\"star-empty\">\n <use xmlns:xlink=\"http://www.w3.org/1999/xlink\" [attr.xlink:href]=\"pathEmpty\"></use>\n </svg>\n <svg *ngIf=\"svgVisible()\" class=\"star-half\">\n <use xmlns:xlink=\"http://www.w3.org/1999/xlink\" [attr.xlink:href]=\"pathHalf\"></use>\n </svg>\n <svg *ngIf=\"svgVisible()\" class=\"star-filled\">\n <use xmlns:xlink=\"http://www.w3.org/1999/xlink\" [attr.xlink:href]=\"pathFilled\"></use>\n </svg>\n </div>\n </div>\n</div>\n"}]}],"members":{"saveOnClick":[{"__symbolic":"method"}],"saveOnRatingChange":[{"__symbolic":"method"}],"saveOnHover":[{"__symbolic":"method"}],"saveOnTouch":[{"__symbolic":"method"}],"saveOnModelChange":[{"__symbolic":"method"}],"onKeyDown":[{"__symbolic":"method"}],"onBlur":[{"__symbolic":"method"}],"onFocus":[{"__symbolic":"method"}],"onStarHover":[{"__symbolic":"method"}],"writeValue":[{"__symbolic":"method"}],"registerOnChange":[{"__symbolic":"method"}],"registerOnTouched":[{"__symbolic":"method"}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"StarRatingConfigService"}]}],"setRating":[{"__symbolic":"method"}],"onStarClicked":[{"__symbolic":"method"}]}},"StarRatingModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":8,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":9,"character":12}],"declarations":[[{"__symbolic":"reference","name":"StarRatingComponent"}]],"exports":[[[{"__symbolic":"reference","name":"StarRatingComponent"}]]]}]}],"members":{},"statics":{"forRoot":{"__symbolic":"function","parameters":[],"value":{"ngModule":{"__symbolic":"reference","name":"StarRatingModule"},"providers":[{"__symbolic":"reference","name":"StarRatingConfigService"}]}},"forChild":{"__symbolic":"function","parameters":[],"value":{"ngModule":{"__symbolic":"reference","name":"StarRatingModule"},"providers":[]}}}}},"origins":{"ClickEvent":"./src/interfaces/click-event.interface","HoverRatingChangeEvent":"./src/interfaces/hover-rating-change-event.interface","RatingChangeEvent":"./src/interfaces/rating-change-event.interface","StarRatingConfig":"./src/interfaces/star-rating-config.interface","StarRatingUtils":"./src/services/star-rating.utils","StarRating":"./src/services/star-rating","StarRatingConfigService":"./src/services/star-rating-config.service","StarRatingComponent":"./src/components/star-rating.component","StarRatingModule":"./src/angular-star-rating.module"},"importAs":"angular-star-rating"}
{"__symbolic":"module","version":4,"metadata":{"ClickEvent":{"__symbolic":"interface"},"HoverRatingChangeEvent":{"__symbolic":"interface"},"RatingChangeEvent":{"__symbolic":"interface"},"StarRatingConfig":{"__symbolic":"class","members":{}},"StarRatingUtils":{"__symbolic":"class","members":{},"statics":{"getHalfStarVisible":{"__symbolic":"function","parameters":["rating"],"value":{"__symbolic":"binop","operator":">","left":{"__symbolic":"call","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"Math"},"member":"abs"},"arguments":[{"__symbolic":"binop","operator":"%","left":{"__symbolic":"reference","name":"rating"},"right":1}]},"right":0}},"isDigitKeyEventCode":{"__symbolic":"function","parameters":["eventCode"],"value":{"__symbolic":"binop","operator":"===","left":{"__symbolic":"call","expression":{"__symbolic":"select","expression":{"__symbolic":"reference","name":"eventCode"},"member":"indexOf"},"arguments":["Digit"]},"right":0}}}},"StarRating":{"__symbolic":"class","members":{"setRating":[{"__symbolic":"method"}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"StarRatingConfigService"}]}],"svgVisible":[{"__symbolic":"method"}],"interactionPossible":[{"__symbolic":"method"}],"setColor":[{"__symbolic":"method"}],"setHalfStarVisible":[{"__symbolic":"method"}],"getComponentClassNames":[{"__symbolic":"method"}],"increment":[{"__symbolic":"method"}],"decrement":[{"__symbolic":"method"}],"reset":[{"__symbolic":"method"}]}},"StarRatingConfigService":{"__symbolic":"class","members":{"getColor":[{"__symbolic":"method"}],"getHalfStarVisible":[{"__symbolic":"method"}]}},"StarRatingComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","name":"StarRating"},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":8,"character":1},"arguments":[{"selector":"star-rating","inputs":["getHalfStarVisible","getColor","showHalfStars","hoverEnabled","rating","step","disabled","readOnly","space","starType","size","speed","numOfStars","direction","staticColor","labelPosition","labelText","id"],"outputs":["starClickChange","ratingChange","hoverRatingChange"],"styles":[],"template":"<div id=\"{{id}}\"\n class=\"rating {{getComponentClassNames()}}\"\n tabindex=\"0\"\n (keydown)=\"onKeyDown($event)\"\n (mouseleave)=\"onStarHover(0)\">\n <div *ngIf=\"labelText\" class=\"label-value\">{{labelText}}</div>\n <div class=\"star-container\">\n <div class=\"star\"\n (mouseenter)=\"onStarHover(star)\"\n *ngFor=\"let star of stars\"\n (click)=\"onStarClicked(star)\">\n <i *ngIf=\"!svgVisible()\" class=\"star-empty {{classEmpty}}\"></i>\n <i *ngIf=\"!svgVisible()\" class=\"star-half {{classHalf}}\"></i>\n <i *ngIf=\"!svgVisible()\" class=\"star-filled {{classFilled}}\"></i>\n <svg *ngIf=\"svgVisible()\" class=\"star-empty\">\n <use xmlns:xlink=\"http://www.w3.org/1999/xlink\" [attr.xlink:href]=\"pathEmpty\"></use>\n </svg>\n <svg *ngIf=\"svgVisible()\" class=\"star-half\">\n <use xmlns:xlink=\"http://www.w3.org/1999/xlink\" [attr.xlink:href]=\"pathHalf\"></use>\n </svg>\n <svg *ngIf=\"svgVisible()\" class=\"star-filled\">\n <use xmlns:xlink=\"http://www.w3.org/1999/xlink\" [attr.xlink:href]=\"pathFilled\"></use>\n </svg>\n </div>\n </div>\n</div>\n"}]}],"members":{"saveOnClick":[{"__symbolic":"method"}],"saveOnRatingChange":[{"__symbolic":"method"}],"saveOnHover":[{"__symbolic":"method"}],"onKeyDown":[{"__symbolic":"method"}],"onStarHover":[{"__symbolic":"method"}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"StarRatingConfigService"}]}],"setRating":[{"__symbolic":"method"}],"onStarClicked":[{"__symbolic":"method"}]}},"StarRatingControlComponent":{"__symbolic":"class","extends":{"__symbolic":"reference","name":"StarRating"},"decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":15,"character":1},"arguments":[{"selector":"star-rating-control","providers":[{"provide":{"__symbolic":"reference","module":"@angular/forms","name":"NG_VALUE_ACCESSOR","line":10,"character":11},"useExisting":{"__symbolic":"reference","name":"StarRatingControlComponent"},"multi":true}],"inputs":["getHalfStarVisible","getColor","showHalfStars","hoverEnabled","rating","step","disabled","readOnly","space","starType","size","speed","numOfStars","direction","staticColor","labelPosition","labelText","id"],"outputs":["starClickChange","ratingChange","hoverRatingChange"],"styles":[],"template":"<div id=\"{{id}}\"\n class=\"rating {{getComponentClassNames()}}\"\n tabindex=\"0\"\n (keydown)=\"onKeyDown($event)\"\n (blur)=\"onBlur($event)\"\n (focus)=\"onFocus($event)\"\n (mouseleave)=\"onStarHover(0)\">\n <div *ngIf=\"labelText\" class=\"label-value\">{{labelText}}</div>\n <div class=\"star-container\">\n <div class=\"star\"\n (mouseenter)=\"onStarHover(star)\"\n *ngFor=\"let star of stars\"\n (click)=\"onStarClicked(star)\">\n <i *ngIf=\"!svgVisible()\" class=\"star-empty {{classEmpty}}\"></i>\n <i *ngIf=\"!svgVisible()\" class=\"star-half {{classHalf}}\"></i>\n <i *ngIf=\"!svgVisible()\" class=\"star-filled {{classFilled}}\"></i>\n <svg *ngIf=\"svgVisible()\" class=\"star-empty\">\n <use xmlns:xlink=\"http://www.w3.org/1999/xlink\" [attr.xlink:href]=\"pathEmpty\"></use>\n </svg>\n <svg *ngIf=\"svgVisible()\" class=\"star-half\">\n <use xmlns:xlink=\"http://www.w3.org/1999/xlink\" [attr.xlink:href]=\"pathHalf\"></use>\n </svg>\n <svg *ngIf=\"svgVisible()\" class=\"star-filled\">\n <use xmlns:xlink=\"http://www.w3.org/1999/xlink\" [attr.xlink:href]=\"pathFilled\"></use>\n </svg>\n </div>\n </div>\n</div>\n"}]}],"members":{"saveOnClick":[{"__symbolic":"method"}],"saveOnRatingChange":[{"__symbolic":"method"}],"saveOnHover":[{"__symbolic":"method"}],"saveOnTouch":[{"__symbolic":"method"}],"saveOnModelChange":[{"__symbolic":"method"}],"onKeyDown":[{"__symbolic":"method"}],"onBlur":[{"__symbolic":"method"}],"onFocus":[{"__symbolic":"method"}],"onStarHover":[{"__symbolic":"method"}],"writeValue":[{"__symbolic":"method"}],"registerOnChange":[{"__symbolic":"method"}],"registerOnTouched":[{"__symbolic":"method"}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"StarRatingConfigService"}]}],"setRating":[{"__symbolic":"method"}],"onStarClicked":[{"__symbolic":"method"}]}},"StarRatingModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":12,"character":1},"arguments":[{"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":13,"character":12}],"declarations":[[{"__symbolic":"reference","name":"StarRatingComponent"},{"__symbolic":"reference","name":"StarRatingControlComponent"}]],"exports":[[[{"__symbolic":"reference","name":"StarRatingComponent"},{"__symbolic":"reference","name":"StarRatingControlComponent"}]]]}]}],"members":{},"statics":{"forRoot":{"__symbolic":"function","parameters":[],"value":{"ngModule":{"__symbolic":"reference","name":"StarRatingModule"},"providers":[{"__symbolic":"reference","name":"StarRatingConfigService"}]}},"forChild":{"__symbolic":"function","parameters":[],"value":{"ngModule":{"__symbolic":"reference","name":"StarRatingModule"},"providers":[]}}}}},"origins":{"ClickEvent":"./src/interfaces/click-event.interface","HoverRatingChangeEvent":"./src/interfaces/hover-rating-change-event.interface","RatingChangeEvent":"./src/interfaces/rating-change-event.interface","StarRatingConfig":"./src/interfaces/star-rating-config.interface","StarRatingUtils":"./src/services/star-rating.utils","StarRating":"./src/services/star-rating","StarRatingConfigService":"./src/services/star-rating-config.service","StarRatingComponent":"./src/components/star-rating/star-rating.component","StarRatingControlComponent":"./src/components/star-rating-control/star-rating-control.component","StarRatingModule":"./src/angular-star-rating.module"},"importAs":"angular-star-rating"}

0 comments on commit 4df3b9f

Please sign in to comment.