var _sliderPosition = 0;

var _disableScroll = function (){
	$('.hotels .scrollbar').hide();
	$('.hotels .roller .mover').hide();
	$('.hotels .roller ul:visible').css('position', 'relative');

}

var _enableScroll = function (){
	$('.hotels .scrollbar').show();
	$('.hotels .roller .mover').show();
	$('.hotels .roller ul:visible').css('position', 'absolute');
}

var _checkMovers = function() {
    if(_sliderPosition > 1){
    	$('.hotels .roller .mover .left').show();
    }
    else{
    	$('.hotels .roller .mover .left').hide();
    }

    if(_sliderPosition < 99){
    	$('.hotels .roller .mover .right').show();
    }
    else{
    	$('.hotels .roller .mover .right').hide();
    }
}

var _drawScroll = function (value){
	$('.hotels .roller').each(function () {

        console.log('scroll initialized');

        $('.hotels .roller ul:visible').css('position', 'absolute');

    	var ul = $('ul:visible', this);
	    var productWidth = ul.innerWidth() - $(this).outerWidth();

		if (productWidth > 0){

			_enableScroll();

			if(value == 0){
				$('.hotels .roller .mover .left').hide();
			}

		    var slider = $('.scrollbar', this).slider({
		    	value: value,
		        minValue: 0,
		        maxValue: productWidth,

		        slide: function (ev, ui) {
                    //console.log('slided');
		            ul.css( "left", '-' + Math.round(ui.value/100 * productWidth) + "px" );
		            _sliderPosition = ui.value;
		            _checkMovers();
		        },

		        change: function (ev, ui) {
                    //console.log('changed, productWidth: ', productWidth, ', window size: ', window.outerWidth);
                    ul.animate({ 'left' : '-' + Math.round(ui.value/100 * productWidth) + "px" }, 300, 'linear');
		            _checkMovers();
		        },

		        stop: function (ev, ui) {
                    //console.log('stopped');
		            ul.animate({ 'left' : '-' + Math.round(ui.value/100 * productWidth) + "px" }, 300, 'linear');
		            _checkMovers();
		        }
		    });

            var step = Math.round(190/productWidth * 100);

		    $('.hotels .mover .right').unbind('click').click(function(){
		    	_sliderPosition = ((step + _sliderPosition) < 100) ? _sliderPosition + step : 100;
		    	$(slider).slider('value', _sliderPosition);

		    	return false;
		    });

		    $('.hotels .mover .left').unbind('click').click(function(){
		    	_sliderPosition = ((_sliderPosition - step) > 0) ? _sliderPosition - step : 0;
		    	$(slider).slider('value', _sliderPosition);

		    	return false;
		    });

		} else {
			_disableScroll();
		}
  	});
}

$(window).ready(function(){
	$('.hotels .roller ul:first-child ~ ul').hide();
	_drawScroll(_sliderPosition);
});

var _resizeTimeout = null;

$(window).resize(function(){

    clearTimeout(_resizeTimeout);
    console.log('clear timeout');

    _resizeTimeout = setTimeout(function(){
        console.log('set timeout, position: ', _sliderPosition);
        _drawScroll(_sliderPosition);
    }, 1000);

});


$("document").ready (function () {

    // background roller on main page

	$("#bg-roller").cycle({
	    fx:      'fade',
	    speed:    2500,
	    timeout:  10000,
        next:   '.bg-holder .mover .right',
        prev:   '.bg-holder .mover .left'
	});

    // our hotels roller on main page

    $(".our-hotels .roller").before('<div id="our-hotels-nav">').cycle({
        fx:      'scrollHorz',
        speed:    1000,
        timeout:  0,
        width:    608,
        fit:      1,
        next:   '.our-hotels .mover .right',
        prev:   '.our-hotels .mover .left',
        pager:  '#our-hotels-nav',
        pagerAnchorBuilder: function(idx, slide){
            return '<a class="dot" href="#"></a>';
        }
    });


    // our hotels filter tabs
	
    $('.hotels .filter-options a').click(function(){

        $('.hotels .filter-options a').removeClass('active');
        $(this).addClass('active');

        $('.hotels .roller ul').hide();
        $('.hotels .roller ul[rel='+this.id+']').show();

        _sliderPosition = 0;
        _drawScroll(0);

        return false;
    });


    // hotel images on hotel info page roller

    $(".hotel-slider .hotel-photoes .block-image").after('<ul class="photoes-list">').cycle({
         fx:      'fade',
         speed:    2500,
         timeout:  0,
         pager:  '.photoes-list',
         pagerAnchorBuilder: function(idx, slide){
             return '<li><a href="#"><img src="'+slide.src+'" alt="" width="41px" height="41px"/></a><div class="triangle"></div></li>';
         }
     });



});