Implement low quality highlighting

8 months ago · ae3ba9e32b
--- a/gui.css
+++ b/gui.css
@ -26,3 +26,7 @@ html, body {
 	font-size: 0.99em;
 	margin: 0;
 }

 .String.lowQuality {
 	background: #a4ddfd;
 }
--- a/index.html
+++ b/index.html
@ -9,7 +9,7 @@
 	<body>
 		<div id="toolbar">
 			<label for="inputFile">Charger un fichier ALTO</label><input id="filePicker" type="file" name="inputFile" accept="text/xml,.xml"/>
 			<label for="wcThreshold">Seuil de qualité</label><input type="number" min="0" max="1" step="0.01" value="0.5"/>
 			<label for="wcThreshold">Seuil de qualité</label><input id="thresholdInput" type="number" min="0" max="1" step="0.01" value="0.5"/>
 		</div>
 		<div id="workzone">
 		</div>
--- a/src/ALTO.js
+++ b/src/ALTO.js
@ -19,7 +19,7 @@ function appendTo(element) {
 	return function(e) {element.appendChild(e);};
 }

 function display(ALTODoc) {
 function display(ALTODoc, thresholdInput) {
 	var printSpace = Element.make(ALTODoc.querySelector('Page PrintSpace'));
 	Element.setPrintSpace(printSpace);
 	workzone.style.height = Element.printSpace.pxHeight + 'px';
@ -53,8 +53,9 @@ function display(ALTODoc) {

 	function makeString(parentElement) {
 		return function(string) {
 			var wc = string.getAttribute('WC');
 			var dom = Dom.make('span', {
 				class: "String",
 				class: (wc < thresholdInput.value ? ["lowQuality"] : []).concat("String"),
 				id: string.getAttribute('ID'),
 				textContent: string.getAttribute('CONTENT')
 			});
--- a/src/Main.js
+++ b/src/Main.js
@ -2,6 +2,7 @@ import * as Async from UnitJS.Async;
 import ALTO;

 var filePicker = document.getElementById('filePicker');
 var thresholdInput = document.getElementById('thresholdInput');
 var currentALTOFile = null;

 filePicker.addEventListener('change', function() {
@ -10,8 +11,14 @@ filePicker.addEventListener('change', function() {
 			ALTO.load(filePicker.files[0]),
 			Async.map(function(ALTOFile) {
 				currentALTOFile = ALTOFile;
 				ALTO.display(currentALTOFile);
 				refresh();
 			})
 		)
 	);
 });

 thresholdInput.addEventListener('change', refresh);

 function refresh() {
 	ALTO.display(currentALTOFile, thresholdInput);
 }