JSFiddle - React, Tailwind, and code Playground

by roberkules

HTML

<script src="https://ajax.googleapis.com/ajax/libs/swfobject/2.2/swfobject.js"></script>
<textarea rows="4" cols="60" id="output"></textarea>
<div><img src="http://dl.dropbox.com/u/3413283/van-gogh.jpg" alt="van gogh" /></div>
<div id="flash1"></div>
<div id="flash2"></div>

CSS

textarea {
    width: 100%;
    height: 240px;
}

img {
    width: 100%;
}

div {
    float:left;
    width:120px;
    margin-right:20px;
}

JavaScript

var winLoaded = false,
    ajaxLoaded = true,
    ajaxCounter = 0,
    swfLoaded = true,
    swfCounter = 0;

// add window.load eventlistener
if (window.addEventListener) {
    window.addEventListener("load", myfunction, false);
} else {
    window.attachEvent("onload", myfunction);
}

function myfunction() {
    trace("window.load()");
    winLoaded = true;
    checkCompleteLoaded();
}

(function($) {
    // on dom ready:
    $(function(){
        // embed flash
        embedFlash("flash1", "http://dl.dropbox.com/u/3413283/van-gogh.swf");
        embedFlash("flash2", "http://dl.dropbox.com/u/3413283/van-gogh.swf");
        
        // make some ajaxRequests
        callAjax("test.html");
        callAjax("test2.html");
    });
})(jQuery);

function embedFlash(id, url) {
    trace("embedFlash(" + id + ", " + url + ")");
    swfLoaded = false;
    swfCounter++;
    swfobject.embedSWF(url, id, "100", "100", "7.0.0", null, {}, {}, {}, swfComplete);
}

function swfComplete(e) {
    trace("swfComplete(" + e.id + "), before " + swfCounter);
    swfCounter--;
    if (0 == swfCounter) {
        swfLoaded = true;
        checkCompleteLoaded();
    }
}

function callAjax(url) {
    trace("callAjax(" + url + ")");
    ajaxLoaded = false;
    ajaxCounter++;
    $.ajax(url, {complete: ajaxComplete});
}

function ajaxComplete(e) {
    trace("ajaxComplete(), before " + ajaxCounter);
    ajaxCounter--;
    if (0 == ajaxCounter) {
        ajaxLoaded = true;
        checkCompleteLoaded();
    }
}

// check if all components loaded
function checkCompleteLoaded() {
    trace("check if completely loaded. window=" + winLoaded + ", ajax=" + ajaxLoaded + ", swf=" + swfLoaded);
    if (winLoaded && ajaxLoaded && swfLoaded) {
        completelyLoaded();
    }
}

function completelyLoaded() {
    trace("COMPLETELY LOADED");
}

// debug output
function trace(txt) {
    $("#output").val(function(i, val){
        var d=new Date();
        return val + d.toLocaleTimeString() + "-" +...