angular-star-rating - npm Package Compare versions

Comparing version 2.0.0-rc.3 to 2.0.0-rc.4

dist/src/star-rating-config.d.ts

@@ -1,2 +0,2 @@
-import { starRatingSizes, starRatingSpeed, starRatingPosition, starRatingStarTypes, starRatingColors } from "./star-rating-struct";
+import { starRatingSizes, starRatingSpeed, starRatingPosition, starRatingStarTypes, starRatingColor } from "./star-rating-struct";
 /**
@@ -24,4 +24,4 @@ * Configuration service for the StarRating component.
     svgPathFilled: string;
-    getColor: (rating: number, numOfStars: number, staticColor?: starRatingColors) => starRatingColors;
+    getColor(rating: number, numOfStars: number, staticColor?: starRatingColor): starRatingColor;
     getHalfStarVisible(rating: number): boolean;
 }

dist/src/star-rating-config.js

@@ -39,29 +39,23 @@ "use strict";
     }
-    /*
-    getColor(rating: number, numOfStars: number, staticColor?: starRatingColors): starRatingColors {
-      rating = rating || 0;
-  
-      //if a fix color is set use this one
-      if (staticColor) {
-        return staticColor;
-      }
-  
-      //calculate size of smallest fraction
-      let fractionSize = numOfStars / 3;
-  
-      //apply color by fraction
-      let color: starRatingColors = 'default';
-      if (rating > 0) {
-        color = 'negative';
-      }
-      if (rating > fractionSize) {
-        color = 'ok';
-      }
-      if (rating > fractionSize * 2) {
-        color = 'positive';
-      }
-  
-      return color;
+    getColor(rating, numOfStars, staticColor) {
+        rating = rating || 0;
+        //if a fix color is set use this one
+        if (staticColor) {
+            return staticColor;
+        }
+        //calculate size of smallest fraction
+        let fractionSize = numOfStars / 3;
+        //apply color by fraction
+        let color = 'default';
+        if (rating > 0) {
+            color = 'negative';
+        }
+        if (rating > fractionSize) {
+            color = 'ok';
+        }
+        if (rating > fractionSize * 2) {
+            color = 'positive';
+        }
+        return color;
     }
-  */
     getHalfStarVisible(rating) {
@@ -68,0 +62,0 @@ return Math.abs(rating % 1) > 0;

dist/src/star-rating-struct.d.ts

 export declare type starRatingSizes = "small" | "medium" | "large";
-export declare type starRatingColors = "default" | "negative" | "ok" | "positive";
+export declare type starRatingColor = "default" | "negative" | "ok" | "positive";
 export declare type starRatingSpeed = "immediately" | "noticeable" | "slow";
@@ -7,2 +7,3 @@ export declare type starRatingPosition = "left" | "right" | "top" | "bottom";
 export declare type starRatingStarSpace = "no" | "between" | "around";
+export declare type starRatingDirection = "rtl" | "ltr";
 export interface IStarRatingOnClickEvent {
@@ -9,0 +10,0 @@ rating: number;

dist/src/star-rating.component.d.ts

 import { OnChanges, EventEmitter } from "@angular/core";
-import { starRatingSizes, starRatingSpeed, starRatingColors, starRatingPosition, starRatingStarSpace, starRatingStarTypes, IStarRatingOnClickEvent, IStarRatingOnRatingChangeEven } from "./star-rating-struct";
+import { starRatingSizes, starRatingSpeed, starRatingColor, starRatingPosition, starRatingStarSpace, starRatingStarTypes, IStarRatingOnClickEvent, IStarRatingOnRatingChangeEven, starRatingDirection } from "./star-rating-struct";
 export declare class StarRatingComponent implements OnChanges {
@@ -32,5 +32,5 @@ /**
      * @param staticColor
-     * @returns {starRatingColors}
+     * @returns {starRatingColor}
      */
-    static _getColor(rating: number, numOfStars: number, staticColor?: starRatingColors): starRatingColors;
+    static _getColor(rating: number, numOfStars: number, staticColor?: starRatingColor): starRatingColor;
     protected config: any;
@@ -53,7 +53,17 @@ /**
     /**
+     * labelVisible
+     */
+    protected _labelVisible: boolean;
+    labelVisible: boolean;
+    /**
      * staticColor
      */
-    protected _staticColor: starRatingColors;
-    staticColor: starRatingColors;
+    protected _staticColor: starRatingColor;
+    staticColor: starRatingColor;
     /**
+     * direction
+     */
+    protected _direction: starRatingDirection;
+    direction: starRatingDirection;
+    /**
      * numOfStars
@@ -106,3 +116,3 @@ */
      */
-    getColor: (rating: number, numOfStars: number, staticColor?: starRatingColors) => starRatingColors;
+    getColor: (rating: number, numOfStars: number, staticColor?: starRatingColor) => starRatingColor;
     /**
@@ -120,3 +130,3 @@ * getHalfStarVisible
     pathFilled: string;
-    color: starRatingColors;
+    color: starRatingColor;
     stars: Array<number>;
@@ -123,0 +133,0 @@ ratingAsInteger: number;

dist/src/star-rating.component.js

@@ -77,3 +77,3 @@ "use strict";
      * @param staticColor
-     * @returns {starRatingColors}
+     * @returns {starRatingColor}
      */
@@ -119,2 +119,8 @@ static _getColor(rating, numOfStars, staticColor) {
     }
+    get labelVisible() {
+        return this._labelVisible;
+    }
+    set labelVisible(value) {
+        this._labelVisible = !!value;
+    }
     get staticColor() {
@@ -128,2 +134,8 @@ return this._staticColor;
     }
+    get direction() {
+        return this._direction;
+    }
+    set direction(value) {
+        this._direction = value || undefined;
+    }
     get numOfStars() {
@@ -297,2 +309,5 @@ return this._numOfStars;
         }
+        if (valueChanged('direction', changes)) {
+            this.direction = changes['direction'].currentValue;
+        }
         if (valueChanged('size', changes)) {
@@ -329,2 +344,7 @@ this.size = changes['size'].currentValue;
     core_1.Input(),
+    __metadata("design:type", Boolean),
+    __metadata("design:paramtypes", [Boolean])
+], StarRatingComponent.prototype, "labelVisible", null);
+__decorate([
+    core_1.Input(),
     __metadata("design:type", String),
@@ -335,2 +355,7 @@ __metadata("design:paramtypes", [String])
     core_1.Input(),
+    __metadata("design:type", String),
+    __metadata("design:paramtypes", [String])
+], StarRatingComponent.prototype, "direction", null);
+__decorate([
+    core_1.Input(),
     __metadata("design:type", Number),
@@ -401,5 +426,5 @@ __metadata("design:paramtypes", [Number])
         <div id="{{id}}"
-     class="rating {{rating?'value-'+ratingAsInteger:'value-0'}} {{readOnly?'read-only':''}} {{disabled?'disabled':''}} {{halfStarVisible?'half':''}} {{space?'space-'+space:''}} {{labelVisible?'label-'+labelVisible:''}} {{labelPosition?'label-'+labelPosition:''}} {{color?'color-'+color:''}} {{starType?'star-'+starType:''}} {{speed}} {{size}}"
+     class="rating {{rating?'value-'+ratingAsInteger:'value-0'}} {{readOnly?'read-only':''}} {{disabled?'disabled':''}} {{halfStarVisible?'half':''}} {{space?'space-'+space:''}} {{labelVisible?'label-'+labelVisible:''}} {{labelPosition?'label-'+labelPosition:''}} {{color?'color-'+color:''}} {{starType?'star-'+starType:''}} {{speed}} {{size}} {{direction?'direction-'+direction:''}}"
     >
-                <div *ngIf="labelText" class="label-value">{{labelText}}</div>
+                <div *ngIf="labelVisible" class="label-value">{{labelText}}</div>
                 <div class="star-container">
@@ -406,0 +431,0 @@ <div class="star"

package.json

 {
   "name": "angular-star-rating",
   "description": "Angular Star Rating is a Angular2 component written in typescript.",
-  "version": "2.0.0-rc.3",
+  "version": "2.0.0-rc.4",
   "scripts": {
@@ -6,0 +6,0 @@ "build": "ngc -p tsconfig.json",

README.MD

@@ -41,8 +41,9 @@ # Angular Star Rating ⭐⭐⭐⭐⭐
 - [x] **size** - The different sizes of the component
-- [x] **spread** - Stars are spreaded over whole width or not
-- [x] **color** - A static color for the stars
+- [x] **space** - The space between the stars
+- [x] **staticColor** - A static color for the stars
 - [x] **disabled** - Component is in disabled mode
 - [x] **starType** - Stars can be displayed as svg, character or icon-font like fontawesome, glyphicons or ionicons
 - [x] **labelText** - The value of the label text
-- [x] **labelPosition** - The position of the label
+- [x] **labelPosition** - The position of the label text
+- [x] **labelVisible** - The visibility of the label text
 - [x] **speed** - The duration of the animation
@@ -162,3 +163,3 @@ - [x] **direction** - The direction of the component i.e. right to left
 
-**text**: string (Optional)  
+**labelText**: string (Optional)  
 The text next to the stars.  
@@ -185,2 +186,11 @@ Default: undefined
 
+**labelVisible**: string (Optional)  
+The visibility of the label text.  
+Default: true  
+
+```html
+<star-rating-comp [labelVisible]="false"></star-rating-comp>
+```
+<img src="https://raw.githubusercontent.com/BioPhoton/angular-star-rating/master/resources/properties/prop-label-visible_false.PNG" width="290">
+
 **space**: starRatingStarSpace (Optional)  
@@ -209,3 +219,3 @@ If the start use the whole space or not.
 
-**staticColor**: starRatingColors (Optional)  
+**staticColor**: starRatingColor (Optional)  
 Possible color names for the stars.  
@@ -212,0 +222,0 @@ Options: default, negative, middle, positive

src/star-rating-config.ts

@@ -7,3 +7,3 @@ import {Injectable} from '@angular/core';
   starRatingStarTypes,
-  starRatingColors
+  starRatingColor
 } from "./star-rating-struct";
@@ -49,5 +49,3 @@
 
-  getColor:(rating: number, numOfStars: number, staticColor?: starRatingColors) => starRatingColors;
-  /*
-  getColor(rating: number, numOfStars: number, staticColor?: starRatingColors): starRatingColors {
+  getColor(rating: number, numOfStars: number, staticColor?: starRatingColor): starRatingColor {
     rating = rating || 0;
@@ -64,3 +62,3 @@
     //apply color by fraction
-    let color: starRatingColors = 'default';
+    let color: starRatingColor = 'default';
     if (rating > 0) {
@@ -78,3 +76,2 @@ color = 'negative';
   }
-*/
   getHalfStarVisible(rating: number): boolean {
@@ -81,0 +78,0 @@ return Math.abs(rating % 1) > 0;

src/star-rating-struct.ts

 export type starRatingSizes = "small" | "medium" | "large";
-export type starRatingColors = "default" | "negative" | "ok" | "positive";
+export type starRatingColor = "default" | "negative" | "ok" | "positive";
 export type starRatingSpeed = "immediately" | "noticeable" | "slow";
@@ -7,2 +7,3 @@ export type starRatingPosition = "left" | "right" | "top" | "bottom";
 export type starRatingStarSpace= "no" | "between" | "around";
+export type starRatingDirection= "rtl" | "ltr";
 
@@ -9,0 +10,0 @@ export interface IStarRatingOnClickEvent {

src/star-rating.component.ts

@@ -5,3 +5,3 @@ import {Component, Input, OnChanges, Output, EventEmitter} from "@angular/core";
     starRatingSpeed,
-    starRatingColors,
+    starRatingColor,
     starRatingPosition,
@@ -11,3 +11,3 @@ starRatingStarSpace,
     IStarRatingOnClickEvent,
-    IStarRatingOnRatingChangeEven
+    IStarRatingOnRatingChangeEven, starRatingDirection
 } from "./star-rating-struct";
@@ -21,5 +21,5 @@ import {StarRatingConfig} from "./star-rating-config";
         <div id="{{id}}"
-     class="rating {{rating?'value-'+ratingAsInteger:'value-0'}} {{readOnly?'read-only':''}} {{disabled?'disabled':''}} {{halfStarVisible?'half':''}} {{space?'space-'+space:''}} {{labelVisible?'label-'+labelVisible:''}} {{labelPosition?'label-'+labelPosition:''}} {{color?'color-'+color:''}} {{starType?'star-'+starType:''}} {{speed}} {{size}}"
+     class="rating {{rating?'value-'+ratingAsInteger:'value-0'}} {{readOnly?'read-only':''}} {{disabled?'disabled':''}} {{halfStarVisible?'half':''}} {{space?'space-'+space:''}} {{labelVisible?'label-'+labelVisible:''}} {{labelPosition?'label-'+labelPosition:''}} {{color?'color-'+color:''}} {{starType?'star-'+starType:''}} {{speed}} {{size}} {{direction?'direction-'+direction:''}}"
     >
-                <div *ngIf="labelText" class="label-value">{{labelText}}</div>
+                <div *ngIf="labelVisible" class="label-value">{{labelText}}</div>
                 <div class="star-container">
@@ -92,5 +92,5 @@ <div class="star"
      * @param staticColor
-     * @returns {starRatingColors}
+     * @returns {starRatingColor}
      */
-    static _getColor(rating: number, numOfStars: number, staticColor?: starRatingColors): starRatingColors {
+    static _getColor(rating: number, numOfStars: number, staticColor?: starRatingColor): starRatingColor {
         rating = rating || 0;
@@ -107,3 +107,3 @@
         //apply color by fraction
-        let color: starRatingColors = 'default';
+        let color: starRatingColor = 'default';
         if (rating > 0) {
@@ -173,7 +173,23 @@ color = 'negative';
     /**
+     * labelVisible
+     */
+    protected _labelVisible: boolean;
+    get labelVisible(): boolean {
+        return this._labelVisible;
+    }
+
+    @Input()
+    set labelVisible(value: boolean) {
+        this._labelVisible = !!value;
+    }
+
+    /////////////////////////////////////////////
+
+
+    /**
      * staticColor
      */
-    protected _staticColor: starRatingColors;
+    protected _staticColor: starRatingColor;
 
-    get staticColor(): starRatingColors {
+    get staticColor(): starRatingColor {
         return this._staticColor;
@@ -183,3 +199,3 @@ }
     @Input()
-    set staticColor(value: starRatingColors) {
+    set staticColor(value: starRatingColor) {
         this._staticColor = value || undefined;
@@ -194,2 +210,19 @@
     /**
+     * direction
+     */
+    protected _direction: starRatingDirection;
+
+    get direction(): starRatingDirection {
+        return this._direction;
+    }
+
+    @Input()
+    set direction(value: starRatingDirection) {
+        this._direction = value || undefined;
+    }
+
+    /////////////////////////////////////////////
+
+
+    /**
      * numOfStars
@@ -374,3 +407,3 @@ */
     @Input()
-    getColor: (rating: number, numOfStars: number, staticColor?: starRatingColors) => starRatingColors;
+    getColor: (rating: number, numOfStars: number, staticColor?: starRatingColor) => starRatingColor;
     /////////////////////////////////////////////
@@ -403,3 +436,3 @@
 
-    color: starRatingColors;
+    color: starRatingColor;
     stars: Array<number>;
@@ -545,2 +578,6 @@ ratingAsInteger: number;
 
+        if (valueChanged('direction', changes)) {
+            this.direction = changes['direction'].currentValue;
+        }
+
         if (valueChanged('size', changes)) {
@@ -547,0 +584,0 @@ this.size = changes['size'].currentValue;

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Number of lines in readme file

323

increased by3.19%

Worsened metrics

Total package byte prevSize

152715

decreased by-91.22%

Number of package files

27

decreased by-71.58%

Lines of code

2121

decreased by-3.5%

No dependency changes