scripts.js

const quoteContainer = document.getElementById('quote-container');
const quoteText = document.getElementById('quote'); 
const authorText = document.getElementById('author');
const twitterBtn = document.getElementById('twitter');
const newQuoteBtn = document.getElementById('new-quote');
const loader = document.getElementById('loader');

    function showLoadSpinner(){
        loader.hidden = false;
        quoteContainer.hidden = true;
    }

   function removeLoadSpinner(){
       if(!loader.hidden){
           quoteContainer.hidden = false;
           loader.hidden = true;
       } 
   }

async function getQuoteFromAPI() {

    showLoadSpinner();

    const proxyUrl = 'https://secret-ocean-38471.herokuapp.com/';
    const apiUrl = 'http://api.forismatic.com/api/1.0/?method=getQuote&lang=en&format=json';
    try{
        const response = await fetch(proxyUrl + apiUrl);
        const data = await response.json();
        // if author is blank, add unknown
        if(data.quoteAuthor === ''){
            authorText.innerText = "Unknown"
        } else {
            authorText.innerText = data.quoteAuthor;
        }
        
        // Reduce font size if the quote is long
        if(data.quoteText.length >120){
            quoteText.classList.add('long-quote')
        } else {
            quoteText.classList.remove('long-quote')
        }
        quoteText.innerText = data.quoteText;
 
    removeLoadSpinner();

    }catch(error) {
        getQuoteFromAPI();
        console.log("Whoops, no quote", error);
    }
}

function tweetQuote(){
    const quote = quoteText.innerText;
    const author = authorText.innerText;
    const twitterUrl = `https://twitter.com/intent/tweet?text=${quote} - ${author}`;
    window.open(twitterUrl, '_blank')
}                        
//Event Listeners
    newQuoteBtn.addEventListener('click', getQuoteFromAPI);
    twitterBtn.addEventListener('click', tweetQuote)

getQuoteFromAPI()