window.addEvent('domready', function() {
  
	// Pruefen ob alle benoetigten Selectorx existieren
	if ( $defined($('monthSelector')) && $defined($('daySelector')) && $defined($('timeSelector'))) {
        new DateHandler();
        new ParticipantsHandler();
        new BookingHandler();
	}
  
    new gallery($('kallery'), {
        timed: false,
        showInfopane: false,
        embedLinks: false                
    });

});



var DateHandler = new Class({

  _id: null,


  initialize: function() {
    // URL splitten
    var splittedURL = document.URL.split('/');
    
    // gesplittete URL durchlaufen und die ID ermitteln
    for( var i = 0; i < splittedURL.length; i++ ) {
      if( splittedURL[i] == "id" ) {
        this._id = splittedURL[ i + 1 ];
        break;
      }
    }  

    this._refreshBookingDate();
    this._refreshStarttime(),

    $('monthSelector').addEvent('change', this._refreshBookingDate.bindWithEvent(this));
    $('daySelector').addEvent('change', this._refreshBookingDate.bindWithEvent(this));
    $('dateSelector').getElement('[name=time]').addEvent('change', this._refreshStarttime.bindWithEvent(this));
  
    // Month-Selector mit Events fuer das Wechseln des Day-Selectors und der Tabelle mit den aktiven Wochentagen verknuepfen
	  $('monthSelector').addEvent('change', this._refreshDaySelector.bindWithEvent(this));
	  $('monthSelector').addEvent('change', this._refreshWeekdayTable.bindWithEvent(this)); 
  	
  	$('daySelector').addEvent('change', this._refreshTimeSelector.bindWithEvent(this));
  	
  	this._refreshDaySelector();
  },
  
  
  _getYear: function() {
  
    // Jahr ermitteln
    if( $defined(window.ie) )
      return new Date().getYear();
    else
      return new Date().getYear() + 1900;    
  
  },
  
  
  _refreshBookingDate: function() {
  
    // Datum zusammensetzen
    var day   = $('dateSelector').getElement('[name=day]').getValue();
    var month = $('monthSelector').getElement('[value=' + $('monthSelector').getValue() + ']').getText();
    var year  = this._getYear();
    
    // Wenn der Tag leer ist wird der Tag benutzt, welcher im jetzt schon als Tourdatum da steht
    if(day == '')
     day = $('bookingForm').getElement('[class=description]').getElement('[title=date]').getElement('span').getText().match(/\d{2}/);
    
    var date = day + ". " + month + " " + year;  
  
    $('bookingForm').getElement('[class=description]').getElement('[title=date]').getElement('span').setText(date);
  
  },

  
  _refreshStarttime: function() {
    
		if ($defined($('timeSelector').options))
		  var time  = $('timeSelector').options[$('timeSelector').options.selectedIndex].firstChild.nodeValue;
		else
		  var time =  $('timeSelector').getValue() ;
    
    $('bookingForm').getElement('[class=description]').getElement('[title=starttime]').getElement('span').setText( time );
  },

  
  _refreshDaySelector: function() {
  
    var completeFunction      = this._refreshTimeSelector.bind(this);
    var refreshTimeSelector  = this._refreshTimeSelector.bind(this);
  
    // Tourdatum-Selectbox aktualieren
    new Ajax('/ajax.php', {
    
      data: 'f=getTourdaysForMonthAsOptions&' +
            'showOldDays=0&' + 
            'p[year]=' + this._getYear() + '&' +
            'p[month]=' + $('monthSelector').getValue() + '&' + 
            'p[id]=' + this._id,
    
      method: 'post',
      
      onRequest: function() {
        $('daySelector').empty();
        new Element('option').appendText('...').injectInside( $('daySelector') );
      },
      
      // Fehler anzeigen
      onFailure: function() {
        $('daySelector').empty();
        new Element('option').appendText('error').injectInside( $('daySelector') );
      },
      
      // Termine anzeigen
      onComplete: function() {
        
        // Select-Element leeren
        $('daySelector').empty();
        
        var options = this.response.xml.getElementsByTagName('option');
        
        // Jedes einzelne Option-Element durachlaufen und dem Day-Selector hinzufuegen
        for(var i = 0; i < options.length; i++) {
          var option = options[i];
        
          new Element('option', {
          
            value: option.getAttribute('value'),
            title: option.getAttribute('class')
          
          }).appendText( option.firstChild.nodeValue ).injectInside( $('daySelector') );
          
        }
        
        refreshTimeSelector();
        
      }
    
    }).request();    
  
  },
  
  
  _refreshWeekdayTable: function() {
  
		// Tabelle mit den aktiven Wochentagen aktualisieren
		new Ajax('/ajax.php', {
		
		  data: 'f=getActiveDayByMonth&' +
		        'p[year]=' +  this._getYear() + '&' +
		        'p[month]=' + $('monthSelector').getValue() + '&' + 
		        'p[id]=' + this._id,
		        
		  method: 'post',
		   
		  
		  // Tabelle aktualisieren
		  onComplete: function() {
		  
		    // Einzelne Tabellenspalten durchlaufen und bearbeiten
		    $each( $('week').getElements('td'), function( cell, index ) {
		    
		      // Tagesbezeichnung speichern
		      var dayName = cell.getFirst().getText();
		      
		      // Wochentagsnummer zur Zellennummer ermitteln
		      var dayNr = index + 1;
		      if( dayNr == 7 )
		        dayNr = 0;
		
		      if( this.response.xml.getElementsByTagName('exists')[dayNr].firstChild.nodeValue == 'true' )
		        cell.setHTML( '<strong>' + dayName + '</strong>');
		      else
		        cell.setHTML( '<span>' + dayName + '</span>');
		    
		    }, this);
		  
		  }
		
		}).request();
  
  },
  
  
  _refreshTimeSelector: function() {
  
    // Startzeit-Selectbox aktualiesren
    new Ajax('/ajax.php', {
    
      data: 'f=getStarttimesByDate&' + 
            'year=' + this._getYear() + '&' +
            'month=' + $('monthSelector').getValue() + '&' +
            'day=' + $('daySelector').getValue() + '&' + 
            'id=' + this._id,
    
      method: 'post',
      
      onRequest: function() {
        $('timeSelector').empty();
        new Element('option').appendText('...').injectInside( $('timeSelector') );
      },
      
      // Fehler anzeigen
      onFailure: function() {
        $('timeSelector').empty();
        new Element('option').appendText('error').injectInside( $('timeSelector') );
      },
      
      // Termine anzeigen
      onComplete: function() {
        $('timeSelector').empty();
        var starttimes = this.response.xml.getElementsByTagName('starttime');
        
        for( var i = 0; i < starttimes.length; i++ ) {
          
          var starttime = starttimes[i];
          
          if($type(starttime) == "element") {
            var option = new Element('option').setText(starttime.firstChild.nodeValue);
            option.injectInside( $('timeSelector') );
          }
          
        }
        
      }
    
    }).request();   
  
  }
  


});




