Merge pull request #8 from mapbox/bin

Global binary

README.md

@@ -7,5 +7,12 @@ Watch MBTiles in your localhost
 ```bash
 % npm install
 % open http://localhost:9000
-% node server.js --mbtiles ~/foo.mbtiles --port 9000
+% node cli.js --mbtiles ~/foo.mbtiles --port 9000
+```
+
+Global install
+
+```bash
+% npm install -g mbview
+% mbview
 ```

cli.js

@@ -0,0 +1,34 @@
+#!/usr/bin/env node
+
+var argv = require('minimist')(process.argv.slice(2));
+var path = require('path');
+
+if (!argv.mbtiles) {
+    console.log(usage());
+    process.exit(1);
+}
+
+function usage () {
+    var text = [];
+    text.push('usage: node cli.js [options]');
+    text.push('');
+    text.push(' --mbtiles path to mbtiles file');
+    text.push(' --port sets port to use');
+    text.push(' --help prints this message');
+    text.push('');
+    return text.join('\n');
+}
+
+var MBView = require('./mbview');
+var params = {
+    center: argv.center || [-122.42, 37.75],
+    mbtiles: argv.mbtiles,
+    port: argv.port || 3000,
+    sourceLayer: argv.sourceLayer || path.basename(argv.mbtiles, '.mbtiles'),
+    sourceId: 'default',
+    zoom: 12
+};
+
+MBView.serve(params, function (err, config) {
+    console.log('Listening on http://localhost:' + config.port);
+});

mbview.js

@@ -0,0 +1,61 @@
+var express = require('express');
+var app = express();
+var MBTiles = require('mbtiles');
+
+app.set('view engine', 'ejs');
+app.use(express.static('public'));
+
+module.exports = {
+
+    /**
+     * Create a MBTiles interface, grab some metadata and spin up server.
+     * @param {Object} basic configuration, e.g. port
+     * @param {Function} a callback with the server configuration loaded
+     */
+    serve: function (config, callback) {
+        console.log('*** Reading from', config.mbtiles);
+        var listen = this.listen;
+
+        new MBTiles(config.mbtiles, function(err, tiles) {
+            if (err) throw err;
+            tiles.getInfo(function (err, data) {
+                if (err) throw err;
+                console.log('*** Metadata found in the MBTiles');
+                console.log(data);
+
+                config.zoom = data.center.pop();
+                config.center = data.center;
+                config.sourceId = data.id;
+                config.sourceLayer = data.vector_layers[0].id;
+
+                listen(config, tiles, callback);
+            });
+        });
+    },
+
+    listen: function (config, tiles, onListen) {
+        app.get('/', function (req, res) {
+            res.render('map', config);
+        });
+
+        app.get('/debug/:z/:x/:y.pbf', function (req, res) {
+            var p = req.params;
+            console.log('Serving', p.z + '/' + p.x + '/' + p.y);
+            tiles.getTile(p.z, p.x, p.y, function (err, tile, headers) {
+                if (err) {
+                    console.error(err);
+                    res.end();
+                } else {
+                    console.log(headers);
+                    res.writeHead(200, headers);
+                    res.end(tile);
+                }
+            });
+        });
+
+        app.listen(config.port, function () {
+            onListen(null, config);
+        });
+    }
+
+}

package.json

@@ -3,7 +3,7 @@
     "version": "1.0.0",
     "description": "Watch mbtiles in your localhost",
     "bin": {
-        "mbview": "./server.js"
+        "mbview": "./cli.js"
     },
     "main": "server.js",
     "scripts": {

views/map.ejs

@@ -19,23 +19,23 @@ mapboxgl.accessToken = 'pk.eyJ1Ijoicm9kb3dpIiwiYSI6ImdZdDkyQU0ifQ.bPu86kwHgaenPh
 var map = new mapboxgl.Map({
     container: 'map',
     style: 'mapbox://styles/mapbox/dark-v8',
-    center: [<%= config.center %>],
-    zoom: <%= config.zoom %>
+    center: [<%= center %>],
+    zoom: <%= zoom %>
 });
 map.on('load', function () {
     map.addSource('debug', {
         type: 'vector',
         tiles: [
-            'http://localhost:<%= config.port %>/debug/{z}/{x}/{y}.pbf'
+            'http://localhost:<%= port %>/debug/{z}/{x}/{y}.pbf'
         ],
         maxzoom: 12
     });
 
     map.addLayer({
-        'id': '<%= config.sourceId %>',
+        'id': '<%= sourceId %>',
         'type': 'line',
         'source': 'debug',
-        'source-layer': '<%= config.sourceLayer %>',
+        'source-layer': '<%= sourceLayer %>',
         'layout': {
             'line-join': 'round',
             'line-cap': 'round'