Модуль корзины интернет-магазина на jQuery

При разработке интернет-магазинов мне часто приходилось посредством javascript (а конкретнее его фреймворком — jQuery) проделывать некоторые повторяющиеся от проекта к проекту вещи. Например, добавление товаров в корзину, обновление информации о количестве товаров и общей сумме на странице, удаление товаров из корзины по одному, изменение их количества и полная очистка всех товаров из корзины. И все это, разумеется, без перезагрузки страницы.
И я пришел к выводу, что нужно писать код так, что бы потом его с легкостью можно было использовать в следующих проектах.

Итак пишем модуль для работы с корзиной интернет-магазина с использованием jQuery.
Оговорюсь, что я опубликую только javascript-код, серверную часть трогать не буду, обозначу так же, какими данными будет обмениваться клиент с сервером.

Определяемся с методами:

(function($) {
	$.Cart = {
		init : function(settings){
			// инициализация модуля
		},
		add : function(context){
			// добавление одного наименования товара в корзину в количестве 1шт.
		},
		get : function(){
			// обновление информации о количестве товаров в корзине и общей сумме 
		},
		count : function(context) {
			// изменение количества товаров одного и того же наименования в корзине
		},
		del : function(context) {
			// удаление одного наименования из корзины
		},
		clear : function() {
			// полная очистка корзины
		},		
		showMessage : function(message) {
			// показ сообщения при добавлении товара
		}
	}
})(jQuery);

Инициализация:
Что нам нужно сделать в инициализации?
Необходимо переданные в метод init настройки, должным образом обработать (совместить с параметрами по умолчанию) и применить их, а так же повесить на элементы заданные в настройках соответствующие обработчики событий.
Определяемся с параметрами по умолчанию.

var defaults = {
	content : '.content', // селектор главного блока на странице корзины
	count : '.prod span font', // в блоке .prod на странице количество товаров в корзине
	summ : '.summ span font', // в блоке .prod общая сумма
	add : '.tocart', // селектор элемента, при нажатии на который товар будет добавлен в корзину
	addattr : 'name', // атрибут элемента, содержащий ID товара
	counta : '.carts .actions .count input', // поле содержащее количество товаров одного наименования в корзине
	countattr : 'name', // атрибут поля, содержащий ID товара
	countvattr : 'value', // атрибут поля, содержащий количество товаров
	del : '.carts .actions .delete input', // селектор элемента, при нажатии на который 1 наименование товара будет удалено из корзины
	delattr : 'name', // атрибут элемента, содержащий ID товара
	clear : '.cartclear', // селектор элемента, при нажатии на который корзина будет очищена
	topcart : '.topcart', // селектор ссылки ведущей в корзину
	urladd : '/cart/add/', // url добавления товара в корзину
	urlget : '/cart/get/', // url информации о количестве товаров в корзине и общей сумме
	urlcart : '/cart/', // url непосредственно самой корзины
	urlcount : '/cart/count/', // url обновления количества товаров одного наименования
	urlclear : '/cart/clear/', // url полной очистки корзины
	urldel : '/cart/del/', // url удаления одного наименования товара из корзины
	type_message : 'flash', // тип сообщения при добавлении товара в корзину
	time_message : 3000, // время показа сообщения
	interval : 10000 // интервал времени, через который будет обновляться блок с информацией о количестве товаров в корзине и общей сумме
};

Смешиваем параметры указанные при инициализации с параметрами по умолчанию и применяем их

$.extend(defaults, settings);
this.settings = defaults;

Делаем обновление блока с информацией о количестве товаров в корзине и общей сумме, вешаем обработчики событий на заданные элементы и возвращаем сущность объекта (может пригодится).

this.get(); // обновляем блок
setInterval(function(){
	$.Cart.get(); // обновляем блок через заданный в параметрах интервал
}, this.settings.interval);
$(this.settings.add).click(function(){
	$.Cart.add(this); // добавляем товар в корзину при клике на элемент settings.add, в качестве параметра передаем сам элемент
});
$(this.settings.counta).live('blur', function(){
	$.Cart.count(this); // при потере фокуса поля, содержащего количество товаров одного наименования в корзине, передаем информацию на сервер
});
$(this.settings.del).live('click', function(){
	$.Cart.del(this); // удаляем наименование товара при нажатии на элемент "удалить"
});
$(this.settings.clear).live('click', function(){
	$.Cart.clear(); // очищаем корзину
});
return this;

Добавление одного наименования товара в корзину в количестве 1шт.
Метод add, получает параметр context (элемент, на который произошел клик) и отправляет на сервер данные.

