var Stadtrundgang = new Class({
    initialize: function() {
        Implements: Events,
        this._eintraege = new Stadtrundgang.Eintraege();
        this._standpunkte = new Stadtrundgang.Standpunkte();

        this.addEvents();
    },

    addEvents: function() {
        var btn1 = $$('#kopfzeile .menubar .stadtrundgang')[0];
        btn1.addEvent('click', function() {
            karteninhalt.dialogSchliessen();
            suche.dialogSchliessen();
            this.eintraegeLaden();
        } .bind(this));

        this._eintraege.addEvent('onLoaded', this.standpunkteLaden.bind(this));
        this._standpunkte.addEvent('onLoaded', this.eintraegeAnzeigen.bind(this));
    },

    standpunkteLaden: function() {
        this._standpunkte.laden();
    },

    eintraegeLaden: function() {
        this._eintraege.laden();
        return;

        var req = new Request({
            url: 'requests/stadtrundgang.aspx',
            onSuccess: function(str) {
                var seite = $$('#inhalt .seite')[0];
                seite.set('html', str);
            },
            onFailure: function() {
                alert('Konnte Inhalt << Stadtrundgang>> nicht laden!');
            }
        });
        req.send();
    },

    eintraegeAnzeigen: function() {
        var parent = $$('#inhalt .seite')[0];
        parent.empty();

        var container = new Element('div', { 'class': 'stadtrundgang' });
        parent.grab(container);

        var h1 = new Element('h1', { 'html': 'Stadtrundgang durch Bühl' });
        container.grab(h1);

        var items = this._eintraege.items();
        var ol = new Element('ol');

        for (var i = 0; i < items.length; i++) {
            var li = items[i].getListItem();
            ol.grab(li);
        }

        container.grab(ol);

        this.standpunkteAnzeigen();
    },

    standpunkteAnzeigen: function() {
        map.clearOverlays();

        var standpunkte = this._standpunkte.items();

        zoomToExtend(standpunkte);

        var listItems = $$('#inhalt .seite li');

        for (var i = 0; i < standpunkte.length; i++) {
            var symbol = standpunkte[i].getListenSymbol();
            var index = parseInt(standpunkte[i].getRundgangNr());
            listItems[index - 1].grab(symbol);
            standpunkte[i].addMarkerToMap();
        }

    }

});

Stadtrundgang.Eintraege= new Class({
    Implements: Events,
    initialize: function() {
        this._items = new Array();
    },

    laden: function(str) {
        this.clear();
        var req = new Request({
            url: 'requests/rundgang.aspx',
            data: 'aktion=eintrag-laden',
            onSuccess: function(str) {
                var res = new Results(str);

                if (res.getValue("Status") != "ok") {
                    alert(res.toString());
                    return;
                }

                var nummer = res.getValues("Nr");
                var name = res.getValues("Name");
                var beschreibung = res.getValues("Beschreibung");
                var bild = res.getValues("bild");
                var bildAusrichtung = res.getValues("bildAusrichtung");

                for (var i = 0; i < name.length; i++) {
                    var item = new Stadtrundgang.Eintrag();
                    item.setNummer(nummer[i]);
                    item.setName(name[i]);
                    item.setBeschreibung(beschreibung[i]);
                    item.setBild(bild[i]);
                    item.setBildAusrichtung(bildAusrichtung[i]);
                    this.add(item);
                }

                this.fireEvent('onLoaded')

            } .bind(this),
            onFailure: function() {
                alert('Fehler bei <<standpunkte-laden>>');
            }
        });
        req.send();
    },

    add: function(obj) {
        this._items.push(obj);
    },

    items: function() {
        return this._items;
    },

    count: function() {
        if (typeof (this._items) == "undefined")
            return null;
        else
            return this._items.length;
    },

    clear: function() {
        this._items.empty();
    }
});

