star_rating 0.0.1 → 0.0.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA1:
3
- metadata.gz: f1e03be6c8538957ebb0375b8849a6fd5f882908
4
- data.tar.gz: 9e2021c4626fbbef9d5c0ad2f428b281ee23e537
3
+ metadata.gz: 7aaa24e63c0d6cedf28c98bf4c924cb922808147
4
+ data.tar.gz: 09939550668a3ef091131f55d9ecdc4ab66cfab0
5
5
  SHA512:
6
- metadata.gz: cb41217ed77faac2a4a70329502057b5098994f86ee8b141dc15a2c4aa54c1c003de6b864543fd0a8f82b11ee1ab07ccf776ab2b5ddaeaf0b42b3b8c112efa7b
7
- data.tar.gz: 0e1a16e0733bf23f8dfdb9e3499f882361303678ba6bef70f34838ac31ff06dac97fada7df89bdae8feab719a9248663a550b2eab34beaeea60b5e19b822621a
6
+ metadata.gz: 4a869e061ddf9e8a025595ffffd687ebe81988659cc139c62dad54172029d5f02bd6d098ad4012b847c440e742caea1c79f9dc222dff1131f97d4ae079f9c78b
7
+ data.tar.gz: 08733cf017544c9c4d9641e8a5b90ce16a696ecfacb53debc13f289d3d958727db77acbfffc4e4ae217a055b256d347855e8be9b0c4371ad7625df40ce3320f4
data/README.md CHANGED
@@ -1,6 +1,7 @@
1
1
  # star_rating gem
