uri/data/test.cgi

#!/usr/bin/perl
use strict;

my $file_name = 'data-uris.txt';

my @item;
{
  open my $file, '<', $file_name;
  local $/ = undef;
  @item = split /\n\n#/, <$file>;
}

sub htescape ($) {
  my $s = shift;
  $s =~ s/&/&amp;/g;
  $s =~ s/</&lt;/g;
  $s =~ s/"/&quot;/g;
  return $s;
} # htescape

sub get_id ($) {
  my $s = shift;
  $s =~ s/([^0-9A-Za-z-])/sprintf '_%08X', ord $1/ge;
  return $s;
} # get_id

print q[Content-Type: text/html; charset=utf-8

<!DOCTYPE HTML>
<html lang=en>
<title>data: URIs</title>
<style>
.note {

}
.item {
  margin: 1em;
  padding: 0.2em 0.7em;
  background-color: #F0F8FC;
  color: black;
}
[irrelevant] {
  display: none;
}
</style>
<script>
  window.onload = function () {
    var anchors = document.getElementsByTagName ('a');
    var anchorsL = anchors.length;
    for (var i = 0; i < anchorsL; i++) {
      var anchor = anchors[i];
      if (!anchor.hasAttribute ('href')) {
        anchor.setAttribute ('href', '#tag=' + encodeURIComponent (anchor.textContent));
        anchor.onclick = function () {
          showTag (this.textContent);
        };
      }
    }

    var uri = location.href;
    if (uri.match (/#/)) {
      var hash = uri.substring (uri.indexOf ('#'));
      if (hash.match (/^#tag=/)) {
        showTag (decodeURIComponent (hash.substring (5)));
      }
    }
  }; // window.onload

  function showTag (tag) {
    var items = document.getElementsByTagName ('div');
    var itemsL = items.length;
    I: for (var i = 0; i < itemsL; i++) {
      var item = items[i];
      if (tag == '') {
        item.removeAttribute ('irrelevant');
      } else {
        var itemAs = item.getElementsByTagName ('a');
        var itemAsL = itemAs.length;
        for (var j = 0; j < itemAsL; j++) {
          if (itemAs[j].textContent == tag) {
            item.removeAttribute ('irrelevant');
            continue I;
          }
        }
        item.setAttribute ('irrelevant', '');
      }
    }
  }
</script><p><a href="#" onclick="showTag ('')">Show all</a></p>];

for (@item) {
  s/^#//;
  my %prop;
  for (split /\n#/, $_) {
    if (s/^([0-9A-Za-z-]+)(?>\n|\z)//s) {
      $prop{$1} = $_;
    }
  }

  my $id = htescape (get_id ($prop{data}));
  my $euri = htescape ($prop{data});
  print qq[<div class=item id=$id><p>URI: &lt;<a href="$euri">$euri</a>&gt;];
  for (qw/note conforming non-conforming source/) {
    next unless defined $prop{$_};
    print qq[<p>];
    print qq[<strong>Conforming</strong>: ] if $_ eq 'conforming';
    print qq[<strong>Non-conforming</strong>: ] if $_ eq 'non-conforming';
    print qq[Source: ] if $_ eq 'source';
    my $v = htescape ($prop{$_});
    $v =~ s[&lt;([^>]+)>][&lt;<a href="$1">$1</a>&gt;]g;
    print qq[<span class=note>] . $v . qq[</span>];
  }

  if (defined $prop{tag}) {
    my @tag = split /\n/, $prop{tag};
    print q[<p class=tags>Tags: ];
    print join ', ', map {'<a>' . htescape ($_) . '</a>'} @tag;
  }
  print qq[</div>];
}
1	#!/usr/bin/perl
2	use strict;
3
4	my $file_name = 'data-uris.txt';
5
6	my @item;
7	{
8	open my $file, '<', $file_name;
9	local $/ = undef;
10	@item = split /\n\n#/, <$file>;
11	}
12
13	sub htescape ($) {
14	my $s = shift;
15	$s =~ s/&/&/g;
16	$s =~ s/</</g;
17	$s =~ s/"/"/g;
18	return $s;
19	} # htescape
20
21	sub get_id ($) {
22	my $s = shift;
23	$s =~ s/([^0-9A-Za-z-])/sprintf '_%08X', ord $1/ge;
24	return $s;
25	} # get_id
26
27	print q[Content-Type: text/html; charset=utf-8
28
29	<!DOCTYPE HTML>
30	<html lang=en>
31	<title>data: URIs</title>
32	<style>
33	.note {
34
35	}
36	.item {
37	margin: 1em;
38	padding: 0.2em 0.7em;
39	background-color: #F0F8FC;
40	color: black;
41	}
42	[irrelevant] {
43	display: none;
44	}
45	</style>
46	<script>
47	window.onload = function () {
48	var anchors = document.getElementsByTagName ('a');
49	var anchorsL = anchors.length;
50	for (var i = 0; i < anchorsL; i++) {
51	var anchor = anchors[i];
52	if (!anchor.hasAttribute ('href')) {
53	anchor.setAttribute ('href', '#tag=' + encodeURIComponent (anchor.textContent));
54	anchor.onclick = function () {
55	showTag (this.textContent);
56	};
57	}
58	}
59
60	var uri = location.href;
61	if (uri.match (/#/)) {
62	var hash = uri.substring (uri.indexOf ('#'));
63	if (hash.match (/^#tag=/)) {
64	showTag (decodeURIComponent (hash.substring (5)));
65	}
66	}
67	}; // window.onload
68
69	function showTag (tag) {
70	var items = document.getElementsByTagName ('div');
71	var itemsL = items.length;
72	I: for (var i = 0; i < itemsL; i++) {
73	var item = items[i];
74	if (tag == '') {
75	item.removeAttribute ('irrelevant');
76	} else {
77	var itemAs = item.getElementsByTagName ('a');
78	var itemAsL = itemAs.length;
79	for (var j = 0; j < itemAsL; j++) {
80	if (itemAs[j].textContent == tag) {
81	item.removeAttribute ('irrelevant');
82	continue I;
83	}
84	}
85	item.setAttribute ('irrelevant', '');
86	}
87	}
88	}
89	</script><p><a href="#" onclick="showTag ('')">Show all</a></p>];
90
91	for (@item) {
92	s/^#//;
93	my %prop;
94	for (split /\n#/, $_) {
95	if (s/^([0-9A-Za-z-]+)(?>\n\|\z)//s) {
96	$prop{$1} = $_;
97	}
98	}
99
100	my $id = htescape (get_id ($prop{data}));
101	my $euri = htescape ($prop{data});
102	print qq[<div class=item id=$id><p>URI: <<a href="$euri">$euri</a>>];
103	for (qw/note conforming non-conforming source/) {
104	next unless defined $prop{$_};
105	print qq[<p>];
106	print qq[<strong>Conforming</strong>: ] if $_ eq 'conforming';
107	print qq[<strong>Non-conforming</strong>: ] if $_ eq 'non-conforming';
108	print qq[Source: ] if $_ eq 'source';
109	my $v = htescape ($prop{$_});
110	$v =~ s[<([^>]+)>][<<a href="$1">$1</a>>]g;
111	print qq[<span class=note>] . $v . qq[</span>];
112	}
113
114	if (defined $prop{tag}) {
115	my @tag = split /\n/, $prop{tag};
116	print q[<p class=tags>Tags: ];
117	print join ', ', map {'<a>' . htescape ($_) . '</a>'} @tag;
118	}
119	print qq[</div>];
120	}