Calculateur d'empreinte carbone V3.2 - compatible navigateurs<\/title>\r\n <style>\r\n \/*\r\n Calculateur d'empreinte carbone V3.2\r\n Objectif : compatibilite large Safari \/ Firefox \/ Chrome \/ iOS \/ Android \/ macOS \/ Windows.\r\n Choix technique : aucun framework, aucune dependance externe, aucun Chart.js.\r\n Les graphiques donut sont dessines en Canvas natif avec fallback textuel.\r\n *\/\r\n\r\n #cc32-app {\r\n max-width: 1040px;\r\n margin: 18px auto;\r\n padding: 0;\r\n font-family: Arial, Helvetica, sans-serif;\r\n color: #173022;\r\n background: #ffffff;\r\n border-radius: 18px;\r\n box-shadow: 0 8px 28px rgba(0,0,0,0.10);\r\n overflow: hidden;\r\n line-height: 1.45;\r\n }\r\n\r\n #cc32-app * {\r\n box-sizing: border-box;\r\n }\r\n\r\n .cc32-hero {\r\n padding: 28px 26px;\r\n background: #006838;\r\n color: #ffffff;\r\n }\r\n\r\n .cc32-hero h1 {\r\n margin: 0 0 8px 0;\r\n font-size: 30px;\r\n line-height: 1.15;\r\n }\r\n\r\n .cc32-hero p {\r\n margin: 0;\r\n max-width: 820px;\r\n font-size: 16px;\r\n opacity: 0.95;\r\n }\r\n\r\n .cc32-body {\r\n padding: 22px 24px 28px 24px;\r\n }\r\n\r\n .cc32-progress-wrap {\r\n margin-bottom: 18px;\r\n }\r\n\r\n .cc32-progress-label {\r\n display: flex;\r\n justify-content: space-between;\r\n font-size: 13px;\r\n color: #4b6355;\r\n margin-bottom: 6px;\r\n }\r\n\r\n .cc32-progress {\r\n width: 100%;\r\n height: 12px;\r\n background: #e4ebe6;\r\n border-radius: 999px;\r\n overflow: hidden;\r\n }\r\n\r\n .cc32-progress-bar {\r\n height: 12px;\r\n width: 12%;\r\n background: #00a651;\r\n border-radius: 999px;\r\n transition: width 250ms ease;\r\n }\r\n\r\n .cc32-step {\r\n display: none;\r\n animation: cc32Fade 180ms ease;\r\n }\r\n\r\n .cc32-step.cc32-active {\r\n display: block;\r\n }\r\n\r\n @keyframes cc32Fade {\r\n from { opacity: 0; transform: translateY(4px); }\r\n to { opacity: 1; transform: translateY(0); }\r\n }\r\n\r\n .cc32-step h2 {\r\n margin: 6px 0 12px 0;\r\n color: #006838;\r\n font-size: 24px;\r\n }\r\n\r\n .cc32-intro-card,\r\n .cc32-card {\r\n background: #f5f8f6;\r\n border: 1px solid #dde9e1;\r\n border-radius: 14px;\r\n padding: 18px;\r\n margin: 14px 0;\r\n }\r\n\r\n .cc32-grid {\r\n display: grid;\r\n grid-template-columns: 1fr 1fr;\r\n gap: 14px 18px;\r\n }\r\n\r\n .cc32-field label,\r\n .cc32-field .cc32-label {\r\n display: block;\r\n margin-bottom: 5px;\r\n font-weight: bold;\r\n font-size: 14px;\r\n color: #173022;\r\n }\r\n\r\n .cc32-hint {\r\n margin-top: 4px;\r\n color: #617568;\r\n font-size: 12px;\r\n }\r\n\r\n .cc32-field input,\r\n .cc32-field select {\r\n width: 100%;\r\n min-height: 40px;\r\n padding: 9px 10px;\r\n border: 1px solid #cbd8cf;\r\n border-radius: 8px;\r\n background: #ffffff;\r\n color: #173022;\r\n font-size: 15px;\r\n -webkit-appearance: none;\r\n appearance: none;\r\n }\r\n\r\n .cc32-field input[type=\"number\"] {\r\n -webkit-appearance: none;\r\n appearance: textfield;\r\n }\r\n\r\n .cc32-field input[type=\"number\"]::-webkit-inner-spin-button,\r\n .cc32-field input[type=\"number\"]::-webkit-outer-spin-button {\r\n -webkit-appearance: none;\r\n margin: 0;\r\n }\r\n\r\n .cc32-nav {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n gap: 12px;\r\n margin-top: 22px;\r\n }\r\n\r\n .cc32-btn {\r\n display: inline-block;\r\n min-height: 42px;\r\n padding: 10px 18px;\r\n border: none;\r\n border-radius: 10px;\r\n background: #006838;\r\n color: #ffffff;\r\n cursor: pointer;\r\n font-size: 15px;\r\n font-weight: bold;\r\n text-align: center;\r\n }\r\n\r\n .cc32-btn:hover,\r\n .cc32-btn:focus {\r\n background: #00532d;\r\n outline: 2px solid #8dc63f;\r\n outline-offset: 2px;\r\n }\r\n\r\n .cc32-btn-secondary {\r\n background: #e7efe9;\r\n color: #173022;\r\n }\r\n\r\n .cc32-btn-secondary:hover,\r\n .cc32-btn-secondary:focus {\r\n background: #d5e3d9;\r\n }\r\n\r\n .cc32-btn-warning {\r\n background: #f15a24;\r\n }\r\n\r\n .cc32-results-grid {\r\n display: grid;\r\n grid-template-columns: 1fr 1fr;\r\n gap: 18px;\r\n margin-top: 18px;\r\n }\r\n\r\n .cc32-score {\r\n font-size: 42px;\r\n line-height: 1.05;\r\n color: #006838;\r\n font-weight: bold;\r\n margin: 8px 0;\r\n }\r\n\r\n .cc32-small {\r\n font-size: 13px;\r\n color: #617568;\r\n }\r\n\r\n .cc32-chart-box {\r\n background: #ffffff;\r\n border: 1px solid #dde9e1;\r\n border-radius: 14px;\r\n padding: 16px;\r\n text-align: center;\r\n }\r\n\r\n .cc32-chart-box h3 {\r\n margin: 0 0 10px 0;\r\n color: #006838;\r\n font-size: 18px;\r\n }\r\n\r\n .cc32-canvas {\r\n width: 100%;\r\n max-width: 330px;\r\n height: auto;\r\n margin: 0 auto;\r\n display: block;\r\n }\r\n\r\n .cc32-breakdown-list,\r\n .cc32-reco-list,\r\n .cc32-country-list {\r\n margin: 10px 0 0 0;\r\n padding-left: 20px;\r\n }\r\n\r\n .cc32-reco-list li,\r\n .cc32-country-list li,\r\n .cc32-breakdown-list li {\r\n margin: 6px 0;\r\n }\r\n\r\n .cc32-badge {\r\n display: inline-block;\r\n border-radius: 999px;\r\n padding: 4px 10px;\r\n font-size: 12px;\r\n font-weight: bold;\r\n color: #ffffff;\r\n background: #006838;\r\n margin-right: 4px;\r\n }\r\n\r\n .cc32-badge-green { background: #00843d; }\r\n .cc32-badge-orange { background: #f39c12; }\r\n .cc32-badge-red { background: #d93a2f; }\r\n\r\n .cc32-method {\r\n margin-top: 20px;\r\n font-size: 13px;\r\n color: #4f6758;\r\n background: #f5f8f6;\r\n border-radius: 12px;\r\n padding: 12px;\r\n }\r\n\r\n .cc32-error {\r\n display: none;\r\n background: #fff4e5;\r\n color: #7a4300;\r\n border: 1px solid #ffd08a;\r\n padding: 10px;\r\n border-radius: 10px;\r\n margin-top: 12px;\r\n }\r\n\r\n @media (max-width: 760px) {\r\n #cc32-app {\r\n margin: 0;\r\n border-radius: 0;\r\n }\r\n\r\n .cc32-hero {\r\n padding: 22px 18px;\r\n }\r\n\r\n .cc32-hero h1 {\r\n font-size: 24px;\r\n }\r\n\r\n .cc32-body {\r\n padding: 18px 16px 24px 16px;\r\n }\r\n\r\n .cc32-grid,\r\n .cc32-results-grid {\r\n grid-template-columns: 1fr;\r\n }\r\n\r\n .cc32-nav {\r\n flex-direction: column-reverse;\r\n align-items: stretch;\r\n }\r\n\r\n .cc32-btn {\r\n width: 100%;\r\n }\r\n\r\n .cc32-score {\r\n font-size: 34px;\r\n }\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n<div id=\"cc32-app\">\r\n <div class=\"cc32-hero\">\r\n <h1>Calculateur d'empreinte carbone<\/h1>\r\n <p>Estimation p\u00e9dagogique en tonnes CO2e par an. Version autonome, compatible avec un maximum de navigateurs et plateformes.<\/p>\r\n <\/div>\r\n\r\n <div class=\"cc32-body\">\r\n <div class=\"cc32-progress-wrap\">\r\n <div class=\"cc32-progress-label\">\r\n <span id=\"cc32-step-label\">Etape 1 sur 7<\/span>\r\n <span id=\"cc32-step-name\">Introduction<\/span>\r\n <\/div>\r\n <div class=\"cc32-progress\" aria-hidden=\"true\">\r\n <div id=\"cc32-progress-bar\" class=\"cc32-progress-bar\"><\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <div id=\"cc32-error\" class=\"cc32-error\"><\/div>\r\n\r\n \r\n <div class=\"cc32-step cc32-active\" data-step-name=\"Introduction\">\r\n <h2>Bienvenue<\/h2>\r\n <div class=\"cc32-intro-card\">\r\n <p><strong>Objectif :<\/strong> obtenir une estimation simple de votre empreinte carbone annuelle, puis identifier les actions prioritaires.<\/p>\r\n <p>Le calculateur utilise des facteurs simplifi\u00e9s inspires des bases publiques ADEME\/OFEV. Il ne remplace pas un bilan carbone certifie.<\/p>\r\n <p class=\"cc32-small\">Duree estimee : 3 a 5 minutes.<\/p>\r\n <\/div>\r\n <div class=\"cc32-nav\">\r\n <span><\/span>\r\n <button type=\"button\" class=\"cc32-btn\" onclick=\"cc32NextStep()\">Commencer<\/button>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"cc32-step\" data-step-name=\"Logement\">\r\n <h2>Logement<\/h2>\r\n <div class=\"cc32-grid\">\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-occupants\">Nombre de personnes dans le logement<\/label>\r\n <input id=\"cc32-occupants\" type=\"number\" min=\"1\" max=\"12\" value=\"2\">\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-surface\">Surface du logement en m2<\/label>\r\n <input id=\"cc32-surface\" type=\"number\" min=\"10\" max=\"1000\" value=\"100\">\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-home-type\">Type de logement<\/label>\r\n <select id=\"cc32-home-type\">\r\n <option value=\"appartement\">Appartement<\/option>\r\n <option value=\"maison_mitoyenne\">Maison mitoyenne<\/option>\r\n <option value=\"maison_individuelle\">Maison individuelle<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-heating\">Chauffage principal<\/label>\r\n <select id=\"cc32-heating\">\r\n <option value=\"pompe_chaleur\">Pompe a chaleur<\/option>\r\n <option value=\"reseau_chaleur\">Reseau de chaleur<\/option>\r\n <option value=\"bois\">Bois<\/option>\r\n <option value=\"gaz\">Gaz<\/option>\r\n <option value=\"mazout\">Mazout<\/option>\r\n <option value=\"electrique\">Electrique direct<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-insulation\">Qualite de l'isolation<\/label>\r\n <select id=\"cc32-insulation\">\r\n <option value=\"tres_bonne\">Tres bonne<\/option>\r\n <option value=\"bonne\" selected>Bonne<\/option>\r\n <option value=\"moyenne\">Moyenne<\/option>\r\n <option value=\"faible\">Faible<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-electric-mode\">Electricite : information connue<\/label>\r\n <select id=\"cc32-electric-mode\" onchange=\"cc32ToggleElectricMode()\">\r\n <option value=\"bill\" selected>Montant de la facture mensuelle<\/option>\r\n <option value=\"kwh\">Consommation annuelle en kWh<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\" id=\"cc32-electric-bill-wrap\">\r\n <label for=\"cc32-electric-bill\">Facture d'electricite moyenne, CHF\/mois<\/label>\r\n <input id=\"cc32-electric-bill\" type=\"number\" min=\"0\" max=\"2000\" value=\"80\">\r\n <div class=\"cc32-hint\">Conversion utilisee : 0.28 CHF\/kWh.<\/div>\r\n <\/div>\r\n <div class=\"cc32-field\" id=\"cc32-electric-kwh-wrap\" style=\"display:none;\">\r\n <label for=\"cc32-electric-kwh\">Consommation electrique annuelle, kWh\/an<\/label>\r\n <input id=\"cc32-electric-kwh\" type=\"number\" min=\"0\" max=\"50000\" value=\"3500\">\r\n <\/div>\r\n <\/div>\r\n <div class=\"cc32-nav\">\r\n <button type=\"button\" class=\"cc32-btn cc32-btn-secondary\" onclick=\"cc32PrevStep()\">Precedent<\/button>\r\n <button type=\"button\" class=\"cc32-btn\" onclick=\"cc32NextStep()\">Suivant<\/button>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"cc32-step\" data-step-name=\"Mobilite\">\r\n <h2>Mobilite<\/h2>\r\n <div class=\"cc32-grid\">\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-car-type\">Type de voiture principale<\/label>\r\n <select id=\"cc32-car-type\">\r\n <option value=\"none\">Pas de voiture<\/option>\r\n <option value=\"essence\" selected>Essence<\/option>\r\n <option value=\"diesel\">Diesel<\/option>\r\n <option value=\"hybride\">Hybride<\/option>\r\n <option value=\"hybride_rechargeable\">Hybride rechargeable<\/option>\r\n <option value=\"electrique\">Electrique<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-car-km\">Kilometres en voiture par an<\/label>\r\n <input id=\"cc32-car-km\" type=\"number\" min=\"0\" max=\"100000\" value=\"12000\">\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-car-occupancy\">Occupation moyenne de la voiture<\/label>\r\n <select id=\"cc32-car-occupancy\">\r\n <option value=\"1\" selected>Souvent seul\/e<\/option>\r\n <option value=\"2\">En moyenne 2 personnes<\/option>\r\n <option value=\"3\">En moyenne 3 personnes<\/option>\r\n <option value=\"4\">4 personnes ou plus<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-second-car\">Deuxieme vehicule dans le menage<\/label>\r\n <select id=\"cc32-second-car\">\r\n <option value=\"no\" selected>Non<\/option>\r\n <option value=\"yes\">Oui<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-train-km\">Train, km\/an<\/label>\r\n <input id=\"cc32-train-km\" type=\"number\" min=\"0\" max=\"100000\" value=\"1000\">\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-bus-km\">Bus, km\/an<\/label>\r\n <input id=\"cc32-bus-km\" type=\"number\" min=\"0\" max=\"50000\" value=\"300\">\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-tram-km\">Tram \/ metro, km\/an<\/label>\r\n <input id=\"cc32-tram-km\" type=\"number\" min=\"0\" max=\"50000\" value=\"300\">\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-bike-type\">Velo le plus utilise<\/label>\r\n <select id=\"cc32-bike-type\">\r\n <option value=\"none\">Aucun<\/option>\r\n <option value=\"classic\" selected>Velo classique<\/option>\r\n <option value=\"electric\">Velo electrique<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-flight-europe\">Vols Europe \/ court-moyen courrier par an<\/label>\r\n <input id=\"cc32-flight-europe\" type=\"number\" min=\"0\" max=\"50\" value=\"1\">\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-flight-long\">Vols long-courriers par an<\/label>\r\n <input id=\"cc32-flight-long\" type=\"number\" min=\"0\" max=\"50\" value=\"0\">\r\n <\/div>\r\n <\/div>\r\n <div class=\"cc32-nav\">\r\n <button type=\"button\" class=\"cc32-btn cc32-btn-secondary\" onclick=\"cc32PrevStep()\">Precedent<\/button>\r\n <button type=\"button\" class=\"cc32-btn\" onclick=\"cc32NextStep()\">Suivant<\/button>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"cc32-step\" data-step-name=\"Alimentation\">\r\n <h2>Alimentation<\/h2>\r\n <div class=\"cc32-grid\">\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-red-meat\">Viande rouge, repas\/semaine<\/label>\r\n <select id=\"cc32-red-meat\">\r\n <option value=\"0\">0<\/option>\r\n <option value=\"1\">1<\/option>\r\n <option value=\"2\" selected>2<\/option>\r\n <option value=\"3\">3<\/option>\r\n <option value=\"4\">4<\/option>\r\n <option value=\"5\">5 ou plus<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-poultry\">Volaille, repas\/semaine<\/label>\r\n <select id=\"cc32-poultry\">\r\n <option value=\"0\">0<\/option>\r\n <option value=\"1\" selected>1<\/option>\r\n <option value=\"2\">2<\/option>\r\n <option value=\"3\">3<\/option>\r\n <option value=\"4\">4 ou plus<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-fish\">Poisson, repas\/semaine<\/label>\r\n <select id=\"cc32-fish\">\r\n <option value=\"0\">0<\/option>\r\n <option value=\"1\" selected>1<\/option>\r\n <option value=\"2\">2<\/option>\r\n <option value=\"3\">3 ou plus<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-dairy\">Produits laitiers<\/label>\r\n <select id=\"cc32-dairy\">\r\n <option value=\"faible\">Faible<\/option>\r\n <option value=\"moyen\" selected>Moyen<\/option>\r\n <option value=\"eleve\">Eleve<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-local-food\">Produits locaux \/ de saison<\/label>\r\n <select id=\"cc32-local-food\">\r\n <option value=\"souvent\">Souvent<\/option>\r\n <option value=\"parfois\" selected>Parfois<\/option>\r\n <option value=\"rarement\">Rarement<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-food-waste\">Gaspillage alimentaire<\/label>\r\n <select id=\"cc32-food-waste\">\r\n <option value=\"faible\">Faible<\/option>\r\n <option value=\"moyen\" selected>Moyen<\/option>\r\n <option value=\"eleve\">Eleve<\/option>\r\n <\/select>\r\n <\/div>\r\n <\/div>\r\n <div class=\"cc32-nav\">\r\n <button type=\"button\" class=\"cc32-btn cc32-btn-secondary\" onclick=\"cc32PrevStep()\">Precedent<\/button>\r\n <button type=\"button\" class=\"cc32-btn\" onclick=\"cc32NextStep()\">Suivant<\/button>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"cc32-step\" data-step-name=\"Consommation\">\r\n <h2>Achats de biens<\/h2>\r\n <div class=\"cc32-grid\">\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-clothes\">Vetements neufs achetes par an<\/label>\r\n <select id=\"cc32-clothes\">\r\n <option value=\"0-5\">0 a 5 pieces<\/option>\r\n <option value=\"6-15\" selected>6 a 15 pieces<\/option>\r\n <option value=\"16-30\">16 a 30 pieces<\/option>\r\n <option value=\"30plus\">Plus de 30 pieces<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-smartphone\">Renouvellement du smartphone<\/label>\r\n <select id=\"cc32-smartphone\">\r\n <option value=\"5plus\">Tous les 5 ans ou plus<\/option>\r\n <option value=\"4\">Tous les 4 ans<\/option>\r\n <option value=\"3\" selected>Tous les 3 ans<\/option>\r\n <option value=\"2\">Tous les 2 ans<\/option>\r\n <option value=\"1\">Tous les ans<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-computer\">Renouvellement de l'ordinateur\/tablette<\/label>\r\n <select id=\"cc32-computer\">\r\n <option value=\"7plus\">Tous les 7 ans ou plus<\/option>\r\n <option value=\"5-7\" selected>Tous les 5 a 7 ans<\/option>\r\n <option value=\"3-5\">Tous les 3 a 5 ans<\/option>\r\n <option value=\"less3\">Moins de 3 ans<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-furniture\">Mobilier \/ decoration<\/label>\r\n <select id=\"cc32-furniture\">\r\n <option value=\"faible\">Tres rarement<\/option>\r\n <option value=\"moyen\" selected>Occasionnellement<\/option>\r\n <option value=\"eleve\">Regulierement<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-online-shopping\">Achats en ligne<\/label>\r\n <select id=\"cc32-online-shopping\">\r\n <option value=\"rare\">Rarement<\/option>\r\n <option value=\"mensuel\" selected>Mensuellement<\/option>\r\n <option value=\"hebdomadaire\">Hebdomadairement<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-second-hand\">Part d'achats d'occasion<\/label>\r\n <select id=\"cc32-second-hand\">\r\n <option value=\"forte\">Forte<\/option>\r\n <option value=\"moyenne\" selected>Moyenne<\/option>\r\n <option value=\"faible\">Faible<\/option>\r\n <\/select>\r\n <\/div>\r\n <\/div>\r\n <div class=\"cc32-nav\">\r\n <button type=\"button\" class=\"cc32-btn cc32-btn-secondary\" onclick=\"cc32PrevStep()\">Precedent<\/button>\r\n <button type=\"button\" class=\"cc32-btn\" onclick=\"cc32NextStep()\">Suivant<\/button>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"cc32-step\" data-step-name=\"Numerique\">\r\n <h2>Numerique<\/h2>\r\n <div class=\"cc32-grid\">\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-streaming\">Streaming video, h\/semaine<\/label>\r\n <input id=\"cc32-streaming\" type=\"number\" min=\"0\" max=\"168\" value=\"10\">\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-cloud\">Stockage cloud<\/label>\r\n <select id=\"cc32-cloud\">\r\n <option value=\"faible\">Faible<\/option>\r\n <option value=\"moyen\" selected>Moyen<\/option>\r\n <option value=\"eleve\">Eleve<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-devices\">Nombre d'appareils connectes<\/label>\r\n <select id=\"cc32-devices\">\r\n <option value=\"1-3\">1 a 3<\/option>\r\n <option value=\"4-7\" selected>4 a 7<\/option>\r\n <option value=\"8-15\">8 a 15<\/option>\r\n <option value=\"15plus\">Plus de 15<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-ai\">Requetes IA par jour<\/label>\r\n <select id=\"cc32-ai\">\r\n <option value=\"0\">0<\/option>\r\n <option value=\"1-10\" selected>1 a 10<\/option>\r\n <option value=\"11-50\">11 a 50<\/option>\r\n <option value=\"51-100\">51 a 100<\/option>\r\n <option value=\"100plus\">Plus de 100<\/option>\r\n <\/select>\r\n <div class=\"cc32-hint\">Estimation prudente : les chiffres sur l'IA restent tres debattus.<\/div>\r\n <\/div>\r\n <\/div>\r\n <div class=\"cc32-nav\">\r\n <button type=\"button\" class=\"cc32-btn cc32-btn-secondary\" onclick=\"cc32PrevStep()\">Precedent<\/button>\r\n <button type=\"button\" class=\"cc32-btn\" onclick=\"cc32NextStep()\">Voir les resultats<\/button>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"cc32-step\" data-step-name=\"Resultats\">\r\n <h2>Resultats<\/h2>\r\n <p>Cliquez sur le bouton pour calculer votre estimation.<\/p>\r\n <button type=\"button\" class=\"cc32-btn cc32-btn-warning\" onclick=\"cc32Calculate()\">Calculer mon empreinte<\/button>\r\n\r\n <div id=\"cc32-results\" style=\"display:none;\">\r\n <div class=\"cc32-card\">\r\n <div class=\"cc32-small\">Votre empreinte estimee<\/div>\r\n <div id=\"cc32-total-score\" class=\"cc32-score\">0.0 tCO2e\/an<\/div>\r\n <div id=\"cc32-level-text\"><\/div>\r\n <\/div>\r\n\r\n <div class=\"cc32-results-grid\">\r\n <div class=\"cc32-chart-box\">\r\n <h3>Repartition par poste<\/h3>\r\n <canvas id=\"cc32-category-chart\" class=\"cc32-canvas\" width=\"320\" height=\"320\"><\/canvas>\r\n <div id=\"cc32-category-fallback\"><\/div>\r\n <\/div>\r\n <div class=\"cc32-chart-box\">\r\n <h3>Planetes necessaires<\/h3>\r\n <canvas id=\"cc32-planet-chart\" class=\"cc32-canvas\" width=\"320\" height=\"320\"><\/canvas>\r\n <div id=\"cc32-planet-fallback\"><\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"cc32-card\">\r\n <h3>Details<\/h3>\r\n <ul id=\"cc32-breakdown\" class=\"cc32-breakdown-list\"><\/ul>\r\n <\/div>\r\n\r\n <div class=\"cc32-card\">\r\n <h3>Comparaison internationale indicative<\/h3>\r\n <ul class=\"cc32-country-list\">\r\n <li>Suisse : environ 12 tCO2e\/an\/personne<\/li>\r\n <li>USA : environ 14 tCO2e\/an\/personne<\/li>\r\n <li>Chine : environ 8 tCO2e\/an\/personne<\/li>\r\n <li>Japon : environ 8 tCO2e\/an\/personne<\/li>\r\n <li>Pays emergents : environ 4 tCO2e\/an\/personne<\/li>\r\n <li>Pays pauvres : environ 1 tCO2e\/an\/personne<\/li>\r\n <\/ul>\r\n <\/div>\r\n\r\n <div class=\"cc32-card\">\r\n <h3>Actions prioritaires<\/h3>\r\n <ol id=\"cc32-recommendations\" class=\"cc32-reco-list\"><\/ol>\r\n <\/div>\r\n\r\n <div class=\"cc32-method\">\r\n <strong>Methodologie :<\/strong> estimation pedagogique en tCO2e\/an. Les facteurs sont volontairement simplifies, inspires de methodes ADEME\/OFEV et adaptes au contexte suisse. Ce resultat n'est pas un bilan carbone certifie. Le nombre de planetes repose sur un budget pedagogique de 2 tCO2e\/an\/personne.\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"cc32-nav\">\r\n <button type=\"button\" class=\"cc32-btn cc32-btn-secondary\" onclick=\"cc32PrevStep()\">Precedent<\/button>\r\n <button type=\"button\" class=\"cc32-btn\" onclick=\"cc32Restart()\">Recommencer<\/button>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n<\/div>\r\n\r\n<script>\r\n(function () {\r\n 'use strict';\r\n\r\n var state = {\r\n currentStep: 0,\r\n categoryChartDrawn: false,\r\n planetChartDrawn: false\r\n };\r\n\r\n var FACTORS = {\r\n config: {\r\n priceKwhCH: 0.28,\r\n electricityKgPerKwh: 0.05,\r\n sustainableBudgetT: 2\r\n },\r\n housingType: {\r\n appartement: 0.9,\r\n maison_mitoyenne: 1.0,\r\n maison_individuelle: 1.2\r\n },\r\n heating: {\r\n pompe_chaleur: 0.8,\r\n reseau_chaleur: 1.2,\r\n bois: 1.4,\r\n gaz: 2.5,\r\n mazout: 4.0,\r\n electrique: 2.8\r\n },\r\n insulation: {\r\n tres_bonne: 0.7,\r\n bonne: 0.9,\r\n moyenne: 1.0,\r\n faible: 1.3\r\n },\r\n car: {\r\n none: 0,\r\n essence: 0.19,\r\n diesel: 0.17,\r\n hybride: 0.12,\r\n hybride_rechargeable: 0.09,\r\n electrique: 0.055\r\n },\r\n occupancy: {\r\n '1': 1.0,\r\n '2': 0.5,\r\n '3': 0.33,\r\n '4': 0.25\r\n },\r\n mobility: {\r\n trainKgKm: 0.014,\r\n busKgKm: 0.10,\r\n tramKgKm: 0.006,\r\n ebikeYearT: 0.03,\r\n secondCarYearT: 0.3,\r\n flightEuropeT: 0.30,\r\n flightLongT: 1.80\r\n },\r\n food: {\r\n base: 1.0,\r\n redMeat: { '0': 0, '1': 0.2, '2': 0.5, '3': 0.8, '4': 1.0, '5': 1.5 },\r\n poultry: { '0': 0, '1': 0.05, '2': 0.1, '3': 0.2, '4': 0.3 },\r\n fish: { '0': 0, '1': 0.05, '2': 0.1, '3': 0.2 },\r\n dairy: { faible: 0.1, moyen: 0.3, eleve: 0.6 },\r\n local: { souvent: -0.1, parfois: 0, rarement: 0.1 },\r\n waste: { faible: 0, moyen: 0.2, eleve: 0.5 }\r\n },\r\n consumption: {\r\n clothes: { '0-5': 0.1, '6-15': 0.3, '16-30': 0.6, '30plus': 1.0 },\r\n smartphone: { '5plus': 0.05, '4': 0.1, '3': 0.2, '2': 0.4, '1': 0.8 },\r\n computer: { '7plus': 0.05, '5-7': 0.1, '3-5': 0.2, 'less3': 0.4 },\r\n furniture: { faible: 0.2, moyen: 0.5, eleve: 1.0 },\r\n online: { rare: 0.1, mensuel: 0.3, hebdomadaire: 0.8 },\r\n secondHandMultiplier: { forte: 0.75, moyenne: 0.9, faible: 1.0 }\r\n },\r\n digital: {\r\n streamingPerHourWeekT: 0.01,\r\n cloud: { faible: 0.02, moyen: 0.05, eleve: 0.1 },\r\n devices: { '1-3': 0.05, '4-7': 0.1, '8-15': 0.2, '15plus': 0.4 },\r\n ai: { '0': 0, '1-10': 0.02, '11-50': 0.08, '51-100': 0.15, '100plus': 0.30 }\r\n }\r\n };\r\n\r\n function byId(id) {\r\n return document.getElementById(id);\r\n }\r\n\r\n function getNumber(id, fallback) {\r\n var el = byId(id);\r\n var value;\r\n if (!el) { return fallback; }\r\n value = parseFloat(el.value);\r\n if (isNaN(value)) { return fallback; }\r\n return value;\r\n }\r\n\r\n function getValue(id, fallback) {\r\n var el = byId(id);\r\n if (!el) { return fallback; }\r\n return el.value;\r\n }\r\n\r\n function safeFixed(n, decimals) {\r\n if (isNaN(n) || !isFinite(n)) { n = 0; }\r\n return n.toFixed(decimals);\r\n }\r\n\r\n function getSteps() {\r\n return document.querySelectorAll ? document.querySelectorAll('#cc32-app .cc32-step') : [];\r\n }\r\n\r\n function updateStep() {\r\n var steps = getSteps();\r\n var i;\r\n var label;\r\n var name;\r\n var progress;\r\n for (i = 0; i < steps.length; i += 1) {\r\n steps[i].className = steps[i].className.replace(\/\\bcc32-active\\b\/g, '').replace(\/\\s+\/g, ' ');\r\n }\r\n if (steps[state.currentStep]) {\r\n steps[state.currentStep].className += ' cc32-active';\r\n name = steps[state.currentStep].getAttribute('data-step-name') || '';\r\n } else {\r\n name = '';\r\n }\r\n label = byId('cc32-step-label');\r\n if (label) {\r\n label.innerHTML = 'Etape ' + (state.currentStep + 1) + ' sur ' + steps.length;\r\n }\r\n if (byId('cc32-step-name')) {\r\n byId('cc32-step-name').innerHTML = name;\r\n }\r\n progress = steps.length > 0 ? ((state.currentStep + 1) \/ steps.length) * 100 : 0;\r\n if (byId('cc32-progress-bar')) {\r\n byId('cc32-progress-bar').style.width = progress + '%';\r\n }\r\n if (byId('cc32-error')) {\r\n byId('cc32-error').style.display = 'none';\r\n }\r\n }\r\n\r\n function showError(message) {\r\n var box = byId('cc32-error');\r\n if (box) {\r\n box.innerHTML = message;\r\n box.style.display = 'block';\r\n }\r\n }\r\n\r\n function toggleElectricMode() {\r\n var mode = getValue('cc32-electric-mode', 'bill');\r\n var bill = byId('cc32-electric-bill-wrap');\r\n var kwh = byId('cc32-electric-kwh-wrap');\r\n if (bill && kwh) {\r\n bill.style.display = mode === 'bill' ? 'block' : 'none';\r\n kwh.style.display = mode === 'kwh' ? 'block' : 'none';\r\n }\r\n }\r\n\r\n function calculateValues() {\r\n var occupants = Math.max(1, getNumber('cc32-occupants', 1));\r\n var surface = Math.max(10, getNumber('cc32-surface', 100));\r\n var homeType = getValue('cc32-home-type', 'appartement');\r\n var heating = getValue('cc32-heating', 'pompe_chaleur');\r\n var insulation = getValue('cc32-insulation', 'bonne');\r\n var electricMode = getValue('cc32-electric-mode', 'bill');\r\n var kwh;\r\n var housing;\r\n var carType = getValue('cc32-car-type', 'none');\r\n var carKm = Math.max(0, getNumber('cc32-car-km', 0));\r\n var carOccupancy = getValue('cc32-car-occupancy', '1');\r\n var secondCar = getValue('cc32-second-car', 'no');\r\n var carFactor = FACTORS.car[carType] || 0;\r\n var occFactor = FACTORS.occupancy[carOccupancy] || 1;\r\n var mobility;\r\n var trainKm = Math.max(0, getNumber('cc32-train-km', 0));\r\n var busKm = Math.max(0, getNumber('cc32-bus-km', 0));\r\n var tramKm = Math.max(0, getNumber('cc32-tram-km', 0));\r\n var bikeType = getValue('cc32-bike-type', 'none');\r\n var flightEurope = Math.max(0, getNumber('cc32-flight-europe', 0));\r\n var flightLong = Math.max(0, getNumber('cc32-flight-long', 0));\r\n var food;\r\n var consumption;\r\n var digital;\r\n var total;\r\n\r\n if (electricMode === 'bill') {\r\n kwh = (Math.max(0, getNumber('cc32-electric-bill', 0)) * 12) \/ FACTORS.config.priceKwhCH;\r\n } else {\r\n kwh = Math.max(0, getNumber('cc32-electric-kwh', 0));\r\n }\r\n\r\n housing = ((surface \/ occupants) \/ 50) *\r\n (FACTORS.heating[heating] || 1) *\r\n (FACTORS.insulation[insulation] || 1) *\r\n (FACTORS.housingType[homeType] || 1);\r\n housing += (kwh * FACTORS.config.electricityKgPerKwh) \/ 1000;\r\n\r\n mobility = (carKm * carFactor * occFactor) \/ 1000;\r\n mobility += (trainKm * FACTORS.mobility.trainKgKm) \/ 1000;\r\n mobility += (busKm * FACTORS.mobility.busKgKm) \/ 1000;\r\n mobility += (tramKm * FACTORS.mobility.tramKgKm) \/ 1000;\r\n mobility += flightEurope * FACTORS.mobility.flightEuropeT;\r\n mobility += flightLong * FACTORS.mobility.flightLongT;\r\n if (bikeType === 'electric') { mobility += FACTORS.mobility.ebikeYearT; }\r\n if (secondCar === 'yes') { mobility += FACTORS.mobility.secondCarYearT; }\r\n\r\n food = FACTORS.food.base;\r\n food += FACTORS.food.redMeat[getValue('cc32-red-meat', '0')] || 0;\r\n food += FACTORS.food.poultry[getValue('cc32-poultry', '0')] || 0;\r\n food += FACTORS.food.fish[getValue('cc32-fish', '0')] || 0;\r\n food += FACTORS.food.dairy[getValue('cc32-dairy', 'moyen')] || 0;\r\n food += FACTORS.food.local[getValue('cc32-local-food', 'parfois')] || 0;\r\n food += FACTORS.food.waste[getValue('cc32-food-waste', 'moyen')] || 0;\r\n if (food < 0.6) { food = 0.6; }\r\n\r\n consumption = 0;\r\n consumption += FACTORS.consumption.clothes[getValue('cc32-clothes', '6-15')] || 0;\r\n consumption += FACTORS.consumption.smartphone[getValue('cc32-smartphone', '3')] || 0;\r\n consumption += FACTORS.consumption.computer[getValue('cc32-computer', '5-7')] || 0;\r\n consumption += FACTORS.consumption.furniture[getValue('cc32-furniture', 'moyen')] || 0;\r\n consumption += FACTORS.consumption.online[getValue('cc32-online-shopping', 'mensuel')] || 0;\r\n consumption *= FACTORS.consumption.secondHandMultiplier[getValue('cc32-second-hand', 'moyenne')] || 1;\r\n\r\n digital = 0;\r\n digital += Math.max(0, getNumber('cc32-streaming', 0)) * FACTORS.digital.streamingPerHourWeekT;\r\n digital += FACTORS.digital.cloud[getValue('cc32-cloud', 'moyen')] || 0;\r\n digital += FACTORS.digital.devices[getValue('cc32-devices', '4-7')] || 0;\r\n digital += FACTORS.digital.ai[getValue('cc32-ai', '1-10')] || 0;\r\n\r\n total = housing + mobility + food + consumption + digital;\r\n\r\n return {\r\n housing: housing,\r\n mobility: mobility,\r\n food: food,\r\n consumption: consumption,\r\n digital: digital,\r\n total: total,\r\n planets: total \/ FACTORS.config.sustainableBudgetT,\r\n kwh: kwh\r\n };\r\n }\r\n\r\n function getLevel(total) {\r\n if (total <= 2) {\r\n return { label: 'Zone durable indicative', badge: 'cc32-badge-green' };\r\n }\r\n if (total <= 6) {\r\n return { label: 'Depassement modere du budget durable', badge: 'cc32-badge-orange' };\r\n }\r\n return { label: 'Depassement important du budget durable', badge: 'cc32-badge-red' };\r\n }\r\n\r\n function sortCategories(values) {\r\n var arr = [\r\n { name: 'Logement', value: values.housing },\r\n { name: 'Mobilite', value: values.mobility },\r\n { name: 'Alimentation', value: values.food },\r\n { name: 'Consommation', value: values.consumption },\r\n { name: 'Numerique', value: values.digital }\r\n ];\r\n arr.sort(function (a, b) { return b.value - a.value; });\r\n return arr;\r\n }\r\n\r\n function makeRecommendations(values) {\r\n var sorted = sortCategories(values);\r\n var recos = [];\r\n var redMeat = getValue('cc32-red-meat', '0');\r\n var flights = getNumber('cc32-flight-europe', 0) + getNumber('cc32-flight-long', 0);\r\n var carKm = getNumber('cc32-car-km', 0);\r\n var heating = getValue('cc32-heating', 'pompe_chaleur');\r\n var clothes = getValue('cc32-clothes', '6-15');\r\n var ai = getValue('cc32-ai', '1-10');\r\n\r\n if (sorted[0].name === 'Alimentation' || parseInt(redMeat, 10) >= 2) {\r\n recos.push('Reduire la viande rouge : passer de plusieurs repas par semaine a 0-1 repas peut fortement diminuer le poste alimentation.');\r\n }\r\n if (sorted[0].name === 'Mobilite' || carKm > 8000 || flights > 0) {\r\n recos.push('Mobilite : reduire les kilometres en voiture, covoiturer et remplacer les vols courts par le train lorsque c\\'est possible.');\r\n }\r\n if (sorted[0].name === 'Logement' || heating === 'mazout' || heating === 'gaz') {\r\n recos.push('Logement : ameliorer l\\'isolation et envisager une solution de chauffage moins emettrice que le mazout ou le gaz.');\r\n }\r\n if (sorted[0].name === 'Consommation' || clothes === '30plus' || clothes === '16-30') {\r\n recos.push('Consommation : acheter moins de biens neufs, privilegier l\\'occasion, reparer et garder les appareils plus longtemps.');\r\n }\r\n if (sorted[0].name === 'Numerique' || ai === '51-100' || ai === '100plus') {\r\n recos.push('Numerique : limiter le streaming intensif, eviter le renouvellement trop rapide des appareils et utiliser l\\'IA quand elle apporte une vraie valeur.');\r\n }\r\n\r\n recos.push('Objectif global : viser progressivement une empreinte proche de 2 tCO2e\/an\/personne, soit environ une planete dans ce modele pedagogique.');\r\n\r\n return recos;\r\n }\r\n\r\n function drawDonut(canvasId, data, labels, colors, centerText, centerSubText, fallbackId) {\r\n var canvas = byId(canvasId);\r\n var fallback = byId(fallbackId);\r\n var context;\r\n var total = 0;\r\n var i;\r\n var start;\r\n var slice;\r\n var radius;\r\n var cx;\r\n var cy;\r\n\r\n if (!canvas || !canvas.getContext) {\r\n if (fallback) {\r\n fallback.innerHTML = makeFallbackList(labels, data, colors);\r\n }\r\n return;\r\n }\r\n\r\n context = canvas.getContext('2d');\r\n if (!context) {\r\n if (fallback) {\r\n fallback.innerHTML = makeFallbackList(labels, data, colors);\r\n }\r\n return;\r\n }\r\n\r\n context.clearRect(0, 0, canvas.width, canvas.height);\r\n for (i = 0; i < data.length; i += 1) {\r\n total += Math.max(0, data[i]);\r\n }\r\n if (total <= 0) { total = 1; }\r\n\r\n cx = canvas.width \/ 2;\r\n cy = canvas.height \/ 2;\r\n radius = Math.min(cx, cy) - 20;\r\n start = -Math.PI \/ 2;\r\n\r\n for (i = 0; i < data.length; i += 1) {\r\n slice = (Math.max(0, data[i]) \/ total) * Math.PI * 2;\r\n context.beginPath();\r\n context.moveTo(cx, cy);\r\n context.arc(cx, cy, radius, start, start + slice, false);\r\n context.closePath();\r\n context.fillStyle = colors[i] || '#cccccc';\r\n context.fill();\r\n start += slice;\r\n }\r\n\r\n context.beginPath();\r\n context.arc(cx, cy, radius * 0.58, 0, Math.PI * 2, false);\r\n context.fillStyle = '#ffffff';\r\n context.fill();\r\n\r\n context.fillStyle = '#173022';\r\n context.textAlign = 'center';\r\n context.textBaseline = 'middle';\r\n context.font = 'bold 28px Arial, Helvetica, sans-serif';\r\n context.fillText(centerText, cx, cy - 8);\r\n context.font = '13px Arial, Helvetica, sans-serif';\r\n context.fillStyle = '#617568';\r\n context.fillText(centerSubText, cx, cy + 20);\r\n\r\n if (fallback) {\r\n fallback.innerHTML = makeFallbackList(labels, data, colors);\r\n }\r\n }\r\n\r\n function makeFallbackList(labels, data, colors) {\r\n var html = '<ul class=\"cc32-breakdown-list\">';\r\n var i;\r\n for (i = 0; i < labels.length; i += 1) {\r\n html += '<li><span style=\"display:inline-block;width:10px;height:10px;background:' + (colors[i] || '#ccc') + ';border-radius:50%;margin-right:6px;\"><\/span>' + labels[i] + ' : ' + safeFixed(data[i], 1) + '<\/li>';\r\n }\r\n html += '<\/ul>';\r\n return html;\r\n }\r\n\r\n function renderResults(values) {\r\n var level = getLevel(values.total);\r\n var breakdown = byId('cc32-breakdown');\r\n var recos = byId('cc32-recommendations');\r\n var recommendations = makeRecommendations(values);\r\n var planets = values.planets;\r\n var planetColor;\r\n var planetData;\r\n var i;\r\n\r\n byId('cc32-results').style.display = 'block';\r\n byId('cc32-total-score').innerHTML = safeFixed(values.total, 1) + ' tCO2e\/an';\r\n byId('cc32-level-text').innerHTML = '<span class=\"cc32-badge ' + level.badge + '\">' + level.label + '<\/span>';\r\n\r\n breakdown.innerHTML = '';\r\n breakdown.innerHTML += '<li>Logement : ' + safeFixed(values.housing, 1) + ' tCO2e\/an<\/li>';\r\n breakdown.innerHTML += '<li>Mobilite : ' + safeFixed(values.mobility, 1) + ' tCO2e\/an<\/li>';\r\n breakdown.innerHTML += '<li>Alimentation : ' + safeFixed(values.food, 1) + ' tCO2e\/an<\/li>';\r\n breakdown.innerHTML += '<li>Consommation : ' + safeFixed(values.consumption, 1) + ' tCO2e\/an<\/li>';\r\n breakdown.innerHTML += '<li>Numerique : ' + safeFixed(values.digital, 1) + ' tCO2e\/an<\/li>';\r\n breakdown.innerHTML += '<li>Electricite estimee : ' + safeFixed(values.kwh, 0) + ' kWh\/an<\/li>';\r\n\r\n recos.innerHTML = '';\r\n for (i = 0; i < recommendations.length; i += 1) {\r\n recos.innerHTML += '<li>' + recommendations[i] + '<\/li>';\r\n }\r\n\r\n drawDonut(\r\n 'cc32-category-chart',\r\n [values.housing, values.mobility, values.food, values.consumption, values.digital],\r\n ['Logement', 'Mobilite', 'Alimentation', 'Consommation', 'Numerique'],\r\n ['#006838', '#00a651', '#8dc63f', '#ffc20e', '#f15a24'],\r\n safeFixed(values.total, 1),\r\n 'tCO2e\/an',\r\n 'cc32-category-fallback'\r\n );\r\n\r\n planetColor = planets <= 1 ? '#00843d' : (planets <= 3 ? '#f39c12' : '#d93a2f');\r\n planetData = [Math.min(planets, 5), Math.max(0, 5 - Math.min(planets, 5))];\r\n drawDonut(\r\n 'cc32-planet-chart',\r\n planetData,\r\n ['Planetes necessaires', 'Echelle restante jusqu\\'a 5 planetes'],\r\n [planetColor, '#e5e5e5'],\r\n safeFixed(planets, 1),\r\n 'planetes',\r\n 'cc32-planet-fallback'\r\n );\r\n\r\n byId('cc32-planet-fallback').innerHTML += '<p class=\"cc32-small\">Si les 8 milliards d\\'humains adoptaient votre mode de vie, il faudrait ' + safeFixed(planets, 1) + ' planetes Terre pour soutenir durablement cette consommation.<\/p>';\r\n }\r\n\r\n window.cc32NextStep = function () {\r\n try {\r\n var steps = getSteps();\r\n if (state.currentStep < steps.length - 1) {\r\n state.currentStep += 1;\r\n updateStep();\r\n }\r\n } catch (e) {\r\n showError('Erreur de navigation : ' + e.message);\r\n }\r\n };\r\n\r\n window.cc32PrevStep = function () {\r\n try {\r\n if (state.currentStep > 0) {\r\n state.currentStep -= 1;\r\n updateStep();\r\n }\r\n } catch (e) {\r\n showError('Erreur de navigation : ' + e.message);\r\n }\r\n };\r\n\r\n window.cc32ToggleElectricMode = function () {\r\n try {\r\n toggleElectricMode();\r\n } catch (e) {\r\n showError('Erreur electricite : ' + e.message);\r\n }\r\n };\r\n\r\n window.cc32Calculate = function () {\r\n try {\r\n var values = calculateValues();\r\n renderResults(values);\r\n } catch (e) {\r\n showError('Erreur de calcul : ' + e.message);\r\n }\r\n };\r\n\r\n window.cc32Restart = function () {\r\n state.currentStep = 0;\r\n if (byId('cc32-results')) {\r\n byId('cc32-results').style.display = 'none';\r\n }\r\n updateStep();\r\n };\r\n\r\n \/* Initialisation compatible anciens navigateurs *\/\r\n if (document.readyState === 'loading') {\r\n document.addEventListener('DOMContentLoaded', function () {\r\n toggleElectricMode();\r\n updateStep();\r\n });\r\n } else {\r\n toggleElectricMode();\r\n updateStep();\r\n }\r\n}());\r\n<\/script>\r\n<\/body>\r\n<\/html>\r\n\r\n\r\n\n<p>Sources:<br \/>\n<a href=\"https:\/\/www.bafu.admin.ch\/fr\" rel=\"noopener\" target=\"_blank\">Office F\u00e9d\u00e9ral de l’Environnement (OFEV)<\/a><br \/>\n<a href=\"https:\/\/www.ademe.fr\/\" rel=\"noopener\" target=\"_blank\">Agence de la Transition Energ\u00e9tique (ADEME)<\/a><br \/>\n<a href=\"https:\/\/www.wwf.ch\/fr\/vie-durable\/calculateur-d-empreinte-ecologique\" rel=\"noopener\" target=\"_blank\">WWF Suisse: calculateur d’empreinte \u00e9cologique<\/a><br \/>\n<div class=\"wpkqcg_qrcode_wrapper\"><input type=\"hidden\" id=\"wpkqcg_qrcode_outputimg_596a965295c929e39_ecclevel\" value=\"L\" \/><input type=\"hidden\" id=\"wpkqcg_qrcode_outputimg_596a965295c929e39_size\" value=\"\" \/><input type=\"hidden\" id=\"wpkqcg_qrcode_outputimg_596a965295c929e39_color\" value=\"\" \/><input type=\"hidden\" id=\"wpkqcg_qrcode_outputimg_596a965295c929e39_bgcolor\" value=\"\" \/><input type=\"hidden\" id=\"wpkqcg_qrcode_outputimg_596a965295c929e39_content\" value=\"https:\/\/www.aede.ch\/index.php?rest_route=%2Fwp%2Fv2%2Fposts%2F4174\" \/><img src=\"\" id=\"wpkqcg_qrcode_outputimg_596a965295c929e39\" alt=\"QR Code\" class=\"wpkqcg_qrcode\" style=\"width: auto; height: auto; max-width: 100%;\" ><div style=\"clear: none;\"><\/div><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Sources: Office F\u00e9d\u00e9ral de l’Environnement (OFEV) Agence de la Transition Energ\u00e9tique (ADEME) WWF Suisse: calculateur d’empreinte \u00e9cologique<\/p>\n","protected":false},"author":1,"featured_media":4183,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[26,32,55,45,47,50,52,46,1],"tags":[],"_links":{"self":[{"href":"https:\/\/www.aede.ch\/index.php?rest_route=\/wp\/v2\/posts\/4174"}],"collection":[{"href":"https:\/\/www.aede.ch\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.aede.ch\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.aede.ch\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.aede.ch\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=4174"}],"version-history":[{"count":9,"href":"https:\/\/www.aede.ch\/index.php?rest_route=\/wp\/v2\/posts\/4174\/revisions"}],"predecessor-version":[{"id":4186,"href":"https:\/\/www.aede.ch\/index.php?rest_route=\/wp\/v2\/posts\/4174\/revisions\/4186"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.aede.ch\/index.php?rest_route=\/wp\/v2\/media\/4183"}],"wp:attachment":[{"href":"https:\/\/www.aede.ch\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=4174"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.aede.ch\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=4174"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.aede.ch\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=4174"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}

