@jjlmoya/utils-games-development 1.53.0 → 1.55.0

package/src/tool/steamBbcodeTranslator/bbcode-parser.ts

@@ -0,0 +1,110 @@
+import type { Node, TagNode, TextNode } from './types';
+
+const BB_TAG_PATTERN = /\[(\/)?([a-z][a-z0-9]*|\*)(?:=([^\]]*))?\]/gi;
+const SUPPORTED_TAGS = new Set(['h1', 'h2', 'h3', 'b', 'strong', 'i', 'em', 'u', 's', 'strike', 'url', 'code', 'quote', 'spoiler', 'list', 'olist', '*']);
+
+export function text(value: string): TextNode {
+  return { kind: 'text', value };
+}
+
+export function tag(name: string, value: string | undefined, children: Node[] = []): TagNode {
+  return { kind: 'tag', name, value, children };
+}
+
+interface ParseStackEntry {
+  node: TagNode;
+  parent: Node[];
+}
+
+interface ParseContext {
+  stack: ParseStackEntry[];
+  root: Node[];
+  warnings: string[];
+  append: (n: Node) => void;
+}
+
+function handleAsteriskTag(ctx: ParseContext, full: string): void {
+  const inList = ctx.stack.some((entry) => entry.node.name === 'list' || entry.node.name === 'olist');
+  if (!inList) {
+    ctx.warnings.push('A list item marker was found outside a list.');
+    ctx.append(text(full));
+    return;
+  }
+  while (ctx.stack.length) {
+    const top = ctx.stack[ctx.stack.length - 1];
+    if (top && top.node.name === '*') ctx.stack.pop();
+    else break;
+  }
+  const listParent = ctx.stack[ctx.stack.length - 1];
+  if (listParent && (listParent.node.name === 'list' || listParent.node.name === 'olist')) {
+    const item = tag('*', undefined);
+    listParent.node.children.push(item);
+    ctx.stack.push({ node: item, parent: listParent.node.children });
+  }
+}
+
+function handleClosingTag(ctx: ParseContext, name: string, full: string): void {
+  const matchingIndex = [...ctx.stack].reverse().findIndex((entry) => entry.node.name === name);
+  if (matchingIndex === -1) {
+    ctx.warnings.push(`Closing tag [/${name}] has no matching opening tag.`);
+    ctx.append(text(full));
+    return;
+  }
+  for (let i = 0; i <= matchingIndex; i += 1) ctx.stack.pop();
+}
+
+function handleOpeningTag(ctx: ParseContext, name: string, value?: string): void {
+  const node = tag(name, value);
+  ctx.append(node);
+  if (name !== 'br') {
+    const top = ctx.stack[ctx.stack.length - 1];
+    ctx.stack.push({ node, parent: top ? top.node.children : ctx.root });
+  }
+}
+
+function processMatch(ctx: ParseContext, match: RegExpExecArray, full: string, rawName: string): void {
+  const closing = Boolean(match[1]);
+  const name = rawName.toLowerCase();
+  const value = match[3]?.trim();
+
+  if (!SUPPORTED_TAGS.has(name)) {
+    ctx.warnings.push(`Unsupported tag [${name}] was kept as text.`);
+    ctx.append(text(full));
+  } else if (name === '*') {
+    handleAsteriskTag(ctx, full);
+  } else if (closing) {
+    handleClosingTag(ctx, name, full);
+  } else {
+    handleOpeningTag(ctx, name, value);
+  }
+}
+
+export function parseBbcode(source: string): { nodes: Node[]; warnings: string[]; tagCount: number } {
+  const root: Node[] = [];
+  const stack: ParseStackEntry[] = [];
+  let cursor = 0;
+  let tagCount = 0;
+  const warnings: string[] = [];
+
+  const append = (nodeToAppend: Node) => {
+    const top = stack[stack.length - 1];
+    const target = top ? top.node.children : root;
+    target.push(nodeToAppend);
+  };
+  const ctx: ParseContext = { stack, root, warnings, append };
+
+  for (const match of source.matchAll(BB_TAG_PATTERN)) {
+    const full = match[0];
+    const index = match.index ?? 0;
+    if (index > cursor) append(text(source.slice(cursor, index)));
+    cursor = index + full.length;
+    if (!match[2]) continue;
+    tagCount += 1;
+    processMatch(ctx, match, full, match[2]);
+  }
+
+  if (cursor < source.length) append(text(source.slice(cursor)));
+  const top = stack[stack.length - 1];
+  if (top) warnings.push(`Unclosed tag [${top.node.name}] was closed automatically.`);
+  return { nodes: root, warnings: [...new Set(warnings)], tagCount };
+}

