Fortgeschrittene Nutzer der JS-API haben u.a. die Möglichkeit auf Events zu lauschen, Actions auszuführen und die Layout-Config zu überschreiben. Dies kann immer dann sinnvoll sein, wenn man gewisse Aktionen messen oder die Vergleichsrechner / den Kunden-Login noch lückenloser in die eigene Software implementieren möchte.
Aus wirtschaftlichen Erwägungen heraus ist es uns nicht möglich für jede nur erdenkliche Einsatzmöglichkeit / Einzelanforderung unserer Software eine fertige Lösung zu präsentieren oder diese gar über ein spezielles Backend für Laien zur Verfügung zu stellen. Mit den durch unsere JS-API gebotenen Möglichkeiten ist es aber bereits mittelguten Webentwicklern möglich (fast) alle Wünsche mit minimalem Aufwand zu implementieren.
Events
| Event | Parameter | Beschreibung |
| onresize | height, width | Wenn sich die Größe des iFrames ändert. |
| onload | – | Wenn der Inhalt des iFrames geladen wurde und die serverseitige JS-API initialisiert ist. |
| onunload | – | Wenn der iFrame neu geladen wird, window on(before)unload-Event. |
| ontitle | title | Wenn der Titel gesetzt werden soll. (Bei Lightboxen im Loghtbox-Header, bei Modulen document.title) |
| ondestroy | – | Wenn das Modul zerstört werden soll. |
| onquotation | action(„started“, “abborded“) | Wenn die Berechnung gestartet oder abgebrochen wird. (Nur im Rechner-Kontext verfügbar.) |
| ondetailedcomparison | – | Wenn der Detailvergleich / Deckungsvergleich geöffnet wird. (Nur im Rechner-Kontext verfügbar.) |
| onoffer | action(„form“, “completed“, “abborded“) | Wenn das Beantragen-Formular geöffnet, gesendet oder abgebrochen wird. (Nur im Rechner-Kontext verfügbar.) |
Beispiel (mit blauML):
Actions
| Action | Parameter | Beschreibung |
| dotooltip | action(„show“, „hide“), id(tooltip), position(object {top:xx, left:xx}), html(content), classNames(array[ css-klassen ]) | Erzeugt einen Tooltip. |
| docss | array css [{css:“css code“, base:“domain aus der das css kommt“}, {…}, …] | Überträgt den definierten Style für Tooltips, Buttons, etc. |
| dolightbox | id, action(„open“, „update“, „close“), type(„inline“, „iframe“, „file“), title, content(html) / src(src), offset(object {height:xx, width:xx}), title, show_header | Erzeugt eine Lightbox. Je nach type ist content oder src zulässig. |
| dodestroy | – | Zerstört das Modul. |
Beispiel #3 (mit blauML):
Layout-Config
Die Layout-Config-Parameter sind Parameter, die in jedem JS-API-Kontext zur Verfügung stehen und bei denen es i.d.R. Sinn macht diese global zu definieren. Deshalb können diese Parameter gleich beim Laden der JS-API gesetzt werden.
| Context | Config | Beschreibung | Default |
| * | vermittler | Vermittler-Nummer. Der Vermittler benötigt die Lizenz „JS-API“. | NULL |
| * | titlepattern | Ersetzt den Title. Beispiel: „{title} :: Wacholder Versicherungen“ false um die Title-Ersetzung zu deaktivieren. |
{title} |
| spinner | img | Pfad zur Spinner-Grafik. |  |
| spinner | css | CSS für die verwendeten CSS-Klassen, sofern img gesetzt. | – |
| spinner | container | ID eines HTML-Elementes, welches als Spinner genutzt werden soll. Sofern gesetzt werden spinner.img und spinner.css ignoriert. | NULL |
| lightbox | css | CSS für die verwendeten CSS-Klassen der Lightbox. | – |
| lightbox | background | Pfad zur Transparenz-Grafik. |  |
Beispiel #4 (mit blauML):
Weitere optionale Parameter (Vergleichsrechner)
Die hier aufgeführten weiteren optionalen Parameter für Vergleichsrechner stehen nur im Vergleichsrechner-Kontext zur Verfügung. Daher können diese Parameter nicht global beim Laden der JS-API gesetzt werden sondern müssen bei der Einbindung des jeweiligen Vergleichsrechners mitgegeben werden.
| Variable | Typ | Beschreibung |
| Job_titel_button | Object | Gibt an welche Icons in der Titelleiste angezeigt werden sollen. Mgl. Werte: hilfe, drucken, filter, lexikon, speichern, oeffnen, dokumentation, tariffinder. |
| Job_design | int | Gibt an in welchem Layout die Ergebnisse erscheinen. 0 = einzeilig; 1 = zweizeilig mit der Logo der Gesellschaft; 3 = zweizeilig ohne Logo der Gesellschaft. |
| Job_titel_anzeige | boolean | Gibt an ob die Titel-Leiste ausgegeben werden soll. |
| Job_titel_zeile | String | Überschreibt den Titel. |
| Job_header_bild_anzeige | boolean | Blendet das Bild unter dem Titel aus. |
| Page_css_disabled | boolean | Blendet alle CSS-Dateien vom Server maklerinfo.biz aus. |
| Job_css | Array | Fügt weitere CSS-Definitionen in die Website ein. |
Achtung: Komplexe Datentypen (Arrays, Objekte) werden in blauML bspw. folgendermaßen dargestellt:
Job_titel_button="json{'hilfe':0, 'drucken':0}"
Zum Vergleich ohne blauML:
new blau.api.Rechner("...",{"Job_titel_button[hilfe]":0,"Job_titel_button[drucken]":0})
Anmerkung in eigener Sache
Mit der JS-API stellt blau direkt Ihnen eine Vielzahl an Möglichkeiten zu Verfügung. Es gilt aber wie immer im Leben: Nur weil ich etwas kann, muss ich es noch lange nicht tun.
In manchen Konstellationen kann ein Einsatz der o.g. Mittel durchaus sinnvoll sein – in den meisten wird er aber zur Verschlimmbesserung führen. Hobby-Bastler möchte ich an dieser Stelle auf einen Blog-Artikel von Oliver verweisen.
oh, sieht kompliziert aus;-)Aber mit Altersversorgung kenne ich mich aus…
Das sieht ja richtig nach Programmierarbeit aus. Leider nicht mein Fachgebiet. Da lob ich mir doch die gekaufte Homepage von BD. Da braucht man sich darum auf jeden Fall nicht mehr kümmern…
Gruß
Sebastian Ohligschläger
http://www.kanzlei-ohligschlaeger.de
Hallo, gibt es auch die Möglichkeit den Ergebnis-Datensatz als json abzurufen und das rendering der Informationen komplett selber zu machen? Und wenn ja, gibt es eine eindeutige ID für die einzelnen Ergebnisse der Suche? Dann könnte man die Informationen ja mit eigenen Informationen anreichern.
Hallo Herr Teske,
in der aktuellen Rechner-Version ist dies leider noch nicht möglich. Etwas ähnliches ist aber bereits für die nächste Rechner-generation geplant. Das kann aber noch etwas dauern.
Mit freundlichen Grüßen
Hallo Hannes!
Kann ich die „Hilfe-Texte“ in den „Infoboxen“ über die JS-API verändern?
Liebe Grüße!
Eine Frage vergessen: Kann der „Beantragen / Abschluss“-Button neben dem Angebot gesetzt werden bei der JS-API?
Hallo Ivo,
theoretisch kannst du die Action „dotooltip“ natürlich abfangen und entsprechend manipulieren. Zur Tooltip-Identifikation hast du allerdings nur den Tooltip-Text zur Verfügung.
Hallo Hannes, wie sieht es mit dem „Beantragen Button“ aus. Kann ich diesen im Ranking neben dem jeweiligen Produkt darstellen statt „drüber“? Das ist das einzige das uns an der Umsetzung noch hindern würde.
Liebe Grüße,
Ivo
Hallo Ivo,
mit JS:
new blau.api.Rechner("..",{directorder:true})mit blauML:
<blau:rechner ... directorder="true" />