var intervalId = null;
var idleTime = 10000;
var mycarousel_itemList = [
		{
		id: 'mission',
		html: 			'<div class="text">' +
											'<div><div style="float:left;width:510px;"><img src="/img/top-features/top-text-en.jpg" alt="" width="506" height="150" /></div>' +
                                            '<div style="float:left;width:300px;">Through our expertise in the placement of child-care and ' +
												'housekeeping (maid) staff, complimented by our house' +
												'cleaning-pro and handyman services, we think it is now ' +
												'time to bring happiness to you!<br /><br />' +
												'<strong>Click on your desired service below the pictures ' +
												'to find out more.</strong></div>' +
											'<div class="clearer">&nbsp;</div>' +
										'</div>' +
										'<div><img src="/img/top-features/5-faces.jpg" alt="" width="840" height="172" /></div>' +
							'</div>'
	},
	{
		id: 'housekeeping',
		html: '<div class="text">' +
				'<h1>Housekeeping Service</h1>' +
				'<h2>It&#39;s our turn to clean the kitchen!!</h2>' +
				'<p>Why spend your free time cleaning when you&#39;ve got Chez Vous! Think of all the time you&#39;ll save with Chez Vous handling your routine chores….cleaning, laundry, ironing…and more!</p>' +
				'<p class="link"><a href="/english/client/housekeeping/service.html">Click here to learn more &gt;</a></p>' +
				'</div>'
	},
	{
		id: 'babysitting',
		html: '<div class="text">' +
				'<h1>Babysitting Service</h1>' +
				'<h2>Peace of mind that your children are in good hands.</h2>' +
				'<p><em>Chez Vous</em> sitters will ensure the safety of your<br />children in a stimulating and nurturing environment.</p>' +
				'</div>' +
				'<table>' +
				'<tr class="first">' +
				'<td><img src="/material/images/english/top/babysitting-24by365.gif" alt="" /></td>' +
				'<td><img src="/material/images/english/top/babysitting-experienced-childcare.gif" alt="" /></td>' +
				'<td><img src="/material/images/english/top/babysitting-english-speaking-babysitters.gif" alt="" /></td>' +
				'</tr>' +
				'<tr>' +
				'<td><img src="/material/images/english/top/babysitting-flexible-scheduling.gif" alt="" /></td>' +
				'<td><img src="/material/images/english/top/babysitting-safety-training.gif" alt="" /></td>' +
				'<td><img src="/material/images/english/top/babysitting-group-sitting.gif" alt="" /></td>' +
				'</tr>' +
				'</table>' +
				'<div class="link">' +
				'<p><!--CALL NOW  0120-699-100<br />or --><a href="/english/client/babysitting/service.html">Click here to learn more &gt;</a></p>' +
				'</div>'
	},
	{
		id: 'full-time',
		html: '<div class="text">' +
				'<h1>Full-time Placement</h1>' +
				'<h2>The perfect match</h2>' +
				'<p>Placement and consulting service for the introduction <br />of full-time domestic helpers.</p>' +
				'<p class="link"><a href="/english/client/fulltime/">Click here to learn more &gt;</a></p>' +
				'<p class="caption">It doesn&#39;t get easier than this:</p>' +
				'</div>' +
				'<div class="information">' +
				'<img src="/material/images/english/top/full-time-contact-information.gif" alt="" />' +
				'</div>'
	},
	{
		id: 'handyman',
		html: '<div class="caption">' +
				'<h1>House Cleaning & Handyman</h1>' +
				'<p>Man Power to tackle the heavy duty and technical jobs.</p>' +
				'</div>' +
				'<div class="text-1">' +
				'<h2>House Cleaning Service</h2>' +
				'<p><em>Dirty Carpet? Dusty air-con?</em></p>' +
				'<p>The <em>Chez Vous</em> clean-team will come armed with the machines, tools and detergents for those specialist cleaning tasks&hellip;</p>' +
				'<p class="link"><a href="/english/client/other/housecleaning.html">Click here to learn more &gt;</a></p>' +
				'</div>' +
				'<div class="text-2">' +
				'<h2>Handyman Service</h2>' +
				'<p><em>Chez Vous</em> is here to help. Our handymen are ready for any task. Be it picture hanging in your new home, setting up your Sky Perfect, assembling DIY furniture, or any other miscellaneous tasks, you can count on us.</p>' +
				'<p class="link"><a href="/english/client/other/handyman.html">Click here to learn more &gt;</a></p>' +
				'</div>'
	},
	{
		id: 'chezvous',
		html: '<div class="text">' +
				'<h1>Chez Vous</h1>' +
				'<h2>On a mission of happiness. Simple as that.</h2>' +
				'<p><em>Chez Vous</em> is the Number One housekeeping and babysitting<br />service for foreigners in Tokyo and Yokohama.</p>' +
				'<p>At the heart of <em>Chez Vous&#39;</em> mission is the aim to bring happiness<br />to our clients through trustworthy, professional staff.</p>' +
				'<div class="link" id="areas-details-btn"><span>Click here to see if Chez Vous services your neighborhood</span></div>' +
				'<script>$(\'#areas-details-btn\').one(\'click\', handleAreasButtonClick);</script>' +
				'</div>' +
				'<div class="details" id="areas-details" style="display: none;">' +
				'<p><em>Chez Vous</em> proudly services the following areas:</p>' +
				'<h3>TOKYO</h3>' +
				'<table>' +
				'<tr><td>Minato-ku</td><td>Oota-ku</td><td>Shinjuku-ku</td><td>Itabashi-ku</td><td>Sumida-ku</td><td>Fuchu-shi</td></tr>' +
				'<tr class="even"><td>Shibuya-ku</td><td>Bunkyo-ku</td><td>Suginami-ku</td><td>Katsushika-ku</td><td>Toshima-ku</td><td>Chofu-shi</td></tr>' +
				'<tr><td>Setagaya-ku</td><td>Chiyoda-ku</td><td>Adachi-ku</td><td>Kita-ku</td><td>Taito-ku</td><td>Musashino-shi</td></tr>' +
				'<tr class="even"><td>Meguro-ku</td><td>Chuo-ku</td><td>Arakawa-ku</td><td>Nakano-ku</td><td>Nerima-ku</td><td>Tama-shi</td></tr>' +
				'<tr><td>Shinagawa-ku</td><td>Koto-ku</td><td>Edogawa-ku</td><td>Hachioji-shi</td><td>&nbsp;</td><td>&nbsp;</td></tr>' +
				'</table>' +
				'<h3>KANAGAWA</h3>' +
				'<p>Yokohama, Kamakura, Kawasaki, Zushi, Yokosuka</p>' +
				'<h3>CHIBA <small>&ndash; Selected areas</small></h3>' +
				'<h3>SAITAMA <small>&ndash; Selected areas</small></h3>' +
				'</div>' +
				'<div class="logo">' +
				'<img src="/material/images/english/top/chezvous-logo.gif" width="221" height="174" alt="" />' +
				'</div>'
	}
];

