Merge branch 'develop' of http://git.dev.yoho.cn/web/yohobuy into develop

hf
Commit b4f81d69aa12746d6d51efc182838567b33eeb4d 2 parents 05099c8f 709a5030
Showing 7 changed files with 55 additions and 47 deletions
static/js/guang/home.js
static/js/guang/info.js
static/js/plugin/filter.js
static/js/plugin/loading.js
static/js/product/list.js
static/sass/_loading.scss
template/m.yohobuy.com/partials/filter.phtml
--- a/static/js/guang/home.js
View file @b4f81d6
+++ b/static/js/guang/home.js
View file @b4f81d6
@@ -8,7 +8,6 @@ var $ = require('yoho.zepto'),
     Swiper = require('yoho.iswiper');
 var info = require('./info'),
-    setLazyLoadAndMellipsis = info.setLazyLoadAndMellipsis,
     loadMore = info.loadMore;
 var $loadMoreInfo = $('#load-more-info');
@@ -45,10 +44,11 @@ info.initInfosEvt($infoList);
     var gender = $('#gender').val();
     $nav.children('.guang-nav-item').each(function() {
-        var type = $(this).data('type');
+        var type = $(this).data('type'),
+            focus = $(this).hasClass('focus');
         state[type] = {
-            page: 1,
+            page: focus ? 1 : 0,
             gender: gender,
             type: type,
             end: false
@@ -65,6 +65,9 @@ $nav.delegate('.guang-nav-item', 'tap', function() {
         return;
     }
+    $curNav = $this;
+    curType = $this.data('type');
+
     index = $this.index();
     $this.addClass('focus');
@@ -75,11 +78,7 @@ $nav.delegate('.guang-nav-item', 'tap', function() {
     $content = $infos.eq(index);
     $content.removeClass('hide');
-    //lazyload & mellipsis
-    setLazyLoadAndMellipsis($content.children('.guang-info'));
-
-    $curNav = $this;
-    curType = $this.data('type');
+    loadMore($content, state[curType]);
     //重置当前Tab的load-more
     if (state[curType].end) {
@@ -93,6 +92,6 @@ $nav.delegate('.guang-nav-item', 'tap', function() {
 $(document).scroll(function() {
     if ($(window).scrollTop() + winH >= $(document).height() - loadMoreH) {
-        loadMore($infos, state[curType]);
+        loadMore($infos.not('hide'), state[curType]);
     }
 });
--- a/static/js/guang/info.js
View file @b4f81d6
+++ b/static/js/guang/info.js
View file @b4f81d6
@@ -9,12 +9,13 @@ var $ = require('yoho.zepto'),
     lazyLoad = require('yoho.zeptolazyload');
 var tip = require('../plugin/tip');
+var loading = require('../plugin/loading');
 var $loadMoreInfo = $('#load-more-info');
 var $loading = $(''),
     $noMore = $('');
-var loading = false;
+var searching = false;
 ellipsis.init();
@@ -84,7 +85,7 @@ function initInfosEvt($container) {
  * 资讯LoadMore
  */
 function loadMore($container, opt) {
-    if (loading) {
+    if (searching) {
         return;
     }
@@ -92,7 +93,13 @@ function loadMore($container, opt) {
         return;
     }
-    loading = true;
+    if (opt.page === 0) {
+
+        //显示loading
+        loading.showLoadingMask();
+    }
+
+    searching = true;
     $.ajax({
         type: 'GET',
         url: ' /guang/index/page',
@@ -100,7 +107,7 @@ function loadMore($container, opt) {
         success: function(data) {
             if (data === ' ') {
                 opt.end = true;
-                loading = false;
+                searching = false;
                 //
                 $loading.addClass('hide');
@@ -112,13 +119,17 @@ function loadMore($container, opt) {
             setLazyLoadAndMellipsis($container.find('.guang-info'));
+            if (opt.page === 0) {
+                loading.hideLoadingMask();
+            }
+
             opt.page++;
-            loading = false;
+            searching = false;
         },
         error: function() {
             tip.show('网络断开连接了~');
-            loading = false;
+            searching = false;
         }
     });
 }
--- a/static/js/plugin/filter.js
View file @b4f81d6
+++ b/static/js/plugin/filter.js
View file @b4f81d6
@@ -7,7 +7,7 @@
 var $ = require('yoho.zepto');
-var $filter = $('.filter-mask, .filter-body');
+var $filter = $('.filter-mask');
 var $classify = $filter.find('.classify'),
     $subClassify = $filter.find('.sub-classify');
@@ -33,9 +33,11 @@ function registerCbFn(cb) {
 $classify.children(':first-child').addClass('active'); //T：不在HTML中使用{{#if @first}}active{{/if}}来初始化active为避免sub设置高度时的闪烁
 //classify switch
-$classify.delegate('.classify-item', 'tap', function() {
+$classify.delegate('.classify-item', 'tap', function(e) {
     var $this = $(this);
+    e.stopPropagation();
+
     if ($this.hasClass('active')) {
         return;
     }
@@ -46,7 +48,7 @@ $classify.delegate('.classify-item', 'tap', function() {
 });
 //点击Mask隐藏筛选界面
-$filter.filter('.filter-mask').tap(function() {
+$filter.tap(function() {
     hideFilter();
 });
--- a/static/js/plugin/loading.js
View file @b4f81d6
+++ b/static/js/plugin/loading.js
View file @b4f81d6
@@ -10,17 +10,14 @@ var $page = $('.yoho-page');
 var $loading;
-/**
- * 初始化loading mask
- * @param $container loading容器, position:relative
- */
-function initLoadingMask() {
+//初始化
+(function() {
     var html = '<div class="loading-mask hide"><div class="loading"></div></div>';
     $page.append(html);
     $loading = $page.children('.loading-mask');
-}
+}());
 //显示loading
 function showLoadingMask() {
@@ -32,6 +29,5 @@ function hideLoadingMask() {
     $loading.addClass('hide');
 }
-exports.initLoadingMask = initLoadingMask;
 exports.showLoadingMask = showLoadingMask;
 exports.hideLoadingMask = hideLoadingMask;
--- a/static/js/product/list.js
View file @b4f81d6
+++ b/static/js/product/list.js
View file @b4f81d6
@@ -209,7 +209,6 @@ function search(opt) {
 lazyLoad($('.lazy'));
 filter.registerCbFn(search);
-loading.initLoadingMask();
 //导航栏点击逻辑说明：
 //1.点击非active项时切换active状态
--- a/static/sass/_loading.scss
View file @b4f81d6
+++ b/static/sass/_loading.scss
View file @b4f81d6
 .loading-mask {
     position: absolute;
-    background: rgba(0,0,0,.3);
+    background: rgba(0,0,0,.1);
     top: 0;
     bottom: 0;
     right: 0;
--- a/template/m.yohobuy.com/partials/filter.phtml
View file @b4f81d6
+++ b/template/m.yohobuy.com/partials/filter.phtml
View file @b4f81d6
 {{# filter}}
-    <div class="filter-mask hide"></div>
-    <div class="filter-body hide">
-        <ul class="classify">
-            {{#each classify}}
-                <li class="classify-item">
-                    <p class="shower{{#if default}} default{{/if}}">
-                        <span class="title">{{title}}：</span>
-                        {{name}}
-                    </p>
-                    <ul class="sub-classify" data-type={{dataType}}>
-                        {{# subs}}
-                            <li {{#if chosed}}class=chosed{{/if}} data-id={{dataId}}>
-                                {{name}}
-                                <i class="iconfont chosed-icon">&#xe617;</i>
-                            </li>
-                        {{/ subs}}
-                    </ul>
-                </li>
-            {{/each}}
-        </ul>
+    <div class="filter-mask hide">
+        <div class="filter-body">
+            <ul class="classify">
+                {{#each classify}}
+                    <li class="classify-item">
+                        <p class="shower{{#if default}} default{{/if}}">
+                            <span class="title">{{title}}：</span>
+                            {{name}}
+                        </p>
+                        <ul class="sub-classify" data-type={{dataType}}>
+                            {{# subs}}
+                                <li {{#if chosed}}class=chosed{{/if}} data-id={{dataId}}>
+                                    {{name}}
+                                    <i class="iconfont chosed-icon">&#xe617;</i>
+                                </li>
+                            {{/ subs}}
+                        </ul>
+                    </li>
+                {{/each}}
+            </ul>
+        </div>
     </div>
 {{/ filter}}