Skip to content

Commit 95c6193

Browse files
keikreutlerkeikreutler
committed
Merge branch 'ssedas' into source
2 parents 2484019 + 821e20e commit 95c6193

File tree

9 files changed

+271
-2
lines changed

9 files changed

+271
-2
lines changed

‎docpad.coffee

+7-2
Original file line numberDiff line numberDiff line change
@@ -32,16 +32,18 @@ docpadConfig = {
3232
"""
3333

3434
# The website author's name
35-
author: "Kei Kreutler"
35+
author: "TransforMap Community"
3636

3737
# The website author's email
38-
email: "prox@imity.io"
38+
email: "kei@ourmachine.net"
3939

4040
# Styles
4141
styles: [
4242
"//fonts.googleapis.com/css?family=PT+Sans:400,400italic,700,700italic&subset=latin,latin-ext"
43+
"//fonts.googleapis.com/css?family=Open+Sans:400,400italic,700,700italic&subset=latin,latin-ext"
4344
"//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css"
4445
"/styles/twitter-bootstrap.css"
46+
"//cdn.leafletjs.com/leaflet/v0.7.7/leaflet.css"
4547
"/styles/style.css"
4648
]
4749

@@ -50,6 +52,9 @@ docpadConfig = {
5052
"//cdnjs.cloudflare.com/ajax/libs/jquery/1.10.2/jquery.min.js"
5153
"//cdnjs.cloudflare.com/ajax/libs/modernizr/2.6.2/modernizr.min.js"
5254
"/vendor/twitter-bootstrap/dist/js/bootstrap.min.js"
55+
"//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.5.2/underscore-min.js"
56+
"//cdnjs.cloudflare.com/ajax/libs/backbone.js/1.1.0/backbone-min.js"
57+
"//cdn.leafletjs.com/leaflet/v0.7.7/leaflet.js"
5358
"/scripts/script.js"
5459
]
5560

‎src/layouts/map.html.eco

+66
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,66 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<!-- Meta -->
5+
<meta charset="utf-8" />
6+
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
7+
8+
<!-- Use the .htaccess and remove these lines to avoid edge case issues.
9+
More info: h5bp.com/i/378 -->
10+
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
11+
12+
<!-- Our site title and description -->
13+
<title><%= @getPreparedTitle() %></title>
14+
<meta name="description" content="<%= @getPreparedDescription() %>" />
15+
<meta name="keywords" content="<%= @getPreparedKeywords() %>" />
16+
<meta name="author" content="<%= @site.author or '' %>" />
17+
18+
<meta property="og:title" content="TransforMap" />
19+
<meta property="og:type" content="website" />
20+
<meta property="og:description" content="<%= @getPreparedDescription() %>" />
21+
<meta property="og:url" content="http://transformap.co" />
22+
23+
<!-- Output DocPad produced meta elements -->
24+
<%- @getBlock('meta').toHTML() %>
25+
26+
<!-- Mobile viewport optimized: h5bp.com/viewport -->
27+
<meta name="viewport" content="width=device-width" />
28+
29+
<!-- Icons -->
30+
<link rel="shortcut icon" href="/images/favicon.png">
31+
32+
<!-- Shims: IE6-8 support of HTML5 elements -->
33+
<!--[if lt IE 9]>
34+
<script async src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
35+
<![endif]-->
36+
37+
<!-- Styles -->
38+
<%- @getBlock('styles').add(@site.styles).toHTML() %>
39+
</head>
40+
<body id="map">
41+
42+
<!-- Content -->
43+
<%- @content %>
44+
45+
<!-- Scripts -->
46+
<%- @getBlock('scripts').add(@site.scripts).toHTML() %>
47+
<script defer="defer" type="text/javascript" src="/scripts/map.js"></script>
48+
<!-- Piwik -->
49+
<script type="text/javascript">
50+
var _paq = _paq || [];
51+
_paq.push(["setDocumentTitle", document.domain + "/" + document.title]);
52+
_paq.push(["setCookieDomain", "*.webplatform.org"]);
53+
_paq.push(['trackPageView']);
54+
_paq.push(['enableLinkTracking']);
55+
(function() {
56+
var u="//piwik.allmende.io/";
57+
_paq.push(['setTrackerUrl', u+'piwik.php']);
58+
_paq.push(['setSiteId', <%= @site.piwik_id %>]);
59+
var d=document, g=d.createElement('script'), s=d.getElementsByTagName('script')[0];
60+
g.type='text/javascript'; g.async=true; g.defer=true; g.src=u+'piwik.js'; s.parentNode.insertBefore(g,s);
61+
})();
62+
</script>
63+
<noscript><p><img src="//piwik.allmende.io/piwik.php?idsite=<%= @site.piwik_id %>" style="border:0;" alt="" /></p></noscript>
64+
<!-- End Piwik Code -->
65+
</body>
66+
</html>

‎src/render/embed.html.eco

+25
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,25 @@
1+
---
2+
layout: map
3+
tags: ['ssedas','embed','map']
4+
---
5+
6+
<div id="map-filters">
7+
<img src="/images/susy_logo.png">
8+
<h3>Organisations</h3>
9+
<ul class="list-group">
10+
<li id="f1" class="list-group-item">Food and Agriculture</li>
11+
<li id="f2" class="list-group-item">Fair Trade</li>
12+
<li id="f3" class="list-group-item">Reduce, reuse, repair, recycle</li>
13+
<li id="f4" class="list-group-item">Housing and habitat</li>
14+
<li id="f5" class="list-group-item">Infrastructure</li>
15+
<li id="f5-sub" class="list-group-item">Bicycle initiatives</li>
16+
<li id="f5-sub" class="list-group-item">Energy</li>
17+
<li id="f6" class="list-group-item">Social inclusion</li>
18+
<li id="f7" class="list-group-item">Commoning</li>
19+
<li id="f8" class="list-group-item">Education and Training</li>
20+
<li id="f9" class="list-group-item">MORE FILTERS</li>
21+
</ul>
22+
</div>
23+
24+
<div id="map-embed">
25+
</div>

‎src/render/index.html.eco

+1
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,7 @@ layout: default
33
tags: ['news','blog','overview']
44
---
55

6+
67
<section id="welcome">
78
<div class="container text-center">
89
<%- @partial('text-main-description') %>

‎src/render/scripts/map.js

+34
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
2+
var map = L.map('map-embed', {
3+
center: [30, -25],
4+
zoom: 3,
5+
scrollWheelZoom: false
6+
});
7+
8+
var theme_colors = ["#fcec74", "#f7df05", "#f2bd0b", "#fff030", "#95D5D2", "#1F3050"];
9+
10+
L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png').addTo(map);
11+
12+
var geojsonLayer = new L.layerGroup();
13+
14+
$.getJSON("//data.transformap.co/raw/5d6b9d3d32097fd68322008744001eec", function(data) {
15+
L.geoJson(data, {
16+
pointToLayer: function(feature, latlng) {
17+
var marker = L.circleMarker(latlng, {
18+
color: theme_colors[(Math.floor(Math.random() * 6) + 1)],
19+
opacity: 1,
20+
fillOpacity: 1,
21+
});
22+
return marker;
23+
},
24+
onEachFeature: createLayers
25+
});
26+
});
27+
28+
function createLayers(feature, featureLayer) {
29+
featureLayer.bindPopup('<a href="' + feature.properties.url + '"">' + feature.properties.name + '</a><p>' + feature.properties.concept + '</p>' );
30+
geojsonLayer.addLayer(featureLayer);
31+
}
32+
33+
geojsonLayer.addTo(map);
34+

‎src/render/styles/style.css.less

+137
Original file line numberDiff line numberDiff line change
@@ -9,6 +9,9 @@ body {
99
padding-top: 50px;
1010
font-family: 'PT Sans', sans-serif;
1111
}
12+
body#map {
13+
padding-top: 0;
14+
}
1215
section {
1316
padding: 50px 0;
1417
}
@@ -102,6 +105,12 @@ Sections Styles
102105
margin-bottom: 50px;
103106
}
104107

108+
section#landing-map {
109+
padding: 0;
110+
margin: 0;
111+
margin-top: -50px; /* To account for navbar height */
112+
}
113+
105114
section#welcome {
106115
img {
107116
display: block;
@@ -188,6 +197,134 @@ section#channels {
188197
margin-top: 20px;
189198
}
190199

200+
/****************
201+
Map Styles
202+
****************/
203+
204+
#map {
205+
height: 100vh;
206+
width: 100vw;
207+
/*.leaflet-top .leaflet-control {
208+
margin-top: 60px; /* To account for navbar height and padding */
209+
p {
210+
font-family: 'Open Sans', sans-serif;
211+
}
212+
}
213+
214+
@yellow-one: #fcec74;
215+
@yellow-two: #f7df05;
216+
@yellow-three: #f2bd0b;
217+
@yellow-four: #fff030;
218+
@blue: #95D5D2;
219+
@light-blue: #1F3050;
220+
221+
#map-filters {
222+
height: 100vh;
223+
width: 20%;
224+
display: inline;
225+
float: left;
226+
padding: 50px 0;
227+
img {
228+
max-width: 100px;
229+
display: block;
230+
margin: auto;
231+
}
232+
.list-group {
233+
color: #000;
234+
font-size: 12px !important;
235+
font-weight: 700;
236+
padding-top: 25px;
237+
}
238+
.list-group-item {
239+
border-top: 1px solid #eee;
240+
border-bottom: 0px;
241+
border-left: 0px;
242+
border-right: 0px;
243+
border-radius: 0;
244+
}
245+
#f1 {
246+
&:hover, &:active {
247+
background: @yellow-two;
248+
}
249+
}
250+
#f2 {
251+
&:hover, &:active {
252+
background: @yellow-two;
253+
}
254+
}
255+
#f3 {
256+
&:hover {
257+
background: @yellow-three;
258+
}
259+
}
260+
#f4 {
261+
&:hover {
262+
background: @yellow-four;
263+
}
264+
}
265+
#f5 {
266+
background: @blue;
267+
border: 0;
268+
&:hover {
269+
background: @blue;
270+
}
271+
}
272+
#f5-sub {
273+
background: #eee;
274+
border-top: 0;
275+
padding: 5px;
276+
padding-left: 15px;
277+
}
278+
#f9 {
279+
background: @light-blue;
280+
width: 100%;
281+
font-weight: 500;
282+
color: #fff;
283+
position: absolute;
284+
bottom: 0;
285+
padding: 5px;
286+
padding-left: 15px;
287+
}
288+
}
289+
290+
#map-filters-2 {
291+
height: 100%;
292+
width: 20px;
293+
display: inline;
294+
}
295+
296+
.vertical-text {
297+
transform: rotate(90deg);
298+
transform-origin: left top 0;
299+
}
300+
301+
#map-embed {
302+
height: 100%;
303+
width: 80%;
304+
margin-left: 20%;
305+
display: inline block;
306+
.leaflet-popup {
307+
font-family: 'Open Sans', sans-serif;
308+
min-width: 150px;
309+
p {
310+
font-size: 12px;
311+
text-align: left;
312+
}
313+
}
314+
.leaflet-popup-content-wrapper {
315+
border-radius: 0;
316+
padding: 3px;
317+
min-width: 250px;
318+
}
319+
.leaflet-popup-content {
320+
a {
321+
font-weight: 500;
322+
color: #000;
323+
}
324+
margin: 5px;
325+
}
326+
}
327+
191328
/*****************
192329
Page Styles
193330
*****************/

‎src/static/images/mockup.png

298 KB
Loading

‎src/static/images/susy_logo.png

4.1 KB
Loading

‎src/static/json/development.geojson

+1
Large diffs are not rendered by default.

0 commit comments

Comments
 (0)