// JavaScript Document
$(function(){
		   
				$('.haschild').bind('click',function(){											 
				var text=$(this).text();								 
				$(this).text(function(){return ($(this).text()=='+'?'-':'+')});								 
				$(this).parent().children('ul').slideToggle()
				})	
			
			$('#category_nav li.current').parents('ul').show()
			$('#category_nav li.current,#product_manue li.current').parents('li').find('.haschild').text('-')
			$('li.current > span.haschild').text('-');
			$('#category_nav li.current, #product_manue li.current').children('ul').show();
   
		   
		   
		   
		   $('.thumbs_wr').css('left',function(){return ($(this).parent().width()-$(this).width())/2});
		  // alert($('.thumbs_wr').width());
  $("a.fancybox").fancybox(
    {
      'overlayOpacity': 0.6,
      'transitionIn'  : 'fade',
      'transitionOut' : 'fade',
      'autoScale': false,
      'overlayColor':'#000',
      'padding': 0,
      'margin': 0,
      'onComplete': function(){
        if($('#fancybox-wrap').find('#preorder_info').length > 0){
          $('#fancybox-close').addClass('preorder');
        }
        if($('#fancybox-wrap').find('#video').length > 0){
          $('#fancybox-close').addClass('video');
        }
      },
      'onClosed': function(){
        $('#fancybox-close').removeClass('video');
        $('#fancybox-close').removeClass('preorder');
      }
    }
  );

  $('.scrollpane').jScrollPane();
});


jQuery(document).ready(function() {
  Gallery.init();
  ColorMatcher.init();
  Carousel.init();
  CarouselDots.init();  
  CloseUp.init();

  $('#cart_quantity').html( $.cookie('cart_quantity') );
  

});


var CloseUp = {
  init:function(){
    $('.close_up img').each(function(){CloseUp.init_slide(this)});
    
    $('#closeup_close a').click(function(){
      CloseUp.close(this);
      return false;
    });
    
    $('#closeup_nav .left').click(function(){
      CloseUp.prev(this);
      return false;
    });
    $('#closeup_nav .right').click(function(){
      CloseUp.next(this);
      return false;
    });
    
    $(document).keyup(function(event){
      // console.log(event.keyCode);
      if($('#product_closeup_container').css('display') == 'block'){
        if(event.keyCode == '39'){
          event.preventDefault();
          $('#closeup_nav .right').click();
        } else if(event.keyCode == '37'){
          event.preventDefault();
          $('#closeup_nav .left').click();
        } else if(event.keyCode == '27'){
          event.preventDefault();
          $('#closeup_close a').click();
        }
      }      
    });
  },
  init_slide:function(el){
    var new_slide = $('<a>');
    new_slide.html('&bull;').attr('href', '#').click(function(){
      CloseUp.show_slide(this);
      return false;
    });
    $('#slides').append($('<li>').append(new_slide));
    
//    $(el).attr('style', 'cursor:pointer');
//    $(el).click(function(){
//      CloseUp.open_and_show_slide(this);
//      return false;
//    });
  },
  
  next:function(){
    var cur = $('#slides .current');
    var i = $('#slides a').index(cur);
    
    if($('#slides a').length > i+1){
      CloseUp.show_slide(cur.parent().next().find('a'));
    } else {
      CloseUp.show_slide($('#slides a').first());
    }
  },
  prev:function(){
    var cur = $('#slides .current');
    var i = $('#slides a').index(cur);
    
    if(0 < i){
      CloseUp.show_slide(cur.parent().prev().find('a'));
    } else {
      CloseUp.show_slide($('#slides a').last());
    }
  },
  open_and_show_slide:function(el){
/*
  $('#product_closeup_container').show();
    $('html .page, html .footer').hide();
    
    $('#product_closeup img').remove();
    
    var tar = $('#slides a').get($('.close_up img').index($(el)));
    CloseUp.show_slide($(tar));
    */
  }, 
  show_slide:function(el){
    $('#slides .current').removeClass('current');
    $(el).addClass('current');

    var tar = $('.close_up img').get($('#slides a').index($(el)));
    
    if($('#product_closeup img').length > 0){
      $('#product_closeup img').fadeOut('400', function(){
        $('#product_closeup').html($('<img>').attr('src', $(tar).attr('src')).attr('style', 'display:none'));
        $('#product_closeup img').fadeIn('400');
      });
    } else {
      $('#product_closeup').html($('<img>').attr('src', $(tar).attr('src')).attr('style', 'display:none'));
      $('#product_closeup img').fadeIn('400');
    }
    
    Gallery.show($($('.productThumbs a:not(.fancybox) .thumb').get($('#slides a').index($('#slides a.current')))));
  },
  close:function(){
    $('#product_closeup_container').fadeOut();
    $('html .page, html .footer').show();
  }
}


