-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathabout.html
118 lines (66 loc) · 5.15 KB
/
about.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
<!--London Info Board by Balazs Sarkadi, 2015. About.-->
<!DOCTYPE html>
<html lang="en">
<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>London Info Board</title>
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<!-- Optional theme -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css">
<link rel="stylesheet" href="css/london.css">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<!-- Bootstrap framework for website layout -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<div class="container">
<div class="page-header">
<h1>London Info Board</h1>
</div>
<ul class="nav nav-pills"><li><a href="index.html">Tube Facility Finder</a></li> <li><a href="prop.html">Property LQI</a></li> <li><a href="gauges.html">Weather Gauges</a></li> <li class="active"><a href="about.html">About</a></ul></li>
<h3>About</h3>
<div class="row">
<div class="col-md-8">
<p><mark>London Info Board</mark> is a collection of web applications created for the <a href="http://www.programmr.com/hired_london_hackathon#entries" target="_blank">Hired.com London Hackathon</a> by <a href="mailto:[email protected]">Balazs Sarkadi</a>.</p>
<p>The website is built on the Bootstrap responsive framework and it supports all device sizes. It contains the following applications: </p>
<p><mark>Tube Facility Finder</mark>: Find facilities such as cash machines, car parks or photo booths on the lines of the London Underground! Choose a line and a facility,
and the app returns the stations with the number of facilities (if available), shows the stations and the selected underground line on the embedded Google map and collects a photo gallery of each station from Flickr (using the Flickr photo search API),
which appears in a pop-up if you click on the station's name. There's also a news ticker about travel incidents at stations.<br/>
The data is provided by <a href="http://www.tfl.gov.uk/info-for/open-data-users/our-open-data" target="_blank">TfL Open Data</a>. Plugins used:<br/>
<li><a href="http://aamirafridi.com/jquery/jquery-marquee-plugin#examples">jQuery Marquee</a> (news ticker)</li>
<li><a href="http://ashleydw.github.io/lightbox/">Ekko Lightbox</a> (photo gallery)</li>
<li><a href="https://github.com/josefvanniekerk/jQuery-xml2json">xml2json</a> (XML to JSON conversion)</li>
<li>Google Maps</li><br/>
<p>This tube facility finder application fills a gap as I haven't found any similar ones, only tube station locators.</p>
</p>
<p><mark>Property LQI</mark>: This web app combines London property listings provided by <a href="http://developer.zoopla.com/" target="_blank">Zoopla API</a> with the Life Quality Index provided by the <a href="https://api.placeilive.com/v1/" target="_blank">PlaceILive.com API</a>.
Picking the best neighborhood is of key importance when renting/buying properties and this app spares the user the research by instantly adding the LQI index to the properties. Properties can be listed
according to postcode disctrict and status (sale/rent) and the results are displayed on the postcode district map of London.<br/>
Plugins used:<br/>
<li><a href="http://ashleydw.github.io/lightbox/">Ekko Lightbox</a> (image pop-up)</li>
<li>Google Maps</li><br/>
</p>
<p><mark>Weather Gauges</mark>: See the latest Air Pollution data, and 3-hourly weather data for the next 5 days by London boroughs displayed on gauges! The gauges are scaled and colored to match
the displayed data. Air pollution data is provided by the <a href="http://www.londonair.org.uk/LondonAir/API/" target="_blank">London Air API</a> while weather data comes from
the <a href="http://www.metoffice.gov.uk/datapoint" target="_blank">Met Office DataPoint</a>. Plugins used:<br/>
<li><a href="http://justgage.com/">JustGage</a> (gauges)</li>
</p>
<p>Presenting these data with gauges is a new, innovative way of instantly letting people know if any of the values reach critical levels.</p>
</div>
<div class="col-md-4">
</div>
</div>
</div> <!-- /container -->
</body>
</html>