$(document).ready(function () {

	// Load email if js
	$('.no-js').html('<a href="mailto:contact@updatewall.com">contact'+'@'+'updatewall'+'.com</a>');

	$('.button.getstarted.qtip').qtip({
	   content: $('#signupShowModal'),
	   show: {
		   when: 'mouseover',
		   effect: {
			   type: 'fade',
			   length: 500
		   }
	   },
	   position: {
		  corner: {
			 target: 'rightMiddle',
			 tooltip: 'leftMiddle'
		  }
	   },
	   style: {
			name: 'dark',
			border: {
			 width: 7,
			 radius: 5
			},
			width: {max: 400},
			tip: 'leftMiddle'
	   }
	});

   // Create a common qTip configuration
   var config = {
      content: {
         title: {
            text: ' ',
            button: 'Close'
         }
      },
      position: {
         target: $(document.body), // Position it via the document body...
         corner: 'center' // ...at the center of the viewport
      },
      show: {
         when: 'click', // Show it on click
         solo: true // And hide all other tooltips
      },
      hide: false,
      style: {
		 name: 'dark',
         width: { max: 350 },
         padding: '14px',
         border: {
            width: 9,
            radius: 9
         }
      },
      api: {
         beforeShow: function()
         {
            // Fade in the <span class="highlight" style="padding-left: 0px; padding-right: 0px;">modal</span> "blanket" using the defined show speed
            $('#qtip-blanket').fadeIn(this.options.show.effect.length);
         },
         beforeHide: function()
         {
            // Fade out the <span class="highlight" style="padding-left: 0px; padding-right: 0px;">modal</span> "blanket" using the defined hide speed
            $('#qtip-blanket').fadeOut(this.options.hide.effect.length);
         }
      }
   };


   /* Modal box asking about installation services */
  var saleOptions = $.extend(true, {}, config, {
	 content: {
		 title: {
				text: 'Installation Services',
//				text: 'Limited Beta',
				button: 'Close'
			 },
			text: $('#monthly-formModal').html()
			/*text: '<p>Sorry we\'re not fully open yet and are only accepting a limited number of users.</p>'+
				'<p>If you are interested please email us at contact [at] updatewall.com</p>'*/
		 },
		 show: {
			 when: 'submit'
		 }
	});

	$('#monthly-form').qtip(saleOptions).bind('submit', function(event){

		if($('.add-install', this).length > 0) {
			return true;
		}

		event.preventDefault(); return false;
	});

	saleOptions.content.text = $('#yearly-formModal').html();
	$('#yearly-form').qtip(saleOptions).bind('submit', function(event){

		if($('.add-install', this).length > 0) {
			return true;
		}

		event.preventDefault(); return false;
	});

	/* Installation choices */
	$('#monthly-yes-install').live('click', function () {
		var form = $('#monthly-form').html();

		var input = '<input type="hidden" name="addons[]" class="add-install" value="6" />';
		$('#monthly-form').html(form+input);
		$('#monthly-form').submit();
		return false;
	});

	$('#monthly-no-install').live('click', function () {
		var form = $('#monthly-form').html();
		var input = '<input type="hidden" name="addons[]" class="add-install" value="0" />';
		$('#monthly-form').html(form+input);
		$('#monthly-form').submit();
		return false;
	});

	$('#yearly-yes-install').live('click', function () {
		var form = $('#yearly-form').html();

		var input = '<input type="hidden" name="addons[]" class="add-install" value="7" />';
		$('#yearly-form').html(form+input);
		$('#yearly-form').submit();
		return false;
	});

	$('#yearly-no-install').live('click', function () {
		var form = $('#yearly-form').html();
		var input = '<input type="hidden" name="addons[]" class="add-install" value="0" />';
		$('#yearly-form').html(form+input);
		$('#yearly-form').submit();
		return false;
	});

   $('a[rel="modal"]').each(function(i) // Notice the i variable
   {
      // Create a new 'config' object and add the right content from our content array
      var options = $.extend(true, {}, config, {
		 content: {
			 title: {
				text: $(this).attr('title'),
				button: 'Close'
			 },
			 text: $('#'+$(this).attr('id')+'Modal')
		 }
	});

      // Create the tooltip
      $(this).qtip(options);
   }).bind('click', function(event){ event.preventDefault(); return false; });

   // Create the <span class="highlight" style="padding-left: 0px; padding-right: 0px;">modal</span> backdrop on document load so all <span class="highlight" style="padding-left: 0px; padding-right: 0px;">modal</span> tooltips can use it
   $('<div id="qtip-blanket">')
      .css({
         position: 'absolute',
         top: $(document).scrollTop(), // Use document scrollTop so it's on-screen even if the window is scrolled
         left: 0,
         height: '200%', // Span the full document height...
         width: '100%', // ...and full width

         opacity: 0.7, // Make it slightly transparent
         backgroundColor: 'black',
         zIndex: 5000  // Make sure the zIndex is below 6000 to keep it below tooltips!
      })
      .appendTo(document.body) // Append to the document body
      .hide(); // Hide it initially

 // Slideshow
  var currentPosition = 0;
  var slideWidth = 390;
  var slides = $('.slide');
  var numberOfSlides = slides.length;

  // Remove scrollbar in JS
  $('#slidesContainer').css('overflow', 'hidden').css('width', '390px');

  // Wrap all .slides with #slideInner div
  slides
  .wrapAll('<div id="slideInner"></div>')
  // Float left to display horizontally, readjust .slides width
  .css({
    'float' : 'left',
    'width' : slideWidth
  });

  // Set #slideInner width equal to total width of all slides
  $('#slideInner').css('width', slideWidth * numberOfSlides);

  // Insert left and right arrow controls in the DOM
  $('#slideshow')
    .prepend('<span class="control" id="leftControl">Move left</span>')
    .append('<span class="control" id="rightControl">Move right</span>');

  // Hide left arrow control on first load
  manageControls(currentPosition);

  // Create event listeners for .controls clicks
  $('.control')
    .bind('click', function(){
    // Determine new position
      currentPosition = ($(this).attr('id')=='rightControl')
    ? currentPosition+1 : currentPosition-1;

      // Hide / show controls
      manageControls(currentPosition);
      // Move slideInner using margin-left
      $('#slideInner').animate({
        'marginLeft' : slideWidth*(-currentPosition)
      });
    });

  // manageControls: Hides and shows controls depending on currentPosition
  function manageControls(position){
    // Hide left arrow if position is first slide
    if(position==0){ $('#leftControl').hide() }
    else{ $('#leftControl').show() }
    // Hide right arrow if position is last slide
    if(position==numberOfSlides-1){ $('#rightControl').hide() }
    else{ $('#rightControl').show() }
    }

 // redirect to cart after posting
 function postCart(type){
	$.post('/order/index.php',$('#'+type+'-form').serialize(),function () {
		window.location = '/order/index.php?task=view_cart';
	});
 }

	// Features tabs
	$('#feature-list a').click(function () {
		var tab = $(this).attr('rel');

		// Change active
		$('#feature-list li').removeClass('active');
		$(this).parent('li').addClass('active');

		// Hide current panel
		$('.featureDiv').hide();
		$('#'+tab).fadeIn();
		
		return false;
	});
	
	// Hide other tabs
	$('.featureDiv:not(:first)').css('display','none');

	$('a.fancy').fancybox({
		'transitionIn'	: 'elastic',
		'transitionOut'	: 'elastic'
});

});