+var Toggler = Class.create({
+ options: {},
+
+ close: function() {
+ this.element.src = this.options.openIcn;
+ this.target.hide();
+ document.fire('toggler:close', this);
+ },
+
+ open: function() {
+ this.element.src = this.options.closeIcn;
+ this.target.show();
+ document.fire('toggler:open', this);
+ },
+
+ toggle: function(evt) {
+ if (evt && typeof evt.stop === "function") {
+ evt.stop();
+ }
+ if (this.target.visible()) {
+ this.close();
+ } else {
+ this.open();
+ }
+ },
+
+ initialize: function(target, options) {
+ this.options = Object.extend({
+ openIcn: 'icons/bullet_arrow_right.png',
+ closeIcn: 'icons/bullet_arrow_down.png'
+ }, options);
+
+ this.target = $(target).hide();
+ this.element = new Element("img").setStyle({ border: 'none', // in firefox, in image inside an anchor has a border
+ verticalAlign: "middle"});
+ this.element.observe('click', this.toggle.bindAsEventListener(this));
+
+ if (this.options.autoOpen) {
+ this.open();
+ } else {
+ this.close();
+ }
+ }
+});
+