var Wizard = Class.create({
  initialize: function() {
    this.steps = $$(".step");
    this.form = this.steps[0].up('form');
    this.form.observe('submit', this.handleSubmit.bind(this));
    this.breadcrumbs = $("breadcrumbs");
    this.initializeBreadcrumbs();
    this.steps.each(M.send('hide'));
    this.activateStep(this.steps[0]);
  },
  initializeBreadcrumbs: function() {
    this.steps.each(function(step) {
      var breadcrumb = new Element('div', {className: 'breadcrumb'}).update(step.down('h2').innerHTML)
      step.breadcrumb = breadcrumb;
      breadcrumb.observe('click', this.activateStep.bind(this, step));
      this.breadcrumbs.insert(breadcrumb);
    }, this);
  },
  handleSubmit: function(event) {
    if (this.activeStep != this.steps.last()) {
      this.nextStep();
      return event.stop();
    }
  },
  activateStep: function(step) {
    window.scrollTo(0, 0);
    if (this.activeStep) {
      this.activeStep.breadcrumb.removeClassName('active');
      this.activeStep.hide();
    }
    step.show();
    step.breadcrumb.addClassName('active');
    this.activeStep = step;
  },
  nextStep: function() {
    if (!this.activeStep) return;
    var nextStep = this.steps[this.steps.indexOf(this.activeStep) + 1];
    if (!nextStep) return;
    this.activateStep(nextStep);
  }
})