/* ===== 'scripts.js' ===== */

// The document is loaded -->
onload = function(){
	HoverProd();	// Смена класса при наведении на блок с товаром -->
	MoreProd();	// Показываем/скрываем блок с подразделами продукции -->
	ProdSearchInit();	// "Аяксовый" поиск по товарам -->
	ProdAddInit();	// "Аякс" добавление товара в корзину -->
	ChangeFormValue();	// Изменение содержимого полей в формах -->
	SubmitForm();	// Стилизация кнопок для отправки форм -->
	CompareFormEvent();	// Сравнение товаров (расставляем и получаем выбранные элементы) -->
	CompareListEvent();	// Полоса прокрутки при сравнении товаров -->
	CartFormEvent();	// Пересчёт кол-ва товаров в корзине -->
}
// -->


// Slider calculate the size -->
function jCSize(param){	// 'false/true' в зависимости от состояния документа (load/resize) -->
	var parentObj = document.getElementById('jCParent');	// Блок-родитель для всего содержимого слайдер (div.corn-content) -->
	var wrapperObj = document.getElementById('jCWrap');	// Блок-обертка для слайдера (div.slider-block) -->
	var sliderObj = document.getElementById('jCSlider');	// Слайдер (ul.slider) -->
	
	if (parentObj && wrapperObj && sliderObj) {	// Если элементы существуют -->
		
		if (param == true) {	// Если сработал 'onresize' -->
			wrapperObj.style.width = '1%';	// Сбрасываем значение (особенно для ie) -->
		}
		
		var parentSize = parentObj.offsetWidth-60;	// Высчитываем ширину без полей (margin: -1px 30px;)  -->
		jCNewSize = Math.floor(parentSize/3);	// Глобальная переменная. Ширина одного элемента (ul.slider li) -->
		
		var array = sliderObj.getElementsByTagName('li');	// Массив всех элементов (ul.slider li) -->
		for (var i=0; i<array.length; i++) {	// Пробегаем по всем элементам (ul.slider li) -->
			var el = array[i];	// Конкретный элемент -->
			el.style.width = (jCNewSize-22)+'px';	// Изменяем ширину, отнимаеи отступы (padding: 5px 11px;) -->
		}
		
		if (param == true) {	// Если сработал 'onresize' -->
			wrapperObj.style.width = (jCNewSize*3)+'px';	// Изменяем ширину (на три элемента) -->
			
			sliderObj.style.width = (jCNewSize*array.length)+'px';	// Изменяем ширину (на все содержимое) -->
			sliderObj.style.left = (-(jCCurrent*jCNewSize))+'px';	// Выставляеям смещение (зависит от текущего элемента) -->
		}
		
	}
	
}
// -->


// Slider clearing interval -->
function jCActive(){
	clearInterval(jCTimer);	// Прерываем движение -->
	jCInterval();	// Возобновляем движение -->
}
// -->


// Смена класса при наведении на блок с товаром -->
function HoverProd(){
	var ids = ['ResProd','jCSlider','RecomProd','ListProd','TableProd'];	// Массив элементов-родителей -->
	var def = [[],[],[],[],[]];	// Для сохранения классов (те, что по-умолчанию были) -->
	
	for (var i=0; i<ids.length; i++) {	// Пробегаем по всем элементам массива -->
		(function(i) {	// Замыкаем на 'i' -->
			
			var obj = document.getElementById(ids[i]);	// Элемент-родитель -->
			
			if (obj) {	// Если элемент существует -->
				
				var array = obj.getElementsByTagName('li');	// Массив всех элементов -->
				for (var k=0; k<array.length; k++) {	// Пробегаем по всем элементам -->
					(function(k) {	// Замыкаем на 'k' -->
						
						var el = array[k];	// Конкретный элемент -->
						def[i][k] = el.className;	// Запоминаем класс (тот, что по-умолчанию) -->
						
						el.onmouseover = function(){	// При наведении -->
							this.className = this.className+' hover';	// Смена класса -->
						}
						el.onmouseout = function(){	// Про потере фокуса -->
							this.className = def[i][k];	// Возвращаем значение по-умолчанию -->
						}
						
					})(k);
				}
				
			}
			
		})(i);
		
	}
	
}
// -->


