let spriteSheets = {};
let P1imgs = {}, P2imgs = {}, itemimgs = {}, tileimgs = {}, decoimgs = {};
let backgroundManager;

function preloadAssets() {
  spriteSheets.backgrounds   = loadImage("assets/Mario-Background.png");
  spriteSheets.characters    = loadImage("assets/Mario-Character+Item.png");
  spriteSheets.specialweapon = loadImage("assets/Mario-Enemy.png");
  spriteSheets.tileset       = loadImage("assets/Mario-Tileset.png");

  soundFormats('mp3', 'wav');

}

function sliceAssets() {
  const bgsrc = spriteSheets.backgrounds;
  const w = 512, h = 512;
  const bgDay   = createImage(w, h);
  const bgNight = createImage(w, h);
  bgDay.copy(bgsrc,   514, 1565, w, h, 0, 0, w, h);
  bgNight.copy(bgsrc, 514, 5721, w, h, 0, 0, w, h);
  backgroundManager = new Background(bgDay, bgNight);

  function applyChromaKey(img, keyColor = {r:147, g:187, b:236}) {
    img.loadPixels();
    for (let i = 0; i < img.pixels.length; i += 4) {
      if (img.pixels[i] === keyColor.r && img.pixels[i+1] === keyColor.g && img.pixels[i+2] === keyColor.b) {
        img.pixels[i+3] = 0;
      }
    }
    img.updatePixels();
  }

  const src = spriteSheets.characters;
  const cw = 32, ch = 32;
  const mi = createImage(cw,ch); mi.copy(src, 1, 98, cw, ch, 0,0, cw,ch);
  const mw1= createImage(cw,ch); mw1.copy(src,75, 98, cw,ch,0,0, cw,ch);
  const mw2= createImage(cw,ch); mw2.copy(src,108,98, cw,ch,0,0, cw,ch);
  const mw3= createImage(cw,ch); mw3.copy(src,141,98, cw,ch,0,0, cw,ch);
  const mj = createImage(cw,ch); mj.copy(src,215,98, cw,ch,0,0, cw,ch);
  const ma = createImage(cw,ch); ma.copy(src,627,98, cw,ch,0,0, cw,ch);
  [mi,mw1,mw2,mw3,mj,ma].forEach(img=>applyChromaKey(img));
  
  P1imgs = { idle:[mi], walk:[mw1,mw2,mw3], jump:[mj], shoot:[ma] };

  const li = createImage(cw,ch); li.copy(src,1,629,cw,ch,0,0,cw,ch);
  const lw1= createImage(cw,ch); lw1.copy(src,75,629,cw,ch,0,0,cw,ch);
  const lw2= createImage(cw,ch); lw2.copy(src,108,629,cw,ch,0,0,cw,ch);
  const lw3= createImage(cw,ch); lw3.copy(src,141,629,cw,ch,0,0,cw,ch);
  const lj = createImage(cw,ch); lj.copy(src,215,629,cw,ch,0,0,cw,ch);
  const la = createImage(cw,ch); la.copy(src,627,629,cw,ch,0,0,cw,ch);
  [li,lw1,lw2,lw3,lj,la].forEach(img=>applyChromaKey(img));

  P2imgs = { idle:[li], walk:[lw1,lw2,lw3], jump:[lj], shoot:[la] };

  const spsrc = spriteSheets.specialweapon;
  const ow=16, oh=16;
  const mush = createImage(ow,oh); mush.copy(src,1,2126,ow,oh,0,0,ow,oh);
  const bombadd = createImage(ow,oh); bombadd.copy(spsrc, 39, 117, ow, oh, 0, 0, ow, oh);
  const poison= createImage(ow,oh); poison.copy(src,1,2143,ow,oh,0,0,ow,oh);
  const giant = createImage(ow,oh); giant.copy(src,52,2126,ow,oh,0,0,ow,oh);
  const fire  = createImage(ow/2,oh/2); fire.copy(src,101,2177,ow/2,oh/2,0,0,ow/2,oh/2);
  const fireench = createImage(ow, oh); fireench.copy(spsrc, 601, 751, ow, oh, 0, 0, ow, oh);
  const bomb  = createImage(ow,oh); bomb.copy(src,194,2143,ow,oh,0,0,ow,oh);
  const bm    = createImage(4*ow,4*oh); bm.copy(spsrc,127,356,4*ow,4*oh,0,0,4*ow,4*oh);
  const beffect = createImage(1.5*ow, 1.5*oh); beffect.copy(spsrc, 604, 413, 1.5*ow, 1.5*oh, 0, 0, 1.5*ow, 1.5*oh);
  [mush,bombadd,poison,giant,fire,fireench,bomb,bm, beffect].forEach(img=>applyChromaKey(img));
  function applyColorFilter(img, delta) {
    img.loadPixels();
    for (let i = 0; i < img.pixels.length; i += 4) {
      const alpha = img.pixels[i+3];
      if (alpha > 0) {
        let r = img.pixels[i];
        let g = img.pixels[i+1];
        let b = img.pixels[i+2];
        r = constrain(r + delta.r, 0, 255);
        g = constrain(g - delta.g, 0, 255);
        b = constrain(b - delta.b, 0, 255)
        img.pixels[i]   = r;
        img.pixels[i+1] = g;
        img.pixels[i+2] = b;
      }
    }
    img.updatePixels();
  }
  const bombWarn = bomb.get();
  applyColorFilter(bombWarn, {r: 150, g: 100, b:200} );

  itemimgs = {
    mush:[mush], poison:[poison], giant:[giant], bombadd:[bombadd], fire_enchant:[fireench],
    fire:[fire], bomb:[bomb], bigmissile:[bm], bomb_warning:[bombWarn], explosion:[beffect]
  };

  const tilesrc = spriteSheets.tileset;
  const bb = createImage(ow, oh); bb.copy(tilesrc, 18, 23, ow, oh, 0, 0, ow, oh);
  const qb = createImage(ow, oh); qb.copy(tilesrc, 35, 23, ow, oh, 0, 0, ow, oh);
  const gb = createImage(ow, oh); gb.copy(tilesrc, 154, 142, ow, oh, 0, 0, ow, oh);
  const gb1 = createImage(ow, oh); gb1.copy(tilesrc, 171, 74, ow, oh, 0, 0, ow, oh);
  [bb, qb, gb, gb1].forEach(img => applyChromaKey(img));
  tileimgs = {
    breakableblock:  [bb],
    questionblock:  [qb],
    groundblock:  [gb],
    groundblock1: [gb1]
  };
  const gb2 = createImage(ow, oh); gb2.copy(tilesrc, 171, 91, ow, oh, 0, 0, ow, oh);
  const breffect1 = createImage(2*ow, 2*oh); breffect1.copy(spsrc, 640, 1, 2*ow, 2*oh, 0, 0, 2*ow, 2*oh);
  const breffect2 = createImage(2*ow, 2*oh); breffect2.copy(spsrc, 673, 1, 2*ow, 2*oh, 0, 0, 2*ow, 2*oh);
  const breffect3 = createImage(2*ow, 2*oh); breffect3.copy(spsrc, 706, 1, 2*ow, 2*oh, 0, 0, 2*ow, 2*oh);
  [gb2, breffect1, breffect2, breffect3].forEach(img => applyChromaKey(img));
  decoimgs = {
    groundblock2: [gb2],
    breakeffect1: [breffect1],
    breakeffect2: [breffect2],
    breakeffect3: [breffect3]
  };




}