elsherbini · August 29, 2015 13:57
diff --git a/README.md b/README.md
diff --git a/_include b/_include
diff --git a/francophonie.csv b/francophonie.csv
diff --git a/index.html b/index.html
 <html>
 <head>
 </head>
 <body>
  <link href="style.css" rel="stylesheet" type="text/css">
  <script src="http://d3js.org/d3.v3.min.js"></script>
  <script src="http://d3js.org/topojson.v1.min.js"></script>
  <script src="http://d3js.org/queue.v1.min.js"></script>

  <div id="theglobe">
      <div id="left">
       <h3>Click on a country name</h3>
        <div id="navigation-container">
          <nav class="navigation">
            <ul id="navigation">
            </ul>
          </nav>
        </div> <!-- #navigation-container -->
      </div> <!-- #left -->
      <div id="globe"></div>
      <div id="right">
        <h2 id="activeName"></h2>
        <p><strong>Official Languages: </strong><p id="activeLanguages"> Loading...</p> </p>
        <p><strong>Population: </strong><p id="activePopulation">Loading...</p></p>
        <p><strong>Note: </strong><br><p id="activeNote">Loading...</p></p>
      </div> <!-- #right -->
  </div> <!-- #theglobe -->

  <script src="tour.js"></script>
 </body>
diff --git a/style.css b/style.css
 html, body {
  height: 100%;
  font: 12px 'Open Sans';
 }
 #theglobe {
  position: relative;
  margin-left: auto;
  margin-right: auto;
 }

 #theglobe h1, #theglobe h2 {
  font-size: 2.3em;
  font-weight: normal;
 }

 #theglobe h3 {
  font-size: 1.4em;
  margin: 0;
  font-weight: bold;
 }

 #header {
  left: 20px ;

 }

 #left
 {
  float: left;
  margin-left: 20px;
  color: rgb(70,70,70);
 }

 #left h3
 {
  margin-top: 10px;
  font-style: bold;
 }

 #navigation {
  position: relative;
 }

 #navigation ul
 {
  margin: 0 ;
  padding: 0 ;
  list-style-type: none ;
  -webkit-padding-start: 0 ;
 }

 #navigation li
 {
  margin: 0.5em 0 0 0 ;
  text-indent: -1.7em ;
  list-style-type: none ;
  color: #bbb ;
  font-size: 1.25em ;
  line-height: .8em ;
 }

 #navigation li a
 {
  display: block ;
  color: rgb(70,70,70) ;
  display: inline ;
  text-decoration: none ;
 }

 #navigation li.active-country a
 {
  color: #46056F ;
  font-weight: bold ;
 }

 #globe {
  float: left;
  z-index: -20;
 }


 #right {
  float: left;
  color: rgb(70,70,70);
  width: 250px;
 }

 #right h2 {
  margin-bottom: 0;
  font-size: 2em;
 }

 #right p {
  margin-top: 0;
  margin-bottom: 0.5em;
  font-size: 1.25em;
 }

 #right a {
  color: #46056F;
  font-weight: bold;
  text-decoration: none;

 }

 body{
  font-family: 'Open Sans', Helvetica, sans-serif;
 }


 #theglobe .globe {
  text-align: left ;
  position: absolute;
 }
 .globe.multipage {
  text-align: left;
  padding: 30px 0 0;
 }
 .globe.multipage .copyright {
  text-align: center;
 }
