forked from sdn4nigeria/monitoring-platform
-
Notifications
You must be signed in to change notification settings - Fork 3
/
index.html
137 lines (132 loc) · 6.79 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
---
layout: default
class: frontpage
---
<div id='load'></div>
<div id='map'></div>
<div class='intro'>
<div class=''>
<div id='intro-text' class='about-text'>
<div id='incident-report-form-container'></div>
<div id='tooltip'>
<h2>View the latest information on oil spills in Nigeria</h2>
<p>Data from the National Oil Spill Detection and Response Agency (NOSDRA) database.</p>
<!--p>NOSDRA is working hard to improve the integrity of this data, but relies heavily on the oil companies to supply information and update this regularly.</p>
<p>NOSDRA hopes this new initiative will improve the monitoring and tracking of oil spills in Nigeria, acknowledges that this data may be incomplete or inaccurate, and is working to improve this situation.</p>
<p><a href="http://sdn4nigeria.github.com/monitoring-platform/about/">Read more about the historical difficulties in monitoring oil spills Nigeria.</a></p-->
<p>Hover over a spill incident on the map and the details will appear here.</p>
</div>
<div id='toggle-incident-report-form' style='text-align:center;clear:both;margin-top:6px'>
<button onclick='toggleIncidentReportForm()'>Report/update spill</button>
</div>
<br/>
</div>
<div id='base-select'>
<ul class='bottomlayer'>
<li><a class='active first' id='nigeriaoil.map-g3s2rdj8' href='#'>Sat</a></li>
<li><a class='last' id='nigeriaoil.map-5ustxk97' href='#'>Reg</a></li>
</ul>
</div>
<div id='context-layers'>
<b>Layers:</b>
<ul>
<li><a href='#' id='lgas'>LGAs</a></li>
<li><a href='#' id='wetlands'>Wetlands</a></li>
<li><a href='#' id='settlements'>Settlements</a></li>
</ul>
</div>
<div id='oil-legend'>
<b>Key:</b>
<div style='height: 20px; margin-top: 0px'>
<h4 style='font-size: 11px; margin: 0;'>Company Spills</h4>
</div>
<div class='point black legend'></div>
<div style ='height: 20px; margin-top: 30px; border-top: 1px solid #ccc'>
<h4 style='font-size: 11px; margin: 0;'>Third party spills</h4>
</div>
<div class='point legend'></div>
<!-- div id='spill-count' style='margin-top: 30px; border-top: 1px solid #ccc'>
<h4 style='font-size: 11px; margin: 0;'>Number of Spills: <span id='spill-number' class='count'></span></h4>
</div -->
<div style ='height: 20px; margin-top: 30px; border-top: 1px solid #ccc'>
<h4 style='font-size: 11px; margin: 0;'>Cleaned-up spills</h4>
</div>
<div class='point cleanedup legend'></div>
<div style ='height: 20px; margin-top: 30px; border-top: 1px solid #ccc'>
<h4 style='font-size: 11px; margin: 0;'>Unverified spills</h4>
</div>
<div class='point unverified legend' style='background-position:0 0 !important'></div>
</div>
<div id='timelinks'>
<div class='stage'>
<div class='filter'>
<div class='map-limiter'>
<ul id='dropdown-companies' class='dropdown'>
<li>Select company:
<a href='#' data-toggle='dropdown' class='icon dropdown-toggle'><span id='company-count' class='count'></span></a>
<span class='arrow'> </span>
<ul id='company-menu' class='dropdown-menu'>
</ul>
</li>
</ul>
<ul id='dropdown-years' class='dropdown'>
<li>Select year:
<a href='#' data-toggle='dropdown' class='icon dropdown-toggle'><span id='year-count' class='count'></span></a>
<span class='arrow'> </span>
<ul id='year-menu' class='dropdown-menu'>
</ul>
</li>
</ul>
<div>
Select months:
<div id='options'> </div>
</div>
<div>Showing <b><span id='spill-number' class='count'>--</span> spills</b> in this period.<br/>Include <b>unverified</b> reports: <input type="checkbox" id="show-unverified-reports"/>, <b>cleaned-up</b> spills: <input type="checkbox" id="show-cleaned-up-spills"/></div>
</div>
</div>
</div>
<!-- <p id='options-explain' class='small-text'>The values shown for spill count and oil spilled January 2012 were calculated using the sample NOSDRA oil spill databases. The spill count and Oil Spilled values should not be interpreted as signifying the total number of oil spills or total oil spilled</p> -->
</div>
</div>
</div>
<!--div class='limiter clearfix'><div class='graphs'></div></div-->
<div id='contribute'>
<div class='limiter clearfix' style='text-align:center;font-size:13px;line-height:14px;'>
<p>All data displayed on this page is the joint reponsibility of NOSDRA, the appropriate oil company, and local community representatives to maintain and update.</p> <p>If you have a query relating to a specific spill please submit an update. To report a new spill to NOSDRA please submit a spill report. You may also wish to <a href="about/">find out more</a> about the processes involved in reporting, monitoring, and cleaning up oil spills in Nigeria.</p>
</div>
</div>
<script type="text/javascript">
$(document).ready(function () {
$('.dropdown-toggle').dropdown();
});
</script>
<script type='text/template' id='popupNosdra'>
<div class='marker-popups'>
<!-- db.* fields come directly from the database,
other fields are computed in site.js -->
<div class="int-spillid">ID: <%=identifier %></div>
<h3 class="int-location"><%=db("sitelocationname") %></h3>
LGA: <b><%=db("lga") %></b></br>
Status: <b><%=db("status") %></b></br>
<h3 class="int-spillamount"><%=quantity %>
barrels spilled due to <%=cause %>
</h3>
Date: <b><%=db("incidentdate") %></b></br>
Date spill stopped: <b><%=db("datespillstopped") %></b></br>
Company: <b><%=db("company") %></b></br>
Initial containment measures: <b><%=db("initialcontainmentmeasures") %></b></br>
Type of contaminant: <b><%=contaminant %></b></br>
Estimated spill area: <b><%=db("estimatedspillarea") %></b></br>
Spill area habitat: <b><%=habitat %></b></br>
Impact: <b><%=db("impact") %></b></br>
Description of impact: <b><%=db("descriptionofimpact") %></b></br>
Datejiv: <b><%=db("datejiv") %></b></br>
Date clean up: <b><%=db("datecleanup") %></b></br>
Date clean up completed: <b><%=db("datecleanupcompleted") %></b></br>
Methods used: <b><%=db("methodsofcleanup") %></b></br>
Date of post clean up inspection: <b><%=db("dateofpostcleanupinspection") %></b></br>
Date of post impact assessment: <b><%=db("dateofpostimpactassessment") %></b></br>
Further remediation: <b><%=db("furtherremediation") %></b></br>
Date of certificate: <b><%=db("datecertificate") %></b>
</div>
</script>