$.ajax({
	url : $.Cart.settings.urladd, // куда отправляем данные
	type : 'post', // метод
	dataType: 'json', // тип данных, которые получаем
	data : {id : $(context).attr($.Cart.settings.addattr)}, // данные, которые отправляем (id добавляемого товара)
	success : function(data){ // при получении ответа
	if (data.count && data.summ || data.count===0 && data.summ===0) { // проверяем есть ли в нем количество и общая сумма для того, что бы сразу
		$($.Cart.settings.count).html(data.count); // обновить количество товаров в блоке
		$($.Cart.settings.summ).html(data.summ); // обновить общую сумму в блоке
		if (data.count>0) // если товары есть в корзине, то
			$($.Cart.settings.topcart).find('a').attr('href', $.Cart.settings.urlcart); // делаем ссылку на корзину активной
		else // если корзина пуста
			$($.Cart.settings.topcart).find('a').attr('href', 'javascript:void(0);'); // делаем ссылку неактивной
		$.Cart.showMessage('<p>'+data.message+'</p>'+$($.Cart.settings.topcart).html()); // показываем сообщение
	}
});

Получение информации о количестве товаров в корзине и общей сумме, обновление блока (метод get).
Отличе метода get от add в url на который отправляются данные и в параметрах (метод get не передает параметров).

$.ajax({
	url : $.Cart.settings.urlget,
	type : 'post',
	dataType: 'json',
	data : {},
	success : function(data){
	if (data.count && data.summ || data.count===0 && data.summ===0) {
		$($.Cart.settings.count).html(data.count);
		$($.Cart.settings.summ).html(data.summ);
		if (data.count>0)
			$($.Cart.settings.topcart).find('a').attr('href', $.Cart.settings.urlcart);
		else
			$($.Cart.settings.topcart).find('a').attr('href', 'javascript:void(0);');
	}
});

Думаю, дабы осуществить повторное использование кода, можно добавить некоторый метод updateCart, в который будут переданы url и vars (параметры).

$.ajax({
	url : data.url, 
	type : 'post',
	dataType: 'json',
	data : data.vars,
	success : function(data){
		if (data.count && data.summ || data.count===0 && data.summ===0) {
			$($.Cart.settings.count).html(data.count);
			$($.Cart.settings.summ).html(data.summ);
			if (data.count>0)
				$($.Cart.settings.topcart).find('a').attr('href', $.Cart.settings.urlcart);
			else
				$($.Cart.settings.topcart).find('a').attr('href', 'javascript:void(0);');
			$.Cart.showMessage('<p>'+data.message+'</p>'+$($.Cart.settings.topcart).html());
		}
	},
	error : function(err) {
		if (err.status!==200)
			console.log(err.status+' '+err.statusText);
	}
});

В свою очередь метод add изменится на такой.

$.Cart.updateCart({
	url : $.Cart.settings.urladd,
	data : {id : $(context).attr($.Cart.settings.addattr)}
});

Метод get.

$.Cart.updateCart({
	url : $.Cart.settings.urlget,
	data : {}
});

Изменение количества товаров одного наименования при потере фокуса поля, соответствующего этому наименованию.

count : function(context) { // в метод count передается параметр context (элемент - поле соответствующее наименованию)
	$.post($.Cart.settings.urlcount, { // отправляем запрос на соответствующий url и передаем
		id : $(context).attr($.Cart.settings.countattr), // ID наименования товара
		count : $(context).attr($.Cart.settings.countvattr) // количество товаров этого наименования
	}, function(data){ // получаем данные (text/html)
		$($.Cart.settings.content).html(data); // обновляем все содержимое корзины
		$.Cart.get(); // обновляем блок корзины с краткой информацией
	});
},

Удаление наименования.

del : function(context) { // в метод del передается параметр context (элемент - на который совершен клик для удаления наименования)
	$.post($.Cart.settings.urldel, {  // отправляем данные
		id : $(context).attr($.Cart.settings.delattr) // ID наименования
	}, function(data){ // получаем данные (text/html)
		$($.Cart.settings.content).html(data); // обновляем все содержимое корзины
		$.Cart.get(); // обновляем блок корзины с краткой информацией
	});
},

Очистка корзины.

clear : function() {
	$.post($.Cart.settings.urlclear, {}, function(data){
		$($.Cart.settings.content).html(data); // обычно в data приходит информация о том, что корзина пуста
		$.Cart.get(); // здесь будет всё по нулям, а ссылка на корзину станет неактивной
	});
},

Сообщение о добавлении товара в корзину (в зависимости от типа alert или flash).

showMessage : function(message) { // передается текст сообщения
	if ($.Cart.settings.type_message==='alert') { // если alert
		alert(message); // комментарии излишни
		return;
	} else if ($.Cart.settings.type_message==='flash') { // если flash
		if ($('.flashmessage').length===0) // если элементов с сообщением в документе не найдено, то
			$('<div />').addClass('flashmessage').html(message).hide().appendTo('body').fadeIn(); // создаем его, добавляем в него сообщение, вставляем его перед закрывающим тегом </body>, и плавно отображаем
		else // если найдено
			$('.flashmessage').html(message); // то вставляем в него сообщение
		if (typeof($.Cart.message_time)==='number') // если уже происходит отсчет времени до завершения показа сообщения
			clearTimeout($.Cart.message_time); // сбрасываем его
		$.Cart.message_time = setTimeout(function(){ // заводим новый таймер
			$('.flashmessage').fadeOut(function(){ // по истечению времени показа плавно скрываем
				$(this).remove(); // при завершении скрытия удаляем элемент
			});
		}, $.Cart.settings.time_message); // время показа сообщения
	}
}

Теперь это все объединияем.
По этой ссылке можно посмотреть пример модуля,
а тут можно скачать его архивом.

Модуль будет дописываться и исправляться.

Спасибо за внимание. Жду критики, вопросов и замечаний.
Есть желание доработать это до некого API работы с интернет-магазинами.