diff --git a/predihood/static/js/carto.js b/predihood/static/js/carto.js index aea2a1bb002266643e09f5a687cb7462cf52bfac..39a2a7a2d2e566ba701d7a158792cc98be8a6ac5 100644 --- a/predihood/static/js/carto.js +++ b/predihood/static/js/carto.js @@ -14,6 +14,7 @@ let baseLayers = null; // array of basic layers let overlayLayers = null; // array of overlaying layers let osmLayer = null; // openstreetmap basic layer let irisLayer = null; // layer of displayed IRIS +let previously_selected_algorithm = null; /** @@ -76,26 +77,27 @@ function resetHighlightAll() { function displayPopup(e) { - alert("ici") var layer = e.target; var code_iris = layer.feature.properties.CODE_IRIS - var algorithm = $("#selectAlgorithmTooltip option:selected").val(); - console.log(algorithm); + let selected_algorithm = $("#selectAlgorithmTooltip option:selected").val(); let predictions = undefined; - if (algorithm !== "undefined" && algorithm !== undefined) { - predictions = predict(code_iris, algorithm) + if (selected_algorithm !== "undefined" && selected_algorithm !== undefined) { + predictions = predict(code_iris, selected_algorithm) console.log(predictions) } + let divInformation = $("<div>"); divInformation .append("CODE IRIS : " + layer.feature.properties.CODE_IRIS).append($("<br>")) .append("IRIS : " + layer.feature.properties.NOM_IRIS).append($("<br>")) .append("COMMUNE : " + layer.feature.properties.NOM_COM).append($("<br>")) - .append($("<a>") - .prop("href", "details-iris.html?code_iris='"+layer.feature.properties.CODE_IRIS + "'")) - .prop("target", "_blank") - .val("Plus de détails") + let moreInfosLink = $("<a>"); + moreInfosLink + .prop("href", "details-iris.html?code_iris="+layer.feature.properties.CODE_IRIS) + .prop("target", "_blank") + .text("Plus de détails") .append($("<br>")); + divInformation.append(moreInfosLink); let selectAlgorithm = $("<select>") selectAlgorithm @@ -105,50 +107,21 @@ function displayPopup(e) { for(let algorithm of classifiers) { selectAlgorithm.append($("<option>").prop("value", algorithm).text(algorithm)); } - if (algorithm !== "undefined" && algorithm !== undefined) { - selectAlgorithm.val(algorithm); // select the algorithm inside the list - } + previously_selected_algorithm = selected_algorithm; let divPredictions = $("<div>").prop("id", "divPredictions") if(predictions !== undefined) { for(let key in predictions) { divPredictions.append(key+': ' + predictions[key]["most_frequent"] + " (" + predictions[key]["count_frequent"] + "/7)").append($('<br>')); } } - // let divPredictions = updatePopup(e) - let messageTooltip = divInformation[0].outerHTML + selectAlgorithm[0].outerHTML + divPredictions[0].outerHTML; console.log(messageTooltip) layer.bindPopup(messageTooltip) layer.bringToFront(); layer.openPopup(); + $("#selectAlgorithmTooltip").val(previously_selected_algorithm); // must be after binding the popup to be effective $("#selectAlgorithmTooltip").on("click", function() { displayPopup(e)}) // update popup (env variables) when click on an algorithm - - // $("#selectAlgorithmTooltip").change(function() { - // var layer = e.target; - // var code_iris = layer.feature.properties.CODE_IRIS - // var algorithm = $("#selectAlgorithmTooltip option:selected").text(); - // console.log(algorithm) - // let predictions = predict(code_iris, algorithm) - // - // // let messageTooltip = '<div>CODE IRIS : ' + code_iris + '<br/>' - // // messageTooltip += 'IRIS : ' + layer.feature.properties.NOM_IRIS + '<br/>' - // // messageTooltip += 'COMMUNE : ' + layer.feature.properties.NOM_COM + '<br/>' - // // messageTooltip += '<a href="details-iris.html?code_iris='+layer.feature.properties.CODE_IRIS + '" target="_blank">Plus de détails</a></div></br>'; - // // var select_algorithm = $("<select>").prop("id", "selectAlgorithmTooltip"); - // // select_algorithm.append($("<option>").val("undefined").text("---")); - // // for(let algorithm of classifiers) { - // // select_algorithm.append($("<option>").val(algorithm).text(algorithm)) - // // } - // // messageTooltip += select_algorithm[0].outerHTML - // // messageTooltip += "<br/>" - // for(let key in predictions) { $("#divPredictions").append( key+': ' + predictions[key] + '<br/>' )} - // messageTooltip += $("#divPredictions")[0].outerHTML; - // layer._popup.setContent('something else') - // layer.closePopup(); - // layer.bringToFront(); - // layer.openPopup(); - // }) } function updatePopup(predictions) {