// Place your application-specific JavaScript functions and classes here
// This file is automatically included by javascript_include_tag :defaults

function initSearchForm () {
	// Hide the label, add hooks to style the inputs,
	// set some text for the text box value and
	// add event handlers to clear the box on focus
	var initText = 'Search shop34th...';
	$('#search_box').addClass('js');
	$('#search_box label').hide();
	if ( $('#keywords').val() == '' ) {
		$('#keywords').val(initText);
	}
	$('#keywords').focus( function () {
		if ( $(this).val() == initText ) {
			$(this).val('');
		}
	});
	$('#keywords').blur( function () {
		if ( $(this).val() == '' ) {
			$(this).val(initText);
		}
	});
}

function initContactForm () {
	var form = $('#contact_form');
	// Make sure the submit button isn't disabled
	$('#contact_submit').attr('disabled','').val('Send');
	// Hide the form
	$('#contact').hide();
	// Add the slide toggle to the contact link
	$('#contact_link').click(function(e){
		e.preventDefault();
		$('#contact').slideToggle('fast', function(){
			$('#name').focus();
		});
	});
	// When the form is submitted, cancel the submit and send an Ajax request instead
	form.submit(function(e){
		
		e.preventDefault();
		if (MMAlertActive) {
			return false;
		}
		// Disable the submit button
		$('#contact_submit').attr('disabled','disabled').val('Sending...');
		$.ajax({
			type: 'POST',
			url: ajaxContactUrl,
			dataType: 'text',
			data: {
				name: $('#name').val(),
				email: $('#email').val(),
				message: $('#message').val(),
				authenticity_token: authToken
			},
			success: function (msg) {
				// Replace the form with a success message
				$('#contact_msg_msg').html(msg);
				$('#contact_form').slideUp('fast', function(){
					$('#contact_msg').slideDown('fast');
				});
			},
			error: function (msg) {
				// Alert the problem and re-enable the submit button
				MMAlert(msg.responseText);
				$('#contact_submit').attr('disabled','').val('Send');
			}
		});
	});
}

/*
  Featured
*/

function initFeatured () {
	// first randomize the Featured items
	var items = randomizeArray( $('#featured li') );
	$('#featured').html(items);
	
	// Then make it a carousel
	$('#featured').jcarousel({
		auto: 9.5,
		wrap: 'both',
		easing: 'easeInOutQuart'
	});
	
	// Hide the buttons except on hover
	$('.jcarousel-skin-featured .jcarousel-next, .jcarousel-skin-featured .jcarousel-prev').hide();
	$('.jcarousel-skin-featured').hover(function(){
		$('.jcarousel-skin-featured .jcarousel-next, .jcarousel-skin-featured .jcarousel-prev').fadeIn('fast');
	}, function () {
		$('.jcarousel-skin-featured .jcarousel-next, .jcarousel-skin-featured .jcarousel-prev').fadeOut('fast');
	});
}


/*
	pass an array in and the order gets randomized
*/
function randomizeArray ( myArray ) {
	var i = myArray.length;
	if ( i == 0 ) return false;
	while ( --i ) {
		var j = Math.floor( Math.random() * ( i + 1 ) );
		var tempi = myArray[i];
		var tempj = myArray[j];
		myArray[i] = tempj;
		myArray[j] = tempi;
	}
	return myArray;
}

/*
  Moxie Machine Alert Stuff
*/

var MMAlertActive = false;
function MMAlert (msg) {
	if (MMAlertActive) {
		return false;
	}
	MMAlertActive = true;
	MMAlert_showOverlay();
	MMAlert_showMsg(msg);
}
function MMAlert_showOverlay () {
	$("body").append('<div id="MMAlert_overlay"></div>');
	$('#MMAlert_overlay').hide()
		.css('opacity', 0.5)
		.click(function() { closeMMAlert(); });
		// .fadeIn(200);
		
	$('#MMAlert_overlay').height( $(document).height() )
		.fadeIn(200);
	
	return false
}
function closeMMAlert () {
	$('#MMAlert_overlay').fadeOut(200, function(){
		$('#MMAlert_overlay').remove();
	});
	$('#MMAlert').fadeOut(200, function(){
		$('#MMAlert').remove();
	});
	MMAlertActive = false;
}
function MMAlert_showMsg (msg) {
	$("body").append('<div id="MMAlert" style="display:none;">\
		<div id="MMAlert_msg"></div>\
		<button id="MMAlert_close" onclick="closeMMAlert();">Ok</button>\
	</div>');
	$('#MMAlert_msg').html(msg);
	
	// calculate top offset for the alert 
	var alertTop = $(window).scrollTop() + ($(window).height() / 3);
	
	$('#MMAlert').css({
			top: '-50px'
		})
		.show()
		.animate({
			top: alertTop
		}, 600, 'easeOutBack')
}