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
|
<!-- $Id$ -->
<script type="text/javascript"
src="http://maps.google.com/maps/api/js?sensor=false">
</script>
<script type="text/javascript">
function initialize() {
var latlng = new google.maps.LatLng(20,0);
var myOptions = {
zoom: 2,
center: latlng,
mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map_canvas"),
myOptions);
[% FOREACH m = c.model('Mirrors').find_mirrors %]
[% IF m.latitude %]
var myLatlng = new google.maps.LatLng([% m.latitude %],[% m.longitude %]);
var marker[% loop.count %] = new google.maps.Marker({
position: myLatlng,
map: map,
title:"[% m.hostname %]"
});
var infowindow[% loop.count %] = new google.maps.InfoWindow({
content: '<div style="font-size: 75%">' +
'<p><a href="[% c.uri_for('/mirrors', m.hostname) %]">[% m.hostname %]</a></p>' +
[% IF m.syncfrom %]
'<p>Sync from [% m.syncfrom %]</p>' +
[% END %]
'</div>'
});
google.maps.event.addListener(marker[% loop.count %], 'click', function() {
infowindow[% loop.count %].open(map,marker[% loop.count %]);
});
[% IF m.syncfrom %]
[% mf = c.model('Mirrors').find_mirrors({ hostname => m.syncfrom }) %]
[% IF mf.0.latitude %]
var fLatLng = new google.maps.LatLng([% mf.0.latitude %], [% mf.0.longitude %]);
var flightPath = new google.maps.Polyline({
path: [ fLatLng, myLatlng ],
strokeColor: "#FF0000",
strokeOpacity: 1.0,
strokeWeight: 2
});
flightPath.setMap(map);
[% END %]
[% END %]
[% END %]
[% END %]
}
</script>
<div id="map_canvas" style="width:75%; height:500px"></div>
<script type="text/javascript">
initialize();
</script>
<h2>Synchronisation tree</h2>
<img src="[% c.uri_for('/graph') %]">
|