Как исправить ошибку в игре на JavaScript в canvas?

Question

[PumaStu9]

Прикол игры в том, что главный герой кот который находится в комнате с пылесосами. Пылесосам я задал как они будут двигаться. Игроком можно управлять на WSAD. Но когда я проверяю засосали ли кота, т.е. равен ли его x + width с x + width пылесоса и равен ли y + height с y + height пылесоса. Я написал так

if(Math.floor(pl.x) + pl.width === Math.floor(clean_1.x) + clean_1.width && Math.floor(pl.y) + pl.height === Math.floor(clean_1.y) + clean_1.height)

Вот код всей игры:

const cnvs = document.querySelector('#cns');
const ctx = cnvs.getContext("2d");
document.querySelector("#score").innerHTML = "Время игры: 00:00";
let time = 0;
let minets = 0;
let seconds = 0;
let char = "0"
let charMin = "0"

const back = new Image();
const player = new Image();
const cleaner_1 = new Image();
const cleaner_2 = new Image();
const cleaner_3 = new Image();
const dust = new Audio();

back.src       =  "./img/backround.jpg"
cleaner_1.src  =  "./img/dust_cleaner_1.png";
cleaner_2.src  =  "./img/dust_cleaner_2.png";
cleaner_3.src  =  "./img/dust_cleaner_3.png";
player.src     =  "./img/player.png";
dust.src = "./audio/music.mp3";

class GameObject {
    constructor(x,y,name, width, height) {
        this.x = x;
        this.y = y;
        this.name = name;
        this.width = width;
        this.height = height;
    }
}

let dir = "never";

let backround = new GameObject(0,0,"backround", cnvs.width, cnvs.height);
let pl = new GameObject(85,0,"danya",150,200);
let clean_1 = new GameObject(30,30,"cleaner_1", 20,20);

setInterval(()=>{
    seconds += 1;
    if(seconds == 60) {
        seconds = 0;
        minets += 1
    }
    if(seconds >= 10) {
        char = ""
    }
    if(minets >= 10) {
        charMin = ''
    }
    time = `Время игры: ${charMin}${minets}:${char}${seconds}`
},1000)

let game = setInterval(()=>{
    setTimeout(()=>{
        document.querySelector('#score').innerHTML = time;
    },1000)
   ctx.drawImage(back, backround.x,backround.y, backround.width, backround.height);
   ctx.drawImage(player, pl.x, pl.y, pl.width, pl.height);
   ctx.drawImage(cleaner_1, clean_1.x, clean_1.y, clean_1.width, clean_1.height);

   if(dir == "left") pl.x += 0.4;
   if(dir == "right") pl.x -= 0.4
   if(dir == "up") pl.y += 0.4;
   if(dir == "down") pl.y -= 0.4
},1)




const keys = (e)=> {
    setInterval(()=>{
        dust.play()
    },1000)
   
    if(e.keyCode == 68)
    dir = "left";
else if(e.keyCode == 83)
    dir = "up";
else if(e.keyCode == 65)
    dir = "right";
else if(e.keyCode == 87)
    dir = "down";
}

document.addEventListener('keydown',keys);
/*Первый пылесос*/
//Первое действие
let one = setInterval(()=>{
    clean_1.x += 0.1
  },10)
  setTimeout(()=>{
      clearInterval(one);
  
      //Второе действия
  
      let two = setInterval(()=>{
          clean_1.y += 0.1
  
      },10)
      setTimeout(()=>{
          clearInterval(two);
  
          //Третье действия
  
          let three = setInterval(()=>{
              clean_1.x +=0.1
  
          },10)
          setTimeout(()=>{
              clearInterval(three)
  
              //Четвёртое действие
            
              let four = setInterval(()=>{
                clean_1.y += 0.2
              },10)
              setTimeout(()=>{
                clearInterval(four)
              },1000)

              //Пятое действие

              let five = setInterval(()=>{
                clean_1.x += 0.4
                clean_1.y -= 0.2
              },10)
              setTimeout(()=>{
                clearInterval(five)

                let six = setInterval(() => {
                    clean_1.y += 0.4
                }, 10);
                setTimeout(()=>{
                    clearInterval(six)

                    let seven = setInterval(()=>{
                        clean_1.x -= 1
                    },10)
                    setTimeout(()=>{
                        clearInterval(seven);
                        clean_1.x = 30;
                        clean_1.y = 30
                    },2000)
                },2000)

              },3000)
          },3000)
      },2000)
  
  },2000)
    setInterval(()=>{
        let one = setInterval(()=>{
            clean_1.x += 0.1
          },10)
          setTimeout(()=>{
              clearInterval(one);
          
              //Второе действия
          
              let two = setInterval(()=>{
                  clean_1.y += 0.1
          
              },10)
              setTimeout(()=>{
                  clearInterval(two);
          
                  //Третье действия
          
                  let three = setInterval(()=>{
                      clean_1.x +=0.1
          
                  },10)
                  setTimeout(()=>{
                      clearInterval(three)
          
                      //Четвёртое действие
                    
                      let four = setInterval(()=>{
                        clean_1.y += 0.2
                      },10)
                      setTimeout(()=>{
                        clearInterval(four)
                      },1000)
    
                      //Пятое действие
    
                      let five = setInterval(()=>{
                        clean_1.x += 0.4
                        clean_1.y -= 0.2
                      },10)
                      setTimeout(()=>{
                        clearInterval(five)
    
                        let six = setInterval(() => {
                            clean_1.y += 0.4
                        }, 10);
                        setTimeout(()=>{
                            clearInterval(six)
    
                            let seven = setInterval(()=>{
                                clean_1.x -= 1
                            },10)
                            setTimeout(()=>{
                                clearInterval(seven);
                                clean_1.x = 30;
                                clean_1.y = 30
                            },2000)
                        },2000)
    
                      },3000)
                  },3000)
              },2000)
          
          },2000)
    },12000)





  let findDead = setInterval(()=>{
    //Тут то самое условие в браузере ошибки не выдаёт
    },0.1)

Comments

[Dmitriy Grape]

Почитате про callback hell

[Сергей Соколов]

Даня, вопрос лучше задавать так, чтобы было понятно человеку, который впервые видит вас и вашу проблему.
Например, забыли упомянуть, что за ошибка.
Весь длинный код лучше выложить в работающей песочнице типа JSFiddle или CodePen, чтобы там и картинки были и можно было попробовать.