Octavia/odin-etch-a-sketch
Watch
1
0
Fork
You've already forked odin-etch-a-sketch
 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Add tint and shading functions

Browse source
This commit is contained in:
lolabird 2023-11-10 09:20:46 -07:00
commit 354bc7c4d0
1 changed files with 29 additions and 1 deletions
Download patch file Download diff file Expand all files Collapse all files

30
script.js
View file

@ -53,7 +53,9 @@ function colorGrid() {
if (isRgb) {
this.style.background = randomizeColor();
} else if (isTint) {
this.style.background = tintColor(this.style.background);
} else if (isShade) {
this.style.background = shadeColor(this.style.background);
} else {
this.style.background = colorValue;
}
@ -74,6 +76,12 @@ function changeColor() {
isTint = false
}
if (buttonID === "shade") {
isShade = true;
} else {
isShade = false
}
switch (buttonID) {
case "whiteColor":
colorValue = "white";
@ -102,7 +110,27 @@ function randomizeColor() {
let b = Math.floor(Math.random() * 255);
return `rgb(${r},${g},${b})`;
}
function tintColor(value) {
let num = value.match(/\d+/g);
r = num[0] + num[0] * 1/10;
g = num[1] + num[1] * 1/10;
b = num[2] + num[2] * 1/10;
console.log(r, g, b);
return`rgb(${r},${g},${b})`;
}
function shadeColor(value) {
let num = value.match(/\d+/g);
r = num[0] - num[0] * 1/10;
g = num[1] - num[1] * 1/10;
b = num[2] - num[2] * 1/10;
console.log(r, g, b);
return`rgb(${r},${g},${b})`;
}
createGrid();