// Показываем/скрываем блок с подразделами продукции -->
function MoreProd(){
	var obj = document.getElementById('ProdMore');	// Элемент, по которому кликнули -->
	var cat = document.getElementById('ProdCat');	// Блок, который нужно показать -->
	
	if (obj && cat) {	// Если оба элемента существуют -->
		var el = obj.parentNode.parentNode.parentNode;	// Находим родительский 'li' -->
		var def = el.className;	// Класс по-умолчанию -->
		
		obj.onclick = function(){	// Щелчок по элементу -->
			if (this.className == 'more') {	// Сравниваем классы (текущее состояние - закрыт) -->
				SelectBug('hide');	// Исправление бага в ie. Скрываем все 'select'-ы на странице (т.к. их невозможно ничем перекрыть) -->
				this.className = 'click';	// Смена класса -->
				el.className = 'active item click';	// Смена класса -->
				cat.className = 'catalogue';	// Смена класса -->
				
				LessProd(true, obj, cat, el, def);	// Скрываем блок с подразделами продукции по клику на любой области документа, отличной от открывшейся -->
				
			}
			else if (this.className == 'click') {	// Сравниваем классы (текущее состояние - открыт) -->
				this.className = 'more';	// Смена класса -->
				el.className = def;	// Смена класса -->
				cat.className = cat.className+' hide';	// Смена класса -->
				SelectBug('show');	// Исправление бага в ie. Возвращаем на место все 'select'-ы на странице-->
				
				LessProd(false);	// Скрываем блок с подразделами продукции по клику на любой области документа, отличной от открывшейся -->
				
			}
			return false;
		}
		
	}
}
// -->


// Скрываем блок с подразделами продукции по клику на любой области документа, отличной от открывшейся -->
function LessProd(flag, obj, cat, el, def) {
	
	/*
	flag	// Флаг, показывающий, запускать функцию или нет -->
	obj		// Элемент, по которому кликнули (изначально) -->
	cat		// Блок, который нужно показать -->
	el		// Родительский 'li' -->
	def		// Класс по-умолчанию -->
	*/
	
	if (flag) {	// Флаг, показывающий, что нужно запускать функцию -->
		
		document.onclick = function(event) {	// Клик по всему документу -->
			event = event || window.event;	// Кроссбраузерное добавление 'event' -->
			var eTarget = event.target || event.srcElement;	// Кроссбраузерное определение элемента, по которому был совершён клик -->
			
			while(eTarget.tagName.toLowerCase() != 'body') {	// От элемента, по которому совершён клик поднимаемся ввсерх по DOM, пока не встретим 'body' -->
				
				if ((eTarget == cat) || (eTarget == obj)) {	// Если встретили родителей блоков, при клике на которые НЕ нужно скрывать элемент... -->
					return true;	// ...ничего не делаем -->
				}
				
				eTarget = eTarget.parentNode;	// За каждую итерацию поднимаемся на узел выше -->
			}
			
			obj.className = 'more';	// Смена класса -->
			el.className = def;	// Смена класса -->
			cat.className = cat.className+' hide';	// Смена класса -->
			SelectBug('show');	// Исправление бага в ie. Возвращаем на место все 'select'-ы на странице-->
			
			this.onclick = function() {	// После того, как событие уже сработало -->
				return true;	// Оставляем всё как есть -->
			}
			
			return false;
			
		}
		
	}
	else{	// Флаг, показывающий, что функцию запускать не надо -->
		
		document.onclick = function() {	// Клик по всему документу -->
			return true;	// Оставляем всё как есть -->
		}
		
	}
	
}
// -->


// Исправление бага в ie. Скрываем все 'select'-ы на странице (т.к. их невозможно ничем перекрыть) -->
function SelectBug(method) {
	
	/*
	method	// Метод отображения ("hide"/"show") -->
	*/
	
	var array = document.getElementsByTagName('select');
	for (var i=0; i<array.length; i++) {
		var el = array[i];
		if (method == 'hide') {	// Если скрываем 'select'-ы -->
			el.className = el.className+' invisible';	// Скрываем 'select'-ы, присваивая им новый 'class' -->
		}
		else if (method == 'show') {	// Если показываем 'select'-ы -->
			el.className = el.className.slice(0,-10);	// Возвращаем оригинальные названия классов -->
		}
	}
}
// -->


