tessel-map/index.js

minimal meta map framework

var sph = require('sphericalmercator'),
    mercator = new sph(),
    Coordinate = require('tessel-coordinate');

function template(str) {
    return function(t) {
        return str
            .replace(/\{z\}/g, t.zoom)
            .replace(/\{x\}/g, t.column)
            .replace(/\{y\}/g, t.row);
    };
}

module.exports.template = template;

module.exports.map = function() {
    var coord = new Coordinate(8, 8, 4),
        tileSize = [256, 256];
        dimensions = [500, 500];

    function pointCoordinate(point) {
        var c = coord.copy();
        c.column += (point[0] - dimensions[0] / 2) / tileSize[0];
        c.row += (point[1] - dimensions[1] / 2) / tileSize[1];
        return c;
    }

    function tilesVisible() {
        var start = pointCoordinate([0, 0]).zoomTo(coord.zoom).container(),
            end = pointCoordinate(dimensions).zoomTo(coord.zoom)
                .container().right().down(),
            i = start.copy(), coords = [];
        for (i.column = start.column; i.column < end.column; i.column++) {
            for (i.row = start.row; i.row < end.row; i.row++) coords.push(i.copy());
        }
        return coords;
    }

    var defaultTemplate = template('http://a.tiles.mapbox.com/v3/tmcw.map-1rgcfrpf/{z}/{x}/{y}.png');

    function tilesPositioned(tiles) {
        var center = [dimensions[0] / 2, dimensions[1] / 2];
        return tiles.map(function(t) {
            return {
                coord: t,
                dx: Math.round(center[0] + (t.column - coord.column) * tileSize[0]),
                dy: Math.round(center[1] + (t.row - coord.row) * tileSize[1]),
                src: defaultTemplate(t),
                w: tileSize[0],
                h: tileSize[1]
            };
        });
    }

    var map = {};

    map.template = function() {
        if (!arguments.length) return defaultTemplate;
        else {
            defaultTemplate = template(arguments[0]);
            return map;
        }
    };

    map.state = function() {
        return {
            tiles: tilesPositioned(tilesVisible()),
            dimensions: dimensions
        };
    };

    map.dimensions = function() {
        if (!arguments.length) return dimensions;
        else {
            dimensions = arguments[0];
            return map;
        }
    };

    map.zoom = function() {
        if (!arguments.length) return coord.zoom;
        else {
            coord = coord.zoomTo(+arguments[0]);
            return map;
        }
    };

    map.center = function() {
        if (!arguments.length) return dimensions;
        else {
            var cr = mercator.px(arguments[0].map(parseFloat), coord.zoom);
            coord.column = cr[0] / 256;
            coord.row = cr[1] / 256;
            return map;
        }
    };

    return map;
};