Commit f602ac23 authored by Christopher Barnett's avatar Christopher Barnett
Browse files

beta version initial commit

parents
.idea/
node_modules/
This diff is collapsed.
This diff is collapsed.
@import url('https://fonts.googleapis.com/css?family=Fjalla+One');
body {
font-family: 'Fjalla One', sans-serif;
color: #999;
}
html, body /*, and all other map parent selectors*/
{
height: 100%;
overflow: hidden;
width: 100%;
}
.map-parent /*, and all other map parent selectors*/
{
height: 100%;
overflow: hidden;
}
#map-container {
padding-left: 0;
padding-right: 0;
}
#map {
width: auto;
height: 100%;
margin: 0;
}
div#legend {
background: rgba(0, 0, 0, .3);
border-radius: .5em;
}
div#legend text {
stroke-width: 0;
fill: #999;
}
div#legend line {
stroke-width: 12px;
}
div#legend line.buyer {
stroke: #8c510a;
}
div#legend line.seller {
stroke: #01665e;
}
.navbar-brand {
font-size: 25px;
}
.nav-sidebar {
width: 100%;
padding: 10px;
}
.nav-sidebar a {
-webkit-transition: all 0.08s linear;
-moz-transition: all 0.08s linear;
-o-transition: all 0.08s linear;
transition: all 0.08s linear;
border-radius: 0;
color: #999;
}
/*.nav-sidebar .active a {
cursor: default;
background-color: #428bca;
color: #fff;
text-shadow: 1px 1px 1px #666;
}
.nav-sidebar .active a:hover {
background-color: #428bca;
}*/
.nav-sidebar .text-overflow a,
.nav-sidebar .text-overflow .media-body {
white-space: nowrap;
overflow: hidden;
-o-text-overflow: ellipsis;
text-overflow: ellipsis;
}
/* Right-aligned sidebar */
.nav-sidebar.pull-right {
border-right: 0;
border-left: 1px solid #ddd;
}
.nav-sidebar.pull-right a {
border-radius: 0;
}
.side-content {
padding-top: 20px;
padding-left: 0;
margin-bottom: 0;
}
.details {
padding: 10px;
overflow-y: scroll;
max-height: 500px;
}
.details ul {
list-style: none;
}
.detail-item {
padding-top: 5px;
padding-bottom: 5px;
}
.case-name {
font-size: 1.1em;
color: #ccc;
}
.country-name {
font-size: 1.3em;
color: #ccc;
}
.page-header {
}
\ No newline at end of file
/*!
* Start Bootstrap - The Big Picture (http://startbootstrap.com/)
* Copyright 2013-2016 Start Bootstrap
* Licensed under MIT (https://github.com/BlackrockDigital/startbootstrap/blob/gh-pages/LICENSE)
*/
body {
/* margin-top: 50px;
margin-bottom: 50px;*/
background: #000 no-repeat center center fixed;
color: #888;
}
.full {
background: #000 no-repeat center center fixed;
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover;
}
\ No newline at end of file
This source diff could not be displayed because it is too large. You can view the blob instead.
[
{
"CaseName": "Al Yamamah",
"RID": 1,
"Sellers": "GBR",
"Buyers": "SAU"
},
{
"CaseName": "Angolagate",
"RID": 2,
"Sellers": "BGR",
"Buyers": "AGO"
},
{
"CaseName": "Angolagate",
"RID": 3,
"Sellers": "FRA",
"Buyers": "AGO"
},
{
"CaseName": "Angolagate",
"RID": 4,
"Sellers": "RUS",
"Buyers": "AGO"
},
{
"CaseName": "Angolagate",
"RID": 5,
"Sellers": "SVK",
"Buyers": "AGO"
},
{
"CaseName": "Barak missiles",
"RID": 6,
"Sellers": "ISR",
"Buyers": "IND"
},
{
"CaseName": "Gripen deals",
"RID": 7,
"Sellers": "SWE",
"Buyers": "AUT"
},
{
"CaseName": "Gripen deals",
"RID": 8,
"Sellers": "SWE",
"Buyers": "CZE"
},
{
"CaseName": "Gripen deals",
"RID": 9,
"Sellers": "SWE",
"Buyers": "HUN"
},
{
"CaseName": "Gripen deals",
"RID": 10,
"Sellers": "GBR",
"Buyers": "AUT"
},
{
"CaseName": "Gripen deals",
"RID": 11,
"Sellers": "GBR",
"Buyers": "CZE"
},
{
"CaseName": "Gripen deals",
"RID": 12,
"Sellers": "GBR",
"Buyers": "HUN"
},
{
"CaseName": "Fake Bomb Detectors",
"RID": 13,
"Sellers": "GBR",
"Buyers": "MEX"
},
{
"CaseName": "Fake Bomb Detectors",
"RID": 14,
"Sellers": "GBR",
"Buyers": "IRQ"
},
{
"CaseName": "Fake Bomb Detectors",
"RID": 15,
"Sellers": "GBR",
"Buyers": "THA"
},
{
"CaseName": "Greek submarines",
"RID": 16,
"Sellers": "DEU",
"Buyers": "GRC"
},
{
"CaseName": "Indian VVIP helicopters",
"RID": 17,
"Sellers": "ITA",
"Buyers": "IND"
},
{
"CaseName": "Indian VVIP helicopters",
"RID": 18,
"Sellers": "GBR",
"Buyers": "IND"
},
{
"CaseName": "Korea AW159",
"RID": 19,
"Sellers": "GBR",
"Buyers": "KOR"
},
{
"CaseName": "L’Affaire Karachi",
"RID": 20,
"Sellers": "FRA",
"Buyers": "SAU"
},
{
"CaseName": "L’Affaire Karachi",
"RID": 21,
"Sellers": "FRA",
"Buyers": "PAK"
},
{
"CaseName": "Malaysian submarines",
"RID": 22,
"Sellers": "FRA",
"Buyers": "MYS"
},
{
"CaseName": "Malaysian submarines",
"RID": 23,
"Sellers": "ESP",
"Buyers": "MYS"
},
{
"CaseName": "South African arms deal",
"RID": 24,
"Sellers": "FRA",
"Buyers": "ZAF"
},
{
"CaseName": "South African arms deal",
"RID": 25,
"Sellers": "DEU",
"Buyers": "ZAF"
},
{
"CaseName": "South African arms deal",
"RID": 26,
"Sellers": "ITA",
"Buyers": "ZAF"
},
{
"CaseName": "South African arms deal",
"RID": 27,
"Sellers": "SWE",
"Buyers": "ZAF"
},
{
"CaseName": "South African arms deal",
"RID": 28,
"Sellers": "GBR",
"Buyers": "ZAF"
},
{
"CaseName": "Taiwan Lafayette Frigates",
"RID": 29,
"Sellers": "FRA",
"Buyers": "CHN"
},
{
"CaseName": "Tanzania ATC system",
"RID": 30,
"Sellers": "GBR",
"Buyers": "TZA"
}
]
\ No newline at end of file
This source diff could not be displayed because it is too large. You can view the blob instead.
This diff is collapsed.
"use strict";
var browserify = require("browserify");
var gulp = require("gulp");
var source = require("vinyl-source-stream");
var buffer = require("vinyl-buffer");
var uglify = require("gulp-uglify");
var gutil = require("gulp-util");
gulp.task("javascript", function () {
// set up the browserify instance on a task basis
var b = browserify({
entries: "./js/map.js",
debug: true
});
return b.bundle()
.pipe(source("app.js"))
.pipe(buffer())
// Add transformation tasks to the pipeline here.
.pipe(uglify())
.on("error", gutil.log)
.pipe(gulp.dest("./dist/js/"));
});
\ No newline at end of file
<!DOCTYPE html>
<html lang="en">
<!-- Make sure the <html> tag is set to the .full CSS class. Change the background image in the full.css file. -->
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description" content="">
<meta name="author" content="">
<title>Corrupt Arms Deals</title>
<!-- Bootstrap Core CSS -->
<link href="css/bootstrap.min.css" rel="stylesheet">
<!-- Custom CSS -->
<link href="css/the-big-picture.css" rel="stylesheet">
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
<script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
<![endif]-->
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.0.3/dist/leaflet.css"/>
<link rel="stylesheet" href="css/map.css"/>
<!-- Bootstrap Core JavaScript -->
<script src="dist/js/app.js"></script>
</head>
<body>
<!--
&lt;!&ndash; Navigation &ndash;&gt;
<nav class="navbar navbar-inverse navbar-fixed-bottom" role="navigation">
<div class="container">
&lt;!&ndash; Brand and toggle get grouped for better mobile display &ndash;&gt;
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="navbar-brand" href="#">Corrupt Arms Deals</a>
</div>
&lt;!&ndash; Collect the nav links, forms, and other content for toggling &ndash;&gt;
<div class="collapse navbar-collapse pull-right" id="bs-example-navbar-collapse-1">
<ul class="nav navbar-nav">
<li>
<a href="#">About</a>
</li>
<li>
<a href="#">Contact</a>
</li>
</ul>
</div>
&lt;!&ndash; /.navbar-collapse &ndash;&gt;
</div>
&lt;!&ndash; /.container &ndash;&gt;
</nav>
-->
<!-- Page Content -->
<div id="map-container" class="container-fluid map-parent">
<div class="row map-parent">
<div class="col-sm-9 map-parent">
<div id="map"></div>
</div>
<div class="col-sm-3">
<nav class="nav-sidebar">
<div class="page-header">
<h1><a href="#">Corrupt Arms Deals</a></h1>
</div>
<div class="side-content">
<div class="instructions">
click a country to see details about arms transactions.
</div>
<div class="details">
</div>
</div>
</nav>
</div>
</div>
</div>
<!-- /.container -->
<div id="legend">
<svg width="120" height="55">
<line x1="28" y1="20" x2="40" y2="20" class="seller"/>
<text x="40" y="20" transform="translate(8,4)">Exporters</text>
<line x1="28" y1="40" x2="40" y2="40" class="buyer"/>
<text x="40" y="40" transform="translate(8,4)">Importers</text>
</svg>
</div>
<script type="text/template" id="details-template">
<div class="country-name"><b><%= country %></b></div>
<div id="detail-connections">
<% _.each(connections, function(v, k) { %>
<div class="detail-item">
<ul>
<li class="case-name">
<b><%= k %></b>
</li>
<li>
exporters: <%= v.exporters.join(", ") %>
</li>
<li>
importers: <%= v.importers.join(", ") %>
</li>
<li>
company:
</li>
<li>
year:
</li>
<li>
value of deal:
</li>
<li>
amount of corruption:
</li>
<li>
equipment:
</li>
</ul>
</div>
<% }); %>
</div>
</script>
</body>
</html>
/**
* @author Jawish Hameed <jawish@gmail.com>
* @version 0.1
* @date 20-12-2015
*
*
* Expects the following config:
* var config {
* linkFile = 'data.csv',
* weightMin = 0,
* weightMax = 80,
* lineColorMode = 'fixed', // fixed, random, weight, atoll or a colorname
* lineColorIn = 'red',
* lineColorOut = 'green',
* baseMapProvider = 'esri', // esri, osm
* startLatLng = [3.175, 73.509],
* startZoom = 7
* }
*
*/
var atollLayers = {};
var linkLayers = {};
var atollSelected = null;
// Create map and center around Maldives
var esriMap = L.tileLayer('http://server.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}', {
attribution: 'Tiles &copy; Esri &mdash; Source: Esri, i-cubed, USDA, USGS, AEX, GeoEye, Getmapping, Aerogrid, IGN, IGP, UPR-EGP, and the GIS User Community'
});
var osmMap = L.tileLayer('https://services.arcgisonline.com/ArcGIS/rest/services/Ocean/World_Ocean_Base/MapServer/tile/{z}/{y}/{x}', {
attribution: 'Tiles &copy; Esri &mdash; Source: Esri, i-cubed, USDA, USGS, AEX, GeoEye, Getmapping, Aerogrid, IGN, IGP, UPR-EGP, and the GIS User Community'
});
var watercolor = L.tileLayer('http://c.tile.stamen.com/watercolor/{z}/{x}/{y}.jpg', {
attribution: '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors'
});
var map = L.map('map', {
center: config.startLatLng,
zoom: config.startZoom,
layers: [
(config.baseMapProvider == 'esri') ? esriMap : osmMap
]
});
// Load the atolls GeoJSON file
d3.json('atolls.geojson', function (error, atolls) {
if (error) throw error;
var atollLayer = L.geoJson(atolls, {
onEachFeature: function (feature, layer) {
var atollStyle = {
'opacity': 0.1,
'color': null
};
var immigrants = 0,
emigrants = 0;
layer
.setStyle(atollStyle)
.bindLabel(feature.properties.name, {noHide: true})
.on('mouseover', function () {
this.setStyle({
'opacity': 0.9,
'color': 'white'
});
})
.on('mouseout', function () {
this.setStyle(atollStyle);
})
.on('dblclick', function () {
layer.bindPopup('<p3>' + feature.properties.name + '</p3><br><p4>Immigration: ' + immigrants + '</p4><br><p4>Emigration: ' + emigrants + '</p4>').openPopup();
})
.on('click', function (e) {
layer.closePopup();
for (var linkPath in linkLayers) {
var path = linkPath.split('-');
if (atollSelected != null && atollSelected != path[0]) {
map.addLayer(linkLayers[linkPath].feature);
}
}
if (atollSelected == null || atollSelected != feature.id) {
for (var linkPath in linkLayers) {
var path = linkPath.split('-');
if (feature.id != path[0] && feature.id != path[1]) {
map.removeLayer(linkLayers[linkPath].feature);
}
else {
if (feature.id == path[0]) emigrants += parseInt(linkLayers[linkPath].data.value);
if (feature.id == path[1]) immigrants += parseInt(linkLayers[linkPath