// "Аяксовый" поиск по товарам -->
function ProdSearchInit(){
	var obj = document.getElementById('SearchField');
	var el = document.getElementById('SearchResult');
	
	if (obj && el) {	// Если оба элемента существуют -->
		
		obj.setAttribute('autocomplete', 'off');	// Отключаем опцию автоподстановки -->
		
		var url = obj.form.action;	// 'Url'-адресс формы -->
		var param = '?cmd=process&tpl=1&search_text=';	// Параметры 'get'-запроса -->
		
		obj.onclick = function(){	// Если кликнули по полю... -->
			ProdSearchRequest(obj, el, url, param);	// ...формируем и отправляем "Аякс"-запрос по товарам -->
			return false;
		}
		obj.oncontextmenu = function(){	// Если кликнули по полю правой кнопкой мыши... -->
			ProdSearchRequest(obj, el, url, param);	// ...формируем и отправляем "Аякс"-запрос по товарам -->
			return false;
		}
		obj.onkeyup = function(){	// Если была нажата любая клавиша... -->
			ProdSearchRequest(obj, el, url, param);	// ...формируем и отправляем "Аякс"-запрос по товарам -->
			return false;
		}
		
	}
}
// -->


// Формируем и отправляем "Аякс"-запрос по товарам -->
function ProdSearchRequest(obj, el, url, param) {
	
	/*
	obj		// Элемент, над которым совершаем действие -->
	el		// Элемент, с которым будем работать, после получения результата -->
	url		// 'Url'-адресс формы -->
	param	// Параметры 'get'-запроса -->
	*/
	
	var value = obj.value;	// Содержимое 'value' -->
	
	if (value != obj.defaultValue && value != '') {	// Если поле не по-умолчанию и не пустое... -->
		AjaxRequest('GET', url+param+value, null, el, ProdSearchResult);	// ...отправляем запрос на сервер -->
	}
	
}
// -->


// "Аяксовый" поиск по товарам ('callback'-функция) -->
function ProdSearchResult(el, data) {
	
	/*
	el		// Элемент, с которым будем работать, после получения результата -->
	data	// Заранее сформированные данные -->
	*/
	
	el.className = 'result';
	el.innerHTML = data;
	
	document.onclick = function(event) {	// Клик по всему документу -->
		event = event || window.event;	// Кроссбраузерное добавление 'event' -->
		var eTarget = event.target || event.srcElement;	// Кроссбраузерное определение элемента, по которому был совершён клик -->
		
		var obj = document.getElementById('Search');
		
		while(eTarget.tagName.toLowerCase() != 'body') {	// От элемента, по которому совершён клик поднимаемся ввсерх по DOM, пока не встретим 'body' -->
			
			if (eTarget == obj) {	// Если встретили "нужного" родителя, при клике на которые НЕ нужно скрывать элемент... -->
				return true;	// ...ничего не делаем -->
			}
			
			eTarget = eTarget.parentNode;	// За каждую итерацию поднимаемся на узел выше -->
		}
		
		el.className = 'result hide';
		el.innerHTML = '<!-- // -->';
		
		this.onclick = function() {	// После того, как событие уже сработало -->
			return true;	// Оставляем всё как есть -->
		}
		
		return false;
		
	}
	
	HoverProd();	// Смена класса при наведении на блок с товаром -->
	
}
// -->


// "Аякс" добавление товара в корзину (находим "нужные" ссылки и расставляем события) -->
function ProdAddInit(){
	var array = document.getElementsByTagName('a');
	for (var i=0; i<array.length; i++) {
		var el = array[i];
		if (el.id.slice(0, 12) == 'ProdAddItem_') {	// Нужная нам ссылка 'ProdAddLink_...' -->
			el.onclick = function(){
				
				var url = this.href+'&ajax=1';
				
				var loader = document.createElement('i');
				loader.innerHTML = '<img src="/kscms/img/public/ajax_loader.gif" width="16" height="16" alt="Загрузка..." title="Загрузка..." />';
				this.parentNode.appendChild(loader);
				
				AjaxRequest('GET', url, null, loader, ProdAddResult);
				
				this.parentNode.removeChild(this);
				return false;
			}
		}
	}
}
// -->


