MediaWiki:CommonTranslateUpdate.js

/* ======================= CommonTranslateUpdate.js (INTEGRAZIONE COMPLETA con proxy) ======================= */

console.log("🔄 Caricamento CommonTranslateUpdate.js...");

if (window.CommonTranslateUpdateLoaded) {
    console.warn("⚠️ CommonTranslateUpdate.js è già stato caricato.");
} else {
    window.CommonTranslateUpdateLoaded = true;
    window.linguaOrigine = localStorage.getItem("linguaOrigine") || document.documentElement.lang || "en";

    // 🔒 Niente più API key in chiaro → usiamo solo il cameriere
    window.OPENAI_PROXY_URL = "/dashboard/api/openai_project_gpt.php";

    console.log("✅ CommonTranslateUpdate.js caricato correttamente!");
}

/* ======================= Utility ======================= */
function stripMarkers(t) {
  return (t || "")
    .replace(/^\s*[-–—]*\s*(TESTO\s*INIZIO|TEXT\s*START)\s*[-–—]*\s*$/gmi, "")
    .replace(/^\s*[-–—]*\s*(TESTO\s*FINE|TEXT\s*END)\s*[-–—]*\s*$/gmi, "")
    .replace(/---\s*(TESTO\s*INIZIO|TEXT\s*START)\s*---/gi, "")
    .replace(/---\s*(TESTO\s*FINE|TEXT\s*END)\s*---/gi, "")
    .trim();
}

const HEADER_RE = /^={2,5}\s*([^=]+?)\s*={2,5}\s*$/;
const isBiblioHeader = (s) =>
  /^={2,5}\s*(bibliography|references|riferimenti)\b/i.test((s||"").trim());
