Information

Möchte man Informationen vom App-Server zum HTMLUI schicken, so muss man dem UI ein Event schicken. In der Vergangenheit gab es nur ein Listener der an das Dokument gebunden war. In diesem Eventhandler hat man alle möglichen Events abgearbeitet. Mit der Möglichkeit in der Android-App HTMLUIs zu erlauben, gab es Probleme bei dem Document-Eventhandler, so dass nun Eventhandlers im Client Objekt definiert werden. Da eventuell bald der alte Weg für die Events entfernt wird, ist es somit notwendig auf die neue Methodik zu migrieren. Der Vorgang und die Variablen bleiben fast der selbe.

Mit dem veralteten Document Eventhandler

#!javascript

document.addEventListener('eventReceived', function(event){ 
    var key = event.eventKey;
    var data = event.eventData;
    if(key == "onWin") {
        alert("Du hast gewonnen");
    } else if(key == "onLose") {
        alert("Du hast verloren");
    }
});

Mit dem neuen Client Eventhandler

#!javascript
Client.addEventListener('onWin', function(event){ 
    var key = event.type;    //obsolet da es nur onWin sein kann
    var data = event.data;

    alert("Du hast gewonnen");
});
Client.addEventListener('onLose', function(event){ 
    var key = event.type; //obsolet da es nur onLose sein kann
    var data = event.data;

    alert("Du hast gewonnen");
});

Unterschiede

Die Unterschiede sind sehr gering. Auffällig ist vorallem, dass man nun die Events je nach Key Codetechnisch voneinander trennen kann. Ebenfalls wurden die Variablennamen für den Key und der Data verändert von eventKey/eventData zu nur noch key/data.

Migration bestehender Projekte

Damit der Aufwand möglichst gering bleibt um ein bestehendes Projekt zu migrieren, gibt es ebenfalls die Möglichkeit wie vorher alle Events abzufangen, unabhängig vom Keyword. Dazu wird als Keyword ein "*" gesetzt.

#!javascript

Client.addEventListener('*', function(event){ 
    var key = event.type;
    var data = event.data;
    if(key == "onWin") {
        alert("Du hast gewonnen");
    } else if(key == "onLose") {
        alert("Du hast verloren");
    }
});