spectrum-rails 1.2.0 → 1.3.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.
@@ -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
|