From c5d852ed4b0f5532ff733e44c4a7dd707f55be50 Mon Sep 17 00:00:00 2001
From: echarp <emmanuel.charpentier@free.fr>
Date: Sun, 26 Oct 2014 16:51:16 +0100
Subject: [PATCH] Ajout de markercluster pour un meilleur affichage de la carte
 (merci olive)

---
 Gemfile                                      |  1 +
 Gemfile.lock                                 |  3 +++
 app/assets/javascripts/application.js.coffee |  1 +
 app/assets/javascripts/maps.js.coffee        | 10 +++++++++-
 app/assets/stylesheets/application.css.sass  |  1 -
 app/assets/stylesheets/maps.css.sass         |  9 +++++----
 app/models/event.rb                          |  2 ++
 7 files changed, 21 insertions(+), 6 deletions(-)

diff --git a/Gemfile b/Gemfile
index a9e28be5..69769af5 100644
--- a/Gemfile
+++ b/Gemfile
@@ -81,6 +81,7 @@ gem 'redcarpet'
 
 # Carte openstreetmap
 gem 'leaflet-rails'
+gem 'leaflet-markercluster-rails'
 
 gem 'geocoder'
 
diff --git a/Gemfile.lock b/Gemfile.lock
index fd039f85..e5aafd9a 100644
--- a/Gemfile.lock
+++ b/Gemfile.lock
@@ -214,6 +214,8 @@ GEM
     kaminari (0.16.1)
       actionpack (>= 3.0.0)
       activesupport (>= 3.0.0)
+    leaflet-markercluster-rails (0.7.0)
+      railties (>= 3.1)
     leaflet-rails (0.7.4)
     libv8 (3.16.14.7)
     listen (2.7.11)
@@ -401,6 +403,7 @@ DEPENDENCIES
   jquery-rails
   jquery-sparkline-rails!
   jquery-turbolinks
+  leaflet-markercluster-rails
   leaflet-rails
   meta-tags
   modernizr-rails
diff --git a/app/assets/javascripts/application.js.coffee b/app/assets/javascripts/application.js.coffee
index 1e37ece8..7954dbf4 100644
--- a/app/assets/javascripts/application.js.coffee
+++ b/app/assets/javascripts/application.js.coffee
@@ -21,6 +21,7 @@
 #= require select2
 #= require select2_locale_fr
 #= require leaflet
+#= require leaflet.markercluster
 #= require_tree .
 
 # Setup polyfills, so that older browsers can also take advantage of html5!
diff --git a/app/assets/javascripts/maps.js.coffee b/app/assets/javascripts/maps.js.coffee
index 2f153689..f6d40a63 100644
--- a/app/assets/javascripts/maps.js.coffee
+++ b/app/assets/javascripts/maps.js.coffee
@@ -17,6 +17,10 @@ $(document).ready ->
       # Automatic focus to all displayed events
       map.fitBounds layer.getBounds()
 
+      markers = L.markerClusterGroup()
+      markers.addLayer layer
+      map.addLayer markers
+
   $('.events #map, .moderations #map').each ->
     coord = [$(this).attr('latitude'), $(this).attr('longitude')]
 
@@ -27,11 +31,15 @@ $(document).ready ->
     ).addTo map
 
     $.getJSON '/maps.json', (json) ->
-      L.geoJson(json,
+      layer = L.geoJson(json,
         onEachFeature: (feature, layer) ->
           # Does this feature have a property named popupContent?
           if (feature.properties && feature.properties.popupContent)
             layer.bindPopup(feature.properties.popupContent)
       ).addTo map
 
+      markers = L.markerClusterGroup()
+      markers.addLayer layer
+      map.addLayer markers
+
     marker = L.marker([coord[0], coord[1]]).addTo map
diff --git a/app/assets/stylesheets/application.css.sass b/app/assets/stylesheets/application.css.sass
index cb5c29ba..353d4506 100644
--- a/app/assets/stylesheets/application.css.sass
+++ b/app/assets/stylesheets/application.css.sass
@@ -11,7 +11,6 @@
  * file per style scope.
  *
  *= require select2
- *= require leaflet
  *= require_tree .
  */
 
diff --git a/app/assets/stylesheets/maps.css.sass b/app/assets/stylesheets/maps.css.sass
index dd5db9f9..168cd541 100644
--- a/app/assets/stylesheets/maps.css.sass
+++ b/app/assets/stylesheets/maps.css.sass
@@ -1,13 +1,14 @@
 @import compass
 @import leaflet
+@import leaflet.markercluster
+@import leaflet.markercluster.default
 
 #map
   +box-shadow(0 0 1em SteelBlue)
   +transition(none)
-
-#map *
-  /* Popup are better displayed with this: */
-  max-width: initial
+  *
+    /* Popup are better displayed with this: */
+    max-width: initial
 
 .maps #map
   height: 60em
diff --git a/app/models/event.rb b/app/models/event.rb
index 073a997a..39008953 100644
--- a/app/models/event.rb
+++ b/app/models/event.rb
@@ -79,7 +79,9 @@ class Event < ActiveRecord::Base
 
   def as_json(_options = {})
     { type: 'Feature', properties: {
+      id: id,
       name: title,
+      tags: tags,
       popupContent: "<a href=\"/#{self.class.name.downcase.pluralize}/#{id}\"" \
         + ">#{city}: #{title}</a>"
     }, geometry: {