Как найти потерянную скобку?

Делаю проэкт галерею на javascript, потерял скобку.

Ошибка расположена в функции arrows. Пишет, Uncaught SyntaxError: Illegal return statement.

function showImage(event){
    //ПРОВЕРКА И УДАЛЕНИЕ
    //##############
    if (document.querySelector(".canDelete")){
        document.querySelector(".canDelete").classList.remove("canDelete")
    }
    if (document.querySelector(".OtherMiniMain")){
        document.querySelector(".OtherMiniMain").classList.remove(".OtherMiniMain");}
    let pictures=document.querySelector(".pictures");
    if (document.querySelector(".selected")){
        document.querySelector(".selected").classList.remove("selected");
    }
    if (document.querySelector(".open")){
        document.querySelector(".open").remove()
    }
    let OtherMains=document.querySelectorAll(".otherMain");
    for (item of OtherMains){
        item.remove()
    }
    let eventImage;
    if (document.querySelector(".miniUpdate")){
        eventImage=document.querySelector(".miniUpdate");
    }
    else {
        eventImage=event.target;
    }
    //ИНИЦИАЛИЗАЦИЯ
    //#############
    let heart=document.querySelector(".heart");
    if (!eventImage.classList.contains("chosenImg")){
        heart.classList.remove("beforeChose")
    }
    else{
        heart.classList.add("beforeChose")
    }
    let main=document.querySelector("main");
    let block=document.querySelector(".show");
    let imageDiv=document.querySelector(".ImgAndArrow");
    eventImage.classList.add("selected")
    block.hidden=false;
    let other=document.querySelector(".other")
    document.body.style.overflow="hidden";
    let image=document.createElement("img");
    image.src=eventImage.src;
    image.classList.add("open");
    imageDiv.append(image);
    let OtherMainImage=image.cloneNode();
    OtherMainImage.classList.add("otherMain");
    OtherMainImage.classList.remove("open");
    OtherMainImage.classList.add("OtherMiniMain")
    createSublings()
    function createSublings(){
        createMini(2,"-");
        createMini(1,"-");
        pictures.append(OtherMainImage)
        if (document.querySelector(".chosen").textContent=="Home"){
            let items=document.querySelectorAll(".chosenImg");
            if (getChosenIndex()==items.length-2){
                createMini(1,"+")
            }
            if (getChosenIndex()<item.length-2){
                createMini(1,"+");
               createMini(2,"+");
            }
            function getChosenIndex(){
                let col=0;
                for (item of items){
                    if (item.classList.contains("selected")){
                        return col
                    }
                    col++
                }

            }}
        else{
            if (getIndex()==main.children.length-2){
            createMini(1,"+");
        }
          if (getIndex()<main.children.length-2){
            createMini(1,"+");
            createMini(2,"+");
        }
        }
        function checkNoneDiv(){
            let col=0;
            for (item of document.querySelectorAll(".noneImageDiv")){
                col++
            }
            return col
        }
        // alert(checkNoneDiv())
        function createMini(num,znak){
            let coords=OtherMainImage.getBoundingClientRect();
            let image=OtherMainImage.cloneNode();
            let Children;
            if (document.querySelector(".chosen").textContent=="Home"){
                // alert("sdf")
                Children=main.querySelectorAll(".chosenImg")
            }
            else{
                Children=main.children
            }
            image.classList.remove("OtherMiniMain");
            if (znak=="-"){
                if (!Children[getIndex()-num]){
                    if (checkNoneDiv()>=2){
                        return
                    }
                    appendNoneDiv()
                    return
                }
                image.src=Children[getIndex()-num].src;
                image.dataset.number=`r${getIndex()-num}`;
                OtherMainImage.dataset.number=`r${Number(image.getAttribute("data-number").split("").slice(1).join(""))+num}`
              pictures.append(image);
            }
            if (znak=="+"){
                if (!Children[getIndex()+num]){
                    if (checkNoneDiv()>=2){
                        return
                    }
                    appendNoneDiv()
                    return
                }
                image.src=Children[getIndex()+num].src;
                image.dataset.number=`r${getIndex()+num}`;
                OtherMainImage.dataset.number=`r${Number(image.getAttribute("data-number").split("").slice(1).join(""))-num}`
                pictures.append(image);
            }
            function appendNoneDiv(){
                let noneDiv=document.createElement("div");
                noneDiv.classList.add("noneImageDiv")
                pictures.append(noneDiv)
            }
        }
        // alert(document.querySelector("main").children[0].src);
        // image.src=main.children[getIndex()-1].src
        // other.append(image);
        // let predImage=OtherMainImage.cloneNode();
        // predImage.style.left=`${coords.left-coords.width*2-45}px`
    }
    function getIndex(){
        let col=0;
        for (item of main.children){
            if (item.classList.contains("selected")){
                return col;
            }
            col++
        }

    }
    let miniClicks=document.querySelectorAll(".otherMain");
   for (item of miniClicks){
    item.addEventListener("click",miniClick)
   }
}
function hideShow(event){
    document.querySelector(".deleteWindow").hidden=true;
    for (item of document.querySelectorAll(".noneImageDiv")){
        item.remove()
    }
    let block=document.querySelector(".show");
    block.hidden=true;
    document.body.style.overflow="auto";
    if (document.querySelector(".miniUpdate")){
        document.querySelector(".miniUpdate").classList.remove("miniUpdate")
}
}   
function miniClick(event){
    document.querySelector(".deleteWindow").hidden=true;
    if (document.querySelector(".noneImageDiv")){
        for (item of document.querySelectorAll(".noneImageDiv")){
            item.remove()
        }
    }
    if (document.querySelector(".miniUpdate")){
        document.querySelector(".miniUpdate").classList.remove("miniUpdate")
    }
    let main=document.querySelector("main");
    if (event.target.getAttribute("data-number")==null){
        return
    }
    let classIndex=Number(event.target.getAttribute("data-number").split("").slice(1).join(""));
    main.children[classIndex].classList.add("miniUpdate");
    showImage()

}
function arrows(event){
    let canDelete;
    let num=1;
    let MainMini=document.querySelector(".OtherMiniMain");
    if (!MainMini){
        return
    }
    if (!MainMini.getAttribute("data-number")){
        hideShow()
        return
    }
    let classIndex=Number(MainMini.getAttribute("data-number").split("").slice(1).join(""));
    if (document.querySelector(".canDelete")){
        if (classIndex<=0){
            document.querySelector(".canDelete").classList.remove("canDelete")
            canDelete=document.querySelector(".arrowRight");
            num=0
        }
        else{
            canDelete=document.querySelector(".arrowLeft");
        }
    }
    else{
        if (document.querySelector(".canDelete")){
        document.querySelector(".canDelete").classList.remove("canDelete")
       }
        canDelete=event.target;
    }
    
    if (document.querySelector(".miniUpdate")){
        document.querySelector(".miniUpdate").classList.remove("miniUpdate")
    }
    if (event){
        if (event.key=="ArrowRight"){
            document.querySelector(".deleteWindow").hidden=true;
            let newIndex=classIndex+1;
        if (newIndex>=main.children.length){
            return
        }
        if (document.querySelector(".chosen").textContent=="Home"){
            if (!main.children[newIndex].classList.contains("chosenImg")){
            return
        }}
        if (newIndex==1){
            document.querySelector(".noneImageDiv").remove();
            document.querySelector(".noneImageDiv").remove()
        }
        if (newIndex==2){
            document.querySelector(".noneImageDiv").remove()

        }
        // if (main.children[newIndex])
       main.children[newIndex].classList.add("miniUpdate");
       // if (main.children[newIndex].classList.contains(""))
       showImage()}
       if (event.key=="ArrowLeft"){
        document.querySelector(".deleteWindow").hidden=true;
       let newIndex=classIndex-1;
        if (newIndex<=-1){
            return
        }
        if (document.querySelector(".chosen").textContent=="Home"){
            if (!main.children[newIndex].classList.contains("chosenImg")){
            return
        }}
       main.children[newIndex].classList.add("miniUpdate");
       showImage()
       }
    }

    if (canDelete.className=="arrowRight"){
        let newIndex=classIndex+num;
        if (newIndex>=main.children.length){
            return
        }
            if (!main.children[newIndex].classList.contains("chosenImg")){
            return
        }
        if (newIndex==1){
            document.querySelector(".noneImageDiv").remove();
            document.querySelector(".noneImageDiv").remove()
        }
        if (newIndex==2){
            document.querySelector(".noneImageDiv").remove()

        }
    }
       main.children[newIndex].classList.add("miniUpdate");
       showImage()}
    //LEFT
    if (canDelete.className=="arrowLeft"){
        let newIndex=classIndex-1;
        // if (newIndex<=-1){
        //  return
        // }
        if (document.querySelector(".chosen").textContent=="Home"){
            if (!main.children[newIndex].classList.contains("chosenImg")){
            return
        }}
       main.children[newIndex].classList.add("miniUpdate");
       showImage()
    }
    if (document.querySelector(".canDelete")){
        document.querySelector(".canDelete").classList.remove("canDelete")
    }