var BookingHandler = new Class({


  initialize: function() {
  
    // Submitbutton mit Event verknuepfen
    $('submitBooking').addEvent('click', this._submit.bindWithEvent()); 
  
  },


  
  _submit: function() {
  
		// Tourdaten ermitteln
		var id    = $('dateSelector').getElement('[name=id]').getValue();
		var year  = $('dateSelector').getElement('[name=year]').getValue();
		var month = $('dateSelector').getElement('[name=month]').getValue();
		var day   = $('dateSelector').getElement('[name=day]').getValue();
		
		if ($defined($('timeSelector').options))
		  var time  = $('timeSelector').options[$('timeSelector').options.selectedIndex].firstChild.nodeValue;
		else
		  var time =  $('timeSelector').getValue() ;
		
		// Formular abschicken
		new Ajax('/ajax.php', {
		  
		  'method': 'post',
		  
		  'data': $('bookingForm').toQueryString() + 
		          '&p[id]=' + id +
		          '&p[year]=' + year +
		          '&p[month]=' + month +
		          '&p[day]=' + day +
		          '&p[time]=' + time +
		          '&f=executeTourBooking',
		         
		  // Ajax-Load-Image anzeigen 
		  'onRequest': function() {
		    
		    // Submit-Button deaktivieren
		    $('submitBooking').disabled = true;
		    
		    new Element('img', {
		    
		      'src': '/style/ajax-load.gif'
		      
		    }).injectAfter( $('submitBooking') );
		    
		  },
		  
		  // Ajax-Load-Image und ggf. Fehlermeldungen anzeigen bzw. auf Shop-Seite weiterleiten ausblenden
		  'onComplete': function() {
		  
        // Submit-Button wieder aktivieren
        $('submitBooking').disabled = false;		  
		  
		    // Ajax-Load-Image ausblenden
		    new Fx.Style( $('submitBooking').getNext(), 'opacity', {
		    
		      onComplete: function() {
		        this.element.remove();
		      }
		    
		    }).start(0);
		    
		    
		    // ggf. Fehlermeldungen anzeigen
		    if( this.response.xml.getElementsByTagName('error').length > 0 ) {
		    
		      // Fehlermeldungen einlesen
		      var errorRoot = new Element('ul', { 'class': 'errors' });        
		      
		      for(var i = 0; i < this.response.xml.getElementsByTagName('error').length; i++) {
		        var bla = this.response.xml.getElementsByTagName('error');
		          if( window.ie )
		            var error = this.response.xml.getElementsByTagName('error')[i].firstChild.text;
		          else
		            var error = this.response.xml.getElementsByTagName('error')[i].firstChild.textContent;
		          
		        new Element( 'li' ).setText( error ).injectInside(errorRoot);
		      }
		
		      
		      // Margin fuer Errorbox setzen
		      $('bookingErrors').setStyle('margin-bottom', 10);
		      
		      // Alte Fehlermeldungen loeschen
		      $('bookingErrors').empty();
		      
		      // Fehlermeldungen anzeigen
		      errorRoot.injectInside( $('bookingErrors') );
		      new Fx.Slide($('bookingErrors'), {
		      
		        onStart: function() {
		        
		          new Fx.Style(errorRoot, 'opacity', { 'duration': 750 }).start(0, 1);
		        
		        },
		        
		        onComplete: function() {
		        
		          // Slide-Wrapper entfernen
		          $('bookingErrors').injectBefore( $('bookingErrors').getParent() );
		          $('bookingErrors').setStyle('margin-bottom', 10);
		          $('bookingErrors').getNext().remove();
		        
		        }
		      
		      }).hide().slideIn();
		    
		    }
		    
		    // Wenn keine Fehler aufgetreten sind wird der Benutzer um Checkout weitergeleitet
		    else {
		    
		     var url = document.location.href.replace(/\/cat\/\d+/, "/cat/28");
		     var url = url.substr(0, url.search(/\/cat\/28/) + 8)
		     document.location.href = url;
		    
		    }
		    
		  }
		  
		}).request();
		
  }
  

});



