angular-star-rating - npm Package Compare versions

Comparing version 1.1.0 to 1.2.0

CHANGELOG.md

@@ -0,1 +1,16 @@
+<a name="1.2.0"></a>
+# [1.2.0](https://github.com/BioPhoton/angular1-star-rating/compare/v1.1.0...v1.2.0) (2016-12-23)
+
+
+### Bug Fixes
+
+* **build:** rebuild project ([0119d9a](https://github.com/BioPhoton/angular1-star-rating/commit/0119d9a))
+
+
+### Features
+
+* **new bindings:** implement new bindings ([0df2441](https://github.com/BioPhoton/angular1-star-rating/commit/0df2441))
+
+
+
 <a name="1.1.0"></a>
@@ -2,0 +17,0 @@ # [1.1.0](https://github.com/BioPhoton/angular-star-rating/compare/v1.0.14...v1.1.0) (2016-12-21)

dist/star-rating.controller.d.ts

@@ -10,3 +10,3 @@ import IChangesObject = angular.IChangesObject;
     id?: string;
-    text?: string;
+    labelText?: string;
     staticColor?: starRatingColors;
@@ -83,3 +83,3 @@ labelPosition?: starRatingPosition;
     protected _id: string;
-    protected _text: string;
+    protected _labelText: string;
     protected _staticColor: starRatingColors;
@@ -127,3 +127,3 @@ protected _labelPosition: starRatingPosition;
     staticColor: starRatingColors;
-    text: string;
+    labelText: string;
     id: string;
@@ -130,0 +130,0 @@ setGetColor(func: any): void;

package.json

 {
   "name": "angular-star-rating",
-  "version": "1.1.0",
+  "version": "1.2.0",
   "license": "MIT",
@@ -13,4 +13,2 @@ "keywords": [
     "SVG",
-    "PNG",
-    "JPEG",
     "CSS",
@@ -26,3 +24,2 @@ "Pure CSS",
     "Angular1.5 Component",
-    "Angular2",
     "Typescript"
@@ -40,8 +37,8 @@ ],
     "type": "git",
-    "url": "git+https://github.com/BioPhoton/angular-star-rating.git"
+    "url": "git+https://github.com/BioPhoton/angular1-star-rating.git"
   },
   "bugs": {
-    "url": "https://github.com/BioPhoton/angular-star-rating/issues"
+    "url": "https://github.com/BioPhoton/angular1-star-rating/issues"
   },
-  "homepage": "https://github.com/BioPhoton/angular-star-rating#readme",
+  "homepage": "https://github.com/BioPhoton/angular1-star-rating#readme",
   "main": "dist/index.js",
@@ -101,3 +98,2 @@ "dependencies": {
   "scripts": {
-    "postinstall": "typings install",
     "clean:dist": "rimraf dist",
@@ -104,0 +100,0 @@ "build": "webpack --progress --colors --display-error-details",

README.md

 # Angular Star Rating ⭐⭐⭐⭐⭐
 #### ⭐ Angular 1.5 Component written in typescript, based on css only techniques. ⭐
 
-![License](https://img.shields.io/npm/l/angular-star-rating.svg) 
+![License](https://img.shields.io/npm/l/angular-star-rating.svg)
 ![Bower Version](https://img.shields.io/bower/v/angular1-star-rating.svg)
 [![NPM Version](https://img.shields.io/npm/v/angular-star-rating.svg)](https://www.npmjs.com/package/angular-star-rating)  
-[![Standard Version](https://img.shields.io/badge/release-standard%20version-brightgreen.svg)](https://github.com/BioPhoton/angular-star-rating) 
-
+[![Standard Version](https://img.shields.io/badge/release-standard%20version-brightgreen.svg)](https://github.com/BioPhoton/angular-star-rating)  
 [![Build Status](https://travis-ci.org/BioPhoton/angular-star-rating.svg?branch=master)](https://travis-ci.org/BioPhoton/angular-star-rating)
-
 [![NPM](https://img.shields.io/npm/dt/angular-star-rating.svg)](https://www.npmjs.com/package/angular-star-rating)  
@@ -37,3 +35,4 @@
 - [x] **starType** - Stars can be displayed as svg, character or icon-font like fontawesome, glyphicons or ionicons
-- [x] **text** - The value of the label text
+- [x] **labelText** - The value of the label text
+- [x] **labelVisible** - If the label is visible or not
 - [x] **labelPosition** - The position of the label
@@ -45,4 +44,4 @@ - [x] **speed** - The duration of the animation
 - [x] **getHalfStarVisible** - Custom function to calculate value for displaying half stars or not
-- [x] **onClick** - Hook for Click action
-- [x] **onUpdate** - Hook for onUpdate event
+- [x] **onClick** - Event emitter for onClick action
+- [x] **onUpdate** - Event emitter for onUpdate event
 
@@ -62,3 +61,3 @@ ## Browser support
  - clone & build this repository
- - [download as .zip](https://github.com/BioPhoton/angular-star-rating/releases)
+ - [download as .zip](https://github.com/BioPhoton/angular1-star-rating/releases)
  - via **[npm](https://www.npmjs.org/)**: by running `$ npm install angular-star-rating` from your console
@@ -69,3 +68,3 @@ - via **[bower](https://bower.io/)**: by running `$ bower install angular1-star-rating` from your console
 ```html
-<script src="bower_components/angular-star-rating/dist/index.js"></script>
+<script src="[bower or npm folder]/angular-star-rating/dist/index.js"></script>
 ```
@@ -83,14 +82,10 @@
          rating="3"
-         text="'Rating:'"
-         on-update="crtl.onUpdate(rating)">
+         label-text="'Rating: '"
+         on-update="crtl.onUpdate($event)">
  </star-rating-comp>
 ```
 
-If you work with typescript you also have to have typings installed globally.
-To check if you have typings installed on your machine try to type ```typings``` in your commandline.
-In case of an error install it with ```npm install typings --global```
-
 ## Component Properties
 
-### @ bindings
+### Input (< bindings)
 
@@ -105,7 +100,5 @@ **id**: string (Optional)
 
-### < bindings
-
 **rating**: number (Optional)  
 The actual star rating value  
-Default: no  
+Default: 0  
 
@@ -137,10 +130,10 @@ ```html
 
-**text**: string (Optional)  
-The text next to the stars.  
+**label-text**: string (Optional)  
+The label text next to the stars.  
 Default: undefined  
 
 ```html
-<star-rating-comp text="'My text!'"></star-rating-comp>
+<star-rating-comp label-text="'My text!'"></star-rating-comp>
 ```
-<img src="https://raw.githubusercontent.com/BioPhoton/angular-star-rating/master/resources/prop-text.PNG" width="290">
+<img src="https://raw.githubusercontent.com/BioPhoton/angular-star-rating/master/resources/prop-label_text.PNG" width="290">
 
@@ -160,3 +153,3 @@ **labelPosition**: starRatingPosition (Optional)
 
-**space**: string (Optional)  
+**space**: starRatingStarSpace (Optional)  
 If the start use the whole space or not. 
@@ -169,5 +162,5 @@ Options: no, between, around
 ```
-<img src="https://raw.githubusercontent.com/BioPhoton/angular-star-rating/master/resources/prop-spcae-default.PNG" width="290">
+<img src="https://raw.githubusercontent.com/BioPhoton/angular-star-rating/master/resources/prop-space-default.PNG" width="290">
+<img src="https://raw.githubusercontent.com/BioPhoton/angular-star-rating/master/resources/prop-space-around.PNG" width="290">
 <img src="https://raw.githubusercontent.com/BioPhoton/angular-star-rating/master/resources/prop-space-between.PNG" width="290">
-<img src="https://raw.githubusercontent.com/BioPhoton/angular-star-rating/master/resources/prop-space-around.PNG" width="290">
 
@@ -250,13 +243,13 @@ **size**: starRatingSizes (Optional)
 ```
-<img src="https://raw.githubusercontent.com/BioPhoton/angular-star-rating/master/resources/prop-type-svg.gif" width="290">
-<img src="https://raw.githubusercontent.com/BioPhoton/angular-star-rating/master/resources/prop-type-icon.gif" width="290">
-<img src="https://raw.githubusercontent.com/BioPhoton/angular-star-rating/master/resources/prop-type-custom_icon.gif" width="290">
+<img src="https://raw.githubusercontent.com/BioPhoton/angular-star-rating/master/resources/prop-type-svg.PNG" width="290">
+<img src="https://raw.githubusercontent.com/BioPhoton/angular-star-rating/master/resources/prop-type-icon.PNG" width="290">
+<img src="https://raw.githubusercontent.com/BioPhoton/angular-star-rating/master/resources/prop-type-custom_icon.PNG" width="290">
 
 **getColor**: Function (Optional)  
 Calculation of the color by rating.  
-Params: rating, number,numOfStars and staticColor  
-Return: color name  
+Params: rating, numOfStars, staticColor  
+Return: colorName as string  
 
 ```html
-<star-rating-comp get-color="ctrl.getColor(rating, numOfStars, staticColor)"></star-rating-comp>
+<star-rating-comp get-color="parentCtrl.getColor(rating, numOfStars, staticColor)"></star-rating-comp>
 ```
@@ -271,22 +264,44 @@ <img src="https://raw.githubusercontent.com/BioPhoton/angular-star-rating/master/resources/prop-get_color-function.PNG" width="290">
 ```html
-<star-rating-comp get-half-star-class="ctrl.getHalfStarClass(rating)" rating="3.2"></star-rating-comp>
+<star-rating-comp get-half-star-visible="parentCtrl.getHalfStarVisible(rating)" rating="3.1"></star-rating-comp>
 ```
-<img src="https://raw.githubusercontent.com/BioPhoton/angular-star-rating/master/resources/prop-get_half_star_class-function.PNG" width="290">
+```javascript
+function getHalfStarVisible(rating) {
+    var absDiff = Math.abs(rating % 1);
+    
+    if(absDiff == 0.1) {
+        return false;
+    }
+    
+    return absDiff > 0;
+}
+```
+<img src="https://raw.githubusercontent.com/BioPhoton/angular-star-rating/master/resources/prop-get_half_star_visible-default.PNG" width="290">
+<img src="https://raw.githubusercontent.com/BioPhoton/angular-star-rating/master/resources/prop-get_half_star_visible-custom.PNG" width="290">
 
-### & bindings
+### Output (& bindings)
 
 **onClick**: Function (Optional)  
 Callback function for star click event 
-Params: rating
+Params: $event
 ```html
-<star-rating-comp on-click="ctrl.onClick(rating)"></star-rating-comp>
+<star-rating-comp on-click="parentCtrl.onClick($event)"></star-rating-comp>
 ```
-<img src="https://raw.githubusercontent.com/BioPhoton/angular-star-rating/master/resources/prop-on_click-function.PNG" width="290">
+```javascript
+function onClick($event) {
+    parent.clickCount = parent.clickCount + 1;
+}
+```
+<img src="https://raw.githubusercontent.com/BioPhoton/angular-star-rating/master/resources/prop-on_click-counter.PNG" width="290">
 
 **onUpdate**: Function (Optional)  
 Callback function for rating update event 
-Params: rating
+Params: $event
 ```html
-<star-rating-comp on-update="ctrl.onUpdate(rating)"></star-rating-comp>
+<star-rating-comp on-update="parentCtrl.onUpdate($event)"></star-rating-comp>
 ```
-<img src="https://raw.githubusercontent.com/BioPhoton/angular-star-rating/master/resources/prop-on_update-function.PNG" width="290">
+```javascript
+function onUpdate($event) {
+    parent.rating = $event.rating;
+}
+```
+<img src="https://raw.githubusercontent.com/BioPhoton/angular-star-rating/master/resources/prop-on_update-2waybiding.PNG" width="290">

src/star-rating.component.ts

@@ -22,3 +22,4 @@ import {StarRatingController} from "./star-rating.controller";
             , starType: '<'
-            , text: '<'
+            , labelText: '<'
+            , labelVisible: '<'
             , labelPosition: '<'
@@ -25,0 +26,0 @@ , speed : '<'

src/star-rating.controller.jasmine.ts

@@ -49,3 +49,3 @@ import angular = require('angular');
         expect(starRatingCtrl.id).toBe(undefined);
-        expect(starRatingCtrl.text).toBe(undefined);
+        expect(starRatingCtrl.labelText).toBe(undefined);
         expect(starRatingCtrl.staticColor).toBe(undefined);
@@ -83,3 +83,3 @@ expect(starRatingCtrl.labelPosition).toBe(undefined);
             id: 'custom-id'
-            , text: 'custom-text'
+            , labelText: 'custom-text'
             , staticColor: 'positive'
@@ -113,3 +113,3 @@ , labelPosition: 'right'
         expect(starRatingCtrl.id).toBe(bindings.id);
-        expect(starRatingCtrl.text).toBe(bindings.text);
+        expect(starRatingCtrl.labelText).toBe(bindings.labelText);
         expect(starRatingCtrl.staticColor).toBe(bindings.staticColor);
@@ -116,0 +116,0 @@ expect(starRatingCtrl.labelPosition).toBe(bindings.labelPosition);

src/star-rating.controller.ts

@@ -10,5 +10,5 @@ import IChangesObject = angular.IChangesObject;
 export interface IStarRatingCompBindings {
-    //<
+    //Inputs (< bindings)
     id?: string;
-    text?: string;
+    labelText?: string;
     staticColor?: starRatingColors;
@@ -27,3 +27,3 @@ labelPosition?: starRatingPosition;
     getColor?(rating: number, numOfStars: number, staticColor?: starRatingColors): starRatingColors;
-    //&
+    //Outputs (& bindings)
     onClick?: ($event: any) =>  IStarRatingOnClickEvent;
@@ -143,3 +143,3 @@ onUpdate?: ($event: any) => IStarRatingOnUpdateEvent;
     protected _id: string;
-    protected _text: string;
+    protected _labelText: string;
     protected _staticColor: starRatingColors;
@@ -298,7 +298,7 @@ protected _labelPosition: starRatingPosition;
 
-    set text(value: string) {
-        this._text = value;
+    set labelText(value: string) {
+        this._labelText = value;
     }
-    get text(): string {
-        return this._text;
+    get labelText(): string {
+        return this._labelText;
     }
@@ -339,2 +339,3 @@
 
+
         //set default Outputs
@@ -407,4 +408,4 @@ this.onClick = function ($event: IStarRatingOnClickEvent) {
         //string
-        if (valueChanged('text', changes)) {
-            this.text = changes.text.currentValue;
+        if (valueChanged('labelText', changes)) {
+            this.labelText = changes.labelText.currentValue;
         }
@@ -411,0 +412,0 @@

Fixed alerts

Install scripts

Supply chain risk

Install scripts are run when the package is installed. The majority of malware in npm is hidden in install scripts.

Found 1 instance in 1 package

Improved metrics

Number of lines in readme file

297

increased by5.32%

Number of high supply chain risk alerts

0

decreased by-100%

Worsened metrics

Total package byte prevSize

2949541

decreased by-34.7%

Number of package files

16

decreased by-78.95%

Lines of code

31796

decreased by-0.16%

No dependency changes