Team2890/PhotonVision
4
0
Fork 0
mirror of https://github.com/PhotonVision/photonvision synced 2026-06-22 01:11:40 +00:00
Code Issues Packages Projects Releases Wiki Activity

cleanup and commenting

Browse Source
This commit is contained in:
Omer
2019-12-03 00:57:21 +02:00
parent b4e4f7b57c
commit b56b3a7918
1 changed files with 16 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
chameleon-client/src/plugins/ColorPicker.js
View File

@@ -8,6 +8,11 @@ function initColorPicker() {
canvas.height = image.height;
}
//Called on click of the image,
//Finds X,Y of the mouse on the image,
//Draws the image on the (invisible) canvas
//Reads the color values (pixelData) in X,Y of the canvas
//calls the function to handle the button (either eyedrop,expand or shrink)
function colorPickerClick(event, currentFunction, currentRange) {
let rect = image.getBoundingClientRect();
let x = Math.round(event.clientX - rect.left);
@@ -23,13 +28,11 @@ function colorPickerClick(event, currentFunction, currentRange) {
function eyeDrop(pixel) {
let hsv = RGBtoHSV(pixel);
let range = createRange([hsv]);
range = widenRange(range);
range = widenRange([hsv,hsv.slice(0)]);//sends hsv and a copy of hsv
return range
}
function expand(pixel, currentRange) {
let hsv = RGBtoHSV(pixel);
let widenHSV = widenRange([[].concat(hsv), hsv]);
return createRange(currentRange.concat(widenHSV));
@@ -38,12 +41,12 @@ function expand(pixel, currentRange) {
function shrink(pixel, currentRange) {
let hsv = RGBtoHSV(pixel);
let widenHSV = widenRange([[].concat(hsv), hsv]);
if (!shrinkRange(currentRange, widenHSV[0]))
shrinkRange(currentRange, widenHSV[1]);
if (!shrinkRange(currentRange, widenHSV[0]))//Tries to shrink the lower part of the widen HSV
shrinkRange(currentRange, widenHSV[1]);//If the prev attempt failed, try to shrink the higher part of the widen HSV
return currentRange
}
//numbers is an array of 3 rgb values, returns array for 3 hsv values
function RGBtoHSV(numbers) {
let r = numbers[0],
g = numbers[1],
@@ -67,6 +70,7 @@ function RGBtoHSV(numbers) {
return [Math.round(H), Math.round(S), Math.round(V)];
}
//Loops though the colors array, finds the smallest and biggest value for H,S and V. Returns the range containing every color
function createRange(HSVColors) {
let range = [[], []];
for (var i = 0; i < 3; i++) {
@@ -80,6 +84,7 @@ function createRange(HSVColors) {
return range;//[[Hmin,Smin,Vmin],[Hmax,Smax,Vmax]]
}
//This function adds 10 extra units to each side of the sliders, not to be confued with the expand selection button
function widenRange(range) {
let expanded = [[], []];
for (let i = 0; i < 3; i++) {
@@ -91,19 +96,22 @@ function widenRange(range) {
return expanded;
}
//If color in range then take the closer range value to color and set it to color plus or minus 10
//For example if hmax is 200 hmin is 100 and color's h is 120 range will become [130,200]
function shrinkRange(range, color) {
let inside = true;
for (let i = 0; i < color.length && inside; i++) {
for (let i = 0; i < color.length && inside; i++) {//Check if color is in range
if (!(range[0][i] <= color[i] <= range[1][i]))
inside = false;
}
if (inside) {
for (let j = 0; j < color.length; j++) {
if (color[j] - range[0][j] < range[1][j] - color[j])
range[0][j] = Math.min(range[0][j] + 10, range[1][j]);//shrink from min side
else
range[1][j] = Math.max(range[1][j] - 10, range[0][j]);//shrink from max side
}
}
return inside;//returns if color is inside or not