var Toggler = new Class({
  Implements: [Chain, Options],

  options: {
    buttons: {
      close:           "article-toolbox-close", // open-/close-Link
      comments:        "article-toolbox-comments-link",
      share:           "article-toolbox-share-link"
    },
		boxes: {
			container:       "article-toolbox-content", // Container, der auf-/zugeklappt wird
      comments:        "article-toolbox-comments",
      share:           "article-toolbox-share"
		},
		delays: {
			afterSlideOut:   400,
			beforeSlideIn:   200
		},
		text: {
			open:            "open",
      close:           "close"
		}
  },

  elements: {

    buttons: {
      close:           null,
      comments:        null,
      share:           null
    },
		boxes: {
			container:       null,
			comments:        null,
      share:           null
		}

  },

  state: "closed", // alternativ: "share" oder "comments"

  initialize: function(options) {
    this.setOptions(options);

    this.elements.buttons.close     = $(this.options.buttons.close);
    this.elements.buttons.comments  = $(this.options.buttons.comments);
    this.elements.buttons.share     = $(this.options.buttons.share);
    this.elements.boxes.container   = $(this.options.boxes.container);
		this.elements.boxes.comments    = $(this.options.boxes.comments);
		this.elements.boxes.share       = $(this.options.boxes.share);

    this.elements.buttons.close.addEvent("click", this.toggle.bind(this));
    this.elements.buttons.comments.addEvent("click", this.displayComments.bind(this));
    this.elements.buttons.share.addEvent("click", this.displayShare.bind(this));

		this.chain( // Startzustand: Box schließen
		  function() {
			  this.elements.boxes.container.setStyle("display", "none");
				this.elements.boxes.comments.setStyle("display", "none");
				this.callChain();
			},
			this.hide,
			function() { this.elements.boxes.container.setStyle("display", "block"); }
		);
		this.callChain();
  },

  toggle: function() {
    if(this.elements.buttons.close.innerHTML == this.options.text.close) {
      this.hide();
    } else {
      this.show();
    }
  },

  show: function() {
    this.elements.buttons.close.innerHTML = this.options.text.close;
    this.elements.boxes.container.slide("in");

		this.callChain();
  },

  hide: function() {
    this.elements.buttons.close.innerHTML = this.options.text.open;
    this.elements.boxes.container.slide("out");
		this.state = "closed";

		this.callChain.delay(this.options.delays.afterSlideOut, this);
  },

  displayComments: function() {
		if (this.state == "share") {
			this.chain(this.hide);
		}
		if (this.state != "comments") {
			this.chain(this.setStyleForComments);
			this.chain(this.show);
    }
		this.callChain();
		this.state = "comments";
  },

  displayShare: function() {
    if (this.state == "comments") {
      this.chain(this.hide);
    }
    if (this.state != "share") {
			this.chain(this.setStyleForShare);
      this.chain(this.show);
    }
    this.callChain();
		this.state = "share";
  },

	setStyleForComments: function() {
	  this.elements.boxes.comments.setStyle("display", "block");
		this.elements.boxes.share.setStyle("display", "none");

		this.callChain.delay(this.options.delays.beforeSlideIn, this);
	},

	setStyleForShare: function() {
    this.elements.boxes.comments.setStyle("display", "none");
    this.elements.boxes.share.setStyle("display", "block");

		this.callChain.delay(this.options.delays.beforeSlideIn, this);
  }
});

window.addEvent("domready", function() {
  var toggler = new Toggler({});
});