ingenieroariel/index.html

## index.html
<!DOCTYPE html>
<html>
<head>
  <script src='http://api.tiles.mapbox.com/mapbox.js/v0.6.6/mapbox.js'></script>
  <link href='http://api.tiles.mapbox.com/mapbox.js/v0.6.6/mapbox.css' rel='stylesheet' />
  <style>
    body { margin:0; padding:0; }
    #map { position:absolute; top:0; bottom:0; width:100%; }
  </style>
</head>
<body>
<div id='map'></div>
<script>
    var m = mapbox.map('map');
    MM.TMSTemplate = function(template, subdomains) {
        var hasSubdomains = (subdomains &&
            subdomains.length && template.indexOf("{S}") >= 0);

        var getTileUrl = function(coordinate) {
            var coord = this.sourceCoordinate(coordinate);
            if (!coord) { return null; }
            var base = template;
            console.log(Math.pow(2, coord.zoom));
            return base
                .replace('{Z}', coord.zoom.toFixed(0))
                .replace('{X}', coord.column.toFixed(0))
                .replace('{Y}', (1 << coord.zoom) - coord.row.toFixed(0) - 1);
        };

        MM.MapProvider.call(this, getTileUrl);
    };

    MM.TMSTemplate.prototype = {
        // quadKey generator
        getTile: function(coord) {
          return this.getTileUrl(coord);
        }
    };
    MM.extend(MM.TMSTemplate, MM.MapProvider);
    m.ui.hash.add();
    m.addLayer(mapbox.layer().url(''));
    m.ui.attribution.add()
        .content('Data by <a href="http://openstreetmap.org">OpenStreetMap</a>, under <a href="http://creativecommons.org/licenses/by-sa/3.0">CC BY SA</a>.');


    var l = new MM.Layer(new MM.TMSTemplate('http://ghslsys.jrc.ec.europa.eu/iq.php?layer=bu&x={X}&y={Y}&z={Z}'));
    m.addLayer(l);
    l.parent.style.opacity = '1';

    flood = mapbox.layer().id('gfdrr-labs.floods');
    m.addLayer(flood);
    flood.parent.style.opacity = '0.7';

    m.addLayer(mapbox.layer().id('mapbox.world-borders-light'));
    m.setZoomRange(6, 11);
    m.setPanLimits([{ lat: 0, lon: 0 }, { lat: 20, lon: 20 }]);
</script>
</body>
</html>
	<!DOCTYPE html>
	<html>
	<head>
	<script src='http://api.tiles.mapbox.com/mapbox.js/v0.6.6/mapbox.js'></script>
	<link href='http://api.tiles.mapbox.com/mapbox.js/v0.6.6/mapbox.css' rel='stylesheet' />
	<style>
	body { margin:0; padding:0; }
	#map { position:absolute; top:0; bottom:0; width:100%; }
	</style>
	</head>
	<body>
	<div id='map'></div>
	<script>
	var m = mapbox.map('map');
	MM.TMSTemplate = function(template, subdomains) {
	var hasSubdomains = (subdomains &&
	subdomains.length && template.indexOf("{S}") >= 0);

	var getTileUrl = function(coordinate) {
	var coord = this.sourceCoordinate(coordinate);
	if (!coord) { return null; }
	var base = template;
	console.log(Math.pow(2, coord.zoom));
	return base
	.replace('{Z}', coord.zoom.toFixed(0))
	.replace('{X}', coord.column.toFixed(0))
	.replace('{Y}', (1 << coord.zoom) - coord.row.toFixed(0) - 1);
	};

	MM.MapProvider.call(this, getTileUrl);
	};

	MM.TMSTemplate.prototype = {
	// quadKey generator
	getTile: function(coord) {
	return this.getTileUrl(coord);
	}
	};
	MM.extend(MM.TMSTemplate, MM.MapProvider);
	m.ui.hash.add();
	m.addLayer(mapbox.layer().url(''));
	m.ui.attribution.add()
	.content('Data by <a href="http://openstreetmap.org">OpenStreetMap</a>, under <a href="http://creativecommons.org/licenses/by-sa/3.0">CC BY SA</a>.');


	var l = new MM.Layer(new MM.TMSTemplate('http://ghslsys.jrc.ec.europa.eu/iq.php?layer=bu&x={X}&y={Y}&z={Z}'));
	m.addLayer(l);
	l.parent.style.opacity = '1';

	flood = mapbox.layer().id('gfdrr-labs.floods');
	m.addLayer(flood);
	flood.parent.style.opacity = '0.7';

	m.addLayer(mapbox.layer().id('mapbox.world-borders-light'));
	m.setZoomRange(6, 11);
	m.setPanLimits([{ lat: 0, lon: 0 }, { lat: 20, lon: 20 }]);
	</script>
	</body>
	</html>