http://echtjez.de

main.js

function getGIF(tag, id) {
    document.title = tag.replace('yes', 'ja').replace('no', 'nein').toUpperCase(); // set doc title
    
    superagent // call giphy api
    .get('http://api.giphy.com/v1/gifs/random?api_key=dc6zaTOxFJmzC&tag=' + tag)
    .set('Accept', 'application/json')
    .end(function(err, res) {
        if (err || !res.ok) {
            console.error('API call failed.');
            console.log(err);
            getGIF(tag);
        } else {
            if (res.body.data.image_original_url) {

                window.location.hash = res.body.data.id + ':' + btoa(tag);  // append shareable hash string
                
                if (id === undefined || id === false) { // if custom id set - load given data
                    document.body.style.backgroundImage = 'url('+ res.body.data.image_original_url +')';
                } else {
                    document.body.style.backgroundImage = 'url(http://media0.giphy.com/media/'+ id +'/giphy.gif)';
                }

                overlay.innerHTML = tag.replace('yes', 'ja').replace('no', 'nein');
                window.fitText( overlay , 0.6 ); // init fittext for responsive

            } else {
                // no gif found
                swal("Oops...", "No gif found for this word!", "error");
            }
        }
    });
}

function shortcuts(e) {
    switch(e.keyCode) {        
        case 32:   // space
            getGIF(words[Math.floor(Math.random() * words.length)]);
            break;
        case 67: // C
            // make it editable!
            if (overlay.getAttribute('contenteditable') == 'false') {
                overlay.setAttribute('contenteditable', 'true');
                overlay.focus();
                document.execCommand('selectAll', false, null);
            }
            break;
        case 13: // ENTER/RETURN
            // checkout the written word
            if (overlay.getAttribute('contenteditable') == 'true') {
                raw_text = overlay.innerHTML.replace(/<\/?[^>]+(>|$)/g, "");
                overlay.innerHTML = raw_text;
                window.fitText( overlay , 0.6 );
                getGIF(raw_text);
                overlay.setAttribute('contenteditable', 'false');
            }
            break;
        case 72:
        case 191:
        case 219:
            if (overlay.getAttribute('contenteditable') == 'false') {
                swal({
                    title: 'Damn son! Du hast den Hilfe-Dialog gefunden',
                    text:
                    "Drück [SPACE] für ne neue Entscheidung\n\n" +
                    "Drück [C] für ein eigenes Wort - Tippe es ein!\n(Sende es mit [ENTER] ab)\n\n" +
                    "P.S: Den Link kannst du teilen",
                    confirmButtonText: 'Danke (für nichts)',
                });
            }
            break;
        default: console.log("DEBUG: key " + e.keyCode + " pressed"); break;
    }
}

// -----------------------------------------------------------------------------

words   = ['yes', 'no'];
init    = words[Math.floor(Math.random() * words.length)];
overlay = document.querySelector('.overlay');

if (location.hash === "" || location.hash === undefined) {
    getGIF(init);
} else {
    var data = location.hash.split('#')[1].split(':');
    getGIF(atob(data[1]), data[0]);
}



document.body.addEventListener("keyup", shortcuts, false);