esonderegger/cors.html

## cors.html
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="utf-8">
	<title>CORS Demo</title>
</head>
<body>
	<h1>Affordable Care Act Votes</h1>
	<button id="httpWithCors">HTTP with CORS enabled</button>
	<button id="httpNoCors">HTTP with CORS disabled</button>
	<button id="httpsWithCors">HTTPS with CORS enabled</button>
	<button id="httpsNoCors">HTTPS with CORS disabled</button>
	<h2>Yea</h2>
	<table id="votesyea"></table>
	<h2>Nay</h2>
	<table id="votesnay"></table>
<script src="//cdnjs.cloudflare.com/ajax/libs/d3/3.4.13/d3.min.js"></script>
<script>
d3.select("#httpWithCors").on("click", function(){
	fillVoteTable("http://jagss.rpy.xyz.s3-website-us-west-2.amazonaws.com/s396.json");
});
d3.select("#httpNoCors").on("click", function(){
	fillVoteTable("http://jagss.srtlabs.com.s3-website-us-east-1.amazonaws.com/s396.json");
});
d3.select("#httpsWithCors").on("click", function(){
	fillVoteTable("https://gist.githubusercontent.com/esonderegger/03e3e01aabef98ac3fc9/raw/c76a2231022bf73e54c67d451d953c829b36ad9a/s396");
});
d3.select("#httpsNoCors").on("click", function(){
	fillVoteTable("https://www.govtrack.us/data/congress/111/votes/2009/s396/data.json");
});
function fillVoteTable(url){
  d3.select("#votesyea").html("");
  d3.select("#votesnay").html("");
  d3.json(url, function(error, data) {
    if (error) return console.warn(error);
    for (var i = 0; i < data.votes.Yea.length; i++) {
      var voteTR = d3.select("#votesyea").append("tr");
      voteTR.append("td").text(data.votes.Yea[i].last_name);
      voteTR.append("td").text(data.votes.Yea[i].first_name);
      voteTR.append("td").text(data.votes.Yea[i].party + "-" + data.votes.Yea[i].state);
    }
    for (var i = 0; i < data.votes.Nay.length; i++) {
      var voteTR = d3.select("#votesnay").append("tr");
      voteTR.append("td").text(data.votes.Nay[i].last_name);
      voteTR.append("td").text(data.votes.Nay[i].first_name);
      voteTR.append("td").text(data.votes.Nay[i].party + "-" + data.votes.Nay[i].state);
    }
  });
}
</script>
</body>
</html>
	<!DOCTYPE html>
	<html lang="en">
	<head>
	<meta charset="utf-8">
	<title>CORS Demo</title>
	</head>
	<body>
	<h1>Affordable Care Act Votes</h1>
	<button id="httpWithCors">HTTP with CORS enabled</button>
	<button id="httpNoCors">HTTP with CORS disabled</button>
	<button id="httpsWithCors">HTTPS with CORS enabled</button>
	<button id="httpsNoCors">HTTPS with CORS disabled</button>
	<h2>Yea</h2>
	<table id="votesyea"></table>
	<h2>Nay</h2>
	<table id="votesnay"></table>
	<script src="//cdnjs.cloudflare.com/ajax/libs/d3/3.4.13/d3.min.js"></script>
	<script>
	d3.select("#httpWithCors").on("click", function(){
	fillVoteTable("http://jagss.rpy.xyz.s3-website-us-west-2.amazonaws.com/s396.json");
	});
	d3.select("#httpNoCors").on("click", function(){
	fillVoteTable("http://jagss.srtlabs.com.s3-website-us-east-1.amazonaws.com/s396.json");
	});
	d3.select("#httpsWithCors").on("click", function(){
	fillVoteTable("https://gist.githubusercontent.com/esonderegger/03e3e01aabef98ac3fc9/raw/c76a2231022bf73e54c67d451d953c829b36ad9a/s396");
	});
	d3.select("#httpsNoCors").on("click", function(){
	fillVoteTable("https://www.govtrack.us/data/congress/111/votes/2009/s396/data.json");
	});
	function fillVoteTable(url){
	d3.select("#votesyea").html("");
	d3.select("#votesnay").html("");
	d3.json(url, function(error, data) {
	if (error) return console.warn(error);
	for (var i = 0; i < data.votes.Yea.length; i++) {
	var voteTR = d3.select("#votesyea").append("tr");
	voteTR.append("td").text(data.votes.Yea[i].last_name);
	voteTR.append("td").text(data.votes.Yea[i].first_name);
	voteTR.append("td").text(data.votes.Yea[i].party + "-" + data.votes.Yea[i].state);
	}
	for (var i = 0; i < data.votes.Nay.length; i++) {
	var voteTR = d3.select("#votesnay").append("tr");
	voteTR.append("td").text(data.votes.Nay[i].last_name);
	voteTR.append("td").text(data.votes.Nay[i].first_name);
	voteTR.append("td").text(data.votes.Nay[i].party + "-" + data.votes.Nay[i].state);
	}
	});
	}
	</script>
	</body>
	</html>