Zum Inhalt springen

Modul:UI

Aus Wikonia

Dokumentation für Modul:UI[Quelltext bearbeiten]

Dieses Modul stellt ein zentrales UI-Rendering-Backend für Wikonia bereit. Es dient als Setzkasten zur Darstellung von Box-Elementen, unabhängig von deren Kontext oder Platzierung.

Hinweis: Das Modul ist positionsagnostisch. Die semantische Einordnung (z. B. „oben auf der Seite anzeigen“) erfolgt in Middleware-Modulen wie Modul:Hinweisbox.

Funktionen[Quelltext bearbeiten]

box(args)[Quelltext bearbeiten]

Erzeugt eine visuelle Box mit optionalen Bereichen (Icon, Titel, Kommentar etc.).

Parameter[Quelltext bearbeiten]

Name Typ Beschreibung
type Zeichenkette Farbtyp der Box, z. B. warn, info, neutral

→ erzeugt CSS-Klasse wikonia-box--type

class Zeichenkette Zusätzliche CSS-Klassen (z. B. tight, shadow)
id Zeichenkette Optionaler id-Wert zur gezielten Verlinkung
icon Zeichenkette Dateiname eines Commons-Bildes (ohne Datei:)
iconsize Zeichenkette Größe des darzustellenden Icons (Standard: 24px)
title Zeichenkette Überschrift innerhalb der Box
content Zeichenkette Hauptinhalt der Box – Pflichtfeld
comment Zeichenkette Optionaler Zusatzkommentar
link Zeichenkette Weiterführender Link oder Aktion
signature Zeichenkette Angabe zur Herkunft (Autor, Zeitstempel o. ä.)

Ausgabe (HTML-Struktur)[Quelltext bearbeiten]

<div class="wikonia-box wikonia-box--[type] [class]" id="[id]">
  <div class="wikonia-box__icon"></div>
  <div class="wikonia-box__title"></div>
  <div class="wikonia-box__content"></div>
  <div class="wikonia-box__comment"></div>
  <div class="wikonia-box__link"></div>
  <div class="wikonia-box__signature"></div>
</div>

Nur die tatsächlich gesetzten Parameter führen zu Ausgabe-Elementen. Nicht verwendete Bereiche bleiben ungerendert.

Sonderfall: type = hilfe[Quelltext bearbeiten]

Bei type = hilfe wird eine kompakte, einzeilige Box ausgegeben, die speziell für kurze Hilfetipps gedacht ist. Der Titel und der Inhalt erscheinen direkt nebeneinander, ergänzt um ein Icon (z. B. Glühbirne). Ein optionaler Kommentar wird eingerückt darunter dargestellt.

<div class="wikonia-box wikonia-box--type-hilfe wikonia-box--inline [class]" id="[id]">
  <span class="wikonia-box__icon"></span>
  <strong class="wikonia-box__title"></strong>
  <span class="wikonia-box__content"></span>
  <div class="wikonia-box__comment"></div>
</div>

Diese Variante wird automatisch aktiviert, sobald type = hilfe gesetzt ist – typischerweise durch Module wie Modul:UIBox in Verbindung mit {{Hilfetipp}}.

Hinweis: Die visuelle Darstellung hängt von den definierten Farben in der Wikonia-Farbwelt (--color-hilfe) ab.

Verwendung[Quelltext bearbeiten]

Typischerweise wird dieses Modul von Wrapper-Modulen wie Modul:Hinweisbox oder Modul:Baustein aufgerufen, nicht direkt in Vorlagen.


-- Modul:UI – Basisstruktur für visuelle Box-Elemente
-- Dieses Modul stellt eine generische Setzkasten-Funktion zum Aufbau von Hinweis-/Info-/Systemboxen bereit.
-- Es rendert keine Positionierungslogik, sondern liefert rein das HTML/CSS-Strukturelement zur Darstellung.
-- Erweiterbare Felder: icon, title, content, comment, link, signature
-- Geplante Ausbaustufen:
--   * p.inline(args): für Fließtext-Bausteine (span)
--   * p.overlay(args): für globale Hinweise oder Banner (z. B. Beta-Hinweise)
--   * p.menu(args): für UI-Elemente wie Tabs, Seitennavigation
--   * p.container(args): für strukturierte Infoboxen (Cargo-Unterstützung)
--   * p.style(args): für gezielte Style-Ausgaben oder CSS-Erweiterungen
-- Achtung: Das Modul ist absichtlich positionsagnostisch – Kontext (z. B. "zeige oben auf Seite") regelt die Middleware.

