https://metalyapi.com/js/page-scripts/layout-scripts/components/co…H02b-_sGNrXEV-nwivbQO5B23ga7Ts0WcCzX20kSnCs

1    /*
2    Tek dinleyici + tek tetikleme:
3    - Yalnızca birincil (SOL) tuş bırakıldığında çalışır.
4    - Sağ/orta tık pointerup tetiklese bile handler ÇALIŞMAZ.
5    - Mevcut fonksiyon/degisken isimleri ve setContinentView imzası aynen bırakıldı.
6    */
7document.addEventListener('DOMContentLoaded', () => {
8
9        //document.querySelector('body').style.setProperty('opacity','1');
10
11        // TIKLAYICI METOD:
12        function selectDefaultCountryOnOpen(svgId, countryName, delayMs = 0) {
13            const svg = document.getElementById(svgId);
14            if (!svg || !countryName) return;
15
16            // Ülkeyi bulmak için hem [name="..."] hem de sınıf kombinasyonlarını dene
17            const classSel = '.' + countryName.split(/\s+/).map(CSS.escape).join('.');
18            const attrSel = `[name="${String(countryName).replace(/"/g, '\\"')}"]`;
19            const target = svg.querySelector(`${attrSel}, ${classSel}`);
20            if (!target) return;
21
22            // pointerup (bubbles + cancelable) → delegasyonla svg'deki dinleyici yakalar
23            const fire = () => {
24                const evt = new PointerEvent('pointerup', { bubbles: true, cancelable: true });
25                target.dispatchEvent(evt);
26            };
27
28            // Açılışta layout otursun diye (opacity/width/viewBox sonrası) opsiyonel gecikme
29            delayMs > 0 ? setTimeout(fire, delayMs) : requestAnimationFrame(fire);
30        }
31
32      // Kullanım: initContinentViewState('alone-continent-af')
33      function initContinentViewState(svgId){
34        const svg = document.getElementById(svgId);
35    if (!svg) return;
36
37    if (!svg.dataset.vb0) {
38          const vb = svg.getAttribute('viewBox');
39    if (vb) {
40        svg.dataset.vb0 = vb;
41          } else {
42            const b = svg.getBBox();
43    svg.dataset.vb0 = `${b.x} ${b.y} ${b.width} ${b.height}`;
44          }
45        }
46    if (!svg.dataset.par0) {
47        svg.dataset.par0 = svg.getAttribute('preserveAspectRatio') || 'xMidYMid meet';
48        }
49      }
50
51    // KITA VIEW RESET METODU:
52    function resetContinentView(svgId){
53       const svg = document.getElementById(svgId);
54    if (!svg) return;
55
56    const vb0  = svg.dataset.vb0;
57    const par0 = svg.dataset.par0 || 'xMidYMid meet';
58
59    if (vb0) {
60        svg.setAttribute('viewBox', vb0);
61       } else {
62         const b = svg.getBBox();
63    svg.setAttribute('viewBox', `${b.x} ${b.y} ${b.width} ${b.height}`);
64       }
65    svg.setAttribute('preserveAspectRatio', par0);
66      }
67
68    // KITA KONUM VE SCALE AYARLAYAN METOD:
69    function setContinentView(svgId, {
70        cx = 0.5,
71        cy = 0.5,
72        zoom = 1.0,
73        align = 'xMidYMid meet',
74        padding = 0,
75        overflowX = 0,
76        overflowY = 0
77    } = { }) {
78        const svg = document.getElementById(svgId);
79    if (!svg) return;
80
81    let vb = svg.getAttribute('viewBox');
82    if (!vb) {
83          const bbox = svg.getBBox();
84    vb = `${bbox.x} ${bbox.y} ${bbox.width} ${bbox.height}`;
85    svg.setAttribute('viewBox', vb);
86        }
87    let [minX, minY, vbW, vbH] = vb.trim().split(/\s+/).map(Number);
88
89    const winW = vbW / Math.max(zoom, 0.0001);
90    const winH = vbH / Math.max(zoom, 0.0001);
91
92    const centerX = minX + vbW * cx;
93    const centerY = minY + vbH * cy;
94
95    let newMinX = centerX - winW / 2;
96    let newMinY = centerY - winH / 2;
97
98    const overW = vbW * Math.max(0, overflowX);
99    const overH = vbH * Math.max(0, overflowY);
100
101    newMinX = clamp(newMinX, minX - overW, minX + vbW - winW + overW);
102    newMinY = clamp(newMinY, minY - overH, minY + vbH - winH + overH);
103
104        if (padding > 0) {
105          const padW = winW * padding;
106    const padH = winH * padding;
107    newMinX -= padW;
108    newMinY -= padH;
109    svg.setAttribute('viewBox',
110    `${to3(newMinX)} ${to3(newMinY)} ${to3(winW + padW * 2)} ${to3(winH + padH * 2)}`
111    );
112        } else {
113        svg.setAttribute('viewBox',
114            `${to3(newMinX)} ${to3(newMinY)} ${to3(winW)} ${to3(winH)}`
115        );
116        }
117
118    svg.setAttribute('preserveAspectRatio', align);
119
120    function clamp(v, a, b){ return Math.min(Math.max(v, a), b); }
121    function to3(n){ return Number.isFinite(n) ? n.toFixed(3) : n; }
122      }
123
124    const continentalMap = document.getElementById('continental-map');
125
126    const svg = Array.from(document.querySelectorAll('svg'))
127        .find(s => s.querySelector('path[class*="continent-"]'));
128    if (!svg) return;
129
130    // Çift tetiklemeyi ekstra güvene almak için basit dedupe
131    let lastStamp = 0;
132
133      // Yardımcılar
134      const getContinentClass = (el) =>
135        [...el.classList].find(c => c.startsWith('continent-')) || null;
136
137      const findPathFromAny = (el) => {
138        if (!el) return null;
139
140    if (el.tagName && el.tagName.toLowerCase() === 'polygon') {
141        let p = el.previousElementSibling;
142    while (p && p.tagName && p.tagName.toLowerCase() !== 'path') {
143        p = p.previousElementSibling;
144          }
145    return p || null;
146        }
147
148    if (el.tagName && el.tagName.toLowerCase() === 'path') return el;
149
150    const label = el.closest?.('text.continent-label');
151    if (label) {
152          const cls = getContinentClass(label);
153    if (cls) return svg.querySelector(`path.${CSS.escape(cls)}`);
154        }
155    return null;
156      };
157
158    function wireBackOnce(continentContainer, cdcContent, currentContinent,continentId){
159        const worldBackButton = document.getElementById('world-back');
160    if (!worldBackButton) return;
161        
162        const onBack = (e) => {
163        e?.preventDefault?.();
164    e?.stopPropagation?.();
165
166    // 1) Fade-out başlat (sadece opacity)
167    continentContainer.style.opacity = '0';
168    if (cdcContent) cdcContent.style.width = '0';
169
170          // 2) Opacity geçişi bitince width=0 (ve SVG'yi gizle)
171          const onEnd = (ev) => {
172            if (ev.target !== continentContainer || ev.propertyName !== 'opacity') return;
173    continentContainer.removeEventListener('transitionend', onEnd);
174    resetContinentView(continentId);
175    continentContainer.style.width = '0';
176    if (currentContinent) currentContinent.style.display = 'none';
177
178    // butonu devre dışı bırak (açarken tekrar 'auto' yap)
179    worldBackButton.style.pointerEvents = 'none';
180          };
181
182    // Geçiş varsa bekle; yoksa hemen uygula (fallback)
183    const cs = getComputedStyle(continentContainer);
184    const dur =
185    (cs.transitionProperty.includes('opacity') || cs.transitionProperty === 'all')
186            && (parseFloat(cs.transitionDuration) || 0) > 0;
187
188    if (dur) {
189        continentContainer.addEventListener('transitionend', onEnd);
190          } else {
191        continentContainer.style.width = '0';
192    if (currentContinent) currentContinent.style.display = 'none';
193    worldBackButton.style.pointerEvents = 'none';
194          }
195        };
196
197    // Tek seferlik bağla
198    worldBackButton.addEventListener('click', onBack, {once: true });

199      }
200
201    // Mobile Containera Scroll Yapma Metodu:
202    function scrollToMobileSwiperContent(){
203        const el = document.querySelector('.region-swiper-mobile');
204
205    el.scrollIntoView({
206        behavior: 'smooth', // yumuşak kayma
207    block: 'center'      // elemanın üstü, viewport’un üstüne hizalansın
208        });
209    }
210
211    function scrollBackMobileMap(){
212                const el = document.getElementById('region-section');
213
214    el.scrollIntoView({
215        behavior: 'smooth', // yumuşak kayma
216    block: 'center'      // elemanın üstü, viewport’un üstüne hizalansın
217            });
218    }
219
220    // --- Mobil geri butonu: #world-back-mobile
221    // Kullanım: wireBackOnceMobile(mobileRegionContainer, currentContinent, continentContainer);
222    function wireBackOnceMobile(mobileRegionContainer, currentContinent, continentContainer, continentId){
223        
224      const worldBackButtonMobile = document.getElementById('world-back-mobile');
225    if (!worldBackButtonMobile || !mobileRegionContainer) return;
226
227      const onBack = (e) => {
228        e?.preventDefault?.();
229    e?.stopPropagation?.();
230
231    // 0) Eğer height 'auto' ya da boşsa, kapanış animasyonunun başlayabilmesi için
232    //    mevcut yüksekliği px olarak sabitle (aksi halde transition tetiklenmez).
233    const curH = mobileRegionContainer.offsetHeight || mobileRegionContainer.scrollHeight || 0;
234    mobileRegionContainer.style.height = curH + 'px';
235    // reflow
236    void mobileRegionContainer.offsetHeight;
237
238    // 1) Kapanış animasyonlarını başlat
239    mobileRegionContainer.style.height = '0px'; // height transition
240    if (continentContainer) {
241        // opacity transition (CSS tarafında transition: opacity ... olmalı)
242        continentContainer.style.opacity = '0';
243        }
244
245        // 2) height transition bitince temizlik
246        const onEndHeight = (ev) => {
247          if (ev.target !== mobileRegionContainer || ev.propertyName !== 'height') return;
248    mobileRegionContainer.removeEventListener('transitionend', onEndHeight);
249
250    resetContinentView(continentId);
251
252    // Desktop konteynerini tamamen kapat
253    if (continentContainer) {
254        continentContainer.style.width = '0';
255          }
256    // Seçili kıta SVG’sini gizle
257    if (currentContinent) {
258        currentContinent.style.display = 'none';
259          }
260    // Butonu kilitle (yeniden açarken 'auto' yaparsın)
261    worldBackButtonMobile.style.pointerEvents = 'none';
262        };
263
264        // 3) Eğer opacity transition da dinlemek istiyorsan (opsiyonel):
265        //    Opacity bitmeden width=0 vermek istemiyorsan bu bloğu kullanabilirsin.
266        const onEndOpacity = (ev) => {
267          if (ev.target !== continentContainer || ev.propertyName !== 'opacity') return;
268    continentContainer.removeEventListener('transitionend', onEndOpacity);
269    // Ek bir şey yapman gerekirse buraya koy.
270    scrollBackMobileMap();
271        };
272
273    const csMobile = getComputedStyle(mobileRegionContainer);
274    const hasHTransition =
275    (csMobile.transitionProperty.includes('height') || csMobile.transitionProperty === 'all') &&
276          (parseFloat(csMobile.transitionDuration) || 0) > 0;
277
278    if (hasHTransition) {
279        mobileRegionContainer.addEventListener('transitionend', onEndHeight);
280        } else {
281          // Transition yoksa anında kapat
282          if (continentContainer) {
283        continentContainer.style.width = '0';
284          }
285    if (currentContinent) {
286        currentContinent.style.display = 'none';
287          }
288    worldBackButtonMobile.style.pointerEvents = 'none';
289        }
290
291    if (continentContainer) {
292          const csCont = getComputedStyle(continentContainer);
293    const hasOpacityTransition =
294    (csCont.transitionProperty.includes('opacity') || csCont.transitionProperty === 'all') &&
295            (parseFloat(csCont.transitionDuration) || 0) > 0;
296    if (hasOpacityTransition) {
297        continentContainer.addEventListener('transitionend', onEndOpacity, { once: true });
298          }
299        }
300      };
301
302    // Tek seferlik bağla
303    worldBackButtonMobile.addEventListener('click', onBack, {once: true });

304    }
305    const continentTitle = document.getElementById('desktop-continent-title');
306    //@* const countryTitle = document.getElementById('desktop-country-title'); *@
307    const continentMobileTitle = document.getElementById('mobile-continent-title');
308
309    // Kıta bazlı handler’lar (AYNEN)
310    const HANDLERS = {
311        'continent-af': () => {
312          //const currentContinent = document.getElementById('alone-continent-af');
313          //const worldBackButton = document.getElementById('world-back');
314
315          //switch( window.uiLang ){
316          //  case 'tr':
317          //      continentTitle.textContent = 'AFRÄ°KA';
318          //      continentMobileTitle.textContent = 'AFRÄ°KA';
319          //  break;
320          //  case "en":
321          //      continentTitle.textContent = 'AFRICA';
322          //      continentMobileTitle.textContent = 'AFRICA';
323          //  break;
324          //  default:
325          //      continentTitle.textContent = 'AFRICA';
326          //      continentMobileTitle.textContent = 'AFRICA';
327          //  break;
328          //}
329
330          //const worldBackButtonMobile = document.getElementById('world-back-mobile');
331          //const cdcContent = document.getElementById('cdc-content');
332          //const continentContainer = document.getElementById('continent-detail-container');
333          //const mobileRegionContainer = document.getElementById('cdc-mobile-container');
334          //setRegionSlidesFor('af');
335          //setRegionSlidesForMobile('af');
336          //initContinentViewState('alone-continent-af');
337
338          //if( window.IS_DESKTOP && window.innerWidth >= 991 ){
339
340          //setContinentView('alone-continent-af', {
341          //  cx: 0.9, cy: 0.57, zoom: 1.8, align: 'xMidYMid meet', padding: 0.04
342          //});
343
344          //currentContinent.style.display = 'block';
345          //cdcContent.style.width = '65%';
346          //continentContainer.style.width = '100%';
347          //continentContainer.style.opacity = '1';
348
349
350          //worldBackButton.style.pointerEvents = 'auto';
351          //wireBackOnce(continentContainer, cdcContent,currentContinent,'alone-continent-af');
352
353          //}else{
354
355          //  setContinentView('alone-continent-af', {
356          //    cx: 0.52, cy: 0.57, zoom: 1.8, align: 'xMidYMid meet', padding: 0.04
357          //  });
358
359          //  mobileRegionContainer.style.height = '0px';
360
361          //  const fullH = mobileRegionContainer.scrollHeight;
362
363          //  // Reflow al -> sonra hedef yüksekliğe animasyonla
364          //  requestAnimationFrame(() => {
365          //      requestAnimationFrame(() => {
366          //          mobileRegionContainer.style.height = 400 + 'px';
367          //      });
368          //  });
369
370          //  // Animasyon bitince height'i 'auto'ya al (sonraki içerik değişimleri için)
371          //  const onOpenEnd = (ev) => {
372          //    if (ev.target !== mobileRegionContainer || ev.propertyName !== 'height') return;
373          //    mobileRegionContainer.removeEventListener('transitionend', onOpenEnd);
374          //    mobileRegionContainer.style.height = 'auto';
375          //    scrollToMobileSwiperContent();
376          //  };
377          //  mobileRegionContainer.addEventListener('transitionend', onOpenEnd, {once: true });
378          //  continentContainer.style.width = '100%';
379          //  continentContainer.style.opacity = '1';
380          //  currentContinent.style.display = 'block';
381          //  worldBackButtonMobile.style.pointerEvents = 'auto';
382          //  wireBackOnceMobile(mobileRegionContainer, currentContinent, continentContainer,'alone-continent-af');
383
384            //}
385
386            // Africa filtresiyle aç
387            window.location.href = "/projects?filter=africa";
388
389          
390        },
391        'continent-as': () => {
392
393        //    switch( window.uiLang ){
394        //      case 'tr':
395        //      continentTitle.textContent = 'ASYA';
396        //      continentMobileTitle.textContent = 'ASYA';
397        //      break;
398        //      case "en":
399        //      continentTitle.textContent = 'ASIA';
400        //      continentMobileTitle.textContent = 'ASIA';
401        //      break;
402        //      default:
403        //      continentTitle.textContent = 'ASIA';
404        //      continentMobileTitle.textContent = 'ASIA';
405        //      break;
406        //    }
407
408        //    const currentContinent = document.getElementById('alone-continent-as');
409        //    const worldBackButton = document.getElementById('world-back');
410        //    const mobileRegionContainer = document.getElementById('cdc-mobile-container');
411        //    const worldBackButtonMobile = document.getElementById('world-back-mobile');
412        //    const cdcContent = document.getElementById('cdc-content');
413        //    const continentContainer = document.getElementById('continent-detail-container');
414        //    setRegionSlidesFor('as');
415        //    setRegionSlidesForMobile('as');

416        //    initContinentViewState('alone-continent-as');
417
418        //    if( window.IS_DESKTOP && window.innerWidth >= 991 ){
419
420        //    setContinentView('alone-continent-as', {
421        //        cx: 1.6, cy: 0.3, zoom: 1.4, padding: 0.04, overflowX: 0.27, overflowY: 0.27
422        //    });
423
424        //    currentContinent.style.display = 'block';
425        //    cdcContent.style.width = '52%';
426        //    continentContainer.style.width = '100%';
427        //    continentContainer.style.opacity = '1';
428
429        //    worldBackButton.style.pointerEvents = 'auto';
430        //    wireBackOnce(continentContainer, cdcContent,currentContinent,'alone-continent-as');
431
432        //  }else{
433
434        //  setContinentView('alone-continent-as', {
435        //      cx: 0.70, cy: 0.37, zoom: 1.5, align: 'xMidYMid meet', padding: 0.04, overflowX: 0.27, overflowY: 0.27
436        //  });
437
438        //  mobileRegionContainer.style.height = '0px';
439
440        //  const fullH = mobileRegionContainer.scrollHeight;
441
442        //  // Reflow al -> sonra hedef yüksekliğe animasyonla
443        //  requestAnimationFrame(() => {
444        //  requestAnimationFrame(() => {
445        //    mobileRegionContainer.style.height = 400 + 'px';
446        //  });
447        //});
448
449        //      // Animasyon bitince height'i 'auto'ya al (sonraki içerik değişimleri için)
450        //      const onOpenEnd = (ev) => {
451        //        if (ev.target !== mobileRegionContainer || ev.propertyName !== 'height') return;
452        //      mobileRegionContainer.removeEventListener('transitionend', onOpenEnd);
453        //      mobileRegionContainer.style.height = 'auto';
454        //      scrollToMobileSwiperContent();
455        //                };
456        //      mobileRegionContainer.addEventListener('transitionend', onOpenEnd, {once: true });
457
458        //      continentContainer.style.width = '100%';
459        //      continentContainer.style.opacity = '1';
460        //      currentContinent.style.display = 'block';
461        //      worldBackButtonMobile.style.pointerEvents = 'auto';
462        //      wireBackOnceMobile(mobileRegionContainer, currentContinent, continentContainer,'alone-continent-as');
463
464            //  }
465
466            // Africa filtresiyle aç
467            window.location.href = "/projects?filter=asia";
468
469        },
470        'continent-eu': () => {
471
472          //  switch( window.uiLang ){
473          //    case 'tr':
474          //  continentTitle.textContent = 'AVRUPA';
475          //  continentMobileTitle.textContent = 'AVRUPA';
476          //  break;
477          //  case "en":
478          //  continentTitle.textContent = 'EUROPE';
479          //  continentMobileTitle.textContent = 'EUROPE';
480          //  break;
481          //  default:
482          //  continentTitle.textContent = 'EUROPE';
483          //  continentMobileTitle.textContent = 'EUROPE';
484          //  break;
485          //}
486
487          //const currentContinent = document.getElementById('alone-continent-eu');
488          //const worldBackButton = document.getElementById('world-back');
489          //const mobileRegionContainer = document.getElementById('cdc-mobile-container');
490          //const worldBackButtonMobile = document.getElementById('world-back-mobile');
491          //const cdcContent = document.getElementById('cdc-content');
492          //const continentContainer = document.getElementById('continent-detail-container');
493          //setRegionSlidesFor('eu');
494          //setRegionSlidesForMobile('eu');
495          //initContinentViewState('alone-continent-eu');
496
497          //if( window.IS_DESKTOP && window.innerWidth >= 991 ){
498
499          //setContinentView('alone-continent-eu', {
500          //    cx: 0.62, cy: 0.21, zoom: 3, padding: 0.04, overflowX: 0.5, overflowY: -0.37
501          //});
502
503          //currentContinent.style.display = 'block';
504          //cdcContent.style.width = '60%';
505          //continentContainer.style.width = '100%';
506          //continentContainer.style.opacity = '1';
507
508          //worldBackButton.style.pointerEvents = 'auto';
509          //wireBackOnce(continentContainer, cdcContent,currentContinent,'alone-continent-eu');
510
511          //}else{
512
513          //setContinentView('alone-continent-eu', {
514          //    cx: 0.51, cy: 0.21, zoom: 3.4, padding: 0.04, overflowX: 0.5, overflowY: -0.37
515          //});
516
517          //mobileRegionContainer.style.height = '0px';
518
519          //const fullH = mobileRegionContainer.scrollHeight;
520
521          //// Reflow al ->

521 sonra hedef yüksekliğe animasyonla
522          //requestAnimationFrame(() => {
523          // requestAnimationFrame(() => {
524          //     mobileRegionContainer.style.height = 400 + 'px';
525          // });
526          //});
527
528          //// Animasyon bitince height'i 'auto'ya al (sonraki içerik değişimleri için)
529          //const onOpenEnd = (ev) => {
530          //  if (ev.target !== mobileRegionContainer || ev.propertyName !== 'height') return;
531          //    mobileRegionContainer.removeEventListener('transitionend', onOpenEnd);
532          //    mobileRegionContainer.style.height = 'auto';
533          //    scrollToMobileSwiperContent();
534          //};
535          //mobileRegionContainer.addEventListener('transitionend', onOpenEnd, {once: true });
536
537          //continentContainer.style.width = '100%';
538          //continentContainer.style.opacity = '1';
539          //currentContinent.style.display = 'block';
540          //worldBackButtonMobile.style.pointerEvents = 'auto';
541          //wireBackOnceMobile(mobileRegionContainer, currentContinent, continentContainer,'alone-continent-eu');
542
543            //}
544
545            // Africa filtresiyle aç
546            window.location.href = "/projects?filter=europe";
547
548        },
549        'continent-na': () => {
550        //  switch( window.uiLang ){
551        //      case 'tr':
552        //  continentTitle.textContent = 'KUZEY AMERÄ°KA';
553        //  continentMobileTitle.textContent = 'KUZEY AMERÄ°KA';
554        //  break;
555        //  case "en":
556        //  continentTitle.textContent = 'NORTH AMERICA';
557        //  continentMobileTitle.textContent = 'NORTH AMERICA';
558        //  break;
559        //  default:
560        //  continentTitle.textContent = 'NORTH AMERICA';
561        //  continentMobileTitle.textContent = 'NORTH AMERICA';
562        //  break;
563        //}
564
565        ////@* countryTitle.textContent = ' - CANADA'; *@
566
567        //const currentContinent = document.getElementById('alone-continent-na');
568        //const worldBackButton = document.getElementById('world-back');
569        //const mobileRegionContainer = document.getElementById('cdc-mobile-container');
570        //const worldBackButtonMobile = document.getElementById('world-back-mobile');
571        //const cdcContent = document.getElementById('cdc-content');
572        //const continentContainer = document.getElementById('continent-detail-container');
573        //setRegionSlidesFor('na');
574        //setRegionSlidesForMobile('na');
575        //initContinentViewState('alone-continent-na');
576
577        //  if( window.IS_DESKTOP && window.innerWidth >= 991 ){
578
579        //    setContinentView('alone-continent-na', {
580        //        cx: 0.43, cy: 0.15, zoom: 1.7, padding: 0.04, overflowX: 0.5, overflowY: -0.37
581        //    });
582
583        //    currentContinent.style.display = 'block';
584        //    cdcContent.style.width = '62%';
585        //    continentContainer.style.width = '100%';
586        //    continentContainer.style.opacity = '1';
587
588        //    worldBackButton.style.pointerEvents = 'auto';
589        //    wireBackOnce(continentContainer, cdcContent,currentContinent,'alone-continent-na');
590
591        //  }else{
592
593        //    setContinentView('alone-continent-na', {
594        //        cx: 0.23, cy: 0.33, zoom: 2.1, padding: 0.04, overflowX: 0.5, overflowY: -0.8
595        //  });
596
597        //mobileRegionContainer.style.height = '0px';
598
599        //const fullH = mobileRegionContainer.scrollHeight;
600
601        //// Reflow al -> sonra hedef yüksekliğe animasyonla
602        //requestAnimationFrame(() => {
603        //  requestAnimationFrame(() => {
604        //      mobileRegionContainer.style.height = 400 + 'px';
605        //  });
606        //});
607
608        //// Animasyon bitince height'i 'auto'ya al (sonraki içerik değişimleri için)
609        //const onOpenEnd = (ev) => {
610        //if (ev.target !== mobileRegionContainer || ev.propertyName !== 'height') return;
611        //mobileRegionContainer.removeEventListener('transitionend', onOpenEnd);
612        //mobileRegionContainer.style.height = 'auto';
613        //scrollToMobileSwiperContent();
614        //};
615        //mobileRegionContainer.addEventListener('transitionend', onOpenEnd, {once: true });

616
617        // continentContainer.style.width = '100%';
618        // continentContainer.style.opacity = '1';
619        // currentContinent.style.display = 'block';
620        // worldBackButtonMobile.style.pointerEvents = 'auto';
621        // wireBackOnceMobile(mobileRegionContainer, currentContinent, continentContainer, 'alone-continent-na');
622
623        //  }
624
625            // Africa filtresiyle aç
626            window.location.href = "/projects?filter=north-america";
627
628        },
629        'continent-me': () => {
630
631          //  switch( window.uiLang ){
632          //    case 'tr':
633          //  continentTitle.textContent = 'ORTA DOĞU';
634          //  continentMobileTitle.textContent ='ORTA DOĞU';
635          //  break;
636          //  case "en":
637          //  continentTitle.textContent = 'MIDDLE EAST';
638          //  continentMobileTitle.textContent = 'MIDDLE EAST';
639          //  break;
640          //  default:
641          //  continentTitle.textContent = 'MIDDLE EAST';
642          //  continentMobileTitle.textContent = 'MIDDLE EAST';
643          //  break;
644          //}
645
646          //const currentContinent = document.getElementById('alone-continent-me');
647          //const worldBackButton = document.getElementById('world-back');
648          //const mobileRegionContainer = document.getElementById('cdc-mobile-container');
649          //const worldBackButtonMobile = document.getElementById('world-back-mobile');
650          //const cdcContent = document.getElementById('cdc-content');
651          //const continentContainer = document.getElementById('continent-detail-container');
652          //setRegionSlidesFor('me');
653          //setRegionSlidesForMobile('me');
654
655          //initContinentViewState('alone-continent-me');
656
657          //if( window.IS_DESKTOP && window.innerWidth >= 991 ){
658
659          //  setContinentView('alone-continent-me', {
660          //      cx: 0.71, cy: 0.41, zoom: 3.4, padding: 0.04, overflowX: 0.5, overflowY: -0.37
661          //  });
662
663          //  currentContinent.style.display = 'block';
664          //  cdcContent.style.width = '62%';
665          //  continentContainer.style.width = '100%';
666          //  continentContainer.style.opacity = '1';
667
668          //  worldBackButton.style.pointerEvents = 'auto';
669          //  wireBackOnce(continentContainer, cdcContent,currentContinent,'alone-continent-me');
670
671          //}else{
672
673          //  setContinentView('alone-continent-me', {
674          //      cx: 0.61, cy: 0.40, zoom: 4, padding: 0.04, overflowX: 0.5, overflowY: -0.37
675          //  });
676
677          //  mobileRegionContainer.style.height = '0px';
678
679          //  const fullH = mobileRegionContainer.scrollHeight;
680
681          //    // Reflow al -> sonra hedef yüksekliğe animasyonla
682          //    requestAnimationFrame(() => {
683          //      requestAnimationFrame(() => {
684          //        mobileRegionContainer.style.height = 400 + 'px';
685          //      });
686          //    });
687
688          //    // Animasyon bitince height'i 'auto'ya al (sonraki içerik değişimleri için)
689          //    const onOpenEnd = (ev) => {
690          //      if (ev.target !== mobileRegionContainer || ev.propertyName !== 'height') return;
691          //          mobileRegionContainer.removeEventListener('transitionend', onOpenEnd);
692          //          mobileRegionContainer.style.height = 'auto';
693          //          scrollToMobileSwiperContent();
694          //    };
695          //    mobileRegionContainer.addEventListener('transitionend', onOpenEnd, {once: true });
696
697          //    continentContainer.style.width = '100%';
698          //    continentContainer.style.opacity = '1';
699          //    currentContinent.style.display = 'block';
700          //    worldBackButtonMobile.style.pointerEvents = 'auto';
701          //    wireBackOnceMobile(mobileRegionContainer, currentContinent, continentContainer, 'alone-continent-me');
702
703          //}
704
705            // Africa filtresiyle aç
706            window.location.href = "/projects?filter=middle-east";
707
708        },
709
710        'continent-tr': () => {
711
712          //  switch( window.uiLang ){
713          //    case 'tr':
714          //  continentTitle.textContent = 'TÜRKİYE';
715          //  continentMobileTitle.textContent = 'TÜRKİYE';
716          //  break;
717          //  case "en":
718          //  continentTitle.textContent = 'TURKEY';
719          //  continentMobileTitle.textContent = 'TURKEY';
720          //  break;
721          //  default:
722          //  continentTitle.textContent = 'TURKEY';
723          //  continentMobileTitle.textContent = 'TURKEY';
724          //  break;
725          //}
726
727          //const currentContinent = document.getElementById('alone-continent-tr');
728          //const worldBackButton = document.getElementById('world-back');
729          //const mobileRegionContainer = document.getElementById('cdc-mobile-container');
730          //const worldBackButtonMobile = document.getElementById('world-back-mobile');
731          //const cdcContent = document.getElementById('cdc-content');
732          //const continentContainer = document.getElementById('continent-detail-container');
733          //setRegionSlidesFor('tr');
734          //setRegionSlidesForMobile('tr');
735
736          //initContinentViewState('alone-continent-tr');
737
738          //if( window.IS_DESKTOP && window.innerWidth >= 991 ){
739
740          //  setContinentView('alone-continent-tr', {
741          //      cx: 0.62, cy: 0.31, zoom: 6, padding: 0.04, overflowX: 0.5, overflowY: -0.37
742          //  });
743
744          //  currentContinent.style.display = 'block';
745          //  cdcContent.style.width = '50%';
746          //  continentContainer.style.width = '100%';
747          //  continentContainer.style.opacity = '1';
748
749          //  worldBackButton.style.pointerEvents = 'auto';
750          //  wireBackOnce(continentContainer, cdcContent,currentContinent,'alone-continent-tr');
751
752          //}else{
753
754          //  setContinentView('alone-continent-tr', {
755          //      cx: 0.572, cy: 0.32, zoom: 10, padding: 0.04, overflowX: 0.5, overflowY: -0.37
756          //  });
757
758          //  mobileRegionContainer.style.height = '0px';
759
760          //  const fullH = mobileRegionContainer.scrollHeight;
761
762          //    // Reflow al ->

762 sonra hedef yüksekliğe animasyonla
763          //    requestAnimationFrame(() => {
764          //      requestAnimationFrame(() => {
765          //          mobileRegionContainer.style.height = 400 + 'px';
766          //      });
767          //    });
768
769          //    // Animasyon bitince height'i 'auto'ya al (sonraki içerik değişimleri için)
770          //    const onOpenEnd = (ev) => {
771          //      if (ev.target !== mobileRegionContainer || ev.propertyName !== 'height') return;
772          //  mobileRegionContainer.removeEventListener('transitionend', onOpenEnd);
773          //  mobileRegionContainer.style.height = 'auto';
774          //  scrollToMobileSwiperContent();
775          //            };
776          //  mobileRegionContainer.addEventListener('transitionend', onOpenEnd, {once: true });
777
778          //  continentContainer.style.width = '100%';
779          //  continentContainer.style.opacity = '1';
780          //  currentContinent.style.display = 'block';
781          //  worldBackButtonMobile.style.pointerEvents = 'auto';
782          //  wireBackOnceMobile(mobileRegionContainer, currentContinent, continentContainer, 'alone-continent-tr');
783
784            //}
785
786            // Africa filtresiyle aç
787            window.location.href = "/projects?filter=turkey";
788
789        },
790
791      };
792
793        // --- SAĞ TIK FİLTRESİ (İSİMLERİ DEĞİŞTİRMEDEN) ---
794        let primaryDown = false;
795
796        svg.addEventListener('pointerdown', (e) => {
797        // mouse: sadece sol tuş; dokunma/kalem: isPrimary
798        primaryDown = (e.pointerType === 'mouse') ? (e.button === 0) : e.isPrimary === true;
799      });
800
801      // Sadece pointerup dinle (tek tetik) — ama yalnızca birincil tuşsa
802      svg.addEventListener('pointerup', (e) => {
803        if (!primaryDown) return;            // sağ/orta tık görmezden gel
804      primaryDown = false;
805
806      if (!svg.contains(e.target)) return;
807
808      // Çift tetik koruması
809      if (e.timeStamp && Math.abs(e.timeStamp - lastStamp) < 200) return;
810      lastStamp = e.timeStamp || performance.now();
811      
812      e.preventDefault(); // synthesized click'i iptal
813
814      const hit = e.target.closest('.continent-hit, path[class*="continent-"], text.continent-label');
815      const pathEl = findPathFromAny(hit);
816      if (!pathEl) return;
817
818      const key = getContinentClass(pathEl);
819      if (!key) return;
820
821    HANDLERS[key]?.();
822      }, {passive: false });
823
824    // (İsteğe bağlı) Sağ tık menüsünü tamamen kapatmak istersen:
825    // svg.addEventListener('contextmenu', e => e.preventDefault());
826
827    const overlay = document.getElementById('overlaySvg');
828    if (overlay) overlay.style.pointerEvents = 'none';
829    });