function deleteImage(event){
    if (!document.querySelector(".selected")){
        return
    }
    if (document.querySelector(".selected").classList.contains("chosenImg")){
        document.querySelector(".heart").classList.remove("beforeChose");
    }
    if (document.querySelector(".canDelete")){
        document.querySelector(".canDelete").classList.remove("canDelete")
    }
    let pictures=document.querySelector(".pictures");
    let selected=document.querySelector(".selected");
    let deleteWindow=document.querySelector(".deleteWindow");
    if (!selected){
        hideShow()
        return
    }
    ok=document.querySelector(".deleteOk");
    cancel=document.querySelector(".deleteCancel");
    if (event.key=="Delete"|| event.target.classList.contains("trash")){
        deleteWindow.hidden=false;
        ok.addEventListener("click",deleteWindowButttons);
        cancel.addEventListener("click",deleteWindowButttons);
        document.addEventListener("keydown",deleteWindowButttons)
    }
}
function deleteWindowButttons(event){
    let pictures=document.querySelector(".pictures");
    let selected=document.querySelector(".selected");
    let deleteWindow=document.querySelector(".deleteWindow");
    if (event.target.classList.contains("deleteOk") || event.key=="Enter"){
        selected.remove();
        deleteWindow.hidden=true;
       pictures.classList.add("canDelete");
       arrows()
    }
    if (event.target.classList.contains("deleteCancel") || event.key=="Escape"){
        deleteWindow.hidden=true;
    }
    
}
function showWindowfromImage(event){
    if (document.querySelector(".selectedForRight")){
        document.querySelector(".selectedForRight").classList.remove("selectedForRight")
    }
    event.target.classList.add("selectedForRight")
    let whiteWindow=document.querySelector(".window");
    let deleteW=document.querySelector(".windowDeleteImg");
    if (!event.target.parentNode.tagName){
        return
    }
    if (event.target.parentNode.tagName!="MAIN" || event.target.tagName!="IMG"){
        whiteWindow.hidden=true;
        return
    }
    // alert(event.target.parentNode.tagName)
    whiteWindow.hidden=false;
    whiteWindow.style.left=event.pageX+"px";
    whiteWindow.style.top=event.pageY+"px";
    deleteW.addEventListener("click",deleteOrChosen)
    event.preventDefault();
}
function deleteOrChosen(event){
    document.querySelector(".selectedForRight").remove()
}
function ShowChosenBlock(event){
    let show=document.querySelector(".show")
    let main=document.querySelector("main");
    let images=main.querySelectorAll("img");
    document.querySelector(".deleteWindow").hidden=true;
    show.hidden=true;
    if (event.target.textContent=="Chosen"){
        for (item of images){
            if (!item.classList.contains("chosenImg")){
                item.hidden=true;
        }
    }
        document.body.style.background="rgba(255, 197, 249, 1)";
        event.target.textContent="Home";
        return  
    }
    if (event.target.textContent=="Home"){
        for (item of images){
            item.hidden=false;
        }
        document.body.style.background="rgba(136, 134, 134, 1)";
        event.target.textContent="Chosen";
        return  
    }}
