fix #1176 implemented GraticuleLayer for leaflet (#1180)

* fix #1176 implemented GraticuleLayer for leaflet

* fix typo, year and returned null

package.json

@@ -87,6 +87,7 @@
     "leaflet-draw": "0.2.4",
     "leaflet-minimap": "3.3.1",
     "leaflet-plugins": "https://github.com/Polyconseil/leaflet-plugins/tarball/master",
+    "leaflet-simple-graticule": "1.0.2",
     "leaflet.locatecontrol": "0.45.1",
     "lodash": "3.10.1",
     "moment": "2.13.0",

web/client/components/map/leaflet/__tests__/Layer-test.jsx

@@ -13,6 +13,7 @@ var expect = require('expect');
 
 require('../../../../utils/leaflet/Layers');
 require('../plugins/OSMLayer');
+require('../plugins/GraticuleLayer');
 require('../plugins/WMSLayer');
 require('../plugins/GoogleLayer');
 require('../plugins/BingLayer');
@@ -101,6 +102,19 @@ describe('Leaflet layer', () => {
         expect(lcount).toBe(1);
     });
 
+    it('creates a graticule layer for leaflet map', () => {
+        var options = {};
+        // create layers
+        var layer = ReactDOM.render(
+            <LeafLetLayer type="graticule"
+                 options={options} map={map}/>, document.getElementById("container"));
+        var lcount = 0;
+        expect(layer).toExist();
+        // count layers
+        map.eachLayer(function() {lcount++; });
+        expect(lcount).toBe(1);
+    });
+
     it('creates a mapquest layer for leaflet map without API key', () => {
         var options = {
 			"source": "mapquest",

web/client/components/map/leaflet/plugins/GraticuleLayer.js

@@ -0,0 +1,30 @@
+/**
+ * Copyright 2016, GeoSolutions Sas.
+ * All rights reserved.
+ *
+ * This source code is licensed under the BSD-style license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+const Layers = require('../../../../utils/leaflet/Layers');
+const SimpleGraticule = require('leaflet-simple-graticule/L.SimpleGraticule');
+const assign = require('object-assign');
+
+require('leaflet-simple-graticule/L.SimpleGraticule.css');
+
+Layers.registerType('graticule', {
+    create: (options) => {
+        const graticuleOptions = assign({
+            interval: 20,
+            showOriginLabel: true,
+            redraw: 'move'
+        }, options);
+        if (SimpleGraticule) {
+            return new SimpleGraticule(graticuleOptions);
+        }
+        return null;
+    },
+    isValid: () => {
+        return SimpleGraticule ? true : false;
+    }
+});

web/client/components/map/leaflet/plugins/index.js

@@ -9,6 +9,7 @@
 module.exports = {
     BingLayer: require('./BingLayer'),
     Commons: require('./Commons'),
+    GraticuleLayer: require('./GraticuleLayer'),
     GoogleLayer: require('./GoogleLayer'),
     MapQuest: require('./MapQuest'),
     OSMLayer: require('./OSMLayer'),

web/client/config.json

@@ -9,6 +9,10 @@
 			20037508.34, 20037508.34
 		],
 		"layers": [
+      {
+        "type": "graticule",
+				"visibility": true
+      },
 			{
 				"type": "osm",
 				"title": "Open Street Map",