Add QP on user carte

app/assets/javascripts/carte.js

@@ -11,13 +11,15 @@ function initCarto() {
     if (typeof position.zoom == 'undefined')
         position.zoom = 13;
 
-    var map = L.map("map", {
+    map = L.map("map", {
         center: new L.LatLng(position.lat, position.lon),
         zoom: position.zoom,
         layers: [OSM]
     });
 
-    var freeDraw = new L.FreeDraw({
+    display_qp([]);
+
+    freeDraw = new L.FreeDraw({
         //mode: L.FreeDraw.MODES.CREATE
     });
 
@@ -33,12 +35,13 @@ function initCarto() {
     else if (position.lat == LAT && position.lon == LON)
         map.setView(new L.LatLng(position.lat, position.lon), 5);
 
-    add_event_freeDraw(freeDraw);
+    add_event_freeDraw();
 }
 
-function add_event_freeDraw(freeDraw) {
+function add_event_freeDraw() {
     freeDraw.on('markers', function (e) {
         $("#json_latlngs").val(JSON.stringify(e.latLngs));
+        display_qp(get_qp(e.latLngs)['quartier_prioritaires']);
     });
 
     $("#new").on('click', function (e) {
@@ -67,3 +70,50 @@ function get_position() {
 
     return position;
 }
+
+function get_qp(coordinates) {
+    var qp;
+
+    $.ajax({
+        method: 'post',
+        url: '/users/dossiers/' + dossier_id + '/carte/qp',
+        data: {coordinates: JSON.stringify(coordinates)},
+        dataType: 'json',
+        async: false
+    }).done(function (data) {
+        qp = data
+    });
+
+    return qp;
+}
+
+function display_qp(qp_list) {
+    qp_array = jsObject_to_array(qp_list);
+
+    $("#qp_list ul").html('');
+
+    new_qpLayer();
+
+    if (qp_array.length > 0) {
+        qp_array.forEach(function (qp) {
+            $("#qp_list ul").append('<li>' + qp.commune + ' : ' + qp.nom + '</li>');
+            qpItems.addData(qp.geometry)
+        });
+    }
+    else
+        $("#qp_list ul").html('<li>AUCUN</li>');
+}
+
+function new_qpLayer() {
+    if (typeof qpItems != 'undefined')
+        map.removeLayer(qpItems);
+
+    qpItems = new L.GeoJSON();
+    qpItems.addTo(map);
+}
+
+function jsObject_to_array(qp_list) {
+    return Object.keys(qp_list).map(function (v) {
+        return qp_list[v];
+    });
+}

app/assets/stylesheets/carte.scss

@@ -1,18 +1,40 @@
 // Place all the styles related to the carte controller here.
 // They will automatically be included in application.css.
 // You can use Sass (SCSS) here: http://sass-lang.com/
+@import "bootstrap";
 
 table {
-  font-size: 13;
+  font-size: 13px;
 }
 
 #map{
+  @extend .col-md-12;
+  @extend .col-lg-12;
+
   height:600px;
-  width: 100%;
+}
+
+#map.qp {
+  @extend .col-md-9;
+  @extend .col-lg-9;
+}
+
+#qp_list {
+  @extend .col-md-3;
+  @extend .col-lg-3;
+
+  h3 {
+    margin-top:0px;
+  }
+
+  ul li {
+    margin-bottom:10px;
+  }
 }
 
 #map.mini{
   height:300px;
+  width:100%;
 }
 
 #map section.overlay {
@@ -30,7 +52,7 @@ table {
   cursor: crosshair !important;
 }
 
-#map g path {
+#map g path.tracer {
   transition: all 0.25s;
   stroke-width: 4px;
   stroke-opacity: 1;

app/controllers/users/carte_controller.rb

@@ -36,4 +36,25 @@ class Users::CarteController < UsersController
       render json: {lon: '0', lat: '0', dossier_id: params[:dossier_id]}
     end
   end
+
+  def get_qp
+    coordinates = JSON.parse(params[:coordinates])
+
+    qp = generate_qp coordinates
+
+    render json: {quartier_prioritaires: qp}
+  end
+
+  private
+
+  def generate_qp coordinates
+    qp = {}
+
+    coordinates.each_with_index do |coordinate, index|
+      coordinate = coordinates[index].map { |latlng| [latlng['lng'], latlng['lat']] }
+      qp = qp.merge CARTO::SGMAP::QuartierPrioritaireAdapter.new(coordinate).to_params
+    end
+
+    qp
+  end
 end

app/services/geojson_service.rb

@@ -1,10 +1,12 @@
 class GeojsonService
-  def self.to_polygon coordinates
-    {
+  def self.to_json_polygon coordinates
+    polygon = {
         geo: {
             type: "Polygon",
             coordinates: [coordinates]
         }
     }
+
+    polygon.to_json
   end
 end

app/views/users/carte/show.html.haml

@@ -11,7 +11,11 @@
 
   %br
   %br
-  #map{style: 'height:600px; width: 100%;'}
+  .row
+    #map.qp
+    #qp_list
+      %h3 Quartiers prioritaites
+      %ul
 
   = form_tag(url_for({controller: :carte, action: :save_ref_api_carto, dossier_id: @dossier.id}), class: 'form-inline', method: 'POST') do
     %br

app/views/users/sessions/new.html.haml

@@ -14,14 +14,14 @@
       = f.label :email
     .input-group
       .input-group-addon
-        %span.glyphicon.glyphicon-user
+        %span.fa.fa-user
       = f.email_field :email, class: 'form-control'
     %br
     %h4
       = f.label :password
     .input-group
       .input-group-addon
-        %span.glyphicon.glyphicon-asterisk
+        %span.fa.fa-asterisk
       = f.password_field :password, autocomplete: "off", class: 'form-control'
     %br
     %br

config/routes.rb

@@ -33,6 +33,7 @@ Rails.application.routes.draw do
       post '/commentaire' => 'commentaires#create'
 
       get '/carte/position' => 'carte#get_position'
+      post '/carte/qp' => 'carte#get_qp'
       get '/carte' => 'carte#show'
       post '/carte' => 'carte#save_ref_api_carto'
 

lib/carto/sgmap/quartier_prioritaire_adapter.rb

@@ -1,6 +1,6 @@
 class CARTO::SGMAP::QuartierPrioritaireAdapter
   def initialize(coordinates)
-    @coordinates = GeojsonService.to_polygon(coordinates)
+    @coordinates = GeojsonService.to_json_polygon(coordinates)
   end
 
   def data_source
@@ -11,8 +11,10 @@ class CARTO::SGMAP::QuartierPrioritaireAdapter
     params = {}
 
     data_source[:features].each_with_index do |feature, index|
-      params[index] = feature[:properties]
-      params[index][:geometry] = feature[:geometry].to_s
+      qp_code = feature[:properties][:code]
+
+      params[qp_code] = feature[:properties]
+      params[qp_code][:geometry] = feature[:geometry]
     end
 
     params

spec/controllers/users/carte_controller_spec.rb

@@ -96,7 +96,7 @@ RSpec.describe Users::CarteController, type: :controller do
     context 'retour d\'un fichier JSON avec 3 attributs' do
       before do
         stub_request(:get, "http://api-adresse.data.gouv.fr/search?limit=1&q=#{adresse}")
-          .to_return(status: 200, body: '{"query": "50 avenue des champs \u00e9lys\u00e9es Paris 75008", "version": "draft", "licence": "ODbL 1.0", "features": [{"geometry": {"coordinates": [2.306888, 48.870374], "type": "Point"}, "type": "Feature", "properties": {"city": "Paris", "label": "50 Avenue des Champs \u00c9lys\u00e9es 75008 Paris", "housenumber": "50", "id": "ADRNIVX_0000000270748251", "postcode": "75008", "name": "50 Avenue des Champs \u00c9lys\u00e9es", "citycode": "75108", "context": "75, \u00cele-de-France", "score": 0.9054545454545454, "type": "housenumber"}}], "type": "FeatureCollection", "attribution": "BAN"}', headers: {})
+            .to_return(status: 200, body: '{"query": "50 avenue des champs u00e9lysu00e9es Paris 75008", "version": "draft", "licence": "ODbL 1.0", "features": [{"geometry": {"coordinates": [2.306888, 48.870374], "type": "Point"}, "type": "Feature", "properties": {"city": "Paris", "label": "50 Avenue des Champs u00c9lysu00e9es 75008 Paris", "housenumber": "50", "id": "ADRNIVX_0000000270748251", "postcode": "75008", "name": "50 Avenue des Champs u00c9lysu00e9es", "citycode": "75108", "context": "75, u00cele-de-France", "score": 0.9054545454545454, "type": "housenumber"}}], "type": "FeatureCollection", "attribution": "BAN"}', headers: {})
 
         get :get_position, dossier_id: dossier_id
       end
@@ -119,4 +119,28 @@ RSpec.describe Users::CarteController, type: :controller do
       end
     end
   end
+
+  describe 'POST #get_qp' do
+    before do
+      allow_any_instance_of(CARTO::SGMAP::QuartierPrioritaireAdapter).
+          to receive(:to_params).
+                 and_return({"QPCODE1234" => { :code => "QPCODE1234", :geometry => { :type=>"MultiPolygon", :coordinates=>[[[[2.38715792094576, 48.8723062632126], [2.38724851642619, 48.8721392348061]]]] }}})
+
+      post :get_qp, dossier_id: dossier_id, coordinates: coordinates
+    end
+
+    context 'when coordinates are empty' do
+      let(:coordinates) { '[]' }
+
+      subject { JSON.parse(response.body) }
+      it { expect(subject['quartier_prioritaires']).to eq({}) }
+    end
+
+    context 'when coordinates are informed' do
+      let(:coordinates) { '[[{"lat":48.87442541960633,"lng":2.3859214782714844},{"lat":48.87273183590832,"lng":2.3850631713867183},{"lat":48.87081237174292,"lng":2.3809432983398438},{"lat":48.8712640169951,"lng":2.377510070800781},{"lat":48.87510283703279,"lng":2.3778533935546875},{"lat":48.87544154230615,"lng":2.382831573486328},{"lat":48.87442541960633,"lng":2.3859214782714844}]]' }
+
+      subject { JSON.parse(response.body) }
+      it { expect(subject['quartier_prioritaires']).not_to be_nil }
+    end
+  end
 end

spec/features/users/drawing_a_zone_with_freedraw_spec.rb

@@ -0,0 +1,49 @@
+require 'spec_helper'
+
+feature 'drawing a zone with freedraw' do
+  let(:user) { create(:user) }
+  let(:dossier) { create(:dossier, :with_procedure, :with_entreprise, user: user) }
+
+  context 'when user is not logged in' do
+    before do
+      visit users_dossier_carte_path dossier_id: dossier.id
+    end
+
+    scenario 'he is redirected to login page' do
+      expect(page).to have_css('#login_user')
+    end
+
+    context 'when he enter login information' do
+      before do
+        within('#new_user') do
+          page.find_by_id('user_email').set user.email
+          page.find_by_id('user_password').set user.password
+          page.click_on 'Se connecter'
+        end
+      end
+
+      scenario 'he is redirected to carte page' do
+        expect(page).to have_css('.content #map')
+      end
+
+      context 'when draw a zone on #map', js: true  do
+        before do
+          allow_any_instance_of(Users::CarteController).
+              to receive(:generate_qp).
+                     and_return({"QPCODE1234" => { :code => "QPCODE1234", :nom => "Quartier de test", :commune => "Paris", :geometry => { :type=>"MultiPolygon", :coordinates=>[[[[2.38715792094576, 48.8723062632126], [2.38724851642619, 48.8721392348061]]]] }}})
+
+          page.execute_script('freeDraw.fire("markers", {latLngs: []});')
+          wait_for_ajax
+        end
+
+        scenario 'QP name is present on page' do
+          expect(page).to have_content('Quartier de test')
+        end
+
+        scenario 'Commune is present on page' do
+          expect(page).to have_content('Paris')
+        end
+      end
+    end
+  end
+end

spec/lib/carto/sgmap/quartier_prioritaire_adapter_spec.rb

@@ -18,11 +18,12 @@ describe CARTO::SGMAP::QuartierPrioritaireAdapter do
     it { expect(subject).to be_a_instance_of(Hash) }
 
     context 'Attributs' do
-      it { expect(subject[0][:code]).to eq('QP057019') }
-      it { expect(subject[0][:nom]).to eq('Hauts De Vallières') }
-      it { expect(subject[0][:commune]).to eq('Metz') }
+      let(:qp_code) { 'QP057019' }
+      it { expect(subject[qp_code][:code]).to eq(qp_code) }
+      it { expect(subject[qp_code][:nom]).to eq('Hauts De Vallières') }
+      it { expect(subject[qp_code][:commune]).to eq('Metz') }
 
-      it { expect(subject[0][:geometry]).to eq('{:type=>"MultiPolygon", :coordinates=>[[[[6.2136923480551, 49.1342109827851], [6.21416055031881, 49.1338823553928]]]]}') }
+      it { expect(subject[qp_code][:geometry]).to eq({:type=>"MultiPolygon", :coordinates=>[[[[6.2136923480551, 49.1342109827851], [6.21416055031881, 49.1338823553928]]]]}) }
     end
   end
 

spec/services/geojson_service_spec.rb

@@ -9,10 +9,10 @@ describe GeojsonService do
               type: "Polygon",
               coordinates: [coordinates]
           }
-      }
+      }.to_json
     }
 
-    subject { described_class.to_polygon coordinates }
+    subject { described_class.to_json_polygon coordinates }
 
     describe 'coordinates are empty' do
       let(:coordinates) { '' }