ohplay_official/public/static/js/module/headerComponent.js

/**
 * 
 * @authors Your Name (you@example.org)
 * @date    2017-06-26 11:33:41
 * @version $Id$
 */

var headerCompoCtrl = function () {
	var pageInit = function () {
		var isMobileMode = false;

		// 移动端则不需要处理
		if (document.documentElement.clientWidth <= 1080) {
			console.log('mobile mode');
			isMobileMode = true;
            isLangShow = false;
			
            langInit();
			mobileHeaderHandler();

            $('.nav-lang').on('click', function () {

                if (!isLangShow) {
                    isLangShow = true;

                    if ($('.lang-en').length) {
                        $('.nav-lang').css('height', '3rem');
                    } else {
                        $('.nav-lang').css('height', '2rem');
                    }
                    
                    $('.nav-lang-hidden').addClass('nav-lang-show');
                } else {
                    isLangShow = false;
                    
                    $('.nav-lang').css('height', '1rem');
                    $('.nav-lang-hidden').removeClass('nav-lang-show');
                }
                
            });

			return;
		}

		langInit();
		navRetract();
	};

	var langInit = function () {
		var langObj = {
			cn: '简体',
			// gb: '繁体',
			en: 'EN'
		};
		var currentLang = TD.util.getQuery('lang') || TD.util.getCookie('lang');

		// 根据当前语言设置导航栏的语言显示
		if (currentLang !== '') {
			$('.nav-lang-current').html('<div class="nav-lang-item">' + langObj[currentLang] + '</div>')
			$('.lang-' + currentLang).hide();
		} else {
			$('.lang-cn').hide();
		};

		if( currentLang == 'en' ){
            /*$('.nav-lang-current').html('<div class="nav-lang-item">' + langObj['cn'] + '</div>')
            $('.nav-lang-current').addClass('nav-lang-fixed-en')
			$('.lang-' + currentLang).hide();
            $('.lang-cn').hide();*/
            $('.nav-lang').remove();

		}

		// 事件委托
		$('.nav-lang-hidden').on('click', function () {
			var target = window.event.target || window.event.srcElement;

			if (target.nodeName.toLowerCase() === 'li') {
				// 识别选取的语言并转换成xx格式
				var nextLang = $(target).attr('class').match(/lang\-(cn|gb|en)/g).toString().replace('lang-', '');

				//TD.util.setCookie('lang',nextLang,7);

				if (TD.util.getQuery('lang') !== '') {
					location.href = location.href.replace('lang=' + currentLang, 'lang=' + nextLang);
				} else if (location.href.match('=')) {
					location.href += '&lang=' + nextLang;
				} else {
					location.href += '?lang=' + nextLang;
				};
			};
		});

		/*$('.nav-lang-fixed-en').on('click',function () {
            location.href = location.href.indexOf('lang=') > -1 ? location.href.replace('lang=' + currentLang, 'lang=' + 'cn') : location.href + '?lang=cn';
        })*/


	};

	var navRetract = function () {
		var isSliding = false;
		var timo = null;

		// 猫王频道不处理
		if ($('.subnav-thumb').length === 0) {
			return
		}

		setTimeout(function () {
			$('.subnav-main-wrap').slideUp(500, function () {
				$('.subnav-wrap').hover(function () {
					if (timo !== null) {
						clearTimeout(timo);
					}
					
					if (!isSliding) {
						isSliding = true;
						$('.subnav-main-wrap').slideDown(300, function () {
							isSliding = false;
						});
					};
				}, function () {
					timo = setTimeout(function () {
						if (!isSliding) {
							isSliding = true;
							$('.subnav-main-wrap').slideUp(300, function () {
								isSliding = false;
							});
						};
					}, 2000);
				})
			});
		}, 3000);
	};

	var mobileHeaderHandler = function () {
        var subnavReset = function () {
            $('.subnav-main-wrap').css('left', '0');
            $('.subnav-sub-wrap').css('left', '100%');
            $('.subnav-sub-wrap').hide();
        }

        $('.nav-menu').on('click', function () {
            $('.subnav-main-wrap').slideToggle();

            if ($('.subnav-main-wrap').css('left') !== '0') {
                subnavReset();
            }
        })

        $('.submenu').on('click', function () {
            $(this).find('.subnav-sub-wrap').show();

            $(this).find('.subnav-sub-wrap').animate({
                left: '0'
            })

            $('.subnav-main-wrap').animate({
                left: '-100%'
            })
		})
		
		$('.subnav-sub-item').on('click', function (evt) {
			evt.stopPropagation(); 
            $(this).find('.subnav-thr-wrap').show();

            $(this).find('.subnav-thr-wrap').animate({
                left: '0'
            })

            $('.subnav-sub-wrap').animate({
                left: '-100%'
            })
        })

        $('.subnav-sub-back').on('click', function (evt) {
            evt.stopPropagation(); 

            $('.subnav-main-wrap').animate({
                left: '0'
            }, 300, 'swing')

            $(this).parent().animate({
                left: '100%'
            }, 300, 'swing', function () {
                $(this).hide();
            })
		})
		
		$('.subnav-thr-back').on('click', function (evt) {
            evt.stopPropagation(); 

            $('.subnav-sub-wrap').animate({
                left: '0'
            }, 300, 'swing')

            $(this).parent().animate({
                left: '100%'
            }, 300, 'swing', function () {
                $(this).hide();
            })
        })
    }

	pageInit();
}

headerCompoCtrl();