package/src/tool/steamBbcodeTranslator/bibliography.astro

@@ -0,0 +1,6 @@
+---
+import { Bibliography as SharedBibliography } from '@jjlmoya/utils-shared';
+import { bibliographyEntries } from './bibliography';
+---
+
+<SharedBibliography links={bibliographyEntries} />

package/src/tool/steamBbcodeTranslator/bibliography.ts

@@ -0,0 +1,14 @@
+export const bibliographyEntries: { name: string; url: string }[] = [
+  {
+    name: 'Steamworks Store Page Written Description',
+    url: 'https://partner.steamgames.com/doc/store/page/description?language=english'
+  },
+  {
+    name: 'Steamworks Importing HTML',
+    url: 'https://partner.steamgames.com/doc/marketing/event_tools/import?language=english'
+  },
+  {
+    name: 'itch.io Creator Documentation',
+    url: 'https://itch.io/docs/creators/getting-started'
+  }
+];

package/src/tool/steamBbcodeTranslator/component.astro

@@ -0,0 +1,83 @@
+---
+import type { SteamBbcodeTranslatorUI } from './ui';
+import { sampleBbcode } from './logic';
+import './steam-bbcode-translator.css';
+
+interface Props {
+  ui: SteamBbcodeTranslatorUI;
+}
+
+const { ui: t } = Astro.props;
+---
+
+<div
+  class="bbcode-root"
+  id="steam-bbcode-translator"
+  data-detected-label={t.detectedLabel}
+  data-detected-empty={t.detectedEmpty}
+  data-bbcode={t.bbcode}
+  data-markdown={t.markdown}
+  data-html={t.html}
+  data-copy={t.copy}
+  data-copied={t.copied}
+  data-preview-empty={t.previewEmpty}
+  data-characters={t.characters}
+  data-blocks={t.blocks}
+>
+  <div class="bbcode-header">
+    <div class="bbcode-title-row">
+      <span class="bbcode-mark" aria-hidden="true">[ / ]</span>
+      <div>
+        <span class="bbcode-kicker">STEAM MARKUP TRANSLATOR</span>
+        <strong>{t.privacyNote}</strong>
+      </div>
+    </div>
+    <span class="bbcode-draft-note">{t.persistenceNote}</span>
+  </div>
+
+  <section class="bbcode-input-card">
+    <div class="bbcode-section-head">
+      <div>
+        <span class="bbcode-step">01</span>
+        <h2>{t.editorLabel}</h2>
+      </div>
+      <span class="bbcode-detected" id="bbcode-detected">{t.detectedEmpty}</span>
+    </div>
+    <label class="bbcode-sr-only" for="bbcode-source">{t.editorLabel}</label>
+    <textarea id="bbcode-source" spellcheck="false" aria-describedby="bbcode-editor-hint">{sampleBbcode}</textarea>
+    <div class="bbcode-input-footer">
+      <p id="bbcode-editor-hint">{t.editorHint}</p>
+      <div class="bbcode-input-meta">
+        <span><strong id="bbcode-character-count">0</strong> {t.characters}</span>
+        <span><strong id="bbcode-block-count">0</strong> {t.blocks}</span>
+        <button type="button" class="bbcode-clear-button" id="bbcode-clear">{t.clear}</button>
+      </div>
+    </div>
+  </section>
+
+  <section class="bbcode-output-section" aria-live="polite">
+    <div class="bbcode-output-heading">
+      <span class="bbcode-step">02</span>
+      <h2>{t.detectedLabel}</h2>
+    </div>
+    <div class="bbcode-output-grid" id="bbcode-output-grid"></div>
+  </section>
+
+  <section class="bbcode-preview-card">
+    <div class="bbcode-output-heading">
+      <span class="bbcode-step">03</span>
+      <h2>{t.previewLabel}</h2>
+    </div>
+    <div id="bbcode-preview" class="bbcode-preview-surface"><p>{t.previewEmpty}</p></div>
+  </section>
+</div>
+
+<script>
+  import { initSteamBbcodeTranslatorApp } from './app-client';
+
+  if (document.readyState === 'loading') {
+    document.addEventListener('DOMContentLoaded', initSteamBbcodeTranslatorApp);
+  } else {
+    initSteamBbcodeTranslatorApp();
+  }
+</script>

