var slide_width = 254
var slides_count = 1
var visible = 3

var step = new Array()

$(document).ready(function(){
  slides_count = $('.boxes_list .box').length
  $('.boxes_list').css('width', slides_count*slide_width)
  
  $("#content-slider").slider({
    animate: false,
    change: handleSliderChange,
    slide: handleSliderSlide,
    max: slides_count - (visible)
  })

  $('.boxes').navigate({
    slides: '.boxes_list .box',
    next: '.nav_next',
    prev: '.nav_prev',
    visible: 3,
    updateSlider: '#content-slider',
    updatePrefix: 'boxes'
  })

  $('.gallery_box').navigate({
    slides: '.gallery li',
    next: '.nav_next',
    prev: '.nav_prev',
    visible: 4
  })
  
  observeTooltip()
  
});

jQuery.fn.navigate = function(o) {
  o = $.extend({updatePrefix: 'pre', click: function(){}
  }, o || {});

  return this.each(function() {
    var me = $(this),
    $slides = $(o.slides, this),
    $next = $(o.next, this),
    $prev = $(o.prev, this)
    
    step[o.updatePrefix] = 0

    if($slides.length>0) {
      $next.removeClass('disabled')
    }

    $next.click(function(){
      if(step[o.updatePrefix] < ($slides.length-o.visible)) {
        step[o.updatePrefix]++
        move($slides, (-1)*step[o.updatePrefix])
        $(o.updateSlider).slider('option', 'value', step[o.updatePrefix])
      }

      if(step[o.updatePrefix] == $slides.length-o.visible) {
        $next.addClass('disabled')
      }

      $prev.removeClass('disabled')
    })

    $prev.click(function(){
      if(step[o.updatePrefix] > 0) {
        step[o.updatePrefix]--
        move($slides, (-1)*step[o.updatePrefix])
        $(o.updateSlider).slider('option', 'value', step[o.updatePrefix])
      }

      if(step[o.updatePrefix] == 0) {
        $prev.addClass('disabled')
      }

      $next.removeClass('disabled')
    })
  })
}

function move(elm, i) {
  var s_w = elm[0].offsetWidth + parseInt($(elm[0]).css('margin-left')) + parseInt($(elm[0]).css('margin-right'))

  $(elm).parent().css('left', i*s_w+'px')
}

function handleSliderChange(e, ui)
{
  var left = 0

  if(ui.length>1){
    left = ui.value*slide_width+6
  } else {
    left = ui.value*slide_width
  }
  
  $('.boxes_list').css('left', -left+'px')

  step['boxes'] = ui.value

  if(step['boxes']== ($('.boxes_list .box').length-3)) {
    $('.boxes .nav_next').addClass('disabled')
  } else {
    $('.boxes .nav_next').removeClass('disabled')
  }

  if(step['boxes']==0) {
    $('.boxes .nav_prev').addClass('disabled')
  } else {
    $('.boxes .nav_prev').removeClass('disabled')
  }
}

function handleSliderSlide(e, ui)
{
  var left = 0

  if(ui.length>1){
    left = ui.value*slide_width+6
  } else {
    left = ui.value*slide_width
  }

  $('.boxes_list').css('left', -left+'px')
}

function observeTooltip() {
    var tooltips = $('.nav_item')
    
    jQuery.each(tooltips, function(){
        $('.nav_link', this).click(function(){
            var $l = $(this)
            $('.nav_item').removeClass('active')
            $(this).parent().addClass('active')
            
            $('.tooltip').removeClass('visible')
            $('.tooltip', $(this).parent()).addClass('visible')
            
            if($('.tooltip', $(this).parent()).html() == null) {
                $($(this).parent()).removeClass('active')
            }

            $(document.body).click(function(e){
                var target = $(e.target);
                if (!target.is(".tooltip *") || target.is('.tooltip .close_button')){
                    $('.nav_item').removeClass('active')
                    $('.nav_item').removeClass('hover')
                    $('.tooltip').removeClass('visible')
                }
            })
            
            return false
        })
        
        $(this).hover(function(){
            $('.nav_item').removeClass('hover')
            $(this).addClass('hover')
        }, function(){
            if(!$('.tooltip', this).hasClass('visible')) {
                $(this).removeClass('hover')
            }
        })
    })
    
    $('.tooltip .close_button').click(function(){
        $('.nav_item').removeClass('active')
        $('.tooltip').removeClass('visible')
        
        return false
    })
}