function addToChosen(event){
    let selected=document.querySelector(".selected");
    if (selected.classList.contains("chosenImg")){
        selected.classList.remove("chosenImg")
        document.querySelector(".heart").classList.remove("beforeChose");
        return
    }
    selected.classList.add("chosenImg");
    document.querySelector(".heart").classList.add("beforeChose");

}



//РАБОТА ПРОГРАММЫ
let heart=document.querySelector(".heart");
heart.addEventListener("click", addToChosen)
let chosen=document.querySelector(".chosen");
chosen.addEventListener("click",ShowChosenBlock);
let bin=document.querySelector(".trash");
bin.addEventListener("click",deleteImage);
document.addEventListener("keydown",deleteImage);
let arrowLeft=document.querySelector(".arrowLeft");
let arrowRight=document.querySelector(".arrowRight");
arrowLeft.addEventListener("click",arrows);
arrowRight.addEventListener("click",arrows);
document.addEventListener("keydown",arrows)
let left=document.querySelector(".left");
left.addEventListener("click",hideShow)
let main=document.querySelector("main");
let images=main.querySelectorAll("img");
document.addEventListener("contextmenu",event=>event.preventDefault())
for (item of images){
    item.addEventListener("click",showImage);
    // item.addEventListener("contextmenu",showWindowfromImage);
}
let whiteWindow=document.querySelector(".window");
document.addEventListener("contextmenu",showWindowfromImage);
document.addEventListener("click",event=>whiteWindow.hidden=true);
document.addEventListener("scroll",event=>whiteWindow.hidden=true);
window.addEventListener("resize",event=>whiteWindow.hidden=true);