// "Аякс" запрос (методами 'get/post') -->
function AjaxRequest(method, url, data, obj, callback) {
	
	/*
	method		// Метод запроса ('get'/'post') -->
	url			// Адрес, на который отправляются данные -->
	data		// Заранее сформированные данные (для 'post'-запроса синтаксис следующий: 'name1=value1&name2=value2&...', для 'get'-запроса ставим null) -->
	obj			// Объект для работы -->
	callback	// Функция, которая будет обрабатывать результат -->
	*/
	
	var request;	// Создаём объект для запроса к серверу -->
	
	if (window.XMLHttpRequest) {	// Для нормальных броузеров  -->
		request = new XMLHttpRequest();
	}
	else if (window.ActiveXObject) {	// Для ie -->
		request = new ActiveXObject('Microsoft.XMLHTTP');
	}
	else{
		alert('Ошибка! Объект "XMLHttpRequest" не поддерживается...');
	}
	
	request.open(method, url, true);	// Создаём асинхронный запрос ('get'/'post') для заданного 'url'-адреса -->
	
	request.onreadystatechange = function(){	// 'onreadystatechange' активируется при получении ответа сервера
		
		if (request.readyState == 4) {	// Приём запроса завершился -->
			if (request.status == 200) {	// Если запрос увенчался успехом (200 = "OK") -->
				
				// request.getResponseHeader('Content-Type'); Узнаём тип заголовка -->
				// request.getAllResponseHeaders(); Узнаём все 'http'-заголовки -->
				// request.responseText -->
				// request.responseXML -->
				
				callback(obj, request.responseText);
				
			}
			else if (request.status == 404) {	// Если запрос НЕ увенчался успехом (404 = "Not Found") -->
			}
			else{
				alert('Ошибка! Запрос не увенчался успехом: '+request.status+' - '+request.statusText);
			}
		}
	}
	
	request.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');	// Обязателен заголовок 'Content-Type', содержащий кодировку (вдруг она не указана a форме?). Ставим по-умолчанию -->
	request.send(data);	// Передаём запрос -->
	
}
// -->


// "Аякс" добавление товара в корзину ('callback'-функция) -->
function ProdAddResult(obj, data) {
	
	/*
	obj		// Объект для работы -->
	data	// Данные, полученные от сервера -->
	*/
	
	var answer = JSON.parse(data);	// Распарсим данные (формата 'json') с помощью специальной библиотеки "json2.js" -->
	
	var error = answer.js.cmd_errors;	// Ошибка-->
	var message = answer.js.cmd_messages;	// Сообщение -->
	var count = answer.js.cart_count;	// Кол-во товаров в корзине -->
	
	var result;	// Сюда запишем конечный результат -->
	
	if (error) {	// Если ответ сервера отрицательный... -->
		result = error;
	}
	else if (message) {	// ...иначе -->
		result = message;
	}
	
	obj.innerHTML = result;	// Выводим на экран -->
	
	if (count) {	// Если добавляем товар - меняем надпись... -->
		document.getElementById('CartTitle').innerHTML = '<a href="/cart/" title="Ваша корзина">Ваша корзина</a>';
	}
	
	document.getElementById('CartCount').innerHTML = '('+count+')'; // ...и счётчик -->
	
}
// -->


// Change contained in "value" -->
function ChangeFormValue(){
	var form = ['Search','FilterForm'];	// Массив конкретных форм -->
	for (var i=0; i<form.length; i++) {	// Пробегаем по массиву с id -->
		var obj = document.getElementById(form[i]);	// Конкретный id -->
		
		if (obj) {	// Если элемент существует -->
			
			var array = obj.elements;	// Массив всех элементов конкретной формы -->
			for (var j=0; j<array.length; j++) {	// Пробегаем по всем элементам -->
				var el = array[j];	// Конкретный элемент -->
				if (el.name == 'status') {
					var status = el.value;
					break;
				}
			}
			
			if (status == '') {	// Флаг, показывающий, были ли отправлена форма -->
				
				for (var j=0; j<array.length; j++) {	// Пробегаем по всем элементам -->	
					var el = array[j];	// Конкретный элемент -->
					if (el.type == 'text' || el.tagName.toLowerCase() == 'textarea') {	// Только "input type='text'" или "textarea" (т.е. те поля, в которые можно водить текст) -->
						el.onfocus = function(){	// Элемент получает "фокус" -->
							if (this.value == this.defaultValue) {	// Если 'value' дефолтное -->
								this.className = 'curr';
								this.value = '';	// Очищаем перед вводом поле -->							
							}
						}
						el.onblur = function(){	// Элемент теряет "фокус" -->
							if (this.value == '') {	// Если ничего не ввели -->
								this.className = '';
								this.value = this.defaultValue;	// Возвращаем значение по-умолчанию -->
							}
						}
					}
				}
				
				obj.onsubmit = function(){	// Перед отправкой формы - проверяем её -->
					return ResultValue(this.elements);	// Передаём a форму массив элементов -->
				}
				
			}
			
		}
	}
}
// -->


// Check result -->
function ResultValue(array) {
	for (var j=0; j<array.length; j++) {	// Пробегаем по всем элементам -->
		var el = array[j];	// Конкретный элемент -->
		if (el.type == 'text' || el.tagName.toLowerCase() == 'textarea') {	// Только "input type='text'" или "textarea" (т.е. те поля, в которые можно водить текст) -->
			if (el.value == el.defaultValue) {	// Если 'value' дефолтное -->
				el.value = '';	// Очищаем его -->
			}
		}
	}
	
	return true; // Возвращаем "false" если форма не прошла валидацию, "true" - если всё устраивает -->
}
// -->