package/src/tool/steamBbcodeTranslator/entry.ts

@@ -0,0 +1,28 @@
+import type { GamesToolEntry, ToolLocaleContent } from '../../types';
+import type { SteamBbcodeTranslatorUI } from './ui';
+
+export type { SteamBbcodeTranslatorUI };
+
+export type SteamBbcodeTranslatorLocaleContent = ToolLocaleContent<SteamBbcodeTranslatorUI>;
+
+export const steamBbcodeTranslator: GamesToolEntry<SteamBbcodeTranslatorUI> = {
+  id: 'steam-bbcode-translator',
+  icons: { bg: 'mdi:gamepad-variant', fg: 'mdi:code-brackets' },
+  i18n: {
+    de: () => import('./i18n/de').then((m) => m.content),
+    en: () => import('./i18n/en').then((m) => m.content),
+    es: () => import('./i18n/es').then((m) => m.content),
+    fr: () => import('./i18n/fr').then((m) => m.content),
+    id: () => import('./i18n/id').then((m) => m.content),
+    it: () => import('./i18n/it').then((m) => m.content),
+    ja: () => import('./i18n/ja').then((m) => m.content),
+    ko: () => import('./i18n/ko').then((m) => m.content),
+    nl: () => import('./i18n/nl').then((m) => m.content),
+    pl: () => import('./i18n/pl').then((m) => m.content),
+    pt: () => import('./i18n/pt').then((m) => m.content),
+    ru: () => import('./i18n/ru').then((m) => m.content),
+    sv: () => import('./i18n/sv').then((m) => m.content),
+    tr: () => import('./i18n/tr').then((m) => m.content),
+    zh: () => import('./i18n/zh').then((m) => m.content),
+  },
+};

package/src/tool/steamBbcodeTranslator/html-parser.ts

