JSFiddle - React, Tailwind, and code Playground

by Sean Wessell

HTML

<div id="counter"></div>
<div id="game"></div>

CSS

html, body {
    padding: 0px 0px 0px 0px;
    margin: 0px 0px 0px 0px;
    height:100%;
    width:100%;
    overflow:hidden;
}
#game {
    height:100%;
    width:100%;
    background:lightgrey;
}
html, body {
    padding: 0px 0px 0px 0px;
    margin: 0px 0px 0px 0px;
    height:100%;
    width:100%;
    overflow:hidden;
    p {
        width: 100px;
        height: 100px;
        border-radius: 50px;
        -webkit-border-radius: 50px;
        -moz-border-radius: 50px;
        position:absolute;
    }
    #counter {
        position:fixed;
        right:0px;
        top:0px;
        height:35px;
        width:185px;
        background:darkgrey;
        font-size: 32px;
        text-align:center;
    }

JavaScript

$('#game').on('click', function () {
	    addItem();
	});

	var itemCount = 0;

	function addItem() {
	    var topInt = Math.floor(Math.random() * 100) + 1;
	    var leftInt = Math.floor(Math.random() * 100) + 1;
	    var imgInt = Math.floor(Math.random() * 4) + 1;
	    $('#game').append("<p id='piece" + itemCount + "' style='display:none;top:" + topInt + "%;left:" + leftInt + "%;background-color:" + getRandomColor() + ";background-image: url(http://games.seanwessell.com/bg" + imgInt + ".png);'></p>");

	    $('#piece' + itemCount).on('mousedown', function (e) {
	        $(this).remove();
	        e.stopPropagation();
	        refreshCount();
	    }).fadeIn('slow');

	    $('#piece' + itemCount).animate({
	        top: '-500'
	    }, 7500, function () {
	        $(this).fadeOut();
	    });

	    itemCount++;
	    refreshCount();
	}

	function refreshCount() {
	    var countTotal = $('p').length;
	    $('#counter').html('COUNT: ' + countTotal);
	}

	setInterval(function () {
	    $('#game').click();
	}, 1200);

	function getRandomColor() {
	    var letters = '0123456789ABCDEF'.split('');
	    var color = '#';
	    for (var i = 0; i < 6; i++) {
	        color += letters[Math.floor(Math.random() * 16)];
	    }
	    return color;
	}