forked from marc-portier/fietsnet-configurator
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
96 lines (88 loc) · 3.91 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
<!DOCTYPE html>
<!--
(c) 2012 Marc Portier, Westtoer.
Licensed through CC-BY-SA 2.0 - BE http://creativecommons.org/licenses/by-sa/2.0/be/
-->
<html>
<head>
<title>fietsnet.be mashup configurator</title>
<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/themes/base/jquery-ui.css" />
<!--
| REPLACE the key below with your own API key
| obtain one from: http://code.google.com/apis/console
-->
<script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?key=AIzaSyDvdArdD6D5FVU5t6tFrte9lvOPPrlaD4Y&sensor=false"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.js"></script>
<style type="text/css">
textarea#result, div#locmap {
width: 100%;
height: 400px;
padding: 5px;
}
div#dialog {
width: 800px;
}
button#clearLoc {
float: right;
}
#config ul {
list-style-type: none;
}
</style>
<script type="text/javascript" src="fietsnet-config.js"></script>
</head>
<body>
<h1>Configureer je fietsnet.be mashup</h1>
<div>Maak je keuzes en pleeg je instellingen op elk van onderstaande topics. Knip en Plak dan het resultaat.</div>
<div id="config">
<h3><a href="#">Basis: [
Afmetingen (<span id="echo_width_height"></span>)
- Titel (<span id="echo_title"></span>)
- FlashWarning (<span id="echo_flashWarning"></span>)
- Opties (<span id="echo_options"></span>)
]</a></h3>
<div>
Breedte <input type="text" id="width" value="500"/> en hoogte <input type="text" id="height" value="500"/> in px.
<br />
Titel Pagina <input type="text" id="title" value="Fietsnet Routeplanner." size="80" />
<br />
Flash Warning <input type="text" id="flashWarning" value="Flash niet beschikbaar." size="80" />
<br />
Opties:
<ul>
<li>
<input type="checkbox" checked="checked" id="centerButtonOpt" /> Knop voor centreren op locatie
met button-label <input type="text" id="centerButtonLabel" value="Home!" />
</li>
<input type="checkbox" checked="checked" id="citySelectorOpt" /> Veld voor zoeken op gemeente
met button-label <input type="text" id="citySelectorLabel" value="Zoek Gemeente!" />
<li>
</li>
<input type="checkbox" checked="checked" id="whenRouteExistsOpt" /> Sectie voor route-behandeling (wanneer route beschikbaar)
<li>
</li>
<input type="checkbox" checked="checked" id="drivingDirectionsOpt" /> Sectie voor weg-beschrijving (wanneer route beschikbaar)
<li>
</li>
</ul>
</div>
<h3><a href="#">Locatie <span id="echo_lat_lng"></span></a></h3>
<div id="tabMap">Kies (click) waar je de fietsnet.be-kaart wil centreren. Je kunt uiteraard ook zoomen en schuiven.
<button id="clearLoc">Ingestelde locatie wissen</button>
<div id="locmap" ></div>
</div>
<h3><a href="#">Resultaat</a></h3>
<div>
<p>Knip en plak dit resultaat als je nieuwe HTML pagina. <button id="tester">Test!</button></p>
<textarea id="result" readonly="true">...</textarea>
</div>
</div>
<div id="dialog" title="Test je configuratie!"><iframe frameBorder="0"><html></html></iframe></div>
<div id="samples">
<h2>Samples</h2>
<A HREF="sample.html">locaal voorbeeld rond Westtoer apb</A> |
<A HREF="http://www.fietsnet.be/routeplanner/example.htm">voorbeeld op fietsnet.be</A>
</div>
</body>
</html>