Slow down color tools

This commit is contained in:
O-01-67 2022-06-14 09:59:15 -04:00 committed by GitHub
parent 334d7e94f6
commit 3a784dc941
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 37 additions and 9 deletions

View File

@ -1,3 +1,11 @@
function increment() {
if(typeof(colorToolCounter) === "undefined") {
colorToolCounter = 0;
};
colorToolCounter++;
};
colorToolCounterInterval = setInterval(increment, 50);
function _rgbToHex(color) {
if(typeof(color) == "object") { //Expects object like "{r: 172, g: 11, b: 34}"
//console.log("Loading colors");
@ -88,14 +96,17 @@ function _rgbToHex(color) {
elements.multiply_color = {
color: ["#c27070","#c29c70","#c2c270","#70c270","#70c2c2","#7070c2","#c270c2"],
tool: function(pixel) {
// convert the hex of currentColor to rgb and set it as a string
var rgb = currentColor.replace("#","").match(/.{1,2}/g);
for (var i = 0; i < rgb.length; i++) {
rgb[i] = parseInt(rgb[i],16);
}
var oldColor = hexToRGB(_rgbToHex(pixel.color))
var finalColor = [Math.round(oldColor.r * (rgb[0] / 255)), Math.round(oldColor.g * (rgb[1] / 255)), Math.round(oldColor.b * (rgb[2] / 255))]
pixel.color = "rgb(" + finalColor.join(",") + ")"
if(colorToolCounter % 3 == 0) {
// convert the hex of currentColor to rgb and set it as a string
var rgb = currentColor.replace("#","").match(/.{1,2}/g);
for (var i = 0; i < rgb.length; i++) {
rgb[i] = parseInt(rgb[i],16);
};
var oldColor = hexToRGB(_rgbToHex(pixel.color))
var finalColor = [Math.round(oldColor.r * (rgb[0] / 255)), Math.round(oldColor.g * (rgb[1] / 255)), Math.round(oldColor.b * (rgb[2] / 255))]
pixel.color = "rgb(" + finalColor.join(",") + ")"
colorToolCounter = 0;
};
},
customColor: true,
category: "color tools", //the toolbar is getting cluttered
@ -105,6 +116,7 @@ elements.multiply_color = {
/*elements.divide_color = { //can't get it to work how I want it to work
color: ["#c27070","#c29c70","#c2c270","#70c270","#70c2c2","#7070c2","#c270c2"],
tool: function(pixel) {
if(colorToolCounter % 3 == 0) {
// convert the hex of currentColor to rgb and set it as a string
var rgb = currentColor.replace("#","").match(/.{1,2}/g);
for (var i = 0; i < rgb.length; i++) {
@ -113,6 +125,8 @@ elements.multiply_color = {
var oldColor = hexToRGB(_rgbToHex(pixel.color))
var finalColor = [Math.round(256 / ((rgb[0] + 1) / (oldColor.r + 1))), Math.round(256 / ((rgb[1] + 1) / (oldColor.g + 1))), Math.round(256 / ((rgb[2] + 1) / (oldColor.b + 1)))]
pixel.color = "rgb(" + finalColor.join(",") + ")"
colorToolCounter = 0;
};
},
customColor: true,
category: "color tools",
@ -122,6 +136,7 @@ elements.multiply_color = {
elements.add_color = {
color: ["#c27070","#c29c70","#c2c270","#70c270","#70c2c2","#7070c2","#c270c2"],
tool: function(pixel) {
if(colorToolCounter % 3 == 0) {
// convert the hex of currentColor to rgb and set it as a string
var rgb = currentColor.replace("#","").match(/.{1,2}/g);
for (var i = 0; i < rgb.length; i++) {
@ -130,6 +145,7 @@ elements.add_color = {
var oldColor = hexToRGB(_rgbToHex(pixel.color))
var finalColor = [Math.min(oldColor.r + rgb[0], 255), Math.min(oldColor.g + rgb[1], 255), Math.min(oldColor.b + rgb[2], 255)]
pixel.color = "rgb(" + finalColor.join(",") + ")"
};
},
customColor: true,
category: "color tools",
@ -139,6 +155,7 @@ elements.add_color = {
elements.subtract_color = {
color: ["#c27070","#c29c70","#c2c270","#70c270","#70c2c2","#7070c2","#c270c2"],
tool: function(pixel) {
if(colorToolCounter % 3 == 0) {
// convert the hex of currentColor to rgb and set it as a string
var rgb = currentColor.replace("#","").match(/.{1,2}/g);
for (var i = 0; i < rgb.length; i++) {
@ -147,6 +164,8 @@ elements.subtract_color = {
var oldColor = hexToRGB(_rgbToHex(pixel.color))
var finalColor = [Math.max(oldColor.r - rgb[0], 0), Math.max(oldColor.g - rgb[1], 0), Math.max(oldColor.b - rgb[2], 0)]
pixel.color = "rgb(" + finalColor.join(",") + ")"
colorToolCounter = 0;
};
},
customColor: true,
category: "color tools",
@ -169,10 +188,13 @@ elements.grayscale = {
elements.invert = {
color: ["#ff0000", "#00ffff"],
tool: function(pixel) {
if(colorToolCounter % 3 == 0) {
// convert the hex of currentColor to rgb and set it as a string
var oldColor = hexToRGB(_rgbToHex(pixel.color))
var finalColor = [(255 - oldColor.r), (255 - oldColor.g), (255 - oldColor.b)]
pixel.color = "rgb(" + finalColor.join(",") + ")"
colorToolCounter = 0;
};
},
category: "color tools",
excludeRandom: true,
@ -181,10 +203,13 @@ elements.invert = {
elements.reverse_R_G_B = {
color: ["#7f7f7f"],
tool: function(pixel) {
if(colorToolCounter % 3 == 0) {
// convert the hex of currentColor to rgb and set it as a string
var oldColor = hexToRGB(_rgbToHex(pixel.color))
var finalColor = [oldColor.b, oldColor.g, oldColor.r]
pixel.color = "rgb(" + finalColor.join(",") + ")"
colorToolCounter = 0;
};
},
category: "color tools",
excludeRandom: true,
@ -193,11 +218,14 @@ elements.reverse_R_G_B = {
elements.shift_R_G_B = {
color: ["#7f7f7f"],
tool: function(pixel) {
if(colorToolCounter % 3 == 0) {
// convert the hex of currentColor to rgb and set it as a string
var oldColor = hexToRGB(_rgbToHex(pixel.color))
var finalColor = [oldColor.g, oldColor.b, oldColor.r]
pixel.color = "rgb(" + finalColor.join(",") + ")"
colorToolCounter = 0;
};
},
category: "color tools",
excludeRandom: true,
}
}