let customWord = document.querySelector(".custom-word")
let generateLinkButton = document.querySelector(".generate-word-game-link")
let wordleGameLink = document.querySelector(".wordle-game-link")
let copy_btn = document.querySelector(".copy-btn")

let form = document.querySelector('#create-wordle-form')
let openPopup = document.querySelector(".open-popup")

const createWordle = (e) => {
    openPopup.click()
    e.preventDefault();
    copy_btn.innerHTML = "Copy"
    copy_btn.style.background = "#6aaa64"
    wordleGameLink.setAttribute("href", `/word-game-play?q=${btoa(customWord.value)}`)
    wordleGameLink.innerHTML = `${window.location.protocol + "//" + window.location.hostname}/word-game-play?q=${btoa(customWord.value)}`
}
form.addEventListener('submit', createWordle);


const copyToClipboard = (str) => {
    try {
        const el = document.createElement('textarea')
        el.value = str
        document.body.appendChild(el)
        el.select()
        document.execCommand('copy')
        document.body.removeChild(el)
        copy_btn.innerHTML = "Copied !"
        copy_btn.style.background = "#444"
        // copy_btn.setAttribute('data-tooltip', 'Copied !')
    } catch (error) {
        console.log(error)
    }
}
copy_btn.addEventListener('click', () => {
    copyToClipboard(wordleGameLink.innerHTML)
})