var Gallery = {
  init:function(){
    $('.productThumbs a:not(.fancybox) .thumb').click(function(){      
      Gallery.show(this);
      return false;
    });
  },
  next:function(){
    var el = $('.productThumbs .current');
        
    if(el.parent().next(':not(.fancybox)').find('.thumb img').length > 0)
      Gallery.show(el.parent().next().find('.thumb'));
    else
      Gallery.show($('.productThumbs a:not(.fancybox) .thumb').first());
  },
  prev:function(){
    var el = $('.productThumbs .current');    
    
    if(el.parent().prev().find('.thumb').length > 0)
      Gallery.show(el.parent().prev().find('.thumb'));
    else
      Gallery.show($('.productThumbs a:not(.fancybox) .thumb img:last').parent());
  },
  show:function(el){    
    $('.productThumbs .current').removeClass('current');
    $(el).addClass('current');
    
    // $('.product_shot').attr('src', $(el).find('img').attr('data-image-path'));
    Carousel.goto($('.productThumbs a:not(.fancybox) .thumb').index($('.productThumbs .current')));
  }  
}




var Carousel = {
  current: 0,
  step: 4,
  visible: 4,
  maximum: null,
  speed: 300,
  itemWidth: 215,  
  carouselHeight: 250,
  carouselWidth: null,
  carouselWrapWidth: null,
  
  init:function(){
    if($('.carousel').hasClass('product_shot')){
      this.step = 1;
      this.visible = 1;
      this.itemWidth = 490;
      this.carouselHeight = 400;
    } 
          
    this.maximum = $('.carousel ul li').size();
    this.carouselWidth = this.itemWidth * this.maximum;
    this.carouselWrapWidth = this.itemWidth * this.visible;  
            
    $('.carousel ul').css("width", this.carouselWidth+"px").css("left", -(this.current * this.itemWidth)).css("position", "absolute");
    $('.carousel').css("width", this.carouselWrapWidth+"px").css("height", this.carouselHeight+"px").css("visibility", "visible").css("overflow", "hidden").css("position", "relative");
  
    $('.carousel_next').click(function(){
      Carousel.next();
      return false;
      });
    $('.carousel_prev').click(function(){
      Carousel.prev();
      return false;
      });
  },
  next:function(){
    if(this.current + this.step < 0 || this.current + this.step >= this.maximum || this.current >= this.maximum - this.visible) {return; }
    else {
      this.current = this.current + this.step;
      $('.carousel ul').animate({left: -(this.itemWidth * this.current)}, this.speed, null);
    }
    return false;
  },
  prev:function(){
    if(this.current - this.step < 0 || this.current - this.step >= this.maximum) {return; }
    else {
      this.current = this.current - this.step;
      $('.carousel ul').animate({left: -(this.itemWidth * this.current)}, this.speed, null);
    }
    return false;
  },
  goto:function(i){
    this.current = i;
    $('.carousel ul').animate({left: -(this.itemWidth * this.current)}, this.speed, null);
  }
}


