cate.page.js 2.49 KB
const $ = require('yoho-jquery');
const Vue = require('yoho-vue');

var $nav = $('.cate-nav'),
    $cateContainer = $('.cate-container'),
    $contents = $cateContainer.children('.content'),
    $subLevelItem = $cateContainer.find('.sub-level li'),
    $primaryItem = $cateContainer.find('.primary-level li');

var $curContent = $contents.not('.hide');

(function() {
    var $header = $('.yoho-header'),
        $search = $('#search-input');

    var h = $(window).height() - $header.outerHeight() - $search.outerHeight() - $nav.outerHeight();

    $cateContainer.css('min-height', h);

    $contents.height(h);
}());

$('#search-input').focus(function() {
    $(this).blur();
});
$nav.bind('contextmenu', function() {
    return false;
});
$('.cate-container').bind('contextmenu', function() {
    return false;
});

$nav.on('touchend touchcancel', function(e) {
    var $this = $(e.target).closest('li'),
        index = $this.index();

    if ($this.hasClass('focus')) {
        return;
    }

    $nav.find('li.focus').removeClass('focus');
    $this.addClass('focus');

    $curContent.addClass('hide');
    $curContent = $contents.eq(index).removeClass('hide');
});

$cateContainer.on('touchend', function(e) {
    var $this = $(e.target),
        $subLevel,
        $cur, index;

    $cur = $this.closest('.p-level-item');
    if ($cur.length > 0) {
        index = $cur.index();
        $subLevel = $this.closest('.content').find('.sub-level');

        if ($this.hasClass('focus')) {
            return;
        }

        $this.closest('.primary-level').children('.focus').removeClass('focus');
        $this.addClass('focus');

        $subLevel.not('.hide').addClass('hide');
        $subLevel.eq(index).removeClass('hide');

        $subLevel.css({
            top: $cur.offset().top - 60
        });
    }
});

$cateContainer.find('.primary-level').on('touchstart touchend touchcancel', 'li', function() {
    $primaryItem.removeClass('highlight');
    $(this).addClass('highlight');
}).on('touchend touchcancel', 'li', function() {
    $(this).removeClass('highlight');
});

$cateContainer.find('.sub-level').on('touchstart', 'li', function() {
    $subLevelItem.removeClass('highlight');
    $(this).addClass('highlight');
}).on('touchend touchcancel', 'li', function() {
    $(this).removeClass('highlight');
});

$nav.on('touchstart', 'li', function() {
    $nav.find('li').removeClass('bytouch');
    $(this).addClass('bytouch');
}).on('touchend touchcancel', 'li', function() {
    $nav.find('li').removeClass('bytouch');
});