enjalot · November 18, 2015 19:50
diff --git a/README.md b/README.md
diff --git a/backers.csv b/backers.csv
diff --git a/index.html b/index.html
 <!DOCTYPE html>
 <head>
  <meta charset="utf-8">
  <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/marked/0.3.2/marked.js"></script>
 </head>

 <style>
  body {
    background-color: #111317;
    color: #124b58;
    font-size: 200px;
    text-align: center;
    width: 100%;
    margin-top: 120px;
    position: absolute;
  }
  .backers {
    position:absolute;
    color: #94dae9;
    font-size: 20px;
    top:-200px;
    left:0;
  }
 </style>

 <body> 
  Thank you
  <script>
    d3.csv("backers.csv", function(err, data) {
      console.log(data);
      var markdown = "";
      data.forEach(function(d) {
        markdown += "♥ [" + d.name + "](" + d.url + ")  \n" 
      })
      //console.log("markdown\n", markdown);
      //console.log("HTML\n", marked(markdown))
      
      var backers = d3.select("body").selectAll("div.backers")
      .data(data)
      
      backers.enter().append("div").classed("backers", true)
      
      backers.text(function(d) { return d.name })
        .style({
          left: function(d,i) { return Math.random() * 880 + "px" }
        })
      
      backers.transition()
        .ease("sin")
        .delay(function(d,i) { return i * 80 })
        .duration(function(d) { return 2500 + Math.random() * 400})
        .style({
          top: "600px"
        }).each("end", function(d,i) {
          repeat(d3.select(this), i)
        })
      
      function repeat(selection, i) {
        selection
          .style({ top: "-200px", left: Math.random() * 880 + "px" })
          .transition()
          .ease("sin")
          .delay(2500 + 400 + i * 80)
          .duration(function() { return 2500 + Math.random() * 400 })
          .style({ top: "600px" })
          .each("end", function() { repeat(selection, i) })
      }
      
    })
  </script>
 </body>


