JSFiddle - React, Tailwind, and code Playground

by Castrolol

HTML

<canvas id="canvas" width=550 height=500></canvas>

JavaScript

(function (ns) {

    Array.prototype.forAll = function (action) {
        if (typeof action !== "function") {
            return;
        }
        for (var i = 0; i < this.length; i++) {
            for (var j = 0; j < this[i].length; j++) {

                var retorno = action.apply(this[i][j], [i, j, this[i][j]]);
                if (retorno === false) break;

            }
        }
    };

    Array.prototype.forEach = Array.prototype.forEach || (function (action) {
        if (typeof action !== "function") {
            return;
        }
        for (var i = 0; i < this.length; i++) {
            action.apply(this[i], [this[i][j], i]);
        }

    });

    ns.direction = {
        top: 1,
        right: 2,
        bottom: 3,
        left: 4
    };

    ns.direction.position = {
        '1': {
            x: 0,
            y: -1
        },
            '2': {
            x: 1,
            y: 0
        },
            '3': {
            x: 0,
            y: 1
        },
            '4': {
            x: -1,
            y: 0
        }
    };

}(window));



(function (ns) {

    function StaticUI() {

        this.swapPiece = function (piece, target, callback) {

            if (typeof callback === "function") {

                callback();

            }

        };

        this.explode = function (pieces, callback) {

            if (typeof callback === "function") {

                callback();

            }

        };

    }


    //not visible functions

    var jewelTypes = [];

    JewelTable.prototype.createRandomJewel = function () {

        if (jewelTypes.length) {

            var randomIndex = Math.floor(Math.random() * (jewelTypes.length - 1));
            return new jewelTypes[randomIndex](this);
        }
        return null;

    }


    function JewelTable(jewelsNumber) {

        this.jewels = [];
        this.limits = {
            w: jewelsNumber,
            h: jewelsNumber
        };
        this.UI = new StaticUI();
       ...