[Pkg-javascript-commits] [jquery-minicolors] 06/15: Now selecting a swatch sets the value in the input field as requested in the settings
David Prévot
taffit at moszumanska.debian.org
Sat Jan 30 21:52:49 UTC 2016
This is an automated email from the git hooks/post-receive script.
taffit pushed a commit to branch master
in repository jquery-minicolors.
commit abc187d7a18a1e1ae9484d599fec3b818705e985
Author: Andrea Baron <andrea at bhweb.it>
Date: Wed Jan 27 10:35:29 2016 +0100
Now selecting a swatch sets the value in the input field as requested in the settings
I moved a part from "updateFromControl" to its own function,
updateInput, that now can convert between hex and rgb based on the input
value and the format specified in settings, in this way users can input
swatches in all possible ways, and the result will always be rgb or hex
depending on the settings.format parameter.
Fixes claviska/jquery-minicolors#187
---
jquery.minicolors.js | 92 +++++++++++++++++++++++++++++++++++-----------------
1 file changed, 63 insertions(+), 29 deletions(-)
diff --git a/jquery.minicolors.js b/jquery.minicolors.js
index ca7b7ff..ca20f92 100644
--- a/jquery.minicolors.js
+++ b/jquery.minicolors.js
@@ -151,7 +151,6 @@
var minicolors = $('<div class="minicolors" />'),
defaults = $.minicolors.defaults,
- opacity = input.attr('data-opacity'),
size,
swatches,
swatch,
@@ -396,7 +395,6 @@
hex = input.val(),
opacity = input.attr('data-opacity'),
- value,
// Helpful references
minicolors = input.parent(),
@@ -497,47 +495,84 @@
break;
}
-
+
// Handle opacity
if( settings.opacity ) {
opacity = parseFloat(1 - (opacityPos.y / opacitySlider.height())).toFixed(2);
} else {
opacity = 1;
}
- if( settings.opacity ) input.attr('data-opacity', opacity);
+
+ updateInput(input, hex, opacity);
+ }
+ else {
+ // Set swatch color
+ swatch.find('span').css({
+ backgroundColor: hex,
+ opacity: opacity
+ });
- // Set color string
- if( settings.format === 'rgb' ) {
- // Returns RGB(A) string
- var rgb = hex2rgb(hex),
- opacity = input.attr('data-opacity') === '' ? 1 : keepWithin( parseFloat( input.attr('data-opacity') ).toFixed(2), 0, 1 );
- if( isNaN( opacity ) || !settings.opacity ) opacity = 1;
-
- if( input.minicolors('rgbObject').a <= 1 && rgb && settings.opacity) {
- // Set RGBA string if alpha
- value = 'rgba(' + rgb.r + ', ' + rgb.g + ', ' + rgb.b + ', ' + parseFloat( opacity ) + ')';
- } else {
- // Set RGB string (alpha = 1)
- value = 'rgb(' + rgb.r + ', ' + rgb.g + ', ' + rgb.b + ')';
- }
- } else {
- // Returns hex color
- value = convertCase( hex, settings.letterCase );
+ // Handle change event
+ doChange(input, hex, opacity);
+ }
+ }
+
+ // Sets the value of the input and does the appropriate conversions
+ // to respect settings, also updates the swatch
+ function updateInput(input, value, opacity) {
+ var rgb,
+
+ // Helpful references
+ minicolors = input.parent(),
+ settings = input.data('minicolors-settings'),
+ swatch = minicolors.find('.minicolors-input-swatch');
+
+ if( settings.opacity ) input.attr('data-opacity', opacity);
+
+ // Set color string
+ if( settings.format === 'rgb' ) {
+ // Returns RGB(A) string
+
+ // Checks for input format and does the conversion
+ if ( isRgb(value) ) {
+ rgb = parseRgb(value, true);
+ }
+ else {
+ rgb = hex2rgb(parseHex(value, true));
}
+
+ opacity = input.attr('data-opacity') === '' ? 1 : keepWithin( parseFloat( input.attr('data-opacity') ).toFixed(2), 0, 1 );
+ if( isNaN( opacity ) || !settings.opacity ) opacity = 1;
- // Update value from picker
- input.val( value );
+ if( input.minicolors('rgbObject').a <= 1 && rgb && settings.opacity) {
+ // Set RGBA string if alpha
+ value = 'rgba(' + rgb.r + ', ' + rgb.g + ', ' + rgb.b + ', ' + parseFloat( opacity ) + ')';
+ } else {
+ // Set RGB string (alpha = 1)
+ value = 'rgb(' + rgb.r + ', ' + rgb.g + ', ' + rgb.b + ')';
+ }
+ } else {
+ // Returns hex color
+
+ // Checks for input format and does the conversion
+ if ( isRgb(value) ) {
+ value = rgbString2hex(value);
+ }
+
+ value = convertCase( value, settings.letterCase );
}
+ // Update value from picker
+ input.val( value );
+
// Set swatch color
swatch.find('span').css({
- backgroundColor: hex,
+ backgroundColor: value,
opacity: opacity
});
// Handle change event
doChange(input, value, opacity);
-
}
// Sets the color picker values from the input
@@ -806,8 +841,7 @@
function parseRgb(string, obj) {
var values = string.replace(/[^\d,.]/g, ''),
- rgba = values.split(','),
- output;
+ rgba = values.split(',');
rgba[0] = keepWithin(parseInt(rgba[0], 10), 0, 255);
rgba[1] = keepWithin(parseInt(rgba[1], 10), 0, 255);
@@ -860,7 +894,7 @@
// Function to get alpha from a RGB(A) string
function getAlpha(rgba) {
- var rgba = rgba.match(/^rgba?[\s+]?\([\s+]?(\d+)[\s+]?,[\s+]?(\d+)[\s+]?,[\s+]?(\d+)[\s+]?,[\s+]?(\d+(\.\d{1,2})?|\.\d{1,2})[\s+]?/i);
+ rgba = rgba.match(/^rgba?[\s+]?\([\s+]?(\d+)[\s+]?,[\s+]?(\d+)[\s+]?,[\s+]?(\d+)[\s+]?,[\s+]?(\d+(\.\d{1,2})?|\.\d{1,2})[\s+]?/i);
return (rgba && rgba.length === 6) ? rgba[4] : '1';
}
@@ -994,7 +1028,7 @@
.on('click.minicolors', '.minicolors-swatches li', function(event) {
event.preventDefault();
var target = $(this), input = target.parents('.minicolors').find('.minicolors-input'), color = target.data('swatch-color');
- input.val(color).attr('data-opacity', getAlpha(color));
+ updateInput(input, color, getAlpha(color));
updateFromInput(input);
})
// Show panel when swatch is clicked
--
Alioth's /usr/local/bin/git-commit-notice on /srv/git.debian.org/git/pkg-javascript/jquery-minicolors.git
More information about the Pkg-javascript-commits
mailing list