diff --git a/user/themes/r2c/js/script.js b/user/themes/r2c/js/script.js index b26ec42..4013b3e 100644 --- a/user/themes/r2c/js/script.js +++ b/user/themes/r2c/js/script.js @@ -20,94 +20,22 @@ function map() { var markers = {}; var greenIcon = new LeafIcon({iconUrl: 'user/themes/r2c/images/pointeur2.svg'}) - + var id, targets; for (var i = 0; i < dyn_data.mappoints.length; i++) { - var id = dyn_data.mappoints[i].id; + id = dyn_data.mappoints[i].id; - markers[id] = L.marker([dyn_data.mappoints[i].lat, dyn_data.mappoints[i].long], {icon: greenIcon, alt:dyn_data.mappoints[i].target}) + targets = typeof dyn_data.mappoints[i].target != 'undefined' ? dyn_data.mappoints[i].target.split(',') : []; + + markers[id] = L.marker([dyn_data.mappoints[i].lat, dyn_data.mappoints[i].long], { + icon: greenIcon, + targets:targets + }) .on("click", function(e){ // e c'est l'evenement click html normal // this c'est le marker // console.log('marker click', e, this); - - $(document).on("click","#streetmap img",function(e){ - console.log(this); - e.preventDefault(); - var hrefs = $(this).attr("alt").split(','); - // console.log('hrefs', hrefs); - var h, h_parts; - for (var i = 0; i < hrefs.length; i++) { - h = hrefs[i]; - h_parts = h.match(/^#(([^_]+)_(.+)$)/); - // console.log('h_parts', h_parts); - - function scrollTo() { - var href = target.find(h_parts[0]); - e.preventDefault(); - target.mCustomScrollbar("scrollTo",href,{ - scrollInertia:1000, - }); - } - - switch (h_parts[2]) { - case 'rct': - var target = $('#recits.mCustomScrollbar'); - scrollTo(); - break; - case 'int': - var target = $('#interviews.mCustomScrollbar'); - scrollTo(); - break; - case 'img': - var target = $('#images.mCustomScrollbar'); - scrollTo(); - break; - case 'mp': - var target = $('#streetmap.mCustomScrollbar'); - scrollTo(); - break; - case 'lk': - var target = $('#links.mCustomScrollbar'); - scrollTo(); - var href = target.find(h_parts[0]); - var text = $('.nodes text.group1'); - var text2 = $('.nodes text.group2'); - var text3 = $('.nodes text.group3'); - console.log('cc'); - - text.css({ - 'font-size':'inherit', - 'fill':'black', - }); - text2.css({ - 'font-size':'inherit', - 'fill':'grey', - }); - text3.css({ - 'font-size':'inherit', - 'fill':'lightgrey', - }); - - if (href) { - href.css({ - 'font-size':'1.2rem', - 'fill':'blue', - }); - } - break; - // case 'rs': - // var target = $('#reseaux-sociaux.mCustomScrollbar'); - // scrollTo(); - // break; - // case '': - // etc - // break; - default: - } - } - }); - console.log("marker targets", this.options.targets); + synchBloks(this.options.targets); }) .bindPopup(dyn_data.mappoints[i].title) .addTo(mymap); @@ -118,40 +46,42 @@ function map() { var cible = dyn_data.mappoints[i].target; } - function markerFunction(id){ - // console.log('id', hash); - - // var hrefs = $(this).attr("alt").split(','); - // // console.log('hrefs', hrefs); - // var h, h_parts; - // for (var i = 0; i < hrefs.length; i++) { - // h = hrefs[i]; - // h_parts = h.match(/^#(([^_]+)_(.+)$)/); - // // console.log('h_parts', h_parts); + // function markerFunction(id){ + // // console.log('id', hash); + // + // // var hrefs = $(this).attr("alt").split(','); + // // // console.log('hrefs', hrefs); + // // var h, h_parts; + // // for (var i = 0; i < hrefs.length; i++) { + // // h = hrefs[i]; + // // h_parts = h.match(/^#(([^_]+)_(.+)$)/); + // // // console.log('h_parts', h_parts); + // + // + // for (var i in markers){ + // var markerID = markers[i]._icon.id; + // // console.log('markerID',markers[i]); + // var hrefsMarker = markerID.split(','); + // var hM, h_partsM; + // + // for (var i = 0; i < hrefsMarker.length; i++) { + // hM = hrefsMarker[i]; + // h_partsM = hM.match(/^#(([^_]+)_(.+)$)/); + // console.log('h_partsM', hM); + // } + // + // if (hM == id){ + // markers[i].openPopup(); + // }; + // } + // } - for (var i in markers){ - var markerID = markers[i]._icon.id; - // console.log('markerID',markers[i]); - var hrefsMarker = markerID.split(','); - var hM, h_partsM; - - for (var i = 0; i < hrefsMarker.length; i++) { - hM = hrefsMarker[i]; - h_partsM = hM.match(/^#(([^_]+)_(.+)$)/); - console.log('h_partsM', hM); - } - - if (hM == id){ - markers[i].openPopup(); - }; - } - } - - $("a").click(function(){ - markerFunction($(this)[0].hash); - console.log('$(this)[0]',$(this)[0].hash); - }); + // TODO a quoi ça sert ça ? sur TOUS les liens ? vraiment ? + // $("a").click(function(){ + // markerFunction($(this)[0].hash); + // console.log('$(this)[0]',$(this)[0].hash); + // }); }; // change mouse_event @@ -400,88 +330,93 @@ function mCustomScrollbar() { scrollInertia: 1000, }); - - function synchronize() { - - } - $(document).on("click","a[href^='#'],#links .nodes text[href^='#'],#streetmap img[href^='#']",function(e){ e.preventDefault(); - var hrefs = $(this).attr("href").split(','); + var targets = $(this).attr("href").split(','); // console.log('hrefs', hrefs); - var h, h_parts; - for (var i = 0; i < hrefs.length; i++) { - h = hrefs[i]; - h_parts = h.match(/^#(([^_]+)_(.+)$)/); - // console.log('h_parts', h_parts); - - function scrollTo() { - var href = target.find(h_parts[0]); - e.preventDefault(); - target.mCustomScrollbar("scrollTo",href,{ - scrollInertia:1000, - }); - } - - switch (h_parts[2]) { - case 'rct': - var target = $('#recits.mCustomScrollbar'); - scrollTo(); - break; - case 'int': - var target = $('#interviews.mCustomScrollbar'); - scrollTo(); - break; - case 'img': - var target = $('#images.mCustomScrollbar'); - scrollTo(); - break; - case 'mp': - var target = $('#streetmap.mCustomScrollbar'); - scrollTo(); - break; - case 'lk': - var target = $('#links.mCustomScrollbar'); - scrollTo(); - var href = target.find(h_parts[0]); - var text = $('.nodes text.group1'); - var text2 = $('.nodes text.group2'); - var text3 = $('.nodes text.group3'); - console.log('cc'); - - text.css({ - 'font-size':'inherit', - 'fill':'black', - }); - text2.css({ - 'font-size':'inherit', - 'fill':'grey', - }); - text3.css({ - 'font-size':'inherit', - 'fill':'lightgrey', - }); - - if (href) { - href.css({ - 'font-size':'1.2rem', - 'fill':'blue', - }); - } - break; - // case 'rs': - // var target = $('#reseaux-sociaux.mCustomScrollbar'); - // scrollTo(); - // break; - // case '': - // etc - // break; - default: - } - } + synchBloks(targets); }); } + +function scrollBlockTo($block, href){ + $block.mCustomScrollbar("scrollTo",href,{ + scrollInertia:1000, + }); +} + + +function synchBloks(targets) { + // stop function if targets is not an array or an empty one + // console.log("typeof targets", typeof targets); + // if(typeof targets != "array" || !targets.length) + // return + + console.log('synchBloks : targets', targets); + + var h, h_parts; + for (var i = 0; i < targets.length; i++) { + h = targets[i]; + h_parts = h.match(/^#(([^_]+)_(.+)$)/); + // console.log('h_parts', h_parts); + + switch (h_parts[2]) { + case 'rct': + scrollBlockTo($('#recits.mCustomScrollbar'), h); + break; + case 'int': + scrollBlockTo($('#interviews.mCustomScrollbar'), h); + break; + case 'img': + scrollBlockTo($('#images.mCustomScrollbar'),h); + break; + case 'mp': + scrollBlockTo($('#streetmap.mCustomScrollbar'), h); + break; + case 'lk': + scrollBlockTo($('#links.mCustomScrollbar'), h); + + // ICI IL FAUT FAIRE UNE AUTRE FUNCTION COMME CE N4EST PAS UN SCROLL QUI SE PASSE + // var href = target.find(h_parts[0]); + // var text = $('.nodes text.group1'); + // var text2 = $('.nodes text.group2'); + // var text3 = $('.nodes text.group3'); + // console.log('cc'); + + // text.css({ + // 'font-size':'inherit', + // 'fill':'black', + // }); + // text2.css({ + // 'font-size':'inherit', + // 'fill':'grey', + // }); + // text3.css({ + // 'font-size':'inherit', + // 'fill':'lightgrey', + // }); + // + // if (href) { + // href.css({ + // 'font-size':'1.2rem', + // 'fill':'blue', + // }); + // } + break; + // case 'rs': + // var target = $('#reseaux-sociaux.mCustomScrollbar'); + // scrollBlockTo(); + // break; + // case '': + // etc + // break; + default: + } + } + +} + + function clicklinkmap() { $("text#lk_martine").on("click", function(){