pips_slider_rails 0.0.1
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 +7 -0
- data/MIT-LICENSE +20 -0
- data/README.rdoc +16 -0
- data/Rakefile +34 -0
- data/app/assets/javascripts/jquery-ui-slider-pips.js +812 -0
- data/app/assets/stylesheets/jquery-ui-slider-pips.css +326 -0
- data/lib/pips_slider/version.rb +3 -0
- data/lib/pips_slider_rails.rb +6 -0
- data/lib/tasks/pips_slider_rails_tasks.rake +4 -0
- data/test/dummy/README.rdoc +28 -0
- data/test/dummy/Rakefile +6 -0
- data/test/dummy/app/assets/javascripts/application.js +13 -0
- data/test/dummy/app/assets/stylesheets/application.css +15 -0
- data/test/dummy/app/controllers/application_controller.rb +5 -0
- data/test/dummy/app/helpers/application_helper.rb +2 -0
- data/test/dummy/app/views/layouts/application.html.erb +14 -0
- data/test/dummy/bin/bundle +3 -0
- data/test/dummy/bin/rails +4 -0
- data/test/dummy/bin/rake +4 -0
- data/test/dummy/bin/setup +29 -0
- data/test/dummy/config.ru +4 -0
- data/test/dummy/config/application.rb +26 -0
- data/test/dummy/config/boot.rb +5 -0
- data/test/dummy/config/database.yml +25 -0
- data/test/dummy/config/environment.rb +5 -0
- data/test/dummy/config/environments/development.rb +41 -0
- data/test/dummy/config/environments/production.rb +79 -0
- data/test/dummy/config/environments/test.rb +42 -0
- data/test/dummy/config/initializers/assets.rb +11 -0
- data/test/dummy/config/initializers/backtrace_silencers.rb +7 -0
- data/test/dummy/config/initializers/cookies_serializer.rb +3 -0
- data/test/dummy/config/initializers/filter_parameter_logging.rb +4 -0
- data/test/dummy/config/initializers/inflections.rb +16 -0
- data/test/dummy/config/initializers/mime_types.rb +4 -0
- data/test/dummy/config/initializers/session_store.rb +3 -0
- data/test/dummy/config/initializers/wrap_parameters.rb +14 -0
- data/test/dummy/config/locales/en.yml +23 -0
- data/test/dummy/config/routes.rb +56 -0
- data/test/dummy/config/secrets.yml +22 -0
- data/test/dummy/public/404.html +67 -0
- data/test/dummy/public/422.html +67 -0
- data/test/dummy/public/500.html +66 -0
- data/test/dummy/public/favicon.ico +0 -0
- data/test/pips_slider_test.rb +7 -0
- data/test/test_helper.rb +20 -0
- metadata +124 -0
@@ -0,0 +1,326 @@
|
|
1
|
+
/*! jQuery-ui-Slider-Pips - v1.11.4 - 2016-09-04
|
2
|
+
* Copyright (c) 2016 Simon Goellner <simey.me@gmail.com>; Licensed MIT */
|
3
|
+
|
4
|
+
/* HORIZONTAL */
|
5
|
+
/* increase bottom margin to fit the pips */
|
6
|
+
.ui-slider-horizontal.ui-slider-pips {
|
7
|
+
margin-bottom: 1.4em;
|
8
|
+
}
|
9
|
+
|
10
|
+
/* default hide the labels and pips that arnt visible */
|
11
|
+
/* we just use css to hide incase we want to show certain */
|
12
|
+
/* labels/pips individually later */
|
13
|
+
.ui-slider-pips .ui-slider-label,
|
14
|
+
.ui-slider-pips .ui-slider-pip-hide {
|
15
|
+
display: none;
|
16
|
+
}
|
17
|
+
|
18
|
+
/* now we show any labels that we've set to show in the options */
|
19
|
+
.ui-slider-pips .ui-slider-pip-label .ui-slider-label {
|
20
|
+
display: block;
|
21
|
+
}
|
22
|
+
|
23
|
+
/* PIP/LABEL WRAPPER */
|
24
|
+
/* position each pip absolutely just below the default slider */
|
25
|
+
/* and also prevent accidental selection */
|
26
|
+
.ui-slider-pips .ui-slider-pip {
|
27
|
+
width: 2em;
|
28
|
+
height: 1em;
|
29
|
+
line-height: 1em;
|
30
|
+
position: absolute;
|
31
|
+
font-size: 0.8em;
|
32
|
+
color: #999;
|
33
|
+
overflow: visible;
|
34
|
+
text-align: center;
|
35
|
+
top: 20px;
|
36
|
+
left: 20px;
|
37
|
+
margin-left: -1em;
|
38
|
+
cursor: pointer;
|
39
|
+
-webkit-touch-callout: none;
|
40
|
+
-webkit-user-select: none;
|
41
|
+
-moz-user-select: none;
|
42
|
+
-ms-user-select: none;
|
43
|
+
user-select: none;
|
44
|
+
}
|
45
|
+
|
46
|
+
.ui-state-disabled.ui-slider-pips .ui-slider-pip {
|
47
|
+
cursor: default;
|
48
|
+
}
|
49
|
+
|
50
|
+
/* little pip/line position & size */
|
51
|
+
.ui-slider-pips .ui-slider-line {
|
52
|
+
background: #999;
|
53
|
+
width: 1px;
|
54
|
+
height: 3px;
|
55
|
+
position: absolute;
|
56
|
+
left: 50%;
|
57
|
+
}
|
58
|
+
|
59
|
+
/* the text label postion & size */
|
60
|
+
/* it overflows so no need for width to be accurate */
|
61
|
+
.ui-slider-pips .ui-slider-label {
|
62
|
+
position: absolute;
|
63
|
+
top: 5px;
|
64
|
+
left: 50%;
|
65
|
+
margin-left: -1em;
|
66
|
+
width: 2em;
|
67
|
+
}
|
68
|
+
|
69
|
+
/* make it easy to see when we hover a label */
|
70
|
+
.ui-slider-pips:not(.ui-slider-disabled) .ui-slider-pip:hover .ui-slider-label {
|
71
|
+
color: black;
|
72
|
+
font-weight: bold;
|
73
|
+
}
|
74
|
+
|
75
|
+
/* VERTICAL */
|
76
|
+
/* vertical slider needs right-margin, not bottom */
|
77
|
+
.ui-slider-vertical.ui-slider-pips {
|
78
|
+
margin-bottom: 1em;
|
79
|
+
margin-right: 2em;
|
80
|
+
}
|
81
|
+
|
82
|
+
/* align vertical pips left and to right of the slider */
|
83
|
+
.ui-slider-vertical.ui-slider-pips .ui-slider-pip {
|
84
|
+
text-align: left;
|
85
|
+
top: auto;
|
86
|
+
left: 20px;
|
87
|
+
margin-left: 0;
|
88
|
+
margin-bottom: -0.5em;
|
89
|
+
}
|
90
|
+
|
91
|
+
/* vertical line/pip should be horizontal instead */
|
92
|
+
.ui-slider-vertical.ui-slider-pips .ui-slider-line {
|
93
|
+
width: 3px;
|
94
|
+
height: 1px;
|
95
|
+
position: absolute;
|
96
|
+
top: 50%;
|
97
|
+
left: 0;
|
98
|
+
}
|
99
|
+
|
100
|
+
.ui-slider-vertical.ui-slider-pips .ui-slider-label {
|
101
|
+
top: 50%;
|
102
|
+
left: 0.5em;
|
103
|
+
margin-left: 0;
|
104
|
+
margin-top: -0.5em;
|
105
|
+
width: 2em;
|
106
|
+
}
|
107
|
+
|
108
|
+
/* FLOATING HORIZTONAL TOOLTIPS */
|
109
|
+
/* remove the godawful looking focus outline on handle and float */
|
110
|
+
.ui-slider-float .ui-slider-handle:focus,
|
111
|
+
.ui-slider-float .ui-slider-handle.ui-state-focus .ui-slider-tip-label,
|
112
|
+
.ui-slider-float .ui-slider-handle:focus .ui-slider-tip,
|
113
|
+
.ui-slider-float .ui-slider-handle.ui-state-focus .ui-slider-tip-label,
|
114
|
+
.ui-slider-float .ui-slider-handle:focus .ui-slider-tip-label
|
115
|
+
.ui-slider-float .ui-slider-handle.ui-state-focus .ui-slider-tip-label {
|
116
|
+
outline: none;
|
117
|
+
}
|
118
|
+
|
119
|
+
/* style tooltips on handles and on labels */
|
120
|
+
/* also has a nice transition */
|
121
|
+
.ui-slider-float .ui-slider-tip,
|
122
|
+
.ui-slider-float .ui-slider-tip-label {
|
123
|
+
position: absolute;
|
124
|
+
visibility: hidden;
|
125
|
+
top: -40px;
|
126
|
+
display: block;
|
127
|
+
width: 34px;
|
128
|
+
margin-left: -18px;
|
129
|
+
left: 50%;
|
130
|
+
height: 20px;
|
131
|
+
line-height: 20px;
|
132
|
+
background: white;
|
133
|
+
border-radius: 3px;
|
134
|
+
border: 1px solid #888;
|
135
|
+
text-align: center;
|
136
|
+
font-size: 12px;
|
137
|
+
opacity: 0;
|
138
|
+
color: #333;
|
139
|
+
-webkit-transition-property: opacity, top, visibility;
|
140
|
+
transition-property: opacity, top, visibility;
|
141
|
+
-webkit-transition-timing-function: ease-in;
|
142
|
+
transition-timing-function: ease-in;
|
143
|
+
-webkit-transition-duration: 200ms, 200ms, 0ms;
|
144
|
+
transition-duration: 200ms, 200ms, 0ms;
|
145
|
+
-webkit-transition-delay: 0ms, 0ms, 200ms;
|
146
|
+
transition-delay: 0ms, 0ms, 200ms;
|
147
|
+
}
|
148
|
+
|
149
|
+
/* show the tooltip on hover or focus */
|
150
|
+
/* also switch transition delay around */
|
151
|
+
.ui-slider-float .ui-slider-handle:hover .ui-slider-tip,
|
152
|
+
.ui-slider-float .ui-slider-handle.ui-state-hover .ui-slider-tip,
|
153
|
+
.ui-slider-float .ui-slider-handle:focus .ui-slider-tip,
|
154
|
+
.ui-slider-float .ui-slider-handle.ui-state-focus .ui-slider-tip,
|
155
|
+
.ui-slider-float .ui-slider-handle.ui-state-active .ui-slider-tip,
|
156
|
+
.ui-slider-float .ui-slider-pip:hover .ui-slider-tip-label {
|
157
|
+
opacity: 1;
|
158
|
+
top: -30px;
|
159
|
+
visibility: visible;
|
160
|
+
-webkit-transition-timing-function: ease-out;
|
161
|
+
transition-timing-function: ease-out;
|
162
|
+
-webkit-transition-delay: 200ms, 200ms, 0ms;
|
163
|
+
transition-delay: 200ms, 200ms, 0ms;
|
164
|
+
}
|
165
|
+
|
166
|
+
/* put label tooltips below slider */
|
167
|
+
.ui-slider-float .ui-slider-pip .ui-slider-tip-label {
|
168
|
+
top: 42px;
|
169
|
+
}
|
170
|
+
|
171
|
+
.ui-slider-float .ui-slider-pip:hover .ui-slider-tip-label {
|
172
|
+
top: 32px;
|
173
|
+
font-weight: normal;
|
174
|
+
}
|
175
|
+
|
176
|
+
/* give the tooltip a css triangle arrow */
|
177
|
+
.ui-slider-float .ui-slider-tip:after,
|
178
|
+
.ui-slider-float .ui-slider-pip .ui-slider-tip-label:after {
|
179
|
+
content: " ";
|
180
|
+
width: 0;
|
181
|
+
height: 0;
|
182
|
+
border: 5px solid rgba(255, 255, 255, 0);
|
183
|
+
border-top-color: white;
|
184
|
+
position: absolute;
|
185
|
+
bottom: -10px;
|
186
|
+
left: 50%;
|
187
|
+
margin-left: -5px;
|
188
|
+
}
|
189
|
+
|
190
|
+
/* put a 1px border on the tooltip arrow to match tooltip border */
|
191
|
+
.ui-slider-float .ui-slider-tip:before,
|
192
|
+
.ui-slider-float .ui-slider-pip .ui-slider-tip-label:before {
|
193
|
+
content: " ";
|
194
|
+
width: 0;
|
195
|
+
height: 0;
|
196
|
+
border: 5px solid rgba(255, 255, 255, 0);
|
197
|
+
border-top-color: #888;
|
198
|
+
position: absolute;
|
199
|
+
bottom: -11px;
|
200
|
+
left: 50%;
|
201
|
+
margin-left: -5px;
|
202
|
+
}
|
203
|
+
|
204
|
+
/* switch the arrow to top on labels */
|
205
|
+
.ui-slider-float .ui-slider-pip .ui-slider-tip-label:after {
|
206
|
+
border: 5px solid rgba(255, 255, 255, 0);
|
207
|
+
border-bottom-color: white;
|
208
|
+
top: -10px;
|
209
|
+
}
|
210
|
+
|
211
|
+
.ui-slider-float .ui-slider-pip .ui-slider-tip-label:before {
|
212
|
+
border: 5px solid rgba(255, 255, 255, 0);
|
213
|
+
border-bottom-color: #888;
|
214
|
+
top: -11px;
|
215
|
+
}
|
216
|
+
|
217
|
+
/* FLOATING VERTICAL TOOLTIPS */
|
218
|
+
/* tooltip floats to left of handle */
|
219
|
+
.ui-slider-vertical.ui-slider-float .ui-slider-tip,
|
220
|
+
.ui-slider-vertical.ui-slider-float .ui-slider-tip-label {
|
221
|
+
top: 50%;
|
222
|
+
margin-top: -11px;
|
223
|
+
width: 34px;
|
224
|
+
margin-left: 0px;
|
225
|
+
left: -60px;
|
226
|
+
color: #333;
|
227
|
+
-webkit-transition-duration: 200ms, 200ms, 0;
|
228
|
+
transition-duration: 200ms, 200ms, 0;
|
229
|
+
-webkit-transition-property: opacity, left, visibility;
|
230
|
+
transition-property: opacity, left, visibility;
|
231
|
+
-webkit-transition-delay: 0, 0, 200ms;
|
232
|
+
transition-delay: 0, 0, 200ms;
|
233
|
+
}
|
234
|
+
|
235
|
+
.ui-slider-vertical.ui-slider-float .ui-slider-handle:hover .ui-slider-tip,
|
236
|
+
.ui-slider-vertical.ui-slider-float .ui-slider-handle.ui-state-hover .ui-slider-tip,
|
237
|
+
.ui-slider-vertical.ui-slider-float .ui-slider-handle:focus .ui-slider-tip,
|
238
|
+
.ui-slider-vertical.ui-slider-float .ui-slider-handle.ui-state-focus .ui-slider-tip,
|
239
|
+
.ui-slider-vertical.ui-slider-float .ui-slider-handle.ui-state-active .ui-slider-tip,
|
240
|
+
.ui-slider-vertical.ui-slider-float .ui-slider-pip:hover .ui-slider-tip-label {
|
241
|
+
top: 50%;
|
242
|
+
margin-top: -11px;
|
243
|
+
left: -50px;
|
244
|
+
}
|
245
|
+
|
246
|
+
/* put label tooltips to right of slider */
|
247
|
+
.ui-slider-vertical.ui-slider-float .ui-slider-pip .ui-slider-tip-label {
|
248
|
+
left: 47px;
|
249
|
+
}
|
250
|
+
|
251
|
+
.ui-slider-vertical.ui-slider-float .ui-slider-pip:hover .ui-slider-tip-label {
|
252
|
+
left: 37px;
|
253
|
+
}
|
254
|
+
|
255
|
+
/* give the tooltip a css triangle arrow */
|
256
|
+
.ui-slider-vertical.ui-slider-float .ui-slider-tip:after,
|
257
|
+
.ui-slider-vertical.ui-slider-float .ui-slider-pip .ui-slider-tip-label:after {
|
258
|
+
border: 5px solid rgba(255, 255, 255, 0);
|
259
|
+
border-left-color: white;
|
260
|
+
border-top-color: transparent;
|
261
|
+
position: absolute;
|
262
|
+
bottom: 50%;
|
263
|
+
margin-bottom: -5px;
|
264
|
+
right: -10px;
|
265
|
+
margin-left: 0;
|
266
|
+
top: auto;
|
267
|
+
left: auto;
|
268
|
+
}
|
269
|
+
|
270
|
+
.ui-slider-vertical.ui-slider-float .ui-slider-tip:before,
|
271
|
+
.ui-slider-vertical.ui-slider-float .ui-slider-pip .ui-slider-tip-label:before {
|
272
|
+
border: 5px solid rgba(255, 255, 255, 0);
|
273
|
+
border-left-color: #888;
|
274
|
+
border-top-color: transparent;
|
275
|
+
position: absolute;
|
276
|
+
bottom: 50%;
|
277
|
+
margin-bottom: -5px;
|
278
|
+
right: -11px;
|
279
|
+
margin-left: 0;
|
280
|
+
top: auto;
|
281
|
+
left: auto;
|
282
|
+
}
|
283
|
+
|
284
|
+
.ui-slider-vertical.ui-slider-float .ui-slider-pip .ui-slider-tip-label:after {
|
285
|
+
border: 5px solid rgba(255, 255, 255, 0);
|
286
|
+
border-right-color: white;
|
287
|
+
right: auto;
|
288
|
+
left: -10px;
|
289
|
+
}
|
290
|
+
|
291
|
+
.ui-slider-vertical.ui-slider-float .ui-slider-pip .ui-slider-tip-label:before {
|
292
|
+
border: 5px solid rgba(255, 255, 255, 0);
|
293
|
+
border-right-color: #888;
|
294
|
+
right: auto;
|
295
|
+
left: -11px;
|
296
|
+
}
|
297
|
+
|
298
|
+
/* SELECTED STATES */
|
299
|
+
/* Comment out this chuck of code if you don't want to have
|
300
|
+
the new label colours shown */
|
301
|
+
.ui-slider-pips [class*=ui-slider-pip-initial] {
|
302
|
+
font-weight: bold;
|
303
|
+
color: #14CA82;
|
304
|
+
}
|
305
|
+
|
306
|
+
.ui-slider-pips .ui-slider-pip-initial-2 {
|
307
|
+
color: #1897C9;
|
308
|
+
}
|
309
|
+
|
310
|
+
.ui-slider-pips [class*=ui-slider-pip-selected] {
|
311
|
+
font-weight: bold;
|
312
|
+
color: #FF7A00;
|
313
|
+
}
|
314
|
+
|
315
|
+
.ui-slider-pips .ui-slider-pip-inrange {
|
316
|
+
color: black;
|
317
|
+
}
|
318
|
+
|
319
|
+
.ui-slider-pips .ui-slider-pip-selected-2 {
|
320
|
+
color: #E70081;
|
321
|
+
}
|
322
|
+
|
323
|
+
.ui-slider-pips [class*=ui-slider-pip-selected] .ui-slider-line,
|
324
|
+
.ui-slider-pips .ui-slider-pip-inrange .ui-slider-line {
|
325
|
+
background: black;
|
326
|
+
}
|
@@ -0,0 +1,28 @@
|
|
1
|
+
== README
|
2
|
+
|
3
|
+
This README would normally document whatever steps are necessary to get the
|
4
|
+
application up and running.
|
5
|
+
|
6
|
+
Things you may want to cover:
|
7
|
+
|
8
|
+
* Ruby version
|
9
|
+
|
10
|
+
* System dependencies
|
11
|
+
|
12
|
+
* Configuration
|
13
|
+
|
14
|
+
* Database creation
|
15
|
+
|
16
|
+
* Database initialization
|
17
|
+
|
18
|
+
* How to run the test suite
|
19
|
+
|
20
|
+
* Services (job queues, cache servers, search engines, etc.)
|
21
|
+
|
22
|
+
* Deployment instructions
|
23
|
+
|
24
|
+
* ...
|
25
|
+
|
26
|
+
|
27
|
+
Please feel free to use a different markup language if you do not plan to run
|
28
|
+
<tt>rake doc:app</tt>.
|
data/test/dummy/Rakefile
ADDED
@@ -0,0 +1,13 @@
|
|
1
|
+
// This is a manifest file that'll be compiled into application.js, which will include all the files
|
2
|
+
// listed below.
|
3
|
+
//
|
4
|
+
// Any JavaScript/Coffee file within this directory, lib/assets/javascripts, vendor/assets/javascripts,
|
5
|
+
// or any plugin's vendor/assets/javascripts directory can be referenced here using a relative path.
|
6
|
+
//
|
7
|
+
// It's not advisable to add code directly here, but if you do, it'll appear at the bottom of the
|
8
|
+
// compiled file.
|
9
|
+
//
|
10
|
+
// Read Sprockets README (https://github.com/rails/sprockets#sprockets-directives) for details
|
11
|
+
// about supported directives.
|
12
|
+
//
|
13
|
+
//= require_tree .
|
@@ -0,0 +1,15 @@
|
|
1
|
+
/*
|
2
|
+
* This is a manifest file that'll be compiled into application.css, which will include all the files
|
3
|
+
* listed below.
|
4
|
+
*
|
5
|
+
* Any CSS and SCSS file within this directory, lib/assets/stylesheets, vendor/assets/stylesheets,
|
6
|
+
* or any plugin's vendor/assets/stylesheets directory can be referenced here using a relative path.
|
7
|
+
*
|
8
|
+
* You're free to add application-wide styles to this file and they'll appear at the bottom of the
|
9
|
+
* compiled file so the styles you add here take precedence over styles defined in any styles
|
10
|
+
* defined in the other CSS/SCSS files in this directory. It is generally better to create a new
|
11
|
+
* file per style scope.
|
12
|
+
*
|
13
|
+
*= require_tree .
|
14
|
+
*= require_self
|
15
|
+
*/
|
@@ -0,0 +1,14 @@
|
|
1
|
+
<!DOCTYPE html>
|
2
|
+
<html>
|
3
|
+
<head>
|
4
|
+
<title>Dummy</title>
|
5
|
+
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %>
|
6
|
+
<%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
|
7
|
+
<%= csrf_meta_tags %>
|
8
|
+
</head>
|
9
|
+
<body>
|
10
|
+
|
11
|
+
<%= yield %>
|
12
|
+
|
13
|
+
</body>
|
14
|
+
</html>
|