example.html 3.0 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091
  1. <!DOCTYPE HTML>
  2. <html lang="en-us">
  3. <head>
  4. <meta http-equiv="Content-type" content="text/html; charset=utf-8">
  5. <title>Colors Example</title>
  6. <script src="../colors.js"></script>
  7. <link rel="stylesheet" type="text/css" href="example.css" />
  8. </head>
  9. <body>
  10. <script>
  11. var test = colors.red("hopefully colorless output");
  12. document.write('Rainbows are fun!'.rainbow + '<br/>');
  13. document.write('So '.italic + 'are'.underline + ' styles! '.bold + 'inverse'.inverse); // styles not widely supported
  14. document.write('Chains are also cool.'.bold.italic.underline.red); // styles not widely supported
  15. //document.write('zalgo time!'.zalgo);
  16. document.write(test.stripColors);
  17. document.write("a".grey + " b".black);
  18. document.write("Zebras are so fun!".zebra);
  19. document.write(colors.rainbow('Rainbows are fun!'));
  20. document.write("This is " + "not".strikethrough + " fun.");
  21. document.write(colors.italic('So ') + colors.underline('are') + colors.bold(' styles! ') + colors.inverse('inverse')); // styles not widely supported
  22. document.write(colors.bold(colors.italic(colors.underline(colors.red('Chains are also cool.'))))); // styles not widely supported
  23. //document.write(colors.zalgo('zalgo time!'));
  24. document.write(colors.stripColors(test));
  25. document.write(colors.grey("a") + colors.black(" b"));
  26. colors.addSequencer("america", function(letter, i, exploded) {
  27. if(letter === " ") return letter;
  28. switch(i%3) {
  29. case 0: return letter.red;
  30. case 1: return letter.white;
  31. case 2: return letter.blue;
  32. }
  33. });
  34. colors.addSequencer("random", (function() {
  35. var available = ['bold', 'underline', 'italic', 'inverse', 'grey', 'yellow', 'red', 'green', 'blue', 'white', 'cyan', 'magenta'];
  36. return function(letter, i, exploded) {
  37. return letter === " " ? letter : letter[available[Math.round(Math.random() * (available.length - 1))]];
  38. };
  39. })());
  40. document.write("AMERICA! F--K YEAH!".america);
  41. document.write("So apparently I've been to Mars, with all the little green men. But you know, I don't recall.".random);
  42. //
  43. // Custom themes
  44. //
  45. colors.setTheme({
  46. silly: 'rainbow',
  47. input: 'grey',
  48. verbose: 'cyan',
  49. prompt: 'grey',
  50. info: 'green',
  51. data: 'grey',
  52. help: 'cyan',
  53. warn: 'yellow',
  54. debug: 'blue',
  55. error: 'red'
  56. });
  57. // outputs red text
  58. document.write("this is an error".error);
  59. // outputs yellow text
  60. document.write("this is a warning".warn);
  61. //
  62. // Using CSS classes
  63. //
  64. colors.mode = "browser-css";
  65. var stylesColors = ['white', 'grey', 'black', 'blue', 'cyan', 'green', 'magenta', 'red', 'yellow'];
  66. var stylesNormal = stylesColors.concat(['bold', 'italic', 'underline', 'inverse']);
  67. stylesNormal.forEach(function (style) {
  68. var string = "Im feeling rather " + style + " today.";
  69. document.write(string[style] + "<br>");
  70. });
  71. </script>
  72. </body>
  73. </html>