CountCulture/multi_foi.html

## multi_foi.html
<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="Content-type" content="text/html; charset=utf-8">
	<title>FoI Multi</title>
	<style type="text/css" media="screen">
		body {font-family: "Helvetica Neue", Arial, Helvetica, sans-serif; color:#333;}
		.alert { color: #c00;}
		.success_message, label { font-weight: bold;}
		.sub_message { background-color: yellow;}
		.placeholder { color: #999;}
		#insert_boilerplate {float:right;}
		#foi_text, form {width: 600px;}
	</style>
	<script type="text/javascript" charset="utf-8" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">
	</script>

	<script type="text/javascript" charset="utf-8">
	var boilerplate_prefix = "Under the Freedom of Information Act 2000 I would like to request the following information:\n\n";
	var boilerplate_suffix = "\n\nIf this information is held by an outside contractor then it is your responsibility under the FOIA to obtain that information.\n\nIf the arrangements for any of the agreements with the Publisher have been delegated or passed onto another public body, please can you inform me of this and if possible transfer the request to that public body. My preferred format to receive this information is by electronic means, specifically in a machine-readable form (e.g. CSV, Word or Excel Documents rather than scans of printouts).\n\nIf you need any clarification of this request or if it is too broad in any way please feel free to email me. If some parts of this request are more difficult to answer than others please release the answerable material as it is available rather than hold up the entire request for the contested data.\n\nIf FOI requests of a similar nature have already been asked could you please include your responses to those requests. I would be grateful if you could confirm in writing that you have received this request, and I look forward to hearing from you within the 20-working day statutory time period.";
	var machine_tag = 'mfoi_' + new Date().getTime();
	$(document).ready( function() {

		$('a#insert_boilerplate').click(function(event){
				var new_text = boilerplate_prefix + $('#foi_text').val() + boilerplate_suffix;
			  $('#foi_text').val(new_text);
				event.preventDefault();
		});

		$('#council_selector').change(function(event){
				$('.placeholder').hide();
			  $('#selected_councils ul').append('<li><a href="http://whatdotheyknow.com/' + $(this).val() + '/new" class="wdtk_link">' + this.options[this.selectedIndex].text + '</a> <a href="#" class="delete_selected_council">delete</a></li>');
				$('#message').html('<span class="sub_message">Council added. </span>Please choose another council');
				$('.sub_message').fadeOut(2000);
				event.preventDefault();
		});

		$('a.delete_selected_council').live('click',function(event){
			  $(this).parent().remove();
				event.preventDefault();
		});

		$('#multi_foi').submit(function(event){
				var selected_councils = $('#selected_councils a.wdtk_link');
				var selected_councils_count = selected_councils.length;
				for (var i = selected_councils.length - 1; i >= 0; i--){
					submitFormFor(selected_councils[i].href.match(/\d+/)[0]);
				};
				var success_message='<div class="success_message">'+ selected_councils.length + ' requests have prepared (in new windows) and are ready for submission. After they have been submitted the status will be available at:\<br /><a href="http://whatdotheyknow.com/machine_tag=' + machine_tag + '">http://whatdotheyknow.com/machine_tag=' + machine_tag + '</a></div>';
				$('#multi_foi').replaceWith(success_message);
				event.preventDefault();
		});

	});

	function insertCouncils (data) {
		var councils = data.councils;
		for (var i=0; i < councils.length; i++){
			// $('#council_selector').append("<option value='" + councils[i].wdtk_id + "'>" + councils[i].name + "</option>");
			$('#council_selector').append("<option value='" + i + "'>" + councils[i].name + "</option>");
		};
		$('#message').html('Please choose council');
	}

	function submitFormFor (wdtk_id) {
		var form = document.createElement("form");
		form.setAttribute("method", "post");
		form.setAttribute("action", "http://localhost:3000/" + wdtk_id);

		form.setAttribute("target", "_blank");

		form.appendChild(hiddenField('machine_tag', machine_tag))
		form.appendChild(hiddenField('preview', '1'))
		form.appendChild(hiddenField('outgoing_message[body]', $('#foi_text').val()))

		$('#hidden_form_area').append(form);
		form.submit();
	}

	function hiddenField (name, value) {
		var newHiddenField = document.createElement("input");
		newHiddenField.setAttribute("name", name);
		newHiddenField.setAttribute("value", value);
		return newHiddenField;
	}

	jQuery.getJSON('http://openlylocal.com/councils/all.json?callback=?', function(data){insertCouncils(data);});
	</script>
</head>
<body onload="">
	<h1>Multi Council FoI Submitter tool</h1>
	<p class='intro'>This is a very simple tool to help you submit the same FoI requests to multiple councils (particularly useful if you are trying to compare data across councils). It is an interface to the wonderful <a href="http://whatdotheyknow.com/">WhatDoTheyKnow.com</a> and uses <a href="http://openlylocal.com/">OpenlyLocal</a>'s <a href="http://openlylocal.com/councils/all">database of councils</a></p>
	<form id='multi_foi' action="index" method="post" accept-charset="utf-8">
		<div id='message' class="alert">
			Loading list of councils...
		</div>

		<select name="council_selector" id="council_selector" size="1">
			<option value="" selected="selected">-----</option>
		</select>

		<div id="selected_councils">
			<h3>Selected councils</h3>
			<p class="placeholder">None yet</p>
			<ul></ul>
		</div>
		<p>
			<a href='#' id='insert_boilerplate'>Insert standard text (can be edited)</a>

			<label for="foi_text">Text of request</label>
			<textarea id='foi_text' name="foi_text" rows="20"></textarea>
		</p>
		<p><input type="submit" value="Generate Requests"><br />
			Note: A new window will open for each request</p>
	</form>

	<div id="hidden_form_area" style="display:none">

	</div>
</body>
	<!DOCTYPE html>
	<html>
	<head>
	<meta http-equiv="Content-type" content="text/html; charset=utf-8">
	<title>FoI Multi</title>
	<style type="text/css" media="screen">
	body {font-family: "Helvetica Neue", Arial, Helvetica, sans-serif; color:#333;}
	.alert { color: #c00;}
	.success_message, label { font-weight: bold;}
	.sub_message { background-color: yellow;}
	.placeholder { color: #999;}
	#insert_boilerplate {float:right;}
	#foi_text, form {width: 600px;}
	</style>
	<script type="text/javascript" charset="utf-8" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js">
	</script>

	<script type="text/javascript" charset="utf-8">
	var boilerplate_prefix = "Under the Freedom of Information Act 2000 I would like to request the following information:\n\n";
	var boilerplate_suffix = "\n\nIf this information is held by an outside contractor then it is your responsibility under the FOIA to obtain that information.\n\nIf the arrangements for any of the agreements with the Publisher have been delegated or passed onto another public body, please can you inform me of this and if possible transfer the request to that public body. My preferred format to receive this information is by electronic means, specifically in a machine-readable form (e.g. CSV, Word or Excel Documents rather than scans of printouts).\n\nIf you need any clarification of this request or if it is too broad in any way please feel free to email me. If some parts of this request are more difficult to answer than others please release the answerable material as it is available rather than hold up the entire request for the contested data.\n\nIf FOI requests of a similar nature have already been asked could you please include your responses to those requests. I would be grateful if you could confirm in writing that you have received this request, and I look forward to hearing from you within the 20-working day statutory time period.";
	var machine_tag = 'mfoi_' + new Date().getTime();
	$(document).ready( function() {

	$('a#insert_boilerplate').click(function(event){
	var new_text = boilerplate_prefix + $('#foi_text').val() + boilerplate_suffix;
	$('#foi_text').val(new_text);
	event.preventDefault();
	});

	$('#council_selector').change(function(event){
	$('.placeholder').hide();
	$('#selected_councils ul').append('<li><a href="http://whatdotheyknow.com/' + $(this).val() + '/new" class="wdtk_link">' + this.options[this.selectedIndex].text + '</a> <a href="#" class="delete_selected_council">delete</a></li>');
	$('#message').html('<span class="sub_message">Council added. </span>Please choose another council');
	$('.sub_message').fadeOut(2000);
	event.preventDefault();
	});

	$('a.delete_selected_council').live('click',function(event){
	$(this).parent().remove();
	event.preventDefault();
	});

	$('#multi_foi').submit(function(event){
	var selected_councils = $('#selected_councils a.wdtk_link');
	var selected_councils_count = selected_councils.length;
	for (var i = selected_councils.length - 1; i >= 0; i--){
	submitFormFor(selected_councils[i].href.match(/\d+/)[0]);
	};
	var success_message='<div class="success_message">'+ selected_councils.length + ' requests have prepared (in new windows) and are ready for submission. After they have been submitted the status will be available at:\<br /><a href="http://whatdotheyknow.com/machine_tag=' + machine_tag + '">http://whatdotheyknow.com/machine_tag=' + machine_tag + '</a></div>';
	$('#multi_foi').replaceWith(success_message);
	event.preventDefault();
	});

	});

	function insertCouncils (data) {
	var councils = data.councils;
	for (var i=0; i < councils.length; i++){
	// $('#council_selector').append("<option value='" + councils[i].wdtk_id + "'>" + councils[i].name + "</option>");
	$('#council_selector').append("<option value='" + i + "'>" + councils[i].name + "</option>");
	};
	$('#message').html('Please choose council');
	}

	function submitFormFor (wdtk_id) {
	var form = document.createElement("form");
	form.setAttribute("method", "post");
	form.setAttribute("action", "http://localhost:3000/" + wdtk_id);

	form.setAttribute("target", "_blank");

	form.appendChild(hiddenField('machine_tag', machine_tag))
	form.appendChild(hiddenField('preview', '1'))
	form.appendChild(hiddenField('outgoing_message[body]', $('#foi_text').val()))

	$('#hidden_form_area').append(form);
	form.submit();
	}

	function hiddenField (name, value) {
	var newHiddenField = document.createElement("input");
	newHiddenField.setAttribute("name", name);
	newHiddenField.setAttribute("value", value);
	return newHiddenField;
	}

	jQuery.getJSON('http://openlylocal.com/councils/all.json?callback=?', function(data){insertCouncils(data);});
	</script>
	</head>
	<body onload="">
	<h1>Multi Council FoI Submitter tool</h1>
	<p class='intro'>This is a very simple tool to help you submit the same FoI requests to multiple councils (particularly useful if you are trying to compare data across councils). It is an interface to the wonderful <a href="http://whatdotheyknow.com/">WhatDoTheyKnow.com</a> and uses <a href="http://openlylocal.com/">OpenlyLocal</a>'s <a href="http://openlylocal.com/councils/all">database of councils</a></p>
	<form id='multi_foi' action="index" method="post" accept-charset="utf-8">
	<div id='message' class="alert">
	Loading list of councils...
	</div>

	<select name="council_selector" id="council_selector" size="1">
	<option value="" selected="selected">-----</option>
	</select>

	<div id="selected_councils">
	<h3>Selected councils</h3>
	<p class="placeholder">None yet</p>
	<ul></ul>
	</div>
	<p>
	<a href='#' id='insert_boilerplate'>Insert standard text (can be edited)</a>

	<label for="foi_text">Text of request</label>
	<textarea id='foi_text' name="foi_text" rows="20"></textarea>
	</p>
	<p><input type="submit" value="Generate Requests"><br />
	Note: A new window will open for each request</p>
	</form>

	<div id="hidden_form_area" style="display:none">

	</div>
	</body>