1use strict; 2use warnings; 3 4use Color::Palette; 5use Color::Palette::Schema; 6use HTML::Entities; 7use JSON; 8 9my $pb_palette = Color::Palette->new({ 10 colors => { 11 background => [ 0xEE, 0xEE, 0xEE ], 12 13 plainText => 'black', 14 errorText => 'poboxRedDark', 15 brightText => 'poboxBlueLight', 16 17 highlight => 'poboxBlue', 18 lowlight => [ 0x33, 0x33, 0x33 ], 19 20 linkText => 'poboxBlueDark', 21 22 black => [ 0x00, 0x00, 0x00 ], 23 white => [ 0xFF, 0xFF, 0xFF ], 24 25 poboxBlue => [ 0x0A, 0x5E, 0xFF ], 26 poboxBlueDark => [ 0x04, 0x3F, 0xA6 ], 27 poboxBlueLight => [ 0xC8, 0xDF, 0xFE ], 28 poboxRedDark => [ 0xA4, 0x00, 0x05 ], 29 }, 30}); 31 32my $lb_palette = Color::Palette->new({ 33 colors => { 34 background => [ 0xEE, 0xEE, 0xEE ], 35 36 plainText => 'black', 37 errorText => 'listboxRedDark', 38 brightText => 'listboxGreenLight', 39 40 highlight => 'listboxGreen', 41 lowlight => [ 0x33, 0x33, 0x33 ], 42 43 linkText => 'listboxGreenDark', 44 45 black => [ 0x00, 0x00, 0x00 ], 46 white => [ 0xFF, 0xFF, 0xFF ], 47 48 listboxGreen => [ 0x66, 0x99, 0x00 ], 49 listboxGreenDark => [ 0x3E, 0x51, 0x13 ], 50 listboxGreenLight => [ 0xB9, 0xDB, 0x5D ], 51 listboxRedDark => [ 0xA4, 0x00, 0x05 ], 52 }, 53}); 54 55my $template = Color::Palette::Schema->new({ 56 required_colors => [ qw( 57 background plainText errorText brightText highlight lowlight linkText 58 ) ], 59}); 60 61my $opb_palette = $pb_palette->optimize_for($template); 62my $olb_palette = $lb_palette->optimize_for($template); 63 64my $pcs = JSON->new->encode($opb_palette->hex_triples); 65my $lcs = JSON->new->encode($olb_palette->hex_triples); 66 67my $HTML = <<"HTML"; 68<html> 69<head> 70 <title>Test Page</title> 71 <script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js'></script> 72</head> 73 74<script> 75var palette = { 76 pobox : $pcs, 77 listbox: $lcs, 78}; 79 80function applyStyle(which) { 81 var pal = palette[ which ]; 82 var rgb_str; 83 84 \$("body").css({ backgroundColor: pal.background }); 85 86 \$("h1").css({ color: pal.highlight }); 87 88 \$(".error").css({ color: pal.errorText }); 89 90 \$("blockquote").css({ 91 color: pal.highlight, 92 backgroundColor: pal.lowlight 93 }); 94 95 \$("pre").css({ 96 border: "medium dashed " + pal.linkText 97 }); 98} 99</script> 100 101<body> 102 <h1>This is a Demo Page</h1> 103 104 <div class='error'>error text</div> 105 <blockquote> 106 This is some demo text. 107 </blockquote> 108 109 <p> 110 ...and here is some boring normal text. 111 </p> 112 113 <button onClick="applyStyle('pobox')">Pobox</button> 114 <button onClick="applyStyle('listbox')">Listbox</button> 115 116<pre> 117PROGRAM_SOURCE 118</pre> 119</body> 120</html> 121HTML 122 123my $source = do { 124 seek *DATA, 0, 0; 125 local $/; 126 <DATA>; 127}; 128 129$source = encode_entities($source); 130$HTML =~ s/PROGRAM_SOURCE/$source/; 131 132print $HTML; 133__DATA__ 134