Stadtrundgang.Eintrag = new Class({
    initialize: function() {
    },

    getNummer: function() {
        if (typeof (this._nummer) == "undefined")
            return null;
        else
            return this._nummer;
    },

    setNummer: function(str) {
        this._nummer = str;
    },

    getName: function() {
        if (typeof (this._name) == "undefined")
            return null;
        else
            return this._name;
    },

    setName: function(str) {
        this._name = str;
    },

    getBeschreibung: function() {
        if (typeof (this._beschreibung) == "undefined")
            return null;
        else
            return this._beschreibung;
    },

    setBeschreibung: function(str) {
        this._beschreibung = str;
    },

    getBild: function() {
        if (typeof (this._bild) == "undefined")
            return null;
        else
            return this._bild;
    },

    setBild: function(str) {
        if (str == "" || str == null || str == '00000')
            this._bild = null
        else
            this._bild = str;
    },

    getBildAusrichtung: function() {
        if (typeof (this._bildAusrichtung) == "undefined")
            return null;
        else
            return this._bildAusrichtung;
    },

    setBildAusrichtung: function(str) {
        if (str == "" || str == null)
            this._bildAusrichtung = null;
        else
            this._bildAusrichtung = str;
    },

    getListItem: function() {
        /*
        <li>
        <div>1.</div>
        <h3>Markt- und Kirchplatz</h3>
        <img class="left" src="images/rundgang/vorschau/sr_01_wochenmarkt.jpg" />
        <p>Beschreibung</p>
            <img src="images/sr_01.png" /><img src="images/sr_02.png" />
        </li>
        */

        var li = new Element('li');
        var div = new Element('div', { 'html': this.getNummer() });
        li.grab(div);
        var h3 = new Element('h3', { 'html': this.getName() });
        li.grab(h3);
        if (this._bild != null) {
            var img = new Element('img', { 'class': this.getBildAusrichtung(), 'src': "images/rundgang/vorschau/" + this.getBild() });
            li.grab(img);
        }
        var p = new Element('p', { 'html': this.getBeschreibung() });
        li.grab(p);

        return li;
    }

});

Stadtrundgang.Standpunkte = new Class({
    Implements: Events,
    initialize: function() {
        this._items = new Array();
    },

    laden: function(str) {
        this.clear();
        var req = new Request({
            url: 'requests/rundgang.aspx',
            data: 'aktion=standpunkt-laden',
            onSuccess: function(str) {
                var res = new Results(str);

                if (res.getValue("Status") != "ok") {
                    alert(res.toString());
                    return;
                }

                var nummer = res.getValues("Nr");
                var rundgangNr = res.getValues("RundgangNr");
                var name = res.getValues("Name");
                var bild = res.getValues("BildTooltip");
                var bildBreite = res.getValues("BildBreite");
                var bildHoehe = res.getValues("BildHoehe");
                var symbol = res.getValues("Symbol");
                var symbolHoehe = res.getValues("SymbolHoehe");
                var symbolBreite = res.getValues("SymbolBreite");
                var lat = res.getValues("breite");
                var lon = res.getValues("laenge");

                for (var i = 0; i < name.length; i++) {
                    var item = new Stadtrundgang.Standpunkt();
                    item.setNummer(nummer[i]);
                    item.setRundgangNr(rundgangNr[i]);
                    item.setName(name[i]);
                    item.setBild(bild[i]);
                    item.setBildBreite(bildBreite[i]);
                    item.setBildHoehe(bildHoehe[i]);
                    item.setSymbol(symbol[i]);
                    item.setSymbolHoehe(symbolHoehe[i]);
                    item.setSymbolBreite(symbolBreite[i]);
                    item.setLat(lat[i]);
                    item.setLon(lon[i]);
                    this.add(item);
                }

                this.fireEvent('onLoaded')

            } .bind(this),
            onFailure: function() {
                alert('Fehler bei <<standpunkte-laden>>');
            }
        });
        req.send();
    },

    add: function(obj) {
        this._items.push(obj);
    },

    items: function() {
        return this._items;
    },

    count: function() {
        if (typeof (this._items) == "undefined")
            return null;
        else
            return this._items.length;
    },

    clear: function() {
        this._items.empty();
    }
});

