forked from skyrossm/np-gangmap
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
112 lines (102 loc) · 3.81 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
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>NoPixel Territory Map</title>
<link rel="stylesheet" href="//fonts.googleapis.com/css?family=Roboto:400,100,300,500">
<link href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<link rel="stylesheet" href="fontawesome/css/font-awesome.css">
<link rel="stylesheet" href="style.css">
<script src="js/libs/jquery-min.js"></script>
<script src="js/libs/underscore-min.js"></script>
<script src="js/libs/backbone-min.js"></script>
<script src="js/libs/handlebars.js"></script>
<script src="//www.google.com/jsapi"></script>
<script src="//maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<script src="js/app.js"></script>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no" />
</head>
<body>
<header>
<p class="left" style="padding-top: 5px;"><a href="">NoPixel Territory Map</a></p>
<ul class="right">
<a href="#" class="btn btn-primary" onclick="map.setMapTypeId('Atlas');">Atlas</a>
<a href="#" class="btn btn-primary" onclick="map.setMapTypeId('Satellite');">Satellite</a>
<a href="#" class="btn btn-primary" onclick="map.setMapTypeId('Road');">Road</a>
</ul>
</header>
<div id="tour-nav">
<a href="#" class="left">« <span id="tour-prev"></span></a>
<h3>Territory Tour</h3>
<a href="#" class="right"><span id="tour-next"></span> »</a>
</div>
<div id="map" style="background:#1862ad;"></div>
<div id="tour-info"></div>
<script type="x/template" id="categoriesTemplate">
{{#each categories}}
<section class="type">
<h3>{{name}}</h3>
<ul>
{{#each types}}
<li><label><input type="checkbox" {{#if enabled}}checked{{/if}} value="{{name}}"> <img src="{{assetsUrl}}icons/{{icon}}"> {{name}}</label> <a href="#" class="details" data-name="{{name}}"><i class="icon-chevron-sign-right"></i></a> <!--<a href="#tour" class="tt"></a>--></li>
{{/each}}
</ul>
</section>
{{/each}}
</script>
<script type="x/template" id="categoryDetailsTemplate">
<section class="type">
<h3><a href="#" class="back details"><i class="icon-chevron-sign-left"></i></a> {{type.name}}</h3>
<ul>
{{#each locations}}
<li data-id="{{id}}"><label>{{title}}</label></li>
{{/each}}
</ul>
</section>
</script>
<script type="x/template" id="markerPopupTemplate2">
<div id="info-window" style="max-width:420px;">
<div class="scrollable">
<span class="header">
<h3>{{title}}</h3>
</span>
<div id="info-body">
{{#if notes}}
<br>
<p>{{notes}}</p>
{{/if}}
{{#if video}}
<div class="video-{{id}}">
<br>
<h4>Video</h4>
<div class="youtubewrapper">
<iframe width="100%" src="//www.youtube.com/embed/{{video.yt_id}}?theme=light&autoplay=1&autohide=1&iv_load_policy=3&rel=0&showinfo=0&loop=1{{#if video.start}}&start={{timestampToSeconds video.start}}{{/if}}{{#if video.end}}&end={{timestampToSeconds video.end}}{{/if}}" frameborder="0" allowfullscreen></iframe>
</div>
{{#if video.yt_user}}
<p>
<a href="//www.youtube.com/user/{{video.yt_user}}" style="color:#222;font-size:.8em;float:right;" target="_blank">
Video by {{video.yt_user}}
</a>
</p>
{{/if}}
</div>
{{/if}}
{{#if images}}
<br>
<h4>Images</h4>
{{/if}}
{{#each images}}
<div class="image-{{id}}">
<span>{{headline}}</span>
<img src="{{url}}" class="image-{{id}}">
</div>
<br>
{{/each}}
</div>
</div>
</div>
</script>
<div id="typeDetails" class="types"></div>
<div id="types" class="types"></div>
</body>
</html>