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
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
|
{% extends 'base.html' %}
{% load typogrify %}
{% load truncateletters %}
{% load slugify_under %}
{% block pagetitle %}Luxagraf | Map and Trips{% endblock %}
{% block metadescription %}Writing Archive, Luxagraf{% endblock %}
{#==============================================
Google Maps code
==============================================#}
{% block extrahead %}
<script src="http://maps.google.com/maps?file=api&v=2&key={{map_key}}" type="text/javascript"></script>
{% endblock %}
{%block bodyid%}id="location"{%endblock%}
{% block bodyevents %}onload="initialize()" onunload="GUnload()"{% endblock %}
{% block primary %}
<div id="map-canvas">
</div>
{% endblock %}
{% block titleoverride %} {% endblock %}
{% block sidebar %}
<div id="sidebar">
<div class="blok">
<h4 class="first">Trips</h4>
<ul>
<li><a onclick="addRoute('yi_iAp}mmOlzd@egy@njcCcpOq{hDxyqAai_@kvhSio[b|zVjhNbmZ','BBBBBBB','#FF0000',12.0554, -85.1880, 8);" href="#">Nicaragua (2008)</a></li>
</ul>
<h4>Regions</h4>
<ul>
{%for region in region_list %}
<li><a href="#{{region.slug}}" onclick="focusCountry({{region.lat}}, {{region.lon}}, {{region.zoom_level}});" title="See all writing from {{region.name|title}}">{{region.name}}</a></li>
{% endfor %}
</ul>
<h4>Countries</h4>
<ul>
<li><a onclick="focusCountry(19.311143,2.460938,2);" href="#">All</a></li>
{%for country in country_list %}
<li><a href="#{{country.slug}}" onclick="focusCountry({{country.lat}}, {{country.lon}}, {{country.zoom_level}});" title="See all writing from {{country.name|title}}">{{country.name}}</a></li>
{% endfor %}
</ul>
</div>
</div><!-- sidebar -->
{% endblock %}
{% block js %}
<script type="text/javascript">
var map = null;
function JLngLat(a,b) {
return new GLatLng(b,a)
}
function initialize() {
if (GBrowserIsCompatible()) {
var tinyIcon = new GIcon();
tinyIcon.image = "http://media.luxagraf.net/img/marker-entry.png";
tinyIcon.shadow = "http://media.luxagraf.net/img/shadow.png";
tinyIcon.iconSize = new GSize(12, 20);
tinyIcon.shadowSize = new GSize(22, 20);
tinyIcon.iconAnchor = new GPoint(6, 20);
tinyIcon.infoWindowAnchor = new GPoint(5, 5);
//var iconOptions = {};
//iconOptions.primaryColor = "#a53503";
//iconOptions.strokeColor = "#201a11";
//var icon = MapIconMaker.createLabeledMarkerIcon(iconOptions);
var location = window.location.hash;
var pts = new Array();
{%for c in country_list%}pts[{{forloop.counter0}}] = ["#{{c.slug}}", {{c.lat}},{{c.lon}},{{c.zoom_level}}];{% endfor %}
{%for c in region_list%}pts[pts.length] = ["#{{c.slug}}", {{c.lat}},{{c.lon}},{{c.zoom_level}}];{% endfor %}
if (location.length>1) {
for (i=0;i<pts.length;i++) {
if (location == pts[i][0]) {
point = new GLatLng(pts[i][1],pts[i][2]);
zoom = pts[i][3];
break;
} else {
point = new GLatLng(19.311143,2.460938);
zoom = 2;
}
}
} else {
point = new GLatLng(19.311143,2.460938);
zoom = 2;
}
// create a new map.
map = new GMap2(document.getElementById("map-canvas"));
map.enableContinuousZoom()
map.setCenter(point, zoom, G_PHYSICAL_MAP);
// basic control and overview (closed by default)
map.addControl(new GSmallZoomControl());
var ov = new GOverviewMapControl(new GSize(100,100));
map.addControl(ov);
ov.hide(true);
// Add a marker for each project
{% for entry in object_list %}
point_{{entry.title|truncatewords:2|slugify_under}} = JLngLat{{entry.point.coords}};
markerOptions = { clickable:true, draggable:false, icon:tinyIcon};
marker_{{entry.title|truncatewords:2|slugify_under}} = new GMarker(point_{{entry.title|truncatewords:2|slugify_under}}, markerOptions);
map.addOverlay(marker_{{entry.title|truncatewords:2|slugify_under}});
marker_{{entry.title|truncatewords:2|slugify_under}}.info_window_content = '<div class="mcanvas"><h4>{{entry.title}}<\/h4><span>{{entry.pub_date|date:"F j, Y"}} ({% ifequal entry.location.state.country.name "United States" %}{{entry.location.name|smartypants|safe}}, {{entry.location.state.name}}){%else%}{{entry.location.name|smartypants|safe}}, {{entry.location.state.country.name}}){%endifequal%}<\/span><p><img src="{{entry.get_thumbnail_url}}" height="100" alt="{{ entry.title }}" \/>{{entry.dek|escapejs}} <a href="{{entry.get_absolute_url}}">Read it »<\/a><\/p><\/div>'
marker_{{entry|truncatewords:2|slugify_under}}.bindInfoWindowHtml(marker_{{entry|truncatewords:2|slugify_under}}.info_window_content, {maxWidth:400});
GEvent.addListener(marker_{{entry.title|truncatewords:2|slugify_under}}, "click", function() {
map.panTo(point_{{entry.title|truncatewords:2|slugify_under}}, 2);
});
{% endfor %}
}
}
// center on a country
function focusCountry(latitude, longitude, zoom) {
map.setZoom(zoom);
map.panTo(new GLatLng(latitude, longitude))
}
function addRoute(line,levels,color,lat,lon,zoom){
var encodedPolyline = new GPolyline.fromEncoded({
color: color,
weight: 5,
points: line,
levels: levels,
zoomFactor: 32,
numLevels: 4
});
focusCountry(lat,lon,zoom);
map.addOverlay(encodedPolyline);
}
</script>
{%endblock%}
|