Stadtrundgang.Standpunkt = new Class({
    initialize: function() {
    },

    setMarker: function(obj) {
        this._marker = obj;
    },

    markerZeigen: function() {
        var html = this.getInfoHtml();
        this._marker.openInfoWindow(html);
    },

    getNummer: function() {
        if (typeof (this._nummer) == "undefined")
            return null;
        else
            return this._nummer;
    },

    setNummer: function(str) {
        this._nummer = str;
    },

    getRundgangNr: function() {
        if (typeof (this._rundgangNr) == "undefined")
            return null;
        else
            return this._rundgangNr;
    },

    setRundgangNr: function(str) {
        this._rundgangNr = str;
    },

    getName: function() {
        if (typeof (this._name) == "undefined")
            return null;
        else
            return this._name;
    },

    setName: function(str) {
        this._name = str;
    },

    getBild: function() {
        if (typeof (this._bild) == "undefined")
            return null;
        else
            return this._bild;
    },

    setBild: function(str) {
        if (str == "" || str == null || str == '00000')
            this._bild = null
        else
            this._bild = str;
    },

    getBildBreite: function() {
        if (typeof (this._bildBreite) == "undefined")
            return null;
        else
            return this._bildBreite;
    },

    setBildBreite: function(str) {
        this._bildBreite = str;
    },

    getBildHoehe: function() {
        if (typeof (this._bildHoehe) == "undefined")
            return null;
        else
            return this._bildHoehe;
    },

    setBildHoehe: function(str) {
        this._bildHoehe = str;
    },


    getSymbol: function() {
        if (typeof (this._symbol) == "undefined")
            return null;
        else
            return this._symbol;
    },

    setSymbol: function(str) {
        this._symbol = str;
    },

    getSymbolBreite: function() {
        if (typeof (this._symbolBreite) == "undefined")
            return null;
        else
            return this._symbolBreite;
    },

    setSymbolBreite: function(str) {
        this._symbolBreite = str;
    },

    getSymbolHoehe: function() {
        if (typeof (this._symbolHoehe) == "undefined")
            return null;
        else
            return this._symbolHoehe;
    },

    setSymbolHoehe: function(str) {
        this._symbolHoehe = str;
    },

    getLat: function() {
        if (typeof (this._breite) == "undefined")
            return null;
        else
            return this._breite;
    },

    setLat: function(str) {
        str = str.replace(',', '.');
        this._breite = parseFloat(str);
    },

    getLon: function() {
        if (typeof (this._laenge) == "undefined")
            return null;
        else
            return this._laenge;
    },

    setLon: function(str) {
        str = str.replace(',', '.');
        this._laenge = parseFloat(str);
    },

    addMarkerToMap: function() {
        this._point = new GLatLng(this.getLat(), this.getLon());

        this._marker = new GMarker(this._point, {
            icon: gibIcon(this.getSymbol(), this.getSymbolBreite(), this.getSymbolHoehe()),
            title: this.getName()
        });

        GEvent.addListener(this._marker, "click", function() {
            var html = this.getInfoHtml();
            this._marker.openInfoWindow(html)
        } .bind(this));

        map.addOverlay(this._marker)
    },
    
    getPoint: function(){
        return new GLatLng(this.getLat(), this.getLon());
    },

    getInfoHtml: function() {
        // Info-Fenster erstellen
        var div = new Element('div', { 'class': 'info-fenster-rundgang' });

        // Überschrift/Name erstellen
        var h2 = new Element('h2', { 'html': this.getName() });
        div.grab(h2);

        var img = new Element('img', {
            'src': 'images/rundgang/' + this.getBild(),
            'width': this.getBildBreite(),
            'height': this.getBildHoehe()
        });

        div.grab(img);


        // Fusszeile erstellen
        var fusszeile = new Element('div', { 'class': 'fusszeile' });

        var a1 = new Element('a', { 'html': 'Zoom auf Strasse', 'href': '#' });

        a1.addEvent('click', function() {
            ZoomAufStrasse(this.getLat(), this.getLon());
        } .bind(this)
        );

        var a2 = new Element('a', { 'html': 'Zoom auf Ort', 'href': '#' });

        a2.addEvent('click', function() {
            ZoomAufOrt(this.getLat(), this.getLon());
        } .bind(this)
        );

        fusszeile.adopt(a1, a2);

        div.grab(fusszeile);

        return div;
    },

    getListenSymbol: function() {
        var a = new Element('a', { 'href': '#', 'title': this.getName() });
        
        a.addEvent('click', function() {
            this.markerZeigen();
        } .bind(this));
        
        var img = new Element('img', { 'src': "images/" + this.getSymbol() + ".png" });
        a.grab(img);
        
        return a;
    }

});