From cca754690de058cca404cd6d526490e849708633 Mon Sep 17 00:00:00 2001
From: James Seppi <james.seppi@gmail.com>
Date: Sat, 30 Apr 2016 12:41:05 -0500
Subject: [PATCH 1/2] update to use mapbox v4 api

---
 Leaflet.MakiMarkers.js | 20 +++++++++++++++++---
 README.md              |  3 +++
 bower.json             |  2 +-
 index.html             |  7 +++++++
 4 files changed, 28 insertions(+), 4 deletions(-)

diff --git a/Leaflet.MakiMarkers.js b/Leaflet.MakiMarkers.js
index a3a496c..25f53ab 100644
--- a/Leaflet.MakiMarkers.js
+++ b/Leaflet.MakiMarkers.js
@@ -35,7 +35,7 @@
     defaultColor: "#0a0",
     defaultIcon: "circle-stroked",
     defaultSize: "m",
-    apiUrl: "https://api.tiles.mapbox.com/v3/marker/",
+    apiUrl: "https://api.mapbox.com/v4/marker/",
     smallOptions: {
       iconSize: [20, 50],
       popupAnchor: [0,-20]
@@ -50,8 +50,13 @@
     }
   };
 
+  L.MakiMarkers.accessToken = null;
+
   L.MakiMarkers.Icon = L.Icon.extend({
     options: {
+      //Mapbox API access token, see https://www.mapbox.com/api-documentation/?language=CLI#access-tokens
+      //Instead of setting with each icon, you can set globally as L.MakiMarkers.accessToken
+      accessToken: null,
       //Maki icon: any from https://www.mapbox.com/maki/ (ref: L.MakiMarkers.icons)
       icon: L.MakiMarkers.defaultIcon,
       //Marker color: short or long form hex color code
@@ -66,7 +71,14 @@
 
     initialize: function(options) {
       var pin;
+      var tokenQuery;
+
+      var accessToken = options.accessToken || L.MakiMarkers.accessToken;
+      if (!accessToken) {
+        throw new Error("Access to the Mapbox API requires a valid access token.");
+      }
 
+      tokenQuery = "?access_token=" + accessToken;
       options = L.setOptions(this, options);
 
       switch (options.size) {
@@ -97,8 +109,10 @@
         pin += "+" + options.color;
       }
 
-      options.iconUrl = "" + L.MakiMarkers.apiUrl + pin +  ".png";
-      options.iconRetinaUrl = L.MakiMarkers.apiUrl + pin + "@2x.png";
+
+
+      options.iconUrl = "" + L.MakiMarkers.apiUrl + pin +  ".png" + tokenQuery;
+      options.iconRetinaUrl = L.MakiMarkers.apiUrl + pin + "@2x.png" + tokenQuery;
     }
   });
 
diff --git a/README.md b/README.md
index a46547b..047f5ef 100644
--- a/README.md
+++ b/README.md
@@ -9,6 +9,9 @@
 Simply include `Leaflet.MakiMarkers.js` in your page after you include `Leaflet.js`: `<script src="Leaflet.MakiMarkers.js"></script>`
 
 ```js
+//First, specify a valid Mapbox API access token (see https://www.mapbox.com/api-documentation/?language=CLI#access-tokens)
+L.MakiMarkers.accessToken = "<YOUR_ACCESS_TOKEN>";
+
 // Specify a Maki icon name, hex color, and size (s, m, or l).
 // An array of icon names can be found in L.MakiMarkers.icons or at https://www.mapbox.com/maki/
 // Lowercase letters a-z and digits 0-9 can also be used. A value of null will result in no icon.
diff --git a/bower.json b/bower.json
index c057991..c477a51 100644
--- a/bower.json
+++ b/bower.json
@@ -1,7 +1,7 @@
 {
   "name": "Leaflet.MakiMarkers",
   "main": "Leaflet.MakiMarkers.js",
-  "version": "1.0.1",
+  "version": "2.0.0",
   "homepage": "https://github.com/jseppi/Leaflet.MakiMarkers",
   "authors": [
     "James Seppi <james.seppi@gmail.com>"
diff --git a/index.html b/index.html
index 40a4047..9f82fc5 100644
--- a/index.html
+++ b/index.html
@@ -15,6 +15,13 @@
     <div id="map" style="width: 600px; height: 400px"></div>
 
     <script>
+        //Request access token (see https://www.mapbox.com/api-documentation/?language=CLI#access-tokens)
+        var accessToken = prompt("Please enter your Mapbox API access token");
+        if (!accessToken) {
+            alert("Valid Mapbox API access token is required");
+        }
+        L.MakiMarkers.accessToken = accessToken;
+
         var map = L.map('map').setView([30.289, -97.74], 12);
 
         L.tileLayer('http://{s}.mqcdn.com/tiles/1.0.0/map/{z}/{x}/{y}.png', {

From 980f2dc0282211a6113c11ce58661f53e3ae6aab Mon Sep 17 00:00:00 2001
From: James Seppi <james.seppi@gmail.com>
Date: Sat, 30 Apr 2016 14:52:15 -0500
Subject: [PATCH 2/2] update readme, minor doc fixes

---
 Leaflet.MakiMarkers.js |  9 +++------
 README.md              | 12 ++++++------
 2 files changed, 9 insertions(+), 12 deletions(-)

diff --git a/Leaflet.MakiMarkers.js b/Leaflet.MakiMarkers.js
index 25f53ab..cef438d 100644
--- a/Leaflet.MakiMarkers.js
+++ b/Leaflet.MakiMarkers.js
@@ -3,9 +3,10 @@
  *
  * References:
  *   Maki Icons: https://www.mapbox.com/maki/
- *   MapBox Marker API: https://www.mapbox.com/developers/api/static/#markers
+ *   Mapbox Marker API: https://www.mapbox.com/api-documentation/#retrieve-a-standalone-marker
  *
  * Usage:
+ *   L.MakiMarkers.accessToken = "<YOUR_ACCESS_TOKEN>";
  *   var icon = L.MakiMarkers.icon({icon: "rocket", color: "#b0b", size: "m"});
  *
  * License:
@@ -32,6 +33,7 @@
       "swimming","telephone","tennis","theatre","toilets","town-hall","town","triangle-stroked",
       "triangle","village","warehouse","waste-basket","water","wetland","zoo"
     ],
+    accessToken: null,
     defaultColor: "#0a0",
     defaultIcon: "circle-stroked",
     defaultSize: "m",
@@ -50,8 +52,6 @@
     }
   };
 
-  L.MakiMarkers.accessToken = null;
-
   L.MakiMarkers.Icon = L.Icon.extend({
     options: {
       //Mapbox API access token, see https://www.mapbox.com/api-documentation/?language=CLI#access-tokens
@@ -94,7 +94,6 @@
           break;
       }
 
-
       pin = "pin-" + options.size;
 
       if (options.icon !== null) {
@@ -109,8 +108,6 @@
         pin += "+" + options.color;
       }
 
-
-
       options.iconUrl = "" + L.MakiMarkers.apiUrl + pin +  ".png" + tokenQuery;
       options.iconRetinaUrl = L.MakiMarkers.apiUrl + pin + "@2x.png" + tokenQuery;
     }
diff --git a/README.md b/README.md
index 047f5ef..e0b766c 100644
--- a/README.md
+++ b/README.md
@@ -1,15 +1,17 @@
 # Leaflet.MakiMarkers
 
-[Leaflet](http://www.leafletjs.com) plugin to create map icons using [Maki Icons](https://www.mapbox.com/maki/) from Mapbox. Markers are retrieved from Mapbox's [Static Marker API](https://www.mapbox.com/developers/api/static/#markers).
+[Leaflet](http://www.leafletjs.com) plugin to create map icons using [Maki Icons](https://www.mapbox.com/maki/) from Mapbox. Markers are retrieved from Mapbox's [Static Marker API](https://www.mapbox.com/api-documentation/#retrieve-a-standalone-marker).
 
-[![Screenshot](https://raw.github.com/jseppi/Leaflet.MakiMarkers/master/images/screenshot.png "Screenshot of MakiMarkers")](http://jsfiddle.net/Zhzvp/)
+[![Screenshot](https://raw.github.com/jseppi/Leaflet.MakiMarkers/master/images/screenshot.png "Screenshot of MakiMarkers")]
 
 ## Usage
 
-Simply include `Leaflet.MakiMarkers.js` in your page after you include `Leaflet.js`: `<script src="Leaflet.MakiMarkers.js"></script>`
+Include `Leaflet.MakiMarkers.js` in your page after you include `Leaflet.js`: `<script src="Leaflet.MakiMarkers.js"></script>`
+
+The most recent version of Mapbox's static API (v4) requires that a valid access token be specified with every request. Please see https://www.mapbox.com/api-documentation/?language=CLI#access-tokens for more information.
 
 ```js
-//First, specify a valid Mapbox API access token (see https://www.mapbox.com/api-documentation/?language=CLI#access-tokens)
+//First, specify your Mapbox API access token
 L.MakiMarkers.accessToken = "<YOUR_ACCESS_TOKEN>";
 
 // Specify a Maki icon name, hex color, and size (s, m, or l).
@@ -20,8 +22,6 @@ var icon = L.MakiMarkers.icon({icon: "rocket", color: "#b0b", size: "m"});
 L.marker([30.287, -97.72], {icon: icon}).addTo(map);
 ```
 
-[JSFiddle Demo](http://jsfiddle.net/Zhzvp/26/)
-
 ## Requirements
 
 [Leaflet](http://www.leafletjs.com) 0.5+