/**
 * Плагин для управления панелькой из трёх селектов, в первом список компаний,
 * во втором список серий либо типов картриджей, в третьем - список картриджей
 * либо принтеров. Списки во второй и третий селект подгружаются аяксом.
 *
 * Поведение третьего селекта зависит от режима работы панельки:
 * @param string $mode
 * mode = browse - просмотр принтеров и картриджей, при выборе объекта в последнем
 *    селекте происходит переход на страницу контроллера Links, где показываются
 *    все связи выбранного объекта.
 * mode = add - режим добавления принтеров и картриджей к связи, здесь последний
 *    селект работает просто как часть формы, которая post’ом отправляется на
 *    сервер, при этом возможно выделение нескольких пунктов.
 *
 * Для инициализации надо прицепить плагин к элементу, содержащему три селекта,
 * в первый из которых загружены компании, и каждый селект имеет атрибут url,
 * где хранится адрес, куда отправлять аяксовые запросы.
 */
(function($){
  $.fn.pane = function(options) {
    var opts = $.extend({}, $.fn.pane.defaults, options);

    return this.each(function(){
      var $selects = $('select', this);
      $selects.eq(0).change(on_select);
      $selects.eq(1).change(on_select);
      if (opts.mode == 'browse') { // если просмотр, то повесить обработчки кликов, который перенправляет на другую страницу
        $selects.eq(2).change(on_final_choice);
      }
      if (opts.mode == 'add') { // а если режим добавления, то просто мульти и добавить на кнопку cancel обработку отмены
        $selects.eq(2).attr('multiple', true);
        $(this).append('')
      }
    });
  };

  // plugin defaults - added as a property on our plugin function
  $.fn.pane.defaults = {
    mode: 'browse'
  };

/**
 * обработчиков кликов на компаниях и сериях
 */
  function on_select() {
    var data_name = $(':selected', this).val();
    if (data_name != undefined) {
      if ($.browser != "msie" && $.browser.version != "6.0") {
        $('#pane div.b-pane-loading-overlay').show();
      }

      $(this)
        .attr('disabled', true)
        .parent()
        .next()
        .children('select')
        .empty()
        .attr('disabled', true)
      .parent()
        .next()
        .children('select')
        .empty()
        .attr('disabled', true)
      var company_id = $(this).parent().prev().children().children(':selected').val();

      data_name += company_id != undefined ? '-' + company_id : '';
      var cached = $(this).data(data_name);
      if (cached != undefined) {
        update_list({id: this.id, data: cached, request: data_name});
      }
      else {
        var url = $(this).attr('url'); // создаём урл для отправки аяксового запроса — это его начало
        url += company_id != undefined ? '/' + company_id : ''; // id компании при необходимости (это когда кликнут тип модели во стором селекте)
        url += '/' + $(':selected', this).val(); // добавляем параметр — id выбранного элемента (компании или серии)
        
        url += '/id:' + this.id; // последнее — id текущего, чтобы потом знать, куда вставлять результат запроса

        $.ajax({
          cache: false,
          contentType: "application/x-www-form-urlencoded",
          error: function(XMLHttpRequest, textStatus, errorThrown){
            alert('Проблема с аяксом: ' + textStatus)
          },
          url: url,
          method: 'get',
          dataType: 'json',
          success: update_list
        });
      }
    }
  }
  
/**
 * клик на картридже или принтере - переход
 */
  function on_final_choice() {
    var pane_div = $(this).parent().parent();

    //  url = this.url / sel1.name / sel2.name / this.name
    var url = $(this).attr('url') + '/';
    url += $('select:first :selected', pane_div).val() + '/'; // компания
    url += $('select:eq(1) :selected', pane_div).val() + '/'; // серия/тип
    url += $(':selected', this).val();
    window.location = url;
  }

/**
 * загрузка данных аяксом и заталкивание их в соседний select
 */
  function update_list(response) {
    var jqSelect = $("#" + response.id)
      .removeAttr('disabled')
      .data(response.request, response.data)

    if ($.browser != "msie" && $.browser.version != "6.0") {
      $('#pane div.b-pane-loading-overlay').hide()
    }
      
    var jqNext = jqSelect.parent().next().children('select').empty();

    if (response.data.length == 0) {
      jqNext.addClass('g-empty-message').append('<option value="">ничего нет</option>');
    }
    else {
      for (var i in response.data) {
        jqNext
        .removeAttr('disabled')
        .removeClass('g-empty-message')
        .append('<option value="' + i + '">' + response.data[i] + '</option>');
      }
    }
  }
})(jQuery);
