JSFiddle - React, Tailwind, and code Playground

by tylerbrownhenry

JavaScript

/*
Take color 1 343434
If 100% Then change color 2 to color 1
if 90% add 10% * 9 to background (average it 9 times);
*/


var difference = function (a, b) { 
    if(a > b){
    return Math.abs(a - b); 
        } else {
    return Math.abs(b - a); 
        };
};
    

console.log(difference(244,289));

function calc(bg,br,hits){
   
    //return average = ((br+bg)/2).toFixed(2);
    if(bg < br){
        return Math.floor(bg - br);
    }else {
        return Math.ceil(br + bg);
    };
    var miN = Math.min(br,bg);
    var maX = Math.max(br,bg);
    
    console.log(miN,'|min',maX,'|');
    
    if(bg !== 0 && bg > br ) {
        var valC = parseInt(maX) + parseInt(miN);    
    } else {
        var valC = parseInt(maX) + parseInt(miN);   
    };

    console.log(valC,'val',bg,br);
    return  valC;
    
   // return parseInt(((x+y)/2).toFixed(2));
    
};

        

var color1 = 'ffffff';// background color
var color2 = '111111';// brush color
var colorHardness = 10;



function mergeImage(color1,color2,colorDepth){ 
    
    var color1 = color1.split(""); 
    var color2 = color2.split(""); 
    darkenColor = new Array();
    
    for(var i=5; color1.length > 1;i--){
        ////num = (parseInt(color.shift(),16)*16)+(parseInt(color.shift(),16));
        var c1 = (parseInt(color1.shift(),16)*16)+(parseInt(color1.shift(),16));
        var c2 = (parseInt(color2.shift(),16)*16)+(parseInt(color2.shift(),16));
        
        if(c1 > c2){
            steps = colorHardness;
            for(i=steps;i > 0; i--){
                differenceIn10PercentSteps = 
                color1 - (color2 / 10); 
            };
        };
        console.log((parseInt(c2 * colorHardness * 10)/10),'|',c1,'|',c2,'|',num);
        
        //for(i = 0; i < 0; i ++){
        //For the depth of color, average the colors closer and closer.
        num = calc(c2,num);
        //};
        
        var num = num.toString(16); 
   
               // $('span').text(num);
        
              ...