//
// Trolley
//
(function ($) {
	//
	// plugin definition
	//
	$.fn.trolley = function (options) {
		// build main options before element iteration
		var opts = $.extend({}, $.fn.trolley.defaults, options);
		// iterate and reformat each matched element
		return this.each(function () {
			var $this = $(this);
			// build element specific options
			var data = $this.metadata();
			//debug(inspect(data));
			var o = data ? $.extend({}, opts, data) : opts;
			// call our markup function
			var m = $.fn.trolley.markup(o);
			$this.html(m);
			var $form = $('form', $this);
			var $input = $('input[type=text]', $form);

			$input.setMask({ mask: '999', autoTab: false, defaultValue: '1', type: 'reverse' });
			$form.wheel(function (event) {
				updown($input, event.delta);
				return false;
			});

			$('a[href="#Up"]', $this).click(function () {
				updown($input, 1);
				return false;
			});

			$('a[href="#Down"]', $this).click(function () {
				updown($input, -1);
				return false;
			});

			$form.submit(function (event) {
				$.getJSON(o.action.replace('{qty}', $input.val()), null, function (data) {
					eval(o.onComplete + "(data)")
				});

				//				Sys.Mvc.AsyncForm.handleSubmit(this, new Sys.UI.DomEvent(event),
				//					{ insertionMode: Sys.Mvc.InsertionMode.replace, onComplete: Function.createDelegate(this, eval(o.onComplete)) });

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

	function updown(el, delta) {
		//var el = $('input[type=text]', $(cart));
		var v = parseInt(el.val());
		if (!v) { el.val(1); v = 1; }
		var n = v + delta;
		if (!v || (n > 0 && n < 1000))
			el.val(n);
	};

	//
	// private function for debugging
	//
	function debug(msg) {
		if (window.console && window.console.log)
			window.console.log(msg);
	};

	//
	// define and expose our format function
	//
	$.fn.trolley.markup = function (o) {
		return '<div class="clear"></div>' +
'<div class="trolley"><form action="" method="post" >' +
	'<div class="spinner">' +
		'<div class="spinner"><input type="text" maxlength=3 value="' + o.qty + '" autocomplete="off"  /></div>' +
		'<div class="updn">' +
			'<div class="up"><a href="#Up" title="Up" ><img class="swapImage {src: \'' + o.imgupl + '\'}" src="' + o.imgup + '" /></a></div>' +
			'<div class="dn"><a href="#Down" title="Down"><img class="swapImage {src: \'' + o.imgdnl + '\'}" src="' + o.imgdn + '" /></a></div>' +
	'</div></div>' +
	'<div class="cart"><input class="swapImage {src: \'' + o.imgcartl + '\'}" src="' + o.imgcart + '" type="image" title="Click here to add to cart" /></div>' +
'</form></div>';
	};
	//
	// plugin defaults
	//
	$.fn.trolley.defaults = {
		action: '', onComplete: '',
		min: 1, max: 99,
		id: 0, name: '',
		qty: 1, price: 0.0,
		imgup: '', imgupl: '',
		imgdn: '', imgdnl: '',
		imgcart: '', imgcartl: ''
	};
	//
	// end of closure
	//
})(jQuery);