Ответы (2 шт):

Автор решения: UModeL

Похоже, что я был прав в комментарии к вопросу - загвоздка в том, что блок условия, который находится непосредственно под //LEFT, должен быть внутри функции arrows(). Именно об этом говорит ошибка Uncaught SyntaxError: Illegal return statement - "недопустимый оператор возврата" - потому, что возвращать что-то через return может только function, но не if, как в данном случае.

Если закомментировать return, на который ругается парсер:

    //LEFT
    if (canDelete.className=="arrowLeft"){
        let newIndex=classIndex-1;
        // if (newIndex<=-1){
        //  return
        // }
        if (document.querySelector(".chosen").textContent=="Home"){
            if (!main.children[newIndex].classList.contains("chosenImg")){
// ------>  // return
        }}
       main.children[newIndex].classList.add("miniUpdate");
       showImage()
    }

то появится ошибка Uncaught ReferenceError: canDelete is not defined, выше, но в том же блоке условия:

    //LEFT
    if (canDelete.className=="arrowLeft"){ // <----------- Ошибка!
        let newIndex=classIndex-1;
        // if (newIndex<=-1){
        //  return
        // }
        if (document.querySelector(".chosen").textContent=="Home"){
            if (!main.children[newIndex].classList.contains("chosenImg")){
// ------>  // return
        }}
       main.children[newIndex].classList.add("miniUpdate");
       showImage()
    }

Допускаю, что Вы экспериментировали с кодом и вынесли блок условия //LEFT за пределы функции, а после не нашли откуда.

Скопируйте и проверьте код ниже, ибо у меня он не запускается без разметки.