/*
  Class: ParticipantsHandler
*/
var ParticipantsHandler = new Class({


  participantRow: null,

  
  initialize: function() {
    // Click-Element zum anzeigen der Box mit Event verknuepfen
    $('showParticipantForm').addEvent('click', this._show.bindWithEvent( $('showParticipantForm') ) );
  
    // Eine Teilnehmer-Zeile in Eigenschaften fuer das spaetere Clonen speichern
    this.participantRow = $('participants').getElement('[class=participant]').clone();
  
    // Add-Trigger mit entsprechendem Event verknuepfen
    $('addParticipant').addEvent( 'click', this._add.bindWithEvent(this) );
  
    // Alle vorhanden Delete-Buttons mit Delete-Event hinufuegen
    $each( $('participants').getElements('[class$=delete]'), function(deleteTrigger) {
    
      deleteTrigger.addEvent('click', this._delete.bindWithEvent(deleteTrigger));
    
    }, this);
    
  },
  
  
  _delete: function() {
  
    // Zu loeschende Zeile ermitteln
    if( this.getParent().getParent().getParent().getProperty('id') == 'participants' ) 
      var row = this.getParent().getParent();
    else
      var row = this.getParent().getParent().getParent();
  
    // Zeile raussliden und loeschen
    new Fx.Slide(row, {
    
      onComplete: function() {
      
        this.element.remove();
      
      }
    
    }).slideOut();
  
  },
  
  
  /*
    Property: _add
      Fuegt einen Teilnehmer hinzu
  */ 
  _add: function() {
  
		// Teilnehmer-Box clonen
		var par = this.participantRow.clone();

    // Delete-Button mit Event verknuepfen
    var deleteTrigger = par.getElement('[class$=delete]');
    deleteTrigger.addEvent('click', this._delete.bindWithEvent(deleteTrigger) )
		
		// Id entfernen und values loeschen
		par.removeProperty('id');
		$each( par.getElements('input'), function(el) {
		  el.value = '';
		});

		// Teilnehmerbox einfuegen      
		par.injectInside( $('participants') );
		
		// Slide-Effekt auf Box legen
		var slidePar = new Fx.Slide(par).hide().slideIn();
  
  },
  
  
  _show: function() {
  
    // Button/Trigger deaktivieren
    this.disabled = true;
  
    // Box anzeigen und reinsliden
    $('participantsBox').setStyle('display', 'block');
    new Fx.Slide('participantsBox', {
    
      onStart:  function() {
      
        // Benutzer zur neuen Box scrollen
        new Fx.Scroll( window ).scrollTo( 
          0, $('participants').getPosition().y 
        );      
      
      },
    
      onComplete: function() {
      
        // Element vor Slide-Wrapper einfuegen und Margin setzen
        $('participantsBox').injectBefore($('participantsBox').getParent());
        $('participantsBox').setStyle('margin-bottom', 20);
        
        // Wrapper entfernen
        $('participantsBox').getNext().remove();
        
      }
      
    }).hide().slideIn();
  
  }


});