charset/singlebyte/table.html

<!DOCTYPE HTML>
<head>
<style>
.match {
  background-color: green;
  color: white;
}
.not-match {
  background-color: red;
  color: white;
}
</style>
<body>

<table>
<thead><tr><th>Original Byte<th>Result String
<tbody>
</table>

<iframe style=display:none src=dummy></iframe>

<script>
  var query = (location.search || '?').substring (1).split (/;/);
  var charset = decodeURIComponent (query[0] || '');
  var plain = query[1] == 'plain';
  var iframe = document.getElementsByTagName ('iframe')[0];
  var tbody = document.getElementsByTagName ('tbody')[0];
  var nextByte = -1;
  var lastTimer;
  var results = [];
  var timeoutError = true;

  var mappingTables = {};
  var mappingTableNames = ['ie7vista', 'safari31vista', 'opera92vista', 'fx2vista'];
  var theadtr = document.getElementsByTagName ('thead')[0].firstChild;
  for (var i = 0; i < mappingTableNames.length; i++) {
    readMappingTable (charset, mappingTableNames[i]);
    theadtr.appendChild (document.createElement ('th'))
        .appendChild (document.createTextNode (mappingTableNames[i]));
  }

  doNext ();

  function readMappingTable (charset, uaid) {
    var c = charset.replace (/[^A-Za-z0-9_-]/g, '_');
    var fileName = 'result/' + c + '-' + uaid + '.txt';
    var xhr = new XMLHttpRequest ();
    xhr.open ('GET', fileName, false);
    xhr.send (null);
    if (xhr.status < 400) {
      mappingTables[uaid] = xhr.responseText.split ('\n');
    }
  } // readMappingTable
  
  function doNext () {
    clearTimeout (lastTimer);
    timeoutError = false

    if (nextByte == -1) {
      if (document.all && !window.opera) {
        iframe.onreadystatechange = function () {
          if (this.readyState == 'complete') {
            doNext ();
          }
        };
      } else {
        iframe.onload = doNext;
      }
      nextByte++;
      iframe.src = 'about:blank';
    } else if (nextByte <= 0xFF) {
      if (document.all && !window.opera) {
        iframe.onreadystatechange = function () {
          if (this.readyState == 'complete') {
            addTableRow ();
          }
        };
      } else {
        iframe.onload = addTableRow;
      }
      lastTimer = setTimeout (function () {
        timeoutError = true;
        iframe.onload = null;
        iframe.onreadystatechange = null;
        addTableRow ();
      }, 5000);
      iframe.src = 'charset.cgi/' + encodeURIComponent (charset)
          + '?' + nextByte++ + (plain ? ';plain' : '');
    } else {
      iframe.onload = null;
      iframe.onreadystatechange = null;
      doLast ();
    }
  } // doNext

  function addTableRow () {
    var tr = document.createElement ('tr');

    tr.appendChild (document.createElement ('th'))
        .appendChild (document.createTextNode (getByteCode (nextByte - 1)));

    var td = tr.appendChild (document.createElement ('td'));
    var docbody = iframe.contentWindow.document.body;
    var value = timeoutError ? '' : docbody.firstChild ? docbody.firstChild.firstChild ? docbody.firstChild.firstChild.data : docbody.firstChild.data || '' : '';
    for (var i = 0; i < value.length; i++) {
      td.appendChild (document.createTextNode (getCharCode (value.charCodeAt (i)) + ' '));
    }
    results[nextByte - 1] = td.innerText || td.textContent;

    for (var i = 0; i < mappingTableNames.length; i++) {
      var tableid = mappingTableNames[i];
      var cell = tr.appendChild (document.createElement ('td'));
      var cellValue = '';
      if (mappingTables[tableid]) {
        cellValue = mappingTables[tableid][nextByte - 1];
        cell.appendChild (document.createTextNode (cellValue));
        if (cellValue != results[nextByte - 1]) {
          cell.className = 'not-match';
        } else {
          cell.className = 'match';
        }
      } else {
        cell.className = 'no-data';
      }
    }

    tbody.appendChild (tr);

    doNext ();
  } // addTableRow

  function doLast () {
    var ta = document.createElement ('textarea');
    ta.value = results.join ('\n');
    document.body.appendChild (ta);
  } // doLast

  function getByteCode (c) {
    var r = c.toString (16).toUpperCase ();
    if (r.length < 2) {
      r = '0' + r;
    }
    return '0x' + r;
  } // getByteCode

  function getCharCode (c) {
    var r = c.toString (16).toUpperCase ();
    if (r.length < 2) {
      r = '000' + r;
    } else if (r.length < 3) {
      r = '00' + r;
    } else if (r.length < 4) {
      r= '0' + r;
    }
    return 'U+' + r;
  } // getCharCode

