Skip to content

Commit

Permalink
Refactor, no more new, separate maps as things, data binding
Browse files Browse the repository at this point in the history
  • Loading branch information
@tmcw
tmcw committed May 4, 2012
1 parent 11a9303 commit 55c48e6
Show file tree
Hide file tree
Showing 2 changed files with 111 additions and 105 deletions.
6 changes: 2 additions & 4 deletions index.html
View file
Expand Up @@ -50,7 +50,7 @@ <h2>See your neighborhood</h2>
<script type="text/javascript">

// Make a new map in #map
MB.map('map', {
var main = Map('map', {
id: 'mapbox.mapbox-light',
center: {
lat: 38.8850033656251,
Expand All @@ -68,7 +68,7 @@ <h2>See your neighborhood</h2>
]
});

MB.layers({
main.layers({
donors: {
name: 'Donors',
id: 'awidercircle.awc-addresses-don',
Expand Down Expand Up @@ -113,8 +113,6 @@ <h2>See your neighborhood</h2>
}
}
});

MB.layout();
</script>
</body>
</html>
210 changes: 109 additions & 101 deletions script.js
View file
@@ -1,108 +1,120 @@
var MB = {};

MB.maps = {};

MB.api = function(l) {
return 'http://api.tiles.mapbox.com/v3/' + l.id + '.jsonp';
};

MB.map = function(el, l) {
wax.tilejson(MB.api(l), function(t) {
var handlers = [
new MM.DragHandler(),
new MM.DoubleClickHandler(),
new MM.TouchHandler()
];
if ($.inArray('zoomwheel',l.features) >= 0) {
handlers.push(new MM.MouseWheelHandler());
}
(function(root) {
var Map = {},
MM_map,
layers;

MB.maps[el] = new MM.Map(el, new wax.mm.connector(t), null, handlers);
MB.maps[el].setCenterZoom({
lat: (l.center) ? l.center.lat : t.center[1],
lon: (l.center) ? l.center.lon : t.center[0]
}, (l.center) ? l.center.zoom : t.center[2]
);

if (l.zoomRange) {
MB.maps[el].setZoomRange(l.zoomRange[0], l.zoomRange[1]);
} else {
MB.maps[el].setZoomRange(t.minzoom, t.maxzoom);
}
function api(l) {
return 'http://api.tiles.mapbox.com/v3/' + l.id + '.jsonp';
}

wax.mm.attribution(MB.maps[el], t).appendTo(MB.maps[el].parent);

for (var i = 0; i < l.features.length; i++) {
switch(l.features[i]) {
case 'zoompan':
wax.mm.zoomer(MB.maps[el]).appendTo(MB.maps[el].parent);
break;
case 'zoombox':
wax.mm.zoombox(MB.maps[el]);
break;
case 'legend':
MB.maps[el].legend = wax.mm.legend(MB.maps[el], t).appendTo(MB.maps[el].parent);
break;
case 'bwdetect':
wax.mm.bwdetect(MB.maps[el]);
break;
case 'share':
wax.mm.share(MB.maps[el], t).appendTo(MB.maps[el].parent);
break;
case 'tooltips':
MB.maps[el].interaction = wax.mm.interaction()
.map(MB.maps[el])
.tilejson(t)
.on(wax.tooltip()
.parent(MB.maps[el].parent)
.events()
);
break;
case 'movetips':
MB.maps[el].interaction = wax.mm.interaction()
.map(MB.maps[el])
.tilejson(t)
.on(wax.movetip()
.parent(MB.maps[el].parent)
.events()
);
break;
Map = function(el, l) {
wax.tilejson(api(l), function(t) {
var handlers = [
new MM.DragHandler(),
new MM.DoubleClickHandler(),
new MM.TouchHandler()
];
if ($.inArray('zoomwheel', l.features) >= 0) {
handlers.push(new MM.MouseWheelHandler());
}
}
});
};

MB.refresh = function(m, l) {
MM_map = new MM.Map(el, new wax.mm.connector(t), null, handlers);
MM_map.setCenterZoom({
lat: (l.center) ? l.center.lat : t.center[1],
lon: (l.center) ? l.center.lon : t.center[0]
}, (l.center) ? l.center.zoom : t.center[2]);

if (l.zoomRange) {
MM_map.setZoomRange(l.zoomRange[0], l.zoomRange[1]);
} else {
MM_map.setZoomRange(t.minzoom, t.maxzoom);
}

if (l.id) {
wax.tilejson(MB.api(l), function(t) {
wax.mm.attribution(MM_map, t).appendTo(MM_map.parent);

for (var i = 0; i < l.features.length; i++) {
switch(l.features[i]) {
case 'zoompan':
wax.mm.zoomer(MM_map).appendTo(MM_map.parent);
break;
case 'zoombox':
wax.mm.zoombox(MM_map);
break;
case 'legend':
MM_map.legend = wax.mm.legend(MM_map, t).appendTo(MM_map.parent);
break;
case 'bwdetect':
wax.mm.bwdetect(MM_map);
break;
case 'share':
wax.mm.share(MM_map, t).appendTo(MM_map.parent);
break;
case 'tooltips':
MM_map.interaction = wax.mm.interaction()
.map(MM_map)
.tilejson(t)
.on(wax.tooltip()
.parent(MM_map.parent)
.events()
);
break;
case 'movetips':
MM_map.interaction = wax.mm.interaction()
.map(MM_map)
.tilejson(t)
.on(wax.movetip()
.parent(MM_map.parent)
.events()
);
break;
}
}
});
return Map;
};

Map.layers = function(x) {
if (!arguments.length) return layers;
layers = x;
return Map;
};

Map.setOverlay = function(id) {

if (!layers[id]) throw new Error('overlay with id ' + id + ' not found');
var l = layers[id];

wax.tilejson(api(l), function(t) {
var layer = l.layer || 0;
try {
MB.maps[m].setLayerAt(layer, new wax.mm.connector(t));
MM_map.setLayerAt(layer, new wax.mm.connector(t));
} catch (e) {
MB.maps[m].insertLayerAt(layer, new wax.mm.connector(t));
MM_map.insertLayerAt(layer, new wax.mm.connector(t));
}
if (MB.maps[m].interaction) MB.maps[m].interaction.tilejson(t);
if (MB.maps[m].legend) {
MB.maps[m].legend.content(t);
if (MM_map.interaction) MM_map.interaction.tilejson(t);
if (MM_map.legend) {
MM_map.legend.content(t);
}
});
}

if (l.center) {
var lat = l.center.lat || MB.maps[m].getCenter().lat,
lon = l.center.lon || MB.maps[m].getCenter().lon,
zoom = l.center.zoom || MB.maps[m].getZoom();

if (l.center.ease > 0) {
MB.maps[m].easey = easey().map(MB.maps[m])
.to(MB.maps[m].locationCoordinate({ lat: lat, lon: lon })
.zoomTo(zoom)).run(l.center.ease);
} else {
MB.maps[m].setCenterZoom({ lat: lat, lon: lon }, zoom);
if (l.center) {
var lat = l.center.lat || MM_map.getCenter().lat,
lon = l.center.lon || MM_map.getCenter().lon,
zoom = l.center.zoom || MM_map.getZoom();

if (l.center.ease > 0) {
MM_map.easey = easey().map(MM_map)
.to(MM_map.locationCoordinate({ lat: lat, lon: lon })
.zoomTo(zoom)).run(l.center.ease);
} else {
MM_map.setCenterZoom({ lat: lat, lon: lon }, zoom);
}
}
}
};
};

root.Map = Map;

})(this);

// Bind the geocoder functionality to any div with the format
//
Expand All @@ -119,9 +131,6 @@ function bindGeocoder() {
var m = $('[data-control="geocode"]').attr('data-map');
// If this doesn't explicitly name the layer it should affect,
// use the first layer in MB.maps
if (!m) {
for (var k in MB.maps) { m = k; break; }
}
e.preventDefault();
geocode($('input[type=text]', this).val(), m);
});
Expand Down Expand Up @@ -178,23 +187,22 @@ function bindGeocoder() {
};
}

MB.layout = function() {
$(function() {
if (location.hash === '#embed') $('body').removeClass().addClass('embed');

$('body').append('<div id="layout"><a href="#" id="right">right</a><a href="#" id="left">left</a><a href="#" id="hero">hero</a></div>');
$('#layout a').click(function(e) {
e.preventDefault();
$('body').removeClass().addClass($(this).attr('id'));
});
};

$(function() {
$('body').on('click.map', '[data-control="layer"]', function(e) {
var $this = $(this),
href = $this.attr('href');
href = href.replace(/.*(?=#[^\s]+$)/, '');
id = $this.attr('href');
id = id.replace(/.*(?=#[^\s]+$)/, '').slice(1);
var m = $('[data-control="geocode"]').attr('data-map') || 'main';
e.preventDefault();
console.log(href);
window[m].setOverlay(id);
});

bindGeocoder();
Expand Down

0 comments on commit 55c48e6

Please sign in to comment.