{{user_admin==false.start}}
<div style="padding:15px;border:1px solid #d9534f;background:#fff5f5;color:#a94442;font-family:Arial,Helvetica,sans-serif;">
  Der Bild-Extractor ist ausschließlich für Administratoren freigeschaltet.
</div>
{{user_admin==false.end}}


{{user_admin==true.start}}
<style>
.imgTool{width:100%;max-width:90vw;margin:10px 0;padding:20px;box-sizing:border-box;position:relative;background:#eee;border:4px double #383838;border-radius:9px;font-family:monospace}
.imgTool h3{margin:0 0 5px;font-size:18px}
.imgTool .hint{margin-bottom:10px;color:#555;font-size:13px;line-height:1.45}
.imgTool input{padding:5px}
#threadUrl{width:70%;margin-bottom:20px}
#minWidth{width:80px;margin:0 10px}
#imgCount{margin:5px 0;color:#444;font-size:14px}
.imgRow{display:flex;align-items:center;gap:10px;max-width:95vw;margin:6px 0;padding:7px 10px;position:relative;overflow:auto;background:#fff;border:1px solid #aaa}
.imgRow.currentPreview{background:#fffaf0;border:2px solid #f0ad4e}
.imgRow.securePreview{opacity:.7}
.imgPreviewBox{width:170px;min-width:170px;padding:5px;box-sizing:border-box;text-align:center;border:1px solid #777;transition:transform .3s .5s ease}
.imgPreviewBox:hover{transform:scale(1.03) translateY(-3px);box-shadow:0 12px 28px rgba(0,0,0,.25)}
.imgPreview{max-width:160px;max-height:120px;object-fit:contain;cursor:pointer}
.currentPreview .imgPreview{cursor:default}
.securePreview .imgPreview{cursor:not-allowed}
.imgMeta{min-width:0;overflow-wrap:anywhere}
.imgBadge{display:inline-block;margin:0 0 5px;padding:3px 7px;border-radius:4px;font:bold 12px Arial}
.imgBadge.current{background:#f0ad4e;color:#222}
.imgBadge.choose{background:#5cb85c;color:#fff}
.imgBadge.secure{background:#d9534f;color:#fff}
.zoomPreview{position:fixed;top:50%;left:50%;z-index:9999;margin-left:150px;padding:4px;opacity:0;pointer-events:none;background:#fff;border:1px solid #aaa;transform:translate(-50%,-50%);transition:opacity .3s .5s linear}
.zoomPreview img{max-width:calc(95vw - 300px);max-height:90vh;object-fit:contain}
.copyInfo{display:none;position:absolute;z-index:99999;margin:-20px 0 0 20px;padding:3px 6px;overflow:visible;background:#4caf50;color:#fff;border:1px solid #383838;border-radius:4px;font:bold 15px Arial}
#renderStatus{display:none;margin:8px 0;padding:7px 10px;background:#eef5ff;border:1px solid #b8cce6;font:13px Arial}
#pageNav{display:none;align-items:flex-end;margin-top:25px}
#pageNav button{margin:0 12px!important}
#pageInfo{margin:0 15px;padding:5px 12px 3px;white-space:nowrap;background:#fafafa;color:#444;border:5px double #ddd;border-radius:6px;font:bold 14px Arial}
#abortLoad{cursor:pointer;background:#fcc;color:#333;font-weight:bold}
#fnewRenderFrame{position:fixed!important;left:-20000px!important;top:-20000px!important;width:1280px!important;height:1000px!important;opacity:0!important;pointer-events:none!important;border:0!important}
.fnewSourceBar{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 14px;padding:10px;background:#fff;border:1px solid #c8c8c8;border-radius:7px}
.fnewSourceBar .btn{margin:0!important}
.fnewSourceNote{flex-basis:100%;margin-top:3px;color:#555;font:12px/1.4 Arial,Helvetica,sans-serif}
#fnewActionOverlay{display:none;position:fixed;inset:0;z-index:999999;padding:2vh 2vw;box-sizing:border-box;background:rgba(0,0,0,.66)}
#fnewActionOverlay.open{display:block}
.fnewActionWindow{display:flex;flex-direction:column;width:96vw;height:96vh;margin:0 auto;overflow:hidden;background:#fff;border-radius:10px;box-shadow:0 16px 55px rgba(0,0,0,.45)}
.fnewActionHead{display:flex;align-items:center;gap:8px;padding:9px 10px;background:#022d5e;color:#fff;font-family:Arial,Helvetica,sans-serif}
.fnewActionHead strong{flex:1;font-size:15px}
.fnewActionHead button{margin:0!important;white-space:nowrap}
#fnewActionHint{padding:7px 10px;background:#fff8df;color:#333;border-bottom:1px solid #e3d5a4;font:13px/1.45 Arial,Helvetica,sans-serif}
#fnewActionFrame{width:100%;flex:1;min-height:0;background:#fff;border:0}
#fnewGalleryUseBtn{display:none}
#fnewGallerySelection{display:none;padding:5px 10px;overflow-wrap:anywhere;background:#eef8ee;border-bottom:1px solid #bcdcbc;font:12px/1.35 Arial,Helvetica,sans-serif}
#fnewXoborTransfer{display:none;padding:10px;background:#f5f7fa;border-bottom:1px solid #cfd6df;font-family:Arial,Helvetica,sans-serif}
#fnewXoborTransfer.open{display:block}
.fnewTransferTitle{margin:0 0 7px;color:#333;font:bold 13px Arial,Helvetica,sans-serif}
.fnewTransferRow{display:flex;flex-wrap:wrap;align-items:center;gap:7px}
#fnewXoborUrlInput{flex:1 1 420px;min-width:220px;padding:8px 10px;background:#fff2f2;border:2px solid #d9534f;border-radius:5px;box-shadow:inset 0 0 0 1px rgba(217,83,79,.08);font:12px Arial,Helvetica,sans-serif}
#fnewXoborUrlInput:focus{outline:none;background:#fff7f7;border-color:#c9302c;box-shadow:0 0 0 3px rgba(217,83,79,.18)}
#fnewXoborUrlInput::placeholder{color:#a94442;opacity:1}
#fnewClipboardBtn,#fnewUseXoborUrlBtn{white-space:nowrap}
#fnewTransferState{margin-top:6px;color:#555;font:12px Arial,Helvetica,sans-serif}
@media(max-width:900px){.fnewSourceBar{display:grid;grid-template-columns:1fr}
.fnewSourceBar .btn{width:100%}
#fnewActionOverlay{padding:0}
.fnewActionWindow{width:100vw;height:100vh;border-radius:0}
.fnewActionHead{flex-wrap:wrap}
.fnewActionHead strong{flex-basis:100%}
#threadUrl{width:100%}
.imgTool{max-width:100%;padding:12px}
.imgRow{max-width:100%;align-items:flex-start}
.imgPreviewBox{width:145px;min-width:145px}
.imgPreview{max-width:135px;max-height:105px}
.zoomPreview{display:none}
#imgList a{display:none}
}
</style>


<div class="imgTool">
  <h3><b>Der Forum Bild-URL-Extraktor</b></h3>
  <div class="hint">
    • Es werden die Bilder des Themas gesucht und angezeigt.<br>
    • Das derzeit verwendete Vorschaubild wird als <b>„Aktuelles Vorschaubild“</b> markiert.<br>
    • Klickst du auf ein anderes Bild, wird dieses beim Bearbeiten des ersten Beitrags als neues Vorschaubild übernommen.<br>
    • Die gewünschte Mindestbreite kann jederzeit angepasst werden.<br>
    • Temporäre <code>/secure/</code>-Adressen können nicht als Vorschaubild gewählt werden.
  </div>
  <div class="fnewSourceBar">
    <button type="button" id="fnewUploadComputerBtn" class="btn btn-primary btn-sm">
      &#128228; Xobor-Bilder – hochladen / auswählen
    </button>
    <button type="button" id="fnewGalleryBtn" class="btn btn-secondary btn-sm">
      &#128444; Xobor-Bilder / Galerie
    </button>
    <button type="button" id="fnewRescanBtn" class="btn btn-secondary btn-sm">
      ↻ Thema neu durchsuchen
    </button>
    <div class="fnewSourceNote">
      „Xobor-Bilder“ öffnet direkt die Admin-Bilderverwaltung <code>/admin/fileupload.php</code>.
      Nach dem Upload kopierst du dort den von Xobor erzeugten Link bzw. HTML-Code „Bild im Forum einfügen“.
      Der Extractor übernimmt daraus automatisch die richtige Bildadresse.
      Die normale Xobor-Galerie bleibt zusätzlich verfügbar.
    </div>
  </div>
  <input id="threadUrl" placeholder="URL eingeben…">
  Mindestbreite:
  <input id="minWidth" type="number" value="100" min="0" title="Mindestbreite in Pixel">
  <button id="searchImagesBtn" class="btn btn-primary btn-sm">
    <i class="fa fa-image"></i> Bilder suchen
  </button>
  <br><br>
  <div id="renderStatus"></div>
  <div id="imgCount">Gefundene Bilder: 0</div>
  <div id="imgList"></div>
  <div id="pageNav">
    <button id="prevPageBtn" class="btn btn-secondary">Zurück</button>
    <div id="pageInfo"></div>
    <button id="nextPageBtn" class="btn btn-primary">Weiter</button>
  </div>
</div>
<div id="zoomBox" class="zoomPreview"></div>
<div id="copyInfo" class="copyInfo">Bild wird als neues Vorschaubild übernommen …</div>
<iframe id="fnewRenderFrame" aria-hidden="true"></iframe>
<div id="fnewActionOverlay" aria-hidden="true">
  <div class="fnewActionWindow" role="dialog" aria-modal="true">
    <div class="fnewActionHead">
      <strong id="fnewActionTitle">Xobor</strong>
      <button type="button" id="fnewGalleryUseBtn" class="btn btn-success btn-sm">Dieses Bild übernehmen</button>
      <button type="button" id="fnewOpenTabBtn" class="btn btn-secondary btn-sm">In neuem Tab</button>
      <button type="button" id="fnewActionCloseBtn" class="btn btn-danger btn-sm">Schließen</button>
    </div>
    <div id="fnewActionHint"></div>
    <div id="fnewGallerySelection"></div>
    <div id="fnewXoborTransfer">
      <div class="fnewTransferTitle">Xobor-Link übernehmen</div>
      <div class="fnewTransferRow">
        <input id="fnewXoborUrlInput"
               type="text"
               placeholder="Hier Xobor-Link oder HTML-Code »Bild im Forum einfügen« einfügen …">
        <button type="button" id="fnewClipboardBtn" class="btn btn-secondary btn-sm">
          &#128203; Aus Zwischenablage
        </button>
        <button type="button" id="fnewUseXoborUrlBtn" class="btn btn-success btn-sm">
          Bild übernehmen
        </button>
      </div>
      <div id="fnewTransferState">
        Nach dem Upload bei Xobor den Link bzw. den HTML-Code „Bild im Forum einfügen“ kopieren.
        Danach hier „Aus Zwischenablage“ anklicken.
      </div>
    </div>
    <iframe id="fnewActionFrame" title="Xobor Bildauswahl"></iframe>
  </div>
</div>


<script>
(() => {
"use strict";
const $ = id => document.getElementById(id);
const tool = document.querySelector(".imgTool");
const threadUrl = $("threadUrl");
const minWidth = $("minWidth");
const searchBtn = $("searchImagesBtn");
const imgCount = $("imgCount");
const imgList = $("imgList");
const zoomBox = $("zoomBox");
const copyInfo = $("copyInfo");
const renderStatus = $("renderStatus");
const renderFrame = $("fnewRenderFrame");
const pageNav = $("pageNav");
const pageInfo = $("pageInfo");
const prevBtn = $("prevPageBtn");
const nextBtn = $("nextPageBtn");
const uploadBtn = $("fnewUploadComputerBtn");
const galleryBtn = $("fnewGalleryBtn");
const rescanBtn = $("fnewRescanBtn");
const actionOverlay = $("fnewActionOverlay");
const actionFrame = $("fnewActionFrame");
const actionTitle = $("fnewActionTitle");
const actionHint = $("fnewActionHint");
const actionCloseBtn = $("fnewActionCloseBtn");
const openTabBtn = $("fnewOpenTabBtn");
const galleryUseBtn = $("fnewGalleryUseBtn");
const gallerySelection = $("fnewGallerySelection");
const xoborTransfer = $("fnewXoborTransfer");
const xoborUrlInput = $("fnewXoborUrlInput");
const clipboardBtn = $("fnewClipboardBtn");
const useXoborUrlBtn = $("fnewUseXoborUrlBtn");
const transferState = $("fnewTransferState");
const PAGE_SIZE = 100;
let stopLoading = false;
let visibleImages = [];
let currentPage = 1;
let currentPreviewUrl = "";
let sourceThreadUrl = "";
let actionMode = "";
let actionUrl = "";
let gallerySelectedUrl = "";
const setStatus = text => {
  renderStatus.textContent = text || "";
  renderStatus.style.display = text ? "block" : "none";
};
const setBusy = busy => {
  if (tool) tool.style.backgroundColor = busy ? "#fffbd5" : "";
};
const stripResize = value => String(value || "")
  .trim()
  .replace(/\/resize\/\d+x\d+\//gi, "/")
  .replace(/\/thumbs\//gi, "/");
const absoluteUrl = (value, base = location.href) => {
  value = String(value || "").trim();
  if (!value || value.startsWith("data:")) return value;
  try { return new URL(value, base).href; }
  catch { return ""; }
};
const isSecure = url => /\/secure(?:\/|$)/i.test(String(url || ""));
const blacklist = [
  "/static/smileys/","a_icon","f46t","base64","/feed","favicon",
  "spacer.","pixel.","blank.","/avatar/","avatar_default",
  "forum_topic","forum_message"
];
const isBlacklisted = url => {
  const lower = String(url || "").toLowerCase();
  return blacklist.some(entry => lower.includes(entry.toLowerCase()));
};
const looksLikeImageUrl = url => {
  const s = String(url || "");
  return /\.(?:jpe?g|png|gif|webp|bmp|avif)(?:[?#].*)?$/i.test(s) ||
         /files\.homepagemodules\.de/i.test(s) ||
         /homepagemodules\.de\/.*(?:image|img|upload|file)/i.test(s);
};
const srcsetFirst = value =>
  (String(value || "").split(",")[0]?.trim() || "").split(/\s+/)[0] || "";
const imageCandidates = (img, base) => [
  img.getAttribute("data-original"),
  img.getAttribute("data-src"),
  img.getAttribute("data-lazy-src"),
  img.getAttribute("data-url"),
  srcsetFirst(img.getAttribute("srcset")),
  img.getAttribute("src")
]
  .map(v => absoluteUrl(v, base))
  .map(stripResize)
  .filter(Boolean);
const imageKey = url => stripResize(url)
  .replace(/^https?:/i, "")
  .replace(/[?#].*$/, "");
const sameImage = (a, b) => !!a && !!b && imageKey(a) === imageKey(b);
function addUnique(map, rawUrl, base, meta = {}) {
  const url = stripResize(absoluteUrl(rawUrl, base));
  if (!url || isBlacklisted(url)) return;
  const key = imageKey(url);
  if (!key) return;
  const old = map.get(key);
  if (old) {
    old.current ||= !!meta.current;
    old.secure ||= isSecure(url);
    return;
  }
  map.set(key, {
    url,
    current: !!meta.current,
    secure: isSecure(url)
  });
}
function extractFromDocument(doc, baseUrl) {
  const found = new Map();
  if (!doc) return found;
  const selectors = [
    ".mtext",".message",".message_content",".messageContent",
    ".postbody",".post_body",".thread_message",
    "[id^='post_']","[id^='post'] .mtext",
    ".attachments",".attachment",".messageAttachments",
    ".messageattachments","[class*='attach']"
  ];
  let containers = [...doc.querySelectorAll(selectors.join(","))];
  if (!containers.length && doc.body) containers = [doc.body];
  containers.forEach(container => {
    container.querySelectorAll("img").forEach(img => {
      const current = img.classList.contains("fnewImg");
      imageCandidates(img, baseUrl).forEach(url =>
        addUnique(found, url, baseUrl, {current})
      );
      const link = img.closest("a[href]");
      const href = link ? absoluteUrl(link.getAttribute("href"), baseUrl) : "";
      if (looksLikeImageUrl(href)) {
        addUnique(found, href, baseUrl, {current});
      }
    });
    container.querySelectorAll("a[href]").forEach(link => {
      const href = absoluteUrl(link.getAttribute("href"), baseUrl);
      if (looksLikeImageUrl(href)) addUnique(found, href, baseUrl);
    });
  });
  return found;
}
const extractFromHtml = (html, baseUrl) =>
  extractFromDocument(
    new DOMParser().parseFromString(html, "text/html"),
    baseUrl
  );
function mergeMaps(...maps) {
  const out = new Map();
  maps.forEach(map => map?.forEach((item, key) => {
    const old = out.get(key);
    if (!old) {
      out.set(key, {...item});
    } else {
      old.current ||= item.current;
      old.secure ||= item.secure;
    }
  }));
  return out;
}
function loadRenderedDocument(url) {
  return new Promise(resolve => {
    if (!renderFrame || stopLoading) return resolve(null);
    let finished = false;
    const done = doc => {
      if (finished) return;
      finished = true;
      clearTimeout(timer);
      renderFrame.onload = null;
      resolve(doc || null);
    };
    const timer = setTimeout(() => done(null), 9000);
    renderFrame.onload = () => {
      setTimeout(() => {
        try { done(renderFrame.contentDocument); }
        catch { done(null); }
      }, 900);
    };
    try { renderFrame.src = url; }
    catch { done(null); }
  });
}
function buildPageUrls(firstUrl) {
  const urls = [firstUrl];
  if (/\.html(?:[?#].*)?$/i.test(firstUrl)) {
    for (let p = 1; p < 10; p++) {
      urls.push(firstUrl.replace(/\.html(?=([?#].*)?$)/i, `-${p}.html`));
    }
  }
  return [...new Set(urls)];
}
function checkImage(item, minW) {
  if (stopLoading) return Promise.resolve(null);
  const clean = stripResize(item.url);
  return new Promise(resolve => {
    const img = new Image();
    img.decoding = "async";
    img.onload = () => {
      resolve(
        img.naturalWidth >= minW
          ? {...item, url: clean, w: img.naturalWidth, h: img.naturalHeight}
          : null
      );
    };
    img.onerror = () => resolve(null);
    img.src = item.url;
  });
}
async function checkImages(items, minW) {
  let index = 0;
  const result = [];
  const workers = Math.min(16, Math.max(4, Math.ceil(items.length / 40)));
  async function worker() {
    while (index < items.length && !stopLoading) {
      const item = items[index++];
      const checked = await checkImage(item, minW);
      if (checked) result.push(checked);
    }
  }
  await Promise.all(Array.from({length: workers}, worker));
  visibleImages = result;
}
function createRow(item) {
  const clean = stripResize(item.url);
  const row = document.createElement("div");
  const current = item.current || sameImage(clean, currentPreviewUrl);
  row.className = "imgRow";
  if (current) row.classList.add("currentPreview");
  if (item.secure) row.classList.add("securePreview");
  const badge = item.secure
    ? '<span class="imgBadge secure">Temporärer Secure-Link – nicht auswählbar</span>'
    : current
      ? '<span class="imgBadge current">Aktuelles Vorschaubild</span>'
      : '<span class="imgBadge choose">Als neues Vorschaubild wählen</span>';
  row.innerHTML = `
    <div class="imgPreviewBox">
      <img src="${clean}" class="imgPreview" alt="">
    </div>
    <div class="imgMeta">
      ${badge}<br>
      <a href="${clean}" target="_blank" rel="noopener">${clean}</a><br>
      <span style="color:#667;"><b>${item.w}×${item.h}px</b></span>
    </div>
  `;
  const img = row.querySelector(".imgPreview");
  img.onmouseenter = () => {
    zoomBox.innerHTML = `<img src="${clean}" alt="">`;
    zoomBox.style.opacity = "1";
  };
  img.onmouseleave = () => {
    zoomBox.style.opacity = "0";
    zoomBox.replaceChildren();
  };
  if (!current && !item.secure) {
    img.onclick = e => chooseImage(clean, e);
  }
  return row;
}
function renderPage() {
  const total = Math.max(1, Math.ceil(visibleImages.length / PAGE_SIZE));
  const start = (currentPage - 1) * PAGE_SIZE;
  const frag = document.createDocumentFragment();
  visibleImages
    .slice(start, start + PAGE_SIZE)
    .forEach(item => frag.appendChild(createRow(item)));
  imgList.replaceChildren(frag);
  prevBtn.style.display = currentPage > 1 ? "inline-block" : "none";
  nextBtn.style.display = currentPage < total ? "inline-block" : "none";
  pageInfo.textContent = `Seite ${currentPage} von ${total}`;
  pageNav.style.display = visibleImages.length ? "flex" : "none";
}
prevBtn.onclick = () => {
  if (currentPage > 1) {
    currentPage--;
    renderPage();
  }
};
nextBtn.onclick = () => {
  if (currentPage < Math.ceil(visibleImages.length / PAGE_SIZE)) {
    currentPage++;
    renderPage();
  }
};
async function getFirstPostEditUrl() {
  const url = new URLSearchParams(location.search).get("url") || sourceThreadUrl;
  if (!url) throw new Error("Keine Themen-URL vorhanden.");
  const html = await fetch(url, {
    credentials: "same-origin",
    cache: "default"
  }).then(r => r.text());
  const doc = new DOMParser().parseFromString(html, "text/html");
  const parsed = new URL(url, location.href);
  const ids = parsed.pathname.match(/t(\d+)f(\d+)/);
  const thread = ids?.[1];
  const forum = ids?.[2];
  if (!forum || !thread) {
    throw new Error("Thread- und Forum-ID konnten nicht ermittelt werden.");
  }
  const start =
    doc.querySelector('#post1 [id^="post_"]') ||
    doc.querySelector('#post1 a[name^="msg"]') ||
    doc.querySelector('[id^="post_"]') ||
    doc.querySelector('a[name^="msg"]');
  const msg =
    start?.id?.replace("post_", "") ||
    start?.name?.replace("msg", "");
  if (!msg) {
    throw new Error("Die Beitrags-ID des ersten Beitrags konnte nicht ermittelt werden.");
  }
  return `/msg.php?forum=${encodeURIComponent(forum)}&Thread=${encodeURIComponent(thread)}&msg=${encodeURIComponent(msg)}`;
}
function resetTransferState() {
  if (xoborTransfer) xoborTransfer.classList.remove("open");
  if (xoborUrlInput) xoborUrlInput.value = "";
  if (transferState) {
    transferState.style.color = "#555";
    transferState.textContent =
      'Nach dem Upload bei Xobor den Link bzw. den HTML-Code „Bild im Forum einfügen“ kopieren. Danach hier „Aus Zwischenablage“ anklicken.';
  }
}
function closeActionModal(rescan = false) {
  actionOverlay.classList.remove("open");
  actionOverlay.setAttribute("aria-hidden", "true");
  try { actionFrame.src = "about:blank"; } catch {}
  actionMode = "";
  actionUrl = "";
  gallerySelectedUrl = "";
  galleryUseBtn.style.display = "none";
  gallerySelection.style.display = "none";
  gallerySelection.textContent = "";
  resetTransferState();
  if (rescan) setTimeout(loadImages, 250);
}
function openActionModal(mode, url, title, hint) {
  actionMode = mode;
  actionUrl = url;
  gallerySelectedUrl = "";
  actionTitle.textContent = title;
  actionHint.innerHTML = hint;
  galleryUseBtn.style.display = mode === "gallery" ? "inline-block" : "none";
  gallerySelection.style.display = "none";
  gallerySelection.textContent = "";
  xoborTransfer.classList.toggle("open", mode === "upload");
  xoborUrlInput.value = "";
  actionOverlay.classList.add("open");
  actionOverlay.setAttribute("aria-hidden", "false");
  setTimeout(() => {
    actionFrame.src = url;
  }, 20);
}
actionCloseBtn.onclick = () => closeActionModal(false);
actionOverlay.addEventListener("click", e => {
  if (e.target === actionOverlay) closeActionModal(false);
});
openTabBtn.onclick = () => {
  if (actionUrl) window.open(actionUrl, "_blank", "noopener");
};
function galleryCandidate(img, baseUrl) {
  const link = img?.closest("a[href]");
  const href = link ? absoluteUrl(link.getAttribute("href"), baseUrl) : "";
  if (href && looksLikeImageUrl(href) && !isSecure(href) && !isBlacklisted(href)) {
    return stripResize(href);
  }
  return imageCandidates(img, baseUrl)
    .find(url => !isSecure(url) && !isBlacklisted(url)) || "";
}
function galleryImages(doc) {
  if (!doc) return [];
  return [...doc.querySelectorAll("img")]
    .map(img => {
      const url = galleryCandidate(img, doc.location?.href || actionUrl);
      const w = img.naturalWidth || img.width || img.clientWidth || 0;
      const h = img.naturalHeight || img.height || img.clientHeight || 0;
      return {img, url, w, h, score: w * h};
    })
    .filter(x => x.url && x.w >= 120 && x.h >= 80);
}
function setGallerySelection(url, img = null) {
  if (!url || isSecure(url)) return;
  gallerySelectedUrl = stripResize(url);
  try {
    const doc = actionFrame.contentDocument;
    doc?.querySelectorAll(".fnewGallerySelected").forEach(el => {
      el.classList.remove("fnewGallerySelected");
      el.style.outline = "";
      el.style.outlineOffset = "";
    });
    if (img) {
      img.classList.add("fnewGallerySelected");
      img.style.setProperty("outline", "4px solid #5cb85c", "important");
      img.style.setProperty("outline-offset", "3px", "important");
    }
  } catch {}
  gallerySelection.style.display = "block";
  gallerySelection.textContent = "Ausgewählt: " + gallerySelectedUrl;
}
function instrumentGallery(doc) {
  if (!doc?.body) return;
  const images = galleryImages(doc);
  images.forEach(({img, url}) => {
    img.style.cursor = "crosshair";
    img.title = "Dieses Bild für das Vorschaubild markieren";
    if (img.dataset.fnewGalleryBound === "1") return;
    img.dataset.fnewGalleryBound = "1";
    img.addEventListener("click", () => {
      setGallerySelection(url, img);
    }, true);
  });
  const best = [...images].sort((a, b) => b.score - a.score)[0];
  if (best && best.w >= 300 && best.h >= 180 && images.length <= 12) {
    setGallerySelection(best.url, best.img);
  }
}
actionFrame.addEventListener("load", () => {
  if (actionMode === "gallery") {
    try {
      const doc = actionFrame.contentDocument;
      setTimeout(() => instrumentGallery(doc), 500);
    } catch {
      actionHint.innerHTML +=
        "<br><b>Hinweis:</b> Xobor verhindert hier die eingebettete Ansicht. Nutze in diesem Fall „In neuem Tab“.";
    }
  }
});
galleryUseBtn.onclick = () => {
  let selected = gallerySelectedUrl;
  if (!selected) {
    try {
      selected = galleryImages(actionFrame.contentDocument)
        .sort((a, b) => b.score - a.score)[0]?.url || "";
    } catch {}
  }
  if (!selected) {
    alert("Bitte zuerst das gewünschte Bild in der Xobor-Galerie öffnen oder anklicken.");
    return;
  }
  if (isSecure(selected)) {
    alert("Dieses Bild besitzt nur eine temporäre Secure-Adresse und kann nicht verwendet werden.");
    return;
  }
  closeActionModal(false);
  chooseImage(selected);
};
function extractXoborImageUrl(raw) {
  let value = String(raw || "").trim();
  if (!value) return "";
  const ta = document.createElement("textarea");
  ta.innerHTML = value;
  value = ta.value;
  let m = value.match(
    /(?:src|href)\s*=\s*["']([^"']*files\.(?:homepagemodules|xobor)\.de\/[^"']+)["']/i
  );
  if (m?.[1]) {
    return stripResize(absoluteUrl(m[1]));
  }
  m = value.match(
    /(?:https?:)?\/\/files\.(?:homepagemodules|xobor)\.de\/[^\s"'<>]+/i
  );
  if (m?.[0]) {
    return stripResize(absoluteUrl(m[0]));
  }
  try {
    const u = new URL(value, location.href);
    if (
      /files\.(?:homepagemodules|xobor)\.de$/i.test(u.hostname) &&
      !isSecure(u.href)
    ) {
      return stripResize(u.href);
    }
  } catch {}
  return "";
}
function acceptXoborTransfer(raw) {
  const url = extractXoborImageUrl(raw);
  if (!url) {
    transferState.textContent =
      "Keine Xobor-Bildadresse erkannt. Bitte bei Xobor den Link/HTML-Code „Bild im Forum einfügen“ kopieren.";
    transferState.style.color = "#a94442";
    return false;
  }
  if (isSecure(url)) {
    alert("Diese Bildadresse ist nur temporär gültig und kann nicht als Vorschaubild verwendet werden.");
    return false;
  }
  xoborUrlInput.value = url;
  transferState.textContent = "Erkannt: " + url;
  transferState.style.color = "#3c763d";
  setTimeout(() => {
    closeActionModal(false);
    chooseImage(url);
  }, 250);
  return true;
}
clipboardBtn.onclick = async () => {
  try {
    const value = await navigator.clipboard.readText();
    if (!value) {
      transferState.textContent = "Die Zwischenablage ist leer.";
      transferState.style.color = "#a94442";
      return;
    }
    xoborUrlInput.value = value;
    acceptXoborTransfer(value);
  } catch {
    transferState.textContent =
      "Der Browser hat den Zugriff auf die Zwischenablage blockiert. Bitte den Xobor-Link in das Feld einfügen und „Bild übernehmen“ anklicken.";
    transferState.style.color = "#a94442";
    xoborUrlInput.focus();
  }
};
useXoborUrlBtn.onclick = () =>
  acceptXoborTransfer(xoborUrlInput.value);
xoborUrlInput.addEventListener("keydown", e => {
  if (e.key === "Enter") {
    e.preventDefault();
    acceptXoborTransfer(xoborUrlInput.value);
  }
});
uploadBtn.onclick = () => {
  try {
    setStatus("Öffne die Xobor-Bilderverwaltung …");
    openActionModal(
      "upload",
      "/admin/fileupload.php",
      "Xobor-Bilder – hochladen / auswählen",
      "<b>Direkte Xobor-Bilderverwaltung:</b> Bild wie gewohnt hochladen. " +
      "Danach bei Xobor den angezeigten Link bzw. HTML-Code <b>„Bild im Forum einfügen“</b> kopieren. " +
      "Oben im Extractor auf <b>„Aus Zwischenablage“</b> klicken – fertig."
    );
    setStatus("");
  } catch (e) {
    console.error("Xobor-Bilderverwaltung:", e);
    setStatus("");
    alert(
      "Die eingebettete Xobor-Bilderverwaltung konnte nicht geöffnet werden. " +
      "Ich öffne sie deshalb in einem neuen Tab."
    );
    window.open("/admin/fileupload.php", "_blank", "noopener");
  }
};
galleryBtn.onclick = () => {
  openActionModal(
    "gallery",
    "/gallery.php?show=last",
    "Xobor-Bilder / Galerie",
    "Öffne das gewünschte Album bzw. Bild. Ein Bild kann durch Anklicken markiert werden. " +
    "Anschließend oben auf <b>„Dieses Bild übernehmen“</b> klicken."
  );
};
rescanBtn.onclick = () => loadImages();
async function autoInsertIntoFirstPost(imgUrl) {
  try {
    const editUrl = await getFirstPostEditUrl();
    location.href =
      `${editUrl}` +
      `&fnewimg=${encodeURIComponent(imgUrl)}` +
      `&fnewreplace=1`;
  } catch (e) {
    console.warn("AutoInsert Fehler:", e);
    alert(
      e.message ||
      "Das neue Vorschaubild konnte nicht an den ersten Beitrag übergeben werden."
    );
  }
}
function chooseImage(url, event) {
  const clean = stripResize(url);
  if (isSecure(clean)) {
    alert("Dieser Link ist nur temporär gültig und kann nicht als Vorschaubild verwendet werden.");
    return;
  }
  try { navigator.clipboard?.writeText(clean); } catch {}
  if (copyInfo && event) {
    copyInfo.style.left = event.pageX + 10 + "px";
    copyInfo.style.top = event.pageY - 10 + "px";
    copyInfo.style.display = "block";
    setTimeout(() => {
      copyInfo.style.display = "none";
    }, 2500);
  }
  autoInsertIntoFirstPost(clean);
}
async function loadImages() {
  const url = threadUrl.value.trim();
  const minW = Math.max(0, Number(minWidth.value) || 0);
  if (!url) {
    imgList.textContent = "Bitte den Link eines Themas eingeben!";
    return;
  }
  stopLoading = false;
  visibleImages = [];
  currentPage = 1;
  currentPreviewUrl = "";
  sourceThreadUrl = url;
  setBusy(true);
  setStatus("Thema wird geladen und im Hintergrund vollständig gerendert …");
  imgCount.textContent = "Gefundene Bilder: 0";
  imgList.innerHTML = '<i>Lade…</i> <button id="abortLoad">Abbrechen</button>';
  pageNav.style.display = "none";
  $("abortLoad").onclick = () => {
    stopLoading = true;
    imgList.innerHTML = "<i>Abgebrochen.</i>";
    setStatus("");
    setBusy(false);
  };
  try {
    const firstUrl = new URL(url, location.href).href;
    const pageUrls = buildPageUrls(firstUrl);
    let allFound = new Map();
    for (let i = 0; i < pageUrls.length && !stopLoading; i++) {
      const pageUrl = pageUrls[i];
      setStatus(`Durchsuche Themenseite ${i + 1} …`);
      let rawMap = new Map();
      try {
        const response = await fetch(pageUrl, {
          credentials: "same-origin",
          cache: "default"
        });
        if (i > 0 && response.url && response.url !== pageUrl) break;
        rawMap = extractFromHtml(await response.text(), pageUrl);
      } catch {}
      const renderedDoc = await loadRenderedDocument(pageUrl);
      const renderedMap = renderedDoc
        ? extractFromDocument(renderedDoc, pageUrl)
        : new Map();
      allFound = mergeMaps(allFound, rawMap, renderedMap);
    }
    if (stopLoading) return;
    for (const item of allFound.values()) {
      if (item.current) {
        currentPreviewUrl = item.url;
        break;
      }
    }
    let candidates = [...allFound.values()];
    const normalKeys = new Set(
      candidates
        .filter(item => !item.secure)
        .map(item => imageKey(item.url))
    );
    candidates = candidates.filter(item =>
      !item.secure || !normalKeys.has(imageKey(item.url))
    );
    await checkImages(candidates, minW);
    visibleImages.sort((a, b) => {
      const ac = a.current || sameImage(a.url, currentPreviewUrl);
      const bc = b.current || sameImage(b.url, currentPreviewUrl);
      if (ac !== bc) return ac ? -1 : 1;
      if (a.secure !== b.secure) return a.secure ? 1 : -1;
      return (b.w || 0) - (a.w || 0);
    });
    imgCount.textContent = `Gefundene Bilder: ${visibleImages.length}`;
    if (visibleImages.length) {
      renderPage();
    } else {
      imgList.innerHTML =
        "<i>Keine geeigneten Bilder gefunden. Falls im Beitrag ein neues Bild ergänzt wurde, bitte den Beitrag einmal normal öffnen und danach die Suche erneut starten.</i>";
    }
    setStatus(
      currentPreviewUrl
        ? "Das aktuelle Vorschaubild ist orange markiert. Wähle darunter ein anderes Bild aus."
        : "Wähle das gewünschte Vorschaubild aus."
    );
  } catch (e) {
    console.error(e);
    imgList.textContent = "Seite kann nicht geladen werden!";
    setStatus("");
  } finally {
    setBusy(false);
  }
}
searchBtn.onclick = loadImages;
threadUrl.addEventListener("input", () => {
  sessionStorage.setItem("fnew_last_url", threadUrl.value.trim());
});
const queryUrl = new URLSearchParams(location.search).get("url");
const storedUrl = sessionStorage.getItem("fnew_last_url") || "";
const initialUrl = queryUrl || storedUrl;
if (initialUrl) {
  threadUrl.value = initialUrl;
  if (queryUrl) {
    sessionStorage.setItem("fnew_last_url", initialUrl);
    loadImages();
  }
}
})();
</script>
{{user_admin==true.end}}