/**
 * 筛选JS
 * 暴露三个接口：注册回调、显示filter、隐藏filter
 * @author: xuqi<qi.xu@yoho.cn>
 * @date: 2015/10/19
 */

let $ = require('yoho-jquery'),
    Hammer = require('yoho-hammer');

let $filter;

let fCbFn, hCbFn; // 筛选和关闭的回调

// 隐藏筛选界面
function hideFilter() {
    setTimeout(function() {
        $filter && $filter.addClass('hide');
    }, 301);
}

// 显示筛选界面
function showFilter() {
    $filter && $filter.removeClass('hide');
}

// 一级菜单点击时背景高亮
function highlightMainItem() {
    let $mainItem = $('.filter-body .classify');

    $mainItem.on('touchstart', '.shower', function() {
        let bpIdData = $(this).attr('data-bp-id') || '';

        $mainItem.removeClass('highlight');
        $(this).addClass('highlight');

        $(document).trigger('shouldSendBpData', [bpIdData]);
    }).on('touchend touchcancel', '.shower', function() {
        $(this).removeClass('highlight');
    });
}

// 子菜单点击时背景高亮
function highlightSubItem() {
    let $subItem = $('.filter-body .sub-item');

    $subItem.on('touchstart', function() {
        $subItem.removeClass('highlight');
        $(this).addClass('highlight');
    }).on('touchend touchcancel', function() {
        $(this).removeClass('highlight');
    });
}

// 主筛选项Tap事件句柄
function classifyTapEvt($this) {
    if ($this.hasClass('active')) {
        return;
    }

    $this.siblings('.active').removeClass('active');

    $this.addClass('active');

}

// 子筛选项选中处理
function setSubClassify($this) {
    let $sub = $this.closest('.sub-classify');

    let $shower = $sub.siblings('.shower');

    let html, shower;

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

    $sub.children('.chosed').removeClass('chosed');
    $this.addClass('chosed');

    html = $.trim($this.html());

    shower = $.trim($shower.html());

    $shower.html(
        shower.substring(0, shower.indexOf('</span>') + 7) + // 拆分出shower的title
        html.substring(0, html.indexOf('<i')) // 拆分选中筛选值
    );

    if ($this.index() === 0) {
        $shower.addClass('default');
    } else {
        $shower.removeClass('default');
    }

    if (hCbFn) {
        hCbFn();
    }

    return $sub;
}

// 子筛选项Tap句柄
function subClassifyTapEvt($this) {
    let id = $this.data('id');

    let $sub;

    $sub = setSubClassify($this);

    if (fCbFn) {
        fCbFn({
            type: $sub.data('type'),
            id: id,
            filtering: true
        });
    }

    if (hCbFn) {
        hCbFn();
    }

    // 防止点击穿透，延迟100 隐藏
    setTimeout(hideFilter, 100);
}

// 初始化筛选
function initFilter(opt) {
    let filterHammer;

    // 注册回调
    fCbFn = opt.fCbFn;
    hCbFn = opt.hCbFn;

    highlightMainItem();
    highlightSubItem();

    $filter = $('.filter-mask');

    filterHammer = new Hammer($filter[0]);
    filterHammer.on('tap', function(e) {
        let $this = $(e.target),
            $cur;

        // 这行不能注释，iphone下会出现穿透
        e.preventDefault();// 防止透点

        if ($this.closest('.filter-body').length > 0) {
            $cur = $this.closest('.sub-item');
            if ($cur.length > 0) {
                // tap subclassify
                $cur = $this.closest('li');

                subClassifyTapEvt($cur);
            } else {

                // tap classify
                $cur = $this.closest('.classify-item');

                e.srcEvent.stopPropagation();

                classifyTapEvt($cur);
            }
        } else {
            hideFilter();

            if (hCbFn) {
                hCbFn();
            }
        }
    });
    if (opt.isScroll) {
        $('ul.sub-classify').each(function() {
            let lastY = 0, y = 0;
            let $slider = $(this);

            $(this).wrap('<div class=\'sub-classify-farther\' data-type=\'' + $(this).data('type') + '\'></div>');

            // $(this).removeClass("sub-classify");

            $slider.on('touchstart', function(e) {
                lastY = e.originalEvent.touches[0].pageY;
            });
            $slider.on('touchmove', function(e) {
                let curY = e.originalEvent.touches[0].pageY;
                let deltaY = curY - lastY;
                let height = $(this)[0].scrollHeight;
                let limit = height - $(this).parent().height();
                let translate;

                y = y + deltaY;

                if (y < limit * -1) {
                    y = limit * -1;
                }

                if (y > 0) {
                    y = 0;
                }
                translate = 'translate3d(0,' + y + 'px,0)';
                $(this).css({
                    '-moz-transform': translate,
                    '-ms-transform': translate,
                    transform: translate,
                    '-webkit-transform': translate
                });
                lastY = curY;
            });
            $slider.on('touchend', function() {});
        });
    }


}

// 重置筛选面板
function resetFilter() {
    if (typeof $filter === 'undefined') {
        return;
    }

    // 重置子筛选项
    $('.sub-classify').each(function() {
        setSubClassify($(this).children(':first-child'));
    });

    // 重置主筛选项
    classifyTapEvt($('.classify > :first-child'));
}

exports.initFilter = initFilter;

exports.showFilter = showFilter;

exports.hideFilter = hideFilter;

exports.resetFilter = resetFilter;