sanmai/lottery.html

## lottery.html
<!DOCTYPE html><html><head><meta charset="utf-8" />
<title>Draw a lottery in JavaScript</title>
<style type="text/css">
label, button {
  display: block;
}
</style>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript" src="http://crypto-js.googlecode.com/svn/tags/3.0.2/build/rollups/sha1.js"></script>
<script type="text/javascript">
$(function() {
	$("button").click(function(event) {
		event.preventDefault();
		$('.winners').hide();

		var participants = [];

		$("#participants").val().replace(/.+/gim, function(participant){
			participant = participant.trim();
			if (participants.indexOf(participant) == -1) {
				participants.push(participant);
			}
		});

		if (participants.length == 0) {
			return;
		}

		var IV = CryptoJS.SHA1($('#IV').val() + participants.sort().join()).toString();

		participants = participants.map(function(participant) {
			return {
				name: participant,
				hash: CryptoJS.SHA1(IV + participant).toString().substring(0, 7)
			};
		});

		participants = participants.sort(function(a,b) {
			if (a.hash < b.hash) {
				return -1;
			}
			if (a.hash > b.hash) {
				return 1;
			}
			return 0;
		}).slice(0, 10);

		$("#winners").html(participants.map(function(participant) {
			return participant.name + ' (<tt>' + participant.hash + '</tt>)';
		}).join('<br>'));

		$('.winners').show('slow');
	});

});
</script>
</head><body>
<p>This program hashes an array of strings made from IV2 plus each participant name with SHA1, where IV2 is formed from SHA1 hash of IV plus sorted list of
participants thus making the draw dependent not only on the original IV, but also on the list of participant. Then it sorts a resulting list of participants
by each participant's hash and shows top ten participants. Works only in ECMAScript 5 compatible browsers.</p>
<form>
<label for="keyLeft">IV:</label> <input type="text" id="IV">
<label for="participants">Participants, one on a line:</label><textarea id="participants" rows="3" cols="80"></textarea>
<button>Draw!</button>
</form>

<div class="winners" style="display:none;">
<h1>Winners are...</h1>
<div id="winners"></div>
</div>

</body>
</html>
	<!DOCTYPE html><html><head><meta charset="utf-8" />
	<title>Draw a lottery in JavaScript</title>
	<style type="text/css">
	label, button {
	display: block;
	}
	</style>
	<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
	<script type="text/javascript" src="http://crypto-js.googlecode.com/svn/tags/3.0.2/build/rollups/sha1.js"></script>
	<script type="text/javascript">
	$(function() {
	$("button").click(function(event) {
	event.preventDefault();
	$('.winners').hide();

	var participants = [];

	$("#participants").val().replace(/.+/gim, function(participant){
	participant = participant.trim();
	if (participants.indexOf(participant) == -1) {
	participants.push(participant);
	}
	});

	if (participants.length == 0) {
	return;
	}

	var IV = CryptoJS.SHA1($('#IV').val() + participants.sort().join()).toString();

	participants = participants.map(function(participant) {
	return {
	name: participant,
	hash: CryptoJS.SHA1(IV + participant).toString().substring(0, 7)
	};
	});

	participants = participants.sort(function(a,b) {
	if (a.hash < b.hash) {
	return -1;
	}
	if (a.hash > b.hash) {
	return 1;
	}
	return 0;
	}).slice(0, 10);

	$("#winners").html(participants.map(function(participant) {
	return participant.name + ' (<tt>' + participant.hash + '</tt>)';
	}).join('<br>'));

	$('.winners').show('slow');
	});

	});
	</script>
	</head><body>
	<p>This program hashes an array of strings made from IV2 plus each participant name with SHA1, where IV2 is formed from SHA1 hash of IV plus sorted list of
	participants thus making the draw dependent not only on the original IV, but also on the list of participant. Then it sorts a resulting list of participants
	by each participant's hash and shows top ten participants. Works only in ECMAScript 5 compatible browsers.</p>
	<form>
	<label for="keyLeft">IV:</label> <input type="text" id="IV">
	<label for="participants">Participants, one on a line:</label><textarea id="participants" rows="3" cols="80"></textarea>
	<button>Draw!</button>
	</form>

	<div class="winners" style="display:none;">
	<h1>Winners are...</h1>
	<div id="winners"></div>
	</div>

	</body>
	</html>