Your IP : 216.73.216.48

Current Path : /hdd/hdd11/www/vlevski/enter/con/doc/
Upload File :
Current File : /hdd/hdd11/www/vlevski/enter/con/doc/optimal-scaling.html

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

	<head>

		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

		<title>Chart of optimal scaling values</title>

		<style type="text/css">

			body {
				font: 9pt Arial, Verdana, Helvetica, sans-serif;
			}

			#scale-value-chart {
				border-collapse: collapse;
				border-spacing: 0;
			}

			#scale-value-chart caption {
				font-size: 200%;
				font-weight: bold;
				padding: 0.5em;
			}

			#scale-value-chart th {
				background: #eee;
				vertical-align: bottom;
				width: 1em;
			}

			#scale-value-chart th.col-text {
				padding-left: 2em;
				padding-right: 2em;
				width: auto;
			}

			#scale-value-chart td {
				border: 2px solid #fff;
				padding: 1px 2px;
				text-align: center;
			}

			#scale-value-chart .pos {
				background: #00ff00;
				color: #fff;
			}

			#scale-value-chart .neg {
				background: #ffdddd;
			}

		</style>

	</head>

	<body>

		<noscript>

			<h1>Chart of optimal scaling values</h1>

			<p>You need JavaScript to view this chart.</p>

		</noscript>

		<script type="text/javascript">

		var sizes = {};
		var map = [];
		var best = [];
		var length = 0;

		for (var i = 8; i <= 48; i += 1, ++length) {
			sizes[i] = [];
			for (var j = 1; j < 100; ++j) {
				var size = i * j;
				if (size > 1024) continue;
				sizes[i].push(size);
				if (!map[size]) map[size] = {};
				map[size][i] = true;
			}
		}

		var table = document.createElement('table');

		table.id = 'scale-value-chart';

		var caption = document.createElement('caption');

		caption.appendChild(document.createTextNode('Chart of optimal scaling values'));

		table.appendChild(caption);

		var thead = table.createTHead();

		var header1 = thead.insertRow(-1);
		var header2 = thead.insertRow(-1);

		var scaleHeading = document.createElement('th');
		scaleHeading.className = 'col-text';
		scaleHeading.rowSpan = 2;
		scaleHeading.innerHTML = 'Scaling<br />value';
		header1.appendChild(scaleHeading);

		var pxHeading = document.createElement('th');
		pxHeading.appendChild(document.createTextNode('Font size in pixels (green block is a match)'));
		header1.appendChild(pxHeading);

		var count = 0;

		for (var size in sizes) {
			var th = document.createElement('th');
			th.appendChild(document.createTextNode(size));
			header2.appendChild(th);
			++count;
		}

		pxHeading.colSpan = count;

		var matchHeading = document.createElement('th');
		matchHeading.className = 'col-text';
		matchHeading.rowSpan = 2;
		matchHeading.innerHTML = 'Font sizes<br />matched in total';
		header1.appendChild(matchHeading);

		var tbody = document.createElement('tbody');

		table.appendChild(tbody);

		for (var i = 0, l = map.length; i < l; ++i) {
			if (map[i] === undefined) continue;
			var row = tbody.insertRow(-1), matches = 0;
			row.insertCell(-1).appendChild(document.createTextNode(i));
			for (var size in sizes) {
				var cell = row.insertCell(-1), size = parseInt(size, 10);
				if (map[i][size]) {
					cell.className = 'pos';
					++matches;
				}
				else {
					cell.className = 'neg';
				}
			}
			var matchCell = row.insertCell(-1);
			matchCell.innerHTML = matches;
		}

		document.body.appendChild(table);

		</script>

	</body>

</html>