Commit 5c1cea46 authored by hypsug0's avatar hypsug0
Browse files

refactor: replace js var with let/const

parent c7b016ec
......@@ -90,6 +90,46 @@ $(document).ready(function () {
})
})
/****************
* Map objects *
* **************/
const legendElement = (title, color, radius) => {
const span = document.createElement('span')
icon = document.createElement('i')
icon.style.background = color
icon.style.borderRadius = radius ? radius : null
span.textContent = title
span.prepend(icon)
span.append(document.createElement('br'))
return span
}
const showDisclaimer = () => {
const div = document.getElementById('info legend')
while (div.hasChildNodes()) {
div.removeChild(div.lastChild)
}
const elements = [
legendElement('Localisation simple', '#ff4c41'),
legendElement('Localisation sur un métasite', '#8A2BE2'),
legendElement('Emprise du métasite', '#9370DB', 0),
]
div.append(...elements)
return
}
const hideDisclaimer = () => {
const div = document.getElementById('info legend')
while (div.hasChildNodes()) {
div.removeChild(div.lastChild)
}
const icon = document.createElement('i')
icon.classList.add('fa', 'fa-info-circle')
div.append(icon)
return
}
/*******************
* Place search *
********************/
......@@ -98,7 +138,7 @@ const placeSearchBlock = () => {
let mutableDataUrl = dataUrl
const moreInfoElement = (label, value) => {
const p = document.createElement('p')
const p = document.createElement('li')
const strong = document.createElement('strong')
strong.textContent = `${label} : `
p.textContent = value
......@@ -159,7 +199,7 @@ const placeSearchBlock = () => {
is_managed,
convention,
} = d.properties
const div = document.createElement('div')
const div = document.createElement('ul')
const dataToDisplay = [
moreInfoElement('Dernière session', last_session?.date_start__max),
moreInfoElement("Types d'observations", contact?.contacts),
......@@ -279,7 +319,7 @@ const placeSearchBlock = () => {
const searchMap = event.detail.map
const metaplace_dataurl = '/metaplace/api/search?format=json'
let circlemarker = null;
let circlemarker = null
const markers = L.markerClusterGroup({
chunkedLoading: true,
......@@ -337,7 +377,7 @@ const placeSearchBlock = () => {
div.setAttribute('onmouseenter', 'showDisclaimer()')
div.setAttribute('onmouseleave', 'hideDisclaimer()')
div.id = 'info legend'
div.innerHTML = "<b class='fa fa-info-circle'></b>"
div.innerHTML = "<i class='fa fa-info-circle'></i>"
return div
}
......@@ -431,7 +471,7 @@ const placeSearchBlock = () => {
console.log('<loadPlaces Error1>', error)
})
.then(function (data) {
var locationLayer = L.geoJson(data, {
const locationLayer = L.geoJson(data, {
onEachFeature: function onEachFeature(feature, layer) {
const props = feature.properties
const content =
......@@ -494,14 +534,14 @@ const placeSearchBlock = () => {
})
}
$('#place_results').on('click', 'tbody td', function () {
markerId = table.row(this).data().id
markerPosition = markersById[markerId].getLatLng()
$('#place_results').on('click', 'tbody td', () => {
const markerId = table.row(this).data().id
const markerPosition = markersById[markerId].getLatLng()
if (circlemarker !== null) {
searchMap.removeLayer(circlemarker)
}
circlemarker = new L.circleMarker(markerPosition, {
const circlemarker = new L.circleMarker(markerPosition, {
radius: 20,
color: 'red',
fillColor: 'transparent',
......@@ -513,26 +553,28 @@ const placeSearchBlock = () => {
})
})
const loadDatas = function () {
const loadDatas = () => {
loadPlaces()
loadMetaPlace()
}
const clearLayers = function () {
const clearLayers = () => {
metaPlacePolygons.clearLayers()
placeMarkers.clearLayers()
}
function showValues() {
const str = $('#searchForm input').map(function () {
return $(this).val().trim() == '' ? null : this
}).serialize()
const showValues = () => {
const str = $('#searchForm input')
.map(function () {
return $(this).val().trim() == '' ? null : this
})
.serialize()
$('#results').text(str)
mutableDataUrl = '/place/api/search?format=json&' + str
loadDatas()
}
var debounce = null
let debounce = null
$('#searchForm').on('click change', 'input, select', function () {
clearTimeout(debounce)
......@@ -551,16 +593,167 @@ const placeDetailMap = () => {
flyTo: true,
title: 'Ma position',
icon: 'fa fa-location-arrow',
};
}
L.control.locate(locateOptions).addTo(map);
L.control.locate(locateOptions).addTo(map)
// Fonction plein écran
map.addControl(new L.Control.Fullscreen());
map.addControl(new L.Control.Fullscreen())
// Ajout du marker de la localité
L.geoJson(marker).addTo(map);
map.fitBounds(L.geoJson(marker).getBounds());
map.setZoom(13);
};
L.geoJson(marker).addTo(map)
map.fitBounds(L.geoJson(marker).getBounds())
map.setZoom(13)
}
}
// Sighting Form app
const CountDetailObject = {
id_countdetail: null,
method: null,
sex: null,
age: null,
precision: null,
count: null,
unit: null,
time: null,
device: null,
manipulator: null,
validator: null,
transmitter: null,
ab: null,
d5: null,
pouce: null,
queue: null,
tibia: null,
pied: null,
cm3: null,
tragus: null,
poids: null,
testicule: null,
epididyme: null,
tuniq_vag: null,
gland_taille: null,
gland_coul: null,
mamelle: null,
gestation: null,
epiphyse: null,
chinspot: null,
etat_sexuel: null,
usure_dent: null,
comment: null,
}
const SightingObject = (session_id) => {
return {
session: session_id,
id_sighting: null,
codesp: null,
breed_colo: null,
total_count: null,
observer: null,
is_doubtful: false,
comment: null,
extra_data: null,
countdetail_sighting: [CountDetailObject],
}
}
const sigthingFormApp = (id_session) => {
return {
el: '#sessionSightingEdit',
delimiters: ['[[', ']]'],
data() {
return {
data: Object,
dicts: Object,
loadingMessage: true,
initialDataLoaded: false,
postLoad: false,
dictsLoaded: false,
newSighting: SightingObject(id_session),
newCountDetail: CountDetailObject,
hover: true,
}
},
methods: {
getTaxa(specieId) {
return this.dicts.Specie.find((s) => s.id === specieId)?.code
},
hideLoadingMessage() {
return !(this.initialDataLoaded && this.dictsLoaded)
},
addNewSighting() {
this.data.push({ ...this.newSighting })
},
addNewCountDetail(is) {
this.data[is].countdetail_sighting.push({
...this.newCountDetail,
})
},
delCountDetail(is, icd) {
this.data[is].countdetail_sighting.splice(icd, 1)
},
getSciName(isp) {
specieList = this.dicts.Specie
return isp
? specieList.find((r) => r.id === isp).sci_name
: 'Not defined'
},
getSpClass(isp) {
specieList = this.dicts.Specie
return isp
? specieList.find((r) => r.id === isp).sci_name
: 'Not defined'
},
postSighing(sighting) {
console.debug('POST sighting', sighting)
$http
.post(sighting)
.then((response) => {
this.data = response.data?.results
})
.then(() => {
this.postLoad = false
})
.catch((err) => {
console.error(err)
})
},
postData() {
this.data.forEach(this.postSighing)
},
},
computed: {
hoverBtnDeleteStyle() {
return this.hover ? 'btn-danger' : 'btn-disabled'
},
},
mounted() {
$http
.get(sightingDataUrl)
.then((response) => {
this.data = response.data?.results
})
.then(() => {
this.initialDataLoaded = true
})
.catch((err) => {
console.error(err)
})
$http
.get('/api/v1/dicts')
.then((response) => {
this.dicts = response.data
})
.then(() => {
this.dictsLoaded = true
})
.catch((err) => {
console.error(err)
})
},
// options
}
}
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment