Zum Inhalt springen

MediaWiki:Gadget-LabelScanIndexer.js

Aus ADOS Wiki

Hinweis: Leere nach dem Veröffentlichen den Browser-Cache, um die Änderungen sehen zu können.

  • Firefox/Safari: Umschalttaste drücken und gleichzeitig Aktualisieren anklicken oder entweder Strg+F5 oder Strg+R (⌘+R auf dem Mac) drücken
  • Google Chrome: Umschalttaste+Strg+R (⌘+Umschalttaste+R auf dem Mac) drücken
  • Edge: Strg+F5 drücken oder Strg drücken und gleichzeitig Aktualisieren anklicken
/* Gadget: LabelScanIndexer (Auto-Save, lokal, ESM-Only Shim)
 * Erzeugt Embeddings lokal (CLIP) und speichert in MediaWiki:Gadget-LabelScan-index.json
 * Läuft nur auf "Hilfe:LabelScan-Indexer"
 */

/* global mw */
(function () {
  'use strict';

  // ---------- Seitenerkennung ----------
  var NS = mw.config.get('wgNamespaceNumber'); // 12 = Hilfe/Help
  var TITLE = mw.config.get('wgTitle');        // Titel ohne Namespace
  var ON_PAGE = (NS === 12 && TITLE === 'LabelScan-Indexer');
  if (!ON_PAGE) { return; }

  var INDEX_TITLE = 'MediaWiki:Gadget-LabelScan-index.json';

  // ---------- Lokale Pfade ----------
  // Deine Datei ist ESM – wir laden sie NUR als Module:
  var TRANSFORMERS_ESM = '/vendor/transformers/transformers.min.js';
  var WASM_DIR         = '/vendor/transformers/';
  var MODEL_ID         = 'Xenova/clip-vit-base-patch32';
  var LOCAL_MODEL_PATH = '/models';

  // ---------- UI helpers ----------
  function $(id) { return document.getElementById(id); }
  function status(t) { var el = $('idx-status'); if (el) el.textContent = t || ''; }

  function hasInterfaceRight() {
    var groups = mw.config.get('wgUserGroups') || [];
    for (var i = 0; i < groups.length; i++) {
      if (groups[i] === 'interface-admin' || groups[i] === 'sysop') return true;
    }
    return false;
  }

  function float32ToBase64(vec) {
    var bytes = new Uint8Array(vec.buffer);
    var bin = '';
    var chunk = 0x8000;
    for (var i = 0; i < bytes.length; i += chunk) {
      bin += String.fromCharCode.apply(null, bytes.subarray(i, i + chunk));
    }
    return btoa(bin);
  }

  // EXIF-korrekte Canvas-Erzeugung
  function fileToCanvasExif(file) {
    return new Promise(function (resolve, reject) {
      if ('createImageBitmap' in window) {
        createImageBitmap(file, { imageOrientation: 'from-image' }).then(function (bmp) {
          if ('OffscreenCanvas' in window) {
            var c1 = new OffscreenCanvas(bmp.width, bmp.height);
            c1.getContext('2d').drawImage(bmp, 0, 0);
            resolve(c1);
          } else {
            var c2 = document.createElement('canvas');
            c2.width = bmp.width; c2.height = bmp.height;
            c2.getContext('2d').drawImage(bmp, 0, 0);
            resolve(c2);
          }
        })["catch"](reject);
      } else {
        var url = URL.createObjectURL(file);
        var im = new Image();
        im.onload = function () {
          var c3 = document.createElement('canvas');
          c3.width = im.width; c3.height = im.height;
          c3.getContext('2d').drawImage(im, 0, 0);
          URL.revokeObjectURL(url);
          resolve(c3);
        };
        im.onerror = function (e) { URL.revokeObjectURL(url); reject(e); };
        im.src = url;
      }
    });
  }

  function canvasToBlobPromise(canvas) {
    if (canvas.convertToBlob) {
      return canvas.convertToBlob({ type: 'image/jpeg', quality: 0.95 });
    }
    return new Promise(function (resolve) {
      canvas.toBlob(function (b) { resolve(b); }, 'image/jpeg', 0.95);
    });
  }

  // ---------- ESM-Loader (setzt window.transformers) ----------
  function loadModuleShim(url) {
    return new Promise(function (resolve, reject) {
      var s = document.createElement('script');
      s.type = 'module';
      s.textContent = "import * as tf from '" + url + "'; window.transformers = tf;";
      s.onload = function () { resolve(); };
      s.onerror = function () { reject(new Error('Module shim failed: ' + url)); };
      document.head.appendChild(s);
    });
  }

  var _libPromise = null;
  function ensureLib() {
    if (_libPromise) return _libPromise;
    _libPromise = loadModuleShim(TRANSFORMERS_ESM).then(function () {
      var t0 = Date.now();
      return new Promise(function (resolve, reject) {
        (function spin() {
          if (window.transformers && typeof window.transformers === 'object') {
            // Env konfigurieren
            var env = window.transformers.env;
            env.allowLocalModels = true;
            env.allowRemoteModels = false;
            env.localModelPath   = LOCAL_MODEL_PATH;

            env.backends = env.backends || {};
            env.backends.onnx = env.backends.onnx || {};
            env.backends.onnx.wasm = env.backends.onnx.wasm || {};
            env.backends.onnx.wasm.wasmPaths = WASM_DIR;

            resolve(window.transformers);
          } else if (Date.now() - t0 > 7000) {
            reject(new Error('Transformers-ESM nicht verfügbar (Timeout).'));
          } else {
            setTimeout(spin, 50);
          }
        })();
      });
    });
    return _libPromise;
  }

  var _modelPromise = null;
  function ensureModel() {
    if (_modelPromise) return _modelPromise;
    _modelPromise = ensureLib().then(function (tf) {
      return Promise.all([
        tf.AutoProcessor.from_pretrained(MODEL_ID),
        tf.CLIPVisionModelWithProjection.from_pretrained(MODEL_ID, { quantized: true })
      ]).then(function (arr) {
        var pack = { mod: tf, processor: arr[0], model: arr[1] };
        try {
          var backend = (pack.model && pack.model.session && pack.model.session.executionProvider) || 'unknown';
          console.log('[LabelScanIndexer] Modell geladen | Backend:', backend);
        } catch (e) { console.log('[LabelScanIndexer] Modell geladen'); }
        return pack;
      });
    });
    return _modelPromise;
  }

  function buildEmbeddingFromFile(file) {
    return ensureModel().then(function (pack) {
      return fileToCanvasExif(file).then(function (canvas) {
        return canvasToBlobPromise(canvas).then(function (blob) {
          return pack.mod.RawImage.fromBlob(blob).then(function (raw) {
            return pack.processor(raw, { return_tensors: 'pt' }).then(function (inputs) {
              return pack.model.forward({ pixel_values: inputs.pixel_values }).then(function (out) {
                var vec = (out && out.image_embeds && out.image_embeds.data) || (out && out.image_embeds);
                if (!(vec instanceof Float32Array)) throw new Error('Embedding-Format unerwartet');

                // Normieren
                var i, n = 0;
                for (i = 0; i < vec.length; i++) n += vec[i] * vec[i];
                var norm = Math.sqrt(n) || 1;
                var v = new Float32Array(vec.length);
                for (i = 0; i < vec.length; i++) v[i] = vec[i] / norm;
                return v;
              });
            });
          });
        });
      });
    });
  }

  // ---------- Index laden/speichern ----------
  function fetchIndexJSON() {
    var url = mw.util.getUrl(INDEX_TITLE, { action: 'raw', ctype: 'application/json' });
    return fetch(url, { cache: 'no-store' }).then(function (res) {
      if (!res.ok) throw new Error('Index nicht ladbar: ' + res.status);
      return res.text();
    }).then(function (txt) {
      try { return JSON.parse(txt || '[]') || []; }
      catch (e) { return []; }
    });
  }

  function saveIndexJSON(newArray, summary) {
    return mw.loader.using(['mediawiki.api']).then(function () {
      var api = new mw.Api();
      var text = JSON.stringify(newArray, null, 2) + '\n';
      return api.postWithToken('csrf', {
        action: 'edit',
        title: INDEX_TITLE,
        text: text,
        summary: summary || 'LabelScan: +1 embedding (Auto-Indexer)',
        nocreate: 0,
        bot: 1
      });
    });
  }

  // ---------- Click-Handler ----------
  var runBtn = document.getElementById('idx-run');
  if (!runBtn) {
    console.warn('[LabelScanIndexer] Button #idx-run nicht gefunden – ist das HTML auf der Seite eingebunden?');
  } else {
    runBtn.addEventListener('click', function () {
      if (!hasInterfaceRight()) {
        alert('⚠️ Du brauchst Admin/Interface-Rechte (editinterface).');
        return;
      }

      var titleEl = $('idx-title');
      var thumbEl = $('idx-thumb');
      var fileEl  = $('idx-file');

      var title = titleEl ? String(titleEl.value || '').trim() : '';
      var thumb = thumbEl ? String(thumbEl.value || '').trim() : '';
      var file  = (fileEl && fileEl.files && fileEl.files[0]) ? fileEl.files[0] : null;

      if (!title) { alert('Titel fehlt.'); return; }
      if (!file)  { alert('Bitte eine Bilddatei wählen.'); return; }

      runBtn.disabled = true;
      status('Embedding berechnen …');

      buildEmbeddingFromFile(file).then(function (vec) {
        var b64 = float32ToBase64(vec);
        var outBox = $('idx-out');
        if (outBox) outBox.value = JSON.stringify({ title: title, thumb: thumb, embed: b64 }, null, 2);

        status('Index laden …');
        return fetchIndexJSON().then(function (arr) {
          arr.push({ title: title, thumb: thumb, embed: b64 });
          status('Speichern …');
          return saveIndexJSON(arr, 'LabelScan: +1 embedding für "' + title + '"');
        });
      }).then(function () {
        status('Gespeichert ✅');
      })["catch"](function (e) {
        console.error(e);
        status('Fehler ❌ ' + (e && e.message ? e.message : e));
        alert('Fehler: ' + (e && e.message ? e.message : e));
      }).then(function () {
        runBtn.disabled = false;
      });
    });
  }

  console.log('[LabelScanIndexer] bereit');
})();