{"id":4174,"date":"2026-07-25T21:52:29","date_gmt":"2026-07-25T21:52:29","guid":{"rendered":"https:\/\/www.aede.ch\/?p=4174"},"modified":"2026-07-26T15:58:09","modified_gmt":"2026-07-26T15:58:09","slug":"ecologie-calculer-son-empreinte-carbone","status":"publish","type":"post","link":"https:\/\/www.aede.ch\/?p=4174","title":{"rendered":"Durabilit\u00e9: calculer son empreinte carbone personnelle"},"content":{"rendered":"\r\n\r\n\r\n\r\n\r\n \r\n \r\n Calculateur d'empreinte carbone V3.2 - compatible navigateurs<\/title>\r\n <style>\r\n \/*\r\n Calculateur d'empreinte carbone V3.2\r\n Objectif : compatibilite large Safari \/ Firefox \/ Chrome \/ iOS \/ Android \/ macOS \/ Windows.\r\n Choix technique : aucun framework, aucune dependance externe, aucun Chart.js.\r\n Les graphiques donut sont dessines en Canvas natif avec fallback textuel.\r\n *\/\r\n\r\n #cc32-app {\r\n max-width: 1040px;\r\n margin: 18px auto;\r\n padding: 0;\r\n font-family: Arial, Helvetica, sans-serif;\r\n color: #173022;\r\n background: #ffffff;\r\n border-radius: 18px;\r\n box-shadow: 0 8px 28px rgba(0,0,0,0.10);\r\n overflow: hidden;\r\n line-height: 1.45;\r\n }\r\n\r\n #cc32-app * {\r\n box-sizing: border-box;\r\n }\r\n\r\n .cc32-hero {\r\n padding: 28px 26px;\r\n background: #006838;\r\n color: #ffffff;\r\n }\r\n\r\n .cc32-hero h1 {\r\n margin: 0 0 8px 0;\r\n font-size: 30px;\r\n line-height: 1.15;\r\n }\r\n\r\n .cc32-hero p {\r\n margin: 0;\r\n max-width: 820px;\r\n font-size: 16px;\r\n opacity: 0.95;\r\n }\r\n\r\n .cc32-body {\r\n padding: 22px 24px 28px 24px;\r\n }\r\n\r\n .cc32-progress-wrap {\r\n margin-bottom: 18px;\r\n }\r\n\r\n .cc32-progress-label {\r\n display: flex;\r\n justify-content: space-between;\r\n font-size: 13px;\r\n color: #4b6355;\r\n margin-bottom: 6px;\r\n }\r\n\r\n .cc32-progress {\r\n width: 100%;\r\n height: 12px;\r\n background: #e4ebe6;\r\n border-radius: 999px;\r\n overflow: hidden;\r\n }\r\n\r\n .cc32-progress-bar {\r\n height: 12px;\r\n width: 12%;\r\n background: #00a651;\r\n border-radius: 999px;\r\n transition: width 250ms ease;\r\n }\r\n\r\n .cc32-step {\r\n display: none;\r\n animation: cc32Fade 180ms ease;\r\n }\r\n\r\n .cc32-step.cc32-active {\r\n display: block;\r\n }\r\n\r\n @keyframes cc32Fade {\r\n from { opacity: 0; transform: translateY(4px); }\r\n to { opacity: 1; transform: translateY(0); }\r\n }\r\n\r\n .cc32-step h2 {\r\n margin: 6px 0 12px 0;\r\n color: #006838;\r\n font-size: 24px;\r\n }\r\n\r\n .cc32-intro-card,\r\n .cc32-card {\r\n background: #f5f8f6;\r\n border: 1px solid #dde9e1;\r\n border-radius: 14px;\r\n padding: 18px;\r\n margin: 14px 0;\r\n }\r\n\r\n .cc32-grid {\r\n display: grid;\r\n grid-template-columns: 1fr 1fr;\r\n gap: 14px 18px;\r\n }\r\n\r\n .cc32-field label,\r\n .cc32-field .cc32-label {\r\n display: block;\r\n margin-bottom: 5px;\r\n font-weight: bold;\r\n font-size: 14px;\r\n color: #173022;\r\n }\r\n\r\n .cc32-hint {\r\n margin-top: 4px;\r\n color: #617568;\r\n font-size: 12px;\r\n }\r\n\r\n .cc32-field input,\r\n .cc32-field select {\r\n width: 100%;\r\n min-height: 40px;\r\n padding: 9px 10px;\r\n border: 1px solid #cbd8cf;\r\n border-radius: 8px;\r\n background: #ffffff;\r\n color: #173022;\r\n font-size: 15px;\r\n -webkit-appearance: none;\r\n appearance: none;\r\n }\r\n\r\n .cc32-field input[type=\"number\"] {\r\n -webkit-appearance: none;\r\n appearance: textfield;\r\n }\r\n\r\n .cc32-field input[type=\"number\"]::-webkit-inner-spin-button,\r\n .cc32-field input[type=\"number\"]::-webkit-outer-spin-button {\r\n -webkit-appearance: none;\r\n margin: 0;\r\n }\r\n\r\n .cc32-nav {\r\n display: flex;\r\n justify-content: space-between;\r\n align-items: center;\r\n gap: 12px;\r\n margin-top: 22px;\r\n }\r\n\r\n .cc32-btn {\r\n display: inline-block;\r\n min-height: 42px;\r\n padding: 10px 18px;\r\n border: none;\r\n border-radius: 10px;\r\n background: #006838;\r\n color: #ffffff;\r\n cursor: pointer;\r\n font-size: 15px;\r\n font-weight: bold;\r\n text-align: center;\r\n }\r\n\r\n .cc32-btn:hover,\r\n .cc32-btn:focus {\r\n background: #00532d;\r\n outline: 2px solid #8dc63f;\r\n outline-offset: 2px;\r\n }\r\n\r\n .cc32-btn-secondary {\r\n background: #e7efe9;\r\n color: #173022;\r\n }\r\n\r\n .cc32-btn-secondary:hover,\r\n .cc32-btn-secondary:focus {\r\n background: #d5e3d9;\r\n }\r\n\r\n .cc32-btn-warning {\r\n background: #f15a24;\r\n }\r\n\r\n .cc32-results-grid {\r\n display: grid;\r\n grid-template-columns: 1fr 1fr;\r\n gap: 18px;\r\n margin-top: 18px;\r\n }\r\n\r\n .cc32-score {\r\n font-size: 42px;\r\n line-height: 1.05;\r\n color: #006838;\r\n font-weight: bold;\r\n margin: 8px 0;\r\n }\r\n\r\n .cc32-small {\r\n font-size: 13px;\r\n color: #617568;\r\n }\r\n\r\n .cc32-chart-box {\r\n background: #ffffff;\r\n border: 1px solid #dde9e1;\r\n border-radius: 14px;\r\n padding: 16px;\r\n text-align: center;\r\n }\r\n\r\n .cc32-chart-box h3 {\r\n margin: 0 0 10px 0;\r\n color: #006838;\r\n font-size: 18px;\r\n }\r\n\r\n .cc32-canvas {\r\n width: 100%;\r\n max-width: 330px;\r\n height: auto;\r\n margin: 0 auto;\r\n display: block;\r\n }\r\n\r\n .cc32-breakdown-list,\r\n .cc32-reco-list,\r\n .cc32-country-list {\r\n margin: 10px 0 0 0;\r\n padding-left: 20px;\r\n }\r\n\r\n .cc32-reco-list li,\r\n .cc32-country-list li,\r\n .cc32-breakdown-list li {\r\n margin: 6px 0;\r\n }\r\n\r\n .cc32-badge {\r\n display: inline-block;\r\n border-radius: 999px;\r\n padding: 4px 10px;\r\n font-size: 12px;\r\n font-weight: bold;\r\n color: #ffffff;\r\n background: #006838;\r\n margin-right: 4px;\r\n }\r\n\r\n .cc32-badge-green { background: #00843d; }\r\n .cc32-badge-orange { background: #f39c12; }\r\n .cc32-badge-red { background: #d93a2f; }\r\n\r\n .cc32-method {\r\n margin-top: 20px;\r\n font-size: 13px;\r\n color: #4f6758;\r\n background: #f5f8f6;\r\n border-radius: 12px;\r\n padding: 12px;\r\n }\r\n\r\n .cc32-error {\r\n display: none;\r\n background: #fff4e5;\r\n color: #7a4300;\r\n border: 1px solid #ffd08a;\r\n padding: 10px;\r\n border-radius: 10px;\r\n margin-top: 12px;\r\n }\r\n\r\n @media (max-width: 760px) {\r\n #cc32-app {\r\n margin: 0;\r\n border-radius: 0;\r\n }\r\n\r\n .cc32-hero {\r\n padding: 22px 18px;\r\n }\r\n\r\n .cc32-hero h1 {\r\n font-size: 24px;\r\n }\r\n\r\n .cc32-body {\r\n padding: 18px 16px 24px 16px;\r\n }\r\n\r\n .cc32-grid,\r\n .cc32-results-grid {\r\n grid-template-columns: 1fr;\r\n }\r\n\r\n .cc32-nav {\r\n flex-direction: column-reverse;\r\n align-items: stretch;\r\n }\r\n\r\n .cc32-btn {\r\n width: 100%;\r\n }\r\n\r\n .cc32-score {\r\n font-size: 34px;\r\n }\r\n }\r\n <\/style>\r\n<\/head>\r\n<body>\r\n<div id=\"cc32-app\">\r\n <div class=\"cc32-hero\">\r\n <h1>Calculateur d'empreinte carbone<\/h1>\r\n <p>Estimation p\u00e9dagogique en tonnes CO2e par an. Version autonome, compatible avec un maximum de navigateurs et plateformes.<\/p>\r\n <\/div>\r\n\r\n <div class=\"cc32-body\">\r\n <div class=\"cc32-progress-wrap\">\r\n <div class=\"cc32-progress-label\">\r\n <span id=\"cc32-step-label\">Etape 1 sur 7<\/span>\r\n <span id=\"cc32-step-name\">Introduction<\/span>\r\n <\/div>\r\n <div class=\"cc32-progress\" aria-hidden=\"true\">\r\n <div id=\"cc32-progress-bar\" class=\"cc32-progress-bar\"><\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <div id=\"cc32-error\" class=\"cc32-error\"><\/div>\r\n\r\n \r\n <div class=\"cc32-step cc32-active\" data-step-name=\"Introduction\">\r\n <h2>Bienvenue<\/h2>\r\n <div class=\"cc32-intro-card\">\r\n <p><strong>Objectif :<\/strong> obtenir une estimation simple de votre empreinte carbone annuelle, puis identifier les actions prioritaires.<\/p>\r\n <p>Le calculateur utilise des facteurs simplifi\u00e9s inspires des bases publiques ADEME\/OFEV. Il ne remplace pas un bilan carbone certifie.<\/p>\r\n <p class=\"cc32-small\">Duree estimee : 3 a 5 minutes.<\/p>\r\n <\/div>\r\n <div class=\"cc32-nav\">\r\n <span><\/span>\r\n <button type=\"button\" class=\"cc32-btn\" onclick=\"cc32NextStep()\">Commencer<\/button>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"cc32-step\" data-step-name=\"Logement\">\r\n <h2>Logement<\/h2>\r\n <div class=\"cc32-grid\">\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-occupants\">Nombre de personnes dans le logement<\/label>\r\n <input id=\"cc32-occupants\" type=\"number\" min=\"1\" max=\"12\" value=\"2\">\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-surface\">Surface du logement en m2<\/label>\r\n <input id=\"cc32-surface\" type=\"number\" min=\"10\" max=\"1000\" value=\"100\">\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-home-type\">Type de logement<\/label>\r\n <select id=\"cc32-home-type\">\r\n <option value=\"appartement\">Appartement<\/option>\r\n <option value=\"maison_mitoyenne\">Maison mitoyenne<\/option>\r\n <option value=\"maison_individuelle\">Maison individuelle<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-heating\">Chauffage principal<\/label>\r\n <select id=\"cc32-heating\">\r\n <option value=\"pompe_chaleur\">Pompe a chaleur<\/option>\r\n <option value=\"reseau_chaleur\">Reseau de chaleur<\/option>\r\n <option value=\"bois\">Bois<\/option>\r\n <option value=\"gaz\">Gaz<\/option>\r\n <option value=\"mazout\">Mazout<\/option>\r\n <option value=\"electrique\">Electrique direct<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-insulation\">Qualite de l'isolation<\/label>\r\n <select id=\"cc32-insulation\">\r\n <option value=\"tres_bonne\">Tres bonne<\/option>\r\n <option value=\"bonne\" selected>Bonne<\/option>\r\n <option value=\"moyenne\">Moyenne<\/option>\r\n <option value=\"faible\">Faible<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-electric-mode\">Electricite : information connue<\/label>\r\n <select id=\"cc32-electric-mode\" onchange=\"cc32ToggleElectricMode()\">\r\n <option value=\"bill\" selected>Montant de la facture mensuelle<\/option>\r\n <option value=\"kwh\">Consommation annuelle en kWh<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\" id=\"cc32-electric-bill-wrap\">\r\n <label for=\"cc32-electric-bill\">Facture d'electricite moyenne, CHF\/mois<\/label>\r\n <input id=\"cc32-electric-bill\" type=\"number\" min=\"0\" max=\"2000\" value=\"80\">\r\n <div class=\"cc32-hint\">Conversion utilisee : 0.28 CHF\/kWh.<\/div>\r\n <\/div>\r\n <div class=\"cc32-field\" id=\"cc32-electric-kwh-wrap\" style=\"display:none;\">\r\n <label for=\"cc32-electric-kwh\">Consommation electrique annuelle, kWh\/an<\/label>\r\n <input id=\"cc32-electric-kwh\" type=\"number\" min=\"0\" max=\"50000\" value=\"3500\">\r\n <\/div>\r\n <\/div>\r\n <div class=\"cc32-nav\">\r\n <button type=\"button\" class=\"cc32-btn cc32-btn-secondary\" onclick=\"cc32PrevStep()\">Precedent<\/button>\r\n <button type=\"button\" class=\"cc32-btn\" onclick=\"cc32NextStep()\">Suivant<\/button>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"cc32-step\" data-step-name=\"Mobilite\">\r\n <h2>Mobilite<\/h2>\r\n <div class=\"cc32-grid\">\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-car-type\">Type de voiture principale<\/label>\r\n <select id=\"cc32-car-type\">\r\n <option value=\"none\">Pas de voiture<\/option>\r\n <option value=\"essence\" selected>Essence<\/option>\r\n <option value=\"diesel\">Diesel<\/option>\r\n <option value=\"hybride\">Hybride<\/option>\r\n <option value=\"hybride_rechargeable\">Hybride rechargeable<\/option>\r\n <option value=\"electrique\">Electrique<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-car-km\">Kilometres en voiture par an<\/label>\r\n <input id=\"cc32-car-km\" type=\"number\" min=\"0\" max=\"100000\" value=\"12000\">\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-car-occupancy\">Occupation moyenne de la voiture<\/label>\r\n <select id=\"cc32-car-occupancy\">\r\n <option value=\"1\" selected>Souvent seul\/e<\/option>\r\n <option value=\"2\">En moyenne 2 personnes<\/option>\r\n <option value=\"3\">En moyenne 3 personnes<\/option>\r\n <option value=\"4\">4 personnes ou plus<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-second-car\">Deuxieme vehicule dans le menage<\/label>\r\n <select id=\"cc32-second-car\">\r\n <option value=\"no\" selected>Non<\/option>\r\n <option value=\"yes\">Oui<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-train-km\">Train, km\/an<\/label>\r\n <input id=\"cc32-train-km\" type=\"number\" min=\"0\" max=\"100000\" value=\"1000\">\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-bus-km\">Bus, km\/an<\/label>\r\n <input id=\"cc32-bus-km\" type=\"number\" min=\"0\" max=\"50000\" value=\"300\">\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-tram-km\">Tram \/ metro, km\/an<\/label>\r\n <input id=\"cc32-tram-km\" type=\"number\" min=\"0\" max=\"50000\" value=\"300\">\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-bike-type\">Velo le plus utilise<\/label>\r\n <select id=\"cc32-bike-type\">\r\n <option value=\"none\">Aucun<\/option>\r\n <option value=\"classic\" selected>Velo classique<\/option>\r\n <option value=\"electric\">Velo electrique<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-flight-europe\">Vols Europe \/ court-moyen courrier par an<\/label>\r\n <input id=\"cc32-flight-europe\" type=\"number\" min=\"0\" max=\"50\" value=\"1\">\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-flight-long\">Vols long-courriers par an<\/label>\r\n <input id=\"cc32-flight-long\" type=\"number\" min=\"0\" max=\"50\" value=\"0\">\r\n <\/div>\r\n <\/div>\r\n <div class=\"cc32-nav\">\r\n <button type=\"button\" class=\"cc32-btn cc32-btn-secondary\" onclick=\"cc32PrevStep()\">Precedent<\/button>\r\n <button type=\"button\" class=\"cc32-btn\" onclick=\"cc32NextStep()\">Suivant<\/button>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"cc32-step\" data-step-name=\"Alimentation\">\r\n <h2>Alimentation<\/h2>\r\n <div class=\"cc32-grid\">\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-red-meat\">Viande rouge, repas\/semaine<\/label>\r\n <select id=\"cc32-red-meat\">\r\n <option value=\"0\">0<\/option>\r\n <option value=\"1\">1<\/option>\r\n <option value=\"2\" selected>2<\/option>\r\n <option value=\"3\">3<\/option>\r\n <option value=\"4\">4<\/option>\r\n <option value=\"5\">5 ou plus<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-poultry\">Volaille, repas\/semaine<\/label>\r\n <select id=\"cc32-poultry\">\r\n <option value=\"0\">0<\/option>\r\n <option value=\"1\" selected>1<\/option>\r\n <option value=\"2\">2<\/option>\r\n <option value=\"3\">3<\/option>\r\n <option value=\"4\">4 ou plus<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-fish\">Poisson, repas\/semaine<\/label>\r\n <select id=\"cc32-fish\">\r\n <option value=\"0\">0<\/option>\r\n <option value=\"1\" selected>1<\/option>\r\n <option value=\"2\">2<\/option>\r\n <option value=\"3\">3 ou plus<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-dairy\">Produits laitiers<\/label>\r\n <select id=\"cc32-dairy\">\r\n <option value=\"faible\">Faible<\/option>\r\n <option value=\"moyen\" selected>Moyen<\/option>\r\n <option value=\"eleve\">Eleve<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-local-food\">Produits locaux \/ de saison<\/label>\r\n <select id=\"cc32-local-food\">\r\n <option value=\"souvent\">Souvent<\/option>\r\n <option value=\"parfois\" selected>Parfois<\/option>\r\n <option value=\"rarement\">Rarement<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-food-waste\">Gaspillage alimentaire<\/label>\r\n <select id=\"cc32-food-waste\">\r\n <option value=\"faible\">Faible<\/option>\r\n <option value=\"moyen\" selected>Moyen<\/option>\r\n <option value=\"eleve\">Eleve<\/option>\r\n <\/select>\r\n <\/div>\r\n <\/div>\r\n <div class=\"cc32-nav\">\r\n <button type=\"button\" class=\"cc32-btn cc32-btn-secondary\" onclick=\"cc32PrevStep()\">Precedent<\/button>\r\n <button type=\"button\" class=\"cc32-btn\" onclick=\"cc32NextStep()\">Suivant<\/button>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"cc32-step\" data-step-name=\"Consommation\">\r\n <h2>Achats de biens<\/h2>\r\n <div class=\"cc32-grid\">\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-clothes\">Vetements neufs achetes par an<\/label>\r\n <select id=\"cc32-clothes\">\r\n <option value=\"0-5\">0 a 5 pieces<\/option>\r\n <option value=\"6-15\" selected>6 a 15 pieces<\/option>\r\n <option value=\"16-30\">16 a 30 pieces<\/option>\r\n <option value=\"30plus\">Plus de 30 pieces<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-smartphone\">Renouvellement du smartphone<\/label>\r\n <select id=\"cc32-smartphone\">\r\n <option value=\"5plus\">Tous les 5 ans ou plus<\/option>\r\n <option value=\"4\">Tous les 4 ans<\/option>\r\n <option value=\"3\" selected>Tous les 3 ans<\/option>\r\n <option value=\"2\">Tous les 2 ans<\/option>\r\n <option value=\"1\">Tous les ans<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-computer\">Renouvellement de l'ordinateur\/tablette<\/label>\r\n <select id=\"cc32-computer\">\r\n <option value=\"7plus\">Tous les 7 ans ou plus<\/option>\r\n <option value=\"5-7\" selected>Tous les 5 a 7 ans<\/option>\r\n <option value=\"3-5\">Tous les 3 a 5 ans<\/option>\r\n <option value=\"less3\">Moins de 3 ans<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-furniture\">Mobilier \/ decoration<\/label>\r\n <select id=\"cc32-furniture\">\r\n <option value=\"faible\">Tres rarement<\/option>\r\n <option value=\"moyen\" selected>Occasionnellement<\/option>\r\n <option value=\"eleve\">Regulierement<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-online-shopping\">Achats en ligne<\/label>\r\n <select id=\"cc32-online-shopping\">\r\n <option value=\"rare\">Rarement<\/option>\r\n <option value=\"mensuel\" selected>Mensuellement<\/option>\r\n <option value=\"hebdomadaire\">Hebdomadairement<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-second-hand\">Part d'achats d'occasion<\/label>\r\n <select id=\"cc32-second-hand\">\r\n <option value=\"forte\">Forte<\/option>\r\n <option value=\"moyenne\" selected>Moyenne<\/option>\r\n <option value=\"faible\">Faible<\/option>\r\n <\/select>\r\n <\/div>\r\n <\/div>\r\n <div class=\"cc32-nav\">\r\n <button type=\"button\" class=\"cc32-btn cc32-btn-secondary\" onclick=\"cc32PrevStep()\">Precedent<\/button>\r\n <button type=\"button\" class=\"cc32-btn\" onclick=\"cc32NextStep()\">Suivant<\/button>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"cc32-step\" data-step-name=\"Numerique\">\r\n <h2>Numerique<\/h2>\r\n <div class=\"cc32-grid\">\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-streaming\">Streaming video, h\/semaine<\/label>\r\n <input id=\"cc32-streaming\" type=\"number\" min=\"0\" max=\"168\" value=\"10\">\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-cloud\">Stockage cloud<\/label>\r\n <select id=\"cc32-cloud\">\r\n <option value=\"faible\">Faible<\/option>\r\n <option value=\"moyen\" selected>Moyen<\/option>\r\n <option value=\"eleve\">Eleve<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-devices\">Nombre d'appareils connectes<\/label>\r\n <select id=\"cc32-devices\">\r\n <option value=\"1-3\">1 a 3<\/option>\r\n <option value=\"4-7\" selected>4 a 7<\/option>\r\n <option value=\"8-15\">8 a 15<\/option>\r\n <option value=\"15plus\">Plus de 15<\/option>\r\n <\/select>\r\n <\/div>\r\n <div class=\"cc32-field\">\r\n <label for=\"cc32-ai\">Requetes IA par jour<\/label>\r\n <select id=\"cc32-ai\">\r\n <option value=\"0\">0<\/option>\r\n <option value=\"1-10\" selected>1 a 10<\/option>\r\n <option value=\"11-50\">11 a 50<\/option>\r\n <option value=\"51-100\">51 a 100<\/option>\r\n <option value=\"100plus\">Plus de 100<\/option>\r\n <\/select>\r\n <div class=\"cc32-hint\">Estimation prudente : les chiffres sur l'IA restent tres debattus.<\/div>\r\n <\/div>\r\n <\/div>\r\n <div class=\"cc32-nav\">\r\n <button type=\"button\" class=\"cc32-btn cc32-btn-secondary\" onclick=\"cc32PrevStep()\">Precedent<\/button>\r\n <button type=\"button\" class=\"cc32-btn\" onclick=\"cc32NextStep()\">Voir les resultats<\/button>\r\n <\/div>\r\n <\/div>\r\n\r\n \r\n <div class=\"cc32-step\" data-step-name=\"Resultats\">\r\n <h2>Resultats<\/h2>\r\n <p>Cliquez sur le bouton pour calculer votre estimation.<\/p>\r\n <button type=\"button\" class=\"cc32-btn cc32-btn-warning\" onclick=\"cc32Calculate()\">Calculer mon empreinte<\/button>\r\n\r\n <div id=\"cc32-results\" style=\"display:none;\">\r\n <div class=\"cc32-card\">\r\n <div class=\"cc32-small\">Votre empreinte estimee<\/div>\r\n <div id=\"cc32-total-score\" class=\"cc32-score\">0.0 tCO2e\/an<\/div>\r\n <div id=\"cc32-level-text\"><\/div>\r\n <\/div>\r\n\r\n <div class=\"cc32-results-grid\">\r\n <div class=\"cc32-chart-box\">\r\n <h3>Repartition par poste<\/h3>\r\n <canvas id=\"cc32-category-chart\" class=\"cc32-canvas\" width=\"320\" height=\"320\"><\/canvas>\r\n <div id=\"cc32-category-fallback\"><\/div>\r\n <\/div>\r\n <div class=\"cc32-chart-box\">\r\n <h3>Planetes necessaires<\/h3>\r\n <canvas id=\"cc32-planet-chart\" class=\"cc32-canvas\" width=\"320\" height=\"320\"><\/canvas>\r\n <div id=\"cc32-planet-fallback\"><\/div>\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"cc32-card\">\r\n <h3>Details<\/h3>\r\n <ul id=\"cc32-breakdown\" class=\"cc32-breakdown-list\"><\/ul>\r\n <\/div>\r\n\r\n <div class=\"cc32-card\">\r\n <h3>Comparaison internationale indicative<\/h3>\r\n <ul class=\"cc32-country-list\">\r\n <li>Suisse : environ 12 tCO2e\/an\/personne<\/li>\r\n <li>USA : environ 14 tCO2e\/an\/personne<\/li>\r\n <li>Chine : environ 8 tCO2e\/an\/personne<\/li>\r\n <li>Japon : environ 8 tCO2e\/an\/personne<\/li>\r\n <li>Pays emergents : environ 4 tCO2e\/an\/personne<\/li>\r\n <li>Pays pauvres : environ 1 tCO2e\/an\/personne<\/li>\r\n <\/ul>\r\n <\/div>\r\n\r\n <div class=\"cc32-card\">\r\n <h3>Actions prioritaires<\/h3>\r\n <ol id=\"cc32-recommendations\" class=\"cc32-reco-list\"><\/ol>\r\n <\/div>\r\n\r\n <div class=\"cc32-method\">\r\n <strong>Methodologie :<\/strong> estimation pedagogique en tCO2e\/an. Les facteurs sont volontairement simplifies, inspires de methodes ADEME\/OFEV et adaptes au contexte suisse. Ce resultat n'est pas un bilan carbone certifie. Le nombre de planetes repose sur un budget pedagogique de 2 tCO2e\/an\/personne.\r\n <\/div>\r\n <\/div>\r\n\r\n <div class=\"cc32-nav\">\r\n <button type=\"button\" class=\"cc32-btn cc32-btn-secondary\" onclick=\"cc32PrevStep()\">Precedent<\/button>\r\n <button type=\"button\" class=\"cc32-btn\" onclick=\"cc32Restart()\">Recommencer<\/button>\r\n <\/div>\r\n <\/div>\r\n <\/div>\r\n<\/div>\r\n\r\n<script>\r\n(function () {\r\n 'use strict';\r\n\r\n var state = {\r\n currentStep: 0,\r\n categoryChartDrawn: false,\r\n planetChartDrawn: false\r\n };\r\n\r\n var FACTORS = {\r\n config: {\r\n priceKwhCH: 0.28,\r\n electricityKgPerKwh: 0.05,\r\n sustainableBudgetT: 2\r\n },\r\n housingType: {\r\n appartement: 0.9,\r\n maison_mitoyenne: 1.0,\r\n maison_individuelle: 1.2\r\n },\r\n heating: {\r\n pompe_chaleur: 0.8,\r\n reseau_chaleur: 1.2,\r\n bois: 1.4,\r\n gaz: 2.5,\r\n mazout: 4.0,\r\n electrique: 2.8\r\n },\r\n insulation: {\r\n tres_bonne: 0.7,\r\n bonne: 0.9,\r\n moyenne: 1.0,\r\n faible: 1.3\r\n },\r\n car: {\r\n none: 0,\r\n essence: 0.19,\r\n diesel: 0.17,\r\n hybride: 0.12,\r\n hybride_rechargeable: 0.09,\r\n electrique: 0.055\r\n },\r\n occupancy: {\r\n '1': 1.0,\r\n '2': 0.5,\r\n '3': 0.33,\r\n '4': 0.25\r\n },\r\n mobility: {\r\n trainKgKm: 0.014,\r\n busKgKm: 0.10,\r\n tramKgKm: 0.006,\r\n ebikeYearT: 0.03,\r\n secondCarYearT: 0.3,\r\n flightEuropeT: 0.30,\r\n flightLongT: 1.80\r\n },\r\n food: {\r\n base: 1.0,\r\n redMeat: { '0': 0, '1': 0.2, '2': 0.5, '3': 0.8, '4': 1.0, '5': 1.5 },\r\n poultry: { '0': 0, '1': 0.05, '2': 0.1, '3': 0.2, '4': 0.3 },\r\n fish: { '0': 0, '1': 0.05, '2': 0.1, '3': 0.2 },\r\n dairy: { faible: 0.1, moyen: 0.3, eleve: 0.6 },\r\n local: { souvent: -0.1, parfois: 0, rarement: 0.1 },\r\n waste: { faible: 0, moyen: 0.2, eleve: 0.5 }\r\n },\r\n consumption: {\r\n clothes: { '0-5': 0.1, '6-15': 0.3, '16-30': 0.6, '30plus': 1.0 },\r\n smartphone: { '5plus': 0.05, '4': 0.1, '3': 0.2, '2': 0.4, '1': 0.8 },\r\n computer: { '7plus': 0.05, '5-7': 0.1, '3-5': 0.2, 'less3': 0.4 },\r\n furniture: { faible: 0.2, moyen: 0.5, eleve: 1.0 },\r\n online: { rare: 0.1, mensuel: 0.3, hebdomadaire: 0.8 },\r\n secondHandMultiplier: { forte: 0.75, moyenne: 0.9, faible: 1.0 }\r\n },\r\n digital: {\r\n streamingPerHourWeekT: 0.01,\r\n cloud: { faible: 0.02, moyen: 0.05, eleve: 0.1 },\r\n devices: { '1-3': 0.05, '4-7': 0.1, '8-15': 0.2, '15plus': 0.4 },\r\n ai: { '0': 0, '1-10': 0.02, '11-50': 0.08, '51-100': 0.15, '100plus': 0.30 }\r\n }\r\n };\r\n\r\n function byId(id) {\r\n return document.getElementById(id);\r\n }\r\n\r\n function getNumber(id, fallback) {\r\n var el = byId(id);\r\n var value;\r\n if (!el) { return fallback; }\r\n value = parseFloat(el.value);\r\n if (isNaN(value)) { return fallback; }\r\n return value;\r\n }\r\n\r\n function getValue(id, fallback) {\r\n var el = byId(id);\r\n if (!el) { return fallback; }\r\n return el.value;\r\n }\r\n\r\n function safeFixed(n, decimals) {\r\n if (isNaN(n) || !isFinite(n)) { n = 0; }\r\n return n.toFixed(decimals);\r\n }\r\n\r\n function getSteps() {\r\n return document.querySelectorAll ? document.querySelectorAll('#cc32-app .cc32-step') : [];\r\n }\r\n\r\n function updateStep() {\r\n var steps = getSteps();\r\n var i;\r\n var label;\r\n var name;\r\n var progress;\r\n for (i = 0; i < steps.length; i += 1) {\r\n steps[i].className = steps[i].className.replace(\/\\bcc32-active\\b\/g, '').replace(\/\\s+\/g, ' ');\r\n }\r\n if (steps[state.currentStep]) {\r\n steps[state.currentStep].className += ' cc32-active';\r\n name = steps[state.currentStep].getAttribute('data-step-name') || '';\r\n } else {\r\n name = '';\r\n }\r\n label = byId('cc32-step-label');\r\n if (label) {\r\n label.innerHTML = 'Etape ' + (state.currentStep + 1) + ' sur ' + steps.length;\r\n }\r\n if (byId('cc32-step-name')) {\r\n byId('cc32-step-name').innerHTML = name;\r\n }\r\n progress = steps.length > 0 ? ((state.currentStep + 1) \/ steps.length) * 100 : 0;\r\n if (byId('cc32-progress-bar')) {\r\n byId('cc32-progress-bar').style.width = progress + '%';\r\n }\r\n if (byId('cc32-error')) {\r\n byId('cc32-error').style.display = 'none';\r\n }\r\n }\r\n\r\n function showError(message) {\r\n var box = byId('cc32-error');\r\n if (box) {\r\n box.innerHTML = message;\r\n box.style.display = 'block';\r\n }\r\n }\r\n\r\n function toggleElectricMode() {\r\n var mode = getValue('cc32-electric-mode', 'bill');\r\n var bill = byId('cc32-electric-bill-wrap');\r\n var kwh = byId('cc32-electric-kwh-wrap');\r\n if (bill && kwh) {\r\n bill.style.display = mode === 'bill' ? 'block' : 'none';\r\n kwh.style.display = mode === 'kwh' ? 'block' : 'none';\r\n }\r\n }\r\n\r\n function calculateValues() {\r\n var occupants = Math.max(1, getNumber('cc32-occupants', 1));\r\n var surface = Math.max(10, getNumber('cc32-surface', 100));\r\n var homeType = getValue('cc32-home-type', 'appartement');\r\n var heating = getValue('cc32-heating', 'pompe_chaleur');\r\n var insulation = getValue('cc32-insulation', 'bonne');\r\n var electricMode = getValue('cc32-electric-mode', 'bill');\r\n var kwh;\r\n var housing;\r\n var carType = getValue('cc32-car-type', 'none');\r\n var carKm = Math.max(0, getNumber('cc32-car-km', 0));\r\n var carOccupancy = getValue('cc32-car-occupancy', '1');\r\n var secondCar = getValue('cc32-second-car', 'no');\r\n var carFactor = FACTORS.car[carType] || 0;\r\n var occFactor = FACTORS.occupancy[carOccupancy] || 1;\r\n var mobility;\r\n var trainKm = Math.max(0, getNumber('cc32-train-km', 0));\r\n var busKm = Math.max(0, getNumber('cc32-bus-km', 0));\r\n var tramKm = Math.max(0, getNumber('cc32-tram-km', 0));\r\n var bikeType = getValue('cc32-bike-type', 'none');\r\n var flightEurope = Math.max(0, getNumber('cc32-flight-europe', 0));\r\n var flightLong = Math.max(0, getNumber('cc32-flight-long', 0));\r\n var food;\r\n var consumption;\r\n var digital;\r\n var total;\r\n\r\n if (electricMode === 'bill') {\r\n kwh = (Math.max(0, getNumber('cc32-electric-bill', 0)) * 12) \/ FACTORS.config.priceKwhCH;\r\n } else {\r\n kwh = Math.max(0, getNumber('cc32-electric-kwh', 0));\r\n }\r\n\r\n housing = ((surface \/ occupants) \/ 50) *\r\n (FACTORS.heating[heating] || 1) *\r\n (FACTORS.insulation[insulation] || 1) *\r\n (FACTORS.housingType[homeType] || 1);\r\n housing += (kwh * FACTORS.config.electricityKgPerKwh) \/ 1000;\r\n\r\n mobility = (carKm * carFactor * occFactor) \/ 1000;\r\n mobility += (trainKm * FACTORS.mobility.trainKgKm) \/ 1000;\r\n mobility += (busKm * FACTORS.mobility.busKgKm) \/ 1000;\r\n mobility += (tramKm * FACTORS.mobility.tramKgKm) \/ 1000;\r\n mobility += flightEurope * FACTORS.mobility.flightEuropeT;\r\n mobility += flightLong * FACTORS.mobility.flightLongT;\r\n if (bikeType === 'electric') { mobility += FACTORS.mobility.ebikeYearT; }\r\n if (secondCar === 'yes') { mobility += FACTORS.mobility.secondCarYearT; }\r\n\r\n food = FACTORS.food.base;\r\n food += FACTORS.food.redMeat[getValue('cc32-red-meat', '0')] || 0;\r\n food += FACTORS.food.poultry[getValue('cc32-poultry', '0')] || 0;\r\n food += FACTORS.food.fish[getValue('cc32-fish', '0')] || 0;\r\n food += FACTORS.food.dairy[getValue('cc32-dairy', 'moyen')] || 0;\r\n food += FACTORS.food.local[getValue('cc32-local-food', 'parfois')] || 0;\r\n food += FACTORS.food.waste[getValue('cc32-food-waste', 'moyen')] || 0;\r\n if (food < 0.6) { food = 0.6; }\r\n\r\n consumption = 0;\r\n consumption += FACTORS.consumption.clothes[getValue('cc32-clothes', '6-15')] || 0;\r\n consumption += FACTORS.consumption.smartphone[getValue('cc32-smartphone', '3')] || 0;\r\n consumption += FACTORS.consumption.computer[getValue('cc32-computer', '5-7')] || 0;\r\n consumption += FACTORS.consumption.furniture[getValue('cc32-furniture', 'moyen')] || 0;\r\n consumption += FACTORS.consumption.online[getValue('cc32-online-shopping', 'mensuel')] || 0;\r\n consumption *= FACTORS.consumption.secondHandMultiplier[getValue('cc32-second-hand', 'moyenne')] || 1;\r\n\r\n digital = 0;\r\n digital += Math.max(0, getNumber('cc32-streaming', 0)) * FACTORS.digital.streamingPerHourWeekT;\r\n digital += FACTORS.digital.cloud[getValue('cc32-cloud', 'moyen')] || 0;\r\n digital += FACTORS.digital.devices[getValue('cc32-devices', '4-7')] || 0;\r\n digital += FACTORS.digital.ai[getValue('cc32-ai', '1-10')] || 0;\r\n\r\n total = housing + mobility + food + consumption + digital;\r\n\r\n return {\r\n housing: housing,\r\n mobility: mobility,\r\n food: food,\r\n consumption: consumption,\r\n digital: digital,\r\n total: total,\r\n planets: total \/ FACTORS.config.sustainableBudgetT,\r\n kwh: kwh\r\n };\r\n }\r\n\r\n function getLevel(total) {\r\n if (total <= 2) {\r\n return { label: 'Zone durable indicative', badge: 'cc32-badge-green' };\r\n }\r\n if (total <= 6) {\r\n return { label: 'Depassement modere du budget durable', badge: 'cc32-badge-orange' };\r\n }\r\n return { label: 'Depassement important du budget durable', badge: 'cc32-badge-red' };\r\n }\r\n\r\n function sortCategories(values) {\r\n var arr = [\r\n { name: 'Logement', value: values.housing },\r\n { name: 'Mobilite', value: values.mobility },\r\n { name: 'Alimentation', value: values.food },\r\n { name: 'Consommation', value: values.consumption },\r\n { name: 'Numerique', value: values.digital }\r\n ];\r\n arr.sort(function (a, b) { return b.value - a.value; });\r\n return arr;\r\n }\r\n\r\n function makeRecommendations(values) {\r\n var sorted = sortCategories(values);\r\n var recos = [];\r\n var redMeat = getValue('cc32-red-meat', '0');\r\n var flights = getNumber('cc32-flight-europe', 0) + getNumber('cc32-flight-long', 0);\r\n var carKm = getNumber('cc32-car-km', 0);\r\n var heating = getValue('cc32-heating', 'pompe_chaleur');\r\n var clothes = getValue('cc32-clothes', '6-15');\r\n var ai = getValue('cc32-ai', '1-10');\r\n\r\n if (sorted[0].name === 'Alimentation' || parseInt(redMeat, 10) >= 2) {\r\n recos.push('Reduire la viande rouge : passer de plusieurs repas par semaine a 0-1 repas peut fortement diminuer le poste alimentation.');\r\n }\r\n if (sorted[0].name === 'Mobilite' || carKm > 8000 || flights > 0) {\r\n recos.push('Mobilite : reduire les kilometres en voiture, covoiturer et remplacer les vols courts par le train lorsque c\\'est possible.');\r\n }\r\n if (sorted[0].name === 'Logement' || heating === 'mazout' || heating === 'gaz') {\r\n recos.push('Logement : ameliorer l\\'isolation et envisager une solution de chauffage moins emettrice que le mazout ou le gaz.');\r\n }\r\n if (sorted[0].name === 'Consommation' || clothes === '30plus' || clothes === '16-30') {\r\n recos.push('Consommation : acheter moins de biens neufs, privilegier l\\'occasion, reparer et garder les appareils plus longtemps.');\r\n }\r\n if (sorted[0].name === 'Numerique' || ai === '51-100' || ai === '100plus') {\r\n recos.push('Numerique : limiter le streaming intensif, eviter le renouvellement trop rapide des appareils et utiliser l\\'IA quand elle apporte une vraie valeur.');\r\n }\r\n\r\n recos.push('Objectif global : viser progressivement une empreinte proche de 2 tCO2e\/an\/personne, soit environ une planete dans ce modele pedagogique.');\r\n\r\n return recos;\r\n }\r\n\r\n function drawDonut(canvasId, data, labels, colors, centerText, centerSubText, fallbackId) {\r\n var canvas = byId(canvasId);\r\n var fallback = byId(fallbackId);\r\n var context;\r\n var total = 0;\r\n var i;\r\n var start;\r\n var slice;\r\n var radius;\r\n var cx;\r\n var cy;\r\n\r\n if (!canvas || !canvas.getContext) {\r\n if (fallback) {\r\n fallback.innerHTML = makeFallbackList(labels, data, colors);\r\n }\r\n return;\r\n }\r\n\r\n context = canvas.getContext('2d');\r\n if (!context) {\r\n if (fallback) {\r\n fallback.innerHTML = makeFallbackList(labels, data, colors);\r\n }\r\n return;\r\n }\r\n\r\n context.clearRect(0, 0, canvas.width, canvas.height);\r\n for (i = 0; i < data.length; i += 1) {\r\n total += Math.max(0, data[i]);\r\n }\r\n if (total <= 0) { total = 1; }\r\n\r\n cx = canvas.width \/ 2;\r\n cy = canvas.height \/ 2;\r\n radius = Math.min(cx, cy) - 20;\r\n start = -Math.PI \/ 2;\r\n\r\n for (i = 0; i < data.length; i += 1) {\r\n slice = (Math.max(0, data[i]) \/ total) * Math.PI * 2;\r\n context.beginPath();\r\n context.moveTo(cx, cy);\r\n context.arc(cx, cy, radius, start, start + slice, false);\r\n context.closePath();\r\n context.fillStyle = colors[i] || '#cccccc';\r\n context.fill();\r\n start += slice;\r\n }\r\n\r\n context.beginPath();\r\n context.arc(cx, cy, radius * 0.58, 0, Math.PI * 2, false);\r\n context.fillStyle = '#ffffff';\r\n context.fill();\r\n\r\n context.fillStyle = '#173022';\r\n context.textAlign = 'center';\r\n context.textBaseline = 'middle';\r\n context.font = 'bold 28px Arial, Helvetica, sans-serif';\r\n context.fillText(centerText, cx, cy - 8);\r\n context.font = '13px Arial, Helvetica, sans-serif';\r\n context.fillStyle = '#617568';\r\n context.fillText(centerSubText, cx, cy + 20);\r\n\r\n if (fallback) {\r\n fallback.innerHTML = makeFallbackList(labels, data, colors);\r\n }\r\n }\r\n\r\n function makeFallbackList(labels, data, colors) {\r\n var html = '<ul class=\"cc32-breakdown-list\">';\r\n var i;\r\n for (i = 0; i < labels.length; i += 1) {\r\n html += '<li><span style=\"display:inline-block;width:10px;height:10px;background:' + (colors[i] || '#ccc') + ';border-radius:50%;margin-right:6px;\"><\/span>' + labels[i] + ' : ' + safeFixed(data[i], 1) + '<\/li>';\r\n }\r\n html += '<\/ul>';\r\n return html;\r\n }\r\n\r\n function renderResults(values) {\r\n var level = getLevel(values.total);\r\n var breakdown = byId('cc32-breakdown');\r\n var recos = byId('cc32-recommendations');\r\n var recommendations = makeRecommendations(values);\r\n var planets = values.planets;\r\n var planetColor;\r\n var planetData;\r\n var i;\r\n\r\n byId('cc32-results').style.display = 'block';\r\n byId('cc32-total-score').innerHTML = safeFixed(values.total, 1) + ' tCO2e\/an';\r\n byId('cc32-level-text').innerHTML = '<span class=\"cc32-badge ' + level.badge + '\">' + level.label + '<\/span>';\r\n\r\n breakdown.innerHTML = '';\r\n breakdown.innerHTML += '<li>Logement : ' + safeFixed(values.housing, 1) + ' tCO2e\/an<\/li>';\r\n breakdown.innerHTML += '<li>Mobilite : ' + safeFixed(values.mobility, 1) + ' tCO2e\/an<\/li>';\r\n breakdown.innerHTML += '<li>Alimentation : ' + safeFixed(values.food, 1) + ' tCO2e\/an<\/li>';\r\n breakdown.innerHTML += '<li>Consommation : ' + safeFixed(values.consumption, 1) + ' tCO2e\/an<\/li>';\r\n breakdown.innerHTML += '<li>Numerique : ' + safeFixed(values.digital, 1) + ' tCO2e\/an<\/li>';\r\n breakdown.innerHTML += '<li>Electricite estimee : ' + safeFixed(values.kwh, 0) + ' kWh\/an<\/li>';\r\n\r\n recos.innerHTML = '';\r\n for (i = 0; i < recommendations.length; i += 1) {\r\n recos.innerHTML += '<li>' + recommendations[i] + '<\/li>';\r\n }\r\n\r\n drawDonut(\r\n 'cc32-category-chart',\r\n [values.housing, values.mobility, values.food, values.consumption, values.digital],\r\n ['Logement', 'Mobilite', 'Alimentation', 'Consommation', 'Numerique'],\r\n ['#006838', '#00a651', '#8dc63f', '#ffc20e', '#f15a24'],\r\n safeFixed(values.total, 1),\r\n 'tCO2e\/an',\r\n 'cc32-category-fallback'\r\n );\r\n\r\n planetColor = planets <= 1 ? '#00843d' : (planets <= 3 ? '#f39c12' : '#d93a2f');\r\n planetData = [Math.min(planets, 5), Math.max(0, 5 - Math.min(planets, 5))];\r\n drawDonut(\r\n 'cc32-planet-chart',\r\n planetData,\r\n ['Planetes necessaires', 'Echelle restante jusqu\\'a 5 planetes'],\r\n [planetColor, '#e5e5e5'],\r\n safeFixed(planets, 1),\r\n 'planetes',\r\n 'cc32-planet-fallback'\r\n );\r\n\r\n byId('cc32-planet-fallback').innerHTML += '<p class=\"cc32-small\">Si les 8 milliards d\\'humains adoptaient votre mode de vie, il faudrait ' + safeFixed(planets, 1) + ' planetes Terre pour soutenir durablement cette consommation.<\/p>';\r\n }\r\n\r\n window.cc32NextStep = function () {\r\n try {\r\n var steps = getSteps();\r\n if (state.currentStep < steps.length - 1) {\r\n state.currentStep += 1;\r\n updateStep();\r\n }\r\n } catch (e) {\r\n showError('Erreur de navigation : ' + e.message);\r\n }\r\n };\r\n\r\n window.cc32PrevStep = function () {\r\n try {\r\n if (state.currentStep > 0) {\r\n state.currentStep -= 1;\r\n updateStep();\r\n }\r\n } catch (e) {\r\n showError('Erreur de navigation : ' + e.message);\r\n }\r\n };\r\n\r\n window.cc32ToggleElectricMode = function () {\r\n try {\r\n toggleElectricMode();\r\n } catch (e) {\r\n showError('Erreur electricite : ' + e.message);\r\n }\r\n };\r\n\r\n window.cc32Calculate = function () {\r\n try {\r\n var values = calculateValues();\r\n renderResults(values);\r\n } catch (e) {\r\n showError('Erreur de calcul : ' + e.message);\r\n }\r\n };\r\n\r\n window.cc32Restart = function () {\r\n state.currentStep = 0;\r\n if (byId('cc32-results')) {\r\n byId('cc32-results').style.display = 'none';\r\n }\r\n updateStep();\r\n };\r\n\r\n \/* Initialisation compatible anciens navigateurs *\/\r\n if (document.readyState === 'loading') {\r\n document.addEventListener('DOMContentLoaded', function () {\r\n toggleElectricMode();\r\n updateStep();\r\n });\r\n } else {\r\n toggleElectricMode();\r\n updateStep();\r\n }\r\n}());\r\n<\/script>\r\n<\/body>\r\n<\/html>\r\n\r\n\r\n\n<p>Sources:<br \/>\n<a href=\"https:\/\/www.bafu.admin.ch\/fr\" rel=\"noopener\" target=\"_blank\">Office F\u00e9d\u00e9ral de l’Environnement (OFEV)<\/a><br \/>\n<a href=\"https:\/\/www.ademe.fr\/\" rel=\"noopener\" target=\"_blank\">Agence de la Transition Energ\u00e9tique (ADEME)<\/a><br \/>\n<a href=\"https:\/\/www.wwf.ch\/fr\/vie-durable\/calculateur-d-empreinte-ecologique\" rel=\"noopener\" target=\"_blank\">WWF Suisse: calculateur d’empreinte \u00e9cologique<\/a><br \/>\n<div class=\"wpkqcg_qrcode_wrapper\"><input type=\"hidden\" id=\"wpkqcg_qrcode_outputimg_596a965295c929e39_ecclevel\" value=\"L\" \/><input type=\"hidden\" id=\"wpkqcg_qrcode_outputimg_596a965295c929e39_size\" value=\"\" \/><input type=\"hidden\" id=\"wpkqcg_qrcode_outputimg_596a965295c929e39_color\" value=\"\" \/><input type=\"hidden\" id=\"wpkqcg_qrcode_outputimg_596a965295c929e39_bgcolor\" value=\"\" \/><input type=\"hidden\" id=\"wpkqcg_qrcode_outputimg_596a965295c929e39_content\" value=\"https:\/\/www.aede.ch\/index.php?rest_route=%2Fwp%2Fv2%2Fposts%2F4174\" \/><img src=\"\" id=\"wpkqcg_qrcode_outputimg_596a965295c929e39\" alt=\"QR Code\" class=\"wpkqcg_qrcode\" style=\"width: auto; height: auto; max-width: 100%;\" ><div style=\"clear: none;\"><\/div><\/div><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Sources: Office F\u00e9d\u00e9ral de l’Environnement (OFEV) Agence de la Transition Energ\u00e9tique (ADEME) WWF Suisse: calculateur d’empreinte \u00e9cologique<\/p>\n","protected":false},"author":1,"featured_media":4183,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":[],"categories":[26,32,55,45,47,50,52,46,1],"tags":[],"_links":{"self":[{"href":"https:\/\/www.aede.ch\/index.php?rest_route=\/wp\/v2\/posts\/4174"}],"collection":[{"href":"https:\/\/www.aede.ch\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.aede.ch\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.aede.ch\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.aede.ch\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=4174"}],"version-history":[{"count":9,"href":"https:\/\/www.aede.ch\/index.php?rest_route=\/wp\/v2\/posts\/4174\/revisions"}],"predecessor-version":[{"id":4186,"href":"https:\/\/www.aede.ch\/index.php?rest_route=\/wp\/v2\/posts\/4174\/revisions\/4186"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/www.aede.ch\/index.php?rest_route=\/wp\/v2\/media\/4183"}],"wp:attachment":[{"href":"https:\/\/www.aede.ch\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=4174"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.aede.ch\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=4174"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.aede.ch\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=4174"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}