projects / lantea.git / blame_incremental
? search:
summary | shortlog | log | commit | commitdiff | tree
blob | blame (non-incremental) | history | HEAD
switch to matomo domain as well
[lantea.git] / index.html
... / ...
CommitLineData
1<!-- This Source Code Form is subject to the terms of the Mozilla Public
2 - License, v. 2.0. If a copy of the MPL was not distributed with this file,
3 - You can obtain one at http://mozilla.org/MPL/2.0/. -->
4
5<!DOCTYPE html>
6<html manifest="manifest.appcache">
7<head>
8 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
9 <!-- try to force a 1:1 scaling and disable pinch-zoom on mobile, see
10 https://developer.mozilla.org/en/Mobile/Viewport_meta_tag -->
11 <meta name="viewport" content="width=device-width, height=device-height, initial-scale=1, maximum-scale=1, user-scalable=no">
12 <title>Lantea Maps</title>
13 <script src="js/map.js"></script>
14 <script src="js/ui.js"></script>
15 <script src="js/library.js"></script>
16 <script src="js/piwik.js" async="" defer=""></script>
17 <link rel="stylesheet" href="style/lantea.css">
18 <link rel="manifest" href="/pwa.manifest">
19 <link rel="shortcut icon" href="style/lanteaIcon16.png" type="image/png">
20</head>
21<body id="body">
22<noscript><p><img src="https://matomo.kairo.at/piwik.php?idsite=2" style="border:0;" alt="" /></p></noscript>
23<h1>Lantea Map</h1>
24
25<div id="trackArea" class="menuDrawer secondaryUI hidden">
26<h2 onclick="toggleTrackArea();">
27<image src="style/track.svg" alt=""> Track
28</h2>
29<p id="trackData"><span id="trackLength"><span id="trackLengthNum">0</span> km</span>,
30<span id="trackDuration"><span id="trackDurationH"><span id="trackDurationHNum">0</span> h</span>
31<span id="trackDurationM"><span id="trackDurationMNum">0</span> min</span></span>
32</p>
33<p>
34<input type="button" id="saveTrackButton" value="Save"
35 onclick="saveTrack();">
36<input type="button" id="dumpTrackButton" value="Dump"
37 onclick="saveTrackDump();" class="debugHide">
38<input type="button" id="uploadTrackButton" value="Upload" disabled="true"
39 onclick="showUploadDialog();">
40<input type="button" id="clearTrackButton" value="Clear"
41 onclick="clearTrack();">
42</p>
43<p id="libraryShowLine" class="hidden">
44<input type="button" id="libraryShowButton" value="View uploaded tracks"
45 onclick="showLibrary();">
46</p>
47<div id="trackDialogArea" class="hidden">
48<div id="uploadDialog">
49<p class="subTitle">Upload Track to Lantea Maps Server:</p>
50<label for="uploadPublic">Visibility:</label>
51<select id="uploadPublic">
52<option value="true">Public Domain</option>
53<option value="false">Private</option>
54</select>
55<p class="dialogHelp">Public Domain tracks can be forwarded by the server
56operator to any other services, e.g. OpenStreetMap.</p>
57<p>
58<label for="uploadDesc">Comment:</label>
59<input type="text" id="uploadDesc" maxlength="255" size="25"
60 value="Lantea Maps">
61</p>
62<p>
63<input type="button" id="uploadDialogUploadButton" value="Upload Track"
64 onclick="uploadTrack();">
65<input type="button" id="uploadDialogCancelButton" value="Cancel"
66 onclick="cancelTrackDialog();">
67</p>
68</div>
69<div id="uploadStatus">
70<p class="subTitle">Track Upload to Lantea Maps Server</p>
71<p id="uploadInProgress"><img id="actionimg" src="style/loading_action.png">
72 Upload in progress&hellip;</p>
73<p id="uploadSuccess" style="display:none;">Track upload successful!</p>
74<p id="uploadFailed" style="display:none;">Track upload failed.</p>
75<p id="uploadError" style="display:none;">Error:<br>
76 <span id="uploadErrorMsg"></span></p>
77<input type="button" id="uploadStatusCloseButton" value="Close"
78 onclick="cancelTrackDialog();" disabled="true">
79</div>
80</div>
81<p class="loginbox">
82<button type="button" id="loginbtn" class="hidden">Sign in</button>
83<span id="loginerror" class="hidden">!</span>
84<span id="logindesc" class="hidden">to enable uploads</span>
85<span id="username" class="hidden"></span>
86<button type="button" id="logoutbtn" class="hidden">Log out</button>
87</p>
88<p>
89<input type="checkbox" id="trackCheckbox"
90 onchange="setTracking(this);">
91<label for="trackCheckbox">Enable tracking</label><br/>
92</p>
93<p>
94<input type="checkbox" id="centerCheckbox"
95 onchange="setCentering(this);">
96<label for="centerCheckbox">Center Map</label><br/>
97</p>
98</div>
99
100<div id="settingsArea" class="menuDrawer secondaryUI hidden">
101<h2 onclick="toggleSettings();">
102<image src="style/settings.svg" alt=""> Settings
103</h2>
104<p>
105<label for="mapSelector">Map style:</label>
106<select id="mapSelector" onchange="setMapStyle();">
107<!-- option value="osm_mapnik">OpenStreetMap (Mapnik)</option -->
108</select>
109</p>
110<p>
111<input type="button" id="clearCacheButton" value="Clear Cached Maps"
112 onclick="gTileService.clearDB();">
113</p>
114<div id="uploadSettingsArea">
115<p class="subTitle">Track Upload:</p>
116<p>
117<label for="uploadDevName">Device name:</label>
118<input type="text" id="uploadDevName" maxlength="255" placeholder="My Device"
119 onchange="setUploadField(this);">
120</p>
121<p class="dialogHelp">The device name enables you to tell apart tracks you may
122upload from multiple devices.</p>
123</div>
124</div>
125
126<div id="menuArea" class="autoFade overlayArea">
127<image src="style/track.svg" class="controlButton" id="trackButton" value="Track"
128 onclick="toggleTrackArea();"><br/>
129<image src="style/settings.svg" class="controlButton" id="settingsButton" alt="Settings"
130 onclick="toggleSettings();"><br/>
131</div>
132
133<div id="zoomArea" class="autoFade overlayArea">
134<input type="button" id="zoomInButton" value="+">
135<p id="zoomLevel">Z</p>
136<input type="button" id="zoomOutButton" value="&minus;">
137</div>
138
139<div id="fullscreenArea" class="autoFade overlayArea">
140<!-- other possible characters: &#x25F0; -->
141<input type="button" id="fullscreenButton" value="&#x25A3;"
142 onclick="toggleFullscreen();">
143</div>
144
145<div id="dialogArea" class="overlayArea hidden">
146<div id="noGLwarning">
147 Unable to initialize WebGL. You need a browser that supports it.
148</div>
149<div id="DBError">
150 Unable to open indexedDB database in your browser. Please make sure you have
151 not disabled access to in-browser storage.
152</div>
153<div id="firstRunIntro">
154<p class="dialogTitle">Welcome to Lantea Maps!</p>
155<p>This web app lets you record GPS tracks of your journeys, which you can
156 upload to our backend servers and download as GPX files.</p>
157<p>You can find track details, upload, etc. in the "track" drawer that you can
158 access via the <image src="style/track.svg"> icon at the left top of the
159 window.</p>
160<p>Right underneath that icon, you find <image src="style/settings.svg">
161 settings.</p>
162<p>Both track and settings "drawers" can be closed by clicking/tapping on their
163 title line.</p>
164<p>From the track "drawer", you can also access a library of uploaded tracks,
165 their name/comment links to the GPX download of the specific track.</p>
166<p class="dialogButtonLine">
167 <button id="firstRunDialogCloseButton"
168 onclick="closeDialog();">Close</button>
169</p>
170</div>
171<div id="infoDialog">
172<p class="dialogTitle">Recent Changes in Lantea Maps</p>
173<p>Lantea Maps has been updated with a few significant changes.</p>
174<p>Most importantly, the upload functionality for tracks has been improved and
175 switched to use our own Lantea Maps server. For accessing it, you need to
176 log in with KaiRo.at via a "sign in" button now in the track "drawer".</p>
177<p>From there, you can also access a library of uploaded tracks, their
178 name/comment links to the GPX download of the specific track.</p>
179<p>If you set a device name in the settings, you can even distinguish tracks
180 uploaded to the same account by different devices you're using.</p>
181<p class="dialogButtonLine">
182 <button id="firstRunDialogCloseButton"
183 onclick="closeDialog();">Close</button>
184</p>
185</div>
186</div>
187
188<div id="libraryArea" class="overlayArea fullScreenOverlay secondaryUI hidden">
189<p>The following tracks are saved on the Lantea Maps Server:</p>
190<ul id="libTrackList">
191</ul>
192<p id="libTrackPages" class="hidden"></p>
193<p class="closeButtonContainer"><button id="libCloseButton" class="closeButton">X</button></p>
194</div>
195
196<p id="action">
197 <img id="actionimg" src="style/loading_action.png">
198 <span id="actionlabel">Loading</span>&hellip;
199</p>
200<p id="copyright" class="autoFade overlayArea"></p>
201
202<canvas id="map" width="500" height="500">
203 Please use a browser that supports &lt;canvas&gt; elements.
204</canvas>
205<canvas id="track" width="500" height="500">
206</canvas>
207
208</body>
209</html>
Lantea Maps web app - display maps and record (GPS) tracks