diff --git a/thumbnail.png b/thumbnail.png
number	name	url
43	Shirley Wu	https://twitter.com/shirleyxywu
60	James Waters	https://twitter.com/jamescwaters
5	Elijah Meeks	http://elijahmeeks.com/
9	d3noob	http://www.d3noob.org/
31	Erik Hazzard	http://vasir.net
108	Zan Armstrong	http://blog.zanarmstrong.com/about/
36	Miles McCrocklin	https://twitter.com/milr0c
45	Erik Cunningham	https://twitter.com/trinary
56	Owen Dall	http://owendall.com
57	Sara Quigley	http://bl.ocks.org/saraquigley
90	Dow Street	http://ramble.io
92	Sebastian Gutierrez	https://www.dashingd3js.com
124	Andrew Thornton	http://encodingpixels.com
176	Sha Hwang	http://postarchitectural.com
3	Kristina	https://twitter.com/gelicia
4	Max Goldstein	https://twitter.com/maxgoldst
10	René Clausen Nielsen	https://twitter.com/ReneCNielsen
12	Charles Boicey	https://twitter.com/N2InformaticsRN
14	Maarten Vanhoof	http://www.mettihoof.be
15	Adam Pearce	roadtolarissa.com
16	Kent Russell	https://twitter.com/timelyportfolio
18	Jyri Tuulos	http://jyri.codes
21	Lane Harrison	https://twitter.com/laneharrison
22	Geoff McGhee	http://visualoop.com/geoffmcghee
26	Sophie Engle	https://twitter.com/sjengle
28	Jim Vallandingham	http://Vallandingham.me
29	Tom MacWright	http://macwright.org/
34	nthitz	https://uwba.org/Donate
35	Jinlong Yang	https://twitter.com/jinlongyang
38	Lon Riesberg	http://www.lonriesberg.com/
39	Brendan Sudol	http://www.brendansudol.com
40	Susie Lu	http://www.susielu.com
44	Sam Selikoff	https://twitter.com/samselikoff
46	Mike Freeman	http://mfviz.com
48	Jason Sundram	https://twitter.com/jsundram
49	Iain Emsley	http://www.austgate.co.uk
50	noansknv	http://www.noansknv.io
51	Christophe Viau	https://twitter.com/d3visualization
58	Gordon Woodhull	https://github.com/gordonwoodhull
61	Karl Sanford	https://twitter.com/krsanford
62	Yaniv Ben-Zaken	http://yaniv.bz
64	Brian Kilmartin	https://twitter.com/BKilmartinIT
66	Nils Schlomann	https://github.com/roundrobin
67	Tom VanAntwerp	http://tomvanantwerp.com
69	Jon Sadka	http://jonsadka.com
71	Ariel Azoulay	https://www.linkedin.com/pub/ariel-azoulay/38/615/560
74	Brylie Christopher Oxley	https://openhatch.org/people/brylie/
75	Jeremy Stucki	https://twitter.com/herrstucki
76	Timo Grossenbacher	http://twitter.com/grssnbchr
78	Joey Cherdarchuk	https://twitter.com/cherdarchuk
81	paul van slembrouck	http://www.sketchflow.com/
82	Shobhit Gupta	https://github.com/shobhitg
83	Tony Garcia	https://twitter.com/tonyrgarcia
84	Paul Katsen	http://twitter.com/blockspring
87	Sarah Rudd	https://twitter.com/onfooty
88	Adam Breckler	http://twitter.com/adambreckler
89	Munaf Assaf	http://www.munafassaf.com
91	Douglass Turner	http://bit.ly/15iIaY3
94	Tarek Rached	http://tarekrached.com/
102	David Mann	https://twitter.com/ba6dotus
105	Fred Benenson	http://fredbenenson.com/
109	Lynn Wetherell	https://twitter.com/SkiWether
112	John A Thompson	https://twitter.com/jarthurthompson
113	David Cabo	https://twitter.com/dcabo
114	Scanner	https://www.apricot.com/~scanner
119	John Alexis Guerra Gomez	http://johnguerra.co
120	Tony Chu	http://twitter.com/tonyhschu
122	Brandon Liu	http://twitter.com/bdon
123	ninjaPixel	http://ninjapixel.io/
126	fengshuo	http://fengshuo.co/
129	Jonathan Page	http://economistry.com/
131	Karl Broman	http://kbroman.org
133	Mahir Yavuz	http://mahir.nyc
138	Yuri Feldman	twitter.com/arrayjam
139	Matthieu Martin	http://matthieu-martin.com
141	Enrico Paganin	https://www.facebook.com/draco.paganin
146	Curtis Mitchell	https://twitter.com/Curt_Mitch
147	George Murphy	twitter.com/georgelmurphy
148	François Romain	http://twitter.com/francoisromain
149	Danny Cochran	dcochran.com
152	Ignacio Campo	https://es.linkedin.com/pub/ignacio-campo/25/4b2/b4
154	Fabian Dubois	https://twitter.com/fabian_dubois
159	Michael Groncki	http://www.michael-groncki.com
164	Phillip Smith	http://phillipadsmith.com/
165	Yassine Alouini	https://www.quora.com/Yassine-Alouini
168	Geo Miller	https://twitter.com/storesyntax
170	Aline Lerner	https://twitter.com/alinelernerLLC
172	Claud Alexander	https://twitter.com/Claud_Alexander
174	Johanna Fulda	https://twitter.com/jofu_
178	Kai Chang	http://bl.ocks.org/syntagmatic
	<!DOCTYPE html>
	<head>
	<meta charset="utf-8">
	<script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.5/d3.min.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/marked/0.3.2/marked.js"></script>
	</head>

	<style>
	body {
	background-color: #111317;
	color: #124b58;
	font-size: 200px;
	text-align: center;
	width: 100%;
	margin-top: 120px;
	position: absolute;
	}
	.backers {
	position:absolute;
	color: #94dae9;
	font-size: 20px;
	top:-200px;
	left:0;
	}
	</style>

	<body>
	Thank you
	<script>
	d3.csv("backers.csv", function(err, data) {
	console.log(data);
	var markdown = "";
	data.forEach(function(d) {
	markdown += "♥ [" + d.name + "](" + d.url + ") \n"
	})
	//console.log("markdown\n", markdown);
	//console.log("HTML\n", marked(markdown))

	var backers = d3.select("body").selectAll("div.backers")
	.data(data)

	backers.enter().append("div").classed("backers", true)

	backers.text(function(d) { return d.name })
	.style({
	left: function(d,i) { return Math.random() * 880 + "px" }
	})

	backers.transition()
	.ease("sin")
	.delay(function(d,i) { return i * 80 })
	.duration(function(d) { return 2500 + Math.random() * 400})
	.style({
	top: "600px"
	}).each("end", function(d,i) {
	repeat(d3.select(this), i)
	})

	function repeat(selection, i) {
	selection
	.style({ top: "-200px", left: Math.random() * 880 + "px" })
	.transition()
	.ease("sin")
	.delay(2500 + 400 + i * 80)
	.duration(function() { return 2500 + Math.random() * 400 })
	.style({ top: "600px" })
	.each("end", function() { repeat(selection, i) })
	}

	})
	</script>
	</body>