JavaScript Inverted Color Generator

by maurycyg

HTML

<div>
    <div class="inverse"></div>
    <div class="inverse"></div>
    <div class="inverse"></div>
    <div class="inverse"></div>
    <div class="inverse"></div>
    <div class="inverse"></div>
    <div class="inverse"></div>
    <div class="inverse"></div>
    <div class="inverse"></div>
    <div class="inverse"></div>
    <div class="inverse"></div>
    <div class="inverse"></div>
    <div class="inverse"></div>
    <div class="inverse"></div>
    <div class="inverse"></div>
    <div class="inverse"></div>
    <div class="inverse"></div>
    <div class="inverse"></div>
    <div class="inverse"></div>
    <div class="inverse"></div>
    <div class="inverse"></div>
    <div class="inverse"></div>
    <div class="inverse"></div>
    <div class="inverse"></div>
    <div class="inverse"></div>
    <div class="inverse"></div>
    <div class="inverse"></div>
    <div class="inverse"></div>
    <div class="inverse"></div>
    <div class="inverse"></div>
    <hr>
    <div class="blackandwhite"></div>
    <div class="blackandwhite"></div>
    <div class="blackandwhite"></div>
    <div class="blackandwhite"></div>
    <div class="blackandwhite"></div>
    <div class="blackandwhite"></div>
    <div class="blackandwhite"></div>
    <div class="blackandwhite"></div>
    <div class="blackandwhite"></div>
    <div class="blackandwhite"></div>
    <div class="blackandwhite"></div>
    <div class="blackandwhite"></div>
    <div class="blackandwhite"></div>
    <div class="blackandwhite"></div>
    <div class="blackandwhite"></div>
    <div class="blackandwhite"></div>
    <div class="blackandwhite"></div>
    <div class="blackandwhite"></div>
    <div class="blackandwhite"></div>
    <div class="blackandwhite"></div>
    <div class="blackandwhite"></div>
    <div class="blackandwhite"></div>
    <div class="blackandwhite"></div>
    <div class="blackandwhite"></div>
    <div class="blackandwhite"></div>
    <div class="blackandwhite"></div>
    <div...

CSS

body
{
    font: 14px monospace;
}
.blackandwhite, .inverse
{
    width: 72px;
    height: 72px;
    text-align: center;
    display: inline-block
}

JavaScript

$(document).ready(function() {
    function randomColor() {
        var color;
        color = Math.floor(Math.random() * 0x1000000); // integer between 0x0 and 0xFFFFFF
        color = color.toString(16); // convert to hex
        color = ("000000" + color).slice(-6); // pad with leading zeros
        color = "#" + color; // prepend #
        return color;
    }
    function invertColor(hexTripletColor) {
        var color = hexTripletColor;
        color = color.substring(1); // remove #
        color = parseInt(color, 16); // convert to integer
        color = 0xFFFFFF ^ color; // invert three bytes
        color = color.toString(16); // convert to hex
        color = ("000000" + color).slice(-6); // pad with leading zeros
        color = "#" + color; // prepend #
        return color;
    }
    RGB = function(colour) {
        if (colour.charAt(0) == "#") {
          colour = colour.substr(1, 6)
        }
        colour = colour.replace(/ /g, "");
        colour = colour.toLowerCase();
        var colour_defs = [{
          re: /^(\w{2})(\w{2})(\w{2})$/,
          process: function(bits) {
            return [parseInt(bits[1], 16), parseInt(bits[2], 16), parseInt(bits[3], 16)]
          }
        }, {
          re: /^(\w{1})(\w{1})(\w{1})$/,
          process: function(bits) {
            return [parseInt(bits[1] + bits[1], 16), parseInt(bits[2] + bits[2], 16), parseInt(bits[3] + bits[3], 16)]
          }
        }];
        for (var i = 0; i < colour_defs.length; i++) {
          var re = colour_defs[i].re;
          var processor = colour_defs[i].process;
          var bits = re.exec(colour);
          if (bits) {
            var channels = processor(bits);
            this.r = channels[0];
            this.g = channels[1];
            this.b = channels[2]
          }
        }
        this.r = (this.r < 0 || isNaN(this.r)) ? 0 : ((this.r > 255) ? 255 : this.r);
        this.g = (this.g < 0 || isNaN(this.g)) ? 0 : ((this.g > 255) ? 255 : this.g);
       ...