</script>
1	wakaba	1.1	<!DOCTYPE HTML>
2	wakaba	1.2	<head>
3			<style>
4			.match {
5			background-color: green;
6			color: white;
7			}
8			.not-match {
9			background-color: red;
10			color: white;
11			}
12			</style>
13	wakaba	1.1	<body>
14
15			<table>
16	wakaba	1.2	<thead><tr><th>Original Byte<th>Result String
17	wakaba	1.1	<tbody>
18			</table>
19
20	wakaba	1.2	<iframe style=display:none src=dummy></iframe>
21	wakaba	1.1
22			<script>
23	wakaba	1.2	var query = (location.search \|\| '?').substring (1).split (/;/);
24			var charset = decodeURIComponent (query[0] \|\| '');
25			var plain = query[1] == 'plain';
26	wakaba	1.1	var iframe = document.getElementsByTagName ('iframe')[0];
27			var tbody = document.getElementsByTagName ('tbody')[0];
28	wakaba	1.2	var nextByte = -1;
29			var lastTimer;
30			var results = [];
31			var timeoutError = true;
32
33			var mappingTables = {};
34			var mappingTableNames = ['ie7vista', 'safari31vista', 'opera92vista', 'fx2vista'];
35			var theadtr = document.getElementsByTagName ('thead')[0].firstChild;
36			for (var i = 0; i < mappingTableNames.length; i++) {
37			readMappingTable (charset, mappingTableNames[i]);
38			theadtr.appendChild (document.createElement ('th'))
39			.appendChild (document.createTextNode (mappingTableNames[i]));
40			}
41	wakaba	1.1
42			doNext ();
43	wakaba	1.2
44			function readMappingTable (charset, uaid) {
45			var c = charset.replace (/[^A-Za-z0-9_-]/g, '_');
46			var fileName = 'result/' + c + '-' + uaid + '.txt';
47			var xhr = new XMLHttpRequest ();
48			xhr.open ('GET', fileName, false);
49			xhr.send (null);
50			if (xhr.status < 400) {
51			mappingTables[uaid] = xhr.responseText.split ('\n');
52			}
53			} // readMappingTable
54	wakaba	1.1
55			function doNext () {
56	wakaba	1.2	clearTimeout (lastTimer);
57			timeoutError = false
58
59			if (nextByte == -1) {
60			if (document.all && !window.opera) {
61			iframe.onreadystatechange = function () {
62			if (this.readyState == 'complete') {
63			doNext ();
64			}
65			};
66			} else {
67			iframe.onload = doNext;
68			}
69			nextByte++;
70			iframe.src = 'about:blank';
71			} else if (nextByte <= 0xFF) {
72	wakaba	1.1	if (document.all && !window.opera) {
73			iframe.onreadystatechange = function () {
74			if (this.readyState == 'complete') {
75			addTableRow ();
76			}
77			};
78			} else {
79			iframe.onload = addTableRow;
80			}
81	wakaba	1.2	lastTimer = setTimeout (function () {
82			timeoutError = true;
83			iframe.onload = null;
84			iframe.onreadystatechange = null;
85			addTableRow ();
86			}, 5000);
87	wakaba	1.1	iframe.src = 'charset.cgi/' + encodeURIComponent (charset)
88	wakaba	1.2	+ '?' + nextByte++ + (plain ? ';plain' : '');
89	wakaba	1.1	} else {
90			iframe.onload = null;
91			iframe.onreadystatechange = null;
92	wakaba	1.2	doLast ();
93	wakaba	1.1	}
94			} // doNext
95
96			function addTableRow () {
97			var tr = document.createElement ('tr');
98
99			tr.appendChild (document.createElement ('th'))
100	wakaba	1.2	.appendChild (document.createTextNode (getByteCode (nextByte - 1)));
101	wakaba	1.1
102			var td = tr.appendChild (document.createElement ('td'));
103			var docbody = iframe.contentWindow.document.body;
104	wakaba	1.2	var value = timeoutError ? '' : docbody.firstChild ? docbody.firstChild.firstChild ? docbody.firstChild.firstChild.data : docbody.firstChild.data \|\| '' : '';
105	wakaba	1.1	for (var i = 0; i < value.length; i++) {
106	wakaba	1.2	td.appendChild (document.createTextNode (getCharCode (value.charCodeAt (i)) + ' '));
107			}
108			results[nextByte - 1] = td.innerText \|\| td.textContent;
109
110			for (var i = 0; i < mappingTableNames.length; i++) {
111			var tableid = mappingTableNames[i];
112			var cell = tr.appendChild (document.createElement ('td'));
113			var cellValue = '';
114			if (mappingTables[tableid]) {
115			cellValue = mappingTables[tableid][nextByte - 1];
116			cell.appendChild (document.createTextNode (cellValue));
117			if (cellValue != results[nextByte - 1]) {
118			cell.className = 'not-match';
119			} else {
120			cell.className = 'match';
121			}
122			} else {
123			cell.className = 'no-data';
124			}
125	wakaba	1.1	}
126
127			tbody.appendChild (tr);
128
129			doNext ();
130			} // addTableRow
131	wakaba	1.2
132			function doLast () {
133			var ta = document.createElement ('textarea');
134			ta.value = results.join ('\n');
135			document.body.appendChild (ta);
136			} // doLast
137
138			function getByteCode (c) {
139			var r = c.toString (16).toUpperCase ();
140			if (r.length < 2) {
141			r = '0' + r;
142			}
143			return '0x' + r;
144			} // getByteCode
145
146			function getCharCode (c) {
147			var r = c.toString (16).toUpperCase ();
148			if (r.length < 2) {
149			r = '000' + r;
150			} else if (r.length < 3) {
151			r = '00' + r;
152			} else if (r.length < 4) {
153			r= '0' + r;
154			}
155			return 'U+' + r;
156			} // getCharCode
157
158	wakaba	1.1	</script>