spectrum-rails 1.2.0 → 1.3.1
Sign up to get free protection for your applications and to get access to all the features.
@@ -1,4 +1,4 @@
|
|
1
|
-
// Spectrum Colorpicker v1.
|
1
|
+
// Spectrum Colorpicker v1.3.1
|
2
2
|
// https://github.com/bgrins/spectrum
|
3
3
|
// Author: Brian Grinstead
|
4
4
|
// License: MIT
|
@@ -29,6 +29,7 @@
|
|
29
29
|
maxSelectionSize: 7,
|
30
30
|
cancelText: "cancel",
|
31
31
|
chooseText: "choose",
|
32
|
+
clearText: "Clear Color Selection",
|
32
33
|
preferredFormat: false,
|
33
34
|
className: "",
|
34
35
|
showAlpha: false,
|
@@ -86,7 +87,7 @@
|
|
86
87
|
"</div>",
|
87
88
|
"</div>",
|
88
89
|
"</div>",
|
89
|
-
"<div class='sp-clear sp-clear-display'
|
90
|
+
"<div class='sp-clear sp-clear-display'>",
|
90
91
|
"</div>",
|
91
92
|
"<div class='sp-hue'>",
|
92
93
|
"<div class='sp-slider'></div>",
|
@@ -170,8 +171,8 @@
|
|
170
171
|
currentSaturation = 0,
|
171
172
|
currentValue = 0,
|
172
173
|
currentAlpha = 1,
|
173
|
-
palette =
|
174
|
-
paletteArray =
|
174
|
+
palette = [],
|
175
|
+
paletteArray = [],
|
175
176
|
selectionPalette = opts.selectionPalette.slice(0),
|
176
177
|
maxSelectionSize = opts.maxSelectionSize,
|
177
178
|
draggingClass = "sp-dragging",
|
@@ -215,6 +216,11 @@
|
|
215
216
|
opts.showPalette = true;
|
216
217
|
}
|
217
218
|
|
219
|
+
if (opts.palette) {
|
220
|
+
palette = opts.palette.slice(0);
|
221
|
+
paletteArray = $.isArray(palette[0]) ? palette : [palette];
|
222
|
+
}
|
223
|
+
|
218
224
|
container.toggleClass("sp-flat", flat);
|
219
225
|
container.toggleClass("sp-input-disabled", !opts.showInput);
|
220
226
|
container.toggleClass("sp-alpha-enabled", opts.showAlpha);
|
@@ -310,21 +316,19 @@
|
|
310
316
|
hide("cancel");
|
311
317
|
});
|
312
318
|
|
313
|
-
|
319
|
+
clearButton.attr("title", opts.clearText);
|
314
320
|
clearButton.bind("click.spectrum", function (e) {
|
315
321
|
e.stopPropagation();
|
316
322
|
e.preventDefault();
|
317
|
-
|
318
323
|
isEmpty = true;
|
319
|
-
|
320
324
|
move();
|
325
|
+
|
321
326
|
if(flat) {
|
322
327
|
//for the flat style, this is a change event
|
323
328
|
updateOriginalInput(true);
|
324
329
|
}
|
325
330
|
});
|
326
331
|
|
327
|
-
|
328
332
|
chooseButton.text(opts.chooseText);
|
329
333
|
chooseButton.bind("click.spectrum", function (e) {
|
330
334
|
e.stopPropagation();
|
@@ -344,11 +348,14 @@
|
|
344
348
|
}
|
345
349
|
|
346
350
|
move();
|
347
|
-
});
|
351
|
+
}, dragStart, dragStop);
|
348
352
|
|
349
353
|
draggable(slider, function (dragX, dragY) {
|
350
354
|
currentHue = parseFloat(dragY / slideHeight);
|
351
355
|
isEmpty = false;
|
356
|
+
if (!opts.showAlpha) {
|
357
|
+
currentAlpha = 1;
|
358
|
+
}
|
352
359
|
move();
|
353
360
|
}, dragStart, dragStop);
|
354
361
|
|
@@ -377,6 +384,9 @@
|
|
377
384
|
}
|
378
385
|
|
379
386
|
isEmpty = false;
|
387
|
+
if (!opts.showAlpha) {
|
388
|
+
currentAlpha = 1;
|
389
|
+
}
|
380
390
|
|
381
391
|
move();
|
382
392
|
|
@@ -407,8 +417,8 @@
|
|
407
417
|
}
|
408
418
|
else {
|
409
419
|
set($(this).data("color"));
|
410
|
-
updateOriginalInput(true);
|
411
420
|
move();
|
421
|
+
updateOriginalInput(true);
|
412
422
|
hide();
|
413
423
|
}
|
414
424
|
|
@@ -496,10 +506,12 @@
|
|
496
506
|
}
|
497
507
|
container.addClass(draggingClass);
|
498
508
|
shiftMovementDirection = null;
|
509
|
+
boundElement.trigger('dragstart.spectrum', [ get() ]);
|
499
510
|
}
|
500
511
|
|
501
512
|
function dragStop() {
|
502
513
|
container.removeClass(draggingClass);
|
514
|
+
boundElement.trigger('dragstop.spectrum', [ get() ]);
|
503
515
|
}
|
504
516
|
|
505
517
|
function setFromTextInput() {
|
@@ -508,11 +520,13 @@
|
|
508
520
|
|
509
521
|
if ((value === null || value === "") && allowEmpty) {
|
510
522
|
set(null);
|
523
|
+
updateOriginalInput(true);
|
511
524
|
}
|
512
525
|
else {
|
513
526
|
var tiny = tinycolor(value);
|
514
527
|
if (tiny.ok) {
|
515
528
|
set(tiny);
|
529
|
+
updateOriginalInput(true);
|
516
530
|
}
|
517
531
|
else {
|
518
532
|
textInput.addClass("sp-validation-error");
|
@@ -551,9 +565,6 @@
|
|
551
565
|
replacer.addClass("sp-active");
|
552
566
|
container.removeClass("sp-hidden");
|
553
567
|
|
554
|
-
if (opts.showPalette) {
|
555
|
-
drawPalette();
|
556
|
-
}
|
557
568
|
reflow();
|
558
569
|
updateUI();
|
559
570
|
|
@@ -600,16 +611,19 @@
|
|
600
611
|
|
601
612
|
function set(color, ignoreFormatChange) {
|
602
613
|
if (tinycolor.equals(color, get())) {
|
614
|
+
// Update UI just in case a validation error needs
|
615
|
+
// to be cleared.
|
616
|
+
updateUI();
|
603
617
|
return;
|
604
618
|
}
|
605
619
|
|
606
|
-
var newColor;
|
620
|
+
var newColor, newHsv;
|
607
621
|
if (!color && allowEmpty) {
|
608
622
|
isEmpty = true;
|
609
623
|
} else {
|
610
624
|
isEmpty = false;
|
611
625
|
newColor = tinycolor(color);
|
612
|
-
|
626
|
+
newHsv = newColor.toHsv();
|
613
627
|
|
614
628
|
currentHue = (newHsv.h % 360) / 360;
|
615
629
|
currentSaturation = newHsv.s;
|
@@ -661,7 +675,7 @@
|
|
661
675
|
|
662
676
|
// Get a format that alpha will be included in (hex and names ignore alpha)
|
663
677
|
var format = currentPreferredFormat;
|
664
|
-
if (currentAlpha < 1) {
|
678
|
+
if (currentAlpha < 1 && !(currentAlpha === 0 && format === "name")) {
|
665
679
|
if (format === "hex" || format === "hex3" || format === "hex6" || format === "name") {
|
666
680
|
format = "rgb";
|
667
681
|
}
|
@@ -704,12 +718,15 @@
|
|
704
718
|
alphaSliderInner.css("background", "-webkit-" + gradient);
|
705
719
|
alphaSliderInner.css("background", "-moz-" + gradient);
|
706
720
|
alphaSliderInner.css("background", "-ms-" + gradient);
|
707
|
-
|
721
|
+
// Use current syntax gradient on unprefixed property.
|
722
|
+
alphaSliderInner.css("background",
|
723
|
+
"linear-gradient(to right, " + realAlpha + ", " + realHex + ")");
|
708
724
|
}
|
709
725
|
}
|
710
726
|
|
711
727
|
displayColor = realColor.toString(format);
|
712
728
|
}
|
729
|
+
|
713
730
|
// Update the text entry input as it changes happen
|
714
731
|
if (opts.showInput) {
|
715
732
|
textInput.val(displayColor);
|
@@ -750,19 +767,19 @@
|
|
750
767
|
Math.min(dragHeight - dragHelperHeight, dragY - dragHelperHeight)
|
751
768
|
);
|
752
769
|
dragHelper.css({
|
753
|
-
"top": dragY,
|
754
|
-
"left": dragX
|
770
|
+
"top": dragY + "px",
|
771
|
+
"left": dragX + "px"
|
755
772
|
});
|
756
773
|
|
757
774
|
var alphaX = currentAlpha * alphaWidth;
|
758
775
|
alphaSlideHelper.css({
|
759
|
-
"left": alphaX - (alphaSlideHelperWidth / 2)
|
776
|
+
"left": (alphaX - (alphaSlideHelperWidth / 2)) + "px"
|
760
777
|
});
|
761
778
|
|
762
779
|
// Where to show the bar that displays your current selected hue
|
763
780
|
var slideY = (currentHue) * slideHeight;
|
764
781
|
slideHelper.css({
|
765
|
-
"top": slideY - slideHelperHeight
|
782
|
+
"top": (slideY - slideHelperHeight) + "px"
|
766
783
|
});
|
767
784
|
}
|
768
785
|
}
|
@@ -772,7 +789,7 @@
|
|
772
789
|
displayColor = '',
|
773
790
|
hasChanged = !tinycolor.equals(color, colorOnShow);
|
774
791
|
|
775
|
-
if(color) {
|
792
|
+
if (color) {
|
776
793
|
displayColor = color.toString(currentPreferredFormat);
|
777
794
|
// Update the selection palette with the current color
|
778
795
|
addColorToSelectionPalette(color);
|
@@ -806,6 +823,12 @@
|
|
806
823
|
}
|
807
824
|
|
808
825
|
updateHelperLocations();
|
826
|
+
|
827
|
+
if (opts.showPalette) {
|
828
|
+
drawPalette();
|
829
|
+
}
|
830
|
+
|
831
|
+
boundElement.trigger('reflow.spectrum');
|
809
832
|
}
|
810
833
|
|
811
834
|
function destroy() {
|
@@ -971,6 +994,7 @@
|
|
971
994
|
onmove.apply(element, [dragX, dragY, e]);
|
972
995
|
}
|
973
996
|
}
|
997
|
+
|
974
998
|
function start(e) {
|
975
999
|
var rightclick = (e.which) ? (e.which == 3) : (e.button == 2);
|
976
1000
|
var touches = e.originalEvent.touches;
|
@@ -993,6 +1017,7 @@
|
|
993
1017
|
}
|
994
1018
|
}
|
995
1019
|
}
|
1020
|
+
|
996
1021
|
function stop() {
|
997
1022
|
if (dragging) {
|
998
1023
|
$(doc).unbind(duringDragEvents);
|
@@ -1018,7 +1043,6 @@
|
|
1018
1043
|
};
|
1019
1044
|
}
|
1020
1045
|
|
1021
|
-
|
1022
1046
|
function log(){/* jshint -W021 */if(window.console){if(Function.prototype.bind)log=Function.prototype.bind.call(console.log,console);else log=function(){Function.prototype.apply.call(console.log,console,arguments);};log.apply(this,arguments);}}
|
1023
1047
|
|
1024
1048
|
/**
|
@@ -1035,7 +1059,6 @@
|
|
1035
1059
|
this.each(function () {
|
1036
1060
|
var spect = spectrums[$(this).data(dataID)];
|
1037
1061
|
if (spect) {
|
1038
|
-
|
1039
1062
|
var method = spect[opts];
|
1040
1063
|
if (!method) {
|
1041
1064
|
throw new Error( "Spectrum: no such method: '" + opts + "'" );
|
@@ -1065,7 +1088,8 @@
|
|
1065
1088
|
|
1066
1089
|
// Initializing a new instance of spectrum
|
1067
1090
|
return this.spectrum("destroy").each(function () {
|
1068
|
-
var
|
1091
|
+
var options = $.extend({}, opts, $(this).data());
|
1092
|
+
var spect = spectrum(this, options);
|
1069
1093
|
$(this).data(dataID, spect.id);
|
1070
1094
|
});
|
1071
1095
|
};
|
@@ -1087,7 +1111,7 @@
|
|
1087
1111
|
}
|
1088
1112
|
};
|
1089
1113
|
|
1090
|
-
// TinyColor v0.9.
|
1114
|
+
// TinyColor v0.9.17
|
1091
1115
|
// https://github.com/bgrins/TinyColor
|
1092
1116
|
// 2013-08-10, Brian Grinstead, MIT License
|
1093
1117
|
|
@@ -1166,7 +1190,13 @@
|
|
1166
1190
|
return rgbToHex(r, g, b, allow3Char);
|
1167
1191
|
},
|
1168
1192
|
toHexString: function(allow3Char) {
|
1169
|
-
return '#' +
|
1193
|
+
return '#' + this.toHex(allow3Char);
|
1194
|
+
},
|
1195
|
+
toHex8: function() {
|
1196
|
+
return rgbaToHex(r, g, b, a);
|
1197
|
+
},
|
1198
|
+
toHex8String: function() {
|
1199
|
+
return '#' + this.toHex8();
|
1170
1200
|
},
|
1171
1201
|
toRgb: function() {
|
1172
1202
|
return { r: mathRound(r), g: mathRound(g), b: mathRound(b), a: a };
|
@@ -1192,19 +1222,16 @@
|
|
1192
1222
|
return hexNames[rgbToHex(r, g, b, true)] || false;
|
1193
1223
|
},
|
1194
1224
|
toFilter: function(secondColor) {
|
1195
|
-
var
|
1196
|
-
var
|
1197
|
-
var alphaHex = Math.round(parseFloat(a) * 255).toString(16);
|
1198
|
-
var secondAlphaHex = alphaHex;
|
1225
|
+
var hex8String = '#' + rgbaToHex(r, g, b, a);
|
1226
|
+
var secondHex8String = hex8String;
|
1199
1227
|
var gradientType = opts && opts.gradientType ? "GradientType = 1, " : "";
|
1200
1228
|
|
1201
1229
|
if (secondColor) {
|
1202
1230
|
var s = tinycolor(secondColor);
|
1203
|
-
|
1204
|
-
secondAlphaHex = Math.round(parseFloat(s.alpha) * 255).toString(16);
|
1231
|
+
secondHex8String = s.toHex8String();
|
1205
1232
|
}
|
1206
1233
|
|
1207
|
-
return "progid:DXImageTransform.Microsoft.gradient("+gradientType+"startColorstr
|
1234
|
+
return "progid:DXImageTransform.Microsoft.gradient("+gradientType+"startColorstr="+hex8String+",endColorstr="+secondHex8String+")";
|
1208
1235
|
},
|
1209
1236
|
toString: function(format) {
|
1210
1237
|
var formatSet = !!format;
|
@@ -1226,6 +1253,9 @@
|
|
1226
1253
|
if (format === "hex3") {
|
1227
1254
|
formattedString = this.toHexString(true);
|
1228
1255
|
}
|
1256
|
+
if (format === "hex8") {
|
1257
|
+
formattedString = this.toHex8String();
|
1258
|
+
}
|
1229
1259
|
if (format === "name") {
|
1230
1260
|
formattedString = this.toName();
|
1231
1261
|
}
|
@@ -1272,6 +1302,7 @@
|
|
1272
1302
|
// "red"
|
1273
1303
|
// "#f00" or "f00"
|
1274
1304
|
// "#ff0000" or "ff0000"
|
1305
|
+
// "#ff000000" or "ff000000"
|
1275
1306
|
// "rgb 255 0 0" or "rgb (255, 0, 0)"
|
1276
1307
|
// "rgb 1.0 0 0" or "rgb (1, 0, 0)"
|
1277
1308
|
// "rgba (255, 0, 0, 1)" or "rgba 255, 0, 0, 1"
|
@@ -1486,6 +1517,21 @@
|
|
1486
1517
|
|
1487
1518
|
return hex.join("");
|
1488
1519
|
}
|
1520
|
+
// `rgbaToHex`
|
1521
|
+
// Converts an RGBA color plus alpha transparency to hex
|
1522
|
+
// Assumes r, g, b and a are contained in the set [0, 255]
|
1523
|
+
// Returns an 8 character hex
|
1524
|
+
function rgbaToHex(r, g, b, a) {
|
1525
|
+
|
1526
|
+
var hex = [
|
1527
|
+
pad2(convertDecimalToHex(a)),
|
1528
|
+
pad2(mathRound(r).toString(16)),
|
1529
|
+
pad2(mathRound(g).toString(16)),
|
1530
|
+
pad2(mathRound(b).toString(16))
|
1531
|
+
];
|
1532
|
+
|
1533
|
+
return hex.join("");
|
1534
|
+
}
|
1489
1535
|
|
1490
1536
|
// `equals`
|
1491
1537
|
// Can be called with any tinycolor input
|
@@ -1882,8 +1928,8 @@
|
|
1882
1928
|
return mathMin(1, mathMax(0, val));
|
1883
1929
|
}
|
1884
1930
|
|
1885
|
-
// Parse
|
1886
|
-
function
|
1931
|
+
// Parse a base-16 hex value into a base-10 integer
|
1932
|
+
function parseIntFromHex(val) {
|
1887
1933
|
return parseInt(val, 16);
|
1888
1934
|
}
|
1889
1935
|
|
@@ -1912,6 +1958,15 @@
|
|
1912
1958
|
return n;
|
1913
1959
|
}
|
1914
1960
|
|
1961
|
+
// Converts a decimal to a hex value
|
1962
|
+
function convertDecimalToHex(d) {
|
1963
|
+
return Math.round(parseFloat(d) * 255).toString(16);
|
1964
|
+
}
|
1965
|
+
// Converts a hex value to a decimal
|
1966
|
+
function convertHexToDecimal(h) {
|
1967
|
+
return (parseIntFromHex(h) / 255);
|
1968
|
+
}
|
1969
|
+
|
1915
1970
|
var matchers = (function() {
|
1916
1971
|
|
1917
1972
|
// <http://www.w3.org/TR/css3-values/#integers>
|
@@ -1936,7 +1991,8 @@
|
|
1936
1991
|
hsla: new RegExp("hsla" + PERMISSIVE_MATCH4),
|
1937
1992
|
hsv: new RegExp("hsv" + PERMISSIVE_MATCH3),
|
1938
1993
|
hex3: /^([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/,
|
1939
|
-
hex6: /^([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})
|
1994
|
+
hex6: /^([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/,
|
1995
|
+
hex8: /^([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/
|
1940
1996
|
};
|
1941
1997
|
})();
|
1942
1998
|
|
@@ -1975,19 +2031,28 @@
|
|
1975
2031
|
if ((match = matchers.hsv.exec(color))) {
|
1976
2032
|
return { h: match[1], s: match[2], v: match[3] };
|
1977
2033
|
}
|
2034
|
+
if ((match = matchers.hex8.exec(color))) {
|
2035
|
+
return {
|
2036
|
+
a: convertHexToDecimal(match[1]),
|
2037
|
+
r: parseIntFromHex(match[2]),
|
2038
|
+
g: parseIntFromHex(match[3]),
|
2039
|
+
b: parseIntFromHex(match[4]),
|
2040
|
+
format: named ? "name" : "hex8"
|
2041
|
+
};
|
2042
|
+
}
|
1978
2043
|
if ((match = matchers.hex6.exec(color))) {
|
1979
2044
|
return {
|
1980
|
-
r:
|
1981
|
-
g:
|
1982
|
-
b:
|
2045
|
+
r: parseIntFromHex(match[1]),
|
2046
|
+
g: parseIntFromHex(match[2]),
|
2047
|
+
b: parseIntFromHex(match[3]),
|
1983
2048
|
format: named ? "name" : "hex"
|
1984
2049
|
};
|
1985
2050
|
}
|
1986
2051
|
if ((match = matchers.hex3.exec(color))) {
|
1987
2052
|
return {
|
1988
|
-
r:
|
1989
|
-
g:
|
1990
|
-
b:
|
2053
|
+
r: parseIntFromHex(match[1] + '' + match[1]),
|
2054
|
+
g: parseIntFromHex(match[2] + '' + match[2]),
|
2055
|
+
b: parseIntFromHex(match[3] + '' + match[3]),
|
1991
2056
|
format: named ? "name" : "hex"
|
1992
2057
|
};
|
1993
2058
|
}
|
@@ -1,5 +1,5 @@
|
|
1
1
|
/***
|
2
|
-
Spectrum Colorpicker v1.
|
2
|
+
Spectrum Colorpicker v1.3.1
|
3
3
|
https://github.com/bgrins/spectrum
|
4
4
|
Author: Brian Grinstead
|
5
5
|
License: MIT
|
@@ -20,6 +20,14 @@ License: MIT
|
|
20
20
|
position: relative;
|
21
21
|
}
|
22
22
|
|
23
|
+
/* Fix for * { box-sizing: border-box; } */
|
24
|
+
.sp-container,
|
25
|
+
.sp-container * {
|
26
|
+
-webkit-box-sizing: content-box;
|
27
|
+
-moz-box-sizing: content-box;
|
28
|
+
box-sizing: content-box;
|
29
|
+
}
|
30
|
+
|
23
31
|
/* http://ansciath.tumblr.com/post/7347495869/css-aspect-ratio */
|
24
32
|
.sp-top {
|
25
33
|
position:relative;
|
metadata
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
2
2
|
name: spectrum-rails
|
3
3
|
version: !ruby/object:Gem::Version
|
4
|
-
version: 1.
|
4
|
+
version: 1.3.1
|
5
5
|
prerelease:
|
6
6
|
platform: ruby
|
7
7
|
authors:
|
@@ -9,7 +9,7 @@ authors:
|
|
9
9
|
autorequire:
|
10
10
|
bindir: bin
|
11
11
|
cert_chain: []
|
12
|
-
date:
|
12
|
+
date: 2014-02-15 00:00:00.000000000 Z
|
13
13
|
dependencies:
|
14
14
|
- !ruby/object:Gem::Dependency
|
15
15
|
name: railties
|