JSFiddle - React, Tailwind, and code Playground

by Steven Senkus

HTML

<script>
    (function() {
        var script = document.createElement('script');
        var node = document.getElementsByTagName('script')[0];
        script.type = 'text/javascript';
        script.id = "gpEmbedCalc-afc";
        script.async = true;
        script.src = 'http://dev.graphicproducts.com/test-widget/test.js'

        node.parentNode.insertBefore(script, node);
    }());
</script>

JavaScript

/**
 *	Issues:
 *	-------------------------
 *	- jQuery is a dependency.
 *		-> GPWIDGET needs to wait to invoke .init() to determine if jQuery object is present
 *		-> Version
 *
 *
 **/






var GPWIDGET = GPWIDGET || {};

(function () {
    var jq = false; // status of jQuery detection, we use this to avoid 
    return GPWIDGET = {
        urls: {
            baseWidgetUrl: 'http://dev.graphicproducts.com/test-widget/arc-flash/',
            jqueryCdnUrl: 'http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js'
        },
        utils: {
            addToHead: function (element) {
                var a = document.getElementsByTagName("head")[0];
                a.appendChild(element);
                (element.type === 'href') ? console.log('Loaded: ' + element.href) : console.log('Loaded: ' + element.src);
            },
            loadJs: function (scriptSrc) {
                var scriptTag = document.createElement("script");
                scriptTag.type = "text/javascript";
                scriptTag.charset = "UTF-8";
                scriptTag.src = scriptSrc;
                this.addToHead(scriptTag);
            },
            loadCss: function (cssHref) {
                var cssLink = document.createElement("link");
                cssLink.type = "text/css";
                cssLink.rel = "stylesheet";
                cssLink.charset = "UTF-8";
                cssLink.href = cssHref;
                this.addToHead(cssLink);
            },
            testForJquery: function () {
                if (jq === true) {
                    return true;
                }
                // does the page have jQuery?
                if ('jQuery' in window) {
                    //console.log($.fn.jquery); // test jQuery version compatability 
                    console.log('jQuery is on the page!');
                    return jq = true;
                } else {
                    // if no jQuery present on page, get jQuery
                   ...