From 77354325c13405f6c242aa259f747bc5381c7125 Mon Sep 17 00:00:00 2001
From: "S. Andrew Sheppard" <andrew@wq.io>
Date: Thu, 17 Sep 2015 20:34:01 +0000
Subject: [PATCH] json-configurable cluster icon (see #41)

---
 js/wq/map.js | 31 ++++++++++++++++++++++++++++++-
 1 file changed, 30 insertions(+), 1 deletion(-)

diff --git a/js/wq/map.js b/js/wq/map.js
index a5adad26..4ea0def0 100644
--- a/js/wq/map.js
+++ b/js/wq/map.js
@@ -322,7 +322,7 @@ map.addOverlayType('geojson', function(layerconf) {
     if (layerconf.cluster && L.MarkerClusterGroup) {
         var options = {};
         if (layerconf.clusterIcon) {
-            options.iconCreateFunction = layerconf.clusterIcon;
+            options.iconCreateFunction = _makeCluster(layerconf.clusterIcon);
         }
         overlay = new L.MarkerClusterGroup(options);
     } else {
@@ -623,6 +623,35 @@ function _makeMarker(icon) {
     };
 }
 
+function _makeCluster(clusterIcon) {
+    return function clusterDiv(cluster) {
+        var cls;
+        var context = {
+            'count': cluster.getChildCount()
+        };
+        if (context.count >= 100) {
+            context.large = true;
+        } else if (context.count >= 10) {
+            context.medium = true;
+        } else {
+            context.small = true;
+        }
+        if (typeof clusterIcon == 'function') {
+            cls = clusterIcon(context);
+        } else if (clusterIcon.indexOf('{{') > -1) {
+            cls = tmpl.render(clusterIcon, context);
+        } else {
+            cls = clusterIcon;
+        }
+        var html = tmpl.render('<div><span>{{count}}</span></div>', context);
+        return new L.DivIcon({
+            html: html,
+            className: 'marker-cluster ' + cls,
+            iconSize: new L.Point(40, 40)
+        });
+    };
+}
+
 // Load map configuration for a given page
 function _getConf(page, mode) {
     var conf = map.config.maps[page];