var CarouselDots = {
  current: 0,
  step: 4,
  visible: 4,
  maximum: null,
  speed: 300,
  itemWidth: 215,  
  carouselHeight: 250,
  carouselWidth: null,
  carouselWrapWidth: null,
  autoInterval: null,
  resetTimeout: null,
  
  init:function(){
    this.step = 1;
    this.visible = 1;
    this.itemWidth = 840;
    this.carouselHeight = 470;
    
    var self = this;
    var car = $('.carouselDots');
    car.find('.dots a').each(function(i, el){
      $(el).click(function(){
        clearInterval(CarouselDots.autoInterval);
        clearTimeout(CarouselDots.resetTimeout);
        CarouselDots.resetTimeout = setTimeout(self.automate, 30000);
                
        CarouselDots.goto(i-1);
        car.find('.dots .current').removeClass('current');
        $(el).addClass('current');                
      });        
      i++;
    });

    this.maximum = $('.carouselDots ul li').size();
    this.carouselWidth = this.itemWidth * this.maximum;
    this.carouselWrapWidth = this.itemWidth * this.visible;  
            
    $('.carouselDots ul').css("width", this.carouselWidth+"px").css("left", -(this.current * this.itemWidth)).css("position", "absolute");
    $('.carouselDots').css("width", this.carouselWrapWidth+"px").css("height", this.carouselHeight+"px").css("visibility", "visible").css("overflow", "hidden").css("position", "relative");  
    
    this.automate();
  },
  next:function(){
    if(this.current + this.step < 0 || this.current + this.step >= this.maximum || this.current >= this.maximum - this.visible) {return; }
    else {
      this.current = this.current + this.step;
      $('.carouselDots ul').animate({left: -(this.itemWidth * this.current)}, this.speed, null);
    }
    return false;
  },
  prev:function(){
    if(this.current - this.step < 0 || this.current - this.step >= this.maximum) {return; }
    else {
      this.current = this.current - this.step;
      $('.carouselDots ul').animate({left: -(this.itemWidth * this.current)}, this.speed, null);
    }
    return false;
  },
  goto:function(i){
    this.current = i;
    $('.carouselDots ul').animate({left: -(this.itemWidth * this.current)}, this.speed, null);
  },
  automate:function(){    
    var car = $('.carouselDots');
    CarouselDots.autoInterval = setInterval(function(){
      if(car.find('.current').parent().next().find('a').length > 0){
        CarouselDots.next();
        var cur = car.find('.dots .current');
        car.find('.dots a').removeClass('current');
        cur.parent().next().find('a').addClass('current');
      } else {
        CarouselDots.goto(0);
        car.find('.dots a').removeClass('current');
        car.find('.dots a:first').addClass('current');
      }
    }, 10000);
  }
}


var ColorMatcher = {
  nanoColor: 'silver',
  watchColor: 'black',
  
  init:function(){
    $('#colors .nanoColors .colorItem').click(function(){
      ColorMatcher.selectNanoColor(this);
      return false;
    });
    $('#colors .watchColors .colorItem').click(function(){
      ColorMatcher.selectWatchColor(this);
      return false;
    });
    $('#colors .submit_wr input').click(function(){
      ColorMatcher.apply(this);
      return false;
    });
  },
  selectNanoColor:function(el){    
    $('#colors .nanoColors .selected').removeClass('selected');
    $(el).addClass('selected');    
    this.nanoColor = $(el).attr('data-nano-color');
  },
  selectWatchColor:function(el){
    $('#colors .watchColors .selected').removeClass('selected');
    $(el).addClass('selected');        
    this.watchColor = $(el).attr('data-watch-color');    
  },
  apply:function(){
    // console.log('/images/lunatik_color_' + this.nanoColor + '_' + this.watchColor + '.png');
    // $('.product_shot').attr('src', '/images/lunatik_color_' + this.nanoColor + '_' + this.watchColor + '.png');
    $.fancybox.close();    
  }
}