const isListItem = (s) =>
  /^\s*(?:\d+\.\s+|[#*;:]+\s*)/.test(s||"");

/* ------- Segmentazione --------*/
function segmentaBloccoMediaWiki(wikitesto) {
  const blocchiProtetti = [
    /{{Tooltip\|[^{}]*?\|[^{}]*?\|<small>[\s\S]*?<\/small>\|?}}/g,
    /{{Tooltip\|(?:[^{}]|{{[^{}]*}}|<[^>]*>|\[\[[^\]]+\]\]|%%[^%]+%%)+}}/g,
    /<ref[^>]*>[\s\S]*?<\/ref>/g,
    /<math>[\s\S]*?<\/math>/g,
    /<gallery[\s\S]*?<\/gallery>/g,
    /{{(?:[^{}]|\{\{[^{}]*\}\})*}}/g
  ];
  let placeholderMap = {}, idx = 0;
  blocchiProtetti.forEach(rx => {
    wikitesto = wikitesto.replace(rx, m => {
      const key = `%%SEGMENTO_${idx++}%%`; placeholderMap[key] = m; return key;
    });
  });

  const parts = wikitesto.split(/\n(?=^={2,5}[^=\n]+={2,5}\s*$)/m);
  const out = [];

  parts.forEach(section => {
    Object.entries(placeholderMap).forEach(([k, v]) => { section = section.replaceAll(k, v); });
    out.push(section.trim());
  });

  return out.filter(Boolean);
}

/* ======================= Ripristina segmenti salvati ======================= */
function ripristinaSegmenti(text) {
    if (!window.segmentiSalvati) return text;
    return text.replace(/%%SEGMENTO_(\d+)%%/g, function(match, index) {
        const segmento = window.segmentiSalvati[parseInt(index)];
        return segmento ? segmento : match;
    });
}

/* ======================= AVVIO TRADUZIONE ======================= */
async function traduciTestoUpdate() {
    const conferma = confirm("⚡ Vuoi tradurre il capitolo?");
    if (!conferma) return;

    const linguaScelta = prompt("🌍 Scegli la lingua:\nit = Italiano\nen = Inglese\nfr = Francese\nes = Spagnolo\nde = Tedesco\ntutte = Tutte le lingue", "en");
    if (!linguaScelta) return;

    const lingue = ["it", "en", "fr", "es", "de"];
    const lingueDaTradurre = linguaScelta === "tutte" ? lingue : [linguaScelta];
    localStorage.setItem("lingueDaTradurre", JSON.stringify(lingueDaTradurre));

    verificaURLCapitoli(lingueDaTradurre);
}

function verificaURLCapitoli(lingueDaTradurre) {
    let formHtml = `<form id="urlForm">`;
    for (let lang of lingueDaTradurre) {
        formHtml += `
        <label for="url_${lang}">${lang.toUpperCase()}:</label>
        <input type="text" id="url_${lang}" value="${localStorage.getItem(`urlCapitolo_${lang}`) || ""}" style="width:100%;margin-bottom:5px;"><br>`;
    }
    formHtml += `</form>`;

    let popup = document.createElement("div");
    popup.innerHTML = `
    <div id="popup-url-traduzione" style="position:fixed; top:50%; left:50%; transform:translate(-50%, -50%);
         background:white; padding:20px; border-radius:10px; box-shadow:0px 4px 6px rgba(0,0,0,0.2); z-index:2000; font-family:Arial, sans-serif;">

        <h3>🔍 Imposta gli URL per la traduzione</h3>

        <p>
          🧠 <b>Parole:</b> <span id="conteggio-parole">0</span><br>
          🔢 <b>Token stimati:</b> <span id="conteggio-token">0</span><br>
          💰 <b>Costo stimato:</b> <span id="costo-stimato">$0.0000</span>
        </p>

        ${formHtml}

        <div style="margin-top:10px; text-align:right;">
          <button id="salvaUrlBtn" type="button">✅ Salva URL</button>
          <button id="chiudiPopup" type="button">❌ Annulla</button>
        </div>
    </div>
    `;

    document.body.appendChild(popup);

    const testo = ottieniTestoDaEditor();
    const parole = testo.trim().split(/\s+/).length;
    const tokenStimati = Math.ceil(parole / 0.75);
    const costo = (tokenStimati * 0.00002).toFixed(4);

    try {
        document.getElementById("conteggio-parole").innerText = parole;
        document.getElementById("conteggio-token").innerText = tokenStimati;
        document.getElementById("costo-stimato").innerText = `$${costo}`;
    } catch (e) {
        console.warn("⚠️ Conteggio parole/token non aggiornato:", e);
    }

    setTimeout(() => {
        const salvaBtn = document.getElementById("salvaUrlBtn");
        const chiudiBtn = document.getElementById("chiudiPopup");

        if (salvaBtn) {
            salvaBtn.onclick = function () {
                lingueDaTradurre.forEach(lang => {
                    const newUrl = document.getElementById(`url_${lang}`).value.trim();
                    localStorage.setItem(`urlCapitolo_${lang}`, newUrl);
                });
                document.body.removeChild(popup);
                avviaTraduzioneConSegmentazione(lingueDaTradurre);
            };
        }

        if (chiudiBtn) {
            chiudiBtn.onclick = function () {
                document.body.removeChild(popup);
            };
        }
    }, 100);
}

function avviaTraduzioneConSegmentazione(lingueDaTradurre) {
    const testo = ottieniTestoDaEditor();
    const blocchi = segmentaBloccoMediaWiki(testo);
    const errori = analizzaErroriSegmentazione(blocchi);
    sostituisciTestoSegmentato(blocchi, errori);
    mostraPopupConferma(blocchi, errori, lingueDaTradurre);
}

/*========= Errori ed invio ==========*/

function ottieniTestoDaEditor() {
    const area = document.getElementById("wpTextbox1");
    return area ? area.value.trim() : "";
}

function analizzaErroriSegmentazione(blocchi) {
    let errori = [];
    blocchi.forEach((b, i) => {
        let err = [];
        [["[", "]"], ["{", "}"], ["<", ">"]].forEach(([o, c]) => {
            const countO = (b.match(new RegExp(`\\${o}`, "g")) || []).length;
            const countC = (b.match(new RegExp(`\\${c}`, "g")) || []).length;
            if (countO !== countC) err.push(`${o}${c} non bilanciate`);
        });
        if (err.length) errori.push({ index: i + 1, dettagli: err });
    });
    return errori;
}

function sostituisciTestoSegmentato(blocchi, errori) {
    const area = document.getElementById("wpTextbox1");
    const finale = blocchi.map((b, i) => {
        const e = errori.find(x => x.index === i + 1);
        const evidenza = e ? `⚠️ ERRORI:\n- ${e.dettagli.join("\n- ")}\n\n` : "";
        return `${evidenza}🔹 BLOCCO ${i + 1}\n${b}`;
    });
    area.value = finale.join("\n\n==============================\n\n");
}

function mostraPopupConferma(blocchi, errori, lingueDaTradurre) {
    const popup = document.createElement("div");
    popup.style = `
        position: fixed;
        bottom: 20px;
        right: 20px;
        background: white;
        padding: 15px;
        border: 2px solid #444;
        box-shadow: 4px 4px 10px rgba(0,0,0,0.3);
        z-index: 9999;
        resize: both;
        overflow: auto;
        cursor: move;`;
    popup.innerHTML = `
        <b>✅ Segmentazione completata</b><br>
        🧠 Token stimati: ~${blocchi.length * 3000}<br>
        💰 Costo approssimativo: ~$${(blocchi.length * 3000 * 0.00002).toFixed(2)}<br>
        ${errori.length > 0
            ? `❗ <span style='color:red;'>${errori.length} errori rilevati. Procedere?</span><br>`
            : `<span style='color:green;'>✅ Nessun errore rilevato</span><br>`}
        <button id="btn-invia-traduzioni">✅ Invia Traduzioni</button>
        <button id="btn-salva-segmentato">💾 Salva localmente</button>
        <button onclick="this.parentNode.remove()">❌ Annulla</button>`;

    document.body.appendChild(popup);
    dragElement(popup);

    document.getElementById("btn-invia-traduzioni").onclick = () => {
        popup.remove();
        lingueDaTradurre.forEach(lang => inviaTraduzione(lang, blocchi));
    };

    document.getElementById("btn-salva-segmentato").onclick = () => {
        const testoSegmentato = document.getElementById("wpTextbox1").value.trim();
        localStorage.setItem("segmentatoDaInviare", testoSegmentato);
        alert("✅ Testo segmentato salvato localmente!");
    };
}

function ricostruisciTestoSegmentato(blocchi) {
    return blocchi.map(b => {
        return b.trim().match(/^={2,5}[^=]+={2,5}$/)
            ? `\n\n${b.trim()}\n\n`
            : b.trim();
    }).join("\n\n");
}

/* ======================= INVIO AL CAMERIERE (speciale bibliografia) ======================= */
async function inviaTraduzione(lingua, blocchi){
  const urlAPI = "https://staging.masticationpedia.org/api.php";
  const urlDest = localStorage.getItem(`urlCapitolo_${lingua}`);
  if (!urlDest) return;

  const tokenRes = await fetch(`${urlAPI}?action=query&meta=tokens&type=csrf&format=json`, { credentials: "include" });
  const tokenData = await tokenRes.json();
  const csrfToken = tokenData?.query?.tokens?.csrftoken;

  const tradotti = [];
  let insideBiblio = false;

  for (const b of blocchi) {
    const trimmed = (b || "").trim();

    if (HEADER_RE.test(trimmed)) {
      insideBiblio = isBiblioHeader(trimmed);
      tradotti.push(b); 
      continue;
    }

    if (insideBiblio && isListItem(trimmed)) {
      tradotti.push(b); 
      continue;
    }

    tradotti.push(await traduciBloccoProxy(b, lingua));
  }

  let testoTradotto = ricostruisciTestoSegmentato(tradotti);
  testoTradotto = ripristinaSegmenti(testoTradotto);
  testoTradotto = stripMarkers(testoTradotto);

  const form = new URLSearchParams();
  form.append("action", "edit");
  form.append("title", urlDest.split("/").pop());
  form.append("text", testoTradotto);
  form.append("format", "json");
  form.append("token", csrfToken);

  const resp = await fetch(urlAPI, {
    method: "POST",
    headers: { "Content-Type": "application/x-www-form-urlencoded" },
    body: form,
    credentials: "include"
  });
  const data = await resp.json();
  if (data?.edit?.result === "Success") {
    alert(`✅ Traduzione inviata con successo a: ${urlDest}`);
  } else {
    console.error("❌ Errore invio:", data);
  }
}

/* ======================= TRADUZIONE BLOCCO VIA CAMERIERE ======================= */
async function traduciBloccoProxy(blocco, lingua) {
    try {
        const res = await fetch(window.OPENAI_PROXY_URL, {
            method: "POST",
            headers: { "Content-Type": "application/json" },
            body: JSON.stringify({
                model: "gpt-4o",
                prompt: `Translate this MediaWiki text into ${lingua}. 
                Preserve ALL formatting, templates {{...}}, links [[...]], <math>, <ref>, etc.
                Do not add explanations, comments or change syntax.
                ${blocco}`
            })
        });
        const data = await res.json();
        if (data.status !== "ok") throw new Error(data.error || "Errore proxy");
        return stripMarkers(data.result);
    } catch (e) {
        console.error("❌ Traduzione fallita:", e);
        return "[Errore Traduzione]";
    }
}

function dragElement(elmnt) {
    let pos1 = 0, pos2 = 0, pos3 = 0, pos4 = 0;
    elmnt.onmousedown = dragMouseDown;
    function dragMouseDown(e) {
        e = e || window.event; e.preventDefault();
        pos3 = e.clientX; pos4 = e.clientY;
        document.onmouseup = closeDragElement;
        document.onmousemove = elementDrag;
    }
    function elementDrag(e) {
        e = e || window.event; e.preventDefault();
        pos1 = pos3 - e.clientX; pos2 = pos4 - e.clientY;
        pos3 = e.clientX; pos4 = e.clientY;
        elmnt.style.top = (elmnt.offsetTop - pos2) + "px";
        elmnt.style.left = (elmnt.offsetLeft - pos1) + "px";
    }
    function closeDragElement() {
        document.onmouseup = null;
        document.onmousemove = null;
    }
}