<commit_before><html>
  <head>
    <title>History's Interactive Map</title>
  </head>
  <body>
    <script src="//cdnjs.cloudflare.com/ajax/libs/d3/3.5.3/d3.min.js"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/topojson/1.6.9/topojson.min.js"></script>
    <script src="/datamaps.world.min.js"></script>
    
    <h1>History's Interactive Map</h1>
    <h2>The Long 19th Century</h2>

    <div id="container" style="position: relative; width: 1000px; height: 600px;"></div>
    <script>
        var map = new Datamap({element: document.getElementById('container')});
    </script>
  </body>
</html><commit_msg>Add a few sample events<commit_after><html>
  <head>
    <title>History's Interactive Map</title>
  </head>
  <body>
    <script src="http://cdnjs.cloudflare.com/ajax/libs/d3/3.5.3/d3.min.js"></script>
    <script src="http://cdnjs.cloudflare.com/ajax/libs/topojson/1.6.9/topojson.min.js"></script>
    <script src="./datamaps.world.min.js"></script>
    
	<script src="https://code.jquery.com/jquery-1.12.4.min.js" integrity="<KEY>   crossorigin="anonymous"></script>
	
    <h1>History's Interactive Map</h1>
    <h2>The Long 19th Century</h2>

	
    <div id="container" style="position: relative; width: 1000px; height: 600px;"></div>
	
	
	
	<div id="timeline">
		
	</div>
	
	<script>
	
		//http://datamaps.github.io/
		//https://github.com/markmarkoh/datamaps/blob/master/README.md#getting-started
	
		// Setup all our data
	
		var timelineStart = 1789;
		var timelineEnd = 1914;
		
		var events = [
			{
				name: "<NAME>",
				locations: [{
					latitude: 51.5074,
					longitude: 0.1278
				}],
				radius: 10,
				date: new Date(1837, 06, 20),
				image: "",
				description: "Blah blah blah blah blah",
				tags: ['']
			},
			{
				name: "Event 2",
				locations: [
					{
						latitude: 51.5074,
						longitude: 0.1278
					},
					{
						latitude: -25.2744,
						longitude: 133.7751
					}
				],
				radius: 10,
				date: new Date(1837, 06, 20),
				image: "",
				description: "Blah blah blah blah blah",
				tags: ['']
			},
			{
				name: "Event 3",
				locations: [
					"USA",
					"GBR",
					"AUS",
				],
				radius: 10,
				date: new Date(1837, 06, 20),
				image: "",
				description: "Blah blah blah blah blah",
				tags: ['']
			},
			{
				name: "Event 4",
				locations: [
					"FRA",
					"TRA",
					"FIN",
				],
				radius: 10,
				date: new Date(1837, 06, 20),
				image: "",
				description: "Blah blah blah blah blah",
				tags: ['']
			}
		];
		
		// Calculate the timeline segments
		
		var timeline = [];
		
		var step = 10;
		for (var year = timelineStart; year < timelineEnd; year += step) {
			
			var segment = {
				start: year,
				end: year + step,
				events: []
			};
		
			for (var index = 0; index < events.length; index++) {
				var event = events[index];
				
				if (segment.start < event.date.getFullYear()
					&& segment.end > event.date.getFullYear()) {
					
					segment.events.push(event);
				}
			}
			
			timeline.push(segment);
		}
		
		// Draw stuff on the Screen
		
		var colors = d3.scale.category10();
		
		var map = new Datamap({
			element: document.getElementById('container'),
			fills: {
				defaultFill: "#ABDDA4",
				gt50: colors(Math.random() * 20),
				eq50: colors(Math.random() * 20),
				lt25: colors(Math.random() * 10),
				gt75: colors(Math.random() * 200),
				lt50: colors(Math.random() * 20),
				eq0: colors(Math.random() * 1),
				pink: '#0fa0fa',
				gt500: colors(Math.random() * 1)
			}
		});
		
		for (var index = 0; index < timeline.length; index++) {
			var segment = timeline[index];
			
			var segmentDiv = $('<div class="segment"/>');
			segmentDiv.text(segment.start);
		
			for (var eventIndex = 0; eventIndex < segment.events.length; eventIndex++) {
				var eventInfo = segment.events[eventIndex];
				
				var eventDiv = $('<div class="event"/>');
				eventDiv.text(eventInfo.name);
				
				(function(eventInfo) { 
					eventDiv.click(function(){
						
						var locations = eventInfo.locations;
						if (locations.length == 1) {
						
							var location = locations[0];
						
							map.bubbles([{
								name: eventInfo.name,
								latitude: location.latitude,
								longitude: location.longitude,
								radius: eventInfo.radius,
								fillKey: 'pink'}]);
						} else if (locations.length == 2) {
						
							map.arc([{
								origin: locations[0],
								destination: locations[1]
							}]);
						} else if (locations.length > 2) {
						
							var applyColors = {};
							for (var i = 0; i < locations.length; i++) {
								var countryCode = locations[i];
								
								applyColors[countryCode] = 'pink';
							}

							map.updateChoropleth(applyColors);
						}
					});
				})(eventInfo);
				
				segmentDiv.append(eventDiv);
			}
		
			$("#timeline").append(segmentDiv);
		}
		
	</script>
  </body>
</html>
{'fraction_non_alphanumeric': 0.1698151950718686, 'fraction_numerical': 0.036344969199178644, 'mean_word_length': 2.3500687757909215, 'pattern_counts': {'":': 0, '<': 61, '<?xml version=': 0, '>': 57, 'https://': 2, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '1811575', 'n_tokens_mistral': 2389, 'n_tokens_neox': 1664, 'n_words': 351}