(function(templates) {
	templates.render = function(name, data) {
		return $.tmpl(html[name], data);
	};

	var html = {
		// actions.js
		'deleteConfirmation': '<p>${message}</p>',

		// section/cart.js
		'loading': '<h3>Loading...</h3>',

		// section/checkout.js
		'cartItemHover': '<div class="zoom-wrap"><img src="${imageUrl}" /></div>',

		// section/products.js
		'productDetailValidationErrors': '{{each messages}}<p>${this}</p>{{/each}}',
		'productDetailAddToCart': '<h2>Adding your item to your cart...</h2>',
		'productDetailHoverZoomPreview': '<div class="hoverzoom"><div></div></div>',
		'productDetailAlternates': [
				'<ul>',
					'{{each alternates}}',
						'<li>',
							'<a href="${DETAIL}" class="parent-select" data-zoom="${ZOOM}">',
								'<img src="${THUMBNAIL}" alt="${NAME}" />',
							'</a>',
						'</li>',
					'{{/each}}',
				'</ul>'
			].join(''),

		// ui.js
		'sideNavgiationViewAllLink': '<li class="list-toggle"><a href="#">> Hide</a></li>',

		// widget/dialog.js
		'dialogWrapper': '<div>{{html content}}</div>',

		// section/people.js
		'dialogWrapper': '<div class="person"><a class="close">Close<b></b></a>{{html content}}</div>',

		// widget/rotator.js
		'rotatorNavigation': [
				'<ul class="navigation">',
					'{{each items}}',
						'<li><a class="image-index" href="#">${index + 1}</a></li>',
					'{{/each}}',
					'<li><a class="rotator-control" href="#"><span>Play/Pause</span></a></li>',
				'</ul>'
			].join('')
	};

})($.namespace('WEBLINC.templates'));
