...
|
...
|
@@ -5,7 +5,7 @@ |
|
|
*/
|
|
|
|
|
|
var $ = require('jquery'),
|
|
|
Hammer = require('hammer'),
|
|
|
Hammer = require('yoho.hammer'),
|
|
|
Swiper = require('yoho.iswiper'),
|
|
|
lazyLoad = require('yoho.lazyload');
|
|
|
|
...
|
...
|
@@ -16,7 +16,13 @@ var searchH = $('.newbrand-search').outerHeight(), |
|
|
headerH = $('.yoho-header').outerHeight(),
|
|
|
brandSwipe = parseInt(searchH) + parseInt(headerH) - 1;
|
|
|
|
|
|
var myHammer;
|
|
|
var myHammer,
|
|
|
brandsData,
|
|
|
$keyword,
|
|
|
searchBtnHammer,
|
|
|
clearTextHammer;
|
|
|
|
|
|
var $rightBarCon = $('#right-bar .con').find('b').unbind();
|
|
|
|
|
|
swiper = new Swiper('.swiper-container', {
|
|
|
lazyLoading: true,
|
...
|
...
|
@@ -32,8 +38,7 @@ $('.yoho-header').css({ |
|
|
});
|
|
|
$('.banner-top').css('padding-top', '90px');
|
|
|
|
|
|
if ($brandList.length > 0) {
|
|
|
$(window).scroll(function() {
|
|
|
$(window).scroll(function() {
|
|
|
var scrTop = $(window).scrollTop();
|
|
|
|
|
|
$('.brand-list').each(function() {
|
...
|
...
|
@@ -49,14 +54,135 @@ if ($brandList.length > 0) { |
|
|
$(this).find('.title-bar').css('position', 'static');
|
|
|
}
|
|
|
});
|
|
|
});
|
|
|
}
|
|
|
});
|
|
|
|
|
|
myHammer = new Hammer($('#right-bar .con').find('b').unbind()[0]);
|
|
|
myHammer.on('tap', function(e) {
|
|
|
var index = $(this).index();
|
|
|
|
|
|
function rightBarBindClick() {
|
|
|
$rightBarCon = $('#right-bar .con').find('b').unbind();
|
|
|
myHammer = new Hammer($rightBarCon[0]);
|
|
|
myHammer.on('tap', function(e) {
|
|
|
var index = $rightBarCon.index();
|
|
|
|
|
|
if ($('.bar-' + index).size() > 0) {
|
|
|
document.body.scrollTop = parseInt($('.bar-' + index)[0].offsetTop) - parseInt(brandSwipe - 1);
|
|
|
}
|
|
|
}); |
|
|
e.srcEvent.stopPropagation();
|
|
|
});
|
|
|
}
|
|
|
|
|
|
if ($rightBarCon[0]) {
|
|
|
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);
|
|
|
if (brand.isNew) {
|
|
|
brandHtml.push('<i class="icon-hot">Hot</i>');
|
|
|
}
|
|
|
if (brand.isHot) {
|
|
|
brandHtml.push('<i class="icon-new">New</i>');
|
|
|
}
|
|
|
brandHtml.push('</a></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();
|
|
|
}
|
|
|
}
|
|
|
|
|
|
if ($('.brand-search-page').length) {
|
|
|
brandsData = $.parseJSON($('#brands-data').html());
|
|
|
$keyword = $('#keyword');
|
|
|
|
|
|
$keyword.on('input', function() {
|
|
|
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;
|
|
|
});
|
|
|
|
|
|
// 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();
|
|
|
// });
|
|
|
} |
...
|
...
|
|