-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
136 lines (126 loc) · 6.65 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
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
<link rel='stylesheet' href='http://code.jquery.com/mobile/1.4.0/jquery.mobile-1.4.0.min.css' />
<script src='http://code.jquery.com/jquery-1.10.2.min.js'></script>
<script src='http://code.jquery.com/mobile/1.4.0/jquery.mobile-1.4.0.min.js'></script>
</head>
<body>
<div data-role="page">
<div id='header' data-role="header">
<img src="tinataWide.png" id="logo">
<form id='input'>
<input id="pre-rendered-filterable" data-type="search">
</form>
<div
class="ui-controlgroup ui-controlgroup-vertical ui-corner-all"
data-role="controlgroup"
data-filter="true"
data-input="#pre-rendered-filterable"
data-filter-reveal="true"
data-enhanced="true">
<div class="ui-controlgroup-controls" id='options'>
</div>
</div>
</div>
<div id="content" data-role="content" class="ui-content" role="main">
<div data-role="controlgroup">
<strong>Country Name:</strong>
<span id='countryName'></span><br />
<strong>Demonym:</strong>
<span id='demonym'></span><br />
</div>
<div data-role="collapsible-set">
<div data-role="collapsible" data-collapsed="false">
<h3>Information</h3>
<p id="info"></p>
</div>
<div data-role="collapsible">
<h3>Warnings</h3>
<p id="warnings"></p>
</div>
<div data-role='collapsible'>
<h3>Feedback to FCO</h3>
<form action="demo_form.asp" autocomplete="on">
Name:<input type="text" name="fname"><br>
Suggestion for FCO Data: <textarea></textarea><br>
E-mail: <input type="email" name="email" autocomplete="off"><br>
<input type="submit" value='Submit'>
</form>
</div>
</div>
<div id="splash">
<img src="tinataSquare.png" id="tinataSquare">
<p id="about">"This Is Not A Travel App" -TINATA</p>
</div>
</div>
</div>
</body>
<style>
#input{
position:absolute;
right:0px;
top:0px;
margin-top:3%;
margin-right:2%;
width:45%;
}
#tinataSquare {
width:50%;
margin-left:25%;
margin-top:40%;
}
#splash {
position:absolute;
top:0;
left:0;
height:100%;
width:100%;
background-color:#222;
}
#header {
z-index:10;
}
#about {
width:80%;
margin-left:10%;
margin-top:20%;
color:white;
font-weight:bold;
text-align:center;
}
#options {
text-alight:center;
}
#logo {
width:40%;
margin-left:1%;
margin-top:7%;
}
</style>
<script>
$.get("http://api.tinata.co.uk/countries/",function(getData){if(getData){localStorage.tinataData=JSON.stringify(getData)}else if(!localStorage.tinataData&&!getData){alert('Sorry, But you must have internet access on first launch');data=JSON.parse(localStorage.tinataData);}})
data=JSON.parse(localStorage.tinataData);
$(data).map(function(index){$('<a>').addClass('ui-screen-hidden country').appendTo($('#options')).text(this.name).attr({'data-role':'button','index':index}).click(function(){$('#warnings').html('');$('#info').html('');
$('#options').hide();
$('#splash').animate({'opacity':0},500,function(){$(this).remove()});
if(data[$(this).attr('index')].name){$('#countryName').html(data[$(this).attr('index')].name)}
if(data[$(this).attr('index')].nameForCitizen){$('#demonym').html(data[$(this).attr('index')].nameForCitizen)}
if(data[$(this).attr('index')].ukConsularData.drugArrests){$('<div>').html('<strong>Drug Arrests: </strong>'+data[$(this).attr('index')].ukConsularData.drugArrests).appendTo($('#info'))}
if(data[$(this).attr('index')].ukConsularData.hospitalizations){$('<div>').html('<strong>Hospitalizations: </strong>'+data[$(this).attr('index')].ukConsularData.hospitalizations).appendTo($('#info'))}
if(data[$(this).attr('index')].ukConsularData.lostPassport){$('<div>').html('<strong>Passport Losses/Theft: </strong>'+data[$(this).attr('index')].ukConsularData.lostPassport).appendTo($('#info'))}
if(data[$(this).attr('index')].ukConsularData.totalConsularAssistance){$('<div>').html('<strong>Total Consular Assistance Requested: </strong>'+data[$(this).attr('index')].ukConsularData.totalConsularAssistance).appendTo($('#info'))}
if(data[$(this).attr('index')].ukConsularData.rapes){$('<div>').html('<strong>Rape Cases: </strong>'+data[$(this).attr('index')].ukConsularData.rapes).appendTo($('#info'))}
if(data[$(this).attr('index')].ukConsularData.sexualAssault){$('<div>').html('<strong>Sexual Assault Cases: </strong>'+data[$(this).attr('index')].ukConsularData.sexualAssault).appendTo($('#info'))}
if(data[$(this).attr('index')].ukConsularData.deaths){$('<div>').html('<strong>Total Deaths: </strong>'+data[$(this).attr('index')].ukConsularData.deaths).appendTo($('#info'))}
if(data[$(this).attr('index')].ukConsularData.visitors){$('<div>').html('<strong>Number of Visitors in 2012: </strong>'+data[$(this).attr('index')].ukConsularData.visitors).appendTo($('#info'))}
if(data[$(this).attr('index')].travelAdvice.nhsTravelAdviceUrl){$('<a>').attr('href',(data[$(this).attr('index')].travelAdvice.nhsTravelAdviceUrl)).html('<strong>NHS Travel Advice</strong><br />').appendTo($('#warnings'))}
if(data[$(this).attr('index')].travelAdvice.fcoTravelAdviceUrl){$('<a>').attr('href',(data[$(this).attr('index')].travelAdvice.fcoTravelAdviceUrl)).html('<strong>FCO Travel Advice</strong>').appendTo($('#warnings'))};
if(data[$(this).attr('index')].humanRights.lgbt){$('<div>').html('<h3>LGBT:</h3><strong>Death Penalty: </strong>'+data[$(this).attr('index')].humanRights.lgbt.deathPenalty+'<br /><strong>Imprisonment: </strong>'+data[$(this).attr('index')].humanRights.lgbt.imprisonment+'<br /><strong>Persecution: </strong>'+data[$(this).attr('index')].humanRights.lgbt.persecution
).appendTo($('#warnings'))}
if(data[$(this).attr('index')].humanRights){$('<div>').html('<h3>Human Rights:</h3><strong>Physical Abuses: </strong>'+data[$(this).attr('index')].humanRights.physicalAbuses+'<br /><strong>Disappearances: </strong>'+data[$(this).attr('index')].humanRights.disapperances+'<br /><strong>Political Imprisonment: </strong>'+data[$(this).attr('index')].humanRights.politicalImprisonment+'<br /><strong>Restrictions On Freedom Of Speech: </strong>'+data[$(this).attr('index')].humanRights.restrictionsOnFreedomOfSpeech+'<br /><strong>Restrictions On Movement: </strong>'+data[$(this).attr('index')].humanRights.restrictionsOnMovement+'<br /><strong>Restrictions On Womens Rights: </strong>'+data[$(this).attr('index')].humanRights.restrictionsOnWomensRights
).appendTo($('#warnings'))}
})});
$('#input').focusin(function(){$('#options').show()});
</script>
</html>