latin: encode row data in named hashes
[sheet.git] / writing-latn.inc.pl
index 4186f183721cd95fbd66c12d6dbfe61d95dfd754..c9c655cb8df8d84ec91c71a120b225ded2e2489a 100644 (file)
+use 5.014;
 use utf8;
-use List::Util qw( pairs );
+use List::Util qw( pairs pairmap sum );
+
+my %C = qw(red #EC1C24  blue #3953A3  yellow #F9EC31  black #231F20);
+my $U = 0;  # optional unicode alternatives
 
 sub disptap {
-       return map {
-               !m/\A(-?)(\d)(\d)/ ? $_ :
-               $1.join(' ',
-                       '·' x $2, '·' x $3,
-               );
-       } @_;
+       my $code = shift;
+       my ($prefix, @dots) = $code =~ m/\A(-?)(\d)(\d)/ or return $code;
+       if ($U) {
+               # unicode glyph alternative as DOMINO TILE HORIZONTAL-0a-0b
+               return $prefix . chr(0x1F031 + ($dots[0] * 7) + $dots[1]);
+       }
+       return $prefix . join(' ', map { '·' x $_ } @dots);
 }
 
-my %C = qw(red #EC1C24  blue #3953A3  yellow #F9EC31  black #231F20);
-my $U = 0;  # optional unicode alternatives
+sub dispbar {
+       my $code = shift or return '';
+
+       return join '', pairmap {
+               ($a =~ tr/123/❘❙❚/r) . ($b =~ tr/321/  /dr)
+       } split //, $code if $U;
+
+       my @cols = split //, $code;  # bar and space widths
+       my $width = sum(@cols);
+       return sprintf(
+               '<svg width="%d" height="%d" viewBox="-.5 0 %d %d"><path d="%s"/></svg>',
+               $width * 2, 14, $width, 7, join(' ',
+                       'M0,0',
+                       map {
+                               join('m1,-7', ('v7') x $_->[0]),  # line per bar width
+                               (map { sprintf 'm%d,-7', $_ + 1 } $_->[1] || ()),  # space forward
+                       }
+                       pairs @cols
+               )
+       );
+}
 
 (
-'Uppercase' => [qw{ A B C D E F G H I J K L M N O P Q R S T U V W X Y Z }],
-'Lowercase' => [qw{ a b c d e f g h i j k l m n o p q r s t u v w x y z }],
-'Sütterlin' => [qw{ a b c d e f g h i j k l m n o p q r ſ s t u v w x y z }],
-'Old Roman Cursive' => [
-       map { m/^(-?)(\w.*)/ ? $1.'<svg width="20" height="20" viewBox="0 0 12 20"><path d="'.$2.'"/></svg>' : $_ }
-       "m2,4 c1,2 8,9 8,9 M2,15 6,9",
-       "m2,4 c0,0 3,-2 4,1 1,2 0,9 3,9 1,-0 2,-1 2,-1 m-6,-2 c-5,4 -0,6 1,3",
-       "m4,7 4,-2 m-4,4 c0,0 -2,7 3,6",
-       "m3,2 c0,0 7,10 7,12 m-2,-4 c-5,2 -4,9 1,3",
-       "m3,10 4,0 m2,-7 c0,0 -7,1 -5,16",
-       "m4,11 5,-2 m-3,-4 7,-4 M0,18 c0,0 4,3 5,-3 2,-6 2,-10 2,-10",
-       "m3,6 7,-2 m-7,4 c-2,5 4,9 6,6 l1,3",
-       "m7,9 4,-0 m-8,0 c4,0 6,-1 5,6 M1,3 c2,-0 2,12 2,12",
-       '>', # i = j
-       "m6,8 -0,7",
-       "-m9,5 -5,4 4,4 m-4,-10 -1,13",
-       "m3,2 c0,0 -1,9 1,10 5,2 6,2 6,2",
-       "m0,16 3,-10 4,6 2,-5 5,4",
-       "m2,16 1,-9 5,8 2,-9",
-       "m5,8 c-2,0 -2,6 1,5 4,-2 1,-5 1,-5",
-       "m5,8 c0,0 -1,8 2,6 m-3,-7 5,3",
-       "m3,6 9,12 m-9,-11 c-4,1 -3,4 -3,4 0,0 2,2 6,-1",
-       "m0,6 c3,-1 3,-1 6,0 2,1 3,3 6,1 m-7,-1 -2,11",
-       "m13,3 c0,0 -5,2 -8,4 -2,3 -1,5 -2,9 -1,1 -4,2 -4,2",
-       "m2,7 8,0 m-4,1 c0,0 -1,8 3,5",
-       '>', # u = v
-       "m2,5 c0,0 3,5 6,3 3,-2 2,-3 2,-3",
-       '-',
-       "m3,19 c-1,-6 6,-17 6,-17 M1,8 c0,0 10,1 10,1",
-       "-m0,7 c2,-3 5,-2 5,1 l0,11 c0,0 -0,-4 -0,-10 -0,-4 4,-4 6,-3",
-       "-m3,6 c4,-1 3,3 3,3 -1,3 -2,5 -1,5 1,1 3,0 3,0",
-],
-'Sutton <abbr title="American Sign Lanugage">ASL</abbr>' => [
-       # American manual alphabet in Sutton (U+1D800+) notation
-       map { !!$_ && pack 'W*', map { hex "1D$_" } unpack '(A3)*', $_ } qw{
-       8F7a9c    847a9c    86Da9c    801a9c    84Aa9c
-       8CEa9c    8F0       815aa2    892a9c    892a9c9A2aac
-       840a9c    8DCa9c    88Da9c
-       819a9c    876a9c    840a9caA1 8F0a9caA1 81Aa9c
-       903a9c    8FBa9c    815a9c    80Ea9c    887a9c
-       806a9c    89Aa9c    800a9c945aaa
-       0         965aa6
-}],
-'<abbr title="International Telegraph Alphabet">ITA</abbr>2' => [
-       map { tr/01/○●/r =~ s/..\K/ /r } qw(
-       11000 10011 01110 10010 10000 10110 01011 00101 01100 11010 11110 01001 00111
-       00110 00011 01101 11101 01010 10100 00001 11100 01111 11001 10111 10101 10001
-       00100
-)],
-'Braille' => [qw{ ⠁ ⠃ ⠉ ⠙ ⠑ ⠋ ⠛ ⠓ ⠊ ⠚ ⠅ ⠇ ⠍ ⠝ ⠕ ⠏ ⠟ ⠗ ⠎ ⠞ ⠥ ⠧ ⠺ ⠭ ⠽ ⠵ }],
-'5-point Tactile' => [
-       map { '<svg width="9" height="12" viewBox="0 0 18 24">'.$_.'</svg>' }
-       map {
-               join '', map { sprintf '<circle cx="%d" cy="%d" r="4"/>',
-                       !$_ ?  9 : $_ & 1 ? 4 : 14,
-                       !$_ ? 12 : $_ < 3 ? 4 : 20,
-               } split //
-       }
-       qw{
-               4 234 012 14 0 014 023 12
-               02 024 0134 23 013 03 01 123
-               0124 13 04 1 34 0123 134 0234
-               034 124
-       }
-],
-'Morse' => [map {tr/.-/‧‑/r} qw{
-       .- -... -.-. -.. . ..-. --. .... .. .--- -.- .-.. --
-       -. --- .--. --.- .-. ... - ..- ...- .-- -..- -.-- --..
-}],
-'Tap code' => [disptap(qw{
-       11 12 13 14 15 21 22 23  > 24 25 31 32
-       33 34 35 41 42 43 44 45 51 52 53 54 55
-})],
-'Short Tap' => [disptap(qw{
-       11 12 13 14 21 22 23 20 > 31 -13 32 33
-       30 41 42 -13 43 40 10 51 52 53 50 -31 -40
-})],
-'Cards' => [(
-       map { chr(0x1F0A0 + $_), sprintf('<b>%s</b>', chr(0x1F0B0 + $_)) }  # spades, hearts
-       1 .. 11, 13, 14  # A 2-10 J Q K
-), '', chr(0x1F0CF), chr(0x1F0DF) ],
-'Maritime flags' => [
-       # International Code of Signals, SVG fills
-       map { !!$_ && '<svg width="20" height="20" viewBox="0 0 30 30">'.s/\n?\t+//gr.'</svg>' }
-       split /\n\n/, qq{
-               <path fill="$C{blue}" d="M0,0 h30 l-7.5,15 7.5,15 h-30 z"/>
-               <path fill="white" d="M0,0 h15 v30 h-15"/>
-
-               <path fill="$C{red}" d="M0,0 h30 l-7.5,15 7.5,15 h-30 z"/>
-
-               <path fill="$C{blue}" d="M0,0 h30v30 h-30z"/>
-               <path fill="white" d="M0,6  h30 v18 h-30" />
-               <path fill="$C{red}" d="M0,12 h30 v6  h-30" />
-
-               <path fill="$C{yellow}" d="M0,0 h30v30 h-30z"/>
-               <path fill="$C{blue}" d="M0,6 h30 v18 h-30"/>
-
-               <path fill="$C{red}" d="M0,0 h30v30 h-30z"/>
-               <path fill="$C{blue}" d="M0,0 h30 v15 h-30"/>
-
-               <path fill="white" d="M0,0 h30v30 h-30z"/>
-               <path fill="$C{red}" d="M15,0 l15,15 -15,15 -15,-15"/>
-
-               <path fill="$C{blue}" d="M0,0 h30v30 h-30z"/>
-               <path fill="$C{yellow}" d="M 0,0 h5 v30 h-5"/>
-               <path fill="$C{yellow}" d="M10,0 h5 v30 h-5"/>
-               <path fill="$C{yellow}" d="M20,0 h5 v30 h-5"/>
-
-               <path fill="$C{red}" d="M0,0 h30v30 h-30z"/>
-               <path fill="white" d="M0,0 h15 v30 h-15"/>
-
-               <path fill="$C{yellow}" d="M0,0 h30v30 h-30z"/>
-               <circle fill="$C{black}" r="7.5" cx="15" cy="15"/>
-
-               <path fill="$C{blue}" d="M0,0 h30v30 h-30z"/>
-               <path fill="white" d="M0,10 h30 v10 h-30"/>
-
-               <path fill="$C{blue}" d="M0,0 h30v30 h-30z"/>
-               <path fill="$C{yellow}" d="M0,0 h15 v30 h-15"/>
-
-               <path fill="$C{black}" d="M0,0 h30v30 h-30z"/>
-               <path fill="$C{yellow}" d="M0,0 h15 v15 h-15 M15,15 h15 v15 h-15"/>
-
-               <path fill="white" d="M0,0 h30v30 h-30z"/>
-               <path fill="$C{blue}" d="M4,0h22l-11,11 M4,30h22l-11,-11 M0,4v22l11,-11 M30,4v22l-11,-11"/>
-
-               <path fill="white" d="M0,0 h30v30 h-30z"/>
-               <path fill="$C{blue}" d="
-                       M0,0     h7.5v7.5h-7.5 m0,7.5h7.5v7.5h-7.5
-                       m7.5,-15 h7.5v7.5h-7.5 m0,7.5h7.5v7.5h-7.5
-                       m7.5,-30 h7.5v7.5h-7.5 m0,7.5h7.5v7.5h-7.5
-                       m7.5,-15 h7.5v7.5h-7.5 m0,7.5h7.5v7.5h-7.5
-               "/>
-
-               <path fill="$C{yellow}" d="M0,0 h30v30 h-30z"/>
-               <path fill="$C{red}" d="M0,0 h30 v30"/>
-
-               <path fill="$C{blue}" d="M0,0 h30v30 h-30z"/>
-               <path fill="white" d="M10,10 h10 v10 h-10"/>
-
-               <path fill="$C{yellow}" d="M0,0 h30v30 h-30z"/>
-
-               <path fill="$C{red}" d="M0,0 h30v30 h-30z"/>
-               <path fill="$C{yellow}" d="M12.5,0 v30 h5 v-30"/>
-               <path fill="$C{yellow}" d="M0,12.5 h30 v5 h-30"/>
-
-               <path fill="white" d="M0,0 h30v30 h-30z"/>
-               <path fill="$C{blue}" d="M10,10 h10 v10 h-10"/>
-
-               <path fill="white" d="M0,0 h30v30 h-30z"/>
-               <path fill="$C{red}" d="M0,0 h10 v30 h-10"/>
-               <path fill="$C{blue}" d="M20,0 h10 v30 h-10"/>
-
-               <path fill="white" d="M0,0 h30v30 h-30z"/>
-               <path fill="$C{red}" d="M0,0 h15 v15 h-15 M15,15 h15 v15 h-15"/>
-
-               <path fill="$C{red}" d="M0,0 h30v30 h-30z"/>
-               <path fill="white" d="M4,0h22l-11,11 M4,30h22l-11,-11 M0,4v22l11,-11 M30,4v22l-11,-11"/>
-
-               <path fill="$C{blue}" d="M0,0 h30v30 h-30z"/>
-               <path fill="white" d="M5,5 h20 v20 h-20"/>
-               <path fill="$C{red}" d="M10,10 h10 v10 h-10"/>
-
-               <path fill="white" d="M0,0 h30v30 h-30z"/>
-               <path fill="$C{blue}" d="M12.5,0 v30 h5 v-30"/>
-               <path fill="$C{blue}" d="M0,12.5 h30 v5 h-30"/>
-
-               <path fill="$C{red}" d="M0,0 h30v30 h-30z"/>
-               <path fill="$C{yellow}" d="M0,0h6l-6,6 M12,0h6l-18,18v-6 M24,0h6l-30,30v-6
-                       M30,6v6l-18,18h-6 M30,18v6l-6,6h-6"/>
-
-               <path fill="$C{black}" d="M0,0 h30v30 h-30z"/>
-               <path fill="$C{blue}" d="M30,0 v31 l-15,-15"/>
-               <path fill="$C{yellow}" d="M0,0  h31 l-15,15"/>
-               <path fill="$C{red}" d="M0,30 h31 l-15,-15"/>
+'Uppercase' => {
+       list => [qw{ A B C D E F G H I J K L M N O P Q R S T U V W X Y Z }],
+},
+'Lowercase' => {
+       list => [qw{ a b c d e f g h i j k l m n o p q r s t u v w x y z }],
+},
+'Sütterlin' => {
+       list => [qw{ a b c d e f g h i j k l m n o p q r ſ s t u v w x y z }],
+},
+'Old Roman Cursive' => {
+       list => [
+               map {
+                       !m/^(-?)(\w.+)/ ? $_ :
+                       $1.'<svg width="20" height="20" viewBox="0 0 12 20"><path d="'.$2.'"/></svg>'
+               }
+               "m2,4 c1,2 8,9 8,9 M2,15 6,9",
+               "m2,4 c0,0 3,-2 4,1 1,2 0,9 3,9 1,-0 2,-1 2,-1 m-6,-2 c-5,4 -0,6 1,3",
+               "m4,7 4,-2 m-4,4 c0,0 -2,7 3,6",
+               "m3,2 c0,0 7,10 7,12 m-2,-4 c-5,2 -4,9 1,3",
+               "m3,10 4,0 m2,-7 c0,0 -7,1 -5,16",
+               "m4,11 5,-2 m-3,-4 7,-4 M0,18 c0,0 4,3 5,-3 2,-6 2,-10 2,-10",
+               "m3,6 7,-2 m-7,4 c-2,5 4,9 6,6 l1,3",
+               "m7,9 4,-0 m-8,0 c4,0 6,-1 5,6 M1,3 c2,-0 2,12 2,12",
+               '>', # i = j
+               "m6,8 -0,7",
+               "-m9,5 -5,4 4,4 m-4,-10 -1,13",
+               "m3,2 c0,0 -1,9 1,10 5,2 6,2 6,2",
+               "m0,16 3,-10 4,6 2,-5 5,4",
+               "m2,16 1,-9 5,8 2,-9",
+               "m5,8 c-2,0 -2,6 1,5 4,-2 1,-5 1,-5",
+               "m5,8 c0,0 -1,8 2,6 m-3,-7 5,3",
+               "m3,6 9,12 m-9,-11 c-4,1 -3,4 -3,4 0,0 2,2 6,-1",
+               "m0,6 c3,-1 3,-1 6,0 2,1 3,3 6,1 m-7,-1 -2,11",
+               "m13,3 c0,0 -5,2 -8,4 -2,3 -1,5 -2,9 -1,1 -4,2 -4,2",
+               "m2,7 8,0 m-4,1 c0,0 -1,8 3,5",
+               '>', # u = v
+               "m2,5 c0,0 3,5 6,3 3,-2 2,-3 2,-3",
+               '-',
+               "m3,19 c-1,-6 6,-17 6,-17 M1,8 c0,0 10,1 10,1",
+               "-m0,7 c2,-3 5,-2 5,1 l0,11 c0,0 -0,-4 -0,-10 -0,-4 4,-4 6,-3",
+               "-m3,6 c4,-1 3,3 3,3 -1,3 -2,5 -1,5 1,1 3,0 3,0",
+       ],
+},
+'Sutton <abbr title="American Sign Lanugage">ASL</abbr>' => {
+       list => [
+               # American manual alphabet in Sutton (U+1D800+) notation
+               map { !!$_ && pack 'W*', map { hex "1D$_" } unpack '(A3)*', $_ } qw{
+               8F7a9c    847a9c    86Da9c    801a9c    84Aa9c
+               8CEa9c    8F0       815aa2    892a9c    892a9c9A2aac
+               840a9c    8DCa9c    88Da9c
+               819a9c    876a9c    840a9caA1 8F0a9caA1 81Aa9c
+               903a9c    8FBa9c    815a9c    80Ea9c    887a9c
+               806a9c    89Aa9c    800a9c945aaa
+               0         965aa6
+       }],
+},
+'Unistrokes' => {
+       list => [
+               map { '<svg width="14" height="16" viewBox="-1 -1 8 10">'.$_.'</svg>' }
+               map {
+                       sprintf('<circle cx="%s" cy="%s" r="1"/>', m/\AM(\d+),(\d+)(.?)/) . # start point
+                       (!!$3 && qq(<path d="$_"/>))
+               }
+               'M3,8 V0',
+               'M0,0 6,4 0,8',
+               'M6,0 0,4 6,8',
+               'M6,0 0,4 6,8',
+               'M6,4 H0',
+               'M6,0 0,0 0,8',
+               'M0,8 6,8 6,0',
+               'M0,0 6,0 6,8',
+               'M3,0 V8',
+               'M6,0 6,8 0,8',
+               'M0,8 6,0',
+               'M0,0 0,8 6,8',
+               'M6,8 3,0 0,8',
+               'M0,8 3,0 6,8',
+               'M6,0 Q0,6 3,8 6,6 0,0',
+               'M0,0 Q4,8 6,4 4,0 0,8',
+               'M6,0 Q2,8 0,4 2,0 6,8',
+               'M0,0 6,8',
+               'M6,0 0,0 6,8 0,8',
+               'M0,4 H6',
+               'M6,0 3,8 0,0',
+               'M0,0 3,8 6,0',
+               'M0,0 0,8 6,0 6,8',
+               'M0,0 Q6,6 3,8 0,6 6,0',
+               'M6,0 0,8',
+               'M0,0 6,0 0,8 6,8',
+               'M3,4',
+       ],
+},
+# 'Palm Graffiti' => {},
+'<abbr title="International Telegraph Alphabet">ITA</abbr>2' => {
+       list => [map { tr/01/○●/r =~ s/..\K/ /r } qw(
+               11000 10011 01110 10010 10000 10110 01011 00101 01100 11010 11110 01001 00111
+               00110 00011 01101 11101 01010 10100 00001 11100 01111 11001 10111 10101 10001
+               00100
+       )],
+},
+'Braille' => {
+       list => [qw{ ⠁ ⠃ ⠉ ⠙ ⠑ ⠋ ⠛ ⠓ ⠊ ⠚ ⠅ ⠇ ⠍ ⠝ ⠕ ⠏ ⠟ ⠗ ⠎ ⠞ ⠥ ⠧ ⠺ ⠭ ⠽ ⠵ }],
+},
+'5-point Tactile' => {
+       list => [
+               map { '<svg width="9" height="12" viewBox="0 0 18 24">'.$_.'</svg>' }
+               map {
+                       join '', map { sprintf '<circle cx="%d" cy="%d" r="4"/>',
+                               !$_ ?  9 : $_ & 1 ? 4 : 14,
+                               !$_ ? 12 : $_ < 3 ? 4 : 20,
+                       } split //
+               }
+               qw{
+                       4 234 012 14 0 014 023 12
+                       02 024 0134 23 013 03 01 123
+                       0124 13 04 1 34 0123 134 0234
+                       034 124
+               }
+       ],
+},
+'Morse' => {
+       list => [map {tr/.-/‧‑/r} qw{
+               .- -... -.-. -.. . ..-. --. .... .. .--- -.- .-.. --
+               -. --- .--. --.- .-. ... - ..- ...- .-- -..- -.-- --..
+       }],
+},
+'Tap code' => {
+       list => [map { disptap($_) } qw{
+               11 12 13 14 15 21 22 23  > 24 25 31 32
+               33 34 35 41 42 43 44 45 51 52 53 54 55
+       }],
+},
+'Short Tap' => {
+       list => [map { disptap($_) } qw{
+               11 12 13 14 21 22 23 20 > 31 -13 32 33
+               30 41 42 -13 43 40 10 51 52 53 50 -31 -40
+       }],
+},
+'Cards' => {
+       list => [(
+               map { chr(0x1F0A0 + $_), sprintf('<b>%s</b>', chr(0x1F0B0 + $_)) }  # spades, hearts
+               1 .. 11, 13, 14  # A 2-10 J Q K
+       ), '', chr(0x1F0CF), chr(0x1F0DF) ],
+},
+'Maritime flags' => {
+       list => [
+               # International Code of Signals, SVG fills
+               map { !!$_ && '<svg width="20" height="20" viewBox="0 0 30 30">'.s/\n?\t+//gr.'</svg>' }
+               split /\n\n/, qq{
+                       <path fill="$C{blue}" d="M0,0 h30 l-7.5,15 7.5,15 h-30 z"/>
+                       <path fill="white" d="M0,0 h15 v30 h-15"/>
+
+                       <path fill="$C{red}" d="M0,0 h30 l-7.5,15 7.5,15 h-30 z"/>
+
+                       <path fill="$C{blue}" d="M0,0 h30v30 h-30z"/>
+                       <path fill="white" d="M0,6  h30 v18 h-30" />
+                       <path fill="$C{red}" d="M0,12 h30 v6  h-30" />
+
+                       <path fill="$C{yellow}" d="M0,0 h30v30 h-30z"/>
+                       <path fill="$C{blue}" d="M0,6 h30 v18 h-30"/>
+
+                       <path fill="$C{red}" d="M0,0 h30v30 h-30z"/>
+                       <path fill="$C{blue}" d="M0,0 h30 v15 h-30"/>
+
+                       <path fill="white" d="M0,0 h30v30 h-30z"/>
+                       <path fill="$C{red}" d="M15,0 l15,15 -15,15 -15,-15"/>
+
+                       <path fill="$C{blue}" d="M0,0 h30v30 h-30z"/>
+                       <path fill="$C{yellow}" d="M 0,0 h5 v30 h-5"/>
+                       <path fill="$C{yellow}" d="M10,0 h5 v30 h-5"/>
+                       <path fill="$C{yellow}" d="M20,0 h5 v30 h-5"/>
+
+                       <path fill="$C{red}" d="M0,0 h30v30 h-30z"/>
+                       <path fill="white" d="M0,0 h15 v30 h-15"/>
+
+                       <path fill="$C{yellow}" d="M0,0 h30v30 h-30z"/>
+                       <circle fill="$C{black}" r="7.5" cx="15" cy="15"/>
+
+                       <path fill="$C{blue}" d="M0,0 h30v30 h-30z"/>
+                       <path fill="white" d="M0,10 h30 v10 h-30"/>
+
+                       <path fill="$C{blue}" d="M0,0 h30v30 h-30z"/>
+                       <path fill="$C{yellow}" d="M0,0 h15 v30 h-15"/>
+
+                       <path fill="$C{black}" d="M0,0 h30v30 h-30z"/>
+                       <path fill="$C{yellow}" d="M0,0 h15 v15 h-15 M15,15 h15 v15 h-15"/>
+
+                       <path fill="white" d="M0,0 h30v30 h-30z"/>
+                       <path fill="$C{blue}" d="M4,0h22l-11,11 M4,30h22l-11,-11 M0,4v22l11,-11 M30,4v22l-11,-11"/>
+
+                       <path fill="white" d="M0,0 h30v30 h-30z"/>
+                       <path fill="$C{blue}" d="
+                               M0,0     h7.5v7.5h-7.5 m0,7.5h7.5v7.5h-7.5
+                               m7.5,-15 h7.5v7.5h-7.5 m0,7.5h7.5v7.5h-7.5
+                               m7.5,-30 h7.5v7.5h-7.5 m0,7.5h7.5v7.5h-7.5
+                               m7.5,-15 h7.5v7.5h-7.5 m0,7.5h7.5v7.5h-7.5
+                       "/>
+
+                       <path fill="$C{yellow}" d="M0,0 h30v30 h-30z"/>
+                       <path fill="$C{red}" d="M0,0 h30 v30"/>
+
+                       <path fill="$C{blue}" d="M0,0 h30v30 h-30z"/>
+                       <path fill="white" d="M10,10 h10 v10 h-10"/>
+
+                       <path fill="$C{yellow}" d="M0,0 h30v30 h-30z"/>
+
+                       <path fill="$C{red}" d="M0,0 h30v30 h-30z"/>
+                       <path fill="$C{yellow}" d="M12.5,0 v30 h5 v-30"/>
+                       <path fill="$C{yellow}" d="M0,12.5 h30 v5 h-30"/>
+
+                       <path fill="white" d="M0,0 h30v30 h-30z"/>
+                       <path fill="$C{blue}" d="M10,10 h10 v10 h-10"/>
+
+                       <path fill="white" d="M0,0 h30v30 h-30z"/>
+                       <path fill="$C{red}" d="M0,0 h10 v30 h-10"/>
+                       <path fill="$C{blue}" d="M20,0 h10 v30 h-10"/>
+
+                       <path fill="white" d="M0,0 h30v30 h-30z"/>
+                       <path fill="$C{red}" d="M0,0 h15 v15 h-15 M15,15 h15 v15 h-15"/>
+
+                       <path fill="$C{red}" d="M0,0 h30v30 h-30z"/>
+                       <path fill="white" d="M4,0h22l-11,11 M4,30h22l-11,-11 M0,4v22l11,-11 M30,4v22l-11,-11"/>
+
+                       <path fill="$C{blue}" d="M0,0 h30v30 h-30z"/>
+                       <path fill="white" d="M5,5 h20 v20 h-20"/>
+                       <path fill="$C{red}" d="M10,10 h10 v10 h-10"/>
+
+                       <path fill="white" d="M0,0 h30v30 h-30z"/>
+                       <path fill="$C{blue}" d="M12.5,0 v30 h5 v-30"/>
+                       <path fill="$C{blue}" d="M0,12.5 h30 v5 h-30"/>
+
+                       <path fill="$C{red}" d="M0,0 h30v30 h-30z"/>
+                       <path fill="$C{yellow}" d="M0,0h6l-6,6 M12,0h6l-18,18v-6 M24,0h6l-30,30v-6
+                               M30,6v6l-18,18h-6 M30,18v6l-6,6h-6"/>
 
+                       <path fill="$C{black}" d="M0,0 h30v30 h-30z"/>
+                       <path fill="$C{blue}" d="M30,0 v31 l-15,-15"/>
+                       <path fill="$C{yellow}" d="M0,0  h31 l-15,15"/>
+                       <path fill="$C{red}" d="M0,30 h31 l-15,-15"/>
 
 
-               <path fill="$C{blue}" d="M0,5 30,15 0,25"/>
-               <path fill="$C{yellow}" d="M0,9 20,15 0,21"/>
 
-               <path fill="$C{blue}" d="M0,5 30,15 0,25"/>
-               <path fill="white" d="M15,10 30,15 15,20"/>
-       },
-],
-'Flag semaphore' => [
-       map {
-               local $_ = $_;
-               s/[1-4]\K(?=[4-9])/ /; # prevent unwanted vertical crossing
-               tr/1-9/↙←↖↑↗→↘↓/;
-               s{(\S)(?=.)}{<span style="position:absolute">$1</span>};
-               $_
-       }
-       qw(
-               1 2 3 4 5  6 7 21 31 46  14 51 16 17 23
-               24 25 26 27 34  35 47 56 57 36  67
-       )
-],
-'Chappe semaphore' => [
-       map {
-               my ($r, $pr, $pl) = split //, $_;
-               /^\D$/ ? $_ : sprintf(
+                       <path fill="$C{blue}" d="M0,5 30,15 0,25"/>
+                       <path fill="$C{yellow}" d="M0,9 20,15 0,21"/>
+
+                       <path fill="$C{blue}" d="M0,5 30,15 0,25"/>
+                       <path fill="white" d="M15,10 30,15 15,20"/>
+               },
+       ],
+},
+'Flag semaphore' => {
+       list => [
+               map {
+                       local $_ = $_;
+                       s/[1-4]\K(?=[4-9])/ /; # prevent unwanted vertical crossing
+                       tr/1-9/↙←↖↑↗→↘↓/;
+                       s{(\S)(?=.)}{<span style="position:absolute">$1</span>};
+                       $_
+               }
+               qw(
+                       1 2 3 4 5  6 7 21 31 46  14 51 16 17 23
+                       24 25 26 27 34  35 47 56 57 36  67
+               )
+       ],
+},
+'Chappe semaphore' => {
+       list => [
+               map {
+                       my ($r, $pr, $pl) = split //, $_;
+                       /^\D$/ ? $_ : sprintf(
+                               join('',
+                                       '<svg width="16" height="20" viewBox="0 0 10 15">',
+                                       '<path d="M5,6 v7"/>',
+                                       '<path d="M0,%s h10 %s" transform="rotate(%d 5 6)"/>',
+                                       '</svg>',
+                               ),
+                               ['6', '3v3', '9v-3']->[$pl],
+                               [ '',  'v3',  'v-3']->[$pr],
+                               $r * 45,
+                       );
+               }
+               # 360° rotation (0-7) and position state (0-2) of left and right bars
+               qw(
+                 021 121 221 321 421 521 621 721
+                 > 022 122 222 322 011 111 211 311
+                 001 101 201 301 401 501 601 701 020
+               )
+       ],
+},
+'Prussian semaphore' => {
+       list => [
+               map { /^\D+$/ ? $_ : sprintf
                        join('',
-                               '<svg width="16" height="20" viewBox="0 0 10 15">',
-                               '<path d="M5,6 v7"/>',
-                               '<path d="M0,%s h10 %s" transform="rotate(%d 5 6)"/>',
+                               '<svg width="10" height="20" viewBox="0 0 8 18">',
+                               '<path d="M4,1 v18"/>',
+                               (map {(
+                                       qq(<path d="M0 $_ h4" transform="rotate(%d 4 $_)"/>),
+                                       qq(<path d="M4 $_ h4" transform="rotate(-%d 4 $_)"/>),
+                               )} 3, 7, 14),
                                '</svg>',
                        ),
-                       ['6', '3v3', '9v-3']->[$pl],
-                       [ '',  'v3',  'v-3']->[$pr],
-                       $r * 45,
-               );
-       }
-       # 360° rotation (0-7) and position state (0-2) of left and right bars
-       qw(
-         021 121 221 321 421 521 621 721
-         > 022 122 222 322 011 111 211 311
-         001 101 201 301 401 501 601 701 020
-       )
-],
-'Prussian semaphore' => [
-       map { /^\D+$/ ? $_ : sprintf
-               join('',
-                       '<svg width="10" height="20" viewBox="0 0 8 18">',
-                       '<path d="M4,1 v18"/>',
-                       (map {(
-                               qq(<path d="M0 $_ h4" transform="rotate(%d 4 $_)"/>),
-                               qq(<path d="M4 $_ h4" transform="rotate(-%d 4 $_)"/>),
-                       )} 3, 7, 14),
-                       '</svg>',
-               ),
-               map { ($_ - 2) * 45 % 360 } split //, $_
-       }
-       # rotation state (0-3) for left and right bar of 3 rows
-       qw(
-               003000 000200 203300 000030 033030 000130 000330 032330 > 031330
-               022020 130120 001320 233010 030210 022310 203001 233001
-               131001 231301 000202 023302 230003 032003 201003 101003
-       )
-],
-'Code 39' => [
-       # ISO/IEC 16388
-       map { !!$_ && tr/012/ ❘❙/r }
-       # bar widths (1-2) followed by space of width 1 (implied) or 2 (0)
-       qw(
-               211012 121012 221011 112012 212011 122011 111022 211021 121021 112021
-               211102 121102 221101 112102 212101 122101 111202 211201 121201 112201
-               201112 102112 202111 101212 201211 102211        102121 0 101221
-       )
-],
-'Code 93' => [
-       map {
-               sprintf
-               '<svg width="18" height="14" viewBox="-.5 0 9 7"><path d="M0,0 %s"/></svg>',
-               join ' ',
+                       map { ($_ - 2) * 45 % 360 } split //, $_
+               }
+               # rotation state (0-3) for left and right bar of 3 rows
+               qw(
+                       003000 000200 203300 000030 033030 000130 000330 032330 > 031330
+                       022020 130120 001320 233010 030210 022310 203001 233001
+                       131001 231301 000202 023302 230003 032003 201003 101003
+               )
+       ],
+},
+'Code 39' => {
+       list => [map { dispbar($_) } qw(
+               2111121121 1121121121 2121121111 1111221121 2111221111 1121221111
+               1111122121 2111122111 1121122111 1111222111 2111111221 1121111221
+               2121111211 1111211221 2111211211 1121211211 1111112221 2111112211
+               1121112211 1111212211 2211111121 1221111121 2221111111 1211211121
+               2211211111 1221211111            1221112111 0 1211212111
+       )], # ISO/IEC 16388
+},
+'Code 93' => {
+       list => [map { dispbar($_) } qw(
+               211113 211212 211311 221112 221211 231111 112113 112212 112311 122112
+               132111 111123 111222 111321 121122 131121 212112 212211 211122 211221
+               221121 222111 112122 112221 122121 123111        311211 0 111141
+       )],
+},
+'Code 128' => {
+       list => [map { dispbar($_) } qw(
+               111323 131123 131321 112313 132113 132311 211313 231113 231311 112133
+               112331 132131 113123 113321 133121 313121 211331 231131 213113 213311
+               213131 311123 311321 331121 312113 312311        212222 0 211412 2331112
+       )],
+},
+'<abbr title="Royal Mail 4-State Customer Code">RM4SCC</abbr>' => {
+       list => [
                map {
-                       join('m1,-7', ('v7') x $_->[0]),  # line per bar width
-                       (map { sprintf 'm%d,-7', $_ + 1 } $_->[1] || ()),  # space forward
+                       my $len = length $_;
+                       !$len ? '' : sprintf(
+                               '<svg width="%d" height="20" viewBox="0 0 %d 6">'
+                               . '<path d="M1%s"/></svg>',
+                               $len * 5, $len * 2,
+                               join ' m2',
+                               map { sprintf ',%dv%dm0,-%d',
+                                       ($_ & 1 ? 0 : 2),  2 + ($_ & 2) + ($_ & 1) * 2,
+                                       ($_ & 1 ? 0 : 2) + 2 + ($_ & 2) + ($_ & 1) * 2,
+                               }
+                               split //
+                       );
                }
-               pairs split //
-       }
-       # bar and space widths (1-3)
-       qw(
-               21111 21121 21131 22111 22121 23111 11211 11221 11231
-               12211 13211 11112 11122 11132 12112 13112 21211 21221
-               21112 21122 22112 22211 11212 11222 12212 12311 31121
-       )
-],
-'Code 128' => [
-       map { $U ? tr/1-3-/❘❙❚ /r : sprintf
-               '<svg width="22" height="14" viewBox="-.5 0 11 7"><path d="M0,0 %s"/></svg>',
-               join ' ',
+               qw(
+                                                               2121 2301
+                       0132 0312 0330 2112 2130 2310
+                       1023 1203 1221 3003 3021 3201
+                       1032 1212 1230 3012 3030 3210
+                       1122 1302 1320 3102 3120 3300
+                       0033
+               ), # 0 for space
+               '', 1, 3  # start/end
+       ],
+},
+"D'ni" => {
+       list => [
                map {
-                       $_ eq '' ? 'm2,-7' :
-                       $_ eq '.' ? 'm3,-7' :
-                       $_ eq ':' ? 'm4,-7' :
-                       join 'm1,-7', ('v7') x $_
+                       state $window = 'M-.5,-.5H8.5V8.5H-.5Z';
+                       state $v = [
+                               '',
+                               'M0,4 8,4',
+                               'M0,8 Q4,4 8,8',
+                               'M0,4 4,8 8,4',
+                               'M2,0 2,4 8,4',
+                               'M0,0 8,8 M0,8 8,0', # cross
+                               'M3.5,4 h1', # dot
+                       ];
+                       state $h = [
+                               '',
+                               'M4,0 4,8',
+                               'M0,0 Q4,4 0,8',
+                               'M4,-.5 0,4 4,8.5',
+                               'M4,8 4,2 8,2',
+                       ];
+                       sprintf '<svg width="16" height="16" viewBox="-.5 -.5 9 9"><path d="%s"/></svg>',
+                               $window . ($h->[$_ % 5] . $v->[$_ / 5] || $v->[6]);
+               } 0 .. 5*5
+       ],
+},
+'Pigpen' => {
+       list => [
+               map {
+                       qq(<svg width="12" height="12" viewBox="-.5 -.5 7 7">$_</svg>)
                }
-               split /([.:])?/  # each bar [123] and space [ .:]
-       }
-       # bar widths (1-3) followed by space of width 1 (implied), 2 (.) or 3 (:)
-       qw(
-               11:2 1:12 1:1:2 12:1 1:21 1:2:1 21:1 2:11 2:1:1 123  12:3 1:23 132
-               13:2 1:32 332   21:3 2:13 231   23:1 233  312   31:2 3:12 321  32:1 22.2
-       )
-],
-'<abbr title="Royal Mail 4-State Customer Code">RM4SCC</abbr>' => [
-       map { sprintf
-               '<svg width="20" height="20" viewBox="0 0 8 6">'
-               . '<path d="M1%s"/></svg>',
-               join ' m2',
-               map { sprintf ',%dv%dm0,-%d',
-                       ($_ & 1 ? 0 : 2),  2 + ($_ & 2) + ($_ & 1) * 2,
-                       ($_ & 1 ? 0 : 2) + 2 + ($_ & 2) + ($_ & 1) * 2,
+               map {
+                       local $_ = $_;
+                       s/^H/mX,0/ or s/^V/m0,X/ or s/^/m0,0/;
+                       s/[hv]\K|X/6/g;
+                       s/(?:v|,[^0]).*?v\K/-/;
+                       s/(?:h|m[^0]).*?h\K/-/;
+                       m/h/ or s/v/l3,/g;
+                       m/v/ or s/h([^h]*)/l$1,3/g;
+                       my $dot = s/\.// && qq(<circle cx="3" cy="3" r="1"/>);
+                       qq(<path d="$_"/>$dot)
                }
-               split //
-       }
-       qw(
-                                   2121 2301
-               0132 0312 0330 2112 2130 2310
-               1023 1203 1221 3003 3021 3201
-               1032 1212 1230 3012 3030 3210
-               1122 1302 1320 3102 3120 3300
-               0033
-       ) # 0 for space
-],
-'Pigpen' => [
-       map {
-               qq(<svg width="12" height="12" viewBox="-.5 -.5 7 7">$_</svg>)
-       }
-       map {
-               local $_ = $_;
-               s/^H/mX,0/ or s/^V/m0,X/ or s/^/m0,0/;
-               s/[hv]\K|X/6/g;
-               s/(?:v|,[^0]).*?v\K/-/;
-               s/(?:h|m[^0]).*?h\K/-/;
-               m/h/ or s/v/l3,/g;
-               m/v/ or s/h([^h]*)/l$1,3/g;
-               my $dot = s/\.// && qq(<circle cx="3" cy="3" r="1"/>);
-               qq(<path d="$_"/>$dot)
-       }
-       qw(
-               Hvh  vhv  vh  hvh  vhvh  Hhvh  hv  Vvhv  Hhv
-               Hvh. vhv. vh. hvh. vhvh. Hhvh. hv. Vvhv. Hhv.
-               vv  hh  Hhh  Vvv
-               vv. hh. Hhh. Vvv.
-       ),
-],
-'Nyctographs' => [
-       map { s/M[\d,\hM]+(?=[M"])//gr }  # clean up superfluous moves
-       map { sprintf
-               '<svg width="14" height="14" viewBox="-.5 -.5 5 5">'
-               . '<path d="M0,0%s %s4,0 %s4,4 %s0,4 %s0,0"/></svg>',
-               'h.5v.5h-.5v-.5',  # start anchor
-               map { ['M', 'h0M', 'L']->[$_] }
-               split //
-       }
-       # draw style (0=empty, 1=dot, 2=line connect) to right, down, left, up
-       qw(
-               0010 0112 2022 2220 2000 2012 0122 0202 0020 0220 0012 0022 2202
-               0222 2222 0102 0200 2201 2002 2200 0100 0110 0120 2001 2010 2020 0
-       ),
-],
-'Chromacons' => [
-       # Colour Alphabet by Paul Green-Armytage (2010)
-       map {
-               sprintf !$_ ? '<span>%2$s</span>' : '<span style="background:#%s" title="%s">%s</span>',
-                       split(/:/), chr(8195);
-       }
-       qw{
-               F0A3FF:Amethyst 0075DC:Blue      993F00:Caramel  4C005C:Damson   191919:Ebony
-               005C31:Forest   2BCE48:Green     FFCC99:Honeydew 808080:Iron     94FFB5:Jade
-               8F7C00:Khaki    9DCC00:Lime      C20088:Mallow
-               003380:Navy     FFA405:Orpiment  FFA8BB:Pink     426600:Quagmire FF0010:Red
-               5EF1F2:Sky      00998F:Turquoise E0FF66:Uranium  740AFF:Violet   990000:Wine
-               FFFF80:Xanthin  FFFF00:Yellow    FF5005:Zinnia   0
-       }
-],
+               qw(
+                       Hvh  vhv  vh  hvh  vhvh  Hhvh  hv  Vvhv  Hhv
+                       Hvh. vhv. vh. hvh. vhvh. Hhvh. hv. Vvhv. Hhv.
+                       vv  hh  Hhh  Vvv
+                       vv. hh. Hhh. Vvv.
+               ),
+       ],
+},
+'Nyctographs' => {
+       list => [
+               map { s/M[\d,\hM]+(?=[M"])//gr }  # clean up superfluous moves
+               map { sprintf
+                       '<svg width="14" height="14" viewBox="-.5 -.5 5 5">'
+                       . '<path d="M0,0%s %s4,0 %s4,4 %s0,4 %s0,0"/></svg>',
+                       'h.5v.5h-.5v-.5',  # start anchor
+                       map { ['M', 'h0M', 'L']->[$_] }
+                       split //
+               }
+               # draw style (0=empty, 1=dot, 2=line connect) to right, down, left, up
+               qw(
+                       0010 0112 2022 2220 2000 2012 0122 0202 0020 0220 0012 0022 2202
+                       0222 2222 0102 0200 2201 2002 2200 0100 0110 0120 2001 2010 2020 0
+               ),
+       ],
+},
+'Chromacons' => {
+       list => [
+               # Colour Alphabet by Paul Green-Armytage (2010)
+               map {
+                       sprintf('<span%s>%s</span>',
+                               !!$_ && sprintf(' style="background:#%s" title="%s"', split /:/),
+                               chr(8195), # em space
+                       );
+               }
+               qw{
+                       F0A3FF:Amethyst 0075DC:Blue      993F00:Caramel  4C005C:Damson   191919:Ebony
+                       005C31:Forest   2BCE48:Green     FFCC99:Honeydew 808080:Iron     94FFB5:Jade
+                       8F7C00:Khaki    9DCC00:Lime      C20088:Mallow
+                       003380:Navy     FFA405:Orpiment  FFA8BB:Pink     426600:Quagmire FF0010:Red
+                       5EF1F2:Sky      00998F:Turquoise E0FF66:Uranium  740AFF:Violet   990000:Wine
+                       FFFF80:Xanthin  FFFF00:Yellow    FF5005:Zinnia   0
+               }
+       ],
+},
 );