Олег Колесников

function addCard(titleValue, linkValue) {
    if(titleValue && linkValue) {
          const inpTemplate = document.querySelector("#element").content;
          const inpElement = inpTemplate.querySelector(".element").cloneNode(true);
          Container.prepend(inpElement);
          inpElement.querySelector(".element__title").textContent = titleValue;
          inpElement.querySelector(".element__image").src = linkValue;
    }
}

И при нажатии на element__image изображение и текст element передавались в #popup_photo

const popImg= document.querySelector("#popup_image"); 
const Img= document.querySelector(".popup__image"); 
const Disc = document.querySelector(".popup__discription");

function openPopupImage(e) {
  Img.src = e.target.src;
  // для простоты примера, берем данные из атрибута alt, предполагается что он заполнен
  Img.alt = e.target.alt: 
  Disc .textContent = e.target.alt;
  openPopup(popImg); // передаём весь попап, для смены класса в будущем
};

function openPopup(popup) {
  popup.classList.add("popup_opened");
}

// get data
async function getData() {
  let result = await fetch("https://jsonplaceholder.typicode.com/posts")
    .then((response) => response.json());
// .then(json => console.log(json)) - эту строчку убираем, она приводила к тому, что fetch  не возвращал результат
  return result;
}

// show data
getData().then((result) => showData(result));
function showData(allGoods) {
  let outGoods = "";
  for (let key in allGoods) {
    outGoods += `
        <div class="goods__item">
            <a><img src="${allGoods[key].image}"/></a>
            <div class="goods__tx">
                <h2>${allGoods[key].name}</h2>
                <p>${allGoods[key].desc}</p>
                <span>${allGoods[key].availability}</span>
                <div class="goods__bottom">
                    <b>${allGoods[key].price} $</b>
                    <div class="goods__btn">
                        <button class="goods__minus" data-id="${key}">-</button>
                        <button class="goods__plus" data-id="${key}">+</button>
                    </div>
                </div>
            </div>
        </div>`;
  }
  let goodsContent = document.querySelector(".goods .container");
  goodsContent.innerHTML = outGoods;
}

if (currentCars.length > 0) {
  for (let car of currentCars) {
    renderFormCar(car);
  }
}

function renderFormCar (currentCar) {
  let type = currentCar?.CarType || "";
  let model = currentCar?.Model || "";
  let passCarClone = document.createElement("div");
  passCarClone.classList.add("car-item");
  passCarClone.innerHTML = `
       <span class="remove">X<span>
       <input type="text" class="form__car-type" placeholder="Введите тип" value="${type}">
       <input type="text" class="form__car-model" placeholder="Введите Марка и Модель тр. ср-ва" value="${model}">
       <div></div>
        <button class="primary-btn" type="submit">Применить</button>`;
  passCar.append(passCarClone);
};

addCar.addEventListener("click", function () {
  renderFormCar();
  passCar.addEventListener("click", function (e) {
    if (e.target.classList.contains("remove")) {
      e.target.parentNode.remove();
    }
  });
});

if (localStorage.getItem('filtervis') == "true") {
  document.getElementById("filtervis").setAttribute('checked','checked');
}

document.addEventListener("DOMContentLoaded", checkChecked);
function checkChecked() {
  if (localStorage.getItem("filtervis") == "true") {
    document.getElementById("filtervis").setAttribute("checked", "checked");
   document.getElementById("article-id").setAttribute("style", "display"); // убираем display: none
  }
}

let Func = require("./functions.js");
let func_create = new Func();
console.log(func_create.time());