Gameviewer

Andre Schemschat

Der Gameviewer basiert auf verschiedenen Technologien, die ineinandergreifen um alle Aspekte aufzubereiten. An unterster Stelle steht eine Django-Applikation die sich um das Anzeigen der Webseiten kümmert und die Callbacks für die Datenanfragen liefert.

Django ist ein in Python geschriebenes Webframework, dass sehr stark auf dem Model-View-Controller-Konzept beruht. Dabei liefert es eine All-in-One-Lösung die es dem Entwickler erlaubt sehr schnell vorhandene Komponenten zu verwenden und in wenigen Schritten eine Webapplikation zusammenzustellen. Zu diesen Komponenten gehören unter anderem eine Template-Engine, ein Datenbank-ORM, eine Formular-Verwaltung, automatisierte Daten-Backends und teilautomatisierte Authentifizierung neben dem Kern der Anfrage-Verwaltung.

Nachdem die Seite geladen worden ist wird die Kontrolle hauptsächlich durch mehrere Javascript-Objekte ausgeübt. Diese initialisieren alle nötigen Hierarchien und bauen eine interne Nachrichtenschnittstelle auf, über die zentralisiert Events ausgetauscht werden können. Jedes einzelne der Objekte ist dabei für einen eigenen Bereicht zuständig und ermittelt mittels der Callbacks auf dem Server und einem JSON-Austausch-Format die nötigen Daten um alle Informationen anzuzeigen. Zur Darstellung und Anfrage setzen diese Skripte sehr stark auf das frei verfügbare Framework jQuery. Es kapselt oft wiederkehrende Funktionen und abstrahiert von dem zugrundeliegenden Browser, so dass z.B. Ajax-Requests sehr einfach werden. Die gesendeten Daten und die Schnittstellen des Gameviewers sind dabei unabhängig von dem aktuellen Modi, lediglich die Callback-Implementierung unterscheidet sich in ihrer Funktionsweise. Dazu jedoch in den zwei Unterabschnitten mehr.

Zur Anzeige des Kartenmaterials wird die Google-Maps-Api in der Version 3 verwendet. Diese API ermöglicht die einfache Anbindung von Karten und bietet Methoden um Polygone und Icons in Ebenen darüber anzulegen.

var latlng = new google.maps.LatLng(52.23, 8.07);
var myOptions = {
    zoom: 8,
    center: latlng,
    mapTypeId: google.maps.MapTypeId.ROADMAP
};
var map = new google.maps.Map(document.getElementById("map"), myOptions);
 
var position = new google.maps.LatLng(52.23, 8.07);     
var marker = new google.maps.Marker({
    position: position,
    map: map,
    flat: true,
    title: "My Marker"
});
Ausschnitt einer Javascript-Funktion und der Google-Maps-API
def live_get(request):
    try:
        type = request.GET['type']
        time = request.GET.get('time', None)
        game_id = request.GET.get('game_id', None)
        player_id = request.GET.get('player_id', None)
 
        func = {
            'game_list' : s_live.game_list,
            'game_time' : s_live.game_time,
            'game' : s_live.game,
            'area_visibilities': s_live.area_visibilities,
            'players' : s_live.players,
            'teams': s_live.teams,
            'safes' : s_live.safes,
            'tracks' : s_live.tracks,
            'gifts': s_live.gifts,
            'inventory': s_live.inventory,
            'chat': s_live.chat,
            'agents': s_live.agents}[type]
 
        # calling function and dumping result
        res = func(time, game_id, player_id, request.GET)
        return HttpResponse(simplejson.dumps(res))
 
    except KeyError:
        return HttpResponse("null")
    except SpectatorException:
        return HttpResponse("null")
Django(Python)-Funktion, die die Anfragen verarbeitet


Page last modified on March 21, 2011, at 02:49 PM