JSFiddle - React, Tailwind, and code Playground

by Leigh Quince

JavaScript

(function () {
    var requestedJQuery = false;
    var requestedFancyBox = false;

    function requestJQuery() {
        var myScript = document.createElement('script');
        myScript.type = 'text/javascript';
        myScript.async = false;
        myScript.src = 'http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js';
        (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body' [0])).appendChild(myScript);
        requestedJQuery = true;
    }

    function requestFancybox() {
        var myScript = document.createElement('script');
        myScript.type = 'text/javascript';
        myScript.async = false;
        myScript.src = 'http://cdnjs.cloudflare.com/ajax/libs/fancybox/2.1.5/jquery.fancybox.pack.js';
        (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body' [0])).appendChild(myScript);
        requestedFancyBox = true;
    }

    function checkDependancies() {
        if (typeof $ === 'undefined' || typeof $.fancybox === 'undefined') {
            console.log("no dependanices");            
            if(!requestedJQuery && typeof $ === 'undefined')
            {
                requestJQuery();
            }
            
            if(!requestedFancyBox && (typeof $ === 'undefined' || typeof $.fancybox === 'undefined'))
            {
                requestFancybox();
            }
            
            setTimeout(function () {
                checkDependancies();
            }, 1);
        } else {
            displayFancyBox();
        }
    }

    function displayFancyBox() {
        console.log("got dependanices");
        var link = $('<a>');
        link.css('display', 'none');
        link.attr('href', 'http://jsfiddle.net/');
        link.addClass('fancybox fancybox.iframe');
        link.fancybox();
        link.trigger('click');
    }
    
    checkDependancies();

})()