/**
 * Event handlers
 */
function handleAreasButtonClick(e) {
	this.blur();
	$('#areas-details-btn span').css('background', '#f78200 url(/material/images/english/top/areas-details-open-btn.gif) scroll 5px 50% no-repeat');
	$('#areas-details-btn').css('cursor', 'default');
	$('#areas-details-btn').slideUp(50);;
	$("#carousel .chezvous .text, #carousel .chezvous .logo").animate({top:"0"}, 350, function() {
		$('#areas-details').slideDown(350);
	});
	return false;
}

/**
 * This is the callback function which receives notification
 * right after initialisation of the carousel
 */
function mycarousel_initCallback(carousel) {
	$('#carousel .slide').css('display', 'block');
	/*intervalId = setInterval(function() {carousel.next()}, idleTime);
	$('.jcarousel-next').bind('click', function(e) {
		clearInterval(intervalId);
		window.intervalId = null;
	});
	$('.jcarousel-prev').bind('click', function(e) {
		clearInterval(intervalId);
		window.intervalId = null;
	});*/
}

/**
 * This is the callback function which receives notification
 * when an item becomes the first one in the visible range.
 */
function mycarousel_itemFirstInCallback(carousel, item, i, state) {
	var idx = carousel.index(i, mycarousel_itemList.length);
};

/**
 * This is the callback function which receives notification
 * when an item becomes the first one in the visible range.
 * Triggered before animation.
 */
function mycarousel_itemVisibleInCallback(carousel, item, i, state, evt) {
	// The index() method calculates the index from a
	// given index who is out of the actual item range.
	var idx = carousel.index(i, mycarousel_itemList.length);
	carousel.add(i, mycarousel_getItemHTML(mycarousel_itemList[idx - 1]));
};

/**
 * This is the callback function which receives notification
 * when an item is no longer the first one in the visible range.
 * Triggered after animation.
 */
function mycarousel_itemVisibleOutCallback(carousel, item, i, state, evt) {
	carousel.remove(i);
};

/**
 * Item html creation helper.
 */
function mycarousel_getItemHTML(item) {
	return '<div class="slide ' + item.id + '">' + item.html + '</div>';
};

// Ride the carousel...
$(document).ready(function() {
	$("#carousel").jcarousel({
		animation: 1500,
		easing: 'easeInOutCubic',
		scroll: 1,
		wrap: 'circular',
		initCallback: mycarousel_initCallback,
		itemFirstInCallback:  {onBeforeAnimation: mycarousel_itemFirstInCallback},
		itemVisibleInCallback: {onBeforeAnimation: mycarousel_itemVisibleInCallback},
		itemVisibleOutCallback: {onAfterAnimation: mycarousel_itemVisibleOutCallback}
	});
});