Bump to 1.1.13

Fixes incorrect dependency notation

CHANGELOG.md

@@ -1,3 +1,41 @@
+v1.1.2 (2015/11/22)
+-------------------
+
+* Update LICENSE and copyright notices
+
+v1.1.1 (2014/05/18)
+-------------------
+
+* Set `planetaryjs` on root when using AMD
+
+v1.1.0 (2014/02/03)
+-------------------
+
+**Core**
+
+* Add `stop` method
+* Add `onStop` hooks
+
+v1.0.3 (2014/01/23)
+-------------------
+
+* Don't disable adaptive resampling on the projection
+
+v1.0.2 (2014/01/16)
+-------------------
+
+* Update version dependencies for D3 and TopoJSON
+
+v1.0.1 (2013/01/02)
+-------------------
+
+* Add D3 and TopoJSON as dependencies in `package.json`
+
+v1.0.0 (2013/12/31)
+-------------------
+
+First stable release
+
 v1.0.0-rc.2 (2013/12/26)
 ------------------------
 

LICENSE

@@ -1,4 +1,4 @@
-Copyright (c) 2013 Brandon Tilley
+Copyright (c) 2013 Michelle Tilley
 
 Permission is hereby granted, free of charge, to any person
 obtaining a copy of this software and associated documentation

bower.json

