source: src/django_gheat/website/templates/home.html@ 9274

Last change on this file since 9274 was 9274, checked in by dennisw, 13 years ago

Custom layer switcher has it's own div now. Some visual stuff added like div toggle and categories (Base layers, Users, etc).

File size: 3.9 KB
Line 
1<html>
2<head>
3 <link href="{{ STATIC_URL }}style.css" rel="stylesheet" type="text/css" media="screen" />
4 <link type="text/css" href="{{ STATIC_URL }}jquery-ui-1.8.13.custom.css" rel="Stylesheet" />
5 <script type="text/javascript" language="Javascript" src="{{ STATIC_URL }}jquery-1.6.1.min.js"></script>
6 <script type="text/javascript" language="Javascript" src="{{ STATIC_URL }}OpenLayers.js"></script>
7 <script type="text/javascript" language="Javascript" src="{{ STATIC_URL }}OpenStreetMap.js"></script>
8 <script type="text/javascript" language="Javascript" src="{{ STATIC_URL }}heatmap.js"></script>
9 <script type="text/javascript" language="javascript" src="{{ STATIC_URL }}jquery.chained.js"></script>
10 <script type="text/javascript" language="Javascript" src="{{ STATIC_URL }}heatmap_extensions.js"></script>
11 <script type="text/javascript" language="Javascript" src="{{ STATIC_URL }}colorpicker.js"></script>
12 <script type="text/javascript" language="Javascript" src="{{ STATIC_URL }}jquery-ui-1.8.13.custom.min.js"></script>
13</head>
14<body onload="init()">
15 <div id="heatmap"></div>
16 <div id="container">
17 <div id="header">
18 Stichting Wireless Leiden - Heatmap
19 </div>
20 <div id="menu">
21 <a id="menu_info">Info</a>
22 <a id="menu_filter">Filters</a>
23 </div>
24 <div id="info">
25 <h1>Info</h1>
26 <p>Welcome to Wireless Leiden's Heatmap. Here you can check for the coverage of (open) wifi connections in Leiden.</p>
27 <p>On the right, you will find a layer selection panel. Here you can turn layers on or off, depending on what you would like to see displayed on the map.</p>
28 <p>Above you will see a 'filter' button. Here you can set your own filters.</p>
29 <p>Below you will see a textfield and a slider. The textfield displays Wireless Leiden nodes on the position where you clicked with your mouse. With the slider you can set the range of the signal strength you would like to have. Based on these values, a new layer will appear showing only the connections within your chosen range.</p>
30 </div>
31 <div id="filter">
32 <div id="filter_text">
33 <h1>Filters</h1>
34 <p>Create your custom layer by choosing the desired filter options on the right and adding it the layer to the list.</p>
35 <p>For instance, you can choose to create a layer with data measured only by yourself, or with a certain node from Wireless Leiden only.</p>
36 </div>
37 <div id="filter_list">
38 <form method="get" action="">
39 <input type="text" id="start_date" name="start_date" size="10"/> Start date<br />
40 <input type="text" id="end_date" name="end_date" size="10"/> End date<br />
41 <select id="select_user" style="width:104px"></select> User<br />
42 <select id="select_dataset" style="width:104px"></select> Dataset<br />
43 <select id="select_node" style="width:104px"></select> Node<br />
44 <input type="text" id="lname" name="lname" size="10"/> Filtername<br /><br />
45 <input type="text" id="colour" name="colour"/> Colour<br /><br />
46 <input type="button" id="add_filter" value="Add filter"/><br />
47 </form>
48 </div>
49 </div>
50 </div>
51 <div id="node_list">
52 Click on map to display Wireless Leiden nodes.
53 </div>
54 <div id="sig_slider">
55 <font id='sig_value'>Signal strength: 0 - 100</font>
56 <div id="slider"></div>
57 </div>
58 <div id="layer_switcher_toggle">-
59 </div>
60 <div id="layer_switcher">
61 <div id="layer_switcher_cat">Base layers</div><p><span id="default"></span><p>
62 <div id="layer_switcher_cat">Nodes</div><p><span id="node"></span><input type="button" id="node_filter" value="Add nodefilter"/><br /><p>
63 <div id="layer_switcher_cat">Users</div><p><span id="user"></span><input type="button" id="user_filter" value="Add userfilter"/><br /><P>
64 <div id="layer_switcher_cat">Custom filters</div><p><span id="custom"></span><p>
65 </div>
66</body>
67</html>
Note: See TracBrowser for help on using the repository browser.