menu.js

/* global $, CRD: {}, serialize */

// =require _crd.js
// =require _serialize.js

CRD.ready(function () {
	/*
	 * Header Main Menu
	 */
	var mainMenuTitles = $('.js-head-depts > .js-head-dept'),
		mainMenuContentHolder = $('.js-head-dd-cont-holder'),
		mainMenuContentCurrentHolderId,
		mainContent = $('.main-content'),
		overlayClass = '-overlay',
		mainMenuMore = $('.js-head-more'),
		calcMoreLimit = function () {
			var offsetTop = mainMenuTitles.eq(1).offset().top,
				hiddenLi = 0;

			mainMenuTitles.not('.-js-more-ignore').each(function () {
				if ($(this).offset().top > offsetTop) {
					++hiddenLi;
				}
			});

			return hiddenLi;
		},
		mainMenuReset = function () {
			if (mainMenuTitles.hasClass('active')) {
				$('.fixed-sidebar').css('display', '');
				mainMenuTitles.removeClass('active');
				mainMenuContentHolder.stop(true, true).slideUp(300);
				mainContent.removeClass(overlayClass);
			}
		};
	mainMenuTitles.on({
		click: function (e) {
			if ($(this).hasClass('-separator')) {
				return false;
			}

			e.stopPropagation();

			$('.fixed-sidebar').hide();

			var li = $(this),
				id = li.data('id'),
				vehicleId = li.data('vehicle-id'),
				storeId = li.data('store-id'),
				hide_holder = function () {
					mainMenuContentHolder.slideUp(300);
					mainContent.removeClass(overlayClass);
				},
				show_menu_content = function () {
					mainMenuContentHolder.find('.head_dd_cont_h').hide().filter('[data-id=' + id + ']').show();
					mainMenuContentHolder.stop(true, true).slideDown(300);

					if (mainMenuContentCurrentHolderId === id) { /* Prevent holder hide if there were many requests and one of them comes after last */
						li.siblings().removeClass('active');
						li.addClass('active');
					}

					mainContent.addClass(overlayClass);
				};

			mainMenuContentCurrentHolderId = id;

			if (li.hasClass('active')) {
				hide_holder();
				li.removeClass('active');
				$('.fixed-sidebar').css('display', '');
			} else {
				if (!li.data('requested') || id == 999) {
					li.data('requested', true);
					li.addClass('loading');

					var loading_error = function () {
							li.data('requested', false).removeClass('loading');
						},
						ajaxData = {
							'aafunction': 'get_main_menu_content',
							'groupid': id,
							'vehicleId': vehicleId,
							'storeId': storeId
						},
						limit = id == 999 ? calcMoreLimit() : 0;

					if (limit) {
						ajaxData.limit = limit;
						mainMenuContentHolder.find('.head_dd_cont_h').filter('[data-id=' + id + ']').remove();
					}

					$.ajax({
						type: 'POST',
						url: '/ajax/ajax.php',
						data: 'q=' + encodeURIComponent(serialize(ajaxData)),
						dataType: 'html',
						success: function (data) {
							if (data) {
								li.removeClass('loading');

								/* append loaded data */
								mainMenuContentHolder.find('.wrap').append(data);
								if (mainMenuContentCurrentHolderId !== id) {
									/* The string below hides inserted holder if there were many requests and it's ID isn't equal to last. We have to hide it because only last one should be shown */
									mainMenuContentHolder.find('.head_dd_cont_h').filter('[data-id=' + id + ']').hide();
								} else {
									hide_holder();
									show_menu_content();
								}
							} else {
								loading_error();
							}
						},
						error: function () {
							loading_error();
						}
					});
				} else {
					hide_holder();
					show_menu_content();
				}
			}
		}
	});

	$('.js-head-dd-cont-holder-close').on('click', function () {
		mainMenuReset();
	});
	$('body').on('click', function () {
		mainMenuReset();
	});
	mainMenuTitles.find('a').on('click', function (e) {
		e.preventDefault();
		/* Main Links should not be clickable */
	});
	mainMenuContentHolder.on('click', function (e) {
		e.stopPropagation();
		/* holder shouldn't close if 'click' event fired in its area */
	});

	/*
		Header top departments row. Show/Hide departments dropdown on click
	*/
	var headStoreItem = $('.js-head-stores .-active'),
		headStoresDropDown = $('.head-stores-dd');

	headStoreItem.on('click', function () {
		if (CRD.device.media['mobile-small'] || CRD.device.media['mobile-medium']) {
			headStoresDropDown.toggleClass('-enabled');
		}
	});

	if (mainMenuMore.length) {
		var showHideResizeTimer = 0,
			showHideMore = function () {
				var offsetTop = mainMenuTitles.not('.-js-more-ignore').first().offset().top,
					offsetTopLast = mainMenuTitles.not('.-js-more-ignore').last().offset().top;

				if (offsetTopLast > offsetTop) {
					mainMenuMore.show();
				} else {
					mainMenuMore.hide();
				}
			};

		showHideMore();

		$(window).resize(function () {
			clearTimeout(showHideResizeTimer);

			showHideResizeTimer = setTimeout(function () {
				showHideMore();
			}, 100);
		});
	}

	CRD.device.mediaChange(function () {
		headStoresDropDown.removeClass('-enabled');
	});
});