import "./style.css";
import backwalkgeorge from "/backwalkgeorge.jpg";
import georgetoilet from "/georgetoilet.png";
import klinefloor from "/klinefloor.jpeg";
import klinemirror from "/klinemirror.jpg";
import klineoutside from "/klineoutside.jpeg";
import klinetrain from "/klinetrain.jpeg";
import sashaklineburrito from "/sashaklineburrito.jpeg";
import sashaklinecar from "/sashaklinecar.jpeg";
import sunsetkline from "/sunsetkline.png";

let app = document.getElementById("app")!;

let clearImages = () => {
  let images = document.getElementsByTagName("img");
  for (let image in images) {
    images[image].remove();
  }
};
let setImages = () => {
  let images = [
    backwalkgeorge,
    georgetoilet,
    klinefloor,
    klinemirror,
    klineoutside,
    klinetrain,
    sashaklineburrito,
    sashaklinecar,
    sunsetkline,
  ];
  for (let index in images) {
    let img = document.createElement("img");
    img.setAttribute("src", images[index]);
    img.style.setProperty(
      "left",
      (Math.random() * window.innerWidth).toString() + "px",
    );
    img.style.setProperty(
      "top",
      (Math.random() * window.innerHeight).toString() + "px",
    );
    app.append(img);
  }
};

window.addEventListener("resize", clearImages);
window.addEventListener("resize", setImages);

setImages();