// Стилизация кнопок для отправки форм -->
function SubmitForm() {
	var array = ['ContactsFormSubmit','OrderFormSubmit','SpecSearchFormSubmit','SearchSubmit','FilterFormSubmit','CompareFormSubmit','CartFormSubmit'];	// Массив кнопок для стилизации -->
	var def;
	
	for (var i=0; i<array.length; i++) {	// Пробегаем по массиву с id -->
		var obj = document.getElementById(array[i]);	// Конкретная кнопка -->
		
		if (obj) {	// Если элемент существует -->
			
			obj.onmouseover = function(){	// При наведении меняем класс -->
				def = this.className;
				this.className = def+' submit-hover';
				
				this.onmousedown = function(){	// При наведении: При нажатии кнопки меняем класс -->
					def = this.className.slice(0, -13);
					this.className = def+' submit-active';
				}
				this.onmouseup = function(){	// При наведении: При завершении нажатия меняем класс -->
					def = this.className.slice(0, -14);
					this.className = def+' submit-hover';
				}
			}
			obj.onmouseout = function(){	// Когда убираем мышь с элемента - меняем класс -->
				def = this.className.slice(0, -13);
				this.className = def;
			}
			
		}
		
	}
	
}
// -->


// Сравнение товаров (расставляем и получаем выбранные элементы) -->
function CompareFormEvent(){
	var form = document.getElementById('CompareForm');	// Конкретная форма -->
	if (form) {	// Если элемент существует -->
		
		var result = false;	// Флаг, показывающие, есть ли отмеченные 'input'-ы -->
		var status = document.getElementById('CompareFormActionStatus');	// Блок с информацией по товарам -->
		var buttons = document.getElementById('CompareFormActionButtons');	// Блок с кнопками управления по -->
		
		var array = form.elements;	// Массив всех элементов конкретной формы -->
		for (var i=0; i<array.length; i++) {	// Пробегаем по всем элементам -->
			var el = array[i];	// Конкретный элемент -->
			
			if (el.type == 'checkbox') {	// Только "input type='checkbox'" (т.е. те поля, которые можно отметить) -->
				if (el.checked) {
					result = true;
				}

				el.onclick = function(){	// Если было изменено значение поля... Именно 'onclick',а не 'onchange', т.к. в IE 'onchange' сработает только после потери фокуса -->
					CompareFormEvent();
				}
				
			}
			
		}
		
		if (result) {	// Если хоть что-то было выбрано... -->
			status.innerHTML = 'Вы можете сравнить понравившиеся Вам товары.';
			buttons.className = '';
		}
		else{	// ...иначе -->
			status.innerHTML = 'Выберите товары для сравнения.';
			buttons.className = 'hide';
		}
		
	}
}
// -->


// Полоса прокрутки при сравнении товаров -->
function CompareListEvent(){
	var main = document.getElementById('CompareList');
	var add = document.getElementById('CompareListScroll');
	
	if (main && add) {	// Если оба элемента существуют -->
		if (main.offsetWidth < main.scrollWidth) {	// Узнаём, есть ли горизонтальная полоса прокрутки -->
			add.className = add.className.slice(0,-5);	// Показываем скрытый блок -->
			add.firstChild.style.width = main.scrollWidth+'px';	// Синхронизируем ширину -->
			
			main.onscroll = function(){	// Если "прокрутили" элемент... -->
				add.scrollLeft = this.scrollLeft;	// ...синхронизируем ширину -->
			}
			
			add.onscroll = function(){	// Если "прокрутили" элемент... -->
				main.scrollLeft = this.scrollLeft;	// ...синхронизируем ширину -->
			}
			
		}
	}
	
}
// -->


// Пересчёт кол-ва товаров в корзине -->
function CartFormEvent(){
	var obj = document.getElementById('CartFormRecount');	// Ссылка -->
	var form = document.getElementById('CartForm');	// Форма -->
	
	if(obj && form) {	// Если оба элемента существуют... -->
		obj.onclick = function(){	// ...при клике меняем 'cmd' и перещитываем форму -->
			form.cmd.value = 'recount';
			form.submit();
			
			return false;
		}
	}
	
}
// -->


/* --- © Tarik, 2011 --- */

/* ===== // 'scripts.js' // ===== */