bootstrap-colorpick-rails 0.0.0

Sign up to get free protection for your applications and to get access to all the features.
@@ -0,0 +1,7 @@
1
+ ---
2
+ SHA256:
3
+ metadata.gz: '08a0ded9afedb86c8c8df1913ae0eb3bc4a59d859552db8c8a948aa20c96ae20'
4
+ data.tar.gz: cc389da83cf1c01e582d3dbcc3b813041b9f775433dda747c1a0fcff116726ff
5
+ SHA512:
6
+ metadata.gz: e523275012f32a346cdc33915eb79a0842483016c49fc453c5a3b74eac71264003971bc5a1372bff431f21a4e06461357c32059bb9475d298e48931603e85741
7
+ data.tar.gz: 54390ef8fc1905e79f42119128287b02f43d8b9750ca0b2215fdfcf920ff45ce52e5aae4dd901a186abdbdb2817fe817a50bdb1d33ba64ee182aea1459bbad5b
@@ -0,0 +1,39 @@
1
+ # See https://help.github.com/articles/ignoring-files for more about ignoring files.
2
+ #
3
+ # If you find yourself ignoring temporary files generated by your text editor
4
+ # or operating system, you probably want to add a global ignore instead:
5
+ # git config --global core.excludesfile '~/.gitignore_global'
6
+
7
+ *.gem
8
+ *.rbc
9
+ /.config
10
+ /.rake_tasks~
11
+ /coverage/
12
+ /InstalledFiles
13
+ /pkg/
14
+ /tmp/
15
+
16
+ # RSpec configuration and generated files:
17
+ /.rspec
18
+ /spec/examples.txt
19
+
20
+ # Documentation cache and generated files:
21
+ /.yardoc/
22
+ /_yardoc/
23
+ /doc/
24
+ /rdoc/
25
+
26
+ # Environment normalization:
27
+ /.bundle/
28
+ /vendor/bundle/*
29
+ !/vendor/bundle/.keep
30
+ /lib/bundler/man/
31
+
32
+ # For a library or gem, you might want to ignore these files since the code is
33
+ # intended to run in multiple environments; otherwise, check them in:
34
+ /Gemfile.lock
35
+ /.ruby-version
36
+ /.ruby-gemset
37
+
38
+ # Unless supporting rvm < 1.11.0 or doing something fancy, ignore this:
39
+ .rvmrc
data/Gemfile ADDED
@@ -0,0 +1,4 @@
1
+ source 'http://rubygems.org'
2
+
3
+ # Specify your gem's dependencies in bootstrap-rails.gemspec
4
+ gemspec
@@ -0,0 +1,49 @@
1
+ bootstrap-colorpicker-rails
2
+ ===========================
3
+
4
+ A Colorpicker for Twitter Bootstrap, integrated with Rails assets pipeline
5
+
6
+ Bootstrap colorpicker for Rails
7
+ Bootstrap is a toolkit from Twitter designed to kickstart development of webapps and sites. It includes base CSS and HTML for typography, forms, buttons, tables, grids, navigation, and more.
8
+
9
+ http://twitter.github.com/bootstrap/
10
+
11
+ Bootstrap colorpicker is a plugin for Bootstrap designed by Stefan Petre. It provides a stylish color picker for Bootstrap.
12
+
13
+ http://www.eyecon.ro/bootstrap-colorpicker/
14
+
15
+ bootstrap-colorpicker-rails project integrates colorpicker with Rails 3 assets pipeline.
16
+
17
+ http://github.com/alessani/bootstrap-colorpicker-rails
18
+
19
+
20
+ Rails > 3.1
21
+ Include bootstrap-colorpicker-rails in Gemfile;
22
+
23
+ group :assets do
24
+ gem 'bootstrap-colorpicker-rails'
25
+ end
26
+ or you can install from latest build;
27
+
28
+ group :assets do
29
+ gem 'bootstrap-colorpicker-rails', :require => 'bootstrap-colorpicker-rails',
30
+ :git => 'git://github.com/alessani/bootstrap-colorpicker-rails.git'
31
+ end
32
+ and run bundle install.
33
+
34
+ Stylesheets
35
+ Add necessary stylesheet file to app/assets/stylesheets/application.css
36
+
37
+ *= require bootstrap-colorpicker
38
+
39
+ Javascripts
40
+ Add necessary javascript(s) files to app/assets/javascripts/application.js
41
+
42
+ //= require bootstrap-colorpicker
43
+
44
+ Using bootstrap-colorpicker-rails
45
+ Just call colorpicker() with any selector.
46
+
47
+ $('.colorpicker').colorpicker()
48
+
49
+ There are some options you can pass to colorpicker(). They are documented at http://www.eyecon.ro/bootstrap-colorpicker/
@@ -0,0 +1,12 @@
1
+ #!/usr/bin/env rake
2
+ require File.expand_path('../lib/bootstrap-colorpicker-rails/version', __FILE__)
3
+
4
+ desc "Build the gem"
5
+ task "build" do
6
+ system("gem build bootstrap-colorpicker-rails.gemspec")
7
+ end
8
+
9
+ desc "Publish the gem"
10
+ task 'publish' do
11
+ system("gem push bootstrap-colorpicker-rails-#{BootstrapColorpickerRails::Rails::VERSION}.gem")
12
+ end
Binary file
@@ -0,0 +1,540 @@
1
+ /* =========================================================
2
+ * bootstrap-colorpicker.js
3
+ * http://www.eyecon.ro/bootstrap-colorpicker
4
+ * =========================================================
5
+ * Copyright 2012 Stefan Petre
6
+ *
7
+ * Licensed under the Apache License, Version 2.0 (the "License");
8
+ * you may not use this file except in compliance with the License.
9
+ * You may obtain a copy of the License at
10
+ *
11
+ * http://www.apache.org/licenses/LICENSE-2.0
12
+ *
13
+ * Unless required by applicable law or agreed to in writing, software
14
+ * distributed under the License is distributed on an "AS IS" BASIS,
15
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
16
+ * See the License for the specific language governing permissions and
17
+ * limitations under the License.
18
+ * ========================================================= */
19
+
20
+ !function( $ ) {
21
+
22
+ // Color object
23
+
24
+ var Color = function(val) {
25
+ this.value = {
26
+ h: 1,
27
+ s: 1,
28
+ b: 1,
29
+ a: 1
30
+ };
31
+ this.setColor(val);
32
+ };
33
+
34
+ Color.prototype = {
35
+ constructor: Color,
36
+
37
+ //parse a string to HSB
38
+ setColor: function(val){
39
+ val = val.toLowerCase();
40
+ var that = this;
41
+ $.each( CPGlobal.stringParsers, function( i, parser ) {
42
+ var match = parser.re.exec( val ),
43
+ values = match && parser.parse( match ),
44
+ space = parser.space||'rgba';
45
+ if ( values ) {
46
+ if (space === 'hsla') {
47
+ that.value = CPGlobal.RGBtoHSB.apply(null, CPGlobal.HSLtoRGB.apply(null, values));
48
+ } else {
49
+ that.value = CPGlobal.RGBtoHSB.apply(null, values);
50
+ }
51
+ return false;
52
+ }
53
+ });
54
+ },
55
+
56
+ setHue: function(h) {
57
+ this.value.h = 1- h;
58
+ },
59
+
60
+ setSaturation: function(s) {
61
+ this.value.s = s;
62
+ },
63
+
64
+ setLightness: function(b) {
65
+ this.value.b = 1- b;
66
+ },
67
+
68
+ setAlpha: function(a) {
69
+ this.value.a = parseInt((1 - a)*100, 10)/100;
70
+ },
71
+
72
+ // HSBtoRGB from RaphaelJS
73
+ // https://github.com/DmitryBaranovskiy/raphael/
74
+ toRGB: function(h, s, b, a) {
75
+ if (!h) {
76
+ h = this.value.h;
77
+ s = this.value.s;
78
+ b = this.value.b;
79
+ }
80
+ h *= 360;
81
+ var R, G, B, X, C;
82
+ h = (h % 360) / 60;
83
+ C = b * s;
84
+ X = C * (1 - Math.abs(h % 2 - 1));
85
+ R = G = B = b - C;
86
+
87
+ h = ~~h;
88
+ R += [C, X, 0, 0, X, C][h];
89
+ G += [X, C, C, X, 0, 0][h];
90
+ B += [0, 0, X, C, C, X][h];
91
+ return {
92
+ r: Math.round(R*255),
93
+ g: Math.round(G*255),
94
+ b: Math.round(B*255),
95
+ a: a||this.value.a
96
+ };
97
+ },
98
+
99
+ toHex: function(h, s, b, a){
100
+ var rgb = this.toRGB(h, s, b, a);
101
+ return '#'+((1 << 24) | (parseInt(rgb.r) << 16) | (parseInt(rgb.g) << 8) | parseInt(rgb.b)).toString(16).substr(1);
102
+ },
103
+
104
+ toHSL: function(h, s, b, a){
105
+ if (!h) {
106
+ h = this.value.h;
107
+ s = this.value.s;
108
+ b = this.value.b;
109
+ }
110
+ var H = h,
111
+ L = (2 - s) * b,
112
+ S = s * b;
113
+ if (L > 0 && L <= 1) {
114
+ S /= L;
115
+ } else {
116
+ S /= 2 - L;
117
+ }
118
+ L /= 2;
119
+ if (S > 1) {
120
+ S = 1;
121
+ }
122
+ return {
123
+ h: H,
124
+ s: S,
125
+ l: L,
126
+ a: a||this.value.a
127
+ };
128
+ }
129
+ };
130
+
131
+ // Picker object
132
+
133
+ var Colorpicker = function(element, options){
134
+ this.element = $(element);
135
+ var format = options.format||this.element.data('color-format')||'hex';
136
+ this.format = CPGlobal.translateFormats[format];
137
+ this.isInput = this.element.is('input');
138
+ this.component = this.element.is('.color') ? this.element.find('.add-on') : false;
139
+
140
+ this.picker = $(CPGlobal.template)
141
+ .appendTo('body')
142
+ .on('mousedown', $.proxy(this.mousedown, this));
143
+
144
+ if (this.isInput) {
145
+ this.element.on({
146
+ 'focus': $.proxy(this.show, this),
147
+ 'keyup': $.proxy(this.update, this)
148
+ });
149
+ } else if (this.component){
150
+ this.component.on({
151
+ 'click': $.proxy(this.show, this)
152
+ });
153
+ } else {
154
+ this.element.on({
155
+ 'click': $.proxy(this.show, this)
156
+ });
157
+ }
158
+ if (format === 'rgba' || format === 'hsla') {
159
+ this.picker.addClass('alpha');
160
+ this.alpha = this.picker.find('.colorpicker-alpha')[0].style;
161
+ }
162
+
163
+ if (this.component){
164
+ this.picker.find('.colorpicker-color').hide();
165
+ this.preview = this.element.find('i')[0].style;
166
+ } else {
167
+ this.preview = this.picker.find('div:last')[0].style;
168
+ }
169
+
170
+ this.base = this.picker.find('div:first')[0].style;
171
+ this.update();
172
+ };
173
+
174
+ Colorpicker.prototype = {
175
+ constructor: Colorpicker,
176
+
177
+ show: function(e) {
178
+ this.picker.show();
179
+ this.height = this.component ? this.component.outerHeight() : this.element.outerHeight();
180
+ this.place();
181
+ $(window).on('resize', $.proxy(this.place, this));
182
+ if (!this.isInput) {
183
+ if (e) {
184
+ e.stopPropagation();
185
+ e.preventDefault();
186
+ }
187
+ }
188
+ $(document).on({
189
+ 'mousedown': $.proxy(this.hide, this)
190
+ });
191
+ this.element.trigger({
192
+ type: 'show',
193
+ color: this.color
194
+ });
195
+ },
196
+
197
+ update: function(){
198
+ this.color = new Color(this.isInput ? this.element.prop('value') : this.element.data('color'));
199
+ this.picker.find('i')
200
+ .eq(0).css({left: this.color.value.s*100, top: 100 - this.color.value.b*100}).end()
201
+ .eq(1).css('top', 100 * (1 - this.color.value.h)).end()
202
+ .eq(2).css('top', 100 * (1 - this.color.value.a));
203
+ this.previewColor();
204
+ },
205
+
206
+ setValue: function(newColor) {
207
+ this.color = new Color(newColor);
208
+ this.picker.find('i')
209
+ .eq(0).css({left: this.color.value.s*100, top: 100 - this.color.value.b*100}).end()
210
+ .eq(1).css('top', 100 * (1 - this.color.value.h)).end()
211
+ .eq(2).css('top', 100 * (1 - this.color.value.a));
212
+ this.previewColor();
213
+ this.element.trigger({
214
+ type: 'changeColor',
215
+ color: this.color
216
+ });
217
+ },
218
+
219
+ hide: function(){
220
+ this.picker.hide();
221
+ $(window).off('resize', this.place);
222
+ if (!this.isInput) {
223
+ $(document).off({
224
+ 'mousedown': this.hide
225
+ });
226
+ if (this.component){
227
+ this.element.find('input').prop('value', this.format.call(this));
228
+ }
229
+ this.element.data('color', this.format.call(this));
230
+ } else {
231
+ this.element.prop('value', this.format.call(this));
232
+ }
233
+ this.element.trigger({
234
+ type: 'hide',
235
+ color: this.color
236
+ });
237
+ },
238
+
239
+ place: function(){
240
+ var offset = this.component ? this.component.offset() : this.element.offset();
241
+ this.picker.css({
242
+ top: offset.top + this.height,
243
+ left: offset.left
244
+ });
245
+ },
246
+
247
+ //preview color change
248
+ previewColor: function(){
249
+ try {
250
+ this.preview.backgroundColor = this.format.call(this);
251
+ } catch(e) {
252
+ this.preview.backgroundColor = this.color.toHex();
253
+ }
254
+ //set the color for brightness/saturation slider
255
+ this.base.backgroundColor = this.color.toHex(this.color.value.h, 1, 1, 1);
256
+ //set te color for alpha slider
257
+ if (this.alpha) {
258
+ this.alpha.backgroundColor = this.color.toHex();
259
+ }
260
+ },
261
+
262
+ pointer: null,
263
+
264
+ slider: null,
265
+
266
+ mousedown: function(e){
267
+ e.stopPropagation();
268
+ e.preventDefault();
269
+
270
+ var target = $(e.target);
271
+
272
+ //detect the slider and set the limits and callbacks
273
+ var zone = target.closest('div');
274
+ if (!zone.is('.colorpicker')) {
275
+ if (zone.is('.colorpicker-saturation')) {
276
+ this.slider = $.extend({}, CPGlobal.sliders.saturation);
277
+ }
278
+ else if (zone.is('.colorpicker-hue')) {
279
+ this.slider = $.extend({}, CPGlobal.sliders.hue);
280
+ }
281
+ else if (zone.is('.colorpicker-alpha')) {
282
+ this.slider = $.extend({}, CPGlobal.sliders.alpha);
283
+ } else {
284
+ return false;
285
+ }
286
+ var offset = zone.offset();
287
+ //reference to knob's style
288
+ this.slider.knob = zone.find('i')[0].style;
289
+ this.slider.left = e.pageX - offset.left;
290
+ this.slider.top = e.pageY - offset.top;
291
+ this.pointer = {
292
+ left: e.pageX,
293
+ top: e.pageY
294
+ };
295
+ //trigger mousemove to move the knob to the current position
296
+ $(document).on({
297
+ mousemove: $.proxy(this.mousemove, this),
298
+ mouseup: $.proxy(this.mouseup, this)
299
+ }).trigger('mousemove');
300
+ }
301
+ return false;
302
+ },
303
+
304
+ mousemove: function(e){
305
+ e.stopPropagation();
306
+ e.preventDefault();
307
+ var left = Math.max(
308
+ 0,
309
+ Math.min(
310
+ this.slider.maxLeft,
311
+ this.slider.left + ((e.pageX||this.pointer.left) - this.pointer.left)
312
+ )
313
+ );
314
+ var top = Math.max(
315
+ 0,
316
+ Math.min(
317
+ this.slider.maxTop,
318
+ this.slider.top + ((e.pageY||this.pointer.top) - this.pointer.top)
319
+ )
320
+ );
321
+ this.slider.knob.left = left + 'px';
322
+ this.slider.knob.top = top + 'px';
323
+ if (this.slider.callLeft) {
324
+ this.color[this.slider.callLeft].call(this.color, left/100);
325
+ }
326
+ if (this.slider.callTop) {
327
+ this.color[this.slider.callTop].call(this.color, top/100);
328
+ }
329
+ this.previewColor();
330
+ this.element.trigger({
331
+ type: 'changeColor',
332
+ color: this.color
333
+ });
334
+ return false;
335
+ },
336
+
337
+ mouseup: function(e){
338
+ e.stopPropagation();
339
+ e.preventDefault();
340
+ $(document).off({
341
+ mousemove: this.mousemove,
342
+ mouseup: this.mouseup
343
+ });
344
+ return false;
345
+ }
346
+ }
347
+
348
+ $.fn.colorpicker = function ( option, val ) {
349
+ return this.each(function () {
350
+ var $this = $(this),
351
+ data = $this.data('colorpicker'),
352
+ options = typeof option === 'object' && option;
353
+ if (!data) {
354
+ $this.data('colorpicker', (data = new Colorpicker(this, $.extend({}, $.fn.colorpicker.defaults,options))));
355
+ }
356
+ if (typeof option === 'string') data[option](val);
357
+ });
358
+ };
359
+
360
+ $.fn.colorpicker.defaults = {
361
+ };
362
+
363
+ $.fn.colorpicker.Constructor = Colorpicker;
364
+
365
+ var CPGlobal = {
366
+
367
+ // translate a format from Color object to a string
368
+ translateFormats: {
369
+ 'rgb': function(){
370
+ var rgb = this.color.toRGB();
371
+ return 'rgb('+rgb.r+','+rgb.g+','+rgb.b+')';
372
+ },
373
+
374
+ 'rgba': function(){
375
+ var rgb = this.color.toRGB();
376
+ return 'rgba('+rgb.r+','+rgb.g+','+rgb.b+','+rgb.a+')';
377
+ },
378
+
379
+ 'hsl': function(){
380
+ var hsl = this.color.toHSL();
381
+ return 'hsl('+Math.round(hsl.h*360)+','+Math.round(hsl.s*100)+'%,'+Math.round(hsl.l*100)+'%)';
382
+ },
383
+
384
+ 'hsla': function(){
385
+ var hsl = this.color.toHSL();
386
+ return 'hsla('+Math.round(hsl.h*360)+','+Math.round(hsl.s*100)+'%,'+Math.round(hsl.l*100)+'%,'+hsl.a+')';
387
+ },
388
+
389
+ 'hex': function(){
390
+ return this.color.toHex();
391
+ }
392
+ },
393
+
394
+ sliders: {
395
+ saturation: {
396
+ maxLeft: 100,
397
+ maxTop: 100,
398
+ callLeft: 'setSaturation',
399
+ callTop: 'setLightness'
400
+ },
401
+
402
+ hue: {
403
+ maxLeft: 0,
404
+ maxTop: 100,
405
+ callLeft: false,
406
+ callTop: 'setHue'
407
+ },
408
+
409
+ alpha: {
410
+ maxLeft: 0,
411
+ maxTop: 100,
412
+ callLeft: false,
413
+ callTop: 'setAlpha'
414
+ }
415
+ },
416
+
417
+ // HSBtoRGB from RaphaelJS
418
+ // https://github.com/DmitryBaranovskiy/raphael/
419
+ RGBtoHSB: function (r, g, b, a){
420
+ r /= 255;
421
+ g /= 255;
422
+ b /= 255;
423
+
424
+ var H, S, V, C;
425
+ V = Math.max(r, g, b);
426
+ C = V - Math.min(r, g, b);
427
+ H = (C === 0 ? null :
428
+ V == r ? (g - b) / C :
429
+ V == g ? (b - r) / C + 2 :
430
+ (r - g) / C + 4
431
+ );
432
+ H = ((H + 360) % 6) * 60 / 360;
433
+ S = C === 0 ? 0 : C / V;
434
+ return {h: H||1, s: S, b: V, a: a||1};
435
+ },
436
+
437
+ HueToRGB: function (p, q, h) {
438
+ if (h < 0)
439
+ h += 1;
440
+ else if (h > 1)
441
+ h -= 1;
442
+
443
+ if ((h * 6) < 1)
444
+ return p + (q - p) * h * 6;
445
+ else if ((h * 2) < 1)
446
+ return q;
447
+ else if ((h * 3) < 2)
448
+ return p + (q - p) * ((2 / 3) - h) * 6;
449
+ else
450
+ return p;
451
+ },
452
+
453
+ HSLtoRGB: function (h, s, l, a)
454
+ {
455
+ if (s < 0) {
456
+ s = 0;
457
+ }
458
+ var q;
459
+ if (l <= 0.5) {
460
+ q = l * (1 + s);
461
+ } else {
462
+ q = l + s - (l * s);
463
+ }
464
+
465
+ var p = 2 * l - q;
466
+
467
+ var tr = h + (1 / 3);
468
+ var tg = h;
469
+ var tb = h - (1 / 3);
470
+
471
+ var r = Math.round(CPGlobal.HueToRGB(p, q, tr) * 255);
472
+ var g = Math.round(CPGlobal.HueToRGB(p, q, tg) * 255);
473
+ var b = Math.round(CPGlobal.HueToRGB(p, q, tb) * 255);
474
+ return [r, g, b, a||1];
475
+ },
476
+
477
+ // a set of RE's that can match strings and generate color tuples.
478
+ // from John Resig color plugin
479
+ // https://github.com/jquery/jquery-color/
480
+ stringParsers: [
481
+ {
482
+ re: /rgba?\(\s*(\d{1,3})\s*,\s*(\d{1,3})\s*,\s*(\d{1,3})\s*(?:,\s*(\d+(?:\.\d+)?)\s*)?\)/,
483
+ parse: function( execResult ) {
484
+ return [
485
+ execResult[ 1 ],
486
+ execResult[ 2 ],
487
+ execResult[ 3 ],
488
+ execResult[ 4 ]
489
+ ];
490
+ }
491
+ }, {
492
+ re: /rgba?\(\s*(\d+(?:\.\d+)?)\%\s*,\s*(\d+(?:\.\d+)?)\%\s*,\s*(\d+(?:\.\d+)?)\%\s*(?:,\s*(\d+(?:\.\d+)?)\s*)?\)/,
493
+ parse: function( execResult ) {
494
+ return [
495
+ 2.55 * execResult[1],
496
+ 2.55 * execResult[2],
497
+ 2.55 * execResult[3],
498
+ execResult[ 4 ]
499
+ ];
500
+ }
501
+ }, {
502
+ re: /#([a-fA-F0-9]{2})([a-fA-F0-9]{2})([a-fA-F0-9]{2})/,
503
+ parse: function( execResult ) {
504
+ return [
505
+ parseInt( execResult[ 1 ], 16 ),
506
+ parseInt( execResult[ 2 ], 16 ),
507
+ parseInt( execResult[ 3 ], 16 )
508
+ ];
509
+ }
510
+ }, {
511
+ re: /#([a-fA-F0-9])([a-fA-F0-9])([a-fA-F0-9])/,
512
+ parse: function( execResult ) {
513
+ return [
514
+ parseInt( execResult[ 1 ] + execResult[ 1 ], 16 ),
515
+ parseInt( execResult[ 2 ] + execResult[ 2 ], 16 ),
516
+ parseInt( execResult[ 3 ] + execResult[ 3 ], 16 )
517
+ ];
518
+ }
519
+ }, {
520
+ re: /hsla?\(\s*(\d+(?:\.\d+)?)\s*,\s*(\d+(?:\.\d+)?)\%\s*,\s*(\d+(?:\.\d+)?)\%\s*(?:,\s*(\d+(?:\.\d+)?)\s*)?\)/,
521
+ space: 'hsla',
522
+ parse: function( execResult ) {
523
+ return [
524
+ execResult[1]/360,
525
+ execResult[2] / 100,
526
+ execResult[3] / 100,
527
+ execResult[4]
528
+ ];
529
+ }
530
+ }
531
+ ],
532
+ template: '<div class="colorpicker dropdown-menu">'+
533
+ '<div class="colorpicker-saturation"><i><b></b></i></div>'+
534
+ '<div class="colorpicker-hue"><i></i></div>'+
535
+ '<div class="colorpicker-alpha"><i></i></div>'+
536
+ '<div class="colorpicker-color"><div /></div>'+
537
+ '</div>'
538
+ };
539
+
540
+ }( window.jQuery )
@@ -0,0 +1,127 @@
1
+ /*!
2
+ * Colorpicker for Bootstrap
3
+ *
4
+ * Copyright 2012 Stefan Petre
5
+ * Licensed under the Apache License v2.0
6
+ * http://www.apache.org/licenses/LICENSE-2.0
7
+ *
8
+ */
9
+ .colorpicker-saturation {
10
+ width: 100px;
11
+ height: 100px;
12
+ background-image: image-url('saturation.png');
13
+ cursor: crosshair;
14
+ float: left;
15
+ }
16
+ .colorpicker-saturation i {
17
+ display: block;
18
+ height: 5px;
19
+ width: 5px;
20
+ border: 1px solid #000;
21
+ -webkit-border-radius: 5px;
22
+ -moz-border-radius: 5px;
23
+ border-radius: 5px;
24
+ position: absolute;
25
+ top: 0;
26
+ left: 0;
27
+ margin: -4px 0 0 -4px;
28
+ }
29
+ .colorpicker-saturation i b {
30
+ display: block;
31
+ height: 5px;
32
+ width: 5px;
33
+ border: 1px solid #fff;
34
+ -webkit-border-radius: 5px;
35
+ -moz-border-radius: 5px;
36
+ border-radius: 5px;
37
+ }
38
+ .colorpicker-hue, .colorpicker-alpha {
39
+ width: 15px;
40
+ height: 100px;
41
+ float: left;
42
+ cursor: row-resize;
43
+ margin-left: 4px;
44
+ margin-bottom: 4px;
45
+ }
46
+ .colorpicker-hue i, .colorpicker-alpha i {
47
+ display: block;
48
+ height: 1px;
49
+ background: #000;
50
+ border-top: 1px solid #fff;
51
+ position: absolute;
52
+ top: 0;
53
+ left: 0;
54
+ width: 100%;
55
+ margin-top: -1px;
56
+ }
57
+ .colorpicker-hue {
58
+ background-image: image-url('hue.png');
59
+ }
60
+ .colorpicker-alpha {
61
+ background-image: image-url('alpha.png');
62
+ display: none;
63
+ }
64
+ .colorpicker {
65
+ *zoom: 1;
66
+ top: 0;
67
+ left: 0;
68
+ padding: 4px;
69
+ min-width: 120px;
70
+ margin-top: 1px;
71
+ -webkit-border-radius: 4px;
72
+ -moz-border-radius: 4px;
73
+ border-radius: 4px;
74
+ }
75
+ .colorpicker:before, .colorpicker:after {
76
+ display: table;
77
+ content: "";
78
+ }
79
+ .colorpicker:after {
80
+ clear: both;
81
+ }
82
+ .colorpicker:before {
83
+ content: '';
84
+ display: inline-block;
85
+ border-left: 7px solid transparent;
86
+ border-right: 7px solid transparent;
87
+ border-bottom: 7px solid #ccc;
88
+ border-bottom-color: rgba(0, 0, 0, 0.2);
89
+ position: absolute;
90
+ top: -7px;
91
+ left: 6px;
92
+ }
93
+ .colorpicker:after {
94
+ content: '';
95
+ display: inline-block;
96
+ border-left: 6px solid transparent;
97
+ border-right: 6px solid transparent;
98
+ border-bottom: 6px solid #ffffff;
99
+ position: absolute;
100
+ top: -6px;
101
+ left: 7px;
102
+ }
103
+ .colorpicker div {
104
+ position: relative;
105
+ }
106
+ .colorpicker.alpha {
107
+ min-width: 140px;
108
+ }
109
+ .colorpicker.alpha .colorpicker-alpha {
110
+ display: block;
111
+ }
112
+ .colorpicker-color {
113
+ height: 10px;
114
+ margin-top: 5px;
115
+ clear: both;
116
+ background-image: image-url('alpha.png');
117
+ background-position: 0 100%;
118
+ }
119
+ .colorpicker-color div {
120
+ height: 10px;
121
+ }
122
+ .input-append.color .add-on i, .input-prepend.color .add-on i {
123
+ display: block;
124
+ cursor: pointer;
125
+ width: 16px;
126
+ height: 16px;
127
+ }
@@ -0,0 +1,19 @@
1
+ # -*- encoding: utf-8 -*-
2
+ require File.expand_path('../lib/bootstrap-colorpicker-rails/version', __FILE__)
3
+
4
+ Gem::Specification.new do |gem|
5
+ gem.authors = ["Matteo Alessani"]
6
+ gem.email = ["alessani@gmail.com"]
7
+ gem.description = %q{A color picker for Twitter Bootstrap}
8
+ gem.homepage = "https://github.com/alessani/bootstrap-colorpicker-rails"
9
+ gem.summary = gem.description
10
+
11
+ gem.name = "bootstrap-colorpick-rails"
12
+ gem.require_paths = ["lib"]
13
+ gem.files = `git ls-files`.split("\n")
14
+ gem.version = BootstrapColorpickerRails::Rails::VERSION
15
+
16
+ gem.add_dependency "railties", ">= 3.0"
17
+ gem.add_development_dependency "bundler", ">= 1.0"
18
+ gem.add_development_dependency "rake"
19
+ end
@@ -0,0 +1 @@
1
+ require 'bootstrap-colorpicker-rails'
@@ -0,0 +1,12 @@
1
+ require "rails"
2
+ require "bootstrap-colorpicker-rails/version"
3
+
4
+ module BootstrapDatepickerRails
5
+ module Rails
6
+ if ::Rails.version < "3.1"
7
+ require "bootstrap-colorpicker-rails/railtie"
8
+ else
9
+ require "bootstrap-colorpicker-rails/engine"
10
+ end
11
+ end
12
+ end
@@ -0,0 +1,6 @@
1
+ module BootstrapColorpickerRails
2
+ module Rails
3
+ class Engine < ::Rails::Engine
4
+ end
5
+ end
6
+ end
@@ -0,0 +1,5 @@
1
+ module BootstrapColorpickerRails
2
+ module Rails
3
+ class Railtie < ::Rails::Railtie; end
4
+ end
5
+ end
@@ -0,0 +1,5 @@
1
+ module BootstrapColorpickerRails
2
+ module Rails
3
+ VERSION = "0.0.0"
4
+ end
5
+ end
metadata ADDED
@@ -0,0 +1,100 @@
1
+ --- !ruby/object:Gem::Specification
2
+ name: bootstrap-colorpick-rails
3
+ version: !ruby/object:Gem::Version
4
+ version: 0.0.0
5
+ platform: ruby
6
+ authors:
7
+ - Matteo Alessani
8
+ autorequire:
9
+ bindir: bin
10
+ cert_chain: []
11
+ date: 2019-06-29 00:00:00.000000000 Z
12
+ dependencies:
13
+ - !ruby/object:Gem::Dependency
14
+ name: railties
15
+ requirement: !ruby/object:Gem::Requirement
16
+ requirements:
17
+ - - ">="
18
+ - !ruby/object:Gem::Version
19
+ version: '3.0'
20
+ type: :runtime
21
+ prerelease: false
22
+ version_requirements: !ruby/object:Gem::Requirement
23
+ requirements:
24
+ - - ">="
25
+ - !ruby/object:Gem::Version
26
+ version: '3.0'
27
+ - !ruby/object:Gem::Dependency
28
+ name: bundler
29
+ requirement: !ruby/object:Gem::Requirement
30
+ requirements:
31
+ - - ">="
32
+ - !ruby/object:Gem::Version
33
+ version: '1.0'
34
+ type: :development
35
+ prerelease: false
36
+ version_requirements: !ruby/object:Gem::Requirement
37
+ requirements:
38
+ - - ">="
39
+ - !ruby/object:Gem::Version
40
+ version: '1.0'
41
+ - !ruby/object:Gem::Dependency
42
+ name: rake
43
+ requirement: !ruby/object:Gem::Requirement
44
+ requirements:
45
+ - - ">="
46
+ - !ruby/object:Gem::Version
47
+ version: '0'
48
+ type: :development
49
+ prerelease: false
50
+ version_requirements: !ruby/object:Gem::Requirement
51
+ requirements:
52
+ - - ">="
53
+ - !ruby/object:Gem::Version
54
+ version: '0'
55
+ description: A color picker for Twitter Bootstrap
56
+ email:
57
+ - alessani@gmail.com
58
+ executables: []
59
+ extensions: []
60
+ extra_rdoc_files: []
61
+ files:
62
+ - ".gitignore"
63
+ - Gemfile
64
+ - README.md
65
+ - Rakefile
66
+ - app/assets/images/alpha.png
67
+ - app/assets/images/hue.png
68
+ - app/assets/images/saturation.png
69
+ - app/assets/javascripts/bootstrap-colorpicker.js
70
+ - app/assets/stylesheets/bootstrap-colorpicker.css.scss
71
+ - bootstrap-colorpick-rails.gemspec
72
+ - lib/bootstrap-colorpick-rails.rb
73
+ - lib/bootstrap-colorpicker-rails.rb
74
+ - lib/bootstrap-colorpicker-rails/engine.rb
75
+ - lib/bootstrap-colorpicker-rails/railtie.rb
76
+ - lib/bootstrap-colorpicker-rails/version.rb
77
+ homepage: https://github.com/alessani/bootstrap-colorpicker-rails
78
+ licenses: []
79
+ metadata: {}
80
+ post_install_message:
81
+ rdoc_options: []
82
+ require_paths:
83
+ - lib
84
+ required_ruby_version: !ruby/object:Gem::Requirement
85
+ requirements:
86
+ - - ">="
87
+ - !ruby/object:Gem::Version
88
+ version: '0'
89
+ required_rubygems_version: !ruby/object:Gem::Requirement
90
+ requirements:
91
+ - - ">="
92
+ - !ruby/object:Gem::Version
93
+ version: '0'
94
+ requirements: []
95
+ rubyforge_project:
96
+ rubygems_version: 2.7.10
97
+ signing_key:
98
+ specification_version: 4
99
+ summary: A color picker for Twitter Bootstrap
100
+ test_files: []