(function(){
  var WidgetStore = {
    initialize: function(){
      this.widget_store = $("widget_store");
      this.search_form = $("widget_search_form");
      this.searchTimer = null;

      this.bindEvents();
    },

    bindEvents: function(){
      this.widget_store.on("click", ".head a", this.headClick.bind(this));
      this.search_form.on("submit", this.searchEvent.bind(this));
      this.search_form.on("keyup", "#q", this.searchEvent.bind(this));
      this.widget_store.on("click", ".widget .button", this.widgetButtonClickEvent.bind(this));
      this.widget_store.on("click", ".button.confirm", this.confirmEditClickEvent.bind(this));
      this.widget_store.on("click", ".button.cancel", this.cancelEditClickEvent.bind(this));
    },

    searchEvent: function(event){
      event.stop();
      if(this.searchTimer){ clearTimeout(this.searchTimer); }

      this.searchTimer = setTimeout(function(){
        var request = new Ajax.Request(this.search_form.readAttribute("action"), {
          method: this.search_form.readAttribute("method"),
          parameters: this.search_form.serialize(),
          onSuccess: this.headSuccess.bind(this),
          onCreate: function(){ $("widget_store_content").setStyle({opacity: 0.5}); }.bind(this),
          onComplete: function(){ $("widget_store_content").setStyle({ opacity: 1 });}.bind(this)
        });
      }.bind(this), 300);
    },

    headClick: function(event){
      event.stop();

      var request = new Ajax.Request(event.element().readAttribute("href"), {
        method: "get",
        onSuccess: this.headSuccess.bind(this),
        onCreate: function(){ $("widget_store_content").setStyle({opacity: 0.5}); }.bind(this),
        onComplete: function(){ $("widget_store_content").setStyle({ opacity: 1 });}.bind(this)
      }, this);
    },

    headSuccess: function(transport){
      this.widget_store.update(transport.responseText);
    },

    widgetButtonClickEvent: function(event) {
      event.stop();
      var widget = event.element().up(".widget");
      if (widget.down(".edit").innerHTML === "") {
        this.editWidget(widget);
      }
    },

    editWidget: function(widget) {
      var url = "/widgets/" + widget.readAttribute("identifier") + "/edit";
      var request = new Ajax.Request(url, {
        method: "get",
        onSuccess: function(t) {
          widget.down(".edit").update(t.responseText);
          widget.down(".edit").blindDown();
        }
      });
    },

    confirmEditClickEvent: function(event) {
      event.stop();
      var form = event.element().up("form");

      var request = new Ajax.Request(form.action, {
        method: "put",
        parameters: form.serialize(),
        onSuccess: this.cleanup(event.element().up().up(".edit"))
      });
    },

    cancelEditClickEvent: function(event) {
      event.stop();
      this.cleanup(event.element().up().up(".edit"));
    },

    cleanup: function(edit) {
      edit.blindUp({
        afterFinish: function() { edit.update(""); }
      });
    }
  };

  document.observe("dom:loaded", function(){
    if($("widget_store")){ WidgetStore.initialize(); }
  });
})();