index.js 7.95 KB
/**
 * 搜索页
 * @author:zxr
 * @date: 2016/8/15
 */

let $ = require('yoho-jquery'),
    security = require('plugin/security'),
    tip = require('plugin/tip'),
    Hammer = require('yoho-hammer'),
    dialog = require('plugin/dialog');

let $input = $('#search-input input[name="query"]');

let $clear = $('#search-input .clear-input');

let $form = $('#search-form');

let $history = $('.history');
let $historySearch = $('.history-search');
let $clearHistory = $('#clear-history');

// let $buriedpoint = $('.buriedpoint');
let $search = $('#search');
let searchUrl = $search.closest('form').attr('action');

let writeSearch = require('./write-search');

let ranToken = writeSearch.getRanToken();
let historyval = writeSearch.getHistoryval();

let chHammer, cHammer;

let C_ID, POS_ID, FLR_INDEX, prdLoad, querys, prdids = [];

let RECID = (new Date().getTime() + '_H5_YOHOBUY_' + Math.floor(Math.random() * 1000000 + 1000000) +
    '_' + Math.floor(Math.random() * 1000000 + 1000000));

require('common');

chHammer = new Hammer($clearHistory[0]);

chHammer.on('tap', function() {
    dialog.showDialog({
        dialogText: '您确定要删除您的最近搜索吗?',
        hasFooter: {
            leftBtnText: '取消',
            rightBtnText: '确定'
        }
    }, function() {

        if (localStorage) {
            localStorage.removeItem(historyval);
        }

        $history.html('');
        $historySearch.hide();
        $clearHistory.hide();

        window.rePosFooter();

        dialog.showDialog({
            dialogText: '删除成功',
            autoHide: true,
            fast: true
        });
    });
});

// 跳到搜索页
function goSearch(query) {
    // 保存搜索的内容
    writeSearch.setHistoryValFun(query);
    document.location.href = searchUrl + '?from=search&query=' + encodeURIComponent(query);
}

// 搜索输入联动
function inputAction() {
    let $searchAssociate = $('.search-associate');
    let $icon = $('.search-icon');
    let $searchItems = $('.search-items');
    let $hotsearch = $('.hot-search-new');

    $input.on('input', function() {
        if ($input.val() === '') {
            $icon.css('color', '#b2b2b2');
            $clear.addClass('hide');
            $searchAssociate.html('');
            $searchItems.show();
            $hotsearch.show();
            $searchAssociate.hide();
        } else {
            $icon.css('color', '#666');
            $clear.removeClass('hide');
            $searchAssociate.show();
        }

        // 联动搜索
        $.ajax({
            url: '/product/search/fuzzyDatas',
            data: {
                keyword: $input.val()
            },
            dataType: 'json',
            success: function(data) {
                let ajaxHtml = '';
                let i;

                if (data.length > 0) {

                    for (i = 0; i < data.length; i++) {
                        ajaxHtml += '<li><span class="keyword">' + data[i].keyword + '</span><span class="count">' +
                        data[i].count + ' items<i class="iconfont">&#xe614;</i></span></li>';
                    }

                    $searchAssociate.html(ajaxHtml);
                    $searchItems.hide();
                    $hotsearch.hide();
                } else {
                    $searchAssociate.html('');
                }

                $searchAssociate.find('li').on('touchend', function() {
                    goSearch($(this).find('.keyword').html());
                });
            },
            error: function() {
                tip.show('网络断开连接了~');
            }
        });
    });
}

C_ID = window._ChannelVary[window.cookie('_Channel')];

function yasRequest(PRD_ID, PRD_NUM, ACTION_ID) {

    if (window._yas && window._yas.sendCustomInfo) {

        window._yas.sendCustomInfo({
            op: 'YB_CHOOSE_FOR_YOU_Y',
            param: JSON.stringify({
                REC_POSE: 100016,
                REC_ID: RECID,
                PRD_ID: PRD_ID,
                PRD_NUM: PRD_NUM,
                C_ID: C_ID,
                ACTION_ID: ACTION_ID
            })
        }, true);
    }
}