local p = {}

-- Hauptfunktion: box(args)
-- Liefert standardisierte Box-Ausgabe abhängig vom Typ (z. B. "info", "warnung", "hilfe")
-- Spezialbehandlung für type="hilfe": kompakter Inline-Modus mit optionalem Kommentar
function p.box(args)
  
  -- ✱ Spezialfall: Kompakter Hilfetipp (type = "hilfe") mit einzeiliger Darstellung
  if args.type == "hilfe" then
    local html = mw.html.create("div")
      :addClass("wikonia-box")                         -- generische Boxklasse
      :addClass("wikonia-box--type-hilfe")             -- Farbdefinition
      :addClass("wikonia-box--inline")                 -- spezielles Inline-Layout
      :addClass(args.class or "")                       -- zusätzliche benutzerdefinierte Klassen

    -- Icon (Pflicht für Wiedererkennung; z. B. Glühbirne)
    if args.icon then
      html:tag("span")
        :addClass("wikonia-box__icon")
        :wikitext("[[Datei:" .. args.icon .. "|16px|class=noviewer]]")
    end

    -- Titel (fett, einzeilig, endet mit Doppelpunkt)
    if args.title then
      html:tag("strong")
        :addClass("wikonia-box__title")
        :wikitext(args.title .. ":")
    end

    -- Inhalt (direkt anschließend, als Fließtext)
    html:tag("span")
      :addClass("wikonia-box__content")
      :wikitext(args.content or "")

    -- Kommentar (optional, erscheint eingerückt darunter)
    if args.comment then
      html:tag("div")
        :addClass("wikonia-box__comment")
        :wikitext(args.comment)
    end

    return tostring(html)
  end

  -- ✱ Standardfall für alle anderen Boxen
  local html = mw.html.create("div")
    :addClass("wikonia-box")

  -- Farbklassenzuweisung
  if args.type then
    html:addClass("wikonia-box--" .. args.type)
  else
    html:addClass("wikonia-box--neutral")
  end

  -- Benutzerdefinierte Zusatzklassen
  if args.class then
    html:addClass(args.class)
  end

  -- ID-Attribut (z. B. für Anker)
  if args.id then
    html:attr("id", args.id)
  end

-- Icon (optional)
	if args.icon then
	  local size = args.iconsize or "24px"
	  local icon = mw.html.create("div")
	    :addClass("wikonia-box__icon")
	    :wikitext("[[Datei:" .. args.icon .. "|" .. size .. "|class=noviewer]]")
	  html:node(icon)
	end

  -- Titel (optional)
  if args.title then
    local title = mw.html.create("div")
      :addClass("wikonia-box__title")
      :wikitext(args.title)
    html:node(title)
  end

  -- Hauptinhalt (Pflichtfeld)
  local content = mw.html.create("div")
    :addClass("wikonia-box__content")
    :wikitext(args.content or "")
  html:node(content)

  -- Kommentar (optionaler Zusatztext unterhalb)
  if args.comment then
    local comment = mw.html.create("div")
      :addClass("wikonia-box__comment")
      :wikitext(args.comment)
    html:node(comment)
  end

  -- Linkbereich (optional, z. B. für „Weitere Infos“)
  if args.link then
    local link = mw.html.create("div")
      :addClass("wikonia-box__link")
      :wikitext(args.link)
    html:node(link)
  end

  -- Signatur oder Verfasserhinweis (optional)
  if args.signature then
    local sig = mw.html.create("div")
      :addClass("wikonia-box__signature")
      :wikitext(args.signature)
    html:node(sig)
  end

  return tostring(html)
end

return p