diff --git a/thumbnail.png b/thumbnail.png
diff --git a/tour.js b/tour.js
 var width = 530,
    height = 500;

 var projection = d3.geo.orthographic()
    .scale(248)
    .clipAngle(90)
    .translate([265, 250]);

 var canvas = d3.select("#globe").append("canvas")
    .attr("width", width)
    .attr("height", height);

 var c = canvas.node().getContext("2d");

 var path = d3.geo.path()
    .projection(projection)
    .context(c);


 var activeName = d3.select("#activeName"),
    activeLanguages = d3.select("#activeLanguages")
    activePopulation = d3.select("#activePopulation")
    activeNote = d3.select("#activeNote");

 queue()
    .defer(d3.json, "world-110m.json")
    .defer(d3.csv, "francophonie.csv")
    .await(ready);

 function ready(error, world, names) {
  
  var globe = {type: "Sphere"},
      land = topojson.feature(world, world.objects.land),
      countries = topojson.feature(world, world.objects.countries).features,
      francophoneCountries = topojson.feature(world, world.objects.countries),
      borders = topojson.mesh(world, world.objects.countries, function(a, b) { return a !== b; }),
      i = -1,
      n = countries.length,
      currentCountry = countries[0],
      priorities = ["France","Canada","Senegal","Morocco","Belgium","Switzerland","Haiti"];

  countries = countries.filter(function(d) {
    return names.some(function(n) {
      if (d.id == n.id) return d.name = n.name;
    });
  }).sort( function(a,b){
      aPriority = priorities.indexOf(a.name);
      bPriority = priorities.indexOf(b.name);
      if (aPriority > -1 && bPriority > -1){
          return aPriority - bPriority;
        }
      else if (aPriority > -1) {
        return -1;
      }
      else if (bPriority > -1) {
        return 1;
      }
      else{
        return a.name < b.name ? -1 : 1;
      };
   });

  francophoneCountries.features = francophoneCountries.features.filter(function(d){
    return names.some(function(n){
      return d.id == n.id;
    })
  });

  d3.select('#navigation').selectAll('li')
    .data(countries)
    .enter().append('li')
    .attr('class', function(d){return "li-" + d.name.replace(/\s+/g, "") ;} )
    .append('a')
    .attr('href', '#')
    .attr('onClick', function(d){return "setCountry(\"" + d.name + "\")";})
    .text(function(d){return "" + d.name;});

  var setCountry = function(dest){
    var cidx= lookUp(dest, countries)
    boldCountryName(dest.replace(/\s+/g, ""));
    setContent(dest, cidx);
    transitionGlobe(dest, cidx);
    return false;
  };

  window.setCountry = setCountry;

  
  function boldCountryName(dest){
    if (!d3.select('.active-country').empty() ){
      d3.selectAll('.active-country').classed({'active-country': false})}
    d3.select(".li-" + dest).classed({'active-country': true});
  }

  function setContent(dest, cidx){
    country = names[lookUp(dest, names)];
    activeName.text(country["name"])
    activeLanguages.html(generateLinks(country["language"]));
    activePopulation.text(numberWithCommas(country["population"]));
    activeNote.text(country["Note"]);
  }

  function generateLinks(languages){
    langArr = languages.split(",");
    linkArr = langArr.map(function(d){return "<a href=\"http://en.wikipedia.org/wiki/" + d + "_language\" target=\"_blank\">" + d + "</a>";});
    return linkArr.join(", ");
  }

  function numberWithCommas(x) {
    return x.replace(/\B(?=(\d{3})+(?!\d))/g, ",");
  }

  function lookUp(countryName, arr){
    var idx = -1;
    for (i = 0; i < n; i++){
      if (arr[i].name == countryName){
        idx = i;
        return idx;
      }
    }
    return idx;
  }


  function transitionGlobe(dest) {
    d3.transition()
        .duration(1250)
        .each("start", function() {
        })
        .tween("rotate", function() {
          var p = d3.geo.centroid(countries[lookUp(dest, countries)]),
              r = d3.interpolate(projection.rotate(), [-p[0], -p[1]]);
          return function(t) {

            projection.rotate(r(t));
            c.clearRect(0, 0, width, height);
            c.fillStyle = "#a7bc2e", c.beginPath(), path(land), c.fill();
            c.fillStyle = "#BE86FF", c.beginPath(), path(francophoneCountries), c.fill();
            c.fillStyle = "#46056F", c.beginPath(), path(countries[i]), c.fill();
            c.strokeStyle = "#5C7F42", c.lineWidth = .5, c.beginPath(), path(borders), c.stroke();
            c.strokeStyle = "#464646", c.lineWidth = 2, c.beginPath(), path(globe), c.stroke();
          };
        })
  }

  setCountry("Senegal", countries);
 }
