/**
 *  Модуль.
 *  ваш К.О.
 *  @param {object} window  global object
 *  @param {function} $ jQuery library
 *  @param {object} EventMgr EventMgr library
 *  @param {object} App Application
 *  @return {object} api
 */
App.TabDrag = function(window, $, EventMgr, App) {
  'use strict';

  var tabDragSel = '.tab-group',
      dragObj = {},
      MINLEFT = 0,
      MAXLEFT;

  function $content() {
    return $('#nav-tabs');
  }

  function makeShadow($target) {
    var width = $target.width(),
        height = $target.height(),
        $shadow = $('<li class="tab-group__shadow" style="width: ' +
         width + 'px;"></li>');
    dragObj.$shadow = $shadow;
    dragObj.width = width;
    dragObj.$obj.after(dragObj.$shadow);
  }

  function detectPosition($list) {
    var elems = [];
    $list.children().each(function() {
        if (this.id !== dragObj.obj.id &&
             this.className !== 'tab-group__shadow') {
          var left = this.offsetLeft;
          elems.push({
            left: left,
            right: this.offsetWidth + left,
            self: this
          });
        }
    });
    dragObj.elems = elems;
  }

  function underElement(left, right) {
    var elems = dragObj.elems,
        l = elems.length,
        elem;
    while (l--) {
      //check for left elem
      if (left > elems[l].left && left < elems[l].right) {
        if (left < elems[l].left + ((elems[l].right - elems[l].left) / 2)) {
          elem = elems[l];
          elem.pos = 'before';
          break;
        }
      }
      //check for right
      if (right > elems[l].left && right < elems[l].right) {
        if (right > elems[l].left + ((elems[l].right - elems[l].left) / 2)) {
          elem = elems[l];
          elem.pos = 'after';
        }
        break;
      }
    }
    return elem;
  }

  function drag(e) {
    if ('which' in e && e.which === 3) {
    // Gecko (Firefox), WebKit (Safari/Chrome) & Opera
      return false;
    } else if ('button' in e && e.button === 2) {
    // IE, Opera
      return false;
    }
    document.onmouseup = drop;
    document.onmousemove = move;

    var $self = $(this),
        $parent = $self.parent(),
        obj = this,
        left = obj.offsetLeft;

    dragObj.$obj = $self;
    dragObj.obj = this;
    dragObj.$parent = $parent;

    $self.addClass('tab-group_moving_yes');
    makeShadow($self);

    obj.style.left = left + 'px';
    obj.style.position = 'absolute';
    MAXLEFT = $parent.width() - dragObj.width;

    dragObj.y = e.clientY;
    dragObj.x = e.clientX;

    detectPosition($parent);

    e.preventDefault();
  }
  var timeId;

  function move(e) {
     var y = e.clientY,
         x = e.clientX,
         right,
         left,
         curX = x - dragObj.x,
         curY = y - dragObj.y;

    if (Math.abs(curX) < 10 && Math.abs(curY) < 10) {
      return;
    }
    dragObj.x = x;
    dragObj.y = y;

    left = parseInt(dragObj.obj.style.left, 10) + curX;
    left = left > MINLEFT ? left : MINLEFT;
    left = left < MAXLEFT ? left : MAXLEFT;
    right = left + dragObj.width;

    var elem = underElement(left, right);

    if (elem) {
      $(elem.self)[elem.pos](dragObj.$shadow);
      dragObj.cElem = elem;
      clearTimeout(timeId);
      timeId = setTimeout(function() {
          detectPosition(dragObj.$parent);
      }, 5);
    }

    dragObj.obj.style.left = left + 'px';

    e.preventDefault();
  }

  function drop(e) {
    //check moving elem
    if (dragObj.cElem) {
      $(dragObj.cElem.self)[dragObj.cElem.pos](dragObj.$obj);
      EventMgr.trigger('changeTabSortIndex', {
           s: dragObj.cElem.self.id, t: dragObj.obj.id });
    }
    dragObj.$shadow.remove();
    dragObj.$obj.removeClass('tab-group_moving_yes');
    dragObj.obj.style.position = "";
    //clear dragObj
    dragObj = {};
    document.onmouseup = null;
    document.onmousemove = null;
  }

  function init() {
    EventMgr.on($content(), tabDragSel, 'mousedown', drag);
  }

  var api = {
    init: init
  };

  return api;

} (window, $, EventMgr, App);