scripts/osm-itineraire-userscript/index.js

// ==UserScript==
// @name     Comparatif carbone OSM itinéraire
// @version  1
// @grant    none
// ==/UserScript==

/**
 * comparatif des empreintes carbones sur un itinéraire fait sur OSM.org
 * @type {{bus: number, voiture_elec: number, tgv: number, voiture: number, velo_elec: number, avion: number}}
 */

const coefficients = {
	avion_condens: 0.285*3,
	avion: 0.285,
	voiture: 0.218,
	scoot: 0.062,
	moto: 0.191,
	bus: 0.0352,
	voiture_elec: 0.103,
	velo_elec: 0.01,
	metro: 0.004,
	tgv: 0.003,
}

function getDistanceFromElement () {
	const sidebarContent = document.getElementById('sidebar_content')
	if (!sidebarContent) {
		console.warn('Impossible de trouver l’élément #sidebar_content.')
		return null
	}

	const paragraphs = sidebarContent.querySelectorAll('p')
	for (const para of paragraphs) {
		if (para.innerText.includes('Distance')) {
			const indexOfKm = para.innerText.indexOf('km')
			let text = para.innerText
			let boom = text.trim().split(' ')

			console.log('para.innerText', para.innerText)
			const distance = parseFloat(boom[1])
			return distance
		}
	}
	console.warn('Impossible de trouver la distance dans les paragraphes.')
	return null
}

function calculateEmissionsAndDisplay (distance) {
	if (!distance) {
		console.warn('La distance est undefined ou null.')
		return
	}

	const emissionsByMode = {
		avion_condens: distance * coefficients.avion_condens,
		avion: distance * coefficients.avion,
		bus: distance * coefficients.bus,
		moto: distance * coefficients.moto,
		scoot: distance * coefficients.scoot,
		voiture: distance * coefficients.voiture,
		voiture_elec: distance * coefficients.voiture_elec,
		tgv: distance * coefficients.tgv,
		velo_elec: distance * coefficients.velo_elec,
	}

	let textCompare = `<div class="impact-climat">
<style>
.impact-climat{
text-align: right;
padding: 1rem;
}
</style>
 <h3>Impact climatique:</h3> 
	 <table>
    <thead>
    <tr>
        <th>Véhicule</th>
        <th>CO2 kg eq.</th>
    </tr>
    </thead>
    <tbody>
    <tr>
        <td>Avion condensation inclue</td>
        <td class="text-right">${emissionsByMode.avion_condens.toFixed(1)}</td>
    </tr>
    <tr>
        <td>Avion</td>
        <td class="text-right">${emissionsByMode.avion.toFixed(1)}</td>
    </tr>
    <tr>
        <td>Bus thermique</td>
        <td class="text-right">${emissionsByMode.bus.toFixed(1)}</td>
    </tr>
    <tr>
        <td>Moto</td>
        <td class="text-right">${emissionsByMode.moto.toFixed(1)}</td>
    </tr>
    <tr>
        <td>Scooter</td>
        <td class="text-right">${emissionsByMode.scoot.toFixed(1)}</td>
    </tr>
    <tr>
        <td>Voiture</td>
        <td class="text-right">${emissionsByMode.voiture.toFixed(1)}</td>
    </tr>
    <tr>
        <td>Voiture électrique ⚡</td>
        <td class="text-right">${emissionsByMode.voiture_elec.toFixed(1)}</td>
    </tr>
    <tr>
        <td>🚴 Vélo Electrique ⚡</td>
        <td class="text-right">${emissionsByMode.velo_elec.toFixed(1)}</td>
    </tr>
    <tr>
        <td>🚇 Métro</td>
        <td class="text-right">${emissionsByMode.tgv.toFixed(1)}</td>
    </tr>
    <tr>
        <td>TGV</td>
        <td class="text-right">${emissionsByMode.tgv.toFixed(1)}</td>
    </tr>
    <tr>
        <td>🚴 Vélo ou marche</td>
        <td>0</td>
    </tr>

    </tbody>
</table>
	<div class="source-data">
    <a href="https://agirpourlatransition.ademe.fr/particuliers/bureau/deplacements/calculer-emissions-carbone-trajets">

        infos ADEME
    </a>
    <i>
    Émissions de gaz à effet de serre (GES) pour une personne sur cette distance, en équivalent CO2. Voyager à plusieurs divise les émissions de GES.<br>
        Sont incluses les émissions directes, la construction des véhicules (fabrication, maintenance et fin de vie) et
        la production et distribution de carburant et d'électricité. La construction des infrastructures (routes, rails,
        aéroports...) n'est pas incluse.
    </i>
    <a href="https://raw.githubusercontent.com/incubateur-ademe/monimpacttransport/main/src/data/transportations.json">json</a>
</div>
 </div>`

	let comparison_container = document.querySelector('#comparison_container')

	/**
	 * on ajoute la div si elle manque
	 */
	if (!comparison_container) {
		const comparisonContainerAdd = document.createElement('div')
		comparisonContainerAdd.setAttribute('id', 'comparison_container')

		const sidebarContainer = document.getElementById('sidebar_content')
		sidebarContainer.insertBefore(comparisonContainerAdd, sidebarContainer.children[0]);

		comparison_container = document.querySelector('#comparison_container')

	}
 // on remplit les infos actualisées
	comparison_container.innerHTML = textCompare
	console.log('comparison_container', comparison_container.innerText)

}

function main () {
	const distance = getDistanceFromElement()
	if (distance) {
		calculateEmissionsAndDisplay(distance)
	} else {
		setTimeout(() => {
			const distance = getDistanceFromElement()
			if (distance) {
				calculateEmissionsAndDisplay(distance)
			}
		}, 5000)
	}
}

document.addEventListener('hashchange', () => main())
document.addEventListener('DOMContentLoaded', () => main())
document.addEventListener('mouseup', () => main())

main()