The plugin's documentation don't states a way to do custom reading, checking the code you can see that both parsers CMYK and CMYK percent expects the format cmyk(value, value, value, value)
. But with the following "hack" (add the open
event to read the input value and update the control color) you can circunvent the problem and show the previously selected color every time you click the control:
<!DOCTYPE html>
<html><head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.js"></script>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/ui-lightness/jquery-ui.css" rel="stylesheet" type="text/css"/>
<script src="colorpicker/jquery.colorpicker.js"></script>
<link type="text/css" rel="stylesheet" href="colorpicker/jquery.colorpicker.css"></link>
</head>
<body>
<input type="hidden" id="cp-hidden-input" value=""/>
<input type="text" class="cp-full" value="0,83.782958984375,83.782958984375,4.736328125" style="width:350px" />
<script type="text/javascript">
$(function() {
$('.cp-full').colorpicker({
parts: ['map', 'bar', 'hex', 'rgb', 'alpha', 'cmyk', 'preview' ],
showOn: 'both',
colorFormat: ['EXACT', 'cp,mp,yp,kp'],
open: function(event, color) {
var v = $(this).val();
// Use either ',' or ';' as separator
var separator = v.indexOf(',') != -1 ? ',' : ';';
var cmyk = v.split(separator);
color.colorPicker.color.setCMYK(cmyk[0] / 100.0, cmyk[1] / 100.0, cmyk[2] / 100.0, cmyk[3] / 100.0);
},
});
});
</script>
</body>