jquery-minicolors-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.
data/README.md ADDED
@@ -0,0 +1,81 @@
1
+ # jQuery colorpicker for Rails
2
+
3
+ This gem embedes the jQuery colorpicker plugin miniColors in the Rails asset pipeline.
4
+
5
+ See https://github.com/claviska/jquery-miniColors
6
+
7
+ ## Installation
8
+
9
+ Add to `Gemfile` run `bundle install`:
10
+
11
+ ```ruby
12
+ # Gemfile
13
+ gem 'jquery-minicolors-rails'
14
+ ```
15
+
16
+ Add to `app/assets/javascripts/application.js`:
17
+
18
+ ```javascript
19
+ //= require jquery # Not included
20
+ //= require jquery-minicolors
21
+ ```
22
+
23
+ Add to `app/assets/stylesheets/application.css`:
24
+
25
+ ```css
26
+ /*
27
+ *= require jquery-minicolors
28
+ */
29
+ ```
30
+
31
+ # Usage
32
+
33
+ Just call `miniColors()` with any text-input selector:
34
+
35
+ ```coffeescript
36
+ jQuery ->
37
+ $('input[type=text]').miniColors();
38
+ ```
39
+
40
+ # With SimpleForm
41
+
42
+ See https://github.com/plataformatec/simple_form
43
+
44
+ ```erb
45
+ <%# app/views/balloons/_form.html.erb %>
46
+
47
+ <%= simple_form_for @balloon do |f| %>
48
+ <%= f.input :color, as: :minicolors %>
49
+ <% end %>
50
+ ```
51
+
52
+ Add to `app/assets/javascripts/application.js`:
53
+
54
+ ```javascript
55
+ //= require jquery # Not included
56
+ //= require jquery-minicolors
57
+ //= require jquery-minicolors-simple_form
58
+ ```
59
+
60
+ ## MIT-License
61
+
62
+ Copyright 2012 Kostiantyn Kahanskyi
63
+
64
+ Permission is hereby granted, free of charge, to any person obtaining
65
+ a copy of this software and associated documentation files (the
66
+ "Software"), to deal in the Software without restriction, including
67
+ without limitation the rights to use, copy, modify, merge, publish,
68
+ distribute, sublicense, and/or sell copies of the Software, and to
69
+ permit persons to whom the Software is furnished to do so, subject to
70
+ the following conditions:
71
+
72
+ The above copyright notice and this permission notice shall be
73
+ included in all copies or substantial portions of the Software.
74
+
75
+ THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
76
+ EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
77
+ MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
78
+ NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
79
+ LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
80
+ OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
81
+ WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
data/Rakefile ADDED
@@ -0,0 +1,9 @@
1
+ #!/usr/bin/env rake
2
+
3
+ begin
4
+ require 'bundler/setup'
5
+ rescue LoadError
6
+ puts 'You must `gem install bundler` and `bundle install` to run rake tasks'
7
+ end
8
+
9
+ Bundler::GemHelper.install_tasks
@@ -0,0 +1,12 @@
1
+ if defined? SimpleForm
2
+ class MinicolorsInput < SimpleForm::Inputs::StringInput
3
+ def input_html_options
4
+ options = super
5
+ options[:data] ||= {}
6
+ options[:data].merge! editor: 'minicolors'
7
+ options
8
+ end
9
+
10
+ def input_type; :text; end
11
+ end
12
+ end
@@ -0,0 +1,4 @@
1
+ require 'jquery-minicolors-rails/engine'
2
+
3
+ module JqueryMinicolorsRails
4
+ end
@@ -0,0 +1,5 @@
1
+ module JqueryMinicolorsRails
2
+ class Engine < ::Rails::Engine
3
+ isolate_namespace JqueryMinicolorsRails
4
+ end
5
+ end
@@ -0,0 +1,3 @@
1
+ module JqueryMinicolorsRails
2
+ VERSION = '0.0.1'
3
+ end
@@ -0,0 +1,2 @@
1
+ jQuery ->
2
+ $('[data-editor=minicolors]').miniColors()
@@ -0,0 +1,567 @@
1
+ /*
2
+ * jQuery miniColors: A small color selector
3
+ *
4
+ * Copyright 2011 Cory LaViska for A Beautiful Site, LLC. (http://abeautifulsite.net/)
5
+ *
6
+ * Dual licensed under the MIT or GPL Version 2 licenses
7
+ *
8
+ */
9
+ if(jQuery) (function($) {
10
+
11
+ $.extend($.fn, {
12
+
13
+ miniColors: function(o, data) {
14
+
15
+ var create = function(input, o, data) {
16
+ //
17
+ // Creates a new instance of the miniColors selector
18
+ //
19
+
20
+ // Determine initial color (defaults to white)
21
+ var color = expandHex(input.val());
22
+ if( !color ) color = 'ffffff';
23
+ var hsb = hex2hsb(color);
24
+
25
+ // Create trigger
26
+ var trigger = $('<a class="miniColors-trigger" style="background-color: #' + color + '" href="#"></a>');
27
+ trigger.insertAfter(input);
28
+
29
+ // Set input data and update attributes
30
+ input
31
+ .addClass('miniColors')
32
+ .data('original-maxlength', input.attr('maxlength') || null)
33
+ .data('original-autocomplete', input.attr('autocomplete') || null)
34
+ .data('letterCase', 'uppercase')
35
+ .data('trigger', trigger)
36
+ .data('hsb', hsb)
37
+ .data('change', o.change ? o.change : null)
38
+ .attr('maxlength', 7)
39
+ .attr('autocomplete', 'off')
40
+ .val('#' + convertCase(color, o.letterCase));
41
+
42
+ // Handle options
43
+ if( o.readonly ) input.prop('readonly', true);
44
+ if( o.disabled ) disable(input);
45
+
46
+ // Show selector when trigger is clicked
47
+ trigger.bind('click.miniColors', function(event) {
48
+ event.preventDefault();
49
+ if( input.val() === '' ) input.val('#');
50
+ show(input);
51
+
52
+ });
53
+
54
+ // Show selector when input receives focus
55
+ input.bind('focus.miniColors', function(event) {
56
+ if( input.val() === '' ) input.val('#');
57
+ show(input);
58
+ });
59
+
60
+ // Hide on blur
61
+ input.bind('blur.miniColors', function(event) {
62
+ var hex = expandHex(input.val());
63
+ input.val( hex ? '#' + convertCase(hex, input.data('letterCase')) : '' );
64
+ });
65
+
66
+ // Hide when tabbing out of the input
67
+ input.bind('keydown.miniColors', function(event) {
68
+ if( event.keyCode === 9 ) hide(input);
69
+ });
70
+
71
+ // Update when color is typed in
72
+ input.bind('keyup.miniColors', function(event) {
73
+ setColorFromInput(input);
74
+ });
75
+
76
+ // Handle pasting
77
+ input.bind('paste.miniColors', function(event) {
78
+ // Short pause to wait for paste to complete
79
+ setTimeout( function() {
80
+ setColorFromInput(input);
81
+ }, 5);
82
+ });
83
+
84
+ };
85
+
86
+ var destroy = function(input) {
87
+ //
88
+ // Destroys an active instance of the miniColors selector
89
+ //
90
+
91
+ hide();
92
+ input = $(input);
93
+
94
+ // Restore to original state
95
+ input.data('trigger').remove();
96
+ input
97
+ .attr('autocomplete', input.data('original-autocomplete'))
98
+ .attr('maxlength', input.data('original-maxlength'))
99
+ .removeData()
100
+ .removeClass('miniColors')
101
+ .unbind('.miniColors');
102
+ $(document).unbind('.miniColors');
103
+ };
104
+
105
+ var enable = function(input) {
106
+ //
107
+ // Enables the input control and the selector
108
+ //
109
+ input
110
+ .prop('disabled', false)
111
+ .data('trigger')
112
+ .css('opacity', 1);
113
+ };
114
+
115
+ var disable = function(input) {
116
+ //
117
+ // Disables the input control and the selector
118
+ //
119
+ hide(input);
120
+ input
121
+ .prop('disabled', true)
122
+ .data('trigger')
123
+ .css('opacity', 0.5);
124
+ };
125
+
126
+ var show = function(input) {
127
+ //
128
+ // Shows the miniColors selector
129
+ //
130
+ if( input.prop('disabled') ) return false;
131
+
132
+ // Hide all other instances
133
+ hide();
134
+
135
+ // Generate the selector
136
+ var selector = $('<div class="miniColors-selector"></div>');
137
+ selector
138
+ .append('<div class="miniColors-colors" style="background-color: #FFF;"><div class="miniColors-colorPicker"></div></div>')
139
+ .append('<div class="miniColors-hues"><div class="miniColors-huePicker"></div></div>')
140
+ .css({
141
+ top: input.is(':visible') ? input.offset().top + input.outerHeight() : input.data('trigger').offset().top + input.data('trigger').outerHeight(),
142
+ left: input.is(':visible') ? input.offset().left : input.data('trigger').offset().left,
143
+ display: 'none'
144
+ })
145
+ .addClass( input.attr('class') );
146
+
147
+ // Set background for colors
148
+ var hsb = input.data('hsb');
149
+ selector
150
+ .find('.miniColors-colors')
151
+ .css('backgroundColor', '#' + hsb2hex({ h: hsb.h, s: 100, b: 100 }));
152
+
153
+ // Set colorPicker position
154
+ var colorPosition = input.data('colorPosition');
155
+ if( !colorPosition ) colorPosition = getColorPositionFromHSB(hsb);
156
+ selector.find('.miniColors-colorPicker')
157
+ .css('top', colorPosition.y + 'px')
158
+ .css('left', colorPosition.x + 'px');
159
+
160
+ // Set huePicker position
161
+ var huePosition = input.data('huePosition');
162
+ if( !huePosition ) huePosition = getHuePositionFromHSB(hsb);
163
+ selector.find('.miniColors-huePicker').css('top', huePosition.y + 'px');
164
+
165
+ // Set input data
166
+ input
167
+ .data('selector', selector)
168
+ .data('huePicker', selector.find('.miniColors-huePicker'))
169
+ .data('colorPicker', selector.find('.miniColors-colorPicker'))
170
+ .data('mousebutton', 0);
171
+
172
+ $('BODY').append(selector);
173
+ selector.fadeIn(100);
174
+
175
+ // Prevent text selection in IE
176
+ selector.bind('selectstart', function() { return false; });
177
+
178
+ $(document).bind('mousedown.miniColors touchstart.miniColors', function(event) {
179
+
180
+ input.data('mousebutton', 1);
181
+
182
+ if( $(event.target).parents().andSelf().hasClass('miniColors-colors') ) {
183
+ event.preventDefault();
184
+ input.data('moving', 'colors');
185
+ moveColor(input, event);
186
+ }
187
+
188
+ if( $(event.target).parents().andSelf().hasClass('miniColors-hues') ) {
189
+ event.preventDefault();
190
+ input.data('moving', 'hues');
191
+ moveHue(input, event);
192
+ }
193
+
194
+ if( $(event.target).parents().andSelf().hasClass('miniColors-selector') ) {
195
+ event.preventDefault();
196
+ return;
197
+ }
198
+
199
+ if( $(event.target).parents().andSelf().hasClass('miniColors') ) return;
200
+
201
+ hide(input);
202
+ });
203
+
204
+ $(document)
205
+ .bind('mouseup.miniColors touchend.miniColors', function(event) {
206
+ event.preventDefault();
207
+ input.data('mousebutton', 0).removeData('moving');
208
+ })
209
+ .bind('mousemove.miniColors touchmove.miniColors', function(event) {
210
+ event.preventDefault();
211
+ if( input.data('mousebutton') === 1 ) {
212
+ if( input.data('moving') === 'colors' ) moveColor(input, event);
213
+ if( input.data('moving') === 'hues' ) moveHue(input, event);
214
+ }
215
+ });
216
+
217
+ };
218
+
219
+ var hide = function(input) {
220
+
221
+ //
222
+ // Hides one or more miniColors selectors
223
+ //
224
+
225
+ // Hide all other instances if input isn't specified
226
+ if( !input ) input = '.miniColors';
227
+
228
+ $(input).each( function() {
229
+ var selector = $(this).data('selector');
230
+ $(this).removeData('selector');
231
+ $(selector).fadeOut(100, function() {
232
+ $(this).remove();
233
+ });
234
+ });
235
+
236
+ $(document).unbind('.miniColors');
237
+
238
+ };
239
+
240
+ var moveColor = function(input, event) {
241
+
242
+ var colorPicker = input.data('colorPicker');
243
+
244
+ colorPicker.hide();
245
+
246
+ var position = {
247
+ x: event.pageX,
248
+ y: event.pageY
249
+ };
250
+
251
+ // Touch support
252
+ if( event.originalEvent.changedTouches ) {
253
+ position.x = event.originalEvent.changedTouches[0].pageX;
254
+ position.y = event.originalEvent.changedTouches[0].pageY;
255
+ }
256
+ position.x = position.x - input.data('selector').find('.miniColors-colors').offset().left - 5;
257
+ position.y = position.y - input.data('selector').find('.miniColors-colors').offset().top - 5;
258
+ if( position.x <= -5 ) position.x = -5;
259
+ if( position.x >= 144 ) position.x = 144;
260
+ if( position.y <= -5 ) position.y = -5;
261
+ if( position.y >= 144 ) position.y = 144;
262
+
263
+ input.data('colorPosition', position);
264
+ colorPicker.css('left', position.x).css('top', position.y).show();
265
+
266
+ // Calculate saturation
267
+ var s = Math.round((position.x + 5) * 0.67);
268
+ if( s < 0 ) s = 0;
269
+ if( s > 100 ) s = 100;
270
+
271
+ // Calculate brightness
272
+ var b = 100 - Math.round((position.y + 5) * 0.67);
273
+ if( b < 0 ) b = 0;
274
+ if( b > 100 ) b = 100;
275
+
276
+ // Update HSB values
277
+ var hsb = input.data('hsb');
278
+ hsb.s = s;
279
+ hsb.b = b;
280
+
281
+ // Set color
282
+ setColor(input, hsb, true);
283
+ };
284
+
285
+ var moveHue = function(input, event) {
286
+
287
+ var huePicker = input.data('huePicker');
288
+
289
+ huePicker.hide();
290
+
291
+ var position = {
292
+ y: event.pageY
293
+ };
294
+
295
+ // Touch support
296
+ if( event.originalEvent.changedTouches ) {
297
+ position.y = event.originalEvent.changedTouches[0].pageY;
298
+ }
299
+
300
+ position.y = position.y - input.data('selector').find('.miniColors-colors').offset().top - 1;
301
+ if( position.y <= -1 ) position.y = -1;
302
+ if( position.y >= 149 ) position.y = 149;
303
+ input.data('huePosition', position);
304
+ huePicker.css('top', position.y).show();
305
+
306
+ // Calculate hue
307
+ var h = Math.round((150 - position.y - 1) * 2.4);
308
+ if( h < 0 ) h = 0;
309
+ if( h > 360 ) h = 360;
310
+
311
+ // Update HSB values
312
+ var hsb = input.data('hsb');
313
+ hsb.h = h;
314
+
315
+ // Set color
316
+ setColor(input, hsb, true);
317
+
318
+ };
319
+
320
+ var setColor = function(input, hsb, updateInput) {
321
+ input.data('hsb', hsb);
322
+ var hex = hsb2hex(hsb);
323
+ if( updateInput ) input.val( '#' + convertCase(hex, input.data('letterCase')) );
324
+ input.data('trigger').css('backgroundColor', '#' + hex);
325
+ if( input.data('selector') ) input.data('selector').find('.miniColors-colors').css('backgroundColor', '#' + hsb2hex({ h: hsb.h, s: 100, b: 100 }));
326
+
327
+ // Fire change callback
328
+ if( input.data('change') ) {
329
+ if( hex === input.data('lastChange') ) return;
330
+ input.data('change').call(input.get(0), '#' + hex, hsb2rgb(hsb));
331
+ input.data('lastChange', hex);
332
+ }
333
+
334
+ };
335
+
336
+ var setColorFromInput = function(input) {
337
+
338
+ input.val('#' + cleanHex(input.val()));
339
+ var hex = expandHex(input.val());
340
+ if( !hex ) return false;
341
+
342
+ // Get HSB equivalent
343
+ var hsb = hex2hsb(hex);
344
+
345
+ // If color is the same, no change required
346
+ var currentHSB = input.data('hsb');
347
+ if( hsb.h === currentHSB.h && hsb.s === currentHSB.s && hsb.b === currentHSB.b ) return true;
348
+
349
+ // Set colorPicker position
350
+ var colorPosition = getColorPositionFromHSB(hsb);
351
+ var colorPicker = $(input.data('colorPicker'));
352
+ colorPicker.css('top', colorPosition.y + 'px').css('left', colorPosition.x + 'px');
353
+ input.data('colorPosition', colorPosition);
354
+
355
+ // Set huePosition position
356
+ var huePosition = getHuePositionFromHSB(hsb);
357
+ var huePicker = $(input.data('huePicker'));
358
+ huePicker.css('top', huePosition.y + 'px');
359
+ input.data('huePosition', huePosition);
360
+
361
+ setColor(input, hsb);
362
+
363
+ return true;
364
+
365
+ };
366
+
367
+ var convertCase = function(string, letterCase) {
368
+ if( letterCase === 'lowercase' ) return string.toLowerCase();
369
+ if( letterCase === 'uppercase' ) return string.toUpperCase();
370
+ return string;
371
+ };
372
+
373
+ var getColorPositionFromHSB = function(hsb) {
374
+ var x = Math.ceil(hsb.s / 0.67);
375
+ if( x < 0 ) x = 0;
376
+ if( x > 150 ) x = 150;
377
+ var y = 150 - Math.ceil(hsb.b / 0.67);
378
+ if( y < 0 ) y = 0;
379
+ if( y > 150 ) y = 150;
380
+ return { x: x - 5, y: y - 5 };
381
+ };
382
+
383
+ var getHuePositionFromHSB = function(hsb) {
384
+ var y = 150 - (hsb.h / 2.4);
385
+ if( y < 0 ) h = 0;
386
+ if( y > 150 ) h = 150;
387
+ return { y: y - 1 };
388
+ };
389
+
390
+ var cleanHex = function(hex) {
391
+ return hex.replace(/[^A-F0-9]/ig, '');
392
+ };
393
+
394
+ var expandHex = function(hex) {
395
+ hex = cleanHex(hex);
396
+ if( !hex ) return null;
397
+ if( hex.length === 3 ) hex = hex[0] + hex[0] + hex[1] + hex[1] + hex[2] + hex[2];
398
+ return hex.length === 6 ? hex : null;
399
+ };
400
+
401
+ var hsb2rgb = function(hsb) {
402
+ var rgb = {};
403
+ var h = Math.round(hsb.h);
404
+ var s = Math.round(hsb.s*255/100);
405
+ var v = Math.round(hsb.b*255/100);
406
+ if(s === 0) {
407
+ rgb.r = rgb.g = rgb.b = v;
408
+ } else {
409
+ var t1 = v;
410
+ var t2 = (255 - s) * v / 255;
411
+ var t3 = (t1 - t2) * (h % 60) / 60;
412
+ if( h === 360 ) h = 0;
413
+ if( h < 60 ) { rgb.r = t1; rgb.b = t2; rgb.g = t2 + t3; }
414
+ else if( h < 120 ) {rgb.g = t1; rgb.b = t2; rgb.r = t1 - t3; }
415
+ else if( h < 180 ) {rgb.g = t1; rgb.r = t2; rgb.b = t2 + t3; }
416
+ else if( h < 240 ) {rgb.b = t1; rgb.r = t2; rgb.g = t1 - t3; }
417
+ else if( h < 300 ) {rgb.b = t1; rgb.g = t2; rgb.r = t2 + t3; }
418
+ else if( h < 360 ) {rgb.r = t1; rgb.g = t2; rgb.b = t1 - t3; }
419
+ else { rgb.r = 0; rgb.g = 0; rgb.b = 0; }
420
+ }
421
+ return {
422
+ r: Math.round(rgb.r),
423
+ g: Math.round(rgb.g),
424
+ b: Math.round(rgb.b)
425
+ };
426
+ };
427
+
428
+ var rgb2hex = function(rgb) {
429
+ var hex = [
430
+ rgb.r.toString(16),
431
+ rgb.g.toString(16),
432
+ rgb.b.toString(16)
433
+ ];
434
+ $.each(hex, function(nr, val) {
435
+ if (val.length === 1) hex[nr] = '0' + val;
436
+ });
437
+ return hex.join('');
438
+ };
439
+
440
+ var hex2rgb = function(hex) {
441
+ hex = parseInt(((hex.indexOf('#') > -1) ? hex.substring(1) : hex), 16);
442
+
443
+ return {
444
+ r: hex >> 16,
445
+ g: (hex & 0x00FF00) >> 8,
446
+ b: (hex & 0x0000FF)
447
+ };
448
+ };
449
+
450
+ var rgb2hsb = function(rgb) {
451
+ var hsb = { h: 0, s: 0, b: 0 };
452
+ var min = Math.min(rgb.r, rgb.g, rgb.b);
453
+ var max = Math.max(rgb.r, rgb.g, rgb.b);
454
+ var delta = max - min;
455
+ hsb.b = max;
456
+ hsb.s = max !== 0 ? 255 * delta / max : 0;
457
+ if( hsb.s !== 0 ) {
458
+ if( rgb.r === max ) {
459
+ hsb.h = (rgb.g - rgb.b) / delta;
460
+ } else if( rgb.g === max ) {
461
+ hsb.h = 2 + (rgb.b - rgb.r) / delta;
462
+ } else {
463
+ hsb.h = 4 + (rgb.r - rgb.g) / delta;
464
+ }
465
+ } else {
466
+ hsb.h = -1;
467
+ }
468
+ hsb.h *= 60;
469
+ if( hsb.h < 0 ) {
470
+ hsb.h += 360;
471
+ }
472
+ hsb.s *= 100/255;
473
+ hsb.b *= 100/255;
474
+ return hsb;
475
+ };
476
+
477
+ var hex2hsb = function(hex) {
478
+ var hsb = rgb2hsb(hex2rgb(hex));
479
+ // Zero out hue marker for black, white, and grays (saturation === 0)
480
+ if( hsb.s === 0 ) hsb.h = 360;
481
+ return hsb;
482
+ };
483
+
484
+ var hsb2hex = function(hsb) {
485
+ return rgb2hex(hsb2rgb(hsb));
486
+ };
487
+
488
+
489
+ // Handle calls to $([selector]).miniColors()
490
+ switch(o) {
491
+
492
+ case 'readonly':
493
+
494
+ $(this).each( function() {
495
+ if( !$(this).hasClass('miniColors') ) return;
496
+ $(this).prop('readonly', data);
497
+ });
498
+
499
+ return $(this);
500
+
501
+ case 'disabled':
502
+
503
+ $(this).each( function() {
504
+ if( !$(this).hasClass('miniColors') ) return;
505
+ if( data ) {
506
+ disable($(this));
507
+ } else {
508
+ enable($(this));
509
+ }
510
+ });
511
+
512
+ return $(this);
513
+
514
+ case 'value':
515
+
516
+ // Getter
517
+ if( data === undefined ) {
518
+ if( !$(this).hasClass('miniColors') ) return;
519
+ var input = $(this),
520
+ hex = expandHex(input.val());
521
+ return hex ? '#' + convertCase(hex, input.data('letterCase')) : null;
522
+ }
523
+
524
+ // Setter
525
+ $(this).each( function() {
526
+ if( !$(this).hasClass('miniColors') ) return;
527
+ $(this).val(data);
528
+ setColorFromInput($(this));
529
+ });
530
+
531
+ return $(this);
532
+
533
+ case 'destroy':
534
+
535
+ $(this).each( function() {
536
+ if( !$(this).hasClass('miniColors') ) return;
537
+ destroy($(this));
538
+ });
539
+
540
+ return $(this);
541
+
542
+ default:
543
+
544
+ if( !o ) o = {};
545
+
546
+ $(this).each( function() {
547
+
548
+ // Must be called on an input element
549
+ if( $(this)[0].tagName.toLowerCase() !== 'input' ) return;
550
+
551
+ // If a trigger is present, the control was already created
552
+ if( $(this).data('trigger') ) return;
553
+
554
+ // Create the control
555
+ create($(this), o, data);
556
+
557
+ });
558
+
559
+ return $(this);
560
+
561
+ }
562
+
563
+ }
564
+
565
+ });
566
+
567
+ })(jQuery);
@@ -0,0 +1,65 @@
1
+ .miniColors-trigger {
2
+ height: 22px;
3
+ width: 22px;
4
+ background: url(<%= image_path('jquery-minicolors/trigger.png') %>) center no-repeat;
5
+ vertical-align: middle;
6
+ margin: 0 .25em;
7
+ display: inline-block;
8
+ outline: none;
9
+ }
10
+
11
+ .miniColors-selector {
12
+ position: absolute;
13
+ width: 175px;
14
+ height: 150px;
15
+ background: #FFF;
16
+ border: solid 1px #BBB;
17
+ -moz-box-shadow: 0 0 6px rgba(0, 0, 0, .25);
18
+ -webkit-box-shadow: 0 0 6px rgba(0, 0, 0, .25);
19
+ box-shadow: 0 0 6px rgba(0, 0, 0, .25);
20
+ -moz-border-radius: 5px;
21
+ -webkit-border-radius: 5px;
22
+ border-radius: 5px;
23
+ padding: 5px;
24
+ z-index: 999999;
25
+ }
26
+
27
+ .miniColors-selector.black {
28
+ background: #000;
29
+ border-color: #000;
30
+ }
31
+
32
+ .miniColors-colors {
33
+ position: absolute;
34
+ top: 5px;
35
+ left: 5px;
36
+ width: 150px;
37
+ height: 150px;
38
+ background: url(<%= image_path('jquery-minicolors/gradient.png') %>) center no-repeat;
39
+ cursor: crosshair;
40
+ }
41
+
42
+ .miniColors-hues {
43
+ position: absolute;
44
+ top: 5px;
45
+ left: 160px;
46
+ width: 20px;
47
+ height: 150px;
48
+ background: url(<%= image_path('jquery-minicolors/rainbow.png') %>) center no-repeat;
49
+ cursor: crosshair;
50
+ }
51
+
52
+ .miniColors-colorPicker {
53
+ position: absolute;
54
+ width: 11px;
55
+ height: 11px;
56
+ background: url(<%= image_path('jquery-minicolors/circle.gif') %>) center no-repeat;
57
+ }
58
+
59
+ .miniColors-huePicker {
60
+ position: absolute;
61
+ left: -3px;
62
+ width: 26px;
63
+ height: 3px;
64
+ background: url(<%= image_path('jquery-minicolors/line.gif') %>) center no-repeat;
65
+ }
metadata ADDED
@@ -0,0 +1,97 @@
1
+ --- !ruby/object:Gem::Specification
2
+ name: jquery-minicolors-rails
3
+ version: !ruby/object:Gem::Version
4
+ version: 0.0.1
5
+ prerelease:
6
+ platform: ruby
7
+ authors:
8
+ - Kostiantyn Kahanskyi
9
+ autorequire:
10
+ bindir: bin
11
+ cert_chain: []
12
+ date: 2012-10-08 00:00:00.000000000 Z
13
+ dependencies:
14
+ - !ruby/object:Gem::Dependency
15
+ name: rails
16
+ requirement: !ruby/object:Gem::Requirement
17
+ none: false
18
+ requirements:
19
+ - - ~>
20
+ - !ruby/object:Gem::Version
21
+ version: 3.2.8
22
+ type: :runtime
23
+ prerelease: false
24
+ version_requirements: !ruby/object:Gem::Requirement
25
+ none: false
26
+ requirements:
27
+ - - ~>
28
+ - !ruby/object:Gem::Version
29
+ version: 3.2.8
30
+ - !ruby/object:Gem::Dependency
31
+ name: jquery-rails
32
+ requirement: !ruby/object:Gem::Requirement
33
+ none: false
34
+ requirements:
35
+ - - ! '>='
36
+ - !ruby/object:Gem::Version
37
+ version: '0'
38
+ type: :runtime
39
+ prerelease: false
40
+ version_requirements: !ruby/object:Gem::Requirement
41
+ none: false
42
+ requirements:
43
+ - - ! '>='
44
+ - !ruby/object:Gem::Version
45
+ version: '0'
46
+ description: Colorpicker-plugin for jQuery, integrated in Rails asset pipeline
47
+ email:
48
+ - kostiantyn.kahanskyi@googlemail.com
49
+ executables: []
50
+ extensions: []
51
+ extra_rdoc_files: []
52
+ files:
53
+ - app/inputs/minicolors_input.rb
54
+ - lib/jquery-minicolors-rails/engine.rb
55
+ - lib/jquery-minicolors-rails/version.rb
56
+ - lib/jquery-minicolors-rails.rb
57
+ - vendor/assets/images/jquery-minicolors/circle.gif
58
+ - vendor/assets/images/jquery-minicolors/gradient.png
59
+ - vendor/assets/images/jquery-minicolors/line.gif
60
+ - vendor/assets/images/jquery-minicolors/rainbow.png
61
+ - vendor/assets/images/jquery-minicolors/trigger.png
62
+ - vendor/assets/javascripts/jquery-minicolors-simple_form.js.coffee
63
+ - vendor/assets/javascripts/jquery-minicolors.js
64
+ - vendor/assets/stylesheets/jquery-minicolors.css.erb
65
+ - Rakefile
66
+ - README.md
67
+ homepage: https://github.com/kostia/jquery-minicolors-rails
68
+ licenses: []
69
+ post_install_message:
70
+ rdoc_options: []
71
+ require_paths:
72
+ - lib
73
+ required_ruby_version: !ruby/object:Gem::Requirement
74
+ none: false
75
+ requirements:
76
+ - - ! '>='
77
+ - !ruby/object:Gem::Version
78
+ version: '0'
79
+ segments:
80
+ - 0
81
+ hash: 4555260701166408700
82
+ required_rubygems_version: !ruby/object:Gem::Requirement
83
+ none: false
84
+ requirements:
85
+ - - ! '>='
86
+ - !ruby/object:Gem::Version
87
+ version: '0'
88
+ segments:
89
+ - 0
90
+ hash: 4555260701166408700
91
+ requirements: []
92
+ rubyforge_project:
93
+ rubygems_version: 1.8.23
94
+ signing_key:
95
+ specification_version: 3
96
+ summary: Colorpicker-plugin for jQuery, integrated in Rails asset pipeline
97
+ test_files: []