diff --git a/world-110m.json b/world-110m.json
id	name	nativeName	tld	cca2	ccn3	cca3	currency	callingCode	capital	altSpellings	relevance	region	subregion	language	languageCodes	translations	population	latlng	demonym	borders	Note
108	Burundi	Burundi	.bi	BI	108	BDI	BIF	257	Bujumbura	BI,Republic of Burundi,Republika y'Uburundi,République du Burundi	0	Africa	Eastern Africa	Kirundi,French	fr,rn	Burundi,Burundi,Burundi,Burundi,ブルンジ,Burundi,Burundi	10163000	-3.5,30	Burundian	COD,RWA,TZA
174	Comoros	Komori	.km	KM	174	COM	KMF	269	Moroni	KM,Union of the Comoros,Union des Comores,Udzima wa Komori,al-Ittiḥād al-Qumurī	0	Africa	Eastern Africa	Comorian,Arabic,French	ar,fr	Union der Komoren,Comoras,Comores,Comore,コモロ,Comoren,Komori	724300	-12.16666666,44.25	Comoran
262	Djibouti	Djibouti	.dj	DJ	262	DJI	DJF	253	Djibouti	DJ,Jabuuti,Gabuuti,Republic of Djibouti,République de Djibouti,Gabuutih Ummuuno,Jamhuuriyadda Jabuuti	0	Africa	Eastern Africa	French,Arabic	fr,ar	Dschibuti,Yibuti,Djibouti,Gibuti,ジブチ,Djibouti,Džibuti	864618	11.5,43	Djibouti	ERI,ETH,SOM
450	Madagascar	Madagasikara	.mg	MG	450	MDG	MGA	261	Antananarivo	MG,Republic of Madagascar,Repoblikan'i Madagasikara,République de Madagascar	0	Africa	Eastern Africa	Malagasy,French	fr,mg	Madagaskar,Madagascar,Madagascar,Madagascar,マダガスカル,Madagaskar,Madagaskar	20696070	-20,47	Malagasy
175	Mayotte	Mayotte	.yt	YT	175	MYT	EUR	262	Mamoudzou	YT,Department of Mayotte,Département de Mayotte	0	Africa	Eastern Africa	French	fr	Mayotte,Mayotte,Mayotte,Mayotte,マヨット,Mayotte,Mayotte	212600	-12.83333333,45.16666666	French
638	Réunion	La Réunion	.re	RE	638	REU	EUR	262	Saint-Denis	RE,Reunion	0	Africa	Eastern Africa	French	fr	Réunion,Reunión,Réunion,Riunione,レユニオン,Réunion,Réunion	821136	-21.15,55.5	French
646	Rwanda	Rwanda	.rw	RW	646	RWA	RWF	250	Kigali	RW,Republic of Rwanda,Repubulika y'u Rwanda,République du Rwanda	0	Africa	Eastern Africa	Kinyarwanda,French,English	rw,en,fr	Ruanda,Ruanda,Rwanda,Ruanda,ルワンダ,Rwanda,Ruanda	10537222	-2,30	Rwandan	BDI,COD,TZA,UGA
690	Seychelles	Seychelles	.sc	SC	690	SYC	SCR	248	Victoria	SC,Republic of Seychelles,Repiblik Sesel,République des Seychelles	0.5	Africa	Eastern Africa	French,English,Seychellois Creole	fr,en	Seychellen,Seychelles,Seychelles,Seychelles,セーシェル,Seychellen,Sejšeli	90945	-4.58333333,55.66666666	Seychellois
120	Cameroon	Cameroon	.cm	CM	120	CMR	XAF	237	Yaoundé	CM,Republic of Cameroon,République du Cameroun	0	Africa	Middle Africa	French,English	en,fr	Kamerun,Camerún,Cameroun,Camerun,カメルーン,Kameroen,Kamerun	20386799	6,12	Cameroonian	CAF,TCD,COG,GNQ,GAB,NGA
140	Central African Republic	Ködörösêse tî Bêafrîka	.cf	CF	140	CAF	XAF	236	Bangui	CF,Central African Republic,République centrafricaine	0	Africa	Middle Africa	Sango,French	fr,sg	Zentralafrikanische Republik,República Centroafricana,République centrafricaine,Repubblica Centrafricana,中央アフリカ共和国,Centraal-Afrikaanse Republiek,Srednjoafrička Republika	4616000	7,21	Central African	CMR,TCD,COD,COG,SSD,SDN
148	Chad	Tchad	.td	TD	148	TCD	XAF	235	N'Djamena	TD,Tchad,Republic of Chad,République du Tchad	0	Africa	Middle Africa	French,Arabic	fr,ar	Tschad,Chad,Tchad,Ciad,チャド,Tsjaad,Čad	12825000	15,19	Chadian	CMR,CAF,LBY,NER,NGA,SSD
178	Republic of the Congo	République du Congo	.cg	CG	178	COG	XAF	242	Brazzaville	CG,Congo-Brazzaville	0	Africa	Middle Africa	French	fr,ln	Kongo,Congo,Congo,Congo,コンゴ共和国,Congo [Republiek],Kongo	4448000	-1,15	Congolese	AGO,CMR,CAF,COD,GAB
180	Democratic Republic of the Congo	République démocratique du Congo	.cd	CD	180	COD	CDF	243	Kinshasa	CD,DR Congo,Congo-Kinshasa,DRC	0	Africa	Middle Africa	French	fr,ln,kg,sw,lu	Kongo (Dem. Rep.),Congo (Rep. Dem.),Congo (Rép. dém.),Congo (Rep. Dem.),コンゴ民主共和国,Congo [DRC],Kongo, Demokratska Republika	67514000	0,25	Congolese	AGO,BDI,CAF,COG,RWA,SSD,TZA,UGA,ZMB
226	Equatorial Guinea	Guinea Ecuatorial	.gq	GQ	226	GNQ	XAF	240	Malabo	GQ,Republic of Equatorial Guinea,República de Guinea Ecuatorial,République de Guinée équatoriale,República da Guiné Equatorial	0	Africa	Middle Africa	Spanish,French,Portuguese	es,fr	Äquatorial-Guinea,Guinea Ecuatorial,Guinée-Équatoriale,Guinea Equatoriale,赤道ギニア,Equatoriaal-Guinea,Ekvatorijalna Gvineja	1622000	2,10	Equatorial Guinean	CMR,GAB
266	Gabon	Gabon	.ga	GA	266	GAB	XAF	241	Libreville	GA,Gabonese Republic,République Gabonaise	0	Africa	Middle Africa	French	fr	Gabun,Gabón,Gabon,Gabon,ガボン,Gabon,Gabon	1672000	-1,11.75	Gabonese	CMR,COG,GNQ
204	Benin	Bénin	.bj	BJ	204	BEN	XOF	229	Porto-Novo	BJ,Republic of Benin,République du Bénin	0	Africa	Western Africa	French	fr	Benin,Benín,Bénin,Benin,ベナン,Benin,Benin	10323000	9.5,2.25	Beninese	BFA,NER,NGA,TGO
854	Burkina Faso	Burkina Faso	.bf	BF	854	BFA	XOF	226	Ouagadougou	BF	0	Africa	Western Africa	French	fr,ff	Burkina Faso,Burkina Faso,Burkina Faso,Burkina Faso,ブルキナファソ,Burkina Faso,Burkina Faso	17322796	13,-2	Burkinabe	BEN,CIV,GHA,MLI,NER,TGO
324	Guinea	Guinée	.gn	GN	324	GIN	GNF	224	Conakry	GN,Republic of Guinea,République de Guinée	0	Africa	Western Africa	French	fr,ff	Guinea,Guinea,Guinée,Guinea,ギニア,Guinee,Gvineja	10824200	11,-10	Guinean	CIV,GNB,LBR,MLI,SEN,SLE
384	Ivory Coast	Côte d'Ivoire	.ci	CI	384	CIV	XOF	225	Yamoussoukro	CI,Ivory Coast,Republic of Côte d'Ivoire,République de Côte d'Ivoire	0	Africa	Western Africa	French	fr	Elfenbeinküste,Costa de Marfil,Côte d'Ivoire,Costa D'Avorio,コートジボワール,Ivoorkust,Obala Bjelokosti	22400835	8,-5	Ivorian	BFA,GHA,GIN,LBR,MLI
466	Mali	Mali	.ml	ML	466	MLI	XOF	223	Bamako	ML,Republic of Mali,République du Mali	0	Africa	Western Africa	French	fr	Mali,Mali,Mali,Mali,マリ,Mali,Mali	15302000	17,-4	Malian	DZA,BFA,GIN,CIV,MRT,NER,SEN
562	Niger	Niger	.ne	NE	562	NER	XOF	227	Niamey	NE,Nijar,Republic of Niger,République du Niger	0	Africa	Western Africa	French	fr	Niger,Níger,Niger,Niger,ニジェール,Niger,Niger	17129076	16,8	Nigerian	DZA,BEN,BFA,TCD,LBY,MLI,NGA
686	Senegal	Sénégal	.sn	SN	686	SEN	XOF	221	Dakar	SN,Republic of Senegal,République du Sénégal	0	Africa	Western Africa	French	fr	Senegal,Senegal,Sénégal,Senegal,セネガル,Senegal,Senegal	13567338	14,-14	Senegalese	The Gambia,GIN,GNB,MLI,MRT	French is the official language, but Wolof is widely spoken, as well as Pulaar and several other African langauges. Most people study French in school and many are bilingual.
768	Togo	Togo	.tg	TG	768	TGO	XOF	228	Lomé	TG,Togolese,Togolese Republic,République Togolaise	0	Africa	Western Africa	French	fr	Togo,Togo,Togo,Togo,トーゴ,Togo,Togo	6191155	8,1.16666666	Togolese	BEN,BFA,GHA
312	Guadeloupe	Guadeloupe	.gp	GP	312	GLP	EUR	590	Basse-Terre	GP,Gwadloup	0	Americas	Caribbean	French	fr	Guadeloupe,Guadalupe,Guadeloupe,Guadeloupa,グアドループ,Guadeloupe,Gvadalupa	403355	16.25,-61.583333	Guadeloupian
332	Haiti	Haïti	.ht	HT	332	HTI	HTG,USD	509	Port-au-Prince	HT,Republic of Haiti,République d'Haïti,Repiblik Ayiti	0	Americas	Caribbean	French,Haitian Creole	fr,ht	Haiti,Haiti,Haïti,Haiti,ハイチ,Haïti,Haiti	10413211	19,-72.41666666	Haitian	DOM
474	Martinique	Martinique	.mq	MQ	474	MTQ	EUR	596	Fort-de-France	MQ	0	Americas	Caribbean	French	fr	Martinique,Martinica,Martinique,Martinica,マルティニーク,Martinique,Martinique	394173	14.666667,-61	French
652	Saint Barthélemy	Saint-Barthélemy	.bl	BL	652	BLM	EUR	590	Gustavia	BL,St. Barthelemy,Collectivity of Saint Barthélemy,Collectivité de Saint-Barthélemy	0	Americas	Caribbean	French	fr	Saint-Barthélemy,San Bartolomé,Saint-Barthélemy,Antille Francesi,サン・バルテルミー,Saint Barthélemy,Saint Barthélemy	8938	18.5,-63.41666666	Saint Barthélemy Islander
663	Saint Martin	Saint-Martin	.mf,.fr,.gp	MF	663	MAF	EUR	590	Marigot	MF,Collectivity of Saint Martin,Collectivité de Saint-Martin	0	Americas	Caribbean	French	en,fr,nl	Saint Martin,Saint Martin,Saint-Martin,Saint Martin,サン・マルタン（フランス領）,Saint-Martin,Sveti Martin	77741	18.08333333,-63.95	Saint Martin Islander	SXM,NLD
124	Canada	Canada	.ca	CA	124	CAN	CAD	1	Ottawa	CA	2	Americas	Northern America	English,French	en,fr	Kanada,Canadá,Canada,Canada,カナダ,Canada,Kanada	35158304	60,-95	Canadian	USA	The province of Quebec, with a population of 8 million people, is primarily French speaking.
666	Saint Pierre and Miquelon	Saint-Pierre-et-Miquelon	.pm	PM	666	SPM	EUR	508	Saint-Pierre	PM,Collectivité territoriale de Saint-Pierre-et-Miquelon	0	Americas	Northern America	French	fr	Saint-Pierre und Miquelon,San Pedro y Miquelón,Saint-Pierre-et-Miquelon,Saint-Pierre e Miquelon,サンピエール島・ミクロン島,Saint Pierre en Miquelon,Sveti Petar i Mikelon	6081	46.83333333,-56.33333333	French
254	French Guiana	Guyane française	.gf	GF	254	GUF	EUR	594	Cayenne	GF,Guiana,Guyane	0	Americas	South America	French	fr	Französisch Guyana,Guayana Francesa,Guayane,Guyana francese,フランス領ギアナ,Frans-Guyana,Francuska Gvajana	229040	4,-53		BRA,SUR
422	Lebanon	لبنان	.lb	LB	422	LBN	LBP	961	Beirut	LB,Lebanese Republic,Al-Jumhūrīyah Al-Libnānīyah	0	Asia	Western Asia	Arabic,French	ar,fr	Libanon,Líbano,Liban,Libano,レバノン,Libanon,Libanon	4822000	33.83333333,35.83333333	Lebanese	ISR,SYR
831	Guernsey	Guernsey	.gg	GG	831	GGY	GBP	44	St. Peter Port	GG,Bailiwick of Guernsey,Bailliage de Guernesey	0.5	Europe	Northern Europe	English,French	en,fr	Guernsey,Guernsey,Guernesey,Guernsey,ガーンジー,Guernsey,Guernsey	62431	49.46666666,-2.58333333	Channel Islander
832	Jersey	Jersey	.je	JE	832	JEY	GBP	44	Saint Helier	JE,Bailiwick of Jersey,Bailliage de Jersey,Bailliage dé Jèrri	0.5	Europe	Northern Europe	English,French	en,fr	Jersey,Jersey,Jersey,Isola di Jersey,ジャージー,Jersey,Jersey	97857	49.25,-2.16666666	Channel Islander
56	Belgium	België	.be	BE	56	BEL	EUR	32	Brussels	BE,België,Belgie,Belgien,Belgique,Kingdom of Belgium,Koninkrijk België,Royaume de Belgique,Königreich Belgien	1.5	Europe	Western Europe	Dutch,French,German	nl,fr,de	Belgien,Bélgica,Belgique,Belgio,ベルギー,België,Belgija	11175653	50.83333333,4	Belgian	FRA,DEU,LUX,NLD
250	France	France	.fr	FR	250	FRA	EUR	33	Paris	FR,French Republic,République française	2.5	Europe	Western Europe	French	fr	Frankreich,Francia,France,Francia,フランス,Frankrijk,Francuska	65806000	46,2	French	AND,BEL,DEU,ITA,LUX,MCO,ESP,CHE
442	Luxembourg	Luxembourg	.lu	LU	442	LUX	EUR	352	Luxembourg	LU,Grand Duchy of Luxembourg,Grand-Duché de Luxembourg,Großherzogtum Luxemburg,Groussherzogtum Lëtzebuerg	0	Europe	Western Europe	French,German,Luxembourgish	fr,de,lb	Luxemburg,Luxemburgo,Luxembourg,Lussemburgo,ルクセンブルク,Luxemburg,Luksemburg	537000	49.75,6.16666666	Luxembourger	BEL,FRA,DEU
492	Monaco	Monaco	.mc	MC	492	MCO	EUR	377	Monaco	MC,Principality of Monaco,Principauté de Monaco	0	Europe	Western Europe	French	fr	Monaco,Mónaco,Monaco,Principato di Monaco,モナコ,Monaco,Monako	36136	43.73333333,7.4	Monegasque	FRA
756	Switzerland	Schweiz	.ch	CH	756	CHE	CHE,CHF,CHW	41	Bern	CH,Swiss Confederation,Schweiz,Suisse,Svizzera,Svizra	1.5	Europe	Western Europe	German,French,Italian,Romansh	de,fr,it	Schweiz,Suiza,Suisse,Svizzera,スイス,Zwitserland,Švicarska	8085300	47,8	Swiss	AUT,FRA,ITA,LIE,DEU
540	New Caledonia	Nouvelle-Calédonie	.nc	NC	540	NCL	XPF	687	Nouméa	NC	0.5	Oceania	Melanesia	French	fr	Neukaledonien,Nueva Caledonia,Nouvelle-Calédonie,Nuova Caledonia,ニューカレドニア,Nieuw-Caledonië,Nova Kaledonija	258958	-21.5,165.5	New Caledonian
548	Vanuatu	Vanuatu	.vu	VU	548	VUT	VUV	678	Port Vila	VU,Republic of Vanuatu,Ripablik blong Vanuatu,République de Vanuatu	0	Oceania	Melanesia	Bislama,French,English	bi,en,fr	Vanuatu,Vanuatu,Vanuatu,Vanuatu,バヌアツ,Vanuatu,Vanuatu	264652	-16167	Ni-Vanuatu
258	French Polynesia	Polynésie française	.pf	PF	258	PYF	XPF	689	Papeetē	PF,Polynésie française,French Polynesia,Pōrīnetia Farāni	0	Oceania	Polynesia	French	fr	Französisch-Polynesien,Polinesia Francesa,Polynésie française,Polinesia Francese,フランス領ポリネシア,Frans-Polynesië,Francuska Polinezija	268270	-15,-140	French Polynesian
876	Wallis and Futuna	Wallis et Futuna	.wf	WF	876	WLF	XPF	681	Mata-Utu	WF,Territory of the Wallis and Futuna Islands,Territoire des îles Wallis et Futuna	0.5	Oceania	Polynesia	French	fr	Wallis und Futuna,Wallis y Futuna,Wallis-et-Futuna,Wallis e Futuna,ウォリス・フツナ,Wallis en Futuna,Wallis i Fortuna	13135	-13.3,-176.2	Wallis and Futuna Islander
260	French Southern and Antarctic Lands	Territoire des Terres australes et antarctiques françaises	.tf	TF	260	ATF	EUR		Port-aux-Français	TF	0			French	fr	Französische Süd- und Antarktisgebiete,Tierras Australes y Antárticas Francesas,Terres australes et antarctiques françaises,Territori Francesi del Sud,フランス領南方・南極地域,Franse Gebieden in de zuidelijke Indische Oceaan,Francuski južni i antarktički teritoriji	140	-49.25,69.167	French
504	Morocco	المغرب	.ma	MA	504	MAR	MAD	212	Rabat	MA,Kingdom of Morocco,Al-Mamlakah al-Maġribiyah	0	Africa	Northern Africa	Arabic,Berber	ar	Marokko,Marruecos,Maroc,Marocco,モロッコ,Marokko,Maroko	33087700	32,-5	Moroccan	DZA,ESH,ESP	The official languages of Morocco are Arabic and Berber. French is required in all schools in the country, and in 2012 Morocco had an estimated 10 million French speakers.
12	Algeria	الجزائر	.dz	DZ	12	DZA	DZD	213	Algiers	DZ,Dzayer,Algérie	0	Africa	Northern Africa	Arabic	ar	Algerien,Argelia,Algérie,Algeria,アルジェリア,Algerije,Alžir	37900000	28,3	Algerian	TUN,LDY,NER,ESH,MRT,MLI,MAR
788	Tunisia	تونس	.tn	TN	788	TUN	TND	216	Tunis	TN,Republic of Tunisia,al-Jumhūriyyah at-Tūnisiyyah	0	Africa	Northern Africa	Arabic	ar	Tunesien,Túnez,Tunisie,Tunisia,チュニジア,Tunesië,Tunis	10833431	34,9	Tunisian	DZA,LBY
258	French Polynesia	Polynésie française	.pf	PF	258	PYF	XPF	689	Papeetē	PF,Polynésie française,French Polynesia,Pōrīnetia Farāni	0	Oceania	Polynesia	French	fr	Französisch-Polynesien,Polinesia Francesa,Polynésie française,Polinesia Francese,フランス領ポリネシア,Frans-Polynesië,Francuska Polinezija	268270	-15,-140	French Polynesian
254	French Guiana	Guyane française	.gf	GF	254	GUF	EUR	594	Cayenne	GF,Guiana,Guyane	0	Americas	South America	French	fr	Französisch Guyana,Guayana Francesa,Guayane,Guyana francese,フランス領ギアナ,Frans-Guyana,Francuska Gvajana	229040	4,-53		BRA,SUR
704	Vietnam	Việt Nam	.vn	VN	704	VNM	VND	84	Hanoi	VN,Socialist Republic of Vietnam,Cộng hòa Xã hội chủ nghĩa Việt Nam	1.5	Asia	South-Eastern Asia	Vietnamese	vi	Viêt Nam,Vietnam,Vietnam,Vietnam,ベトナム,Vietnam,Vijetnam	90388000	16.16666666,107.83333333	Vietnamese	KHM,CHN,LAO
418	Laos	ສປປລາວ	.la	LA	418	LAO	LAK	856	Vientiane	LA,Lao,Lao People's Democratic Republic,Sathalanalat Paxathipatai Paxaxon Lao	0	Asia	South-Eastern Asia	Lao	lo	Laos,Laos,Laos,Laos,ラオス人民民主共和国,Laos,Laos	6580800	18,105	Laotian	MMR,KHM,CHN,THA,VNM
116	Cambodia	Kâmpŭchéa	.kh	KH	116	KHM	KHR	855	Phnom Penh	KH,Kingdom of Cambodia	0	Asia	South-Eastern Asia	Khmer	km	Cambodge,Cambodja,Kambodscha,Cambogia,カンボジア,Camboya,Kambodža	15135000	13,105	Cambodian	LAO,THA,VNM
478	Mauritania	موريتانيا	.mr	MR	478	MRT	MRO	222	Nouakchott	MR,Islamic Republic of Mauritania,al-Jumhūriyyah al-ʾIslāmiyyah al-Mūrītāniyyah	0	Africa	Western Africa	Arabic	ar	Mauretanien,Mauritania,Mauritanie,Mauritania,モーリタニア,Mauritanië,Mauritanija	3461041	20,-12	Mauritanian	DZA,MLI,SEN,ESH
	<html>
	<head>
	</head>
	<body>
	<link href="style.css" rel="stylesheet" type="text/css">
	<script src="http://d3js.org/d3.v3.min.js"></script>
	<script src="http://d3js.org/topojson.v1.min.js"></script>
	<script src="http://d3js.org/queue.v1.min.js"></script>

	<div id="theglobe">
	<div id="left">
	<h3>Click on a country name</h3>
	<div id="navigation-container">
	<nav class="navigation">
	<ul id="navigation">
	</ul>
	</nav>
	</div> <!-- #navigation-container -->
	</div> <!-- #left -->
	<div id="globe"></div>
	<div id="right">
	<h2 id="activeName"></h2>
	<p><strong>Official Languages: </strong><p id="activeLanguages"> Loading...</p> </p>
	<p><strong>Population: </strong><p id="activePopulation">Loading...</p></p>
	<p><strong>Note: </strong><br><p id="activeNote">Loading...</p></p>
	</div> <!-- #right -->
	</div> <!-- #theglobe -->

	<script src="tour.js"></script>
	</body>
	html, body {
	height: 100%;
	font: 12px 'Open Sans';
	}
	#theglobe {
	position: relative;
	margin-left: auto;
	margin-right: auto;
	}

	#theglobe h1, #theglobe h2 {
	font-size: 2.3em;
	font-weight: normal;
	}

	#theglobe h3 {
	font-size: 1.4em;
	margin: 0;
	font-weight: bold;
	}

	#header {
	left: 20px ;

	}

	#left
	{
	float: left;
	margin-left: 20px;
	color: rgb(70,70,70);
	}

	#left h3
	{
	margin-top: 10px;
	font-style: bold;
	}

	#navigation {
	position: relative;
	}

	#navigation ul
	{
	margin: 0 ;
	padding: 0 ;
	list-style-type: none ;
	-webkit-padding-start: 0 ;
	}

	#navigation li
	{
	margin: 0.5em 0 0 0 ;
	text-indent: -1.7em ;
	list-style-type: none ;
	color: #bbb ;
	font-size: 1.25em ;
	line-height: .8em ;
	}

	#navigation li a
	{
	display: block ;
	color: rgb(70,70,70) ;
	display: inline ;
	text-decoration: none ;
	}

	#navigation li.active-country a
	{
	color: #46056F ;
	font-weight: bold ;
	}

	#globe {
	float: left;
	z-index: -20;
	}


	#right {
	float: left;
	color: rgb(70,70,70);
	width: 250px;
	}

	#right h2 {
	margin-bottom: 0;
	font-size: 2em;
	}

	#right p {
	margin-top: 0;
	margin-bottom: 0.5em;
	font-size: 1.25em;
	}

	#right a {
	color: #46056F;
	font-weight: bold;
	text-decoration: none;

	}

	body{
	font-family: 'Open Sans', Helvetica, sans-serif;
	}


	#theglobe .globe {
	text-align: left ;
	position: absolute;
	}
	.globe.multipage {
	text-align: left;
	padding: 30px 0 0;
	}
	.globe.multipage .copyright {
	text-align: center;
	}
	var width = 530,
	height = 500;

	var projection = d3.geo.orthographic()
	.scale(248)
	.clipAngle(90)
	.translate([265, 250]);

	var canvas = d3.select("#globe").append("canvas")
	.attr("width", width)
	.attr("height", height);

	var c = canvas.node().getContext("2d");

	var path = d3.geo.path()
	.projection(projection)
	.context(c);


	var activeName = d3.select("#activeName"),
	activeLanguages = d3.select("#activeLanguages")
	activePopulation = d3.select("#activePopulation")
	activeNote = d3.select("#activeNote");

	queue()
	.defer(d3.json, "world-110m.json")
	.defer(d3.csv, "francophonie.csv")
	.await(ready);

	function ready(error, world, names) {

	var globe = {type: "Sphere"},
	land = topojson.feature(world, world.objects.land),
	countries = topojson.feature(world, world.objects.countries).features,
	francophoneCountries = topojson.feature(world, world.objects.countries),
	borders = topojson.mesh(world, world.objects.countries, function(a, b) { return a !== b; }),
	i = -1,
	n = countries.length,
	currentCountry = countries[0],
	priorities = ["France","Canada","Senegal","Morocco","Belgium","Switzerland","Haiti"];

	countries = countries.filter(function(d) {
	return names.some(function(n) {
	if (d.id == n.id) return d.name = n.name;
	});
	}).sort( function(a,b){
	aPriority = priorities.indexOf(a.name);
	bPriority = priorities.indexOf(b.name);
	if (aPriority > -1 && bPriority > -1){
	return aPriority - bPriority;
	}
	else if (aPriority > -1) {
	return -1;
	}
	else if (bPriority > -1) {
	return 1;
	}
	else{
	return a.name < b.name ? -1 : 1;
	};
	});

	francophoneCountries.features = francophoneCountries.features.filter(function(d){
	return names.some(function(n){
	return d.id == n.id;
	})
	});

	d3.select('#navigation').selectAll('li')
	.data(countries)
	.enter().append('li')
	.attr('class', function(d){return "li-" + d.name.replace(/\s+/g, "") ;} )
	.append('a')
	.attr('href', '#')
	.attr('onClick', function(d){return "setCountry(\"" + d.name + "\")";})
	.text(function(d){return "" + d.name;});

	var setCountry = function(dest){
	var cidx= lookUp(dest, countries)
	boldCountryName(dest.replace(/\s+/g, ""));
	setContent(dest, cidx);
	transitionGlobe(dest, cidx);
	return false;
	};

	window.setCountry = setCountry;


	function boldCountryName(dest){
	if (!d3.select('.active-country').empty() ){
	d3.selectAll('.active-country').classed({'active-country': false})}
	d3.select(".li-" + dest).classed({'active-country': true});
	}

	function setContent(dest, cidx){
	country = names[lookUp(dest, names)];
	activeName.text(country["name"])
	activeLanguages.html(generateLinks(country["language"]));
	activePopulation.text(numberWithCommas(country["population"]));
	activeNote.text(country["Note"]);
	}

	function generateLinks(languages){
	langArr = languages.split(",");
	linkArr = langArr.map(function(d){return "<a href=\"http://en.wikipedia.org/wiki/" + d + "_language\" target=\"_blank\">" + d + "</a>";});
	return linkArr.join(", ");
	}

	function numberWithCommas(x) {
	return x.replace(/\B(?=(\d{3})+(?!\d))/g, ",");
	}

	function lookUp(countryName, arr){
	var idx = -1;
	for (i = 0; i < n; i++){
	if (arr[i].name == countryName){
	idx = i;
	return idx;
	}
	}
	return idx;
	}


	function transitionGlobe(dest) {
	d3.transition()
	.duration(1250)
	.each("start", function() {
	})
	.tween("rotate", function() {
	var p = d3.geo.centroid(countries[lookUp(dest, countries)]),
	r = d3.interpolate(projection.rotate(), [-p[0], -p[1]]);
	return function(t) {

	projection.rotate(r(t));
	c.clearRect(0, 0, width, height);
	c.fillStyle = "#a7bc2e", c.beginPath(), path(land), c.fill();
	c.fillStyle = "#BE86FF", c.beginPath(), path(francophoneCountries), c.fill();
	c.fillStyle = "#46056F", c.beginPath(), path(countries[i]), c.fill();
	c.strokeStyle = "#5C7F42", c.lineWidth = .5, c.beginPath(), path(borders), c.stroke();
	c.strokeStyle = "#464646", c.lineWidth = 2, c.beginPath(), path(globe), c.stroke();
	};
	})
	}

	setCountry("Senegal", countries);
	}