2
2
  [![Build Status](https://travis-ci.org/johnnylaw/star_rating.png?branch=master)](https://travis-ci.org/johnnylaw/star_rating)
3
3
  [![Code Climate](https://codeclimate.com/github/johnnylaw/star_rating.png)](https://codeclimate.com/github/johnnylaw/star_rating)
4
+ [![Gem Version](https://badge.fury.io/rb/star_rating.png)](http://badge.fury.io/rb/star_rating)
4
5
 
5
6
  The star_rating gem allows for the easy integration of a star rating widget into a Rails app running Ruby 2.0 or higher. The star rating form input as well as the star rating display helper rely entirely on Sass (no JavaScript) to create a **highly** configurable arrangement of any number of stars of any size and appearance. The default number of stars is of course five.
6
7
 
@@ -1,3 +1,3 @@
1
1
  module StarRating
2
- VERSION = "0.0.1"
2
+ VERSION = "0.0.2"
3
3
  end
@@ -0,0 +1,95 @@
1
+ $stroke-offset: $star-rating-outline-width/2;
2
+
3
+ $star-point-1: (10 + $stroke-offset) + ',' + ($stroke-offset);
4
+ $star-point-2: (13.09 + $stroke-offset) + ',' + (6.583 + $stroke-offset);
5
+ $star-point-3: (20 + $stroke-offset) + ',' + (7.639 + $stroke-offset);
6
+ $star-point-4: (15 + $stroke-offset) + ',' + (12.764 + $stroke-offset);
7
+ $star-point-5: (16.18 + $stroke-offset) + ',' + (20 + $stroke-offset);
8
+ $star-point-6: (10 + $stroke-offset) + ',' + (16.583 + $stroke-offset);
9
+ $star-point-7: (3.82 + $stroke-offset) + ',' + (20 + $stroke-offset);
10
+ $star-point-8: (5 + $stroke-offset) + ',' + (12.764 + $stroke-offset);
11
+ $star-point-9: $stroke-offset + ',' + (7.639 + $stroke-offset);
12
+ $star-point-10: (6.91 + $stroke-offset) + ',' + (6.583 + $stroke-offset);
13
+ $star-points: "#{$star-point-1} #{$star-point-2} #{$star-point-3} #{$star-point-4} #{$star-point-5} #{$star-point-6} #{$star-point-7} #{$star-point-8} #{$star-point-9} #{$star-point-10}";
14
+
15
+ $star-rating-canvas-size: 20 + $stroke-offset + $star-rating-spacing;
16
+
17
+ $star-canvas: '<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="#{$star-rating-canvas-size}px" height="#{$star-rating-canvas-size}px" viewBox="0 0 #{$star-rating-canvas-size} #{$star-rating-canvas-size}" enable-background="new 0 0 #{$star-rating-canvas-size} #{$star-rating-canvas-size}" xml:space="preserve">';
18
+
19
+ $star-rating-default-url-empty: 'data:image/svg+xml;base64,' + encode64('#{$star-canvas}<polygon fill="#{$star-rating-color-empty}" stroke="#{$star-rating-outline-color-empty}" stroke-width="#{$star-rating-outline-width}" stroke-linejoin="miter" points="#{$star-points}"/></svg>');
20
+
21
+ $star-rating-gradient-full: '<defs><linearGradient id="grad1" x1="#{$star-rating-fill-start-x}" y1="#{$star-rating-fill-start-y}" x2="#{$star-rating-fill-finish-x}" y2="#{$star-rating-fill-finish-y}"><stop offset="0%" style="stop-color:#{$star-rating-fill-color-start};stop-opacity:1" /><stop offset="100%" style="stop-color:#{$star-rating-fill-color-finish};stop-opacity:1" /></linearGradient></defs>';
22
+
23
+ $star-rating-default-url-full: 'data:image/svg+xml;base64,' + encode64($star-canvas + $star-rating-gradient-full +
24
+ '<polygon fill="url(#grad1)" stroke-width="#{$star-rating-outline-width}" stroke="#{$star-rating-outline-color-full}" points="' + $star-points + '"/></svg>');
25
+
26
+ .star-rating {
27
+ margin: 0;
28
+ font-size: 0;
29
+ white-space: nowrap;
30
+ display: inline-block;
31
+ width: $default-star-rating-height * number_of_stars();
32
+ height: $default-star-rating-height;
33
+ overflow: hidden;
34
+ position: relative;
35
+ @if $star-rating-url-empty {
36
+ background: url($star-rating-url-empty);
37
+ } @else {
38
+ background: url($star-rating-default-url-empty);
39
+ }
40
+ background-size: auto 100%;
41
+
42
+ span, i {
43
+ height: 100%;
44
+ @if $star-rating-url-full {
45
+ background: url($star-rating-url-full);
46
+ } @else {
47
+ background: url($star-rating-default-url-full);
48
+ }
49
+ background-size: auto 100%;
50
+ }
51
+
52
+ span {
53
+ display: block;
54
+ }
55
+
56
+ i {
57
+ opacity: 0;
58
+ position: absolute;
59
+ left: 0;
60
+ top: 0;
61
+ width: 100%/number_of_stars();
62
+ z-index: 1;
63
+ }
64
+
65
+ input{
66
+ opacity: 0;
67
+ display: inline-block;
68
+ width: 100%/number_of_stars();
69
+ height: 100%;
70
+ margin: 0;
71
+ padding: 0;
72
+ z-index: 2;
73
+ position: relative;
74
+
75
+ &:hover + i {
76
+ opacity: 1;
77
+ }
78
+
79
+ @for $i from 2 through number_of_stars() {
80
+ &.star-rating-#{$i}:hover + i {
81
+ width: 100% * $i/number_of_stars();
82
+ }
83
+ }
84
+
85
+ &:checked + i {
86
+ opacity: 1;
87
+ }
88
+
89
+ @for $i from 2 through number_of_stars() {
90
+ &.star-rating-#{$i}:checked + i {
91
+ width: 100% * $i/number_of_stars();
92
+ }
93
+ }
94
+ }
95
+ }
@@ -0,0 +1,4 @@
1
+ $star-rating-url-empty: false !default;
2
+ $star-rating-url-full: false !default;
3
+
4
+ @import 'star_rating/settings';
@@ -0,0 +1,51 @@
1
+ // Here is where you can override the settings and color information for your stars
2
+ // Default values are shown
3
+
4
+ //**************************** SIZE *******************************//
5
+ $default-star-rating-height: 30px;
6
+ $star-rating-spacing: 0;
7
+
8
+
9
+ //******************** EMPTY STAR DESCRIPTION ********************//
10
+ $star-rating-color-empty: rgba(128, 128, 128, .3);
11
+ $star-rating-outline-color-empty: #888888;
12
+
13
+
14
+ //**************** OUTLINE WIDTH (for both stars) ****************//
15
+ $star-rating-outline-width: 1;
16
+
17
+
18
+ //********** FULL(selected or checked) STAR DESCRIPTION **********//
19
+ // Change these for left-to-right gradient
20
+ $star-rating-fill-start-x: 0%;
21
+ $star-rating-fill-finish-x: 0%;
22
+
23
+ // Change these for top-to-bottom gradient
24
+ $star-rating-fill-start-y: 10%;
25
+ $star-rating-fill-finish-y: 90%;
26
+
27
+ // Define start and finish color for gradient for
28
+ // For solid color, define $star-rating-fill-color-finish below
29
+ // and set all start and finish values above to 0%
30
+ // NOTE: rgba colors can be used if transparency is desired.
31
+ $star-rating-fill-color-start: #ffdf88;
32
+ $star-rating-fill-color-finish: #ff9870;
33
+
34
+ // Being set to 'none' (default) results in no outline on full star
35
+ $star-rating-outline-color-full: none;
36
+
37
+
38
+ //******************** OVERRIDE URL of IMAGES ********************//
39
+ // Override the URLs with any image desired, either with a path or
40
+ // inline image or SVG. Overriding these will cause all other
41
+ // settings to be meaningless, with the exception of
42
+ // $default-star-rating-height
43
+
44
+ // NOTE: Be sure to override both!
45
+ // E.g. these heart icons, which are packaged in vendor/assets and
46
+ // you are of course welcome to use:
47
+ // $star-rating-url-empty: '/assets/star_rating/heart-icon-empty.png';
48
+ // $star-rating-url-full: '/assets/star_rating/heart-icon-full.png';
49
+
50
+ // NOTE: The canvas size of the image (be it png or SVG or other)
51
+ // must be perfectly square in order to display properly
metadata CHANGED
@@ -1,7 +1,7 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: star_rating
3
3
  version: !ruby/object:Gem::Version
4
- version: 0.0.1
4
+ version: 0.0.2
5
5
  platform: ruby
6
6
  authors:
7
7
  - John Lawrence
@@ -94,8 +94,8 @@ dependencies:
94
94
  - - '>='
95
95
  - !ruby/object:Gem::Version
96
96
  version: '0'
97
- description: Makes it easy to place star-rating inputs into any web app. Configurable
98
- appearance, number and value of stars
97
+ description: Makes it easy to place star-rating inputs into any Rails app. Configurable
98
+ appearance, number and value of stars.
99
99
  email:
100
100
  - johnonrails@gmail.com
101
101
  executables: []
@@ -112,6 +112,11 @@ files:
112
112
  - lib/star_rating/version.rb
113
113
  - lib/star_rating.rb
114
114
  - lib/tasks/star_rating_tasks.rake
115
+ - vendor/assets/images/star_rating/heart-icon-empty.png
116
+ - vendor/assets/images/star_rating/heart-icon-full.png
117
+ - vendor/assets/stylesheets/star_rating/_defaults.scss
118
+ - vendor/assets/stylesheets/star_rating/_settings.scss
119
+ - vendor/assets/stylesheets/star_rating.scss
115
120
  - MIT-LICENSE
116
121
  - Rakefile
117
122
  - README.md