lukemorton/prioritise.html

## prioritise.html
<!doctype html>
<html>
	<head>
		<title>Prioritise</title>
		<style>
			.selected{font-weight:bold;}
		</style>
	</head>
	<body>
		<h1>Prioritise</h1>
		<p>Use this app to prioritise a list of items. To get started past a list into the text box below.</p>
		<form id="raw">
			<p>
				<label for="raw-list">Put some raw list</label>
				<textarea id="raw-list" cols="20" rows="10"></textarea>
			</p>
			<p>
				<input type="submit" value="Start prioritising" />
			</p>
		</form>
		<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
		<script>
			$(function () {
				var $raw = $('#raw');
				var $nextRound = $('<input type="submit" value="Next Round" />');
				var generateList = function (listItems) {
					var listHtml = '';

					$.each(listItems, function (i, item) {
						listHtml += '<li><a href="#">' + item + '</a></li>';
					});

					$('<ul>' + listHtml + '</ul>')
						.appendTo($('body'));
						.delegate('a', 'click', function (e) {
							e.preventDefault();
							$(this).parent().toggleClass('selected');
						});
				};

				$raw.submit(function (e) {
					e.preventDefault();
					generateList($('#raw-list')
						.val()
						.replace('\r\n', '\n')
						.replace('\r', '\n')
						.split('\n'));
					$raw.replaceWith($nextRound);
				});

				$nextRound.click(function () {
					var $items = $('ul:last .selected');
					var items = [];

					$items.each(function () {
						items.push($(this).children('a').text());
					});

					generateList(items);
				});
			});
		</script>
	</body>
</html>
	<!doctype html>
	<html>
	<head>
	<title>Prioritise</title>
	<style>
	.selected{font-weight:bold;}
	</style>
	</head>
	<body>
	<h1>Prioritise</h1>
	<p>Use this app to prioritise a list of items. To get started past a list into the text box below.</p>
	<form id="raw">
	<p>
	<label for="raw-list">Put some raw list</label>
	<textarea id="raw-list" cols="20" rows="10"></textarea>
	</p>
	<p>
	<input type="submit" value="Start prioritising" />
	</p>
	</form>
	<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
	<script>
	$(function () {
	var $raw = $('#raw');
	var $nextRound = $('<input type="submit" value="Next Round" />');
	var generateList = function (listItems) {
	var listHtml = '';

	$.each(listItems, function (i, item) {
	listHtml += '<li><a href="#">' + item + '</a></li>';
	});

	$('<ul>' + listHtml + '</ul>')
	.appendTo($('body'));
	.delegate('a', 'click', function (e) {
	e.preventDefault();
	$(this).parent().toggleClass('selected');
	});
	};

	$raw.submit(function (e) {
	e.preventDefault();
	generateList($('#raw-list')
	.val()
	.replace('\r\n', '\n')
	.replace('\r', '\n')
	.split('\n'));
	$raw.replaceWith($nextRound);
	});

	$nextRound.click(function () {
	var $items = $('ul:last .selected');
	var items = [];

	$items.each(function () {
	items.push($(this).children('a').text());
	});

	generateList(items);
	});
	});
	</script>
	</body>
	</html>