/*

Diese Klasse stellt die Funktionen für die Timescala zur Verfügung.

Greift auf resGrid und resPlan zu.

*/
var resTimeScale = new Class({
    Implements: Options,
    options: {
        scalediv: null,
        startclockurl: '../grafik/uhrtemp.gif',
        endclockurl: '../grafik/uhrtemp.gif',
        startclock: $('startclock'),
        endclock: $('endclock'),
        startdropdown: null,
        enddropdown: null,
        starthour: 8,
        endhour: 24,
        mode: 2
    },
    initialize: function(options) {
        this.setOptions(options);

        this.gridobj = null;
        this.planobj = null;

        // hole breite des stundencontainers
        this.options.w = this.options.scalediv.getSize().x;

        // fülle die dropdowns
        this.fillDropdowns();


        // speichere die id der dropdowns in den uhren
        this.options.startclock.store('startdropdownid', this.options.startdropdown.id);
        this.options.endclock.store('enddropdownid', this.options.enddropdown.id);

        this.options.startclock.addEvent("click", function(e) {
            var ev = new Event(e);
            $(ev.target.retrieve('startdropdownid')).style.visibility = 'visible';
        });

        this.options.endclock.addEvent("click", function(e) {
            var ev = new Event(e);
            $(ev.target.retrieve('enddropdownid')).style.visibility = 'visible';
        });


        // speichere objekt zu den dropdowns
        this.options.startdropdown.store('ts', this);
        this.options.enddropdown.store('ts', this);

        this.options.startdropdown.addEvent("change", function(e) {

            var ev = new Event(e);
            var ts = ev.target.retrieve('ts');
            var sh = ev.target.options[ev.target.selectedIndex].value.toInt();

            if (sh < ts.options.endhour) {
                ts.options.starthour = sh;
            } else {
                new mooPopup({ dockelem: ev.target, dockelempos: 'ru', 'headline': 'Achtung', 'content': 'Die Anfangsstunde muss kleiner sein als ' + ts.options.endhour + " Uhr" });
                return;
            }

            ts.load();
           // ev.target.style.visibility = 'hidden';
        });

        this.options.enddropdown.addEvent("change", function(e) {

            var ev = new Event(e);
            var ts = ev.target.retrieve('ts');
            var eh = ev.target.options[ev.target.selectedIndex].value.toInt();

            if (eh > ts.options.starthour) {
                ts.options.endhour = eh;
            } else {
                new mooPopup({ dockelem: ev.target, dockelempos: 'lu', 'headline': 'Achtung', 'content': 'Die Endstunde muss grösser sein als ' + ts.options.starthour + " Uhr" });
                return;
            }

            ts.load();
           // ev.target.style.visibility = 'hidden';
        });


    },

    load: function() {

        this.options.hours = this.options.endhour - this.options.starthour;

        this.calculateHourWidth();

        if (this.options.mode == 1)
            this.writeScale();
        else
            this.writeScale2();

        this.setClocks();

        if (this.gridobj != null) {

            this.gridobj.options.colwidth = this.options.hourwidth - 1;
            this.gridobj.options.nrOfCols = this.options.hours;
            this.gridobj.options.starthour = this.options.starthour;
            this.gridobj.options.endhour = this.options.endhour;
            this.gridobj.createGrid();
        }

        if (this.planobj != null) {

            this.planobj.options.hourwidth = this.options.hourwidth;
            this.planobj.options.starthour = this.options.starthour;
            this.planobj.options.endhour = this.options.endhour;
            this.planobj.positionizeEvents();
        }

    },

    /* setzt die uhrgrafiken und die dropdowns abhängig von der uhrzeit */
    setClocks: function() {

        var starth = this.options.starthour;
        var endh = this.options.endhour;

        if (starth == 0)
            starth = 12;
        else if (starth > 12)
            starth = starth - 12;

        if (endh > 12)
            endh = endh - 12;

        this.options.startclockurl = '../grafik/icons/uhr_' + starth + '.gif';
        this.options.endclockurl = '../grafik/icons/uhr_' + endh + '.gif';

        this.options.startclock.src = this.options.startclockurl;
        this.options.endclock.src = this.options.endclockurl;

        // setze auch die dropdowns
        this.options.startdropdown.selectedIndex = this.options.starthour;
        this.options.enddropdown.selectedIndex = this.options.endhour;

    },

    /* ladet alle events des aktuellen monat und jahres */
    fillDropdowns: function() {

        for (var i = 0; i <= 24; i++) {
            this.options.startdropdown.options[i] = new Option(preZero(i) + ":00 Uhr ", i);
            this.options.enddropdown.options[i] = new Option(preZero(i) + ":00 Uhr ", i);
        }

    },

    /* ladet alle events des aktuellen monat und jahres */
    calculateHourWidth: function() {

        // breite der stunde = breite des containers / die anzahl stunden
        this.options.hourwidth = (this.options.w / (this.options.hours + 1));

        // ein pixel weg
        if (this.options.mode == 1)
            this.options.hourwidth -= 1;
        else {

            // var x = this.options.hourwidth * (this.options.hours + 1);
            this.options.hourwidth = ((this.options.w) / (this.options.hours + 1));

        }

    },

    /* generiert die Scala als HTML */
    writeScale: function() {

        // NUR WENN OPTIONS.MODE == 1

        // mache leer
        this.options.scalediv.empty();

        // summe
        var sum = 0;

        // für jede stunde zwischen den endzeiten
        for (var i = this.options.starthour; i <= this.options.endhour; i++) {
            var elem = new Element('div', { 'class': 'stundediv' + this.options.mode, style: 'width:' + this.options.hourwidth + "px" });

            if (this.options.mode == 1)
                elem.innerHTML = i.toString();
            else
                elem.innerHTML = "<div class=nr>" + i + "</div><div class=bot></div>";

            this.options.scalediv.appendChild(elem);

            sum += elem.getSize().x;
        }

        // das letzte element so verleinern, dass es noch hineinpasst
        if (sum > this.options.w) {

            var last = this.options.scalediv.getLast();
            var diff = sum - this.options.w;
            diff += 1;
            var x = last.getSize().x - diff;
            if (x > 0)
                last.style.width = x + "px";
        }
    },

    /* generiert die Scala als HTML */
    writeScale2: function() {

        // mache skala leer
        this.options.scalediv.empty();

        // summe
        var sum = 0;

        // für jede stunde zwischen den endzeiten
        for (var i = this.options.starthour; i <= this.options.endhour; i++) {

            // erzeuge div
            var elem = new Element('div', { 'class': 'stundediv' + this.options.mode, style: 'width:' + this.options.hourwidth + "px" });

            // füge stundenzahl ein
            elem.innerHTML = "<div class=nr>" + i + "</div>";

            // das letze element ist nur da um die letzte stunde anzuzeigen, aber damit sie noch hineinpasst
            // wird die breite des divs verkleinert
            if (i == (this.options.endhour)) {
                elem.style.width = (elem.style.width.toInt() / 3) + "px";
            }

            // füge stunde hinzu
            this.options.scalediv.appendChild(elem);

            //sum += elem.getSize().x;
        }

    },


    highlightHour: function(hour) {
        var index = hour - this.options.starthour;
        this.options.scalediv.childNodes[index].className = "stundediv_sel" + this.options.mode;

   
    },

    unhighlightHour: function(hour) {
        var index = hour - this.options.starthour;
        this.options.scalediv.childNodes[index].className = "stundediv" + this.options.mode;
    },

    getHourElem: function(hour) {
        var index = hour - this.options.starthour;
        return this.options.scalediv.childNodes[index];
    }


});