// Sites module
define(function (require) {
  "use strict";

  /*  DEPS */

  // Create a new module.
  var app = require('app'),
    Sites = app.module();

  var PageableCollection = require("vendor/backbone-pageable/backbone-pageable");

  /*  END DEPS */

  /*  MODELS & COLLECTIONS */

  // Default Model
  Sites.Models.Site = Backbone.Model.extend({
    defaults: {
      title: ''
    }
  });

  // Default Collection
  Sites.Collections.Sites = PageableCollection.extend({
    url: 'http://tadjik1.apiary.io/api/sites',
    model: Sites.Models.Site,

    mode: 'client',

    parse: function (resp) {
      return resp.sites || resp;
    },

    state: {
      pageSize: 5
    },

    search: function (val) {
      this.origModels = this.origModels || this.fullCollection.models;
      if (val === "") return this.origModels;

      var pattern = new RegExp(val.toLowerCase(), "gi");
      return _.filter(this.origModels, function (model) {
        return pattern.test(model.get("title").toLowerCase());
      });
    },

    setActive: function (model) {
      this.trigger('select:model', model);
    },

    unselect: function () {
      this.trigger('unselect:model');
    }

  });

  /* END MODELS & COLLECTIONS */

  /*  VIEWS */

  Sites.Views.Layout = Backbone.Layout.extend({
    template: "sites/layout",
    className: 'container-fluid',

    initialize: function (options) {
      _.bindAll(this);

      this.siteId = options.siteId;
      this.collection = new Sites.Collections.Sites();
      this.collection.on('select:model', this.renderSite);
      this.collection.on('unselect:model', this.renderSiteList);

      if (this.siteId) {
        var model = new Sites.Models.Site({
          id: this.siteId
        });
        this.renderSite(model);
      } else {
        this.renderSiteList();
      }
    },

    beforeRender: function () {
      var actions = new Sites.Views.Actions({
        collection: this.collection
      });
      this.setView('.actions', actions);
    },

    renderSite: function (model) {
      var siteView = new Sites.Views.SiteView({
        model: model,
        collection: this.collection
      });
      this.setView('.content', siteView);

      siteView.render();
    },

    renderSiteList: function () {
      var siteListView = new Sites.Views.SiteList({
        collection: this.collection
      });
      this.setView('.content', siteListView);

      if (this.collection.length) {
        siteListView.render();
      } else {
        this.collection.fetch({
          success: siteListView.render
        });
      }
    }
  });

  Sites.Views.SiteView = Backbone.View.extend({
    template: 'sites/site',

    initialize: function () {
      _.bindAll(this);

      if (!this.model.isNew() && !this.model.get('title')) {
        this.model.fetch({
          success: this.render
        });
      } else {
        this.render();
      }
    },

    serialize: function () {
      return {
        title: this.model.get('title')
      }
    }
  });

  Sites.Views.SiteList = Backbone.View.extend({
    template: 'sites/list',

    initialize: function () {
      _.bindAll(this);
      this.listenTo(this.collection, 'reset', this.render);
    },

    beforeRender: function () {
      this.collection.each(function (model) {
        var view = new Sites.Views.SiteItem({
          model: model,
          collection: this.collection
        });
        this.insertView('tbody', view);
      }, this);
    }
  });

  Sites.Views.SiteItem = Backbone.View.extend({
    template: 'sites/item',
    tagName: 'tr',

    events: {
      'click': 'setActive'
    },

    initialize: function () {
      _.bindAll(this);
    },

    serialize: function () {
      return {
        title: this.model.get('title')
      };
    },

    setActive: function () {
      this.collection.setActive(this.model);
    }
  });

  Sites.Views.Actions = Backbone.View.extend({
    template: 'sites/actions',
    className: 'container-fluid well',

    events: {
      'keyup input[name="filteredByTitle"]': 'filteredByTitle',
      'click .backToList': 'backToList',
      'click .createsite': 'createsite'
    },

    initialize: function () {
      _.bindAll(this);
      this.listenTo(this.collection, 'select:model', this.oneElementView);
    },

    beforeRender: function () {
      var pagination = new Sites.Views.Pagination({
        collection: this.collection
      });
      this.setView('.pagination', pagination);
    },

    oneElementView: function () {
      this.$('.pagination, .filterName').hide();
      this.$('.backbutton').show();
    },

    backToList: function () {
      this.collection.unselect();
      this.$('.pagination, .filterName').show();
      this.$('.backbutton').hide();
    },

    createsite: function () {
      var model = new this.collection.model();
      this.collection.add(model);
      this.collection.setActive(model);
    },

    filteredByTitle: function (e) {
      var models = this.collection.search($(e.target).val());
      if (models.length === 0) {
        this.collection.state.currentPage = null;
      } else {
        this.collection.state.currentPage = 1;
      }
      this.collection.fullCollection.reset(models);
    }
  });

  Sites.Views.Pagination = Backbone.View.extend({
    template: 'sites/pagination',

    events: {
      'click .page': 'goToPage',
      'click .next': 'goToNext',
      'click .prev': 'goToPrev'
    },

    initialize: function () {
      _.bindAll(this);
      this.listenTo(this.collection, 'reset', this.render);
    },

    serialize: function () {
      return this.collection.state;
    },

    goToPage: function (e) {
      if (!$(e.target).parent().hasClass('disabled')) {
        this.collection.getPage($(e.target).attr('name'));
      }
    },

    goToNext: function (e) {
      if (!$(e.target).parent().hasClass('disabled')) {
        this.collection.getNextPage();
      }
    },

    goToPrev: function (e) {
      if (!$(e.target).parent().hasClass('disabled')) {
        this.collection.getPreviousPage();
      }
    }
  });


  /* END VIEWS */

  // Return the module for AMD compliance.
  return Sites;
});