$(document).ready(function(){

	//load store menus
	$('#mainNav .menu').siLoadMenu({scope:'content'}).siDropdown({arrows:true});
	$('#sidebar .storeMenu').siLoadMenu({scope: 'categories', hideInactive: true});
	
	// build breadcrumb
	$("#breadcrumb").siLoadBreadcrumb();
	
	// load store search
	$("#headerContent div.storeSearch").siLoadStoreSearch();
	
	// load user links
	$("#sidebar ul.userLinks").siLoadUserLinks();
	
	//load quantity in store cart in these areas
	$("#userCartCount, #microCartCount").siLoadCartCount();
	
	$("#microCart .cartContents").siLoadMicroCart({
		cartMessages: false
	});
	
	//initialize toggles
	$("a.toggle").siToggle();
	
	//initialize input hints
	$("input.storeSearchQuery").attr("title","find it");
	$("input:text").siHint();

	
	//initialize popup links
	$("a.popupLink").siPopup();
	
	//initialize zebra striping on tables and lists
	$("table.zebra").find("tr:even").addClass("stripe");
	$("ul.zebra").find("li:even").addClass("stripe");
	
	// initialize sitewide message
	$("#SImessage").siMessage();
	
	$('.accountLink').replaceWith('<li class="accountLink"><a href="/account/">my account</a></li>');
	$('.cartLink').replaceWith('<li class="cartLink"><a href="/cart/">my cart (<span class="siCartCount" id="userCartCount">0</span>)</a></li>');

	
	// initialize jQuery Cycle slideshow
	$('#mainslideshow').cycle({
		fx: 'fade',
		pause: 1,
		speed: 2000,
		timeout: 8000
	});


	// initialize Carousels 

$("#our-favorites_carousel").carouFredSel({
	auto: 5000,
	duration: 2000,
	items: {
		visible: 5,
		minimum: 1
	},
	scroll: 1
});

$("#store-info_carousel").carouFredSel({
	auto : false,
	height: 250,
	items: {
		visible: 3,
		minimum: 1
	},
	scroll: 1,
	prev : "#store-info_prev",
	next : "#store-info_next"
});


});//END dom ready


/****** VIEW OPTIONS *******/
// To customize these options for a specific view, copy and paste an object or markup variable into its corresponding view.js file.
// EX: to customize the asset sizes used in the default category.htm template, copy and paste si.store.asset_types to the category.view.js file

// set product asset sizes to use for all javascript generated markup
si.store.asset_types = {
	"main" 		: "small", 
	"gallery" 	: "thumb",
	"zoom" 		: "large",
	"callout" 	: "thumb",
	"grid" 		: "thumb",
	"gridSmall" : "thumb",
	"list" 		: "small",
	"subitem"	: "thumb",
	"area"		: "source"
};



//text that appears on the add to cart button
si.store.cart_add_btn_txt = "+ add to cart";

//options for the {PRODUCT_BRAND_LINKS} tag
si.products.brand_link_options = {
	wrapper: 'li',
	separator: ','
};

//options for the {PRODUCT_TAG_LINKS} tag
si.products.tag_link_options = {
	wrapper: 'li',
	separator: ','
};

/****** VIEW MARKUP *******/
// To customize markup for a specific view, copy and paste an object into its corresponding view.js file.
// EX: to customize the grid markup used in the default brand.htm template, copy and paste si.products.grid_markup to the brand.view.js file

si.search.filter_markup =
'<div class="filterGroup">' +
	'{SEARCH_PRICE_FILTER}' +
	'{SEARCH_CATEGORY_FILTER}' +
	'{SEARCH_BRAND_FILTER}' +
'</div>' +
'<div class="filterGroup">' +
	'{SEARCH_OPTION_FILTERS}' +
	'{SEARCH_ATTRIBUTE_FILTERS}' +
'</div>' +
'<div class="filterGroup">' +
	'{SEARCH_COLLECTION_FILTERS}' +
'</div>';

// build callout product div used in featured, related, etc.
si.products.callout_markup = 
'<div class="calloutProduct">' +
	'<a href="{PRODUCT_URL}" title="view detailed info on {PRODUCT_NAME}">{PRODUCT_IMAGE}</a>' +
	'<h3><a href="{PRODUCT_URL}" title="view detailed info on {PRODUCT_NAME}">{PRODUCT_NAME}</a></h3>' +
	'{PRODUCT_PRICE}' +
'</div>';

// grid view markup
si.products.grid_markup =
'<div id="product{PRODUCT_ID}" class="grid">' +
	'<a href="{PRODUCT_URL}" title="view detailed info on {PRODUCT_NAME}">{PRODUCT_IMAGE}</a>' +
	'<h3><a href="{PRODUCT_URL}" title="view detailed info on {PRODUCT_NAME}">{PRODUCT_NAME}</a></h3>' +
	'{PRODUCT_PRICE}' +
	'<div class="itemMeta">' +
		'<ul class="brands clearfix"><li><strong>Brands:</strong></li>{PRODUCT_BRAND_LINKS}</ul>' +
		'<ul class="tags clearfix"><li><strong>Tags:</strong></li>{PRODUCT_TAG_LINKS}</ul>' +
		'{PRODUCT_COMPARE}' +
	'</div>' +
'</div>';

// gridSmall view markup
si.products.gridSmall_markup = 
'<div id="product{PRODUCT_ID}" class="gridSmall">' +
	'<a href="{PRODUCT_URL}" title="view detailed info on {PRODUCT_NAME}">{PRODUCT_IMAGE}</a>' +
	'<h3><a href="{PRODUCT_URL}" title="view detailed info on {PRODUCT_NAME}">{PRODUCT_NAME}</a></h3>' +
	'{PRODUCT_PRICE}' +
	'{PRODUCT_COMPARE}' +
'</div>';

// list view markup
si.products.list_markup = 
'<div id="product{PRODUCT_ID}" class="list clearfix">' +
	'<div class="itemPhotos">' +
		'<a href="{PRODUCT_URL}" title="view detailed info on {PRODUCT_NAME}">{PRODUCT_IMAGE}</a>' +
		'{PRODUCT_COMPARE}' +
	'</div>' +
	'<div class="itemInfo">' +
		'<h2><a href="{PRODUCT_URL}" title="view detailed info on {PRODUCT_NAME}">{PRODUCT_NAME}</a></h2>' +
		'<div class="itemCallout clearfix">' +
			'<div class="itemMeta">' +
				'<div class="prodPricingWrapper">{PRODUCT_PRICE}</div>' +
				'<ul>' +
					'<li class="clearfix"><ul class="brands clearfix"><li><strong>Brands:</strong></li>{PRODUCT_BRAND_LINKS}</ul></li>' +
					'<li class="clearfix"><ul class="tags clearfix"><li><strong>Tags:</strong></li>{PRODUCT_TAG_LINKS}</ul></li>' +
				'</ul>' +
			'</div>' +
			'<div class="prodPurchase"><form id="prodPurchase_{PRODUCT_ID}">' +
				'{PRODUCT_OPTIONS}' +
				'{PRODUCT_ADD_CART}' +
			'</form></div>' +
		'</div>' +
	'</div>' +
'</div>';