let reference;

let image_to_mod;

let cmap = {};

let testmap = {};

let dis_map = {};

let pass = 0;

let all_keys = [];

let key_map_idx = 0;

let keymap_block = 75;

let use_hsb = false;

​

function setup() {

  createCanvas(1000, 1038);

  frameRate(60);

}

​

function pad_number(n, padding, pad_char){

  str_n = str(n);

  current_digits = str_n.length;  

  //console.log(current_digits);

  for(let i = 0; i < padding - current_digits; i++){

    str_n = pad_char + str_n;

    //console.log(str_n)

  }

  return str_n;

}

​

function euc3d(cl1, cl2){

  if (use_hsb){

    //hue(), saturation() and brightness()

    //console.log("hue " + hue(cl1) + ", " + hue(cl2));

    //console.log("saturation " + saturation(cl1) + ", " + saturation(cl2));

    //console.log("brightness " + brightness(cl1) + ", " + brightness(cl2));

    return sqrt(pow(hue(cl1) - hue(cl2), 2) + pow(saturation(cl1) - saturation(cl2), 2) + pow(brightness(cl1) - brightness(cl2), 2));

​

  }

  return sqrt(pow(cl1[0] - cl2[0], 2) + pow(cl1[1] - cl2[1], 2) + pow(cl1[2] - cl2[2], 2));

}

​

function make_key(cl){

  return pad_number(cl[0], 3, '0') + 

         pad_number(cl[1], 3, '0') + 

         pad_number(cl[2], 3, '0');  

}

​

function build_color_map(img){

  let local_map = {}

  for (let i = 0; i < img.width; i++) {

    for (let j = 0; j < img.height; j++) {

      let key = make_key(img.get(i, j));

      //console.log(make_key(img.get(i, j)));

      //img.set(i, j, color(0, 90, 102));

      if (!(key in local_map)){

        local_map[key] = img.get(i, j);

      }

    }

  }

  return local_map;

}

​

function classify(clr){

  //console.log("start classify")

  let local_key = make_key(clr);

  if (local_key in dis_map){

    //console.log("end classify")

    return dis_map[local_key];

  }

  else {

    let best = euc3d([0,0,0], [255, 255, 255]);

    let best_key = "";

    //console.log("best: " + best);

    for(let key in cmap){

      let dis = euc3d(clr, cmap[key]);

      //console.log("dis: " + dis);

      if (dis < best){

        best = dis;

        best_key = key;

      }

    }

    dis_map[local_key] = cmap[best_key];

    //console.log("end classify")

    return dis_map[local_key];

  }  

}

​

function classify_map(training_map, testing_map){

  for(let i = key_map_idx; i < key_map_idx + keymap_block && i < all_keys.length; i++){    

    let key = all_keys[i];

    //console.log("key: " + key)

    let local_key = make_key(testing_map[key]);

    let best = euc3d([0,0,0], [255, 255, 255]);

    let best_key = "";

    if (! (local_key in dis_map)){

      for(let train_key in training_map){

        let dis = euc3d(testing_map[key], training_map[train_key]);

        //Just for testing this log message

        //if (i % 100 == 0)

        //  console.log(dis, make_key(key), make_key(train_key), best_key, best);

        if (dis < best){

          best = dis;

          best_key = train_key;

        }

      }

      dis_map[local_key] = training_map[best_key];

    }

  }

  key_map_idx+=keymap_block;

} 

​

​

function replace_block(img, start_y, end_y){

  for (let i = 0; i < img.width; i++) {

    for (let j = start_y; j < img.height && j < end_y; j++) {

      let key = make_key(img.get(i, j));      

      img.set(i, j, dis_map[key]);

    }

  }  

  img.updatePixels()

}

​

function preload() {

  reference = loadImage("assets/squi.png");

  //build_color_map(reference);

  image_to_mod = loadImage("assets/sm_walken.png");

  //img = loadImage("assets/walken.jpg");

}

​

let img_y = 0;

​

function draw() {

  //let best = euc3d([0,0,0], [255, 255, 255]);

  //console.log(best);

  //noLoop();

  //return;

  background(220);  

  //console.log(reference.width);

  //console.log(reference.height);

  if (pass == 0){

    cmap = build_color_map(reference);    

    textSize(32);

    text('finished with reference map', 10, 30);

    fill(0, 102, 153);

  }

  else if (pass == 1){

    testmap = build_color_map(image_to_mod);

    all_keys = Object.keys(testmap);

    textSize(32);

    text('finished with image to mod map', 10, 30);

    fill(0, 102, 153);

​

  }

  else if (pass >=  2 && key_map_idx < all_keys.length){

    //console.log("classify " + key_map_idx)

    classify_map(cmap, testmap);

    textSize(32);

    text('finished with classifying map: ' + key_map_idx, 10, 30);

    fill(0, 102, 153);

  }

  else {

    replace_block(image_to_mod, img_y, img_y + 2);

    img_y += 2;

    //console.log(pass);

    //console.log(Object.keys(cmap).length);

    image(image_to_mod, 0, 0, image_to_mod.width, image_to_mod.height, 0, 0, image_to_mod.width, image_to_mod.height);

  }

​

  //for(let key in cmap){

  //  console.log(cmap[key]);

  //}

​

  //pad_number(123, 5, '0')

  //console.log(pad_number(123, 5, '0'));

  //console.log(pad_number(456, 3, '+'));

  //console.log(pad_number(789, -1, '+'));

  //console.log(pad_number(321, 10, 'A'));

  //noLoop();

  pass++;

}