diff --git a/dist/index.html b/dist/index.html index 7e732ce..a5c72bc 100644 --- a/dist/index.html +++ b/dist/index.html @@ -71,7 +71,11 @@

- Por implementar +
+
+ +
+
diff --git a/package.json b/package.json index 3a79ca6..4f4dced 100644 --- a/package.json +++ b/package.json @@ -24,6 +24,7 @@ }, "dependencies": { "bootstrap": "^3.3.7", + "bootstrap-datepicker": "^1.7.0", "jquery": "^3.2.1", "leaflet": "^1.1.0", "leaflet-measure": "^2.1.7", diff --git a/src/index.js b/src/index.js index bf8b6ce..333f8e2 100644 --- a/src/index.js +++ b/src/index.js @@ -2,6 +2,9 @@ import 'jquery' import 'bootstrap' import Map from './map' import 'bootstrap/dist/css/bootstrap.css' +import 'bootstrap-datepicker' +import '../node_modules/bootstrap-datepicker/dist/locales/bootstrap-datepicker.es.min' +import '../node_modules/bootstrap-datepicker/dist/css/bootstrap-datepicker3.css' import './styles/styles.css' import CatastroParser from './catastroParser' @@ -16,7 +19,7 @@ const btnSidebar = document.getElementById('menu-toggle') const btnSearch = document.getElementById('btn-search') const imputRefCat = document.getElementById('navRefCatForm') -const navHistorico = document.getElementById('nav-historico') +const inputFechaCatastro = document.getElementById('fecha-catastro') const sideNav = document.getElementById('mySidenav') @@ -51,3 +54,20 @@ btnSidebar.addEventListener('click', (evt) => { if (document.body.clientWidth >= 767) { sideNav.classList.toggle('toggled') } + +$('#sandbox-container .input-group.date').datepicker({ + format: "dd/mm/yyyy", + language: "es", + daysOfWeekHighlighted: "0,6", + autoclose: true, + clearBtn: true, + todayHighlight: true +}).on('changeDate', function(e) { + var dd = e.date.getDate() + var mm = e.date.getMonth() + 1 + var yyyy = e.date.getFullYear() + var dateString = yyyy + '-' + mm + '-' + dd + map.catastroHistorico(dateString) +}).on('clearDate', function(e) { + map.desactivaCatastroHistorico() +}) \ No newline at end of file diff --git a/src/map.js b/src/map.js index 8fb676a..0c78cd1 100644 --- a/src/map.js +++ b/src/map.js @@ -48,7 +48,7 @@ export default class Map { const catastroUrl = 'https://ovc.catastro.meh.es/Cartografia/WMS/ServidorWMS.aspx?' - const catastroBase = L.nonTiledLayer.wms( + this.catastroBase = L.nonTiledLayer.wms( catastroUrl, { maxZoom: MAX_ZOOM, @@ -82,7 +82,7 @@ export default class Map { const baseMaps = { PNOA: pnoa, - Catastro: catastroBase, + Catastro: this.catastroBase, 'Google Satellite': satellite } @@ -110,15 +110,26 @@ export default class Map { this.clearHighLight() this.highlight.addData(geoJson) } - - catastroHistorico() { + /** + * Activa el catastro histórico para la fecha seleccionada + * @param {string} dateString - Fecha en formato yyyy-mm-dd + */ + catastroHistorico(dateString) { - this.catastroOverlay._wmsUrl = "https://ovc.catastro.meh.es/Cartografia/WMS/ServidorWMS.aspx?TIME=2017-07-01" - this.catastroOverlay.addTo(this.map) - + this.catastroOverlay._wmsUrl = "https://ovc.catastro.meh.es/Cartografia/WMS/ServidorWMS.aspx?TIME=" + dateString + this.catastroBase._wmsUrl = "https://ovc.catastro.meh.es/Cartografia/WMS/ServidorWMS.aspx?TIME=" + dateString this.catastroOverlay.redraw() + this.catastroBase.redraw() + } - console.log(this.map) + /** + * Desactiva el catastro histórico + */ + desactivaCatastroHistorico() { + this.catastroOverlay._wmsUrl = "https://ovc.catastro.meh.es/Cartografia/WMS/ServidorWMS.aspx?" + this.catastroBase._wmsUrl = "https://ovc.catastro.meh.es/Cartografia/WMS/ServidorWMS.aspx?" + this.catastroOverlay.redraw() + this.catastroBase.redraw() } }