-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
479 lines (448 loc) · 22.2 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
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
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
417
418
419
420
421
422
423
424
425
426
427
428
429
430
431
432
433
434
435
436
437
438
439
440
441
442
443
444
445
446
447
448
449
450
451
452
453
454
455
456
457
458
459
460
461
462
463
464
465
466
467
468
469
470
471
472
473
474
475
476
477
478
479
<!doctype html>
<head>
<meta charset="utf-8"/>
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no"/>
<title>NYC Mesh</title>
<link rel="stylesheet" href="./css/style.css"/>
<link rel="stylesheet" href="./css/tachyons.min.css"/>
</head>
<body>
<header>
<div class="flex-ns justify-between items-center pv3 mw8-l mw7 center">
<div class="ph0-ns ph2">
<a class="nowrap dib link" title="Home" href="./">
<p id="logo" class="mh2-ns mh1 ttu tracked f3-ns f4 fw7 di near-black">
NYC MESH
</p>
</a>
</div>
<div id="right-buttons" class="f4-ns pa0-ns pt2 ph0-ns ph2 f5 ttu nowrap overflow-scroll">
<a class="mh2-ns mh1 mv1 dark-gray dib pointer link hover-blue" title="Map" href="./map">
<p class="tracked di">Map</p>
</a>
<a class="mh2-ns mh1 mv1 dark-gray dib pointer link hover-blue" title="FAQ" href="./faq">
<p class="tracked di">FAQ</p>
</a>
<a class="mh2-ns mh1 mv1 dark-gray dib link hover-blue" title="Updates" href="./#updates">
<p class="tracked di">Updates</p>
</a>
<a class="mh2-ns mh1 mv1 fw6 br2 dib link gold" title="Donate" href="./#donate">
<p class="tracked di">Donate</p>
</a>
<a class="mh2-ns mh1 mv1 fw6 br2 dib link blue" title="Join" href="./#join">
<p class="tracked di">Join</p>
</a>
</div>
</div>
</header>
<!-- Splash -->
<div id="splash0" class="relative white-gradientt cover h-50 bg-white">
<div class="white h-100 tc flex items-center justify-center flex-column">
<h1 class="z-9999 bg-blue f2 fw9 pv2 ph3 lh-title bg-blue-500 hg-100 u center">High speed. Low cost. Community owned.</h1>
</div>
</div>
<div class="near-black bg-white f4-ns f5 pv4 ph3 lh-copy flex-ns items-center flex-column">
<p class="measure center">
NYC Mesh is a community owned network.
<a class="link blue" href="/#join">Join our network</a> to replace your current internet connection.
</p>
<p class="measure center">
Our network consists of Wi-Fi router "nodes" and "supernodes" spread throughout the city. The network connects directly to the internet backbone, so we do not rely on an ISP. All of our network nodes cooperate in the distribution of data, and the network can also function independently in case of emergencies or internet shutdown.
</p>
<p class="measure center">
NYC Mesh is a neutral network that does not block or discriminate content. NYC Mesh does not collect, store, monitor, or log any user traffic or content that passes through our network.
</p>
<p class="measure center">
Our ASN is AS395853 and we connect to the DE-CIX internet exchange. Please <a href="mailto:[email protected]" class="link blue">contact us to peer with our network.</a>
</p>
<div class="mv4-ns mv3 mh0 white">
<button class="w4 br2 dib pa0 ma0 mr4 bn bg-blue">
<a class="nowrap dib tc-ns pa3 white link ttu f4-ns f5 fw6" title="Join" href="./#join">
Join
</a>
</button>
<div class="dib ma0 mt3 mt0-ns">
<button class="w4 br2 dib pa0 ma0 mr4 bn bg-gold">
<a class="nowrap dib tc-ns pa3 white br2 link ttu f4-ns f5 fw6" title="Donate" href="./#donate">
Donate
</a>
</button>
</div>
</div>
</div>
<!-- Map -->
<a id="map" class="no-underline" href='./map'>
<div class="bg-map h-33 w-100 cover">
<div class=" white bg-red-75 flex items-center justify-center b-black bw2">
<h2 class="ma0 f3-ns f5 white pv3 ph2 tc">We have over 60 active nodes! View the map.</h2>
</div>
</div>
</a>
<section id="join" class="bg-white near-black center pv3 ph3-ns ph2">
<div class="mw9 center f4 ma3 flex-l justify-center">
<div class="measure f4 ma3-ns pa3-ns ph2 lh-copy center">
<h1 class="lh-title f2-ns f3 fw7">Want to join the mesh?</h1>
<p class="f4-ns f5">
Let us know where you would like to install a node.
We will reach out soon to discuss installation.
If you are tech savvy, consider <a class="blue no-underline" href="/download">installing a node yourself</a>.
</p>
<p class="mid-gray f5 measure lh-copy">Please read our <a class="blue no-underline" href="../faq">FAQ</a> and the <a class="blue no-underline" href="./documents/ncl.pdf">Network Commons License</a> before filling in the Join form.</p>
</div>
<form class="measure f4-ns f5 bg-white br2 ma3-ns shrink-1 center">
<div class="gray overflow-auto">
<div class="fl w-50-l w-100 pa3-ns pa2">
<label for="name" class="f5 b db mb2">Name</label>
<input placeholder="Your Name" type="text" class="input-reset black w-100 bg-near-white ba bw1 b--light-gray br1 pa2"></input>
</div>
<div class="fl w-50-l w-100 pa3-ns pa2">
<label for="phone" class="f5 b db mb2">Phone</label>
<input placeholder="(212) 123-4567" type="tel" class="input-reset w-100 black bg-near-white ba bw1 b--light-gray br1 pa2"></input>
</div>
<div class="fl w-50-l w-100 pa3-ns pa2">
<label for="email" class="f5 b db mb2">Email</label>
<input placeholder="[email protected]" type="email" class="input-reset w-100 black bg-near-white ba bw1 b--light-gray br1 pa2"></input>
</div>
<div class="fl w-50-l w-100 pa3-ns pa2 overflow-hidden">
<label for="panoramas" class="f5 b db mb2 nowrap">View Panorama (optional) <span class="pointer light-silver">?</span></label>
<input tabindex="0" type="file" name="panoramas" id="panoramas" class="inputfile" />
<label for="panoramas" class="dib pointer gray bg-near-white ba bw1 b--light-gray br1 pa2 nowrap truncate"><span>Choose an image</span></label>
</div>
<div class="fl w-100 pa3-ns pa2">
<label for="address" class="f5 b db mb2">Street Address</label>
<input id="autocomplete" placeholder="285 Fulton Street, New York, NY 10007" type="text" class="input-reset w-100 black bg-near-white ba bw1 b--light-gray br1 pa2"></input>
</div>
</div>
<div class="center h1 pa3 pt4 flex items-center justify-center">
<input type="checkbox"></input>
<p class="ml2 mid-gray">I agree to the <a class="blue no-underline" href="./documents/ncl.pdf">Network Commons License</a></p>
</div>
<div class="center h1 pa3 pt4 flex items-center justify-center">
<input type="checkbox"></input>
<p class="ml2 mid-gray">I might have roof access!</p>
</div>
<input class="white bw0 db pa3 ttu fw5 pointer ma4 center br2 bg-blue w4 fw6 dark-gray" type="submit" value="Join">
</form>
</div>
</section>
<section class="bg-purple purple-gradient white pv4 ph3 ">
<div class="f4 lh-copy center ">
<div class="flex center flex-row-ns flex-column items-center-ns justify-center-ns">
<img class="h5 w5 dn db-l pa4" src="./images/meetup.png"></img>
<div class="measure f4-ns f5">
<h1 class="lh-title f2-ns f3 fw7">Get involved!</h1>
<p>Our next meetup is on <time datetime="2017-02-07 19:00" class="b ts">February 7, 7:00 - 8:30 PM</time>.</p>
<p>We will discuss ways you can expand the network. We need help installing on rooftops, organizing neighborhoods and getting funding. Come along and see how your skills can be best put to use.</p>
<p>People from all backgrounds are welcome.</p>
<p><a class="fw6 no-underline light-blue" href="https://www.meetup.com/nycmesh/events/237372981/">Register on Meetup ></a></p>
</div>
</div>
</div>
</section>
<!-- Team -->
<section class="pv4 ph3 bg-near-white">
<h1 class="lh-title f2-ns f3 tc-ns">Meet the team.</h1>
<p class="lh-copy measure center tc-ns f4-ns f5 pa0 ma0">NYC Mesh is a labor of love. All members are unpaid volunteers.</p>
<div class="db flex">
<ul class="list mw8 center pa0 dark-gray">
<li class="fl w-eighth-l w-20-m w-25 pa3-ns pa2">
<img class="br3 w-100" src="./images/team/rb.jpg"></img>
<h2 class="f5-ns f6 tc fw6 pa0 ma0 mv1 pointer">Rachel Boyce</h2>
</li>
<li class="fl w-eighth-l w-20-m w-25 pa3-ns pa2">
<img class="br3 w-100" src="./images/team/cavallo.jpg"></img>
<h2 class="f5-ns f6 tc fw6 pa0 ma0 mv1 pointer">Vinney Cavallo</h2>
</li>
<li class="fl w-eighth-l w-20-m w-25 pa3-ns pa2">
<img class="br3 w-100" src="./images/team/jedahan.jpg"></img>
<h2 class="f5-ns f6 tc fw6 pa0 ma0 mv1 pointer">Jonathan Dahan</h2>
</li>
<li class="fl w-eighth-l w-20-m w-25 pa3-ns pa2">
<img class="br3 w-100" src="./images/team/julien.jpg"></img>
<h2 class="f5-ns f6 tc fw6 pa0 ma0 mv1 pointer">Julien Deswaef</h2>
</li>
<li class="fl w-eighth-l w-20-m w-25 pa3-ns pa2">
<img class="br3 w-100" src="./images/team/winston.jpg"></img>
<h2 class="f5-ns f6 tc fw6 pa0 ma0 mv1 pointer">Winston Ford</h2>
</li>
<li class="fl w-eighth-l w-20-m w-25 pa3-ns pa2">
<img class="br3 w-100" src="./images/team/nonlinear.jpg"></img>
<h2 class="f5-ns f6 tc fw6 pa0 ma0 mv1 pointer">Nicholas Frota</h2>
</li>
<li class="fl w-eighth-l w-20-m w-25 pa3-ns pa2">
<img class="br3 w-100" src="./images/team/zach.jpg"></img>
<h2 class="f5-ns f6 tc fw6 pa0 ma0 mv1 pointer">Zach Giles</h2>
</li>
<li class="fl w-eighth-l w-20-m w-25 pa3-ns pa2">
<img class="br3 w-100" src="./images/team/danjg.jpg"></img>
<h2 class="f5-ns f6 tc fw6 pa0 ma0 mv1 pointer">Daniel Grinkevich</h2>
</li>
<li class="fl w-eighth-l w-20-m w-25 pa3-ns pa2">
<img class="br3 w-100" src="./images/team/bhny.jpg"></img>
<h2 class="f5-ns f6 tc fw6 pa0 ma0 mv1 pointer">Brian Hall</h2>
</li>
<li class="fl w-eighth-l w-20-m w-25 pa3-ns pa2">
<img class="br3 w-100" src="./images/team/samuelhermann.jpg"></img>
<h2 class="f5-ns f6 tc fw6 pa0 ma0 mv1 pointer">Samuel Hermann</h2>
</li>
<li class="fl w-eighth-l w-20-m w-25 pa3-ns pa2">
<img class="br3 w-100" src="./images/team/lisa.jpg"></img>
<h2 class="f5-ns f6 tc fw6 pa0 ma0 mv1 pointer">Lisa Ly</h2>
</li>
<li class="fl w-eighth-l w-20-m w-25 pa3-ns pa2">
<img class="br3 w-100" src="./images/team/robamichael.jpg"></img>
<h2 class="f5-ns f6 tc fw6 pa0 ma0 mv1 pointer">Rob Michael</h2>
</li>
<li class="fl w-eighth-l w-20-m w-25 pa3-ns pa2">
<img class="br3 w-100" src="./images/team/c00w.jpg"></img>
<h2 class="f5-ns f6 tc fw6 pa0 ma0 mv1 pointer">Colin Rice</h2>
</li>
<li class="fl w-eighth-l w-20-m w-25 pa3-ns pa2">
<img class="br3 w-100" src="./images/team/nitinics.jpg"></img>
<h2 class="f5-ns f6 tc fw6 pa0 ma0 mv1 pointer">Nitin Sharma</h2>
</li>
<li class="fl w-eighth-l w-20-m w-25 pa3-ns pa2">
<img class="br3 w-100" src="./images/team/cody.jpg"></img>
<h2 class="f5-ns f6 tc fw6 pa0 ma0 mv1 pointer">Cody Snider</h2>
</li>
<li class="fl w-eighth-l w-20-m w-25 pa3-ns pa2">
<img class="br3 w-100" src="./images/team/ksnieck.jpg"></img>
<h2 class="f5-ns f6 tc fw6 pa0 ma0 mv1 pointer">Kurt Snieckus</h2>
</li>
<li class="fl w-eighth-l w-20-m w-25 pa3-ns pa2">
<img class="br3 w-100" src="./images/team/tatiana.jpg"></img>
<h2 class="f5-ns f6 tc fw6 pa0 ma0 mv1 pointer">Tatiana Tylosky</h2>
</li>
<li class="fl w-eighth-l w-20-m w-25 pa3-ns pa2">
<img class="br3 w-100" src="./images/team/azlyth.jpg"></img>
<h2 class="f5-ns f6 tc fw6 pa0 ma0 mv1 pointer">Peter Valdez</h2>
</li>
</ul>
</div>
</section>
<!-- Donate -->
<section id="donate" class="bt bb b--light-gray bg-white pv4 ph3 f4 near-black">
<h1 class="lh-title f2-ns f3 fw7 tc-ns">We need your help.</h1>
<p class="lh-copy measure center dark-gray f4-ns f5">We are always in need of new hardware to extend the network. If you can afford to help, please do!</p>
<div>
<ul class="list flex-ns pa0 justify-center center overflow-auto t">
<li class="fl pa3-ns pa2 nowrap">
<input id="monthly" type="radio" class="hidden" name="donation-type" value="monthly" checked="checked">
<label for="monthly" class="pointer h2 flex items-center">
<div class="pointer dib bg-near-white ba bw1 b--light-gray h2 w2 tc v-mid br2 check"></div>
<h2 class="pa2 dib f4 fw5">Monthly Donation <span class="f5 b light-silver pointer">?</span></h2>
</label>
</li>
<li class="fl pa3-ns pa2 nowrap">
<input id="one-time" type="radio" class="hidden" name="donation-type" value="one-time">
<label for="one-time" class="pointer flex h2 items-center">
<div class="pointer dib bg-near-white ba bw1 b--light-gray h2 w2 br2 check"></div>
<h2 class="pa2 dib f4 fw5">One-time Donation</h2>
</label>
</li>
</ul>
<div class="overflow-auto mw6 center tc fw5 near-black">
<div class="fl w-third pa3-ns pa2">
<input id="five" type="radio" class="hidden" name="donation" value="5">
<label for="five">
<div class="pointer pa3 bg-near-white ba bw1 b--light-gray br2">
$5
</div>
</label>
</div>
<div class="fl w-third pa3-ns pa2">
<input id="ten" type="radio" class="hidden" name="donation" value="10">
<label for="ten">
<div class="pointer pa3 bg-near-white ba bw1 b--light-gray br2">
$10
</div>
</label>
</div>
<div class="fl w-third pa3-ns pa2">
<input id="twenty" type="radio" class="hidden" name="donation" value="20">
<label for="twenty">
<div class="pointer pa3 bg-near-white ba bw1 b--light-gray br2">
$20
</div>
</label>
</div>
<div class="fl w-third pa3-ns pa2">
<input id="fifty" type="radio" class="hidden" name="donation" value="50">
<label for="fifty">
<div class="pointer pa3 bg-near-white ba bw1 b--light-gray br2">
$50
</div>
</label>
</div>
<div class="fl w-third pa3-ns pa2">
<input id="hundred" type="radio" class="hidden" name="donation" value="100">
<label for="hundred">
<div class="pointer pa3 bg-near-white ba bw1 b--light-gray br2 fw5">
$100
</div>
</label>
</div>
<div class="fl w-third pa3-ns pa2">
<input id="custom" type="radio" class="hidden" name="donation" value="custom">
<label for="custom">
<!-- <div class="pointer pa3 bg-near-white ba bw1 b--light-gray br2">
$100
</div> -->
<input placeholder="$" value="$" type="text" class="relative input-reset fw5 tc w-100 bg-near-white ba bw1 b--light-gray br1 pa3"></input>
</label>
</div>
</div>
<div class="mw6 center tc">
<div class="pv3 ph3-ns ph2 w-third-ns w-100 center">
<button class="w-100 br2 dib pa0 ma0 bn bg-gold">
<a class="nowrap dib tc-ns pa3 white br2 link ttu f4-ns f5 fw6" title="Join" href="./#donate">
Donate
</a>
</button>
</div>
</div>
<p class="lh-copy ph2 f5 serif gray measure center">
All funds will go towards operational expenses and are sponsored by our fiscal partner, ISOC-NY.
</p>
</div>
</section>
<section class="bg-light-yellow pv3 tc">
<p class="f4 fw5 measure center tc">Questions? Please email us. <a class="f3 no-underline dark-blue b" href="mailto:[email protected]">[email protected]</a></p>
</section>
<section id="updates" class="bg-near-black f5 near-white pv4 ph3">
<div class="f5 mw8 center flex-ns justify-center">
<div class="fl-ns w-25-ns w-100 ph3-ns pa0">
<h2 class="fw5 f4">Blog</h2>
<ul class="list pa0 ma0 f6">
<li class="mv2">
<time class="light-silver fw3 lh-title">February 17, 2017</time>
<h3 class="fw4 ma0 mv1"><a href="#" class="light-blue no-underline lh-title">Install Info</a></h2>
</li>
<li class="mv4">
<time class="light-silver fw3 lh-title">February 6, 2017</time>
<h3 class="fw4 ma0 mv1"><a href="#" class="light-blue no-underline lh-title">Presentations</a></h2>
</li>
<li class="mv4">
<time class="light-silver fw3 lh-title">February 3, 2017</time>
<h3 class="fw4 ma0 mv1"><a href="#" class="light-blue no-underline lh-title">Ethernet</a></h2>
</li>
</ul>
</div>
<div class="fl-ns w-25-ns w-100 ph3-ns pa0">
<h2 class="fw5 f4">Press</h2>
<ul class="list pa0 ma0 f6">
<li class="mv2">
<time class="light-silver fw3 lh-title">Motherboard</time>
<h3 class="fw4 ma0 mv1"><a href="https://motherboard.vice.com/en_us/article/how-a-diy-network-plans-to-subvert-time-warner-cables-nyc-internet-monopoly" class="light-blue no-underline lh-title">How a DIY Network Plans to Subvert Time Warner Cable's NYC Internet Monopoly</a></h2>
</li>
<li class="mv4">
<time class="light-silver fw3 lh-title">Downtown Express</time>
<h3 class="fw4 ma0 mv1"><a href="http://www.downtownexpress.com/2016/01/12/hooking-up-downtown-with-free-resilient-wi-fi/" class="light-blue no-underline lh-title">Hooking up Downtown with Free, Resilient <span class="nowrap">Wi-Fi</span></a></h2>
</li>
<li class="mv4">
<time class="light-silver fw3 lh-title">Fast Company</time>
<h3 class="fw4 ma0 mv1"><a href="https://www.fastcompany.com/3044686/mesh-networks-and-the-local-internet-movement" class="light-blue no-underline lh-title">Why Communities are Building an Internet that's More Local</a></h2>
</li>
</ul>
</div>
<div class="fl-ns w-50-ns w-100 ph3-ns pa0 overflow-auto">
<h2 class="fw5 f4">Videos</h2>
<ul class="list pa0 ma0 f6">
<li class="fl w-50 pr3 mv0-ns">
<time class="light-silver fw3 lh-title">February 7, 2017 Meetup</time>
<a class="mt1 db " href="https://www.youtube.com/watch?v=0vsiI3accB8"><img class="w-100 ma0 pa0 br1 mv1" src="./images/video1.jpg"></img></a>
<h3 class="fw4 ma0"><a href="https://www.youtube.com/watch?v=0vsiI3accB8" class="light-blue no-underline lh-title">How to help build our network</a></h2>
</li>
<li class="fl w-50 pr3 mv0-ns">
<time class="light-silver fw3 lh-title">January 10, 2017 Meetup</time>
<a class="mt1 db " href="https://www.youtube.com/watch?v=p2QQjIfvGgA"><img class="w-100 ma0 pa0 br1 mv1" src="./images/video2.jpg"></img></a>
<h3 class="fw4 ma0"><a href="https://www.youtube.com/watch?v=p2QQjIfvGgA" class="light-blue no-underline lh-title">Building a community owned network</a></h2>
</li>
</ul>
</div>
</div>
<div class="pa4-ns pv4">
<form class="bg-dark-gray mw6-ns center pa4 br2">
<fieldset class="cf bn ma0 pa0">
<legend class="pa0 f4 mb3 white">Stay updated! Subscribe to our newsletter.</legend>
<div class="cf">
<label class="clip" for="email-address">Email Address</label>
<input class="f5 input-reset bn fl black-80 bg-near-white pa3 lh-solid w-100 w-75-ns br2 br--left-ns" placeholder="Your Email Address" type="text" name="email-address" value="" id="email-address">
<input class="f5 ttu button-reset fl pv3 tc bn bg-animate bg-green hover-bg-dark-green white pointer w-100 mv3 mv0-ns w-25-ns br2 br--right-ns" type="submit" value="Subscribe">
</div>
</fieldset>
</form>
</div>
</section>
<footer class="bg-black flex-ns justify-between items-center white ph3 ph5-ns pv4 pv5-ns">
<div class="f4 ttu fw7">
<a class="mh2-ns mh1 pa0 near-white pointer link hover-blue" title="Map" href="./map">
<p class="tracked di">Map</p>
</a>
<a class="mh2-ns mh1 pa0 near-white pointer link hover-blue" title="FAQ" href="./faq">
<p class="tracked di">FAQ</p>
</a>
<a class="mh2-ns mh1 pa0 near-white pointer link hover-blue" title="Join" href="mailto:[email protected]">
<p class="tracked di">Contact</p>
</a>
<a class="mh2-ns mh1 pa0 gold pointer link hover-blue" title="Donate" href="./donate">
<p class="tracked di">Donate</p>
</a>
<a class="mh2-ns mh1 pa0 blue pointer link hover-blue" title="Join" href="./join">
<p class="tracked di">Join</p>
</a>
</div>
<div class="flex items-center j">
<!-- <span class="f5 measure tr">This project was made possible in part by a grant from the Internet Society.</span>
<img class="h2 o-60 ml4" src="./images/isoc-logo.png"></img> -->
<p id="logo" class="mh2-ns mh1 ttu tracked f3 fw7 di near-white">
NYC MESH
</p>
</div>
</footer>
<script>
var inputs = document.querySelectorAll( '.inputfile' );
Array.prototype.forEach.call( inputs, function( input )
{
var label = input.nextElementSibling,
labelVal = label.innerHTML;
input.addEventListener( 'change', function( e )
{
var fileName = '';
if( this.files && this.files.length > 1 )
fileName = ( this.getAttribute( 'data-multiple-caption' ) || '' ).replace( '{count}', this.files.length );
else
fileName = e.target.value.split( '\\' ).pop();
if( fileName )
label.querySelector( 'span' ).innerHTML = fileName;
else
label.innerHTML = labelVal;
});
});
</script>
<script>
var map, autocomplete, marker;
function initMap() {
var search = document.getElementById('autocomplete')
autocomplete = new google.maps.places.Autocomplete(
search,
{types: ['geocode']});
// autocomplete.addListener('place_changed', fillInAddress);
}
function fillInAddress() {
var place = autocomplete.getPlace();
console.log(place)
if (place.formatted_address) {
var val = place.formatted_address;
var search = document.getElementById('autocomplete')
search.value = val;
console.log(place)
map.setCenter(place.geometry.location)
map.setZoom(17)
marker.setPosition(place.geometry.location)
}
}
</script>
<script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyBNClp7oJsw-eleEoR3-PQKV23tpeW-FpE&libraries=places&callback=initMap"
async defer></script>
</body>