DialogDocumentViewer

Dialog über Links

Der Dialog wird einmal je Seite platziert und übernimmt danach jeden Link, der das Attribut data-siwf-documentviewer-type trägt. Name und Adresse liest er aus dem Link – im Markup steht deshalb keine Viewer-Konfiguration. Der letzte Link zeigt den Gegenfall: ohne das Attribut bleibt es ein gewöhnlicher Download.

<ul class="list-unstyled mb-0">
    <li class="mb-2">
        <a href="/documents/PdfDokument.pdf" data-siwf-documentviewer-type="pdf">PdfDokument.pdf</a>
    </li>
    <li class="mb-2">
        <a href="/documents/PdfDokument.pdf" data-siwf-documentviewer-type="pdf">
            <i class="material-icons">insert_drive_file</i>
            PdfDokument.pdf (348 KB)
        </a>
    </li>
    <li class="mb-2">
        <a href="/documents/beleg.jpg" data-siwf-documentviewer-type="image">beleg.jpg (296 KB)</a>
    </li>
    <li class="mb-2">
        <a href="/documents/Einsprachemail.msg" data-siwf-documentviewer-type="none">Einsprachemail.msg</a>
    </li>
    <li class="mb-2">
        <a href="/documents/PdfKorrupt.pdf" data-siwf-documentviewer-type="pdf">PdfKorrupt.pdf</a>
    </li>
    <li class="mb-2">
        <!-- Gegenbeispiel: ohne das Attribut bleibt es ein gewoehnlicher Link. Der Browser laedt
             die Datei herunter, der Dialog bleibt zu. -->
        <a href="/documents/PdfDokument.pdf" download>PdfDokument.pdf herunterladen</a>
    </li>
</ul>

Darstellung

Der DialogDocumentViewerBuilder wird über Fmh.DialogDokumentViewer() erzeugt und mit @Html.Fmh(...) gerendert:

@Html.Fmh(Fmh.DialogDokumentViewer())

Er packt denselben Viewer in einen modalen Dialog und schliesst ihn an alle Links an, die das Attribut data-siwf-documentviewer-type tragen. Name und Adresse übernimmt er aus dem Link — an den Links selbst steht deshalb keine Viewer-Konfiguration.

Platzierung: einmal je Seite, ausserhalb der <form>-Tags. Sinnvoll ist meist die Layout-Seite der Anwendung — dann funktionieren die Links auf jeder Seite, ohne dass jede Seite den Dialog mitbringt.

Konfiguration

Methode	Erklärung
`.DialogTitle(text)`	Titel der Dialog-Kopfzeile. Ohne Angabe der übersetzte Standardtext «Belegvorschau».
`.Document(url, name, type)`	Optionales Startdokument, das beim Laden der Seite bereits im Dialog steht. Für den Regelfall — Öffnen per Link — nicht nötig.

Das Attribut am Link

<a href="/documents/PdfDokument.pdf" data-siwf-documentviewer-type="pdf">PdfDokument.pdf</a>

Die Werte entsprechen dem Enum DocumentType in Kleinschreibung: pdf, image, none.

Ohne das Attribut passiert nichts. Der Link bleibt ein gewöhnlicher Link, der Browser lädt die Datei herunter. Das ist kein Fehler, sondern der Regelfall für alles, was nicht in die Vorschau soll:

<a href="/documents/PdfDokument.pdf" download>PdfDokument.pdf herunterladen</a>

Der Linktext ist frei – Symbole, Dateigrösse oder ein Icon ändern nichts daran, dass der Dialog Name und Adresse aus dem Link zieht:

<a href="/documents/PdfDokument.pdf" data-siwf-documentviewer-type="pdf">
    <i class="material-icons">insert_drive_file</i>
    PdfDokument.pdf (348 KB)
</a>

Statt den Wert zu tippen, lässt er sich aus dem Dateinamen ableiten:

<a href="/documents/Einsprachemail.msg"
   @Html.Raw(DocumentSupport.GibDokumentAttributFuerViewerDialog("Einsprachemail.msg"))>Einsprachemail.msg</a>

In einer Tabellen-Spaltenkonfiguration sieht das so aus:

sc.Custom(x => Html.ActionLink(
        x.Name,
        downloadActionName,
        downloadControllerName,
        new { id = x.DokumentEintragId },
        new
        {
            data_dokumentId = x.DokumentEintragId,
            data_siwf_documentviewer_type = DocumentSupport.GibTypAlsStringFuerViewer(x.Name),
            @class = "dokument-download",
        }),
    _FmhWebMvc.Document_Description)
    .IsSortable();

Nachgeladene Links

attachDocumentViewerForAttributedLinks() sucht die Links einmal beim Laden der Seite. Kommen Links später dazu — etwa durch eine nachgeladene Tabellenseite —, muss die Funktion erneut aufgerufen werden. Sie hängt ihre Behandlung vorher ab (.off('click.documentviewer')), ein zweiter Aufruf verdoppelt also nichts.

Ein Viewer je Seite

Der Dialog bringt dasselbe Skelett mit festen Ids mit wie der eigenständige Viewer. Beide zusammen auf einer Seite steuern sich gegenseitig — pro Seite also entweder der Dialog oder ein eigenständiger Viewer.