function showImage(event) {
  //ПРОВЕРКА И УДАЛЕНИЕ
  //##############
  if (document.querySelector(".canDelete")) {
    document.querySelector(".canDelete").classList.remove("canDelete");
  }
  if (document.querySelector(".OtherMiniMain")) {
    document.querySelector(".OtherMiniMain").classList.remove(".OtherMiniMain");
  }
  let pictures = document.querySelector(".pictures");
  if (document.querySelector(".selected")) {
    document.querySelector(".selected").classList.remove("selected");
  }
  if (document.querySelector(".open")) {
    document.querySelector(".open").remove();
  }
  let OtherMains = document.querySelectorAll(".otherMain");
  for (item of OtherMains) {
    item.remove();
  }
  let eventImage;
  if (document.querySelector(".miniUpdate")) {
    eventImage = document.querySelector(".miniUpdate");
  } else {
    eventImage = event.target;
  }
  //ИНИЦИАЛИЗАЦИЯ
  //#############
  let heart = document.querySelector(".heart");
  if (!eventImage.classList.contains("chosenImg")) {
    heart.classList.remove("beforeChose");
  } else {
    heart.classList.add("beforeChose");
  }
  let main = document.querySelector("main");
  let block = document.querySelector(".show");
  let imageDiv = document.querySelector(".ImgAndArrow");
  eventImage.classList.add("selected");
  block.hidden = false;
  let other = document.querySelector(".other");
  document.body.style.overflow = "hidden";
  let image = document.createElement("img");
  image.src = eventImage.src;
  image.classList.add("open");
  imageDiv.append(image);
  let OtherMainImage = image.cloneNode();
  OtherMainImage.classList.add("otherMain");
  OtherMainImage.classList.remove("open");
  OtherMainImage.classList.add("OtherMiniMain");
  createSublings();

  function createSublings() {
    createMini(2, "-");
    createMini(1, "-");
    pictures.append(OtherMainImage);
    if (document.querySelector(".chosen").textContent == "Home") {
      let items = document.querySelectorAll(".chosenImg");
      if (getChosenIndex() == items.length - 2) {
        createMini(1, "+");
      }
      if (getChosenIndex() < item.length - 2) {
        createMini(1, "+");
        createMini(2, "+");
      }

      function getChosenIndex() {
        let col = 0;
        for (item of items) {
          if (item.classList.contains("selected")) {
            return col;
          }
          col++;
        }
      }
    } else {
      if (getIndex() == main.children.length - 2) {
        createMini(1, "+");
      }
      if (getIndex() < main.children.length - 2) {
        createMini(1, "+");
        createMini(2, "+");
      }
    }

    function checkNoneDiv() {
      let col = 0;
      for (item of document.querySelectorAll(".noneImageDiv")) {
        col++;
      }
      return col;
    }
    // alert(checkNoneDiv())
    function createMini(num, znak) {
      let coords = OtherMainImage.getBoundingClientRect();
      let image = OtherMainImage.cloneNode();
      let Children;
      if (document.querySelector(".chosen").textContent == "Home") {
        // alert("sdf")
        Children = main.querySelectorAll(".chosenImg");
      } else {
        Children = main.children;
      }
      image.classList.remove("OtherMiniMain");
      if (znak == "-") {
        if (!Children[getIndex() - num]) {
          if (checkNoneDiv() >= 2) {
            return;
          }
          appendNoneDiv();
          return;
        }
        image.src = Children[getIndex() - num].src;
        image.dataset.number = `r${getIndex() - num}`;
        OtherMainImage.dataset.number = `r${
          Number(
            image.getAttribute("data-number").split("").slice(1).join("")
          ) + num
        }`;
        pictures.append(image);
      }
      if (znak == "+") {
        if (!Children[getIndex() + num]) {
          if (checkNoneDiv() >= 2) {
            return;
          }
          appendNoneDiv();
          return;
        }
        image.src = Children[getIndex() + num].src;
        image.dataset.number = `r${getIndex() + num}`;
        OtherMainImage.dataset.number = `r${
          Number(
            image.getAttribute("data-number").split("").slice(1).join("")
          ) - num
        }`;
        pictures.append(image);
      }

      function appendNoneDiv() {
        let noneDiv = document.createElement("div");
        noneDiv.classList.add("noneImageDiv");
        pictures.append(noneDiv);
      }
    }
    // alert(document.querySelector("main").children[0].src);
    // image.src=main.children[getIndex()-1].src
    // other.append(image);
    // let predImage=OtherMainImage.cloneNode();
    // predImage.style.left=`${coords.left-coords.width*2-45}px`
  }

  function getIndex() {
    let col = 0;
    for (item of main.children) {
      if (item.classList.contains("selected")) {
        return col;
      }
      col++;
    }
  }
  let miniClicks = document.querySelectorAll(".otherMain");
  for (item of miniClicks) {
    item.addEventListener("click", miniClick);
  }
}

function hideShow(event) {
  document.querySelector(".deleteWindow").hidden = true;
  for (item of document.querySelectorAll(".noneImageDiv")) {
    item.remove();
  }
  let block = document.querySelector(".show");
  block.hidden = true;
  document.body.style.overflow = "auto";
  if (document.querySelector(".miniUpdate")) {
    document.querySelector(".miniUpdate").classList.remove("miniUpdate");
  }
}

function miniClick(event) {
  document.querySelector(".deleteWindow").hidden = true;
  if (document.querySelector(".noneImageDiv")) {
    for (item of document.querySelectorAll(".noneImageDiv")) {
      item.remove();
    }
  }
  if (document.querySelector(".miniUpdate")) {
    document.querySelector(".miniUpdate").classList.remove("miniUpdate");
  }
  let main = document.querySelector("main");
  if (event.target.getAttribute("data-number") == null) {
    return;
  }
  let classIndex = Number(
    event.target.getAttribute("data-number").split("").slice(1).join("")
  );
  main.children[classIndex].classList.add("miniUpdate");
  showImage();
}