@@ -1,10 +1,12 @@
 {
   "name": "planetary.js",
-  "version": "1.0.0-rc.2",
+  "version": "1.1.2",
   "main": "dist/planetaryjs.min.js",
   "description": "Awesome interactive globes for the web",
   "homepage": "http://planetaryjs.com",
-  "authors": [ "Brandon Tilley <brandon@brandontilley.com>" ],
+  "authors": [
+    "Michelle Tilley <michelle@michelletilley.net>"
+  ],
   "license": "MIT",
   "ignore": [
     ".git",
@@ -21,8 +23,10 @@
     "topojson": "1.x"
   },
   "keywords": [
-    "globe", "globes",
-    "planet", "planets",
+    "globe",
+    "globes",
+    "planet",
+    "planets",
     "d3",
     "topojson"
   ]

dist/planetaryjs-noplugins.js

@@ -1,12 +1,14 @@
-/*! Planetary.js v1.0.0-rc.2
- *  Copyright (c) 2013 Brandon Tilley
+/*! Planetary.js v1.1.3
+ *  Copyright (c) 2013 Michelle Tilley
  *
  *  Released under the MIT license
- *  Date: 2013-12-26T07:28:55.189Z
+ *  Date: 2018-10-30T18:49:58.804Z
  */
 (function (root, factory) {
   if (typeof define === 'function' && define.amd) {
-    define(['d3', 'topojson'], factory);
+    define(['d3', 'topojson'], function(d3, topojson) {
+      return (root.planetaryjs = factory(d3, topojson, root));
+    });
   } else if (typeof exports === 'object') {
     module.exports = factory(require('d3'), require('topojson'));
   } else {
@@ -21,6 +23,10 @@
 
   var doDrawLoop = function(planet, canvas, hooks) {
     d3.timer(function() {
+      if (planet.stopped) {
+        return true;
+      }
+
       planet.context.clearRect(0, 0, canvas.width, canvas.height);
       for (var i = 0; i < hooks.onDraw.length; i++) {
         hooks.onDraw[i]();
@@ -76,11 +82,14 @@
   };
 
   var startDraw = function(planet, canvas, localPlugins, hooks) {
-    initPlugins(planet, localPlugins);
-
     planet.canvas = canvas;
     planet.context = canvas.getContext('2d');
 
+    if (planet.stopped !== true) {
+      initPlugins(planet, localPlugins);
+    }
+
+    planet.stopped = false;
     runOnInitHooks(planet, canvas, hooks);
   };
 
@@ -100,7 +109,8 @@
       var localPlugins = [];
       var hooks = {
         onInit: [],
-        onDraw: []
+        onDraw: [],
+        onStop: []
       };
 
       var planet = {
@@ -118,10 +128,21 @@
           hooks.onDraw.push(fn);
         },
 
+        onStop: function(fn) {
+          hooks.onStop.push(fn);
+        },
+
         loadPlugin: function(plugin) {
           localPlugins.push(plugin);
         },
 
+        stop: function() {
+          planet.stopped = true;
+          for (var i = 0; i < hooks.onStop.length; i++) {
+            hooks.onStop[i](planet);
+          }
+        },
+
         withSavedContext: function(fn) {
           if (!this.context) {
             throw new Error("No canvas to fetch context for");
@@ -134,8 +155,7 @@
       };
 
       planet.projection = d3.geo.orthographic()
-        .clipAngle(90)
-        .precision(0);
+        .clipAngle(90);
       planet.path = d3.geo.path().projection(planet.projection);
 
       return planet;

dist/planetaryjs-noplugins.min.js

@@ -1,2 +1,2 @@
-/*! Planetary.js 1.0.0-rc.2 | (c) 2013 Brandon Tilley | Released under MIT License */
-!function(n,t){"function"==typeof define&&define.amd?define(["d3","topojson"],t):"object"==typeof exports?module.exports=t(require("d3"),require("topojson")):n.planetaryjs=t(n.d3,n.topojson,n)}(this,function(n,t,o){"use strict";var e=null;o&&(e=o.planetaryjs);var i=[],r=function(t,o,e){n.timer(function(){t.context.clearRect(0,0,o.width,o.height);for(var n=0;n<e.onDraw.length;n++)e.onDraw[n]()})},u=function(n,t){for(var o=i.length-1;o>=0;o--)t.unshift(i[o]);for(0===t.length&&(s.plugins.earth&&n.loadPlugin(s.plugins.earth()),s.plugins.pings&&n.loadPlugin(s.plugins.pings())),o=0;o<t.length;o++)t[o](n)},c=function(n,t,o){if(o.onInit.length){var e=0,i=function(n){var t=o.onInit[e];t.length?t(function(){e++,n()}):(t(),e++,setTimeout(n,0))},u=function(){e>=o.onInit.length?r(n,t,o):i(u)};i(u)}else r(n,t,o)},a=function(n,t,o,e){u(n,o),n.canvas=t,n.context=t.getContext("2d"),c(n,t,e)},s={plugins:{},noConflict:function(){return o.planetaryjs=e,s},loadPlugin:function(n){i.push(n)},planet:function(){var t=[],o={onInit:[],onDraw:[]},e={plugins:{},draw:function(n){a(e,n,t,o)},onInit:function(n){o.onInit.push(n)},onDraw:function(n){o.onDraw.push(n)},loadPlugin:function(n){t.push(n)},withSavedContext:function(n){if(!this.context)throw new Error("No canvas to fetch context for");this.context.save(),n(this.context),this.context.restore()}};return e.projection=n.geo.orthographic().clipAngle(90).precision(0),e.path=n.geo.path().projection(e.projection),e}};return s});
+/*! Planetary.js 1.1.3 | (c) 2013 Michelle Tilley | Released under MIT License */
+!function(n,t){"function"==typeof define&&define.amd?define(["d3","topojson"],function(o,e){return n.planetaryjs=t(o,e,n)}):"object"==typeof exports?module.exports=t(require("d3"),require("topojson")):n.planetaryjs=t(n.d3,n.topojson,n)}(this,function(n,t,o){"use strict";var e=null;o&&(e=o.planetaryjs);var i=[],r=function(t,o,e){n.timer(function(){if(t.stopped)return!0;t.context.clearRect(0,0,o.width,o.height);for(var n=0;n<e.onDraw.length;n++)e.onDraw[n]()})},u=function(n,t){for(var o=i.length-1;o>=0;o--)t.unshift(i[o]);for(0===t.length&&(s.plugins.earth&&n.loadPlugin(s.plugins.earth()),s.plugins.pings&&n.loadPlugin(s.plugins.pings())),o=0;o<t.length;o++)t[o](n)},p=function(n,t,o){if(o.onInit.length){var e=0,i=function(n){var t=o.onInit[e];t.length?t(function(){e++,n()}):(t(),e++,setTimeout(n,0))},u=function(){e>=o.onInit.length?r(n,t,o):i(u)};i(u)}else r(n,t,o)},c=function(n,t,o,e){n.canvas=t,n.context=t.getContext("2d"),n.stopped!==!0&&u(n,o),n.stopped=!1,p(n,t,e)},s={plugins:{},noConflict:function(){return o.planetaryjs=e,s},loadPlugin:function(n){i.push(n)},planet:function(){var t=[],o={onInit:[],onDraw:[],onStop:[]},e={plugins:{},draw:function(n){c(e,n,t,o)},onInit:function(n){o.onInit.push(n)},onDraw:function(n){o.onDraw.push(n)},onStop:function(n){o.onStop.push(n)},loadPlugin:function(n){t.push(n)},stop:function(){e.stopped=!0;for(var n=0;n<o.onStop.length;n++)o.onStop[n](e)},withSavedContext:function(n){if(!this.context)throw new Error("No canvas to fetch context for");this.context.save(),n(this.context),this.context.restore()}};return e.projection=n.geo.orthographic().clipAngle(90),e.path=n.geo.path().projection(e.projection),e}};return s});

dist/planetaryjs.js

@@ -1,12 +1,14 @@
-/*! Planetary.js v1.0.0-rc.2
- *  Copyright (c) 2013 Brandon Tilley
+/*! Planetary.js v1.1.3
+ *  Copyright (c) 2013 Michelle Tilley
  *
  *  Released under the MIT license
- *  Date: 2013-12-26T07:28:54.997Z
+ *  Date: 2018-10-30T18:49:58.667Z
  */
 (function (root, factory) {
   if (typeof define === 'function' && define.amd) {
-    define(['d3', 'topojson'], factory);
+    define(['d3', 'topojson'], function(d3, topojson) {
+      return (root.planetaryjs = factory(d3, topojson, root));
+    });
   } else if (typeof exports === 'object') {
     module.exports = factory(require('d3'), require('topojson'));
   } else {
@@ -21,6 +23,10 @@
 
   var doDrawLoop = function(planet, canvas, hooks) {
     d3.timer(function() {
+      if (planet.stopped) {
+        return true;
+      }
+
       planet.context.clearRect(0, 0, canvas.width, canvas.height);
       for (var i = 0; i < hooks.onDraw.length; i++) {
         hooks.onDraw[i]();
@@ -76,11 +82,14 @@
   };
 
   var startDraw = function(planet, canvas, localPlugins, hooks) {
-    initPlugins(planet, localPlugins);
-
     planet.canvas = canvas;
     planet.context = canvas.getContext('2d');
 
+    if (planet.stopped !== true) {
+      initPlugins(planet, localPlugins);
+    }
+
+    planet.stopped = false;
     runOnInitHooks(planet, canvas, hooks);
   };
 
@@ -100,7 +109,8 @@
       var localPlugins = [];
       var hooks = {
         onInit: [],
-        onDraw: []
+        onDraw: [],
+        onStop: []
       };
 
       var planet = {
@@ -118,10 +128,21 @@
           hooks.onDraw.push(fn);
         },
 
+        onStop: function(fn) {
+          hooks.onStop.push(fn);
+        },
+
         loadPlugin: function(plugin) {
           localPlugins.push(plugin);
         },
 
+        stop: function() {
+          planet.stopped = true;
+          for (var i = 0; i < hooks.onStop.length; i++) {
+            hooks.onStop[i](planet);
+          }
+        },
+
         withSavedContext: function(fn) {
           if (!this.context) {
             throw new Error("No canvas to fetch context for");
@@ -134,8 +155,7 @@
       };
 
       planet.projection = d3.geo.orthographic()
-        .clipAngle(90)
-        .precision(0);
+        .clipAngle(90);
       planet.path = d3.geo.path().projection(planet.projection);
 
       return planet;

dist/planetaryjs.min.js

@@ -1,2 +1,2 @@
-/*! Planetary.js 1.0.0-rc.2 | (c) 2013 Brandon Tilley | Released under MIT License */
-!function(n,t){"function"==typeof define&&define.amd?define(["d3","topojson"],t):"object"==typeof exports?module.exports=t(require("d3"),require("topojson")):n.planetaryjs=t(n.d3,n.topojson,n)}(this,function(n,t,o){"use strict";var i=null;o&&(i=o.planetaryjs);var e=[],r=function(t,o,i){n.timer(function(){t.context.clearRect(0,0,o.width,o.height);for(var n=0;n<i.onDraw.length;n++)i.onDraw[n]()})},l=function(n,t){for(var o=e.length-1;o>=0;o--)t.unshift(e[o]);for(0===t.length&&(u.plugins.earth&&n.loadPlugin(u.plugins.earth()),u.plugins.pings&&n.loadPlugin(u.plugins.pings())),o=0;o<t.length;o++)t[o](n)},a=function(n,t,o){if(o.onInit.length){var i=0,e=function(n){var t=o.onInit[i];t.length?t(function(){i++,n()}):(t(),i++,setTimeout(n,0))},l=function(){i>=o.onInit.length?r(n,t,o):e(l)};e(l)}else r(n,t,o)},c=function(n,t,o,i){l(n,o),n.canvas=t,n.context=t.getContext("2d"),a(n,t,i)},u={plugins:{},noConflict:function(){return o.planetaryjs=i,u},loadPlugin:function(n){e.push(n)},planet:function(){var t=[],o={onInit:[],onDraw:[]},i={plugins:{},draw:function(n){c(i,n,t,o)},onInit:function(n){o.onInit.push(n)},onDraw:function(n){o.onDraw.push(n)},loadPlugin:function(n){t.push(n)},withSavedContext:function(n){if(!this.context)throw new Error("No canvas to fetch context for");this.context.save(),n(this.context),this.context.restore()}};return i.projection=n.geo.orthographic().clipAngle(90).precision(0),i.path=n.geo.path().projection(i.projection),i}};return u.plugins.topojson=function(t){return function(o){o.plugins.topojson={},o.onInit(function(i){if(t.world)o.plugins.topojson.world=t.world,setTimeout(i,0);else{var e=t.file||"world-110m.json";n.json(e,function(n,t){if(n)throw new Error("Could not load JSON "+e);o.plugins.topojson.world=t,i()})}})}},u.plugins.oceans=function(n){return function(t){t.onDraw(function(){t.withSavedContext(function(o){o.beginPath(),t.path.context(o)({type:"Sphere"}),o.fillStyle=n.fill||"black",o.fill()})})}},u.plugins.land=function(n){return function(o){var i=null;o.onInit(function(){var n=o.plugins.topojson.world;i=t.feature(n,n.objects.land)}),o.onDraw(function(){o.withSavedContext(function(t){t.beginPath(),o.path.context(t)(i),n.fill!==!1&&(t.fillStyle=n.fill||"white",t.fill()),n.stroke&&(n.lineWidth&&(t.lineWidth=n.lineWidth),t.strokeStyle=n.stroke,t.stroke())})})}},u.plugins.borders=function(n){return function(o){var i=null,e={internal:function(n,t){return n.id!==t.id},external:function(n,t){return n.id===t.id},both:function(){return!0}};o.onInit(function(){var r=o.plugins.topojson.world,l=r.objects.countries,a=n.type||"internal";i=t.mesh(r,l,e[a])}),o.onDraw(function(){o.withSavedContext(function(t){t.beginPath(),o.path.context(t)(i),t.strokeStyle=n.stroke||"gray",n.lineWidth&&(t.lineWidth=n.lineWidth),t.stroke()})})}},u.plugins.earth=function(n){n=n||{};var t=n.topojson||{},o=n.oceans||{},i=n.land||{},e=n.borders||{};return function(n){u.plugins.topojson(t)(n),u.plugins.oceans(o)(n),u.plugins.land(i)(n),u.plugins.borders(e)(n)}},u.plugins.pings=function(t){var o=[];t=t||{};var i=function(n,i,e){e=e||{},e.color=e.color||t.color||"white",e.angle=e.angle||t.angle||5,e.ttl=e.ttl||t.ttl||2e3;var r={time:new Date,options:e};t.latitudeFirst?(r.lat=n,r.lng=i):(r.lng=n,r.lat=i),o.push(r)},e=function(n,t,i){for(var e=[],l=0;l<o.length;l++){var a=o[l],c=i-a.time;c<a.options.ttl&&(e.push(a),r(n,t,i,c,a))}o=e},r=function(t,o,i,e,r){var l=1-e/r.options.ttl,a=n.rgb(r.options.color);a="rgba("+a.r+","+a.g+","+a.b+","+l+")",o.strokeStyle=a;var c=n.geo.circle().origin([r.lng,r.lat]).angle(e/r.options.ttl*r.options.angle)();o.beginPath(),t.path.context(o)(c),o.stroke()};return function(n){n.plugins.pings={add:i},n.onDraw(function(){var t=new Date;n.withSavedContext(function(o){e(n,o,t)})})}},u.plugins.zoom=function(t){t=t||{};var o=function(){},i=t.onZoomStart||o,e=t.onZoomEnd||o,r=t.onZoom||o,l=t.afterZoom||o,a=t.initialScale,c=t.scaleExtent||[50,2e3];return function(t){t.onInit(function(){var o=n.behavior.zoom().scaleExtent(c);null!==a&&void 0!==a?o.scale(a):o.scale(t.projection.scale()),o.on("zoomstart",i.bind(t)).on("zoomend",e.bind(t)).on("zoom",function(){r.call(t),t.projection.scale(n.event.scale),l.call(t)}),n.select(t.canvas).call(o)})}},u.plugins.drag=function(t){t=t||{};var o=function(){},i=t.onDragStart||o,e=t.onDragEnd||o,r=t.onDrag||o,l=t.afterDrag||o;return function(t){t.onInit(function(){var o=n.behavior.drag().on("dragstart",i.bind(t)).on("dragend",e.bind(t)).on("drag",function(){r.call(t);var o=n.event.dx,i=n.event.dy,e=t.projection.rotate(),a=t.projection.scale(),c=n.scale.linear().domain([-1*a,a]).range([-90,90]),u=c(o),s=c(i);e[0]+=u,e[1]-=s,e[1]>90&&(e[1]=90),e[1]<-90&&(e[1]=-90),e[0]>=180&&(e[0]-=360),t.projection.rotate(e),l.call(t)});n.select(t.canvas).call(o)})}},u});
+/*! Planetary.js 1.1.3 | (c) 2013 Michelle Tilley | Released under MIT License */
+!function(n,t){"function"==typeof define&&define.amd?define(["d3","topojson"],function(o,e){return n.planetaryjs=t(o,e,n)}):"object"==typeof exports?module.exports=t(require("d3"),require("topojson")):n.planetaryjs=t(n.d3,n.topojson,n)}(this,function(n,t,o){"use strict";var e=null;o&&(e=o.planetaryjs);var i=[],r=function(t,o,e){n.timer(function(){if(t.stopped)return!0;t.context.clearRect(0,0,o.width,o.height);for(var n=0;n<e.onDraw.length;n++)e.onDraw[n]()})},l=function(n,t){for(var o=i.length-1;o>=0;o--)t.unshift(i[o]);for(0===t.length&&(c.plugins.earth&&n.loadPlugin(c.plugins.earth()),c.plugins.pings&&n.loadPlugin(c.plugins.pings())),o=0;o<t.length;o++)t[o](n)},a=function(n,t,o){if(o.onInit.length){var e=0,i=function(n){var t=o.onInit[e];t.length?t(function(){e++,n()}):(t(),e++,setTimeout(n,0))},l=function(){e>=o.onInit.length?r(n,t,o):i(l)};i(l)}else r(n,t,o)},u=function(n,t,o,e){n.canvas=t,n.context=t.getContext("2d"),n.stopped!==!0&&l(n,o),n.stopped=!1,a(n,t,e)},c={plugins:{},noConflict:function(){return o.planetaryjs=e,c},loadPlugin:function(n){i.push(n)},planet:function(){var t=[],o={onInit:[],onDraw:[],onStop:[]},e={plugins:{},draw:function(n){u(e,n,t,o)},onInit:function(n){o.onInit.push(n)},onDraw:function(n){o.onDraw.push(n)},onStop:function(n){o.onStop.push(n)},loadPlugin:function(n){t.push(n)},stop:function(){e.stopped=!0;for(var n=0;n<o.onStop.length;n++)o.onStop[n](e)},withSavedContext:function(n){if(!this.context)throw new Error("No canvas to fetch context for");this.context.save(),n(this.context),this.context.restore()}};return e.projection=n.geo.orthographic().clipAngle(90),e.path=n.geo.path().projection(e.projection),e}};return c.plugins.topojson=function(t){return function(o){o.plugins.topojson={},o.onInit(function(e){if(t.world)o.plugins.topojson.world=t.world,setTimeout(e,0);else{var i=t.file||"world-110m.json";n.json(i,function(n,t){if(n)throw new Error("Could not load JSON "+i);o.plugins.topojson.world=t,e()})}})}},c.plugins.oceans=function(n){return function(t){t.onDraw(function(){t.withSavedContext(function(o){o.beginPath(),t.path.context(o)({type:"Sphere"}),o.fillStyle=n.fill||"black",o.fill()})})}},c.plugins.land=function(n){return function(o){var e=null;o.onInit(function(){var n=o.plugins.topojson.world;e=t.feature(n,n.objects.land)}),o.onDraw(function(){o.withSavedContext(function(t){t.beginPath(),o.path.context(t)(e),n.fill!==!1&&(t.fillStyle=n.fill||"white",t.fill()),n.stroke&&(n.lineWidth&&(t.lineWidth=n.lineWidth),t.strokeStyle=n.stroke,t.stroke())})})}},c.plugins.borders=function(n){return function(o){var e=null,i={internal:function(n,t){return n.id!==t.id},external:function(n,t){return n.id===t.id},both:function(){return!0}};o.onInit(function(){var r=o.plugins.topojson.world,l=r.objects.countries,a=n.type||"internal";e=t.mesh(r,l,i[a])}),o.onDraw(function(){o.withSavedContext(function(t){t.beginPath(),o.path.context(t)(e),t.strokeStyle=n.stroke||"gray",n.lineWidth&&(t.lineWidth=n.lineWidth),t.stroke()})})}},c.plugins.earth=function(n){n=n||{};var t=n.topojson||{},o=n.oceans||{},e=n.land||{},i=n.borders||{};return function(n){c.plugins.topojson(t)(n),c.plugins.oceans(o)(n),c.plugins.land(e)(n),c.plugins.borders(i)(n)}},c.plugins.pings=function(t){var o=[];t=t||{};var e=function(n,e,i){i=i||{},i.color=i.color||t.color||"white",i.angle=i.angle||t.angle||5,i.ttl=i.ttl||t.ttl||2e3;var r={time:new Date,options:i};t.latitudeFirst?(r.lat=n,r.lng=e):(r.lng=n,r.lat=e),o.push(r)},i=function(n,t,e){for(var i=[],l=0;l<o.length;l++){var a=o[l],u=e-a.time;u<a.options.ttl&&(i.push(a),r(n,t,e,u,a))}o=i},r=function(t,o,e,i,r){var l=1-i/r.options.ttl,a=n.rgb(r.options.color);a="rgba("+a.r+","+a.g+","+a.b+","+l+")",o.strokeStyle=a;var u=n.geo.circle().origin([r.lng,r.lat]).angle(i/r.options.ttl*r.options.angle)();o.beginPath(),t.path.context(o)(u),o.stroke()};return function(n){n.plugins.pings={add:e},n.onDraw(function(){var t=new Date;n.withSavedContext(function(o){i(n,o,t)})})}},c.plugins.zoom=function(t){t=t||{};var o=function(){},e=t.onZoomStart||o,i=t.onZoomEnd||o,r=t.onZoom||o,l=t.afterZoom||o,a=t.initialScale,u=t.scaleExtent||[50,2e3];return function(t){t.onInit(function(){var o=n.behavior.zoom().scaleExtent(u);null!==a&&void 0!==a?o.scale(a):o.scale(t.projection.scale()),o.on("zoomstart",e.bind(t)).on("zoomend",i.bind(t)).on("zoom",function(){r.call(t),t.projection.scale(n.event.scale),l.call(t)}),n.select(t.canvas).call(o)})}},c.plugins.drag=function(t){t=t||{};var o=function(){},e=t.onDragStart||o,i=t.onDragEnd||o,r=t.onDrag||o,l=t.afterDrag||o;return function(t){t.onInit(function(){var o=n.behavior.drag().on("dragstart",e.bind(t)).on("dragend",i.bind(t)).on("drag",function(){r.call(t);var o=n.event.dx,e=n.event.dy,i=t.projection.rotate(),a=t.projection.scale(),u=n.scale.linear().domain([-1*a,a]).range([-90,90]),c=u(o),s=u(e);i[0]+=c,i[1]-=s,i[1]>90&&(i[1]=90),i[1]<-90&&(i[1]=-90),i[0]>=180&&(i[0]-=360),t.projection.rotate(i),l.call(t)});n.select(t.canvas).call(o)})}},c});

gulpfile.js

@@ -4,16 +4,18 @@ var concat = require('gulp-concat');
 var rename = require('gulp-rename');
 var header = require('gulp-header');
 var jshint = require('gulp-jshint');
+var replace = require('gulp-replace');
 var metadata = require('./package.json');
 
-var shortHeader = "/*! Planetary.js {{version}} | (c) 2013 Brandon Tilley | Released under MIT License */"
+var shortHeader = "/*! Planetary.js <%= version %> | (c) 2013 Michelle Tilley | Released under MIT License */\n"
 var fullHeader = [
-  "/*! Planetary.js v{{version}}",
-  " *  Copyright (c) 2013 Brandon Tilley",
+  "/*! Planetary.js v<%= version %>",
+  " *  Copyright (c) 2013 Michelle Tilley",
   " *",
   " *  Released under the MIT license",
-  " *  Date: {{now}}",
-  " */"
+  " *  Date: <%= new Date().toISOString() %>",
+  " */",
+  ""
 ].join("\n");
 
 var fullSource = gulp.src(['./src/_umd_header.js', './src/body.js', './src/plugins.js', './src/_umd_footer.js']);
@@ -23,7 +25,7 @@ function build(source, name, headerText, minify) {
   var js = source.pipe(concat(name));
   if (minify) { js = js.pipe(uglify()); }
   js = js.pipe(header(headerText, { version: metadata.version }));
-  js.pipe(gulp.dest('./dist'));
+  js.pipe(replace("\r\n", "\n")).pipe(gulp.dest('./dist'));
 }
 
 gulp.task('jshint', function() {
@@ -41,7 +43,4 @@ gulp.task('build', function() {
   gulp.src('./src/world-110m.json').pipe(gulp.dest('./dist'));
 });
 
-gulp.task('default', function() {
-  gulp.run('jshint');
-  gulp.run('build');
-});
+gulp.task('default', ['jshint', 'build']);

package.json

@@ -1,7 +1,8 @@
 {
   "name": "planetary.js",
-  "version": "1.0.0-rc.2",
+  "version": "1.1.3",
   "description": "Awesome interactive globes for the web",
+  "main": "dist/planetaryjs",
   "scripts": {
     "build": "rm -r dist/ ; gulp && cp dist/planetaryjs.min.js site/public/js/lib",
     "jshint": "gulp jshint",
@@ -11,19 +12,24 @@
     "type": "git",
     "url": "git://github.com/BinaryMuse/planetary.js.git"
   },
-  "author": "Brandon Tilley <brandon@brandontilley.com>",
+  "author": "Michelle Tilley <michelle@michelletilley.net>",
   "license": "MIT",
   "bugs": {
     "url": "https://github.com/BinaryMuse/planetary.js/issues"
   },
   "homepage": "http://planetaryjs.com",
   "devDependencies": {
-    "gulp": "~3.2.0",
+    "gulp": "~3.6.2",
     "gulp-concat": "BinaryMuse/gulp-concat",
-    "gulp-header": "~0.4.0",
-    "gulp-uglify": "~0.1.0",
-    "gulp-rename": "~0.2.1",
+    "gulp-header": "~1.0.2",
+    "gulp-uglify": "~0.3.0",
+    "gulp-rename": "~1.2.0",
     "bower": "~1.2.8",
-    "gulp-jshint": "~1.3.1"
+    "gulp-jshint": "~1.6.1",
+    "gulp-replace": "~0.3.0"
+  },
+  "dependencies": {
+    "topojson": "^1.4.6",
+    "d3": "^3.3.13"
   }
 }

script/set-version

@@ -0,0 +1,39 @@
+#!/usr/bin/env node
+
+var fs = require('fs');
+var spawn = require('child_process').spawn;
+
+var type    = process.argv[2];
+var version = process.argv[3];
+
+if ("stable" !== type && "unstable" !== type) {
+  console.log("You must specify 'stable' or 'unstable' version type.");
+  process.exit(1);
+}
+
+if (!version) {
+  console.log("You must specify a version.");
+  process.exit(1);
+}
+
+if (version[0] === 'v') {
+  version = version.replace(/^v/, '');
+}
+
+var package = require("../package.json");
+var bower   = require("../bower.json");
+var site    = require("../site/public/download/_data.json");
+
+package.version = version;
+bower.version = version;
+
+site[type].latest = site[type].latest || {};
+site[type].latest.version = "v" + version;
+
+fs.writeFileSync('package.json', JSON.stringify(package, null, '  ') + "\n");
+fs.writeFileSync('bower.json', JSON.stringify(bower, null, '  ') + "\n");
+fs.writeFileSync('site/public/download/_data.json', JSON.stringify(site, null, '  ') + "\n");
+
+spawn('npm', ['run', 'build']);
+
+console.log("Tasks:\n\n - Update CHANGELOG.md\n - Regenerate site\n - Create release on GH");

site/package.json

@@ -9,7 +9,7 @@
     "start": "harp server",
     "compile": "harp compile"
   },
-  "author": "Brandon Tilley <brandon@brandontilley.com>",
+  "author": "Michelle Tilley <michelle@michelletilley.net>",
   "license": "MIT",
   "private": true,
   "dependencies": {

site/public/_header.ejs

@@ -3,6 +3,8 @@
 <link type="text/css" rel="stylesheet" href="/semantic/css/semantic.min.css">
 <link type="text/css" rel="stylesheet" href="/css/planetaryjs.css">
 
-<meta charset="utf-8" />
-<meta name="viewport" content="width=device-width, initial-scale=1.0" />
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1.0">
 <meta content="IE=edge,chrome=1" http-equiv="X-UA-Compatible">
+<meta property="og:image" content="http://planetaryjs.com/images/ex-rotating.png">
+<meta property="og:site_name" content="Planetary.js">

site/public/_menu.ejs

@@ -13,7 +13,8 @@
     <a class='item minor <%- current.path[0] == 'documentation' ? 'active' : '' %>' href='/documentation/'>
       <i class='book icon'></i><span class='hide-on-mobile'>Documentation</span>
     </a>
-    <a class='item minor' href='https://github.com/BinaryMuse/planetary.js'>
+    <a class='item minor' href='https://github.com/BinaryMuse/planetary.js'
+      onclick="_gaq.push(['_trackPageview', '/redirect-to-github-project-page']);">
       <i class='github alternate icon'></i><span class='hide-on-mobile'>Fork on GitHub</span>
     </a>
   </div>

site/public/amd/_layout.ejs

@@ -0,0 +1,10 @@
+<html>
+<head>
+  <title>Planetary.js AMD Test</title>
+</head>
+<body>
+  <canvas id='globe' width='500' height='500'></canavs>
+  <script src="//cdnjs.cloudflare.com/ajax/libs/require.js/2.1.9/require.min.js"
+    data-main="/amd/test.js"></script>
+</body>
+</html>

site/public/amd/test.js

@@ -0,0 +1,24 @@
+requirejs.config({
+  baseUrl: '/js/lib',
+  shim: {
+    d3: { exports: 'd3' },
+    topojson: { exports: 'topojson' }
+  },
+  paths: {
+    "d3": 'd3.v3.min',
+    "topojson": 'topojson.v1.min'
+  }
+});
+
+requirejs(['planetaryjs.min'], function(planetaryjs) {
+  var planet = planetaryjs.planet();
+  // You can remove this statement if `world-110m.json`
+  // is in the same path as the HTML page:
+  planet.loadPlugin(planetaryjs.plugins.earth({
+    topojson: { file: '/world-110m.json' }
+  }));
+  // Make the planet fit well in its canvas
+  planet.projection.scale(250).translate([250, 250]);
+  var canvas = document.getElementById('globe');
+  planet.draw(canvas);
+});

site/public/css/planetaryjs.less

@@ -152,6 +152,13 @@ canvas#homepage-globe-canvas {
   img {
     width: 200px;
     height: 200px;
+    float: left;
+    margin-right: 20px;
+
+    @media screen and (max-width: 768px) {
+      display: block;
+      float: none;
+    }
   }
 }
 

site/public/css/prism.css

@@ -29,13 +29,13 @@ pre[class*="language-"] {
 pre[class*="language-"]::-moz-selection, pre[class*="language-"] ::-moz-selection,
 code[class*="language-"]::-moz-selection, code[class*="language-"] ::-moz-selection {
 	text-shadow: none;
-	/* background: #b3d4fc; */
+	 background: #b3d4fc;
 }
 
 pre[class*="language-"]::selection, pre[class*="language-"] ::selection,
 code[class*="language-"]::selection, code[class*="language-"] ::selection {
 	text-shadow: none;
-	/* background: #b3d4fc; */
+	 background: #b3d4fc;
 }
 
 @media print {

site/public/documentation/_layout.ejs

@@ -15,6 +15,10 @@
             Introduction
             <i class='icon home'></i>
           </a>
+          <a class='purple item <%- current.source == 'installation' ? 'active' : '' %>' href='/documentation/installation.html'>
+            Installation
+            <i class='icon download'></i>
+          </a>
           <a class='blue item <%- current.source == 'core' ? 'active' : '' %>' href='/documentation/core.html'>
             Core API
             <i class='icon setting'></i>

site/public/documentation/builtin_borders.md

@@ -1,7 +1,7 @@
 Borders Plugin
 ==============
 
-The `borders` plugin renders the borders around (and between) countries. It uses TopoJSON data published to `planet.plugins.topojson.world` by the [TopoJSON plugin](/documentation/builtin_topojson.html).
+The `borders` plugin renders the borders around (and between) countries. It uses TopoJSON data published to `planet.plugins.topojson.world` by the [TopoJSON plugin](/documentation/builtin_topojson.html). It uses the feature at `objects.countries` in the TopoJSON object to calculate the borders.
 
 API
 ---

site/public/documentation/builtin_land.md

@@ -1,7 +1,7 @@
 Land Plugin
 ===========
 
-The `land` plugin renders Earth's landmasses. It uses TopoJSON data published to `planet.plugins.topojson.world` by the [TopoJSON plugin](/documentation/builtin_topojson.html).
+The `land` plugin renders Earth's landmasses. It uses TopoJSON data published to `planet.plugins.topojson.world` by the [TopoJSON plugin](/documentation/builtin_topojson.html). It uses the feature at `objects.land` in the TopoJSON object.
 
 API
 ---

site/public/documentation/core.md

@@ -1,28 +1,6 @@
 Core API
 ========
 
-Installation
-------------
-
-Once you've [downloaded Planetary.js](/download/), you can include it via a `script` tag on your page *after* the inclusion of D3 and TopoJSON. This example uses the CDN URLs for those libraries:
-
-<div class='ui raised segment'>
-<div class='ui blue ribbon label'>HTML</div>
-
-```html
-<html>
-<head>
-  <script type='text/javascript' src='http://d3js.org/d3.v3.min.js'></script>
-  <script type='text/javascript' src='http://d3js.org/topojson.v1.min.js'></script>
-  <script type='text/javascript' src='path/to/planetaryjs.min.js'></script>
-</head>
-<body>
-...
-```
-</div>
-
-If you use the default `topojson` plugin (most people will), you'll also need to make sure `world-110m.json` (or some other TopoJSON data file) is available on your server. This file is also available from [the download page](/download/). See the [TopoJSON Plugin documentation](/documentation/builtin_topojson.html) for more information.
-
 Core API
 --------
 

site/public/documentation/faq.md

@@ -44,4 +44,4 @@ planet's `draw` method.
 
 **Q:** I'm getting "Cannot read property 'geo' of undefined" or "Cannot call method 'feature' of undefined."
 
-**A:** Ensure you're requiring the [D3](http://d3js.org/) and [TopoJSON](https://github.com/mbostock/topojson) libraries before Planetary.js
+**A:** Ensure you're requiring the [D3](http://d3js.org/) and [TopoJSON](https://github.com/mbostock/topojson) libraries before Planetary.js.

site/public/documentation/index.md

@@ -15,7 +15,7 @@ The documentation is split up into several sections:
 Quick Start
 -----------
 
-If you want to get up-and-running quickly, or like to experiment and figure things out, you can use this HTML and JavaScript to get a very simple globe up and running.
+If you want to get up-and-running quickly, or like to experiment and figure things out, you can use this HTML and JavaScript to get a very simple globe up and running (once you've [installed Planetary.js](/documentation/installation.html)).
 
 Note that you'll need to run this page from a web server of some kind so that Planetary.js can load the TopoJSON data via Ajax (Ajax requests don't work when viewing a page directly from the filesystem).
 

site/public/documentation/installation.md

@@ -0,0 +1,97 @@
+Installation
+============
+
+Once you've [downloaded Planetary.js](/download/), you can include it via a `script` tag on your page *after* the inclusion of D3 and TopoJSON. This example uses the CDN URLs for those libraries:
+
+<div class='ui raised segment'>
+<div class='ui blue ribbon label'>HTML</div>
+
+```html
+<html>
+<head>
+  <script type='text/javascript' src='http://d3js.org/d3.v3.min.js'></script>
+  <script type='text/javascript' src='http://d3js.org/topojson.v1.min.js'></script>
+  <script type='text/javascript' src='path/to/planetaryjs.min.js'></script>
+</head>
+<body>
+...
+```
+</div>
+
+If you use the default `topojson` plugin (most people will), you'll also need to make sure `world-110m.json` (or some other TopoJSON data file) is available on your server. This file is also available from [the download page](/download/). See the [TopoJSON Plugin documentation](/documentation/builtin_topojson.html) for more information.
+
+Planetary.js also supports installation via AMD and CommonJS loaders.
+
+AMD
+---
+
+This example uses [RequireJS](http://requirejs.org/). Since neither D3 nor TopoJSON support AMD, we will use RequireJS's [shim configuration](http://requirejs.org/docs/api.html#config-shim).
+
+<div class='ui raised segment'>
+<div class='ui blue ribbon label'>HTML</div>
+
+```html
+<body>
+  <canvas id='globe' width='500' height='500'></canavs>
+  <script src='//cdnjs.cloudflare.com/ajax/libs/require.js/2.1.9/require.min.js'
+    data-main='/app.js'></script>
+</body>
+```
+
+<div class='ui red ribbon label'>JavaScript</div>
+
+```javascript
+requirejs.config({
+  // Tell RequireJS to use `window.d3` and `window.topojson`
+  // for those libraries, respectively
+  shim: {
+    d3: { exports: 'd3' },
+    topojson: { exports: 'topojson' }
+  },
+  paths: {
+    'd3': 'path/to/d3.v3.min',
+    'topojson': 'path/to/topojson.v1.min'
+  }
+});
+
+requirejs(['planetaryjs'], function(planetaryjs) {
+  // Use Planetary.js here
+});
+
+```
+</div>
+
+CommonJS
+--------
+
+First, install `browserify` from npm (as well as `planetary.js` v1.0.2+, if you haven't already). Then, create your application (here referred to as `app.js`) and bundle it with browserify.
+
+<div class='ui raised segment'>
+<div class='ui red ribbon label'>JavaScript</div>
+
+```javascript
+var planetaryjs = require('planetary.js');
+
+var planet = planetaryjs.planet();
+var canvas = document.getElementById('canvas');
+planet.draw(canvas);
+```
+
+<div class='ui purple ribbon label'>Shell</div>
+
+```shell
+$ npm install browserify
+$ ./node_modules/.bin/browserify app.js > bundle.js
+```
+</div>
+
+`bundle.js` is now ready to use! You may need to set the `charset` option on your script tag:
+
+
+<div class='ui raised segment'>
+<div class='ui blue ribbon label'>HTML</div>
+
+```html
+<script type='text/javascript' src='bundle.js' charset='utf-8'></script>
+```
+</div>

site/public/documentation/planet.md

@@ -94,6 +94,24 @@ planet.onDraw(function() {
 ```
 </div>
 
+**`planet.onStop( function(){} )`**
+
+Registers a function to be called when the planet is stopped with the `stop` method. This can be used to clean up timers and remove references to internal planet properties and plugins, if necessary, so that it can be property garbage collected.
+
+<div class='ui raised segment'>
+<div class='ui red ribbon label'>JavaScript</div>
+
+```javascript
+var interval = setInterval(function() {
+  addRandomPing(planet); // uses `planet.plugins.pings`
+}, 150);
+
+planet.onStop(function() {
+  clearInterval(interval);
+});
+```
+</div>
+
 **`planet.withSavedContext( function(context){} )`**
 
 Calls the function with the current canvas context as a parameter, wrapping the function call in `context.save()` and `context.restore()`. Use this function any time you're going to modify the context to ensure it gets put back to the way it was.
@@ -119,7 +137,7 @@ Begins drawing the globe onto the given canvas. `canvas` should be a raw DOM ele
 
 Calling `draw` will perform the following operations:
 
-1. Initialize each loaded plugin by calling the plugin function.
+1. Initialize each loaded plugin by calling the plugin function (note: this only happens the first time you call `draw`).
 2. Set `planet.canvas` and `planet.context` to the canvas and the canvas' context, respectively.
 3. Run each registered `onInit` hook in the order it was registered (note that `onInit` calls made by plugins will not be made until step 1, after `draw` has been called).
 4. Start the animation loop, each tick clearing the canvas and calling any registered `onDraw` hooks in order.
@@ -138,3 +156,21 @@ var canvas = document.getElementById('myCanvas');
 planet.draw(canvas);
 ```
 </div>
+
+Once you've called `draw()` on a planet, you should not call it again unless you first call `stop()`.
+
+**`planet.stop()`**
+
+Stop drawing the planet to the canvas. This disables the internal draw loop. You can register functions to call when the planet is stopped using the `onStop` method; if you don't plan on reusing the planet, be sure to clean up timers and references to internal properties, if necessary, so that it can be garbage collected.
+
+You can draw the planet to a new (or the same) canvas using the `draw` method as normal. All your plugins' `onInit` functions will fire, although the plugin function itself will not be called again.
+
+Keep in mind that, since the internal draw loop is stopped, your plugins' `onDraw` functions are not being called. If you have timers or other mechanisms that continually push data into a data structure that an `onDraw` method cleans up, you should disable or pause it.
+
+<div class='ui raised segment'>
+<div class='ui red ribbon label'>JavaScript</div>
+
+```javascript
+planet.stop();
+```
+</div>

site/public/download/_data.json

@@ -1,11 +1,12 @@
 {
   "stable": {
-    "latest": null
+    "latest": {
+      "version": "v1.1.2"
+    }
   },
   "unstable": {
     "latest": {
-      "version": "v1.0.0-rc.2",
-      "name": null
+      "version": "v1.0.0-rc.2"
     }
   }
 }

site/public/download/index.ejs

@@ -10,7 +10,10 @@
 <p>Up-to-the-minute releases, archived versions, and full release notes can be found <a href='https://github.com/BinaryMuse/planetary.js/releases'>on the GitHub releases page</a>.</p>
 
 <% if (data.stable.latest) { %>
-  <h2>Latest Stable Build: <%= data.stable.latest.version %> (<%= data.stable.latest.name %>)</h2>
+  <h2>Latest Stable Build: <%= data.stable.latest.version %></h2>
+  <p><a href="https://github.com/BinaryMuse/planetary.js/releases/tag/<%= data.stable.latest.version %>">Release notes</a>
+  |
+  <a href="https://github.com/BinaryMuse/planetary.js/tree/<%= data.stable.latest.version %>">GitHub tag</a></p>
 
   <div class='ui list download-list'>
     <div class='item'>
@@ -31,8 +34,8 @@
     </div>
     <div class='item'>
       <i class='icon globe'></i>
-      Earth TopoJSON data: [
-      <a href='<%= dl(data.stable.latest.version, 'world-110m.json') %>'>minified</a>
+      Earth TopoJSON data ("land" and "countries" objects): [
+      <a href='<%= dl(data.stable.latest.version, 'world-110m.json') %>'>download</a>
       ]
     </div>
     <div class='item'>
@@ -54,6 +57,9 @@
 
 <% if (data.unstable.latest) { %>
   <h2>Latest Unstable Build: <%= data.unstable.latest.version %></h2>
+  <p><a href="https://github.com/BinaryMuse/planetary.js/releases/tag/<%= data.unstable.latest.version %>">Release notes</a>
+  |
+  <a href="https://github.com/BinaryMuse/planetary.js/tree/<%= data.unstable.latest.version %>">GitHub tag</a></p>
 
   <div class='ui list download-list'>
     <div class='item'>
@@ -74,8 +80,8 @@
     </div>
     <div class='item'>
       <i class='icon globe'></i>
-      Earth TopoJSON data: [
-      <a href='<%= dl(data.unstable.latest.version, 'world-110m.json') %>'>minified</a>
+      Earth TopoJSON data ("land" and "countries" objects): [
+      <a href='<%= dl(data.unstable.latest.version, 'world-110m.json') %>'>download</a>
       ]
     </div>
     <div class='item'>

site/public/examples/basic.ejs

@@ -14,10 +14,10 @@
 
 <div class='ui raised segment'>
 <div class='ui blue ribbon label'>HTML</div>
-<pre><code class='language-html'>&lt;canvas id='basicGlobe' width='400' height='400'&gt;&lt;/canvas&gt;</code></pre>
+<pre class='line-numbers'><code class='language-html'>&lt;canvas id='basicGlobe' width='400' height='400'&gt;&lt;/canvas&gt;</code></pre>
 
 <div class='ui red ribbon label'>JavaScript</div>
-<pre><code class='language-javascript'>(function() {
+<pre class='line-numbers'><code class='language-javascript'>(function() {
   var canvas = document.getElementById('basicGlobe');
   var planet = planetaryjs.planet();
   // Loading this plugin technically happens automatically,

site/public/examples/index.ejs

@@ -4,7 +4,7 @@
 
 <div class='ui top attached segment example-segment'>
   <div>
-    <a href='/examples/basic.html'><img src='/images/ex-basic.png' style='float: left; margin-right: 20px;'></a>
+    <a href='/examples/basic.html'><img src='/images/ex-basic.png'></a>
     <a href='/examples/basic.html'><h2><i class='icon black globe'></i>Basic Globe</h2></a>
     <p>It doesn't get any simpler than this: just a static globe, built using built-in plugins with nothing up our sleeves!</p>
     <span class='ui red horizontal label'>plugins: earth</span>
@@ -14,7 +14,7 @@
 
 <div class='ui attached segment example-segment'>
   <div>
-    <a href='/examples/rotating.html'><img src='/images/ex-rotating.png' style='float: left; margin-right: 20px;'></a>
+    <a href='/examples/rotating.html'><img src='/images/ex-rotating.png'></a>
     <a href='/examples/rotating.html'><h2><i class='icon black basic desk globe'></i>Rotating Globe with Pings</h2></a>
     <p>If there's one thing that's better than a globe, it's a globe that rotates. This is the demo from the homepage of Planetaryjs.com, and so includes a custom auto-rotation plugin and zoom/drag integration.</p>
     <span class='ui red horizontal label'>plugins: earth, pings, drag, zoom</span>
@@ -25,7 +25,7 @@
 
 <div class='ui bottom attached segment example-segment'>
   <div>
-    <a href='/examples/quake.html'><img src='/images/ex-quake.png' style='float: left; margin-right: 20px;'></a>
+    <a href='/examples/quake.html'><img src='/images/ex-quake.png'></a>
     <a href='/examples/quake.html'><h2><i class='icon black bullseye'></i>2013 Seismic Activity Visualization</h2></a>
     <p>A visualization of 2013 seismic activity. This demo shows the use of multiple custom plugins, D3 scales, fetching third party data, and DOM updates via D3.</p>
     <span class='ui red horizontal label'>plugins: earth, pings, drag, zoom</span>

site/public/examples/quake.ejs

@@ -8,11 +8,11 @@
 
 <p>This is a more advanced example of what you can build with Planetary.js. The demo sets up a globe with some custom plugins (defined at the bottom of the JavaScript), and also demonstrates some non-Planetary.js-specific techniques, like the use of <a href='http://momentjs.com/'>Moment.js</a>, D3 scales, DOM manipulation, and loading external data.</p>
 
-<p><a href="/examples/quake/index.html">View the demo</a></p>
+<h2><a href="/examples/quake/index.html"><i class='black icon play circle' style='text-decoration: none;'></i>View the demo</a></h2>
 
 <div class='ui raised segment'>
 <div class='ui blue ribbon label'>HTML</div>
-<pre><code class='language-html'>&lt;h1&gt;Earthquakes: 2013&lt;/h1&gt;
+<pre class='line-numbers'><code class='language-html'>&lt;h1&gt;Earthquakes: 2013&lt;/h1&gt;
 &lt;ul id='magnitudes'&gt;&lt;/ul&gt;
 
 &lt;canvas id='quakeCanvas'&gt;&lt;/canvas&gt;
@@ -28,7 +28,7 @@
 
 <div class='ui red ribbon label'>JavaScript</div>
 
-<pre><code class='language-javascript'>(function() {
+<pre class='line-numbers'><code class='language-javascript'>(function() {
   var canvas = document.getElementById('quakeCanvas');
 
   // Create our Planetary.js planet and set some initial values;
@@ -42,7 +42,7 @@
     land:     { fill:   '#06304e' },
     borders:  { stroke: '#001320' }
   }));
-  planet.loadPlugin(planetaryjs.plugins.pings({}));
+  planet.loadPlugin(planetaryjs.plugins.pings());
   planet.loadPlugin(planetaryjs.plugins.zoom({
     scaleExtent: [50, 5000]
   }));
@@ -63,8 +63,8 @@
   // minimum magnitude in our data set is 2.5.
   var colors = d3.scale.pow()
     .exponent(3)
-    .domain([2, 6, 10])
-      .range(['yellow', 'orange', 'red']);
+    .domain([2, 4, 6, 8, 10])
+      .range(['white', 'yellow', 'orange', 'red', 'purple']);
   // Also create a scale for mapping magnitudes to ping angle sizes
   var angles = d3.scale.pow()
     .exponent(3)
@@ -191,16 +191,20 @@
   // Plugin to resize the canvas to fill the window and to
   // automatically center the planet when the window size changes
   function autocenter(options) {
+    options = options || {};
     var needsCentering = false;
+    var globe = null;
+
     var resize = function() {
       var width  = window.innerWidth + (options.extraWidth || 0);
       var height = window.innerHeight + (options.extraHeight || 0);
-      planet.canvas.width = width;
-      planet.canvas.height = height;
-      planet.projection.translate([width / 2, height / 2]);
+      globe.canvas.width = width;
+      globe.canvas.height = height;
+      globe.projection.translate([width / 2, height / 2]);
     };
 
     return function(planet) {
+      globe = planet;
       planet.onInit(function() {
         needsCentering = true;
         d3.select(window).on('resize', function() {
@@ -217,6 +221,7 @@
   // Plugin to automatically scale the planet's projection based
   // on the window size when the planet is initialized
   function autoscale(options) {
+    options = options || {};
     return function(planet) {
       planet.onInit(function() {
         var width  = window.innerWidth + (options.extraWidth || 0);

site/public/examples/quake/quake-compress.js

@@ -0,0 +1,28 @@
+#!/usr/bin/env node
+var fs = require('fs');
+
+var filename = process.argv[2];
+
+if (!filename) {
+  console.log("Please specify a file to process");
+  process.exit(1);
+}
+
+if (!fs.existsSync(filename)) {
+  console.log("#{filename} not found.");
+  process.exit(2);
+}
+
+var data = fs.readFileSync(filename, 'utf8');
+var json = JSON.parse(data);
+
+var quakeData = json.features.map(function(feature) {
+  return {
+    time: feature.properties.time,
+    lat: feature.geometry.coordinates[1],
+    lng: feature.geometry.coordinates[0],
+    mag: feature.properties.mag
+  };
+}).sort(function(a, b) { return a.time - b.time});
+
+console.log(JSON.stringify(quakeData));

site/public/examples/quake/quake.js

@@ -12,7 +12,7 @@
     land:     { fill:   '#06304e' },
     borders:  { stroke: '#001320' }
   }));
-  planet.loadPlugin(planetaryjs.plugins.pings({}));
+  planet.loadPlugin(planetaryjs.plugins.pings());
   planet.loadPlugin(planetaryjs.plugins.zoom({
     scaleExtent: [50, 5000]
   }));
@@ -33,8 +33,8 @@
   // minimum magnitude in our data set is 2.5.
   var colors = d3.scale.pow()
     .exponent(3)
-    .domain([2, 6, 10])
-      .range(['yellow', 'orange', 'red']);
+    .domain([2, 4, 6, 8, 10])
+      .range(['white', 'yellow', 'orange', 'red', 'purple']);
   // Also create a scale for mapping magnitudes to ping angle sizes
   var angles = d3.scale.pow()
     .exponent(3)
@@ -161,16 +161,20 @@
   // Plugin to resize the canvas to fill the window and to
   // automatically center the planet when the window size changes
   function autocenter(options) {
+    options = options || {};
     var needsCentering = false;
+    var globe = null;
+
     var resize = function() {
       var width  = window.innerWidth + (options.extraWidth || 0);
       var height = window.innerHeight + (options.extraHeight || 0);
-      planet.canvas.width = width;
-      planet.canvas.height = height;
-      planet.projection.translate([width / 2, height / 2]);
+      globe.canvas.width = width;
+      globe.canvas.height = height;
+      globe.projection.translate([width / 2, height / 2]);
     };
 
     return function(planet) {
+      globe = planet;
       planet.onInit(function() {
         needsCentering = true;
         d3.select(window).on('resize', function() {
@@ -187,6 +191,7 @@
   // Plugin to automatically scale the planet's projection based
   // on the window size when the planet is initialized
   function autoscale(options) {
+    options = options || {};
     return function(planet) {
       planet.onInit(function() {
         var width  = window.innerWidth + (options.extraWidth || 0);

site/public/examples/rotating.ejs

@@ -8,6 +8,8 @@
 
 <p>This code shows the example from the homepage, which rotates, shows randomly positioned, colored, and sized pings on the globe, and supports mouse-based dragging and zooming. It also shows the creation and use of a plugin, which powers the automatic rotation and exposes a public API.</p>
 
+<p>We're using a specially-made TopoJSON file that includes lake data so that we can draw lakes on the globe with a custom plugin, which you can find at the bottom of the JavaScript. The custom TopoJSON was made using the <a href='https://github.com/mbostock/topojson/wiki/Command-Line-Reference'>TopoJSON command-line tool</a> and data from <a href='http://www.naturalearthdata.com/features/'>Natural Earth</a>; you can also <a href='/world-110m-withlakes.json'>download the JSON file</a> for your own use.</p>
+
 <p>The demo also shows how you can keep your globe from looking pixelated on high density displays by changing the canvas' width and height but keeping its <em>displayed</em> width and height the same via CSS styling.</p>
 
 <div style='text-align: center;'>
@@ -17,24 +19,31 @@
 
 <div class='ui raised segment'>
 <div class='ui blue ribbon label'>HTML</div>
-<pre><code class='language-html'>&lt;canvas id='basicGlobe' width='400' height='400'
+<pre class='line-numbers'><code class='language-html'>&lt;canvas id='rotatingGlobe' width='400' height='400'
   style='width: 400px; height: 400px; cursor: move;'&gt;&lt;/canvas&gt;</code></pre>
 
 <div class='ui red ribbon label'>JavaScript</div>
-<pre><code class='language-javascript'>(function() {
+<pre class='line-numbers'><code class='language-javascript'>(function() {
   var globe = planetaryjs.planet();
+  // Load our custom `autorotate` plugin; see below.
+  globe.loadPlugin(autorotate(10));
   // The `earth` plugin draws the oceans and the land; it's actually
   // a combination of several separate built-in plugins.
+  //
+  // Note that we're loading a special TopoJSON file
+  // (world-110m-withlakes.json) so we can render lakes.
   globe.loadPlugin(planetaryjs.plugins.earth({
-    topojson: { file:   '/world-110m.json' },
+    topojson: { file:   '/world-110m-withlakes.json' },
     oceans:   { fill:   '#000080' },
     land:     { fill:   '#339966' },
     borders:  { stroke: '#008000' }
   }));
+  // Load our custom `lakes` plugin to draw lakes; see below.
+  globe.loadPlugin(lakes({
+    fill: '#000080'
+  }));
   // The `pings` plugin draws animated pings on the globe.
   globe.loadPlugin(planetaryjs.plugins.pings());
-  // Load our custom `autorotate` plugin; see below.
-  globe.loadPlugin(autorotate(10));
   // The `zoom` and `drag` plugins enable
   // manipulating the globe with the mouse.
   globe.loadPlugin(planetaryjs.plugins.zoom({
@@ -60,7 +69,7 @@
     var lng = Math.random() * 360 - 180;
     var color = colors[Math.floor(Math.random() * colors.length)];
     globe.plugins.pings.add(lng, lat, { color: color, ttl: 2000, angle: Math.random() * 10 });
-  }, 250);
+  }, 150);
 
   var canvas = document.getElementById('rotatingGlobe');
   // Special code to handle high-density displays (e.g. retina, some phones)
@@ -104,6 +113,32 @@
       });
     };
   };
+
+  // This plugin takes lake data from the special
+  // TopoJSON we're loading and draws them on the map.
+  function lakes(options) {
+    options = options || {};
+    var lakes = null;
+
+    return function(planet) {
+      planet.onInit(function() {
+        // We can access the data loaded from the TopoJSON plugin
+        // on its namespace on `planet.plugins`. We're loading a custom
+        // TopoJSON file with an object called &quot;ne_110m_lakes&quot;.
+        var world = planet.plugins.topojson.world;
+        lakes = topojson.feature(world, world.objects.ne_110m_lakes);
+      });
+
+      planet.onDraw(function() {
+        planet.withSavedContext(function(context) {
+          context.beginPath();
+          planet.path.context(context)(lakes);
+          context.fillStyle = options.fill || 'black';
+          context.fill();
+        });
+      });
+    };
+  };
 })();</code></pre>
 </div>
 

site/public/examples/rotating.js

@@ -1,17 +1,24 @@
 (function() {
   var globe = planetaryjs.planet();
+  // Load our custom `autorotate` plugin; see below.
+  globe.loadPlugin(autorotate(10));
   // The `earth` plugin draws the oceans and the land; it's actually
   // a combination of several separate built-in plugins.
+  //
+  // Note that we're loading a special TopoJSON file
+  // (world-110m-withlakes.json) so we can render lakes.
   globe.loadPlugin(planetaryjs.plugins.earth({
-    topojson: { file:   '/world-110m.json' },
+    topojson: { file:   '/world-110m-withlakes.json' },
     oceans:   { fill:   '#000080' },
     land:     { fill:   '#339966' },
     borders:  { stroke: '#008000' }
   }));
+  // Load our custom `lakes` plugin to draw lakes; see below.
+  globe.loadPlugin(lakes({
+    fill: '#000080'
+  }));
   // The `pings` plugin draws animated pings on the globe.
   globe.loadPlugin(planetaryjs.plugins.pings());
-  // Load our custom `autorotate` plugin; see below.
-  globe.loadPlugin(autorotate(10));
   // The `zoom` and `drag` plugins enable
   // manipulating the globe with the mouse.
   globe.loadPlugin(planetaryjs.plugins.zoom({
@@ -37,7 +44,7 @@
     var lng = Math.random() * 360 - 180;
     var color = colors[Math.floor(Math.random() * colors.length)];
     globe.plugins.pings.add(lng, lat, { color: color, ttl: 2000, angle: Math.random() * 10 });
-  }, 250);
+  }, 150);
 
   var canvas = document.getElementById('rotatingGlobe');
   // Special code to handle high-density displays (e.g. retina, some phones)
@@ -81,4 +88,30 @@
       });
     };
   };
+
+  // This plugin takes lake data from the special
+  // TopoJSON we're loading and draws them on the map.
+  function lakes(options) {
+    options = options || {};
+    var lakes = null;
+
+    return function(planet) {
+      planet.onInit(function() {
+        // We can access the data loaded from the TopoJSON plugin
+        // on its namespace on `planet.plugins`. We're loading a custom
+        // TopoJSON file with an object called "ne_110m_lakes".
+        var world = planet.plugins.topojson.world;
+        lakes = topojson.feature(world, world.objects.ne_110m_lakes);
+      });
+
+      planet.onDraw(function() {
+        planet.withSavedContext(function(context) {
+          context.beginPath();
+          planet.path.context(context)(lakes);
+          context.fillStyle = options.fill || 'black';
+          context.fill();
+        });
+      });
+    };
+  };
 })();

site/public/index.ejs

@@ -33,7 +33,7 @@
     <div class='ui buttons'>
       <a class='ui green labeled icon button' href='/download/'><i class='icon download'></i>Download</a>
       <div class='or'></div>
-      <a class='ui labeled button' href='https://github.com/BinaryMuse/planetary.js'>View Source</a>
+      <a class='ui labeled button' href='https://github.com/BinaryMuse/planetary.js' onclick="_gaq.push(['_trackPageview', '/redirect-to-github-project-page']);">View Source</a>
     </div>
 
     <div style='padding-top: 10px;'>
@@ -87,12 +87,12 @@
         <p><a class='ui orange button' href='/documentation/'>Peruse the Documentation</a></p>
       </div>
       <div class='column'>
-        <a class='ui icon header' href='https://github.com/BinaryMuse/planetary.js'>
+        <a class='ui icon header' href='https://github.com/BinaryMuse/planetary.js' onclick="_gaq.push(['_trackPageview', '/redirect-to-github-project-page']);">
           <i class='ui huge icon github alternate'></i>
           Source Code
         </a>
         <p class='section-description'>Take a look at the source on GitHub and contribute to the project</p>
-        <p><a class='ui purple button' href='https://github.com/BinaryMuse/planetary.js'>Examine the Source</a></p>
+        <p><a class='ui purple button' href='https://github.com/BinaryMuse/planetary.js' onclick="_gaq.push(['_trackPageview', '/redirect-to-github-project-page']);">Examine the Source</a></p>
       </div>
     </div>
 

site/public/js/homepage.js

@@ -3,11 +3,14 @@
   // The `earth` plugin draws the oceans and the land; it's actually
   // a combination of several separate built-in plugins.
   globe.loadPlugin(planetaryjs.plugins.earth({
-    topojson: { file:   'world-110m.json' },
+    topojson: { file:   'world-110m-withlakes.json' },
     oceans:   { fill:   '#000080' },
     land:     { fill:   '#339966' },
     borders:  { stroke: '#008000' }
   }));
+  globe.loadPlugin(lakes({
+    fill: '#000080'
+  }));
   // The `pings` plugin draws animated pings on the globe.
   globe.loadPlugin(planetaryjs.plugins.pings());
   // Load our custom `autorotate` plugin; see below.
@@ -37,7 +40,7 @@
     var lng = Math.random() * 360 - 180;
     var color = colors[Math.floor(Math.random() * colors.length)];
     globe.plugins.pings.add(lng, lat, { color: color, ttl: 2000, angle: Math.random() * 10 });
-  }, 250);
+  }, 150);
 
   var canvas = document.getElementById('homepage-globe-canvas');
   // Special code to handle high-density displays (e.g. retina, some phones)
@@ -51,6 +54,27 @@
   // Draw that globe!
   globe.draw(canvas);
 
+  function lakes(config) {
+    config = config || {};
+    return function(planet) {
+      var lakes = null;
+
+      planet.onInit(function() {
+        var world = planet.plugins.topojson.world;
+        lakes = topojson.feature(world, world.objects.ne_110m_lakes);
+      });
+
+      planet.onDraw(function() {
+        planet.withSavedContext(function(context) {
+          context.beginPath();
+          planet.path.context(context)(lakes);
+          context.fillStyle = config.fill || 'black';
+          context.fill();
+        });
+      });
+    };
+  };
+
   // This plugin will automatically rotate the globe around its vertical
   // axis a configured number of degrees every second.
   function autorotate(degPerSec) {

site/public/js/lib/planetaryjs.min.js

@@ -1,2 +1,2 @@
-/*! Planetary.js 1.0.0-rc.2 | (c) 2013 Brandon Tilley | Released under MIT License */
-!function(n,t){"function"==typeof define&&define.amd?define(["d3","topojson"],t):"object"==typeof exports?module.exports=t(require("d3"),require("topojson")):n.planetaryjs=t(n.d3,n.topojson,n)}(this,function(n,t,o){"use strict";var i=null;o&&(i=o.planetaryjs);var e=[],r=function(t,o,i){n.timer(function(){t.context.clearRect(0,0,o.width,o.height);for(var n=0;n<i.onDraw.length;n++)i.onDraw[n]()})},l=function(n,t){for(var o=e.length-1;o>=0;o--)t.unshift(e[o]);for(0===t.length&&(u.plugins.earth&&n.loadPlugin(u.plugins.earth()),u.plugins.pings&&n.loadPlugin(u.plugins.pings())),o=0;o<t.length;o++)t[o](n)},a=function(n,t,o){if(o.onInit.length){var i=0,e=function(n){var t=o.onInit[i];t.length?t(function(){i++,n()}):(t(),i++,setTimeout(n,0))},l=function(){i>=o.onInit.length?r(n,t,o):e(l)};e(l)}else r(n,t,o)},c=function(n,t,o,i){l(n,o),n.canvas=t,n.context=t.getContext("2d"),a(n,t,i)},u={plugins:{},noConflict:function(){return o.planetaryjs=i,u},loadPlugin:function(n){e.push(n)},planet:function(){var t=[],o={onInit:[],onDraw:[]},i={plugins:{},draw:function(n){c(i,n,t,o)},onInit:function(n){o.onInit.push(n)},onDraw:function(n){o.onDraw.push(n)},loadPlugin:function(n){t.push(n)},withSavedContext:function(n){if(!this.context)throw new Error("No canvas to fetch context for");this.context.save(),n(this.context),this.context.restore()}};return i.projection=n.geo.orthographic().clipAngle(90).precision(0),i.path=n.geo.path().projection(i.projection),i}};return u.plugins.topojson=function(t){return function(o){o.plugins.topojson={},o.onInit(function(i){if(t.world)o.plugins.topojson.world=t.world,setTimeout(i,0);else{var e=t.file||"world-110m.json";n.json(e,function(n,t){if(n)throw new Error("Could not load JSON "+e);o.plugins.topojson.world=t,i()})}})}},u.plugins.oceans=function(n){return function(t){t.onDraw(function(){t.withSavedContext(function(o){o.beginPath(),t.path.context(o)({type:"Sphere"}),o.fillStyle=n.fill||"black",o.fill()})})}},u.plugins.land=function(n){return function(o){var i=null;o.onInit(function(){var n=o.plugins.topojson.world;i=t.feature(n,n.objects.land)}),o.onDraw(function(){o.withSavedContext(function(t){t.beginPath(),o.path.context(t)(i),n.fill!==!1&&(t.fillStyle=n.fill||"white",t.fill()),n.stroke&&(n.lineWidth&&(t.lineWidth=n.lineWidth),t.strokeStyle=n.stroke,t.stroke())})})}},u.plugins.borders=function(n){return function(o){var i=null,e={internal:function(n,t){return n.id!==t.id},external:function(n,t){return n.id===t.id},both:function(){return!0}};o.onInit(function(){var r=o.plugins.topojson.world,l=r.objects.countries,a=n.type||"internal";i=t.mesh(r,l,e[a])}),o.onDraw(function(){o.withSavedContext(function(t){t.beginPath(),o.path.context(t)(i),t.strokeStyle=n.stroke||"gray",n.lineWidth&&(t.lineWidth=n.lineWidth),t.stroke()})})}},u.plugins.earth=function(n){n=n||{};var t=n.topojson||{},o=n.oceans||{},i=n.land||{},e=n.borders||{};return function(n){u.plugins.topojson(t)(n),u.plugins.oceans(o)(n),u.plugins.land(i)(n),u.plugins.borders(e)(n)}},u.plugins.pings=function(t){var o=[];t=t||{};var i=function(n,i,e){e=e||{},e.color=e.color||t.color||"white",e.angle=e.angle||t.angle||5,e.ttl=e.ttl||t.ttl||2e3;var r={time:new Date,options:e};t.latitudeFirst?(r.lat=n,r.lng=i):(r.lng=n,r.lat=i),o.push(r)},e=function(n,t,i){for(var e=[],l=0;l<o.length;l++){var a=o[l],c=i-a.time;c<a.options.ttl&&(e.push(a),r(n,t,i,c,a))}o=e},r=function(t,o,i,e,r){var l=1-e/r.options.ttl,a=n.rgb(r.options.color);a="rgba("+a.r+","+a.g+","+a.b+","+l+")",o.strokeStyle=a;var c=n.geo.circle().origin([r.lng,r.lat]).angle(e/r.options.ttl*r.options.angle)();o.beginPath(),t.path.context(o)(c),o.stroke()};return function(n){n.plugins.pings={add:i},n.onDraw(function(){var t=new Date;n.withSavedContext(function(o){e(n,o,t)})})}},u.plugins.zoom=function(t){t=t||{};var o=function(){},i=t.onZoomStart||o,e=t.onZoomEnd||o,r=t.onZoom||o,l=t.afterZoom||o,a=t.initialScale,c=t.scaleExtent||[50,2e3];return function(t){t.onInit(function(){var o=n.behavior.zoom().scaleExtent(c);null!==a&&void 0!==a?o.scale(a):o.scale(t.projection.scale()),o.on("zoomstart",i.bind(t)).on("zoomend",e.bind(t)).on("zoom",function(){r.call(t),t.projection.scale(n.event.scale),l.call(t)}),n.select(t.canvas).call(o)})}},u.plugins.drag=function(t){t=t||{};var o=function(){},i=t.onDragStart||o,e=t.onDragEnd||o,r=t.onDrag||o,l=t.afterDrag||o;return function(t){t.onInit(function(){var o=n.behavior.drag().on("dragstart",i.bind(t)).on("dragend",e.bind(t)).on("drag",function(){r.call(t);var o=n.event.dx,i=n.event.dy,e=t.projection.rotate(),a=t.projection.scale(),c=n.scale.linear().domain([-1*a,a]).range([-90,90]),u=c(o),s=c(i);e[0]+=u,e[1]-=s,e[1]>90&&(e[1]=90),e[1]<-90&&(e[1]=-90),e[0]>=180&&(e[0]-=360),t.projection.rotate(e),l.call(t)});n.select(t.canvas).call(o)})}},u});
+/*! Planetary.js 1.1.2 | (c) 2013 Michelle Tilley | Released under MIT License */
+!function(n,t){"function"==typeof define&&define.amd?define(["d3","topojson"],function(o,i){return n.planetaryjs=t(o,i,n)}):"object"==typeof exports?module.exports=t(require("d3"),require("topojson")):n.planetaryjs=t(n.d3,n.topojson,n)}(this,function(n,t,o){"use strict";var i=null;o&&(i=o.planetaryjs);var e=[],r=function(t,o,i){n.timer(function(){if(t.stopped)return!0;t.context.clearRect(0,0,o.width,o.height);for(var n=0;n<i.onDraw.length;n++)i.onDraw[n]()})},l=function(n,t){for(var o=e.length-1;o>=0;o--)t.unshift(e[o]);for(0===t.length&&(c.plugins.earth&&n.loadPlugin(c.plugins.earth()),c.plugins.pings&&n.loadPlugin(c.plugins.pings())),o=0;o<t.length;o++)t[o](n)},a=function(n,t,o){if(o.onInit.length){var i=0,e=function(n){var t=o.onInit[i];t.length?t(function(){i++,n()}):(t(),i++,setTimeout(n,0))},l=function(){i>=o.onInit.length?r(n,t,o):e(l)};e(l)}else r(n,t,o)},u=function(n,t,o,i){n.canvas=t,n.context=t.getContext("2d"),n.stopped!==!0&&l(n,o),n.stopped=!1,a(n,t,i)},c={plugins:{},noConflict:function(){return o.planetaryjs=i,c},loadPlugin:function(n){e.push(n)},planet:function(){var t=[],o={onInit:[],onDraw:[],onStop:[]},i={plugins:{},draw:function(n){u(i,n,t,o)},onInit:function(n){o.onInit.push(n)},onDraw:function(n){o.onDraw.push(n)},onStop:function(n){o.onStop.push(n)},loadPlugin:function(n){t.push(n)},stop:function(){i.stopped=!0;for(var n=0;n<o.onStop.length;n++)o.onStop[n](i)},withSavedContext:function(n){if(!this.context)throw new Error("No canvas to fetch context for");this.context.save(),n(this.context),this.context.restore()}};return i.projection=n.geo.orthographic().clipAngle(90),i.path=n.geo.path().projection(i.projection),i}};return c.plugins.topojson=function(t){return function(o){o.plugins.topojson={},o.onInit(function(i){if(t.world)o.plugins.topojson.world=t.world,setTimeout(i,0);else{var e=t.file||"world-110m.json";n.json(e,function(n,t){if(n)throw new Error("Could not load JSON "+e);o.plugins.topojson.world=t,i()})}})}},c.plugins.oceans=function(n){return function(t){t.onDraw(function(){t.withSavedContext(function(o){o.beginPath(),t.path.context(o)({type:"Sphere"}),o.fillStyle=n.fill||"black",o.fill()})})}},c.plugins.land=function(n){return function(o){var i=null;o.onInit(function(){var n=o.plugins.topojson.world;i=t.feature(n,n.objects.land)}),o.onDraw(function(){o.withSavedContext(function(t){t.beginPath(),o.path.context(t)(i),n.fill!==!1&&(t.fillStyle=n.fill||"white",t.fill()),n.stroke&&(n.lineWidth&&(t.lineWidth=n.lineWidth),t.strokeStyle=n.stroke,t.stroke())})})}},c.plugins.borders=function(n){return function(o){var i=null,e={internal:function(n,t){return n.id!==t.id},external:function(n,t){return n.id===t.id},both:function(){return!0}};o.onInit(function(){var r=o.plugins.topojson.world,l=r.objects.countries,a=n.type||"internal";i=t.mesh(r,l,e[a])}),o.onDraw(function(){o.withSavedContext(function(t){t.beginPath(),o.path.context(t)(i),t.strokeStyle=n.stroke||"gray",n.lineWidth&&(t.lineWidth=n.lineWidth),t.stroke()})})}},c.plugins.earth=function(n){n=n||{};var t=n.topojson||{},o=n.oceans||{},i=n.land||{},e=n.borders||{};return function(n){c.plugins.topojson(t)(n),c.plugins.oceans(o)(n),c.plugins.land(i)(n),c.plugins.borders(e)(n)}},c.plugins.pings=function(t){var o=[];t=t||{};var i=function(n,i,e){e=e||{},e.color=e.color||t.color||"white",e.angle=e.angle||t.angle||5,e.ttl=e.ttl||t.ttl||2e3;var r={time:new Date,options:e};t.latitudeFirst?(r.lat=n,r.lng=i):(r.lng=n,r.lat=i),o.push(r)},e=function(n,t,i){for(var e=[],l=0;l<o.length;l++){var a=o[l],u=i-a.time;u<a.options.ttl&&(e.push(a),r(n,t,i,u,a))}o=e},r=function(t,o,i,e,r){var l=1-e/r.options.ttl,a=n.rgb(r.options.color);a="rgba("+a.r+","+a.g+","+a.b+","+l+")",o.strokeStyle=a;var u=n.geo.circle().origin([r.lng,r.lat]).angle(e/r.options.ttl*r.options.angle)();o.beginPath(),t.path.context(o)(u),o.stroke()};return function(n){n.plugins.pings={add:i},n.onDraw(function(){var t=new Date;n.withSavedContext(function(o){e(n,o,t)})})}},c.plugins.zoom=function(t){t=t||{};var o=function(){},i=t.onZoomStart||o,e=t.onZoomEnd||o,r=t.onZoom||o,l=t.afterZoom||o,a=t.initialScale,u=t.scaleExtent||[50,2e3];return function(t){t.onInit(function(){var o=n.behavior.zoom().scaleExtent(u);o.scale(null!==a&&void 0!==a?a:t.projection.scale()),o.on("zoomstart",i.bind(t)).on("zoomend",e.bind(t)).on("zoom",function(){r.call(t),t.projection.scale(n.event.scale),l.call(t)}),n.select(t.canvas).call(o)})}},c.plugins.drag=function(t){t=t||{};var o=function(){},i=t.onDragStart||o,e=t.onDragEnd||o,r=t.onDrag||o,l=t.afterDrag||o;return function(t){t.onInit(function(){var o=n.behavior.drag().on("dragstart",i.bind(t)).on("dragend",e.bind(t)).on("drag",function(){r.call(t);var o=n.event.dx,i=n.event.dy,e=t.projection.rotate(),a=t.projection.scale(),u=n.scale.linear().domain([-1*a,a]).range([-90,90]),c=u(o),s=u(i);e[0]+=c,e[1]-=s,e[1]>90&&(e[1]=90),e[1]<-90&&(e[1]=-90),e[0]>=180&&(e[0]-=360),t.projection.rotate(e),l.call(t)});n.select(t.canvas).call(o)})}},c});

src/_umd_header.js

@@ -1,6 +1,8 @@
 (function (root, factory) {
   if (typeof define === 'function' && define.amd) {
-    define(['d3', 'topojson'], factory);
+    define(['d3', 'topojson'], function(d3, topojson) {
+      return (root.planetaryjs = factory(d3, topojson, root));
+    });
   } else if (typeof exports === 'object') {
     module.exports = factory(require('d3'), require('topojson'));
   } else {

src/body.js

@@ -4,6 +4,10 @@
 
   var doDrawLoop = function(planet, canvas, hooks) {
     d3.timer(function() {
+      if (planet.stopped) {
+        return true;
+      }
+
       planet.context.clearRect(0, 0, canvas.width, canvas.height);
       for (var i = 0; i < hooks.onDraw.length; i++) {
         hooks.onDraw[i]();
@@ -59,11 +63,14 @@
   };
 
   var startDraw = function(planet, canvas, localPlugins, hooks) {
-    initPlugins(planet, localPlugins);
-
     planet.canvas = canvas;
     planet.context = canvas.getContext('2d');
 
+    if (planet.stopped !== true) {
+      initPlugins(planet, localPlugins);
+    }
+
+    planet.stopped = false;
     runOnInitHooks(planet, canvas, hooks);
   };
 
@@ -83,7 +90,8 @@
       var localPlugins = [];
       var hooks = {
         onInit: [],
-        onDraw: []
+        onDraw: [],
+        onStop: []
       };
 
       var planet = {
@@ -101,10 +109,21 @@
           hooks.onDraw.push(fn);
         },
 
+        onStop: function(fn) {
+          hooks.onStop.push(fn);
+        },
+
         loadPlugin: function(plugin) {
           localPlugins.push(plugin);
         },
 
+        stop: function() {
+          planet.stopped = true;
+          for (var i = 0; i < hooks.onStop.length; i++) {
+            hooks.onStop[i](planet);
+          }
+        },
+
         withSavedContext: function(fn) {
           if (!this.context) {
             throw new Error("No canvas to fetch context for");
@@ -117,8 +136,7 @@
       };
 
       planet.projection = d3.geo.orthographic()
-        .clipAngle(90)
-        .precision(0);
+        .clipAngle(90);
       planet.path = d3.geo.path().projection(planet.projection);
 
       return planet;