// 猜你想找展示时埋点
$('.want-search').find('li').each(function() {

    querys = $(this).find('a').html();

    if (querys) {
        prdids.push(querys);
    }
});

prdLoad = JSON.stringify(prdids).replace(/\[|\]|\"|/g, '');

if (prdLoad) {
    setTimeout(function() {
        yasRequest(encodeURIComponent(prdLoad), prdids.length, 0);
    }, 200);
}

// 热门搜索、最近搜索事件
$('.search-items .search-group').on('click', 'li', function(event) {
    let query = '';

    if (event.target.nodeName === 'A') {
        query = $(event.target).text();
    }

    if (event.target.nodeName === 'LI') {
        query = $(event.target).find('a').text();
    }

    if ($(this).parents('.search-group').hasClass('history-search')) {
        POS_ID = 1;
        FLR_INDEX = 1;
    } else {
        POS_ID = 3;
        FLR_INDEX = 3;

        yasRequest(query, $(this).index() + 1, 1);
    }

    if (window._yas && window._yas.sendCustomInfo) {
        window._yas.sendCustomInfo({
            op: 'YB_KEYWORD_SEARCH_C',
            param: JSON.stringify({
                C_ID: C_ID,
                KEYWORD: query,
                POS_ID: POS_ID,
                FLR_INDEX: FLR_INDEX
            })
        }, true);
    }

    goSearch(query);
});

$('.hot-term').on('click', function(event) {
    let Hotquery = '';

    POS_ID = 2;
    FLR_INDEX = 2;

    if (event.target.nodeName === 'A') {
        Hotquery = $(event.target).html();
    }

    if (event.target.nodeName === 'DIV') {
        Hotquery = $(event.target).find('a').html();
    }

    if (window._yas && window._yas.sendCustomInfo) {
        window._yas.sendCustomInfo({
            op: 'YB_KEYWORD_SEARCH_C',
            param: JSON.stringify({
                C_ID: C_ID,
                KEYWORD: Hotquery,
                POS_ID: POS_ID,
                FLR_INDEX: FLR_INDEX
            })
        }, true);
    }

    goSearch(Hotquery);
});

inputAction();

cHammer = new Hammer($clear[0]);
cHammer.on('tap', function() {
    $input.val('').trigger('input');
});

$search.on('touchend', function() {
    let $buriedpoint = $form.find('.buriedpoint');

    if ($buriedpoint.val() === '') {
        $buriedpoint.val($('#default-terms').val());
    }

    // 保存搜索的内容
    writeSearch.setHistoryValFun($buriedpoint.val());

    if (security.hasDangerInput()) {
        return false;
    }

    if (window._yas && window._yas.sendCustomInfo) {
        window._yas.sendCustomInfo({
            op: 'YB_KEYWORD_SEARCH_C',
            param: JSON.stringify({
                C_ID: C_ID,
                KEYWORD: $buriedpoint.val(),
                POS_ID: 0,
                FLR_INDEX: 0
            })
        }, true);
    }

    $(this).closest('form').submit();
    return false;
});

// 初始化历史搜索的内容
(function() {
    let html = '',
        history,
        historys, i, num = 1;

    try {
        if (localStorage) {
            historys = localStorage.getItem(historyval);

            if (historys && historys.length > 0) {
                historys = historys.split(ranToken);
                for (i = historys.length; i > 0; i--) {
                    history = historys[i - 1];

                    if (history === '') {
                        continue;
                    }

                    if (num++ > 10) {
                        break;
                    }

                    html += '<li><a href="javascript:void(0);">' + history + '</li>';
                }

                $history.html(html);

                if (html !== '') {
                    $clearHistory.removeClass('hide');
                    $historySearch.removeClass('hide');
                }
                window.rePosFooter();
            } else {
                $historySearch.hide();
                $clearHistory.hide();
            }
        }
    } catch (e) {
        $historySearch.hide();
        $clearHistory.hide();
    }

    window.rePosFooter();
}());