function arrows(event) {
  let canDelete;
  let num = 1;
  let MainMini = document.querySelector(".OtherMiniMain");
  if (!MainMini) {
    return;
  }
  if (!MainMini.getAttribute("data-number")) {
    hideShow();
    return;
  }
  let classIndex = Number(
    MainMini.getAttribute("data-number").split("").slice(1).join("")
  );
  if (document.querySelector(".canDelete")) {
    if (classIndex <= 0) {
      document.querySelector(".canDelete").classList.remove("canDelete");
      canDelete = document.querySelector(".arrowRight");
      num = 0;
    } else {
      canDelete = document.querySelector(".arrowLeft");
    }
  } else {
    if (document.querySelector(".canDelete")) {
      document.querySelector(".canDelete").classList.remove("canDelete");
    }
    canDelete = event.target;
  }

  if (document.querySelector(".miniUpdate")) {
    document.querySelector(".miniUpdate").classList.remove("miniUpdate");
  }
  if (event) {
    if (event.key == "ArrowRight") {
      document.querySelector(".deleteWindow").hidden = true;
      let newIndex = classIndex + 1;
      if (newIndex >= main.children.length) {
        return;
      }
      if (document.querySelector(".chosen").textContent == "Home") {
        if (!main.children[newIndex].classList.contains("chosenImg")) {
          return;
        }
      }
      if (newIndex == 1) {
        document.querySelector(".noneImageDiv").remove();
        document.querySelector(".noneImageDiv").remove();
      }
      if (newIndex == 2) {
        document.querySelector(".noneImageDiv").remove();
      }
      // if (main.children[newIndex])
      main.children[newIndex].classList.add("miniUpdate");
      // if (main.children[newIndex].classList.contains(""))
      showImage();
    }
    if (event.key == "ArrowLeft") {
      document.querySelector(".deleteWindow").hidden = true;
      let newIndex = classIndex - 1;
      if (newIndex <= -1) {
        return;
      }
      if (document.querySelector(".chosen").textContent == "Home") {
        if (!main.children[newIndex].classList.contains("chosenImg")) {
          return;
        }
      }
      main.children[newIndex].classList.add("miniUpdate");
      showImage();
    }
  }

  if (canDelete.className == "arrowRight") {
    let newIndex = classIndex + num;
    if (newIndex >= main.children.length) {
      return;
    }
    if (!main.children[newIndex].classList.contains("chosenImg")) {
      return;
    }
    if (newIndex == 1) {
      document.querySelector(".noneImageDiv").remove();
      document.querySelector(".noneImageDiv").remove();
    }
    if (newIndex == 2) {
      document.querySelector(".noneImageDiv").remove();
    }
  }
  //LEFT
  if (canDelete.className == "arrowLeft") {
    let newIndex = classIndex - 1;
    // if (newIndex<=-1){
    //  return
    // }
    if (document.querySelector(".chosen").textContent == "Home") {
      if (!main.children[newIndex].classList.contains("chosenImg")) {
        return;
      }
    }
  }
  main.children[newIndex].classList.add("miniUpdate");
  showImage();
}
if (document.querySelector(".canDelete")) {
  document.querySelector(".canDelete").classList.remove("canDelete");
}

function deleteImage(event) {
  if (!document.querySelector(".selected")) {
    return;
  }
  if (document.querySelector(".selected").classList.contains("chosenImg")) {
    document.querySelector(".heart").classList.remove("beforeChose");
  }
  if (document.querySelector(".canDelete")) {
    document.querySelector(".canDelete").classList.remove("canDelete");
  }
  let pictures = document.querySelector(".pictures");
  let selected = document.querySelector(".selected");
  let deleteWindow = document.querySelector(".deleteWindow");
  if (!selected) {
    hideShow();
    return;
  }
  ok = document.querySelector(".deleteOk");
  cancel = document.querySelector(".deleteCancel");
  if (event.key == "Delete" || event.target.classList.contains("trash")) {
    deleteWindow.hidden = false;
    ok.addEventListener("click", deleteWindowButttons);
    cancel.addEventListener("click", deleteWindowButttons);
    document.addEventListener("keydown", deleteWindowButttons);
  }
}

