X-Git-Url: http://git.shiar.nl/sheet.git/blobdiff_plain/8b237b43167a2443b69b6c0a3aec13c926782fc1..HEAD:/countries.plp

diff --git a/countries.plp b/countries.plp
index 24be348..efd2f25 100644
--- a/countries.plp
+++ b/countries.plp
@@ -2,21 +2,22 @@
 
 Html({
 	title => 'country code cheat sheet',
-	version => 'v1.1',
+	version => '1.3',
 	description =>
 		"Table of ISO-3166-1 country codes with the names of reserved territories.",
 	keywords => [qw'country code cc tld cctld continent territory land table'],
 	stylesheet => [qw'light dark circus mono red'],
+	data => ['data/countries.inc.pl'],
 });
 
 :>
 <h1>ISO-3166-1α2 Country codes</h1>
 
 <:
-my $cc = do 'countries.inc.pl';
+my $cc = Data('data/countries');
 
 {
-	printf '<table class="mcmap">';
+	printf '<table class="ccmap">';
 	print '<col><colgroup span="26">';
 	for my $section (qw{thead}) {
 		print "<$section><tr><th>↳";
@@ -33,22 +34,30 @@ my $cc = do 'countries.inc.pl';
 				next;
 			};
 			my ($name, $class, $short, $ref) = @$country;
+			$name .= " → $ref" if $ref;
 			$ref ||= $code;
-			local $_ = $ref;
+			my $cell;
 			if (exists $get{show}) {
-				my $img = "data/flag/$ref.png";
-				$_ = sprintf '<img src="/%s" alt="%s">', $img, $ref if -e $img;
+				sub showflag {
+					my ($cc) = @_;
+					my $img = "data/flag/$cc.png";
+					return -e $img &&
+						sprintf '<img src="/%s" alt="%s">', $img, $cc;
+				}
+
+				$cell = showflag($code) // join(' ',
+					map { showflag($_) || $_ } split(/ /, $ref)
+				);
 			}
 			else {
-				$_ = EscapeHTML($short || $name);
-				$name .= " → $ref" if $ref and $ref ne $code;
+				$cell = EscapeHTML($short || $name);
 			}
 			printf "\n".'<td class="%s" title="%s">%s',
-				$_ ? 'X '.$class : '', EscapeHTML("$code: $name"), $_;
+				$cell ? 'X '.$class : '', EscapeHTML("$code: $name"), $cell;
 		}
 		print "\n";
 	}
-	print "</table>\n";
+	say '</table>';
 }
 
 :>
@@ -80,3 +89,26 @@ my $cc = do 'countries.inc.pl';
 	</div>
 </div>
 
+<: exit unless exists $get{v}; :>
+<script type="text/javascript"><!--
+	const table = document.querySelector('.ccmap');
+	const label = Array.prototype.map.call(table.tHead.rows[0].children, i => i.textContent);
+	const flagchr = 0x1F1E5; // regional indicator symbol letter base
+	let nowidth;
+	for (let row = 0; row < label.length; row++) {
+		for (let col = 0; col < label.length; col++) {
+			let cell = table.rows[row].cells[col];
+			if (!cell.className) continue;
+			let flag = String.fromCodePoint(flagchr + row) + String.fromCodePoint(flagchr + col);
+			cell.innerHTML = `<big>${flag}</big>&nbsp;` + cell.innerHTML;
+			if (nowidth === undefined) {
+				// assume AA is invalid, compare its size to validate following glyphs
+				nowidth = cell.firstChild.offsetWidth;
+			}
+			if (cell.firstChild.offsetWidth == nowidth) {
+				cell.firstChild.remove();
+			}
+		}
+	}
+//--></script>
+