@@ -0,0 +1,42 @@
+import type { TranslationResult } from './types';
+
+export function decodeHtml(value: string): string {
+  return value
+    .replace(/&lt;/g, '<')
+    .replace(/&gt;/g, '>')
+    .replace(/&quot;/g, '"')
+    .replace(/&#39;/g, "'")
+    .replace(/&amp;/g, '&');
+}
+
+function countBlocks(source: string): number {
+  return source.trim() ? source.split(/\n{2,}/).filter(Boolean).length : 0;
+}
+
+export function htmlToBbcode(source: string): TranslationResult {
+  let output = source.replace(/<!--[\s\S]*?-->/g, '');
+  const warnings: string[] = [];
+  output = output.replace(/<h([1-3])\b[^>]*>/gi, (_, level: string) => `[h${level}]`);
+  output = output.replace(/<\/h([1-3])>/gi, (_, level: string) => `[/h${level}]`);
+  const replacements: [RegExp, string][] = [
+    [/<(?:strong|b)\b[^>]*>/gi, '[b]'], [/<\/(?:strong|b)>/gi, '[/b]'],
+    [/<(?:em|i)\b[^>]*>/gi, '[i]'], [/<\/(?:em|i)>/gi, '[/i]'],
+    [/<u\b[^>]*>/gi, '[u]'], [/<\/u>/gi, '[/u]'],
+    [/<(?:del|s|strike)\b[^>]*>/gi, '[s]'], [/<\/(?:del|s|strike)>/gi, '[/s]'],
+    [/<blockquote\b[^>]*>/gi, '[quote]'], [/<\/blockquote>/gi, '[/quote]'],
+    [/<code\b[^>]*>/gi, '[code]'], [/<\/code>/gi, '[/code]'],
+    [/<pre\b[^>]*>/gi, ''], [/<\/pre>/gi, ''],
+    [/<details\b[^>]*>/gi, '[spoiler]'], [/<\/details>/gi, '[/spoiler]'],
+    [/<summary\b[^>]*>.*?<\/summary>/gi, ''],
+    [/<ul\b[^>]*>/gi, '[list]'], [/<\/ul>/gi, '[/list]'],
+    [/<ol\b[^>]*>/gi, '[olist]'], [/<\/ol>/gi, '[/olist]'],
+    [/<li\b[^>]*>/gi, '[*]'], [/<\/li>/gi, '\n'],
+    [/<br\s*\/?>/gi, '\n'], [/<p\b[^>]*>/gi, ''], [/<\/p>/gi, '\n\n']
+  ];
+  for (const [pattern, replacement] of replacements) output = output.replace(pattern, replacement);
+  output = output.replace(/<a\b[^>]*href=["']([^"']+)["'][^>]*>([\s\S]*?)<\/a>/gi, '[url=$1]$2[/url]');
+  if (/<[a-z][^>]*>/i.test(output)) warnings.push('Unsupported HTML tags were removed from the BBCode result.');
+  output = decodeHtml(output.replace(/<[^>]+>/g, '')).replace(/[ \t]+\n/g, '\n').replace(/\n{3,}/g, '\n\n').trim();
+  const tagsCount = (source.match(/<\/?[a-z][^>]*>/gi) ?? []).length;
+  return { output, warnings, stats: { characters: output.length, tags: tagsCount, blocks: countBlocks(output) } };
+}

package/src/tool/steamBbcodeTranslator/html-renderer.ts

@@ -0,0 +1,71 @@
+import type { Node, TagNode } from './types';
+
+export function escapeHtml(value: string): string {
+  return value.replace(/[&<>"']/g, (character) => {
+    if (character === '&') return '&amp;';
+    if (character === '<') return '&lt;';
+    if (character === '>') return '&gt;';
+    if (character === '"') return '&quot;';
+    return '&#39;';
+  });
+}
+
+export function inlineHtml(nodes: Node[]): string {
+  return nodes.map((node) => node.kind === 'text' ? escapeHtml(node.value) : renderHtmlNode(node, true)).join('');
+}
+
+export function renderHtmlList(node: TagNode, ordered: boolean): string {
+  const items = node.children.filter((child): child is TagNode => child.kind === 'tag' && child.name === '*');
+  const tagName = ordered ? 'ol' : 'ul';
+  const listItems = items.map((item) => {
+    const inner = item.children.map((child) => {
+      if (child.kind === 'tag' && (child.name === 'list' || child.name === 'olist')) return renderHtmlNode(child);
+      if (child.kind === 'text') return escapeHtml(child.value);
+      return renderHtmlNode(child, true);
+    }).join('');
+    return `<li>${inner}</li>`;
+  }).join('');
+  return `<${tagName}>${listItems}</${tagName}>`;
+}
+
+function renderHtmlHeading(name: string, content: string): string | null {
+  if (name === 'h1') return `<h1>${content.trim()}</h1>`;
+  if (name === 'h2') return `<h2>${content.trim()}</h2>`;
+  if (name === 'h3') return `<h3>${content.trim()}</h3>`;
+  return null;
+}
+
+function renderHtmlInlineStyle(name: string, content: string): string | null {
+  if (name === 'b' || name === 'strong') return `<strong>${content}</strong>`;
+  if (name === 'i' || name === 'em') return `<em>${content}</em>`;
+  if (name === 'u') return `<u>${content}</u>`;
+  if (name === 's' || name === 'strike') return `<del>${content}</del>`;
+  return null;
+}
+
+function renderHtmlUrlOrCode(name: string, content: string, value?: string, inline = false): string {
+  if (name === 'url') return value ? `<a href="${escapeHtml(value)}">${content || escapeHtml(value)}</a>` : content;
+  if (name === 'code') return inline ? `<code>${content}</code>` : `<pre><code>${content}</code></pre>`;
+  return content;
+}
+
+function renderHtmlFormatNode(name: string, content: string, value?: string, inline = false): string {
+  const heading = renderHtmlHeading(name, content);
+  if (heading !== null) return heading;
+  const inlineStyle = renderHtmlInlineStyle(name, content);
+  if (inlineStyle !== null) return inlineStyle;
+  return renderHtmlUrlOrCode(name, content, value, inline);
+}
+
+export function renderHtmlNode(node: TagNode, inline = false): string {
+  const content = inlineHtml(node.children);
+  if (node.name === 'quote') return `<blockquote>${content}</blockquote>`;
+  if (node.name === 'spoiler') return `<details><summary>Spoiler</summary>${content}</details>`;
+  if (node.name === 'list') return renderHtmlList(node, false);
+  if (node.name === 'olist') return renderHtmlList(node, true);
+  return renderHtmlFormatNode(node.name, content, node.value, inline);
+}
+
+export function renderHtml(nodes: Node[]): string {
+  return nodes.map((node) => node.kind === 'text' ? escapeHtml(node.value) : renderHtmlNode(node)).join('').replace(/\n{2,}/g, '<br>');
+}

package/src/tool/steamBbcodeTranslator/i18n/de.ts

@@ -0,0 +1,207 @@
+import type { ToolLocaleContent } from '../../../types';
+import type { SteamBbcodeTranslatorUI } from '../ui';
+import { bibliographyEntries } from '../bibliography';
+
+export const content: ToolLocaleContent<SteamBbcodeTranslatorUI> = {
+  slug: 'steam-bbcode-konverter',
+  title: 'Steam BBCode, Markdown und HTML Konverter',
+  description: 'Konvertieren Sie zwischen Steam BBCode, Markdown und HTML in beide Richtungen mit automatischer Syntaxerkennung und Vorschau.',
+  ui: {
+    editorLabel: 'Fügen Sie Ihren Text ein',
+    editorHint: 'BBCode, Markdown oder HTML wird beim Tippen automatisch erkannt.',
+    detectedLabel: 'Erkannt',
+    detectedEmpty: 'Warten auf Text',
+    bbcode: 'Steam BBCode',
+    markdown: 'Markdown',
+    html: 'HTML',
+    clear: 'Leeren',
+    copy: 'Ausgabe kopieren',
+    copied: 'In Zwischenablage kopiert',
+    characters: 'Zeichen',
+    blocks: 'Blöcke',
+    privacyNote: 'Läuft lokal im Browser. Kein Upload.',
+    persistenceNote: 'Letzter Entwurf lokal gespeichert',
+    previewLabel: 'Vorschau',
+    previewEmpty: 'Ihre formatierte Vorschau erscheint hier.'
+  },
+  seo: [
+    {
+      type: 'title',
+      level: 2,
+      text: 'Warum Shopbeschreibungen einen Konverter benötigen'
+    },
+    {
+      type: 'paragraph',
+      html: 'Steam Shopbeschreibungen nutzen BBCode im Steamworks Editor. Pressekits oder Dokumentationen erwarten oft Markdown oder HTML. Die manuelle Konvertierung ist zeitraubend und fehleranfällig. Dieser Konverter generiert automatisch die anderen beiden Formate.'
+    },
+    {
+      type: 'title',
+      level: 2,
+      text: 'Unterstützte Formate und Tags'
+    },
+    {
+      type: 'paragraph',
+      html: 'Der Konverter erkennt Überschriften, Fett- und Kursivdruck, Links, Listen, Zitate und Spoiler. Er überträgt Strukturen nahtlos zwischen allen drei Formaten.'
+    },
+    {
+      type: 'stats',
+      columns: 4,
+      items: [
+        { label: 'Eingabeformate', value: '3' },
+        { label: 'Ausgaben pro Einfügen', value: '2' },
+        { label: 'Listen-Tiefe', value: 'Verschachtelt' },
+        { label: 'Verarbeitung', value: 'Nur im Browser' }
+      ]
+    },
+    {
+      type: 'title',
+      level: 2,
+      text: 'Verschachtelte Listen bleiben erhalten'
+    },
+    {
+      type: 'paragraph',
+      html: 'Statt blinder Ersetzung baut das Tool einen leichten Strukturbaum auf. So bleiben untergeordnete Listenpunkte genau an ihrer Position.'
+    },
+    {
+      type: 'table',
+      headers: ['Steam BBCode', 'Markdown', 'HTML'],
+      rows: [
+        ['[h1]Titel[/h1]', '# Titel', '&lt;h1&gt;Titel&lt;/h1&gt;'],
+        ['[b]Wichtig[/b]', '**Wichtig**', '&lt;strong&gt;Wichtig&lt;/strong&gt;'],
+        ['[i]Hinweis[/i]', '*Hinweis*', '&lt;em&gt;Hinweis&lt;/em&gt;'],
+        ['[url=https://example.com]Link[/url]', '[Link](https://example.com)', '&lt;a href="https://example.com"&gt;Link&lt;/a&gt;'],
+        ['[list][*]Eins[*]Zwei[/list]', '- Eins\n- Zwei', '&lt;ul&gt;&lt;li&gt;Eins&lt;/li&gt;&lt;li&gt;Zwei&lt;/li&gt;&lt;/ul&gt;']
+      ]
+    },
+    {
+      type: 'title',
+      level: 2,
+      text: 'Unterschiede zwischen Markdown und HTML'
+    },
+    {
+      type: 'paragraph',
+      html: 'Markdown ist gut lesbar, unterstützt aber Unterstreichungen nicht nativ. In solchen Fällen nutzt der Konverter Inline HTML.'
+    },
+    {
+      type: 'tip',
+      title: 'Praktische Überprüfung vor der Veröffentlichung',
+      html: 'Vergleichen Sie vor dem Veröffentlichen das Ergebnis in der Vorschau mit dem Originaldokument.'
+    },
+    {
+      type: 'title',
+      level: 2,
+      text: 'Datenschutz für Ihren Shoptext'
+    },
+    {
+      type: 'paragraph',
+      html: 'Die Konvertierung erfolgt vollständig lokal im Browser. Es werden keine Entwürfe auf externe Server hochgeladen.'
+    },
+    {
+      type: 'title',
+      level: 2,
+      text: 'Einschränkungen'
+    },
+    {
+      type: 'proscons',
+      title: 'Vor und Nachteile der Konvertierung',
+      items: [
+        {
+          pro: 'Verschachtelte Listen werden strukturell verarbeitet.',
+          con: 'Spezielle benutzerdefinierte Tags erfordern manuelle Nachbearbeitung.'
+        },
+        {
+          pro: 'Sofortige Live Aktualisierung beim Tippen.',
+          con: 'Steam-spezifische Widgets werden nicht konvertiert.'
+        }
+      ]
+    },
+    {
+      type: 'title',
+      level: 2,
+      text: 'Begriffsglossar'
+    },
+    {
+      type: 'glossary',
+      items: [
+        {
+          term: 'BBCode',
+          definition: 'Eine Tag-basierte Auszeichnungssprache für Steam-Shopseiten.'
+        },
+        {
+          term: 'Markdown',
+          definition: 'Eine einfache Textformatierung für Dokumentation und Web.'
+        },
+        {
+          term: 'HTML',
+          definition: 'Die Standard-Auszeichnungssprache für Webseiten.'
+        }
+      ]
+    }
+  ],
+  faqTitle: 'Häufig gestellte Fragen zur Konvertierung',
+  faq: [
+    {
+      question: 'Werden Texte an einen Server gesendet?',
+      answer: 'Nein. Die Konvertierung erfolgt vollständig lokal in Ihrem Browser.'
+    },
+    {
+      question: 'Werden verschachtelte Listen unterstützt?',
+      answer: 'Ja. Die Struktur wird vor der Generierung von Markdown oder HTML analysiert.'
+    },
+    {
+      question: 'Kann ich auch Markdown als Eingabe nutzen?',
+      answer: 'Ja. Das Format wird automatisch erkannt.'
+    }
+  ],
+  howTo: [
+    {
+      name: 'Text einfügen',
+      text: 'Fügen Sie Steam BBCode, Markdown oder HTML in den Editor ein.'
+    },
+    {
+      name: 'Automatische Erkennung nutzen',
+      text: 'Das Tool generiert sofort die anderen Formate.'
+    },
+    {
+      name: 'Ergebnis kopieren',
+      text: 'Kopieren Sie das gewünschte Zielformat.'
+    }
+  ],
+  schemas: [
+    {
+      '@context': 'https://schema.org',
+      '@type': 'SoftwareApplication',
+      name: 'Steam BBCode, Markdown und HTML Konverter',
+      applicationCategory: 'DeveloperApplication',
+      operatingSystem: 'Any',
+      offers: { '@type': 'Offer', price: '0', priceCurrency: 'EUR' }
+    },
+    {
+      '@context': 'https://schema.org',
+      '@type': 'FAQPage',
+      mainEntity: [
+        {
+          '@type': 'Question',
+          name: 'Werden Texte an einen Server gesendet?',
+          acceptedAnswer: {
+            '@type': 'Answer',
+            text: 'Nein. Die Konvertierung erfolgt vollständig lokal in Ihrem Browser.'
+          }
+        }
+      ]
+    },
+    {
+      '@context': 'https://schema.org',
+      '@type': 'HowTo',
+      name: 'So konvertieren Sie Steam BBCode, Markdown und HTML',
+      step: [
+        {
+          '@type': 'HowToStep',
+          name: 'Text einfügen',
+          text: 'Fügen Sie Steam BBCode, Markdown oder HTML in den Editor ein.'
+        }
+      ]
+    }
+  ],
+  bibliography: bibliographyEntries
+};