eligibilite/js/app.js

// file:///Users/francoisbeaufils/Downloads/geocoder-demo-master/index.html
var app = angular.module('application', ['ngMaterial', 'adaptive.detection']);

app.directive('skrollr', function() {
  var directiveDefinitionObject = {
    link: function() {
      skrollr.init();
    }
  };

  return directiveDefinitionObject;
});


app.controller('mainController', function($scope, $detection, $http, $mdSidenav, $timeout, $sce, $mdToast) {
  $scope.title   = "Manche Numerique";

  var nbJoursFTTH = 300,
      siteName    = 'Eligibilité Manche Numérique',
      siteUrl     = 'http://eligibilite.manchenumerique.fr',
      siteEmail   = 'ffth@manchenumerique.fr',
      siteAddresse= '235, rue Joseph Cugnot Zone Delta, 50000 SAINT LÔ';

  var catTypeVoie = [
    {
      "name": "Allée",
      "id"  : "allee"
    },
    {
      "name": "Avenue",
      "id"  : "avenue"
    },
    {
      "name": "Boulevard",
      "id"  : "boulevard"
    },
    {
      "name": "Carrefour",
      "id"  : "carrefour"
    },
    {
      "name": "Chemin",
      "id"  : "chemin"
    },
    {
      "name": "Cité",
      "id"  : "cite"
    },
    {
      "name": "Hammeau",
      "id"  : "hammeau"
    },
    {
      "name": "Impasse",
      "id"  : "impasse"
    },
    {
      "name": "Lieu-dit",
      "id"  : "lieu_dit"
    },
    {
      "name": "Lotissement",
      "id"  : "lotissement"
    },
    {
      "name": "Place",
      "id"  : "place"
    },
    {
      "name": "Résidence",
      "id"  : "residence"
    },
    {
      "name": "Route",
      "id"  : "route"
    },
    {
      "name": "Rue",
      "id"  : "rue"
    },
    {
      "name": "Villa",
      "id"  : "villa"
    },
    {
      "name": "Village",
      "id"  : "village"
    }
  ];

  var catVousEtes = [
    {
      "name": "Locataire de ce logement",
      "id"  : "locataire"
    },
    {
      "name": "Occupant à titre gratuit de ce logement",
      "id"  : "occupant_gratuit"
    },
    {
      "name": "Propriétaire de ce logement",
      "id"  : "proprietaire"
    }
  ];

  var catCeLogementEst = [
    {
      "name": "Votre résidence principale",
      "id"  : "residence_principale"
    },
    {
      "name": "Votre résidence secondaire",
      "id"  : "residence_secondaire"
    }
  ];

  $scope.formulaires = {
    "eligibilite": {
      "sections": [
        {
          "name": "Générale",
          "visible": false,
          "lines": [
            {
              "ctrls": [
                {
                  "name"   : "Prénom",
                  "id"     : "prenom",
                  "type"   : "text",
                  "width"  : "50%",
                  "require": true,
                  "isValid": function(value) {
                    return !!value && value.length > 2;
                  },
                  "msg"    : 'Prénom invalide'
                },
                {
                  "name"   : "Nom",
                  "id"     : "nom",
                  "type"   : "text",
                  "width"  : "50%",
                  "require": true,
                  "isValid": function(value) {
                    return !!value && value.length > 2;
                  },
                  "msg"    : 'Nom invalide'
                }
              ]
            },
            {
              "ctrls": [
                {
                  "name"   : "Email",
                  "id"     : "email",
                  "type"   : "text",
                  "width"  : null,
                  "require": true,
                  "isValid": function(value) {
                    function validateEmail(email) {
                        var re = /^([\w-]+(?:\.[\w-]+)*)@((?:[\w-]+\.)*\w[\w-]{0,66})\.([a-z]{2,6}(?:\.[a-z]{2})?)$/i;
                        return re.test(email);
                    }
                    return validateEmail(value);
                  },
                  "msg"    : 'Email invalide.'
                }
              ]
            },
            {
              "ctrls": [
                {
                  "name"   : "Téléphone fixe",
                  "id"     : "telephone_fixe",
                  "type"   : "text",
                  "width"  : "50%",
                  "require": false
                },
                {
                  "name"   : "Téléphone portable",
                  "id"     : "telephone_portable",
                  "type"   : "text",
                  "width"  : "50%",
                  "require": false
                }
              ]
            }
          ]
        },
        {
          "name": "Adresse",
          "visible": true,
          "lines": [
            {
              "ctrls": [
                {
                  "name"   : "Numero",
                  "id"     : "numero_voie",
                  "type"   : "text",
                  "width"  : "80px",
                  "require": false
                },
                {
                  "name"   : "Type voie",
                  "id"     : "type_voie",
                  "type"   : "select",
                  "width"  : "106px",
                  "require": false,
                  "options": {
                    "categories": catTypeVoie
                  }
                },
                {
                  "name"   : "Nom voie",
                  "id"     : "nom_voie",
                  "type"   : "text",
                  "width"  : "378px",
                  "require": true,
                  "isValid": function(value) {
                    return !!value;
                  },
                  "msg"    : 'Nom de voie invalide.'
                }
              ]
            },
            {
              "ctrls": [
                {
                  "name"   : "Complément Adresse",
                  "id"     : "complement_addresse",
                  "type"   : "textarea",
                  "width"  : null,
                  "require": false
                }
              ]
            },
            {
              "ctrls": [
                {
                  "name"   : "Bâtiment",
                  "id"     : "batiment",
                  "type"   : "text",
                  "width"  : "50%",
                  "require": false
                },
                {
                  "name"   : "Cage escalier",
                  "id"     : "cage_escalier",
                  "type"   : "text",
                  "width"  : "50%",
                  "require": false
                }
              ]
            },
            {
              "ctrls": [
                {
                  "name"   : "Etage / Niveau",
                  "id"     : "etage",
                  "type"   : "text",
                  "width"  : "50%",
                  "require": false
                },
                {
                  "name"   : "Numero appartement / porte",
                  "id"     : "numero_appartement",
                  "type"   : "text",
                  "width"  : "50%",
                  "require": false
                }
              ]
            },
            {
              "ctrls": [
                {
                  "name"   : "Code postal",
                  "id"     : "code_postal",
                  "type"   : "text",
                  "width"  : "50%",
                  "require": true,
                  "isValid": function(value) {
                    if(!value || value.length !== 5 || isNaN(parseInt(value, 10))) {
                      return false;
                    }
                    return true;
                  },
                  "msg"    : 'Non valide'
                },
                {
                  "name"   : "Ville",
                  "id"     : "ville",
                  "type"   : "text",
                  "width"  : "50%",
                  "require": true,
                  "isValid": function(value) {
                    return !!value && value.length > 2;
                  },
                  "msg"    : 'Ville invalide.'
                }
              ]
            }
          ]
        },
        {
          "name": "Logement",
          "visible": true,
          "lines": [
            {
              "ctrls": [
                {
                  "name"   : "Vous êtes",
                  "id"     : "vous_etes",
                  "type"   : "radio",
                  "width"  : null,
                  "require": true,
                  "options": {
                    "categories": catVousEtes,
                    "alertes": {
                      "locataire": "Si vous êtes locataire, vous devez impérativement avertir votre propriétaire que vous souhaitez bénéficier du pré-raccordement à la fibre optique."
                    }
                  },
                  "isValid": function(value) {
                    return !!value;
                  },
                  "msg"    : 'Vous devez sélectionner une entrée.'
                }
              ]
            },
            {
              "ctrls": [
                {
                  "name"   : "Ce logement est",
                  "id"     : "ce_logement_est",
                  "type"   : "radio",
                  "width"  : null,
                  "require": true,
                  "options": {
                    "categories": catCeLogementEst
                  },
                  "isValid": function(value) {
                    return !!value;
                  },
                  "msg"    : 'Vous devez sélectionner une entrée.'
                }
              ]
            }
          ]
        },
        {
          "name": "Conditions pour le raccordement final d’abonné dans un immeuble individuel",
          "visible": true,
          "lines": [
            {
              "text": "Le Syndicat Mixte Manche Numérique, composé du Département de la Manche et des Etablissements Publics de Coopération Intercommunale (EPCI) du département, a pour mission l'aménagement numérique du territoire manchois, du point de vue tant des réseaux que du développement des usages du numérique.\r\nDans ce cadre, Manche Numérique a élaboré un Schéma Directeur Territorial d'Aménagement Numérique (SDTAN), qui vise une couverture FTTH (fibre optique jusqu’à l’abonné) universelle du département. Le SDTAN prévoit ainsi le déploiement d’un réseau de communications électroniques à très haut débit FTTH sur le territoire de la Manche.\r\nManche Numérique assurera le déploiement de ce réseau public sous sa maîtrise d’ouvrage. S’agissant de l’exploitation du réseau, celle-ci sera confiée à un délégataire de service public désigné par Manche Numérique à l’issue d’une procédure de mise en concurrence. Le futur gestionnaire du réseau aura en charge notamment sa commercialisation auprès des opérateurs de communications électroniques (les fournisseurs d’accès à internet), qui eux-mêmes délivreront des services de communications électroniques aux utilisateurs finals (les abonnés).\r\nDans le cadre du déploiement de ce réseau, Manche Numérique réalise sous sa maîtrise d’ouvrage des raccordements finals d’abonnés au futur réseau, qui seront ensuite remis au futur délégataire de service public en vue de leur gestion.\r\nC’est dans ce contexte que Manche Numérique propose aux intéressés qui le souhaitent, de faire d’ores et déjà raccorder leur logement ou local à usage professionnel, au futur réseau de communications électroniques à très haut débit FTTH.",
              "ctrls": [
                  {
                    "name"   : "Accord",
                    "id"     : "accord",
                    "libelle": "Je souhaite être pré-raccordé au réseau de fibre optique et accepte les conditions de paiement de 50€. IMPORTANT : le règlement ne vous sera demandé qu’après travaux effectués",
                    "type"   : "checkbox",
                    "width"  : null,
                    "require": true,
                    "isValid": function(value) {
                      return !!value;
                    },
                    "msg"    : 'Vous devez doner votre accord.'
                  }
               ]
            }
          ]
        },
        {
          "name": "Informatique et libertés",
          "visible": false,
          "lines": [
            {
              "ctrls": [
                  {
                    "name"   : "Informatique et libertés",
                    "id"     : "info_et_libertes",
                    "libelle": 'La personne responsable du traitement de la présente demande de pré-raccordement est le représentant du Syndicat Mixte Manche Numérique, le Président, Monsieur Serge DESLANDES. Les informations portées sur ce formulaire sont obligatoires. Elles font l’objet d’un traitement informatisé destiné au raccordement final de l’usager à la fibre optique (FTTH) ainsi qu’à l’exploitation du réseau optique. Les destinataires des données sont : le Syndicat Mixte Manche Numérique, les entreprises en charge de réaliser les travaux de raccordement, ainsi que l’exploitant du réseau optique. Conformément à la loi "informatique et libertés" du 6 janvier 1978 modifiée, vous bénéficiez d’un droit d’accès, de rectification aux informations qui vous concernent, d’opposition au traitement de vos données personnelles. Si vous souhaitez exercer ce droit et obtenir communication des informations vous concernant, veuillez-vous adresser au Syndicat Mixte Manche Numérique ftth@manchenumerique.fr. Dans l’hypothèse où le présent formulaire est incomplet et/ou illisible, la présente demande de raccordement ne sera pas traitée.',
                    "type"   : "checkbox",
                    "width"  : null,
                    "require": true,
                    "isValid": function(value) {
                      return !!value;
                    },
                    "msg"    : 'Vous devez accepter.'
                  }
               ]
            }
          ]
        }
      ]
    }
  };


  $scope.closeRight = function() {
    $mdSidenav('right').close().then(function(){});
  };

  $scope.toggleRight = function() {
    $mdSidenav('right').toggle()
    .then(function(){});
  };

  var stlo = [49.1154686, -1.0828136000000086];

  var map = L.map('map', {zoomControl:false}).setView(stlo, 9);

  map.on('dblclick', function(e) {
    var p = e.latlng;
    console.log('click', e.latlng); // e is an event object (MouseEvent in this case)
    $scope.geoCode = {
      x: p.lng,
      y: p.lat
    };
    addCurrentMarker();
    $scope.showResultPane();
    getResults();
  });

  //http://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png
  //http://{s}.api.cartocdn.com/base-light/{z}/{x}/{y}.png
  //http://{s}.api.cartocdn.com/base-flatblue/{z}/{x}/{y}.png
  //http://{s}.api.cartocdn.com/base-dark/{z}/{x}/{y}.png
  //http://{s}.tile.osm.org/{z}/{x}/{y}.png
  //http://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/14/5616/8137

  var maps = {
    "carte"     : 'http://server.arcgisonline.com/ArcGIS/rest/services/World_Street_Map/MapServer/tile/{z}/{y}/{x}',
    "satellite" : 'http://services.arcgisonline.com/ArcGIS/rest/services/World_Imagery/MapServer/tile/{z}/{y}/{x}'
  };

  var cLayer = L.tileLayer(maps.carte, {
      attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="http://mapbox.com">Mapbox</a>',
      maxZoom: 18
  }).addTo(map);

  var styleOpts = {
    color    : 'red',
    fillColor: 'red',
    weight   : 8
  };

  $scope.data = {};

  var parseData = function(identifier, data, style, properties) {
    var getPolygonsCoord = function(type, coord) {
      var result = [];
      if(type === 'Polygon') {
        result.push(_.map(coord[0], function(r) {return [r[1], r[0]];}));
      }
      if(type === 'MultiPolygon') {
        var p = [];
        _.each(coord, function(c) {
          result.push(_.map(c[0], function(r) {return [r[1], r[0]];}));
        });

      }
      return result;
    };

    var records = [];
    _.each(data.features, function(r) {
      var record = r.properties;
      var polygons = getPolygonsCoord(r.geometry.type, r.geometry.coordinates);
      record._coordinates = r.geometry.coordinates;
      record._type        = r.geometry.type;
      record._polygons    = polygons;
      record._style       = style;
      record._properties  = properties;
      records.push(record);
    });
    $scope.data[identifier] = records;
  };

  var isDate = function(value) {
    return (value.toString().length === 14 && value.toString().substring(0,2) === "20");
  };

  var formatDate = function(value) {
    return moment(value.toString().substr(0,4) + '-' + value.toString().substr(4,2) + '-' + value.toString().substr(6,2)).locale("fr");
  };

  $scope.getHtmlContent = function(identifier, record) {

    var title = record._properties.name.string ? record._properties.name.string : record[record._properties.name.key];

    // Tooltip content
    var tooltip = '<div class="popup-line"><span class="popup-title">' + title +'</span></div>' +
                  '<hr>';

    _.each(record, function(value, property) {
      if(property.charAt(0) === '_' ||
         (record._properties.hidden && record._properties.hidden.indexOf(property) !== -1) ||
         record._properties.name.key === property ||
         value === null |
         typeof value === 'undefined') {

        return;
      }

      var label = $scope.dictionary[property] || property;

      value = $scope.dictionary[value] || value;

      var date;
      if(property.substring(0, 5) === 'DATE_' && !$scope.dictionary[value] && isDate(value)) {
        date = formatDate(value);
      }
      tooltip += '<div class="popup-line"><div class="popup-label">' + label + '</div><div class="popup-value">' + (date ? date.locale("fr").format('ddd, LL') : value) + '</div><div class="popup-small-date">' + (date ? date.locale("fr").fromNow() : '') + '</div></div>';
    });

    return tooltip;
  };

  $scope.formatResults = function(identifier, results) {
    return $sce.trustAsHtml($scope.getHtmlContent(identifier, results));
  };

  $scope.computeDateFtthAvailable = function(date) {
    if(!date) {return;}
    var momentDate = formatDate(date);

    momentDate.add(nbJoursFTTH, 'days');

    var result =  '<div class="popup-line"><div class="box-eligibilite-title">Date prévisionnelle abonnement FTTH</div><div style="font-weight: bold;" class="popup-value">' + momentDate.locale("fr").format('ddd, LL') + '</div><div class="popup-small-date">' + momentDate.locale("fr").fromNow() + '</div></div>';
    return $sce.trustAsHtml(result);
  };

  var layer = {};
  $scope.computeLayer = function(identifier) {
    var Lpolygons = [];
    _.each($scope.data[identifier], function(record) {

      _.each(record._polygons, function(polygon) {
        Lpolygons.push(L.polygon(polygon, record._style).bindPopup($scope.getHtmlContent(identifier, record)));
      });
    });
    layer[identifier] = L.layerGroup(Lpolygons);
  };

  $scope.showLayer = function(identifier) {
    map.addLayer(layer[identifier]);
  };

  $scope.hideLayer = function(identifier) {
    map.removeLayer(layer[identifier]);
  };

  $scope.colors = {
    "ftth": "#8cc474", // green
    "mimo": "#f9b256", // orange
    "adsl": "#76a7fa"  // blue
  };

  $http({method: 'POST', url: 'data/dictionary.json'}).success(function(data) {
    $scope.dictionary = data;
  });

  $http({method: 'POST', url: 'data/Contour_Manche.json'}).success(function(data) {

    var style = {
      color    : 'blue',
      fillColor: 'blue',
      weight   : 2
    };
    $scope.data.manche = [{
      _polygons   : [data.features[0].geometry.coordinates[0]],
      _style      : style,
      _properties : {
        name : {string: 'Manche'}
      }
    }];

    var mancheCoordinates = data && data.features && data.features[0] &&  data.features[0].geometry && data.features[0].geometry.coordinates && data.features[0].geometry.coordinates[0]; // response data
    _.each(mancheCoordinates, function(c, i) {
      mancheCoordinates[i] = [c[1], c[0]];
    });

    // Rectangle coordinates around Manche
    //var mancheCoordinates = [[49.732307856286, -1.97117692088061],[48.4, -1.75],[48.4, -0.5],[49.732307856286, -1.2]];

    // Debug: show manche limits
    //L.polygon(mancheCoordinates, {color: 'blue', fillColor: 'blue',weight: 8}).addTo(map);

    var searchExtent = {
      "xmin" : _.max(_.map(mancheCoordinates, function(c) {return c[1];})),
      "ymin" : _.max(_.map(mancheCoordinates, function(c) {return c[0];})),
      "xmax" : _.min(_.map(mancheCoordinates, function(c) {return c[1];})),
      "ymax" : _.min(_.map(mancheCoordinates, function(c) {return c[0];})),
      "spatialReference" : {"wkid" : 84}
    };

    var suggestURL = 'https://geocode.arcgis.com/arcgis/rest/services/World/GeocodeServer/suggest?f=pjson&searchExtent=' + JSON.stringify(searchExtent);
    var findURL    = 'https://geocode.arcgis.com/arcgis/rest/services/World/GeocodeServer/find?f=pjson&searchExtent=' + JSON.stringify(searchExtent);

    $('.address-bar input').typeahead({
      onSelect: function(item) {
        $scope.address  = item.text;
        var suggestion  = _.find($scope.suggestions, {text: item.text});
        $scope.magicKey = suggestion && suggestion.magicKey;
        $scope.$evalAsync();
        $scope.onSubmitAddress();
      },
      ajax: {
        url: suggestURL,
        timeout: 500,
        displayField: "text",
        triggerLength: 1,
        method: "get",
        loadingClass: "loading-circle",
        preDispatch: function (query) {
          var q = query;
          $('.typeahead.dropdown-menu').hide();
          $scope.suggestions = null;
          return {
              text: q
          };
        },
        valueField: 'suggestions',
        preProcess: function (data) {
          console.log('suggestions', data && data.suggestions);

          $scope.suggestions = data.suggestions;
          $scope.magicKey = null;
          return data.suggestions;
        }
      }
    });

    $scope.getGeoCode = function(address, magicKey, callback) {
      getGeoCodeInProgress = true;
      var url = findURL + "&text=" + address + ((magicKey) ? ("&magicKey=" + magicKey) : ', Basse-Normandie, France');
      console.log('url', url);
      $.get(
      url,
      function(data, status) {
        data = JSON.parse(data);

        if (status === 'success' && data.locations[0]) {

          if(data.locations[0].extent.xmax < searchExtent.xmin &&
            data.locations[0].extent.xmax > searchExtent.xmax &&
            data.locations[0].extent.xmin > searchExtent.xmax&&
            data.locations[0].extent.xmin > searchExtent.xmax) {

            getGeoCodeInProgress = false;
            return callback(null, data);
          }
          getGeoCodeInProgress = false;
          callback('No result for ' + address);
        } else {
          getGeoCodeInProgress = false;
          callback(status !== 'success' ? status : 'No result for ' + address);
        }
      });
    };
  });

  console.time('FTTH data');
  $http({method: 'POST', url: 'data/FFTH_zapm_partielle.json'}).success(function(data) {
    var style = {
      color    : $scope.colors.ftth,
      fillColor: $scope.colors.ftth,
      weight   : 2
    };

    var properties = {
      name  : {key: 'ATD'},
      hidden: ['ID_PM', 'MARCHE', 'ID_FT_ADSL', 'ID_FTTH_MN_ZAPM_PARTIELLE', 'ID_ZAPM_PARTIELLE', 'ID_ZAPM'],
      position: ['DATE_DEB_TRAV_PREV']
    };

    parseData('ftth', data, style, properties);
    console.timeEnd('FTTH data');
    console.debug('Data for FTTH are ready', data);
    if($scope.data.mimo && $scope.data.adsl && $scope.data.ftth) {
      $scope.loaded = true;
    }
    $scope.$evalAsync();
  });

  console.time('ADSL data');
  $http({method: 'POST', url: 'data/TEL_FT_ADSL.json'}).success(function(data) {
    var style = {
      color    : $scope.colors.adsl,
      fillColor: $scope.colors.adsl,
      weight   : 2
    };

    var properties = {
      name  : {key: 'LEGENDE'},
      hidden: ['NATURE', 'NRA_CETE', 'NRA_TMP', 'NRA_DPT', 'ID_FT_ADSL']
    };

    parseData('adsl', data, style, properties);
    console.timeEnd('ADSL data');
    console.debug('Data for ADSL are ready', data);
    if($scope.data.mimo && $scope.data.adsl && $scope.data.ftth) {
     $scope.loaded = true;
    }
    $scope.$evalAsync();
  });

  console.time('MiMo data');
  $http({method: 'POST', url: 'data/Couverture_mimo.json'}).success(function(data) {
    var style = {
      color    : $scope.colors.mimo,
      fillColor: $scope.colors.mimo,
      weight   : 2
    };

    var properties = {
      name  : {string: 'Couverture MiMo'},
      hidden: ['ID_MIMO_COUVERTURE']
    };

    parseData('mimo', data, style, properties);
    console.timeEnd('MiMo data');
    console.debug('Data for MIMO are ready', data);
    if($scope.data.mimo && $scope.data.adsl && $scope.data.ftth) {
     $scope.loaded = true;
    }
    $scope.$evalAsync();
  });

  window.map = map;

  var getGeoCodeInProgress = false;


  var isInside = function(polygon, point) {
    // ray-casting algorithm based on
    // http://www.ecse.rpi.edu/Homepages/wrf/Research/Short_Notes/pnpoly.html

    var y = point.x ? point.x : point[0],
        x = point.y ? point.y : point[1];

    var inside = false;
    for (var i = 0, j = polygon.length - 1; i < polygon.length; j = i++) {
        var xi = polygon[i][0], yi = polygon[i][1];
        var xj = polygon[j][0], yj = polygon[j][1];

        var intersect = ((yi > y) != (yj > y)) && (x < (xj - xi) * (y - yi) / (yj - yi) + xi);

        if (intersect) {
          inside = !inside;
        }
    }

    return inside;
  };

  var getRecordsFor = function(identifier, coordinates) {
    var records = [];
    _.each($scope.data[identifier], function(record) {
      _.some(record._polygons, function(polygon) {
        if(isInside(polygon, coordinates)) {
          records.push(record);
          return true;
        }
      });
    });



    // Debug
    var debug = false;
    if (debug) {
      var colors = ['red', 'green', 'blue', 'black', 'silver', 'yellow'];

      var marker = L.marker([coordinates.y, coordinates.x]).addTo(map);
      var Lpolygons = [];
      _.each(records, function(record, i) {
        var style = {
          color    : colors[i],
          fillColor: colors[i],
          weight   : 4
        };
        _.each(record._polygons, function(polygon) {
          Lpolygons.push(L.polygon(polygon, style).bindPopup($scope.getHtmlContent(identifier, record)));
        });
      });
      L.layerGroup(Lpolygons).addTo(map);
    }
    return records;
  };

  $scope.showResultPane = function() {
    $('#result').animate({height: ($('body').height() / 2) + 'px'}, 1000);

    $('#map').animate({
      height: ($('body').height() / 2) + 'px',
    }, 1000, function() {

      // Animation complete.
      map.invalidateSize();
      map.setView(new L.LatLng($scope.geoCode.y, $scope.geoCode.x), 14);
    });
  };

  $scope.isFormValid = function() {

    if(!$scope.result || !$scope.result.eligibilite) {return;}

    var isValid = true;
    _.each($scope.formulaires.eligibilite.sections, function(section) {
      _.each(section.lines, function(line) {
        _.each(line.ctrls, function(ctrl) {
          ctrl.invalid = false;
          if(ctrl.require && !ctrl.isValid($scope.result.eligibilite[ctrl.id])) {
            isValid = false;
            ctrl.invalid = true;
          }
        });
      });
    });

    return isValid;
  };

  $scope.hideResultPane = function() {
    if(!$('#result').height()) {return;}
    $('#result').animate({height: 0}, 1000);

    $('#map').animate({
      height: $('body').height(),
    }, 1000, function() {

      // Animation complete.
      map.invalidateSize();
      var centerPoint = $scope.geoCode ? new L.LatLng($scope.geoCode.y, $scope.geoCode.x) : stlo;
      map.setView(centerPoint, 14);
    });
  };

  var computeFullAdress = function() {
    return $scope.result.eligibilite.complement_addresse;
  };

  var reverseLocation = function(geoCode, address, callback) {
    var reverseGeo = 'http://geocode.arcgis.com/arcgis/rest/services/World/GeocodeServer/reverseGeocode?f=pjson&distance=300';
    var url        = reverseGeo + '&location=' + (geoCode ? $scope.geoCode.x + ',' + $scope.geoCode.y : address) ;
    $.get(
    url,
    function(data, status) {
      data = JSON.parse(data);
      var adresse = data && data.address && data.address.Match_addr;

      if(data && data.address && data.address.Address) {

        var i     = 0;
        var num   = '';
        while(!isNaN(parseInt(data.address.Address[i], 10))) {
          num += data.address.Address[i];
          i++;
        }
        data.address.StreetNumber = num;
        data.address.Address      = data.address.Address.substr(num.length).trim();

        var typeVoie = data.address.Address.substring(0, data.address.Address.indexOf(' ')).toLowerCase();
        type = _.find(catTypeVoie, function(c){
          if(c.id === typeVoie || c.name.toLowerCase() === typeVoie) {
            return true;
          }
        });
        if(type) {
          data.address.StreetType = type.id;
          data.address.Address = data.address.Address.substr(typeVoie.length).trim();
        }

      }

      if(adresse)
      console.log('Reverse', data, '=>', data && data.address);
      callback(adresse, data.address);
      $scope.$evalAsync();
    });
  };

  $scope.initPopup = function() {
    console.log('initPopup', $scope.geoCode);
    $scope.postForm = null;
    reverseLocation($scope.geoCode, null, function(string, address) {
      console.log('add', address);
      $scope.result = {eligibilite: {}};

      // Debug
      // $scope.result.eligibilite.prenom = 'Francois';
      // $scope.result.eligibilite.nom = 'Beaufils';
      // $scope.result.eligibilite.email = 'francoisbeaufils@zeno-labs.com';
      // $scope.result.eligibilite.vous_etes = 'locataire';
      // $scope.result.eligibilite.ce_logement_est = 'residence_principale';
      // $scope.result.eligibilite.info_et_libertes = true;
      // $scope.result.eligibilite.accord = true;

      $scope.result.eligibilite.geo_code            = JSON.stringify($scope.geoCode);
      $scope.result.eligibilite.code_postal         = address.Postal;
      $scope.result.eligibilite.complement_addresse = address.Match_addr;
      $scope.result.eligibilite.nom_voie            = address.Address;
      $scope.result.eligibilite.numero_voie         = address.StreetNumber;
      $scope.result.eligibilite.type_voie           = address.StreetType;
      $scope.result.eligibilite.ville               = address.City;
    });
  };

  $scope.postFormEl = function() {
    $scope.postForm = {inProgress: true};
    console.log('postForm', $scope.result.eligibilite);
    $scope.$evalAsync();

    function mysql_real_escape_string (str) {
        if(typeof str !== 'string') {return str;}

        return str.replace(/[\0\x08\x09\x1a\n\r"'\\\%]/g, function (char) {
            switch (char) {
                case "\0":
                    return "\\0";
                case "\x08":
                    return "\\b";
                case "\x09":
                    return "\\t";
                case "\x1a":
                    return "\\z";
                case "\n":
                    return "\\n";
                case "\r":
                    return "\\r";
                case "\"":
                case "'":
                case "\\":
                case "%":
                    return "\\"+char; // prepends a backslash to backslash, percent,
                                      // and double/single quotes
            }
        });
    }

    var keys   = '';
    var values = '';
    _.each($scope.result.eligibilite, function(value, key) {
      keys   += '`' + key + '`, ';
      values += "'" + mysql_real_escape_string(value) + "', ";
    });

    var query = "INSERT INTO `eligibilite`.`demandes` (" + keys.substring(0, keys.length -2) + ") VALUES (" + values.substring(0, values.length -2) + ");";

    console.log('query', query);

    $.ajax({
      method : "POST",
      url    : "ajax/datastores.php",
      data   :  {query: query}
    })
    .done(function( msg ) {

      if(!isNaN(msg)) {
        $scope.postForm = {ok: true};

        var numDemande =  moment().format('YYYYMMDD') + msg;

        var body = 'Bonjour ' + $scope.result.eligibilite.prenom + ' ' + $scope.result.eligibilite.nom + ', <br>' +
              'Nous vous confirmons votre demande de pré-raccordement FTTH. <br><br>' +
              'Cette demande porte le numéro: ' +
              '<span style="color: #31708f;font-size:17px; font-weight:bold;">' + numDemande + '</span><br><br>' +
              'Voici le détail de votre demande:' +
              '<div style="color: #31708f;background-color: #d9edf7;border-color: #bce8f1;padding: 10px;margin: 1em;font-size:14px;">' +
              '<table style="line-height: 40px;">';

        //  _.each($scope.result.eligibilite, function(value, key) {
        //   body += '<tr>';
        //   body += '<th style="text-align:left;">' + key + '</th>';
        //   body += '<td>' + value + '</td>';
        //   body += '</tr>';
        // });

        // Numero demande
        body += '<tr>';
        body += '<th style="text-align: left;white-space: nowrap;height: 40px;color: #666;">Numéro demande</th>';
        body += '<td>' + numDemande + '</td>';
        body += '</tr>';

        // Date demande
        body += '<tr>';
        body += '<th style="text-align: left;white-space: nowrap;height: 40px;color: #666;">Date</th>';
        body += '<td>' + moment().lang('fr').format('LLLL') + '</td>';
        body += '</tr>';

        // Demandeur
        body += '<tr>';
        body += '<th style="text-align: left;white-space: nowrap;height: 40px;color: #666;">Demandeur</th>';
        body += '<td>' + $scope.result.eligibilite.prenom + ' ' + $scope.result.eligibilite.nom + '</td>';
        body += '</tr>';

        // Email
        body += '<tr>';
        body += '<th style="text-align: left;white-space: nowrap;height: 40px;color: #666;">Email</th>';
        body += '<td>' + $scope.result.eligibilite.email + '</td>';
        body += '</tr>';

        // Adresse
        body += '<tr>';
        body += '<th style="text-align: left;white-space: nowrap;height: 40px;color: #666;">Adresse</th>';
        body += '<td>' + computeFullAdress() + '</td>';
        body += '</tr>';

        // Vous etes
        var cat = _.find(catVousEtes, {id: $scope.result.eligibilite.vous_etes});
        var res = cat && cat.name ? cat.name : $scope.result.eligibilite.vous_etes;
        body += '<tr>';
        body += '<th style="text-align: left;white-space: nowrap;height: 40px;color: #666;">Vous êtes</th>';
        body += '<td>' + res + '</td>';
        body += '</tr>';

        // Ce logement est
        var cat2 = _.find(catCeLogementEst, {id: $scope.result.eligibilite.ce_logement_est});
        var res2 = cat2 && cat2.name ? cat2.name : $scope.result.eligibilite.ce_logement_est;
        body += '<tr>';
        body += '<th style="text-align: left;white-space: nowrap;height: 40px;color: #666;">Ce logement est</th>';
        body += '<td>' + res2 + '</td>';
        body += '</tr>';

        console.log('$scope.result', $scope.result);

        body += '</table></div><br>';

        body += 'Conformément à la loi "informatique et libertés" du 6 janvier 1978 modifiée, vous bénéficiez d’un droit d’accès, de rectification aux informations qui vous concernent, d’opposition au traitement de vos données personnelles. Si vous souhaitez exercer ce droit et obtenir communication des informations vous concernant, merci de nous contacter :' + '<br>' +
                '<div style="">' +
                ' Email: ' + siteEmail + '<br>' +
                ' Adresse: ' + siteAddresse + '<br>' +
                '</div><br><br>';

        body += 'A bientôt sur:  <a href="' + siteUrl + '">' + siteName + '</a>';

        var mail = {
          to     : $scope.result.eligibilite.email,
          sujet  : 'Votre demande de pré-raccordement FTTH n° ' + numDemande,
          message: body
        };

        $.ajax({
          method : "POST",
          url    : "ajax/datastores.php",
          data   :  {mail: mail}
        })
        .done(function( msg ) {
          console.log('Mail result', msg);
        });

        $scope.result.eligibilite = {};
      }
      else {
        $scope.postForm = {error: msg};
      }
      $scope.$apply();
    });
  };

  $scope.toggleResultPane = function() {
    if($('#result').height()) {
      return $scope.hideResultPane();
    }
    if($scope.results && $scope.results.ftth) {
      return $scope.showResultPane();
    }
  };

  var parseResults = function(records) {
    if(!records.length) {
      return null;
    }
    if(records.length === 1) {
      return records[0];
    }
    var result = records[0];
    return result;
  };

  var currentMarker;

  var ariaz = function(address, callback) {
    var url = 'http://www.eligibilite-adsl.com/testXmlAriase.php?ip=80.13.25.43&insee=35238&rivoli=8993&numeroVoie=2&complementNumeroVoie=';
      $.get(
      url,
      function(data, status) {
        callback(data);
      });
  };

  var addCurrentMarker = function() {
    if(currentMarker) {
      map.removeLayer(currentMarker);
    }
    currentMarker = L.marker([$scope.geoCode.y, $scope.geoCode.x], {draggable: true}).addTo(map); //.bindPopup(data.locations[0].name).openPopup();

    reverseLocation($scope.geoCode, null, function(address) {
      $scope.address = address;
    });

    currentMarker.on('dragend', function(event) {
      var p = currentMarker.getLatLng();
      console.log('dragend', p);



      $scope.geoCode = {
        x: p.lng,
        y: p.lat
      };

      reverseLocation($scope.geoCode, null, function(address) {
        $scope.address = address;
        ariaz(address, function(result) {
          console.log('ariaz', result);
        });
        getResults();
      });

    });
  };

  var getResults = function() {
    $scope.results = {};
    $scope.results.ftth = parseResults(getRecordsFor('ftth', $scope.geoCode));
    $scope.results.adsl = parseResults(getRecordsFor('adsl', $scope.geoCode));
    $scope.results.mimo = parseResults(getRecordsFor('mimo', $scope.geoCode));
    $scope.$evalAsync();
  };

  $scope.onSubmitAddress = function() {
    $scope.results = null;

    $scope.getGeoCode($scope.address, $scope.magicKey, function(err, data) {

      $scope.geoCode = data && data.locations && data.locations[0] && data.locations[0].feature.geometry;
      if(err) {console.error('Geocode error', err);}

      var toast = toast || {
            template: '<md-toast><i class = " md-error"></i> Oups! Aucun résultat trouvé dans la Manche pour: ' + $scope.address + '</md-toast>',
            hideDelay: 3000,
            position: 'bottom right'
      };

          // $mdToast.simple()
          //   .template(')
          //   .position('bottom right')
          //   .hideDelay(3000);

      if(err || !$scope.geoCode) {
        $scope.hideResultPane();

        $mdToast.show(toast);
      }
      console.log('Addresses found for', $scope.address, '=>', data, '=> Geocode:', $scope.geoCode);

      if($scope.geoCode) {
        addCurrentMarker();
        $scope.showResultPane();

        getResults();
      }
    });
  };

  $scope.mapType = 'Carte';
  $scope.changeMap = function(value) {
    console.log('Goto', value);
    map.removeLayer(cLayer);
    cLayer = L.tileLayer(maps[value], {
        attribution: 'Map data &copy; <a href="http://openstreetmap.org">OpenStreetMap</a> contributors, <a href="http://creativecommons.org/licenses/by-sa/2.0/">CC-BY-SA</a>, Imagery © <a href="http://mapbox.com">Mapbox</a>',
        maxZoom: 18
    }).addTo(map);
  };

  $scope.view    = {};
  $scope.isShown = {};
  $scope.$watch('view', function(view) {
    if(_.isEmpty(view)) {return;}
    $('#layer-loading').removeClass('force-hidden').find('.md-inner').show();
    setTimeout(function() {
      _.each(view, function(value, key) {
        if($scope.isShown[key] !== value) {
          if(value) {
            if(typeof $scope.isShown[key] !== 'undefined') {
              $scope.showLayer(key);
              $('#layer-loading').find('.md-inner').hide();
            }
            else {
              $timeout(function() {
                $scope.computeLayer(key);
                $scope.showLayer(key);
                $('#layer-loading').find('.md-inner').hide();
              }, 500);
            }
          }
          else {
            $scope.hideLayer(key);
            setTimeout(function() {
              $('#layer-loading').find('.md-inner').hide();
            }, 1000);
          }
          $scope.isShown[key] = value;
        }
      });
    });
  }, true);

  $(window).resize(function() {
    if(!$('#result').height()) {return;}
    $scope.showResultPane();
  });
});