ai-disclosure-standard/web/static/app.js

(() => {
  const cfg = window.APP_CONFIG;
  if (!cfg) return;
  const base = cfg.baseURL.replace(/\/$/, '');
  const form = document.getElementById('generator-form');
  if (!form) return;
  const $ = id => document.getElementById(id);
  const presets = {
    'no-ai': {extent:'none', activities:'', review:'editorial'},
    research: {extent:'assisted', activities:'research', review:'editorial'},
    summary: {extent:'assisted', activities:'summarisation', review:'editorial'},
    full: {extent:'full', activities:'generation', review:'editorial'}
  };

  function value(id) {
    const el = $(id);
    return el && !el.disabled ? el.value.trim() : '';
  }

  function setArticleParams(params) {
    params.set('mode', 'article');
    const fields = {
      text: 'article-text',
      coverImage: 'article-cover-image',
      image: 'article-image',
      research: 'article-research',
      translation: 'article-translation',
      audio: 'article-audio',
      video: 'article-video',
      code: 'article-code'
    };
    Object.entries(fields).forEach(([name, id]) => {
      params.set(name + 'Extent', $(id).value);
      params.set(name + 'Review', $(`${id}-review`).value);
    });
  }

  function update(applyPreset = false) {
    const mode = $('declaration-mode').value;
    const articleMode = mode === 'article';
    $('single-fields').hidden = articleMode;
    $('article-fields').hidden = !articleMode;

    const preset = $('preset').value;
    if (!articleMode && applyPreset && presets[preset]) {
      $('extent').value = presets[preset].extent;
      $('activities').value = presets[preset].activities;
      $('review').value = presets[preset].review;
    }

    const lang = $('lang').value;
    const locale = cfg.locales[lang] || cfg.locales.en;
    const assurance = $('assurance').value;
    const assuranceDescription = locale.text[`assurance_${assurance}_description`];
    if ($('assurance-description') && assuranceDescription) {
      $('assurance-description').textContent = assuranceDescription;
    }
    const params = new URLSearchParams();
    if (articleMode) {
      setArticleParams(params);
    } else {
      if (preset) params.set('preset', preset);
      params.set('component', $('component').value);
      params.set('extent', $('extent').value);
      if ($('activities').value.trim()) params.set('activities', $('activities').value.trim());
      params.set('review', $('review').value);
    }
    params.set('lang', lang);
    params.set('assurance', assurance);
    if ($('subject').value.trim()) params.set('subject', $('subject').value.trim());

    const boolParam = (id, key) => { const el = $(id); if (el && el.checked) params.set(key, 'true'); };
    boolParam('public-interest-text', 'publicInterestText');
    boolParam('deepfake', 'deepfake');
    boolParam('artistic-context', 'artisticCreativeSatiricalFictional');
    boolParam('substantial-review', 'substantialHumanReview');
    boolParam('editorial-responsibility-confirmed', 'editorialResponsibilityConfirmed');
    boolParam('first-exposure-disclosure', 'firstExposureDisclosure');
    boolParam('accessibility-considered', 'accessibilityConsidered');
    if (value('responsible')) params.set('responsible', value('responsible'));
    if (value('responsible-url')) params.set('responsibleUrl', value('responsible-url'));

    if (cfg.capabilities.custom_text) {
      if (value('custom-title')) params.set('customTitle', value('custom-title'));
      if (value('custom-description')) params.set('customDescription', value('custom-description'));
    }
    if (cfg.capabilities.custom_badge) {
      if (value('badge-label')) params.set('badgeLabel', value('badge-label'));
      if (value('badge-message')) params.set('badgeMessage', value('badge-message'));
      if (value('left-color')) params.set('leftColor', value('left-color'));
      if (value('right-color')) params.set('rightColor', value('right-color'));
    }

    const declarationURL = `${base}/declaration?${params}`;
    const badgeParams = new URLSearchParams(params);
    badgeParams.set('theme', $('theme').value);
    badgeParams.set('link', declarationURL);
    const badgeURL = `${base}/v1/badge.svg?${badgeParams}`;
    const manifestURL = `${base}/v1/declaration.json?${params}`;
    let alt = articleMode ? (locale.text.badge_article || 'Article transparency') : (locale.text.ai_label || 'UCNG');
    if ($('deepfake')?.checked) alt = locale.text.badge_article50_deepfake || alt;
    else if ($('public-interest-text')?.checked && !($('substantial-review')?.checked && $('editorial-responsibility-confirmed')?.checked)) alt = locale.text.badge_article50_text || alt;

    $('preview-badge').src = badgeURL;
    $('preview-badge').alt = alt;
    $('preview-link').href = declarationURL;
    $('html-code').value = `<a href="${declarationURL}"><img src="${badgeURL}" alt="${alt}"></a>`;
    $('markdown-code').value = `[![${alt}](${badgeURL})](${declarationURL})`;
    $('json-code').value = manifestURL;
    if ($('assessment-code')) $('assessment-code').value = `${base}/v1/article50-assessment.json?${params}`;
  }


  document.querySelectorAll('#article-fields select[data-review]').forEach(extentSelect => {
    extentSelect.addEventListener('change', () => {
      const reviewSelect = $(extentSelect.dataset.review);
      if (!reviewSelect) return;
      if (extentSelect.value === 'none') {
        reviewSelect.value = 'none';
      } else if (reviewSelect.value === 'none') {
        reviewSelect.value = 'editorial';
      }
      update(false);
    });
  });

  form.addEventListener('input', event => update(event.target.id === 'preset'));
  form.addEventListener('change', event => update(event.target.id === 'preset'));
  document.querySelector('.pro-panel')?.addEventListener('input', () => update(false));
  $('copy-html')?.addEventListener('click', async () => {
    await navigator.clipboard.writeText($('html-code').value);
    const locale = cfg.locales[$('lang').value] || cfg.locales.en;
    $('copy-html').textContent = locale.text.copied || 'Copied';
    setTimeout(() => { $('copy-html').textContent = locale.text.copy_html || 'Copy HTML'; }, 1600);
  });
  $('page-language')?.addEventListener('change', event => {
    const url = new URL(window.location.href);
    url.searchParams.set('lang', event.target.value);
    window.location.href = url.toString();
  });
  update(true);
})();