const stickerSpawners = document.querySelectorAll("[data-sticker]");
const container = document.getElementById("sticker-container");

var throttleSpawn = _.throttle(spawnSticker, 400);

Array.from(stickerSpawners).forEach((spawner) => {
	spawner.addEventListener("mousemove", (e) => throttleSpawn(e));
});

// spawnSticker(spawner, e);
function spawnSticker(e) {
	let position = { x: e.clientX, y: e.clientY };
	let content = e.target.dataset.sticker;
	createSticker(content, position);
}

function createSticker(content, position) {
	sticker = document.createElement("div");
	sticker.classList.add("sticker");
	sticker.innerHTML = content;
	sticker.style.left = position.x + "px";
	sticker.style.top = position.y + "px";

	sticker.style.transform = `
    translate(-50%, -50%)
    rotate(${Math.random() * 40 - 20}deg)
    `;

	container.appendChild(sticker);
}