{"id":8427,"date":"2021-06-08T10:29:16","date_gmt":"2021-06-08T08:29:16","guid":{"rendered":"https:\/\/myecobestfriend.com\/?page_id=8427"},"modified":"2024-06-24T19:25:32","modified_gmt":"2024-06-24T17:25:32","slug":"all-eco-mobility","status":"publish","type":"page","link":"https:\/\/myecobestfriend.com\/fr\/all-eco-mobility\/","title":{"rendered":"All &#8211; Eco-Mobility"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"8427\" class=\"elementor elementor-8427\" data-elementor-settings=\"{&quot;element_pack_global_tooltip_width&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;element_pack_global_tooltip_width_tablet&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;element_pack_global_tooltip_width_mobile&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;size&quot;:&quot;&quot;,&quot;sizes&quot;:[]},&quot;element_pack_global_tooltip_padding&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;top&quot;:&quot;&quot;,&quot;right&quot;:&quot;&quot;,&quot;bottom&quot;:&quot;&quot;,&quot;left&quot;:&quot;&quot;,&quot;isLinked&quot;:true},&quot;element_pack_global_tooltip_padding_tablet&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;top&quot;:&quot;&quot;,&quot;right&quot;:&quot;&quot;,&quot;bottom&quot;:&quot;&quot;,&quot;left&quot;:&quot;&quot;,&quot;isLinked&quot;:true},&quot;element_pack_global_tooltip_padding_mobile&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;top&quot;:&quot;&quot;,&quot;right&quot;:&quot;&quot;,&quot;bottom&quot;:&quot;&quot;,&quot;left&quot;:&quot;&quot;,&quot;isLinked&quot;:true},&quot;element_pack_global_tooltip_border_radius&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;top&quot;:&quot;&quot;,&quot;right&quot;:&quot;&quot;,&quot;bottom&quot;:&quot;&quot;,&quot;left&quot;:&quot;&quot;,&quot;isLinked&quot;:true},&quot;element_pack_global_tooltip_border_radius_tablet&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;top&quot;:&quot;&quot;,&quot;right&quot;:&quot;&quot;,&quot;bottom&quot;:&quot;&quot;,&quot;left&quot;:&quot;&quot;,&quot;isLinked&quot;:true},&quot;element_pack_global_tooltip_border_radius_mobile&quot;:{&quot;unit&quot;:&quot;px&quot;,&quot;top&quot;:&quot;&quot;,&quot;right&quot;:&quot;&quot;,&quot;bottom&quot;:&quot;&quot;,&quot;left&quot;:&quot;&quot;,&quot;isLinked&quot;:true}}\" data-elementor-post-type=\"page\">\n\t\t\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-6c1c443 elementor-section-height-min-height elementor-section-boxed elementor-section-height-default elementor-section-items-middle\" data-id=\"6c1c443\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t\t<div class=\"elementor-background-overlay\"><\/div>\n\t\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-be16d4b\" data-id=\"be16d4b\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap\">\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-61c53f4 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"61c53f4\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-942c880\" data-id=\"942c880\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-9293278 elementor-widget elementor-widget-heading\" data-id=\"9293278\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t\t<h1 class=\"elementor-heading-title elementor-size-default\">Track your Eco-Mobility<\/h1>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-7788198 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"7788198\" data-element_type=\"section\" data-e-type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-161b44f\" data-id=\"161b44f\" data-element_type=\"column\" data-e-type=\"column\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-d712455 elementor-widget elementor-widget-text-editor\" data-id=\"d712455\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p><strong>General rules<\/strong><\/p><p>*Please note this function only works on smartphones<\/p><p>*No personal data (such as geolocalization) will be used for commercial purposes or any other purposes other than the effective use of this feature<\/p><p><strong>Rules to collect points<\/strong><\/p><p>*The user will get 10 points every time they complete 10km of walking<\/p><p>*The user will get 10 points every time they complete 25km of cycling<\/p><p>*The user will get 10 points every time they complete 25km of travel by public transport<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-9dc212e elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"9dc212e\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-b554701\" data-id=\"b554701\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-30d8c6d elementor-widget elementor-widget-text-editor\" data-id=\"30d8c6d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p>Step 1 &#8211; Select your type of transport<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-73da8f1 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"73da8f1\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-33 elementor-top-column elementor-element elementor-element-ab0f3ee\" data-id=\"ab0f3ee\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-d089473 elementor-view-framed elementor-shape-circle elementor-widget elementor-widget-icon\" data-id=\"d089473\" data-element_type=\"widget\" data-e-type=\"widget\" id=\"walking\" data-widget_type=\"icon.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-icon-wrapper\">\n\t\t\t<div class=\"elementor-icon elementor-animation-push\">\n\t\t\t<svg aria-hidden=\"true\" class=\"e-font-icon-svg e-fas-walking\" viewBox=\"0 0 320 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M208 96c26.5 0 48-21.5 48-48S234.5 0 208 0s-48 21.5-48 48 21.5 48 48 48zm94.5 149.1l-23.3-11.8-9.7-29.4c-14.7-44.6-55.7-75.8-102.2-75.9-36-.1-55.9 10.1-93.3 25.2-21.6 8.7-39.3 25.2-49.7 46.2L17.6 213c-7.8 15.8-1.5 35 14.2 42.9 15.6 7.9 34.6 1.5 42.5-14.3L81 228c3.5-7 9.3-12.5 16.5-15.4l26.8-10.8-15.2 60.7c-5.2 20.8.4 42.9 14.9 58.8l59.9 65.4c7.2 7.9 12.3 17.4 14.9 27.7l18.3 73.3c4.3 17.1 21.7 27.6 38.8 23.3 17.1-4.3 27.6-21.7 23.3-38.8l-22.2-89c-2.6-10.3-7.7-19.9-14.9-27.7l-45.5-49.7 17.2-68.7 5.5 16.5c5.3 16.1 16.7 29.4 31.7 37l23.3 11.8c15.6 7.9 34.6 1.5 42.5-14.3 7.7-15.7 1.4-35.1-14.3-43zM73.6 385.8c-3.2 8.1-8 15.4-14.2 21.5l-50 50.1c-12.5 12.5-12.5 32.8 0 45.3s32.7 12.5 45.2 0l59.4-59.4c6.1-6.1 10.9-13.4 14.2-21.5l13.5-33.8c-55.3-60.3-38.7-41.8-47.4-53.7l-20.7 51.5z\"><\/path><\/svg>\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<div class=\"elementor-column elementor-col-33 elementor-top-column elementor-element elementor-element-e517662\" data-id=\"e517662\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-619f9be elementor-view-framed elementor-shape-circle elementor-widget elementor-widget-icon\" data-id=\"619f9be\" data-element_type=\"widget\" data-e-type=\"widget\" id=\"cycling\" data-widget_type=\"icon.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-icon-wrapper\">\n\t\t\t<div class=\"elementor-icon elementor-animation-push\">\n\t\t\t<svg aria-hidden=\"true\" class=\"e-font-icon-svg e-fas-bicycle\" viewBox=\"0 0 640 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M512.509 192.001c-16.373-.064-32.03 2.955-46.436 8.495l-77.68-125.153A24 24 0 0 0 368.001 64h-64c-8.837 0-16 7.163-16 16v16c0 8.837 7.163 16 16 16h50.649l14.896 24H256.002v-16c0-8.837-7.163-16-16-16h-87.459c-13.441 0-24.777 10.999-24.536 24.437.232 13.044 10.876 23.563 23.995 23.563h48.726l-29.417 47.52c-13.433-4.83-27.904-7.483-42.992-7.52C58.094 191.83.412 249.012.002 319.236-.413 390.279 57.055 448 128.002 448c59.642 0 109.758-40.793 123.967-96h52.033a24 24 0 0 0 20.406-11.367L410.37 201.77l14.938 24.067c-25.455 23.448-41.385 57.081-41.307 94.437.145 68.833 57.899 127.051 126.729 127.719 70.606.685 128.181-55.803 129.255-125.996 1.086-70.941-56.526-129.72-127.476-129.996zM186.75 265.772c9.727 10.529 16.673 23.661 19.642 38.228h-43.306l23.664-38.228zM128.002 400c-44.112 0-80-35.888-80-80s35.888-80 80-80c5.869 0 11.586.653 17.099 1.859l-45.505 73.509C89.715 331.327 101.213 352 120.002 352h81.3c-12.37 28.225-40.562 48-73.3 48zm162.63-96h-35.624c-3.96-31.756-19.556-59.894-42.383-80.026L237.371 184h127.547l-74.286 120zm217.057 95.886c-41.036-2.165-74.049-35.692-75.627-76.755-.812-21.121 6.633-40.518 19.335-55.263l44.433 71.586c4.66 7.508 14.524 9.816 22.032 5.156l13.594-8.437c7.508-4.66 9.817-14.524 5.156-22.032l-44.468-71.643a79.901 79.901 0 0 1 19.858-2.497c44.112 0 80 35.888 80 80-.001 45.54-38.252 82.316-84.313 79.885z\"><\/path><\/svg>\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<div class=\"elementor-column elementor-col-33 elementor-top-column elementor-element elementor-element-a9da89e\" data-id=\"a9da89e\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-3710baa elementor-view-framed elementor-shape-circle elementor-widget elementor-widget-icon\" data-id=\"3710baa\" data-element_type=\"widget\" data-e-type=\"widget\" id=\"driving\" data-widget_type=\"icon.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-icon-wrapper\">\n\t\t\t<div class=\"elementor-icon elementor-animation-push\">\n\t\t\t<svg aria-hidden=\"true\" class=\"e-font-icon-svg e-fas-bus\" viewBox=\"0 0 512 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M488 128h-8V80c0-44.8-99.2-80-224-80S32 35.2 32 80v48h-8c-13.25 0-24 10.74-24 24v80c0 13.25 10.75 24 24 24h8v160c0 17.67 14.33 32 32 32v32c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32v-32h192v32c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32v-32h6.4c16 0 25.6-12.8 25.6-25.6V256h8c13.25 0 24-10.75 24-24v-80c0-13.26-10.75-24-24-24zM112 400c-17.67 0-32-14.33-32-32s14.33-32 32-32 32 14.33 32 32-14.33 32-32 32zm16-112c-17.67 0-32-14.33-32-32V128c0-17.67 14.33-32 32-32h256c17.67 0 32 14.33 32 32v128c0 17.67-14.33 32-32 32H128zm272 112c-17.67 0-32-14.33-32-32s14.33-32 32-32 32 14.33 32 32-14.33 32-32 32z\"><\/path><\/svg>\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-9a1e878 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"9a1e878\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-608e129\" data-id=\"608e129\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-2032bff elementor-widget elementor-widget-text-editor\" data-id=\"2032bff\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p>Step 2 &#8211; Select the current location by clicking on <img decoding=\"async\" class=\"alignnone size-full wp-image-48401\" src=\"https:\/\/myecobestfriend.com\/wp-content\/uploads\/2022\/08\/ssss-1.png\" alt=\"\" width=\"27\" height=\"32\" srcset=\"https:\/\/myecobestfriend.com\/wp-content\/uploads\/2022\/08\/ssss-1.png 27w, https:\/\/myecobestfriend.com\/wp-content\/uploads\/2022\/08\/ssss-1-10x12.png 10w, https:\/\/myecobestfriend.com\/wp-content\/uploads\/2022\/08\/ssss-1-21x25.png 21w\" sizes=\"(max-width: 27px) 100vw, 27px\" \/>in the top right corner of the map<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-36ea5c8 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"36ea5c8\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-91458f5\" data-id=\"91458f5\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-db66a8e elementor-widget elementor-widget-text-editor\" data-id=\"db66a8e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p>Step 3\u00a0 &#8211; Click on the map to select your destination and click on the Start button to start your journey<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-f08560f elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"f08560f\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-5ee71a0\" data-id=\"5ee71a0\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-d3a440e elementor-widget elementor-widget-text-editor\" data-id=\"d3a440e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t\t\t\t\t\t<p>Step 4\u00a0 -Once you reach your destination you will automatically collect eco-points. You can also click on the &#8220;Finish&#8221; button if you want to cancel your journey<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-52c278f elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"52c278f\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-f58087b\" data-id=\"f58087b\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-4b97458 elementor-widget elementor-widget-html\" data-id=\"4b97458\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t <script src=\"https:\/\/code.jquery.com\/jquery-3.5.1.js\" ><\/script>\r\n <script src='https:\/\/api.tiles.mapbox.com\/mapbox-gl-js\/v2.6.1\/mapbox-gl.js'>\r\n  <\/script>\r\n   \r\n    <link href='https:\/\/api.tiles.mapbox.com\/mapbox-gl-js\/v2.6.1\/mapbox-gl.css' rel='stylesheet' \/>\r\n    \r\n   \r\n    <div class=\"map\" id=\"map\"><\/div>\r\n    \r\n    <style>\r\n    \r\n#map { position: relative top: 0; bottom: 0;\r\nheight:300px;}\r\n    <\/style>\r\n \r\n<script src='https:\/\/api.mapbox.com\/mapbox-gl-js\/plugins\/mapbox-gl-draw\/v1.0.0\/mapbox-gl-draw.js'><\/script>\r\n    <link rel='stylesheet' href='https:\/\/api.mapbox.com\/mapbox-gl-js\/plugins\/mapbox-gl-draw\/v1.0.0\/mapbox-gl-draw.css' type='text\/css'\/>\r\n    <div id=\"myDIV\"><\/div>\r\n   \r\n    <script defer=\"defer\">\r\n   \r\n    \/\/ add the JavaScript here\r\n\tmapboxgl.accessToken = 'pk.eyJ1Ijoic3lhbGtoYW4iLCJhIjoiY2t4em8wemFsNWI2ODJwcXd5bWFtYmh0NSJ9.Gt0i2CMutUetNc7WpMzgmw';\r\nconst map = new mapboxgl.Map({\r\n  container: 'map',\r\n  tap: false,\r\n  style: 'mapbox:\/\/styles\/syalkhan\/cl0tfg7zz00gs14jzfxel7om7',\r\n  center: [8.16219,47.17353], \/\/ starting position\r\n  zoom: 07\r\n});\r\n\/\/selection of mode of transportation\r\n\r\n\/\/const bikebtn = document.querySelector('.bike');\r\n\/\/bikebtn.addEventListener('click',event =>{\r\n   \/\/ alert(\"This function works only on a Mobile Phone\");\r\n   \/\/   if(confirm){\r\n   \/\/ getLocation();\r\n  \/\/}\r\n\r\n\/\/});\r\nlet dprofile;\r\nvar btn1=document.querySelector(\"#walking\");\r\nbtn1.addEventListener('click', (e)=> { dprofile=\"walking\";\r\n alert(\"This function works only on a Mobile Phone\");\r\nif(confirm){\r\n    alert(\"GDPR Compliancy& Data Privacy:\\n The data localization collected with this function is not shared with any third-party providers nor used for any commercial or any other purposes other than ensuring the effective use of this function\");\r\n    getLocation();\r\n  }});\r\nvar btn2=document.querySelector(\"#cycling\");\r\nbtn2.addEventListener('click', (e)=> { dprofile=\"cycling\";\r\nalert(\"This function works only on a Mobile Phone\");\r\nif(confirm){\r\n      alert(\"GDPR Compliancy& Data Privacy:\\n The data localization collected with this function is not shared with any third-party providers nor used for any commercial or any other purposes other than ensuring the effective use of this function\");\r\n    getLocation();\r\n  }});\r\nvar btn3=document.querySelector(\"#driving\");\r\nbtn3.addEventListener('click', (e)=> { dprofile=\"driving\";\r\nalert(\"This function works only on a Mobile Phone\");\r\nif(confirm){\r\n      alert(\"GDPR Compliancy& Data Privacy:\\n The data localization collected with this function is not shared with any third-party providers nor used for any commercial or any other purposes other than ensuring the effective use of this function\");\r\n     \r\n    getLocation();\r\n  }});\r\n\r\n\/\/geolocation function start to get current \/\/position\r\nvar start;\r\nvar x;\r\nfunction getLocation(){\r\n let geolocate = new mapboxgl.GeolocateControl({\r\n                positionOptions: {\r\n                    enableHighAccuracy: true\r\n                },\r\ntrackUserLocation: true,\r\nshowUserHeading: true\r\n            });\r\n        map.addControl(geolocate);\r\n\r\n        geolocate.once('geolocate', function(e) {\r\n            \/\/ The event object (e) contains information like the\r\n            \/\/ coordinates of the point on the map that was clicked.\r\n            var lon = e.coords.longitude;\r\n      var lat = e.coords.latitude;\r\n            \r\n           start = [lon, lat];\r\n      console.log(start);\r\n      localStorage.setItem('start', JSON.stringify(start));\r\n      \/\/code for toggle\r\n      x = document.getElementById(\"myDIV\"); \r\n    x.innerHTML = \"Please select your destination\";\r\n    });}\r\n        \r\n        \/\/****************************\r\n        \r\n        \r\n      \/\/getrout function start from here\r\n        \r\n      function getRout(end){  return new Promise(resolve => {\r\n          console.log(dprofile);\r\n       var url = `https:\/\/api.mapbox.com\/directions\/v5\/mapbox\/${dprofile}\/${start[0]},${start[1]};${end[0]},${end[1]}?steps=true&geometries=geojson&access_token=${mapboxgl.accessToken}`;\r\n    \r\n    var req = new XMLHttpRequest();\r\n    \r\n    req.responseType = \"json\";\r\n    req.open('GET', url, true);\r\n    \r\n    console.log(\"test 1\");\r\n    console.log(req);\r\n    req.onload = function(){\r\n      console.log(\"test 2\");\r\n      var jsonResponse =  req.response;\r\n      var distance = jsonResponse.routes[0].distance*0.001;\r\n      resolve(distance);\r\n       localStorage.setItem('distance',JSON.stringify(distance));\r\n      var duration = jsonResponse.routes[0].duration\/60;\r\n      var coords = jsonResponse.routes[0].geometry;\r\n      console.log(\"this is the end of get route funciton\");\r\n      addRoute(coords);\r\n      };\r\n    req.send();\r\n    \/\/show start journey message\r\n    x.innerHTML = \"Start your journey\";\r\n    \r\n    \r\n      });\r\n  };\r\n   function addRoute(coords) {\r\n      \/\/check if the route is already loaded\r\n      if (map.getSource('route')) {\r\n        console.log(\"this is if add route function\");\r\n        map.removeLayer('route');\r\n        map.removeSource('route');\r\n        console.log(\"test 1.1\");\r\n        map.addLayer({\r\n          \"id\": \"route\",\r\n          \"type\": \"line\",\r\n          \"source\": {\r\n            \"type\": \"geojson\",\r\n            \"data\": {\r\n              \"type\": \"Feature\",\r\n              \"properties\": {},\r\n              \"geometry\": coords\r\n            }\r\n          },\r\n          \"layout\": {\r\n            \"line-join\": \"round\",\r\n            \"line-cap\": \"round\"\r\n          },\r\n          \"paint\": {\r\n            \"line-color\": \"#3b9ddd\",\r\n            \"line-width\": 8,\r\n            \"line-opacity\": 0.8\r\n          }\r\n          \r\n        });\r\n        console.log(\"test 1.2\");\r\n      } else {\r\n        console.log(\"this is add route function\");\r\n        map.addLayer({\r\n          \"id\": \"route\",\r\n          \"type\": \"line\",\r\n          \"source\": {\r\n            \"type\": \"geojson\",\r\n            \"data\": {\r\n              \"type\": \"Feature\",\r\n              \"properties\": {},\r\n              \"geometry\": coords\r\n            }\r\n          },\r\n          \"layout\": {\r\n            \"line-join\": \"round\",\r\n            \"line-cap\": \"round\"\r\n          },\r\n          \"paint\": {\r\n            \"line-color\": \"#3b9ddd\",\r\n            \"line-width\": 8,\r\n            \"line-opacity\": 0.8\r\n          }\r\n        });\r\n      \r\n    }\r\n\r\n    \r\n  }\r\n  \/\/getrout function end\r\n\r\n\r\n    \/\/count for how many times the function call\r\n    var count = 0;\r\nlet marker='';\r\n\r\n      map.on('click', (e) => {\r\n\r\n         \/\/console.log(a);\r\n       if(marker){\r\n            marker.remove();\r\n             \r\n         }\r\n       count++;\r\n       \r\n        \/\/ Set marker options.\r\n         marker = new mapboxgl.Marker({\r\n            color: \"#FFF76F\",\r\n            draggable: true\r\n          });\r\n          console.log(count);\r\n          if(count<=5){\r\n            marker.setLngLat(e.lngLat).addTo(map);\r\n            const lngLat = marker.getLngLat();\r\n            const latitude = lngLat.lat;\r\n            const longi = lngLat.lng;\r\n            \/\/console.log(lngLat);\r\n           \/\/ console.log(latitude, longi);\r\n            const finalEndCoords = [longi,latitude];\r\n            localStorage.setItem('end',JSON.stringify(finalEndCoords));\r\n            getRout(finalEndCoords);\r\n          }\r\n         \r\n          function onDragEnd(){\r\n             \/\/ marker.remove();\r\n            const lngLat = marker.getLngLat();\r\n            console.log(lngLat);\r\n            const latitude = lngLat.lat;\r\n            const longi = lngLat.lng;\r\n            const finalEndCoords = [longi,latitude];\r\n            localStorage.setItem('end',JSON.stringify(finalEndCoords));\r\n            getRout(finalEndCoords);\r\n          }\r\n          marker.on('dragend', onDragEnd)\r\n\r\n          \/\/ }\r\n    \r\n    });\r\n    async function startnav(){\r\n        const xyz= await startnavigation();\r\n    }\r\n    function startnavigation(){return new Promise(resolve => {\r\n    \r\n      var id, options, distance, etarget;\r\n      \/\/show start journey message\r\n    x.innerHTML = \"Your journey started please reach your destination to get points\";\r\n     \/\/ const pos = JSON.parse(localStorage    \/\/.getItem('start'));\r\n     const pos = start;\r\n      const target = JSON.parse(localStorage.getItem('end'));\r\n      \/\/working on bbox\r\n      console.log(pos);\r\n      console.log(\"coords save in target are\"+target);\r\n      console.log(\"cords in array are \"+ target[0]);\r\n      const ll = new mapboxgl.LngLat(target[0], target[1]).toBounds(100);\r\n      \r\n     \/\/ ll.toBounds(100);\r\n      console.log(ll);\r\n      console.log(\"i am in startnav function\");\r\n      \r\n    function success(pos) {\r\n      var crd = pos.coords;\r\n      console.log(\"this is success function\",crd);\r\n      console.log(crd.latitude);\r\n      const currentUpdateLoc = [crd.longitude, crd.latitude];\r\n      console.log(currentUpdateLoc);\r\n      const currentUpdateLoclike = mapboxgl.LngLat.convert(currentUpdateLoc);\r\n\r\n      console.log(\"this is target in success\",target);\r\n      \/\/if (target[1] === crd.latitude && \/\/target[0] === crd.longitude) {\r\n        if(ll.contains(currentUpdateLoclike)){\r\n        console.log('Congratulations, you reached the target');\r\n        const distance = JSON.parse(localStorage.getItem('distance'));\r\n        x.innerHTML = \"congratulations you reached your destination and you go \"+distance+\" KM\";\r\n        \r\n        \r\n        \/\/  HERE IS A FUNCTION FOR HTTP FOR DISTANCE STORE\r\n        \r\n        console.log(\"you have covered \"+distance+\"km\");\r\n        \/\/  TRYING WITH ajax\r\n\r\n jQuery(document).ready(function($){\r\n     \r\n     \r\n      console.log(distance);\r\n\r\n      $.ajax({\r\n        url: '\/wp-admin\/admin-ajax.php',\r\n        data: {\r\n          'action': 'php_tutorial',\r\n          'php_test': distance.toFixed(2),\r\n          'profile_travel': dprofile,\r\n        },\r\n        success: function(data){\r\n          console.log(\"Happy\");\r\n        }\r\n      });\r\n\r\n  });\r\n  \/\/another try of HTTP\r\n  \r\n\r\n\/\/HERE AJAX END\r\n        navigator.geolocation.clearWatch(id);\r\n        \r\n      }\r\n    }\r\n    \r\n    function error(err) {\r\n      console.warn('ERROR(' + err.code + '): ' + err.message);\r\n    }\r\n    etarget = {\r\n  latitude : 0,\r\n  longitude: 0\r\n};\r\n    \r\n    options = {\r\n      timeout: 30000, enableHighAccuracy: true, maximumAge: 75000\r\n    };\r\n    \r\n    id = navigator.geolocation.watchPosition(success, error, options);\r\n    \r\n    \r\n    \/\/stop button\r\n     const endofjourney = document.querySelector(\"#stopbtn\");\r\n   endofjourney.addEventListener(\"click\", ()=>{\r\n      \/\/ Cancel the updates when the user clicks a button.\r\n      navigator.geolocation.clearWatch(id);\r\n      console.log(\"you have end your journey\");\r\n     \/\/ marker.remove();\r\n     \/\/\/map.removeLayer('route');\r\n      map.setPitch(0, {duration: 3000});\r\n  map.zoomOut({duration: 1000});\r\n  map.rotateTo(0, {duration: 5000});\r\n  console.log(start);\r\n  function success(pos) {\r\n  const crd = pos.coords;\r\n\r\n  console.log('Your current position is:');\r\n  console.log(`Latitude : ${crd.latitude}`);\r\n  console.log(`Longitude: ${crd.longitude}`);\r\n  console.log(`More or less ${crd.accuracy} meters.`);\r\n   const currentUpdateLoc = [crd.longitude, crd.latitude];\r\n   async function getUncompleteDistance(){\r\n const result= await getRout(currentUpdateLoc);\r\n    console.log(typeof result);\r\n    console.log(\"happened\");\r\n     x.innerHTML = \"see you next time and you go \"+result+\" KM\";\r\n     \r\n  \r\n     \r\n     \r\n     \r\n     \r\n    \/\/uncomplete distance in km store in database\r\n     jQuery(document).ready(function($){\r\n     \r\n     \r\n      \r\n\r\n      $.ajax({\r\n        url: '\/wp-admin\/admin-ajax.php',\r\n        data: {\r\n          'action': 'php_tutorial',\r\n          'php_test': result.toFixed(2),\r\n          'profile_travel': dprofile,\r\n        },\r\n        success: function(data){\r\n          console.log(\"Happy\");\r\n        }\r\n      });\r\n\r\n  });\r\n   }\r\n   getUncompleteDistance();\r\n}\r\n\r\nfunction error(err) {\r\n  console.warn(`ERROR(${err.code}): ${err.message}`);\r\n}\r\n\r\nnavigator.geolocation.getCurrentPosition(success, error, options);\r\n\r\n\r\n  \r\n      \r\n \/\/   });\r\n    \r\n    \r\n    });\r\n         \r\n    });}\r\n     \r\n     window.onload=function(){\r\n\r\n const startjr = document.querySelector(\"#startbtn\");\r\n     \r\n    startjr.addEventListener('click', ()=>{\r\n        console.log(\"this is event after start button\");\r\n  map.setCenter(start);\r\n \/\/ map.setPitch(50, {duration: 3000});\r\n  map.zoomIn({duration: 1000});\r\n map.rotateTo(30, {duration: 5000});\r\n \/\/map.bearingSnap: \"90\";\r\n  startnav();\r\n\/\/\r\n});\r\n\r\n     }\r\n\r\n\r\n<\/script>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-1fe8c45 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"1fe8c45\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-61ee6e7\" data-id=\"61ee6e7\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-1762e57 elementor-align-center elementor-widget elementor-widget-button\" data-id=\"1762e57\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-button elementor-size-sm\" role=\"button\" id=\"startbtn\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">Start<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-7f0a085\" data-id=\"7f0a085\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-bf8e460 elementor-align-center elementor-widget elementor-widget-button\" data-id=\"bf8e460\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t\t\t\t\t\t\t<a class=\"elementor-button elementor-size-sm\" role=\"button\" id=\"stopbtn\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">Finish<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-3ac4c24 elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"3ac4c24\" data-element_type=\"section\" data-e-type=\"section\">\n\t\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-100 elementor-top-column elementor-element elementor-element-c462e96\" data-id=\"c462e96\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-63a2063 elementor-widget elementor-widget-spacer\" data-id=\"63a2063\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<section class=\"elementor-section elementor-top-section elementor-element elementor-element-f007c1b elementor-section-boxed elementor-section-height-default elementor-section-height-default\" data-id=\"f007c1b\" data-element_type=\"section\" data-e-type=\"section\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;,&quot;shape_divider_bottom&quot;:&quot;mountains&quot;}\">\n\t\t\t\t\t<div class=\"elementor-shape elementor-shape-bottom\" aria-hidden=\"true\" data-negative=\"false\">\n\t\t\t<svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" viewBox=\"0 0 1000 100\" preserveAspectRatio=\"none\">\n\t<path class=\"elementor-shape-fill\" opacity=\"0.33\" d=\"M473,67.3c-203.9,88.3-263.1-34-320.3,0C66,119.1,0,59.7,0,59.7V0h1000v59.7 c0,0-62.1,26.1-94.9,29.3c-32.8,3.3-62.8-12.3-75.8-22.1C806,49.6,745.3,8.7,694.9,4.7S492.4,59,473,67.3z\"\/>\n\t<path class=\"elementor-shape-fill\" opacity=\"0.66\" d=\"M734,67.3c-45.5,0-77.2-23.2-129.1-39.1c-28.6-8.7-150.3-10.1-254,39.1 s-91.7-34.4-149.2,0C115.7,118.3,0,39.8,0,39.8V0h1000v36.5c0,0-28.2-18.5-92.1-18.5C810.2,18.1,775.7,67.3,734,67.3z\"\/>\n\t<path class=\"elementor-shape-fill\" d=\"M766.1,28.9c-200-57.5-266,65.5-395.1,19.5C242,1.8,242,5.4,184.8,20.6C128,35.8,132.3,44.9,89.9,52.5C28.6,63.7,0,0,0,0 h1000c0,0-9.9,40.9-83.6,48.1S829.6,47,766.1,28.9z\"\/>\n<\/svg>\t\t<\/div>\n\t\t\t\t\t<div class=\"elementor-container elementor-column-gap-default\">\n\t\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-0607ee3\" data-id=\"0607ee3\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap elementor-element-populated\">\n\t\t\t\t\t\t<div class=\"elementor-element elementor-element-5f3ac95 elementor-widget elementor-widget-image\" data-id=\"5f3ac95\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img fetchpriority=\"high\" decoding=\"async\" width=\"429\" height=\"475\" src=\"https:\/\/myecobestfriend.com\/wp-content\/uploads\/2021\/04\/789-removebg-preview.png\" class=\"attachment-full size-full wp-image-15953\" alt=\"\" srcset=\"https:\/\/myecobestfriend.com\/wp-content\/uploads\/2021\/04\/789-removebg-preview.png 429w, https:\/\/myecobestfriend.com\/wp-content\/uploads\/2021\/04\/789-removebg-preview-416x461.png 416w, https:\/\/myecobestfriend.com\/wp-content\/uploads\/2021\/04\/789-removebg-preview-11x12.png 11w, https:\/\/myecobestfriend.com\/wp-content\/uploads\/2021\/04\/789-removebg-preview-23x25.png 23w, https:\/\/myecobestfriend.com\/wp-content\/uploads\/2021\/04\/789-removebg-preview-90x100.png 90w\" sizes=\"(max-width: 429px) 100vw, 429px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<div class=\"elementor-column elementor-col-50 elementor-top-column elementor-element elementor-element-e5f4782\" data-id=\"e5f4782\" data-element_type=\"column\" data-e-type=\"column\">\n\t\t\t<div class=\"elementor-widget-wrap\">\n\t\t\t\t\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t<\/section>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Track your Eco-Mobility General rules *Please note this function only works on smartphones *No personal data (such as geolocalization) will be used for commercial purposes or any other purposes other than the effective use of this feature Rules to collect points *The user will get 10 points every time they complete 10km of walking *The [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"_acf_changed":false,"footnotes":""},"tags":[],"class_list":["post-8427","page","type-page","status-publish","hentry"],"acf":[],"_links":{"self":[{"href":"https:\/\/myecobestfriend.com\/fr\/wp-json\/wp\/v2\/pages\/8427","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/myecobestfriend.com\/fr\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/myecobestfriend.com\/fr\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/myecobestfriend.com\/fr\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/myecobestfriend.com\/fr\/wp-json\/wp\/v2\/comments?post=8427"}],"version-history":[{"count":18,"href":"https:\/\/myecobestfriend.com\/fr\/wp-json\/wp\/v2\/pages\/8427\/revisions"}],"predecessor-version":[{"id":54081,"href":"https:\/\/myecobestfriend.com\/fr\/wp-json\/wp\/v2\/pages\/8427\/revisions\/54081"}],"wp:attachment":[{"href":"https:\/\/myecobestfriend.com\/fr\/wp-json\/wp\/v2\/media?parent=8427"}],"wp:term":[{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/myecobestfriend.com\/fr\/wp-json\/wp\/v2\/tags?post=8427"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}