example.html 2.49 KB
<!DOCTYPE HTML>
<html lang="en-us">
  <head>
    <meta http-equiv="Content-type" content="text/html; charset=utf-8">
    <title>Colors Example</title>
    <script src="colors.js"></script>
  </head>
  <body>
    <script>

    var test = colors.red("hopefully colorless output");

    document.write('Rainbows are fun!'.rainbow + '<br/>');
    document.write('So '.italic + 'are'.underline + ' styles! '.bold + 'inverse'.inverse); // styles not widely supported
    document.write('Chains are also cool.'.bold.italic.underline.red); // styles not widely supported
    //document.write('zalgo time!'.zalgo);
    document.write(test.stripColors);
    document.write("a".grey + " b".black);

    document.write("Zebras are so fun!".zebra);

    document.write(colors.rainbow('Rainbows are fun!'));
    document.write("This is " + "not".strikethrough + " fun.");

    document.write(colors.italic('So ') + colors.underline('are') + colors.bold(' styles! ') + colors.inverse('inverse')); // styles not widely supported
    document.write(colors.bold(colors.italic(colors.underline(colors.red('Chains are also cool.'))))); // styles not widely supported
    //document.write(colors.zalgo('zalgo time!'));
    document.write(colors.stripColors(test));
    document.write(colors.grey("a") + colors.black(" b"));

    colors.addSequencer("america", function(letter, i, exploded) {
      if(letter === " ") return letter;
      switch(i%3) {
        case 0: return letter.red;
        case 1: return letter.white;
        case 2: return letter.blue;
      }
    });

    colors.addSequencer("random", (function() {
      var available = ['bold', 'underline', 'italic', 'inverse', 'grey', 'yellow', 'red', 'green', 'blue', 'white', 'cyan', 'magenta'];

      return function(letter, i, exploded) {
        return letter === " " ? letter : letter[available[Math.round(Math.random() * (available.length - 1))]];
      };
    })());

    document.write("AMERICA! F--K YEAH!".america);
    document.write("So apparently I've been to Mars, with all the little green men. But you know, I don't recall.".random);

    //
    // Custom themes
    //

    colors.setTheme({
      silly: 'rainbow',
      input: 'grey',
      verbose: 'cyan',
      prompt: 'grey',
      info: 'green',
      data: 'grey',
      help: 'cyan',
      warn: 'yellow',
      debug: 'blue',
      error: 'red'
    });

    // outputs red text
    document.write("this is an error".error);

    // outputs yellow text
    document.write("this is a warning".warn);

    </script>
  </body>
</html>