|
|
|
@ -97,7 +97,7 @@ var DataTable = $.fn.dataTable;
|
|
|
|
|
* } ]
|
|
|
|
|
* } );
|
|
|
|
|
*/
|
|
|
|
|
DataTable.render.percentBar = function (pShape, cText, cBorder, cBar, cBack, vRound, bType) {
|
|
|
|
|
DataTable.render.percentBar = function (pShape, cText, cBorder, cBar, cBack, vRound, bType, conditionalColors) {
|
|
|
|
|
pShape = pShape || 'square';
|
|
|
|
|
cText = cText || '#000';
|
|
|
|
|
cBorder = cBorder || '#BCBCBC';
|
|
|
|
@ -107,23 +107,7 @@ DataTable.render.percentBar = function (pShape, cText, cBorder, cBar, cBack, vRo
|
|
|
|
|
bType = bType || 'ridge';
|
|
|
|
|
//Bar templates
|
|
|
|
|
var styleRule1 = 'max-width:100px;height:12px;margin:0 auto;';
|
|
|
|
|
var styleRule2 = 'border:2px ' +
|
|
|
|
|
bType +
|
|
|
|
|
' ' +
|
|
|
|
|
cBorder +
|
|
|
|
|
';line-height:12px;font-size:14px;color:' +
|
|
|
|
|
cText +
|
|
|
|
|
';background:' +
|
|
|
|
|
cBack +
|
|
|
|
|
';position:relative;';
|
|
|
|
|
var styleRule3 = 'height:12px;line-height:12px;text-align:center;background-color:' +
|
|
|
|
|
cBar +
|
|
|
|
|
';padding:auto 6px;';
|
|
|
|
|
//Square is default, make template round if pShape == round
|
|
|
|
|
if (pShape == 'round') {
|
|
|
|
|
styleRule2 += 'border-radius:5px;';
|
|
|
|
|
styleRule3 += 'border-top-left-radius:4px;border-bottom-left-radius:4px;';
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
return function (d, type, row) {
|
|
|
|
|
//Remove % if found in the value
|
|
|
|
|
//Round to the given parameter vRound
|
|
|
|
@ -139,6 +123,54 @@ DataTable.render.percentBar = function (pShape, cText, cBorder, cBar, cBack, vRo
|
|
|
|
|
if (typeof d !== 'number' && typeof d !== 'string') {
|
|
|
|
|
return d;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
var cBackConditional;
|
|
|
|
|
var cBarConditional;
|
|
|
|
|
var cTextConditional;
|
|
|
|
|
// do conditional colors based on user input
|
|
|
|
|
if (conditionalColors) {
|
|
|
|
|
for (var i = 0; i < conditionalColors.length; i++) {
|
|
|
|
|
if (s >= conditionalColors[i].min && s <= conditionalColors[i].max) {
|
|
|
|
|
if (conditionalColors[i].barColor) {
|
|
|
|
|
cBarConditional = conditionalColors[i].barColor;
|
|
|
|
|
} else {
|
|
|
|
|
cBarConditional = cBar;
|
|
|
|
|
}
|
|
|
|
|
if (conditionalColors[i].backgroundColor) {
|
|
|
|
|
cBackConditional = conditionalColors[i].backgroundColor;
|
|
|
|
|
} else {
|
|
|
|
|
cBackConditional = cBack;
|
|
|
|
|
}
|
|
|
|
|
if (conditionalColors[i].textColor) {
|
|
|
|
|
cTextConditional = conditionalColors[i].textColor;
|
|
|
|
|
} else {
|
|
|
|
|
cTextConditional = cText;
|
|
|
|
|
}
|
|
|
|
|
break;
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
} else {
|
|
|
|
|
cBackConditional = cBack;
|
|
|
|
|
cBarConditional = cBar;
|
|
|
|
|
cTextConditional = cText;
|
|
|
|
|
}
|
|
|
|
|
var styleRule2 = 'border:2px ' +
|
|
|
|
|
bType +
|
|
|
|
|
' ' +
|
|
|
|
|
cBorder +
|
|
|
|
|
';line-height:12px;font-size:14px;color:' +
|
|
|
|
|
cText +
|
|
|
|
|
';background:' +
|
|
|
|
|
cBackConditional +
|
|
|
|
|
';position:relative;';
|
|
|
|
|
//Bar template
|
|
|
|
|
var styleRule3 = 'height:12px;line-height:12px;text-align:center;background-color:' +
|
|
|
|
|
cBarConditional + ';padding:auto 6px;';
|
|
|
|
|
//Square is default, make template round if pShape == round
|
|
|
|
|
if (pShape == 'round') {
|
|
|
|
|
styleRule2 += 'border-radius:5px;';
|
|
|
|
|
styleRule3 += 'border-top-left-radius:4px;border-bottom-left-radius:4px;';
|
|
|
|
|
}
|
|
|
|
|
//Return the code for the bar
|
|
|
|
|
return ('<div style="' +
|
|
|
|
|
styleRule1 +
|
|
|
|
|