Mirror/betaflight-configurator
1
0
Fork 0
mirror of https://github.com/betaflight/betaflight-configurator.git synced 2025-07-15 20:35:23 +03:00
Code Issues Wiki Activity

Added change heatmap to PIDs for the sliders

Browse source
This commit is contained in:
Andrew Young 2019-12-18 02:38:47 +00:00
parent 56fff56577
commit 10fb05efc8
6 changed files with 98 additions and 4 deletions
Download patch file Download diff file Expand all files Collapse all files

48
src/js/utils/css.js Normal file
View file

@ -0,0 +1,48 @@
'use strict';
/*
This utility contains CSS helpers.
*/
const CSSUtil = function () {};
CSSUtil.prototype.colorTables = {
redWhiteGreen: [
{ percentage: -1, color: { r: 0xff, g: 0x00, b: 0x00 } },
{ percentage: 0, color: { r: 0xff, g: 0xff, b: 0xff } },
{ percentage: 1, color: { r: 0x00, g: 0xff, b: 0x00 } }
],
pidSlider: [
{ percentage: -1, color: { r: 0xc5, g: 0xc5, b: 0xc5 } },
{ percentage: 0, color: { r: 0xff, g: 0xff, b: 0xff } },
{ percentage: 1, color: { r: 0xff, g: 0x54, b: 0x0e } }
],
};
// Stack Overflow: https://stackoverflow.com/a/7128796/4107016
CSSUtil.prototype.getColorForPercentage = function(percentage, colorTable = null) {
colorTable = colorTable || cssUtil.colorTables.redWhiteGreen;
percentage = Math.min(1, Math.max(-1, percentage));
let index;
for (index = 1; index < colorTable.length - 1; index++) {
if (percentage < colorTable[index].percentage) {
break;
}
}
const lower = colorTable[index - 1];
const upper = colorTable[index];
const range = upper.percentage - lower.percentage;
const rangePercentage = (percentage - lower.percentage) / range;
const percentageLower = 1 - rangePercentage;
const percentageUpper = rangePercentage;
const color = {
r: Math.floor(lower.color.r * percentageLower + upper.color.r * percentageUpper),
g: Math.floor(lower.color.g * percentageLower + upper.color.g * percentageUpper),
b: Math.floor(lower.color.b * percentageLower + upper.color.b * percentageUpper)
};
return "rgb(" + [color.r, color.g, color.b].join(",") + ")";
};
const cssUtil = new CSSUtil();