text: // more events under: https://api.jquery.com/category/events/mouse-events/
  function highlight() {
  	$(".evidence").mouseenter(
  			function() {
  				var evidenceId = JSON.parse($(this).attr('evidences'))[0];
  				console.log("mouse enter: " + event.target + " with id: "
  						+ evidenceId);
  				$(document).bind("keydown", function(e) {
  					if (17 == e.keyCode) { // Ctrl key
  						add_css_class(evidenceId);
  					}
  				});
  				$(document).bind("keyup", function(e) {
  					if (17 == e.keyCode) { // Ctrl key
  						remove_css_class(evidenceId);
  					}
  				});
  			});
  	$(".evidence").mouseleave(
  			function() {
  				var evidenceId = JSON.parse($(this).attr('evidences'))[0];
  				console.log("mouse leave: " + event.target + " with id: "
  						+ evidenceId);
  				remove_css_class(evidenceId);
  				$(document).unbind("keydown");
  
  			});
  };
  
  function add_css_class(evidenceId) {
  	$(".evidence-highlightable").each(function(idx, value) {
  		var evidences = JSON.parse($(value).attr('evidences'));
  		console.log("checking enter:" + evidences);
  		if (evidences.includes(evidenceId)) {
  			console.log("adding class on: " + $(value).attr('id'));
  			$(value).addClass("evidence-highlighted");
  			$(value).removeClass("evidence-not-highlighted");
  		}
  	})
  	$(this).addClass("evidence-highlighted");
  	$(this).removeClass("evidence-not-highlighted");
  };
  
  function remove_css_class(evidenceId) {
  	$(".evidence-highlightable").each(function(idx, value) {
  		var evidences = JSON.parse($(value).attr('evidences'));
  		console.log("checking leave:" + evidences);
  		if (evidences.includes(evidenceId)) {
  			console.log("removing class on: " + $(value).attr('id'));
  			$(value).removeClass("evidence-highlighted");
  			$(value).addClass("evidence-not-highlighted");
  		}
  	})
  	$(this).removeClass("evidence-highlighted");
  	$(this).addClass("evidence-not-highlighted");
  };
  
  function confidence_background() {
  	var threshold = 100.0
  	component = document.getElementsByClassName("slider")
  	if (!(component === undefined || component.length == 0)) {
  		var slider = component[0].firstElementChild
  		threshold = slider.value / 100.0
  	}
  
  	console.log("Thresold: " + threshold)
  	$(".annotatable").each(function(idx, value) {
  		$(value).removeClass("manual-annotation");
  		$(value).removeClass("automatic-annotation");
  		var confidence = $(value).attr('confidence');
  		if (confidence == 1.0) {
  			console.log("Setting as manually annotated");
  			$(value).addClass("manual-annotation")
  		} else if (confidence > threshold) {
  			console.log("Setting as automatically annotated");
  			$(value).addClass("automatic-annotation")
  		}
  	})
  };
  
  function range_listener() {
  	component = document.getElementsByClassName("slider")
  	if (!(component === undefined || component.length == 0)) {
  		var slider = component[0]
  		slider.oninput = function(evt) {
  	//		var output = document.getElementById("sliderOutput");
  	//		output.value = (slider.value * 100 | 0).toString() + " %";
  			console.log("Range changed: " + slider.value)
  			confidence_background()
  		}
  	}
  }
  
  $(document).ready(highlight);
  $(document).ajaxComplete(highlight);
  
  $(document).ready(confidence_background);
  $(document).ajaxComplete(confidence_background);
  
  //$(document).ready(range_listener);
  //$(document).ajaxComplete(range_listener);