@net7/boilerplate-muruca 5.5.18 → 5.5.20

package/fesm2022/net7-boilerplate-muruca.mjs

@@ -2745,35 +2745,48 @@ class MrParallelTextViewerDS extends DataSource {
         // Attacca al primo caricamento
         document.addEventListener('pb-end-update', attachListeners);
         setTimeout(attachListeners, 500);
-        // Cross-highlight per termini multi-@ana: quando un pb-highlight con key "vox2_vox3"
-        // emette pb-highlight-on (hover sul termine o sulla tab aperta), ri-emettiamo pb-highlight-on
-        // per ogni token individuale ("vox2", "vox3") così i termini correlati si evidenziano.
+        // Cross-highlight per termini multi-@ana: quando un pb-highlight con doppia key emette pb-highlight-on 
+        //  ri-emette pb-highlight-on per ogni token individuale  così i termini correlati si evidenziano.
         document.addEventListener('pb-highlight-on', (ev) => {
             const key = ev.detail?.id;
             const channel = ev.detail?.key;
-            if (key && key.includes('_')) {
+            if (!key || !channel)
+                return;
+            // Chiave composita (multi-@ana "vox2_vox3", ancore paired "v1a1_v1a2"): spezza e ri-emetti per ogni token su highlight-channel.
+            if (key.includes('_')) {
                 key.split('_').forEach((token) => {
                     document.dispatchEvent(new CustomEvent('pb-highlight-on', {
                         detail: { key: channel, id: token, source: ev.detail.source },
                     }));
                 });
+                return;
             }
+            if (ev.detail?.source === 'paired-anchor')
+                return;
+            // Token singolo: se corrisponde a un'ancora paired ri-emette con l'id composito del popup per attivarne l'highlight.
+            document.querySelectorAll('[id$="-view"]').forEach((view) => {
+                if (!view.shadowRoot)
+                    return;
+                const popup = view.shadowRoot.querySelector(`.tei-app[data-from="${key}"]`)
+                    || view.shadowRoot.querySelector(`.tei-app[data-to="${key}"]`);
+                if (popup && popup.id) {
+                    document.dispatchEvent(new CustomEvent('pb-highlight-on', {
+                        detail: { key: channel, id: popup.id, source: 'paired-anchor' },
+                    }));
+                }
+            });
         });
     }
     onClick(payload) {
-        // console.log('🔵 onClick chiamato!', payload);
         let target = null;
         const clickPath = payload.path || payload.composedPath();
-        // console.log('🔵 clickPath:', clickPath);
         // chiusura apparato con tasto
         const closeButton = clickPath.find((el) => el.className
             && typeof el.className === 'string'
             && el.className.includes('close_app'));
         if (closeButton) {
-            //  console.log('Click rilevato sul bottone di chiusura:', closeButton);
             const parentAppItem = closeButton.closest('.tei-app');
             if (parentAppItem && parentAppItem.style) {
-                //    console.log('Chiusura dell\'elemento tei-app');
                 parentAppItem.style.display = 'none';
                 parentAppItem.style.transform = '';
                 this.resetHighlights();
@@ -2792,10 +2805,8 @@ class MrParallelTextViewerDS extends DataSource {
             && typeof el.className === 'string'
             && el.className.includes('close_note'));
         if (closeNoteButton) {
-            //  console.log('Click rilevato sul bottone di chiusura nota:', closeNoteButton);
             const parentNoteItem = closeNoteButton.closest('.note-item');
             if (parentNoteItem && parentNoteItem.style) {
-                //    console.log('Chiusura dell\'elemento note-item');
                 parentNoteItem.style.display = 'none';
                 parentNoteItem.style.transform = '';
                 this.resetHighlights();
@@ -2824,12 +2835,16 @@ class MrParallelTextViewerDS extends DataSource {
                     return;
                 }
                 if (view.shadowRoot) {
-                    const found = view.shadowRoot.querySelector(`[id="${appId}"]`);
+                    // Cerca prima per id esatto; se non trovato, cerca popup per ancora apertura (data-from)
+                    // o ancora di chiusura (data-to)
+                    const found = view.shadowRoot.querySelector(`[id="${appId}"]`)
+                        || view.shadowRoot.querySelector(`.tei-app[data-from="${appId}"]`)
+                        || view.shadowRoot.querySelector(`.tei-app[data-to="${appId}"]`);
                     if (found) {
                         if (!anchorElement) {
                             anchorElement = found;
                         }
-                        const appElement = found.closest('.tei-app');
+                        const appElement = found.closest('.tei-app') || (found.classList.contains('tei-app') ? found : null);
                         if (appElement && !teiAppElement) {
                             teiAppElement = appElement;
                         }
@@ -2842,18 +2857,6 @@ class MrParallelTextViewerDS extends DataSource {
                 const nestedCits = target.querySelectorAll('span.quote');
                 const isOuterCit = nestedCits.length > 0;
                 const segElements = target.querySelectorAll('.seg-outer-inner');
-                // console.log('[seg-outer-inner] click su:', target.getAttribute('key'), '| isOuterCit:', isOuterCit, '| seg trovati:', segElements.length, '| panel isVisible:', isVisible);
-                // console.log('  nestedCits keys:', Array.from(nestedCits).map((el) => el.getAttribute('key')));
-                // segElements.forEach((el, i) => {
-                //   console.log(`  seg[${i}] backgroundColor attuale: "${(el as HTMLElement).style.backgroundColor}"`);
-                //   let node = (el as HTMLElement).parentElement;
-                //   const chain = [];
-                //   while (node && chain.length < 6) {
-                //     chain.push(`${node.tagName}${node.className ? '.' + node.className.replace(/\s+/g, '.') : ''}${node.getAttribute('key') ? '[key=' + node.getAttribute('key').substring(0, 20) + ']' : ''}`);
-                //     node = node.parentElement;
-                //   }
-                //   console.log(`  seg[${i}] ancestors:`, chain.join(' > '));
-                // });
                 if (isVisible) {
                     teiAppElement.style.display = 'none';
                     teiAppElement.style.transform = '';
@@ -2862,7 +2865,6 @@ class MrParallelTextViewerDS extends DataSource {
                         // Pannello esterno chiuso: ripristina il background dei seg annidati
                         segElements.forEach((el) => {
                             el.style.backgroundColor = '';
-                            // console.log('  [outer CLOSE] seg backgroundColor → ""');
                         });
                     }
                 }
@@ -2880,7 +2882,6 @@ class MrParallelTextViewerDS extends DataSource {
                         requestAnimationFrame(() => {
                             segElements.forEach((el) => {
                                 el.style.backgroundColor = 'white';
-                                // console.log('  [outer OPEN rAF] seg backgroundColor → "white"');
                             });
                         });
                     }
@@ -2889,7 +2890,6 @@ class MrParallelTextViewerDS extends DataSource {
                         requestAnimationFrame(() => {
                             segElements.forEach((el) => {
                                 el.style.backgroundColor = '';
-                                // console.log('  [inner OPEN rAF] seg backgroundColor → ""');
                             });
                         });
                     }
@@ -2901,7 +2901,6 @@ class MrParallelTextViewerDS extends DataSource {
         }
         else if (target && target.getAttribute('type') === 'note_line') {
             const noteId = target.getAttribute('key');
-            // console.log('noteId', noteId);
             const clickedElementPosition = target.getBoundingClientRect().top;
             const apparatusView = document.querySelector('.n7-text-viewer #apparato-view');
             const anchorElement = apparatusView
@@ -7457,12 +7456,11 @@ class FacetMapDS extends DataSource {
         };
         this.getValue = () => this.value;
     }
-    transform({ links }) {
+    linksToMarkers(links) {
         const markers = [];
         links
             .filter((d) => d.args?.lat && d.args?.lon)
             .forEach((d) => {
-            // if a link has more than one corresponding marker
             if (Array.isArray(d.args.lat)) {
                 d.args.lat.forEach((element, i) => {
                     markers.push({
@@ -7476,7 +7474,6 @@ class FacetMapDS extends DataSource {
                 });
             }
             else {
-                // if a link has only one marker
                 markers.push({
                     coords: [+d.args.lat, +d.args.lon],
                     template: d.text,
@@ -7487,6 +7484,10 @@ class FacetMapDS extends DataSource {
                 });
             }
         });
+        return markers;
+    }
+    transform({ links }) {
+        const markers = this.linksToMarkers(links);
         const mapConfig = this.options?.libOptions;
         return {
             containerId: 'map-canvas',
@@ -7589,12 +7590,17 @@ class FacetMapDS extends DataSource {
             }));
             // update marker icons
             if (this.markerLayer) {
-                this.markerLayer.eachLayer((marker) => {
-                    const { id } = marker;
-                    const counter = links.find(({ payload }) => payload === id)?.counter || 0;
-                    marker.getPopup()._source.setIcon(this.getIcon(id, counter))
-                        .setZIndexOffset(this.getZindex(id, counter));
-                });
+                if (this.options.libOptions?.hideUnavailablePin) {
+                    this.buildMarkers(this.linksToMarkers(links));
+                }
+                else {
+                    this.markerLayer.eachLayer((marker) => {
+                        const { id } = marker;
+                        const counter = links.find(({ payload }) => payload === id)?.counter || 0;
+                        marker.getPopup()._source.setIcon(this.getIcon(id, counter))
+                            .setZIndexOffset(this.getZindex(id, counter));
+                    });
+                }
             }
             // ---
             this.update({