JSFiddle - React, Tailwind, and code Playground

HTML

<div>
    <p><strong>Made for science.</strong> By <a href="http://nexua.org">Nijikokun</a> - 2013</p>
</div>
<div class="attempts"><span></span><div class="loaded"><div class="inner"></div></div></div>
<input type="submit" value="generate" /> <span class="value"></span>
<div><img class="puush" /></div>

CSS

* { box-sizing: border-box; }
body { font-family: Arial; font-size: 12px; }
.attempts { float: right; cursor: pointer; }
.attempts:hover .loaded { display: block; }
.loaded { display: none; float: right; width: 200px; position: fixed; right: 0; padding-top: 20px; }
.loaded .inner { padding: 10px; background: hsl(0, 100%, 100%); height: 200px; overflow: auto; border-radius: 2px; }
.loaded:hover { display: block; }
h3 { margin: 0; }
padding { margin: 0; padding: 0; }

JavaScript

function randomString(len, charSet) {
    charSet = charSet || 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
    var randomString = '';
    for (var i = 0; i < len; i++) {
    	var randomPoz = Math.floor(Math.random() * charSet.length);
    	randomString += charSet.substring(randomPoz,randomPoz+1);
    }
    return randomString;
}

function generate () {
    var chars = randomString(parseInt(randomString(1, '456'), 10));
    $('.puush').attr('src', 'http://puu.sh/' + chars);
}

var attempts = 0;
var images = [];

$('input').on('click', function (e) {
    $(".puush").hide();
    generate();
    e.preventDefault();
});

$(".puush").error(function(){
  generate();
});

$(".puush").load(function(){
  var $this = $(this), $src = $this.attr('src');
  if ($this.height() < 1) return generate();
 
  var $link = $('<a>').attr('target', '_blank').attr('href', $src).html($src);
  if (images.indexOf($src) != -1) return generate();
  else images.push($src), $('.loaded .inner').append($('<div>').html($link)[0].outerHTML);
  
  attempts++;
  $('.attempts span').html(attempts + ' images viewed this session');
  $('.value').html($link);
  $this.show();
});