/**
 *  品牌一览
 * @author: liangzhifeng<zhifeng.liang@yoho.cn>
 * @date: 2015/10/23
 */

var $ = require('jquery'),
    Hammer = require('yoho.hammer'),
    Swiper = require('yoho.iswiper'),
    lazyLoad = require('yoho.lazyload');

var swiper,
    $brandList = $('.brand-list');

var searchH = $('.newbrand-search').outerHeight(),
    headerH = $('.yoho-header').outerHeight(),
    brandSwipe = parseInt(searchH) + parseInt(headerH) - 1;

var brandsData,
    $keyword,
    searchBtnHammer,
    clearTextHammer,
    removeHistory,
    searchList,
    yohoHistory;

swiper = new Swiper('.swiper-container', {
    lazyLoading: true,
    loop: true,
    autoplay: 3000,
    pagination: '.swiper-pagination .pagination-inner'
});

lazyLoad($('img.lazy'));
$('.yoho-header').css({
    'z-index': 2,
    position: 'fixed'
});
$('.banner-top').css('padding-top', '90px');

$(window).scroll(function() {
    var scrTop = $(window).scrollTop();

    $('.brand-list').each(function() {
        var offTop = $(this).offset().top - brandSwipe;

        if (scrTop >= offTop) {
            $brandList.find('.title-bar').css('position', 'static');
            $(this).find('.title-bar').css({
                position: 'fixed',
                top: brandSwipe
            });
        } else {
            $(this).find('.title-bar').css('position', 'static');
        }
    });
});

function rightBarBindClick() {
    $('#right-bar .con').find('b').unbind().on('touchstart', function(e) {
        var index = $(this).index();

        if ($('.bar-' + index).size() > 0) {
            document.body.scrollTop = parseInt($('.bar-' + index)[0].offsetTop) - parseInt(brandSwipe - 1);
        }
        e.stopPropagation();
    });
}

rightBarBindClick();

function searchResult() {
    var keyword = ($keyword.val() + '').toLowerCase();
    var result = {},
        i = 0,
        rightBarHtml,
        html = '';

    // 遍历首字母搜索
    $.each(brandsData, function(k, v) {
        if ($.isArray(v)) {

            // 遍历品牌，进行匹配
            $.each(v, function(i, brand) {
                if (brand.name.toLowerCase().indexOf(keyword) > -1) {
                    result[k] = result[k] || [];
                    result[k].push(brand);
                }
            });
        }
    });

    // 根据搜索结果生成 HTML
    rightBarHtml = '<div id="right-bar" class="right-bar"><div class="con" id="con">';
    $.each(result, function(k, v) {
        var brandHtml = ['<div class="brand-list bar-', i, '">'];

        i++;
        brandHtml.push('<div class="title-bar"><h2>');
        brandHtml.push(k);
        brandHtml.push('</h2></div>');
        $.each(v, function(i, brand) {

            // brandHtml.push('<p><a href="' + brand.url + '">' + brand.name);
            brandHtml.push('<p><span>' + brand.name);
            if (brand.isNew) {
                brandHtml.push('<i class="icon-hot">Hot</i>');
            }
            if (brand.isHot) {
                brandHtml.push('<i class="icon-new">New</i>');
            }
            brandHtml.push('</span></p>');
        });
        brandHtml.push('</div>');
        html += brandHtml.join('');

        if (k.indexOf(0) > -1) {
            k = '#';
        }

        rightBarHtml = rightBarHtml + '<b>' + k + '</b>';
    });

    rightBarHtml += '</div>';

    if (Object.keys(result).length > 0) {
        html += rightBarHtml;
    }

    // 插入 dom，绑定事件
    $('.search-result').html(html);

    if (Object.keys(result).length > 0) {
        rightBarBindClick();
    }
    console.log($('.search-result .brand-list p').length);
    $('.search-result .brand-list p').each(function (index) {

        // $('.search-result .brand-list').eq(index).find('p span').click(function () {
        //     console.log(index);
        // })

        searchList = new Hammer($('.search-result .brand-list p').eq(index)[0]);
        searchList.on('tap', function() {

            // var $el = $(e.target);
            // console.log($el.closest('sapn')).html();
            console.log($('.search-result .brand-list p').eq(index).find('span').html());
        });
    });
}

if ($('.brand-search-page').length) {
    brandsData = $.parseJSON($('#brands-data').html());
    $keyword = $('#keyword');

    $keyword.on('input', function() {
        $('.history').css('display', 'none');
        if ($keyword.val().length) {
            searchResult();
            $(this).closest('.search-box').css('width', '11.25rem');
            $('.search-action').show();
        } else {
            $(this).closest('.search-box').css('width', '12.5rem');
            $('.search-action').hide();
        }
    });


    searchBtnHammer = new Hammer($('.search-btn')[0]);
    searchBtnHammer.on('tap', function(e) {
        searchResult();
        e.srcEvent.stopPropagation();
    });

    clearTextHammer = new Hammer($('.clear-text')[0]);
    clearTextHammer.on('tap', function(e) {
        $('#keyword').val('').trigger('input');
        e.srcEvent.stopPropagation();
    });

    $('form.search-box').on('submit', function() {
        return false;
    });
    if (localStorage) {
        yohoHistory = localStorage.getItem('yohoHistory');

        // if (yohoHistory) {
        //     for (var i = 1; i < yohoHistory.split(" ").length - 1; i++) {
        //         $("<a href='#'>" + yohoHistory.split(" ")[i] + "</a>").appendTo(".historyList");
        //     }
        // }
    }

    removeHistory = new Hammer($('.removeHistory')[0]);
    removeHistory.on('tap', function(e) {
        $('.historyList').html(' ');
        localStorage.clear();
    });


    // clearHistoryHammer = new Hammer($('#clear-text')[0]);
    // clearHistoryHammer.on('tap', function() {

    //     // setcookie('h_brands', '', {
    //     //     expire: -1,
    //     //     path: '/',
    //     //     domain: '.m.yohobuy.com'
    //     // });
    //     $('#history-keyword').remove();
    //     $(this).hide();
    // });

}