-
Notifications
You must be signed in to change notification settings - Fork 2
/
map.html
172 lines (146 loc) · 7.9 KB
/
map.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
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
<!DOCTYPE html>
<!--
____ ____
| _ \ _____ _| _ \ _ __ ___ __ _ _ __ ___ ___ ___ _ _ ___
| | | |/ _ \ \ / / |_) | '__/ _ \ / _` | '__/ _ \/ __/ __|| | | / __|
| |_| | __/\ V /| __/| | | (_) | (_| | | | __/\__ \__ \| |_| \__ \
|____/ \___| \_/ |_| |_| \___/ \__, |_| \___||___/___(_)__,_|___/
|___/
xxxxxxxxxxxxxxxxxxxxxxx
x //x
x xxxxxxxxxxxxxxxxx///x We are volunteers using our skills and expertise
x x x//x to create tech tools to help elect Hillary
x x x//x Clinton and other Democratic and progressive
x x . x//x candidates. We are coders, designers, leaders,
x x __.'.__ x//x writers, mentors, and researchers. Each project
x x '-. .-' x//x we work on focuses on an app, service, data
x x /.'.\ x//x resource, or other technology to advance the
x x ' ' x//x cause. We are a team — join us!
x xxxxxxxxxxxxxxxxx///x
x///////////////////////x http://DevProgress.us
xxxxxxxxxxxxxxxxxxxxxxx
-->
<html lang="en-us">
<head>
<meta charset="UTF-8">
<title>Nomad2016 by DevProgress</title>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" href="src/196favicon.png">
<link rel="stylesheet" type="text/css" href="stylesheets/normalize.css" media="screen">
<link href="https://fonts.googleapis.com/css?family=Montserrat+Alternates:400,700|Roboto:400,900" rel="stylesheet">
<link href='https://fonts.googleapis.com/css?family=Open+Sans:400,700' rel='stylesheet' type='text/css'>
<link rel="stylesheet" type="text/css" href="stylesheets/stylesheet.css" media="screen">
<link rel="stylesheet" type="text/css" href="stylesheets/github-light.css" media="screen">
<script type="text/javascript" src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBDr7SOW5aAcJ-t3ZF4ctxLCGq4ECTYpg4&libraries=places"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/handlebars.js/1.0.0/handlebars.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/tabletop.js/1.4.3/tabletop.js"></script>
<script type="text/javascript" src="src/markerclusterer.js"></script>
<script type="text/javascript" src="./src/mapsheet.js"></script>
<script type="text/javascript" src="./src/fecha.min.js"></script>
<script type-"text/javascript" src="src/app.js"></script>
<script type="text/javascript">
window._chatlio = window._chatlio||[];
!function(){ var t=document.getElementById("chatlio-widget-embed");if(t&&window.ChatlioReact&&_chatlio.init)return void _chatlio.init(t,ChatlioReact);for(var e=function(t){return function(){_chatlio.push([t].concat(arguments)) }},i=["configure","identify","track","show","hide","isShown","isOnline"],a=0;a<i.length;a++)_chatlio[i[a]]||(_chatlio[i[a]]=e(i[a]));var n=document.createElement("script"),c=document.getElementsByTagName("script")[0];n.id="chatlio-widget-embed",n.src="https://w.chatlio.com/w.chatlio-widget.js",n.async=!0,n.setAttribute("data-embed-version","2.1");
n.setAttribute('data-widget-id','40d67bc0-debc-4c55-79af-f92d0927b293');
c.parentNode.insertBefore(n,c);
}();
</script>
<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-85727298-1', 'auto');
ga('send', 'pageview');
</script>
</head>
<body>
<nav class="nav">
<a href="faq.html">Frequently Asked Questions</a>
</nav>
<section class="page-header">
<h1 class="project-name">nomad2016</h1>
<h2 class="project-tagline">Hit the road for Hillary!
<br><br>Search the map by city or zip and filter by departure date. The pins show start location for carpools. <br>Click the pins to see ride details and to ask to join the a ride.
</h2>
</section>
<section class="main-content">
<div id="ride-finder">
<div class="controlblock">
<input id="pac-input" type="text" placeholder="Filter map by city or zip">
</div>
<div class="controlblock">
<h3 id="rides"></h3>
</div>
<div class="controlblock styled-select">
<select id="dateFilter">
<option class= "dateFilter-content" value="">Filter map by date
</select>
</div>
<div id="map"></div>
<p>
Can't find an available ride? <a class="typeform-share" href="https://volunteer2016.typeform.com/to/lcHUg4" data-mode="1" target="_blank">Sign up for the wait list</a>.
<script>(function(){var qs,js,q,s,d=document,gi=d.getElementById,ce=d.createElement,gt=d.getElementsByTagName,id='typef_orm',b='https://s3-eu-west-1.amazonaws.com/share.typeform.com/';if(!gi.call(d,id)){js=ce.call(d,'script');js.id=id;js.src=b+'share.js';q=gt.call(d,'script')[0];q.parentNode.insertBefore(js,q)}})()</script>
</p>
</div>
<script id="popup-template" type="text/x-handlebars-template">
<h3>{{City}}, {{State}} to {{[Destination City]}}</h3>
<dl>
<dt>Pickup</dt><dd>{{[Start location]}}</dd>
<dt>Leaving</dt><dd>{{[Start date]}}, {{[Start time]}}</dd>
<dt>Returning</dt><dd>{{return}}</dd>
<dt>Available seats</dt><dd>{{[Available seats]}}</dd>
</dl>
<br/>
<a id="join-btn" class="btn" href="https://volunteer2016.typeform.com/to/iSl0Kk?rideid={{ID}}&destination={{[Destination City]}}&ridedate={{start}}" target="_blank">Request a seat</a>
</script>
<!-- Okay, time to do this! -->
<script type="text/javascript">
// show the map and switch footers on button click
$('#find-a-ride').click(function(e) {
$(this).addClass('selected');
e.preventDefault();
$('footer.low, #temp-footer').toggle();
$('#ride-finder').fadeTo(250, 1);
})
$(document).ready( function() {
setupDatePicker();
// Make sure the spreadsheet is published!
var published_spreadsheet_url = 'https://docs.google.com/spreadsheets/d/1s6x7JO6-oaAcHsTy3UgCtjzmTL7UPjBBDZIol_3O9FQ/pubhtml';
// Let's get the popup template and compile it using Handlebars
var source = $("#popup-template").html();
var template = Handlebars.compile(source);
var df = function(dateString) {
if (dateString) {
var date = fecha.parse(dateString, 'YYYY-MM-DD HH:mm:ss')
return fecha.format(date, 'MMM Do, h:mma')
} else {
return "n/a"
}
}
// OK, now let's make the map
var map = Mapsheet({
key: published_spreadsheet_url,
element: "map",
markerOptions: {
iconUrl: './src/pin.png'
},
popupTemplate: function(element) {
element.start = df(element['Start date and time'])
element.return = df(element['return date and time'])
return template(element)
},
callback: function(mapsheet, tabletop) {
setMapsheet(mapsheet);
showRides(mapsheet.points.length);
}
});
});
</script>
<footer class="site-footer low">
<span class="site-footer-owner"><a href="https://github.com/DevProgress/nomad2016">Nomad2016</a> is a project made by the volunteers at <a href="https://devprogress.us">DevProgress</a>. We're working hard to help volunteers and supporters around the country get progressive candidates elected.</span>
</footer>
</section>
</body>
</html>