function deleteWindowButttons(event) {
  let pictures = document.querySelector(".pictures");
  let selected = document.querySelector(".selected");
  let deleteWindow = document.querySelector(".deleteWindow");
  if (event.target.classList.contains("deleteOk") || event.key == "Enter") {
    selected.remove();
    deleteWindow.hidden = true;
    pictures.classList.add("canDelete");
    arrows();
  }
  if (
    event.target.classList.contains("deleteCancel") ||
    event.key == "Escape"
  ) {
    deleteWindow.hidden = true;
  }
}

function showWindowfromImage(event) {
  if (document.querySelector(".selectedForRight")) {
    document
      .querySelector(".selectedForRight")
      .classList.remove("selectedForRight");
  }
  event.target.classList.add("selectedForRight");
  let whiteWindow = document.querySelector(".window");
  let deleteW = document.querySelector(".windowDeleteImg");
  if (!event.target.parentNode.tagName) {
    return;
  }
  if (
    event.target.parentNode.tagName != "MAIN" ||
    event.target.tagName != "IMG"
  ) {
    whiteWindow.hidden = true;
    return;
  }
  // alert(event.target.parentNode.tagName)
  whiteWindow.hidden = false;
  whiteWindow.style.left = event.pageX + "px";
  whiteWindow.style.top = event.pageY + "px";
  deleteW.addEventListener("click", deleteOrChosen);
  event.preventDefault();
}

function deleteOrChosen(event) {
  document.querySelector(".selectedForRight").remove();
}

function ShowChosenBlock(event) {
  let show = document.querySelector(".show");
  let main = document.querySelector("main");
  let images = main.querySelectorAll("img");
  document.querySelector(".deleteWindow").hidden = true;
  show.hidden = true;
  if (event.target.textContent == "Chosen") {
    for (item of images) {
      if (!item.classList.contains("chosenImg")) {
        item.hidden = true;
      }
    }
    document.body.style.background = "rgba(255, 197, 249, 1)";
    event.target.textContent = "Home";
    return;
  }
  if (event.target.textContent == "Home") {
    for (item of images) {
      item.hidden = false;
    }
    document.body.style.background = "rgba(136, 134, 134, 1)";
    event.target.textContent = "Chosen";
    return;
  }
}

function addToChosen(event) {
  let selected = document.querySelector(".selected");
  if (selected.classList.contains("chosenImg")) {
    selected.classList.remove("chosenImg");
    document.querySelector(".heart").classList.remove("beforeChose");
    return;
  }
  selected.classList.add("chosenImg");
  document.querySelector(".heart").classList.add("beforeChose");
}

//РАБОТА ПРОГРАММЫ
let heart = document.querySelector(".heart");
heart.addEventListener("click", addToChosen);
let chosen = document.querySelector(".chosen");
chosen.addEventListener("click", ShowChosenBlock);
let bin = document.querySelector(".trash");
bin.addEventListener("click", deleteImage);
document.addEventListener("keydown", deleteImage);
let arrowLeft = document.querySelector(".arrowLeft");
let arrowRight = document.querySelector(".arrowRight");
arrowLeft.addEventListener("click", arrows);
arrowRight.addEventListener("click", arrows);
document.addEventListener("keydown", arrows);
let left = document.querySelector(".left");
left.addEventListener("click", hideShow);
let main = document.querySelector("main");
let images = main.querySelectorAll("img");
document.addEventListener("contextmenu", (event) => event.preventDefault());
for (item of images) {
  item.addEventListener("click", showImage);
  // item.addEventListener("contextmenu",showWindowfromImage);
}
let whiteWindow = document.querySelector(".window");
document.addEventListener("contextmenu", showWindowfromImage);
document.addEventListener("click", (event) => (whiteWindow.hidden = true));
document.addEventListener("scroll", (event) => (whiteWindow.hidden = true));
window.addEventListener("resize", (event) => (whiteWindow.hidden = true));

→ Ссылка
Автор решения: Qwertiy
  1. Вставить код в Хром
  2. Попытаться выполнить
  3. Ткнуть мышью на строку с ошибкой
  4. Чуть посмотреть окружающий код

скриншот

→ Ссылка