Improve homepage.

This commit is contained in:
Daniel Kraus 2015-09-06 18:14:06 +02:00
parent 95dfa95562
commit a290de26e7
3 changed files with 297 additions and 159 deletions

BIN
www/img/firstrun.png Executable file

Binary file not shown.

After

Width:  |  Height:  |  Size: 21 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 7.0 KiB

After

Width:  |  Height:  |  Size: 6.6 KiB

View File

@ -10,6 +10,10 @@
<link href="css/bootstrap.min.css" rel="stylesheet">
<link href="css/jumbotron-narrow.css" rel="stylesheet">
<style>
h5 { font-weight:bold; }
</style>
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
@ -22,12 +26,24 @@
das die Zentrale Arztbriefablage um Funktionen für das Formatieren von
Laborwerten erweitert.">
<link rel="icon" type="image/png" href="img/icon.png">
<style>
floatbox {
padding: 0;
margin: 0 0.5em;
}
</style>
</head>
<body>
<div class="container">
<div class="header clearfix">
<nav>
<ul class="nav nav-pills pull-right">
<li>
<a href="#anleitung">Anleitung</a>
</li>
<li>
<a href="#anpassen">Anpassen</a>
</li>
<li>
<a href="downloads/">Download</a>
</li>
@ -58,61 +74,134 @@
</p>
</div>
<div class="row">
<div class="col-md-6">
<div class="panel panel-default">
<div class="panel-heading">
<h2 class="panel-title">Vorher</h2>
</div>
<div class="panel-body">
<img class="img-responsive center-block" src="img/vorher.png" alt="Vorher">
</div>
</div>
</div>
<div class="col-md-6">
<div class="panel panel-default">
<div class="panel-heading">
<h2 class="panel-title">Nachher</h2>
</div>
<div class="panel-body">
<img class="img-responsive center-block" src="img/nachher.png" alt="Nachher">
</div>
<div class="panel-footer">
<p>Am Beispiel des Ambulanz-Stils</p>
</div>
</div>
</div>
</div>
<div class="row">
<div class="col-md-12">
<div class="clearfix">
<h2 class="page-header">
<img class="pull-right img-responsive" src="img/ribbon.png" alt="zaaReloaded2-Ribbon" />
<h2 class="page-header" id="anleitung">
Anleitung
</h2>
<ol>
<li>
<p>
<img class="center-block img-responsive" src="img/firstrun.png" alt="Begrüßungsfrage">
</p>
<p>
Beim allerersten Mal, wenn das Add-in zusammen mit Word
gestartet wird, wird man gefragt, in welchem Modus das
Add-in operieren soll. Im <em>Ärztemodus</em> wird man ggf.
aufgefordert, Zusatzinformationen zu Laborparametern (z.B.
Ziel-Spiegel von Medikamenten) anzugeben; im
<em>Sekretariatsmodus</em> unterbleiben solche Nachfragen.
</p>
<div class="panel panel-primary">
<div class="panel-heading">
<h3 class="panel-title">
1. Labor einfügen
</h3>
</div>
<div class="panel-body">
<p>
<img class="center-block img-responsive" src="img/vorher.png" alt="Vorher">
</p>
</div>
<div class="panel-footer">
<p>
Laborwerte auf üblichem Wege in einen Arztbrief einfügen
(alternativ kann der Befehl "Demo" ausgeführt werden, dann wird
ein Beispieldokument mit Laborwerten geöffnet).
</li>
<li>
<img class="pull-right img-responsive" src="img/stilauswahl.png" alt="Stil auswählen" />
(alternativ kann der Befehl "Demo" ausgeführt werden,
dann wird ein Beispieldokument mit Laborwerten
geöffnet).
</p>
</div>
</div>
<div class="panel panel-primary">
<div class="panel-heading">
<h3 class="panel-title">
2. zaaReloaded-Funktion aufrufen
</h3>
</div>
<div class="panel-body">
<p>
<img class="center-block img-responsive" src="img/ribbon.png" alt="zaaReloaded2-Ribbon">
</p>
</div>
<div class="panel-footer">
<p>
Im zaaReloaded-Tab (s.o.) den linken Knopf "Formatieren"
klicken.
</li>
<li>
Beim ersten Mal erscheint eine Liste mit Stilen, aus der man den
gewünschten Stil auswählt (siehe Abbildung). Beim nächsten Mal,
wenn man auf diesen Knopf drückt, wird der zuletzt verwendete Stil
genommen.
</li>
<li>
</p>
</div>
</div>
<div class="panel panel-primary">
<div class="panel-heading">
<h3 class="panel-title">
3. Ggf. Stil auswählen
</h3>
</div>
<div class="panel-body">
<p>
<img class="center-block img-responsive" src="img/stilauswahl.png" alt="Stil auswählen">
</p>
</div>
<div class="panel-footer">
<p>
Beim ersten Mal erscheint eine Liste mit Stilen, aus der
man den gewünschten Stil auswählt (siehe Abbildung).
Beim nächsten Mal, wenn man auf diesen Knopf drückt,
wird der zuletzt verwendete Stil genommen.
</p>
</div>
</div>
<div class="panel panel-primary">
<div class="panel-heading">
<h3 class="panel-title">
4. Ggf. Kommentar ergänzen
</h3>
</div>
<div class="panel-body">
<p>
<img class="center-block img-responsive" src="img/itemcommentview.png" alt="Kommentar eingeben">
</p>
</div>
<div class="panel-footer">
<p>
Sofern der <em>Ärztemodus</em> eingestellt ist, können
für bestimmte Laborparameter Zusatzkommentare eingegeben
werden, z.B. um den Zielspiegelbereich eines
Medikamentes anzugeben.
</p>
<p>
Wenn man diesen Dialog mit "Abbrechen" oder
<kbd>ESC</kbd> beendet, erscheint ein gelb markierter
Hinweis im formatieren Laborblock.
</p>
<p>
Wenn man hingegen keinen Kommentartext eingibt, wird
kein Kommentar eingefügt, also auch das Präfix (hier
"(Ziel-Talspiegel:") und das Suffix (hier "µg/l)")
nicht.
</p>
</div>
</div>
<div class="panel panel-primary">
<div class="panel-heading">
<h3 class="panel-title">
5. Fertig!
</h3>
</div>
<div class="panel-body">
<p>
<img class="center-block img-responsive" src="img/nachher.png" alt="Nachher">
</p>
</div>
<div class="panel-footer">
<p>
Einen Moment warten... Voilà.
</li>
</ol>
</p>
</div>
</div>
<h2 class="page-header">
@ -123,112 +212,161 @@
diese bei Bedarf im Hintergrund.
</p>
<h2 class="page-header">
<h2 class="page-header" id="anpassen">
Anpassen
</h2>
<p>
Das Addin enthält einen Stil-Editor, mit dem die eingebauten Stile
bearbeitet und neue Stile entworfen werden können:
zaaReloaded liest die Laborwerte aus einem Arztbrief ein,
analysiert sie, und gibt sie entsprechend einem vom Benutzer
programmierbaren Stil wieder aus.
</p>
<p class="text-center">
<img src="img/stilbearbeiten.png" alt="Stil bearbeiten" />
</p>
<p class="clearfix">
<img src="img/elementpicker.png" alt="Elemente" class="pull-right" />
Jeder Stil setzt sich aus sog. <i>Elementen</i> zusammen. Es gibt
<i>Steuerelemente</i>, die zum Beispiel für die Auswahl eines Tages
(erster Tag/letzter Tag) zuständig sind, und es gibt
<i>Ausgabeelemente</i>, die die eigentliche Formatierung und Ausgabe
der Laborwerte übernehmen.
</p>
</div>
</div>
<div class="row">
<div class="col-sm-6">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">
Steuerelemente
</h3>
</div>
<div class="panel panel-default col-lg-7 col-md-5 pull-right floatbox">
<div class="panel-body">
<ul>
<li>Ersten Tag auswählen</li>
<li>Letzten Tag auswählen</li>
<li>Jeden Tag nacheinander auswählen</li>
<li>Zwei Spalten einfügen/zur nächsten Spalte wechseln</li>
</ul>
<img class="img-responsive center-block" src="img/stilbearbeiten.png" alt="Stil bearbeiten">
Screenshot des Stil-Editors
</div>
</div>
</div>
<div class="col-sm-6">
<div class="panel panel-default">
<div class="panel-heading">
<h3 class="panel-title">
<p>
Das Addin enthält einen Stil-Editor, mit dem die eingebauten Stile
bearbeitet und neue Stile entworfen werden können. Stile
können importiert und exportiert werden.
</p>
<p>
Bei einem Stil kann definiert werden, ob pathologische
Laborwerte auf bestimmte Weise hervorgehoben werden sollen
(fett, kursiv, unterstrichen), und in welchen Situationen
der Referenzbereich ausgegeben werden soll: Niemals, immer
oder bei pathologischen Werten und/oder Parametern, die
intern als "speziell" markiert sind (<a href="#parameter">s.u.</a>).
</p>
<p>
Die Stile bestehen aus sogenannten Elementen, die der Reihe
nach abgearbeitet werden. Ein Element ist entweder ein
<em>Steuerelement</em> oder ein <em>Ausgabeelement</em>.
</p>
<h3>
Ausgabeelemente
</h3>
</div>
<p>
<em>Ausgabeelemente</em> sind für die Ausgabe von Laborwerten
oder anderem Text zuständig. Ein Beliebiger-Text-Element gibt
ganz einfach den Text aus, den es enthält. Auf diese Weise
kann man z.B. zusätzliche Zeilen in die Laborausgabe einfügen
für Werte, die nicht aus dem Lauris übernommen werden, etwa
ein Nephrologisches Sediment, das dann noch händisch
vervollständigt werden muß.
</p>
<div class="panel panel-default col-lg-7 col-md-5 pull-right floatbox">
<div class="panel-body">
<ul>
<li>Laborparameter</li>
<li>Beliebiger Text</li>
</ul>
</div>
</div>
<img class="img-responsive center-block"
src="img/elementbearbeiten.png" alt="Laborparameter-Element bearbeiten">
Laborparameter-Ausgabeelement
</div>
</div>
<div class="row">
<div class="col-md-12">
<h4>
Laborparameter-Element
</h4>
<p>
"Beliebiger Text" kann, wie der Name schon sagt, beliebigen Text
enthalten, der nicht weiter bearbeitet wird. Auf diese Weise kann
man z.B. Platzhalter für Urinsedimente ausgeben lassen, die dann
noch händisch vervollständigt werden.
Die eigentliche Power des Add-ins liegt in
Laborparameter-Elementen. Jedes Element gibt einen Absatz mit
Laborwerten aus, die frei definiert werden können (vgl.
Abbbildung).
</p>
<p>
"Laborparameter" enthalten eine durch Kommata getrennte Auflistung
von Parametern, die ausgegeben werden sollen. Jedes Element
"Laborparameter" kann optional einen Titel enthalten:
Man schreibt einfach die gewünschten Parameter durch Kommata
getrennt in das Eingabefeld. Optional kann man durch einen
Doppelpunkt getrennt eine Beschriftung voranstellen. In der
Abbildung ist das "Klinische Chemie".
</p>
<h5 id="parameter">
Parameter-Bezeichnungen
</h5>
<p>
zaaReloaded2 verwendet teilweise eigene Bezeichnungen für
Parameter, bspw. "Na" für Natrium, während in der originalen
Lauris-Ausgabe "Natrium" steht. Momentan gibt es noch keine
Möglichkeit, die bekannten Parameter im Add-in selbst
einzusehen; die Liste steht aber im Quellcode: <a
href="http://git.bovender.de/?p=zaaReloaded2.git;a=blob;f=zaaReloaded2/Defaults/parameters.txt"
target="_blank">git.bovender.de/.../paramteters.txt</a>. In
der Datei ist für manche Parameter auch die gewünschte Zahl
an Dezimalstellen hinterlegt sowie die Angabe, ob in der
Referenzbereich auch bei normalem Wert mit ausgeben werden
soll (abhängig von der Stil-Einstellung).
</p>
<h5>
Kommentare
</h5>
<p>
<img class="img-responsive center-block" src="img/itemcomment.png" alt="Parameter-Kommentar">
</p>
<p>
Beispiel:
</p>
<blockquote>
<p>
<img src="img/elementbearbeiten.png" alt="Element bearbeiten" />
Wenn hinter einem Parameter-Namen ein Text in
Anführungszeichen eingegeben wird, wird dieser Text als
<em>Kommentar</em> ausgewertet (siehe Abbildung oben). Beim
Formatieren wird dieser Kommentar mit einer
Eingabe-Aufforderung angezeigt, wobei der Text zwischen den
spitzen Klammern (im Beispiel "&lt;*** BITTE ANGEBEN
***&gt;") als Vorgabe verwendet wird (die spitzen Klammern
verschwinden natürlich):
</p>
<p>
Klinische Chemie: Na, K, Cl, (usw.)
</p>
</blockquote>
<p>
In diesem Fall ist "Klinische Chemie:" der optionale Titel.
<img class="img-responsive center-block" src="img/itemcommentview.png" alt="Eingabeaufforderung für Kommentar">
</p>
<p>
Die Bezeichnungen der einzelnen Parameter sind fest einprogrammiert.
Teils decken sie sich mit den Bezeichnungen, wie sie in der
Zentralen Arztbriefablage erscheinen; teils sind sie aber auch
Surrogate (z.B. "eGFR (CKD-EPI)" anstatt "glomerul. Filtrationsr.
CKD-EP").
In den <em>Einstellungen</em> können die
Eingabe-Aufforderungen für Kommentare im Sinne eines
<em>Sekretariatsmodus</em> ausgeschaltet werden. Dann wird
der Kommentar in der Ausgabe <mark>gelb
hervorgehoben</mark>.
</p>
<h5>
Platzhalter
</h5>
<p>
Die Platzhalter "SU-*", "U-*" und "*" geben die noch nicht
verwendeten Werte für Sammelurin, Spontanurin und alles weitere aus.
"*" sollte daher als letztes verwendet werden.
Mittels <em>Platzhaltern</em> ("Jokern", "Wildcards") können
alle Laborwerte ausgegeben werden, die bis dahin noch nicht
explizit ausgewählt wurden. Wenn man "*" verwendet, werden
alle noch nicht selektierten Werte ausgegeben. Mit "U-*"
werden nur die noch nicht verwendeten Werte des Spot-Urins
ausgegeben und mit "SU-*" die noch nicht verwendeten Werte
des Sammelurins.
</p>
<p>
Die Liste der möglichen Parameternamen ist momentan fest
einprogrammiert und kann auch noch nicht angezeigt werden. Man kann
beim Entwickeln eines Stils aber probehalber den Platzhalter "*"
verwenden und sieht dann, welche Parameternamen noch verwendet
werden könnten.
</p>
</div>
</div>
<h4>
Beliebiger Text
</h4>
<p>
Das Ausgabe-Element "Beliebiger Text" macht genau das:
Beliebigen Text ausgeben, der nicht weiter bearbeitet wird.
Auf diese Weise kann man z.B. Platzhalter für Urinsedimente
ausgeben lassen, die dann noch händisch vervollständigt
werden müssen.
</p>
<h3>
Steuerelemente
</h3>
<p>
Mit <em>Steuerelementen</em> kann z.B. die Auswahl eines Datums
für die Laborausgabe (erster/letzter Tag usw.) kontrolliert oder
auch der Dokumentfluß gesteuert werden, wobei bislang nur die
Ausgabe in zwei Spalten implementiert ist.
</p>
<p>
Steuerelemente zur Auswahl von bestimmten Daten
(erster/letzter Tag usw.) enthalten <em>Kindelemente</em>. Nur
Ausgabeelemente können Kindelemente sein. Ein Steuerelement
wählt die Laborwerte für das entsprechende Datum aus und
übergibt sie den Kindelementen, die die Laborwerte ausgeben.
Mit dem Steuerelement <em>Jeder Tag</em> werden alle
Laborwerte nach Kalendertagen sortiert, und die Kindelemente
geben die Werte für jeden Kalendertag aus.
</p>
</div>
</div>
</div>
<footer class="footer">
<p>