JSFiddle - React, Tailwind, and code Playground

by Michael Russell

HTML

<input type="button" id="button" value="send" />

JavaScript

$('#button').click(function() {
    var requestCallback = new MyRequestsCompleted({
        numRequest: 3,
        singleCallback: function(){
            alert( "I'm the callback");
        }
    });
    $.ajax({
        url: '/echo/html/',
        success: function(data) {
            requestCallback.requestComplete(true);
        }
    });
    $.ajax({
        url: '/echo/html/',
        success: function(data) {
            requestCallback.requestComplete(true);
        }
    });
    $.ajax({
        url: '/echo/html/',
        success: function(data) {
            requestCallback.requestComplete(true);
        }
    });
});

var MyRequestsCompleted = (function() {
    var numRequestToComplete, 
        requestsCompleted, 
        callBacks, 
        singleCallBack; 

    return function(options) {
        if (!options) options = {};

        numRequestToComplete = options.numRequest || 0;
        requestsCompleted = options.requestsCompleted || 0;
        callBacks = [];
        var fireCallbacks = function () {
            alert("we're all complete");
            for (var i = 0; i < callBacks.length; i++) callBacks[i]();
        };
        if (options.singleCallback) callBacks.push(options.singleCallback);

        

        this.addCallbackToQueue = function(isComplete, callback) {
            if (isComplete) requestsCompleted++;
            if (callback) callBacks.push(callback);
            if (requestsCompleted == numRequestToComplete) fireCallbacks();
        };
        this.requestComplete = function(isComplete) {
            if (isComplete) requestsCompleted++;
            if (requestsCompleted == numRequestToComplete) fireCallbacks();
        };
        this.setCallback = function(callback) {
            callBacks.push(callBack);
        };
    };
    })();