fe / yohobuywap-node · Commits

Go to a project

Authored by 陈峰
Commit f7dbacc6223985c0f0f950c5870e63a88f789e58 1 parent 023698b2

优化

Inline Side-by-side
Showing 11 changed files with 173 additions and 30 deletions
@@ -52,7 +52,10 @@ let _channelPage = (req, res, data) => { @@ -52,7 +52,10 @@ let _channelPage = (req, res, data) => {
52 // } 52 // }
53 // }].concat(result.content); 53 // }].concat(result.content);
54 // console.log(result.content[9]); 54 // console.log(result.content[9]);
55 - res.render('channel', Object.assign({}, _renderData, data, result)); 55 + console.log(result)
  56 + res.render('channel', Object.assign({}, _renderData, data, result, {
  57 + localCss: true
  58 + }));
56 }); 59 });
57 }; 60 };
58 61
@@ -69,7 +69,8 @@ const editor = (req, res, next) => { @@ -69,7 +69,8 @@ const editor = (req, res, next) => {
69 infos: build, 69 infos: build,
70 isApp: isApp, 70 isApp: isApp,
71 authorInfo: authorData.data 71 authorInfo: authorData.data
72 - } 72 + },
  73 + localCss: true
73 }, parameter)); 74 }, parameter));
74 } else { 75 } else {
75 return next(); 76 return next();
@@ -172,7 +173,9 @@ const index = (req, res, next) => { @@ -172,7 +173,9 @@ const index = (req, res, next) => {
172 res.set('Cache-Control', 'no-cache'); 173 res.set('Cache-Control', 'no-cache');
173 } 174 }
174 } 175 }
175 - res.render('guang', Object.assign(responseData, result)); 176 + res.render('guang', Object.assign(responseData, result, {
  177 + localCss: true
  178 + }));
176 }).catch(next); 179 }).catch(next);
177 }; 180 };
178 181
@@ -357,7 +357,8 @@ const index = (req, res, next) => { @@ -357,7 +357,8 @@ const index = (req, res, next) => {
357 page: 'info-index', 357 page: 'info-index',
358 title: '逛', 358 title: '逛',
359 gender: gender, 359 gender: gender,
360 - wechatShare: true 360 + wechatShare: true,
  361 + localCss: true
361 }, data, parameter)); 362 }, data, parameter));
362 }); 363 });
363 } else { 364 } else {
1 <div class="banner-top"> 1 <div class="banner-top">
2 - <div class="banner-swiper swiper-container">  
3 - <ul class="swiper-wrapper"> 2 + <div class="banner-alloy alloy-container">
  3 + <div class="alloy-wrapper" style="width: {{widthFull}}">
4 {{#each data}} 4 {{#each data}}
5 {{#if @first}} 5 {{#if @first}}
6 - <li class="swiper-slide">  
7 - <a href="{{url}}">  
8 - <img src="{{image src 640 240}}">  
9 - </a>  
10 - </li> 6 + <img src="{{image src 640 240}}" style="width: {{../width}}">
11 {{^}} 7 {{^}}
12 - <li class="swiper-slide">  
13 - <a href="{{url}}">  
14 - <img class="swiper-lazy" data-src="{{image src 640 240}}">  
15 - </a> 8 + <img class="swiper-lazy" data-src="{{image src 640 240}}" style="width: {{../width}}">
16 <div class="swiper-lazy-preloader"></div> 9 <div class="swiper-lazy-preloader"></div>
17 - </li>  
18 {{/if}} 10 {{/if}}
19 {{/each}} 11 {{/each}}
20 - </ul> 12 + </div>
21 </div> 13 </div>
22 - <div class="swiper-pagination"> 14 + <div class="alloy-pagination">
23 <div class="pagination-inner"> 15 <div class="pagination-inner">
24 </div> 16 </div>
25 </div> 17 </div>
@@ -18,6 +18,7 @@ @@ -18,6 +18,7 @@
18 }, 18 },
19 "license": "MIT", 19 "license": "MIT",
20 "dependencies": { 20 "dependencies": {
  21 + "alloytouch": "^0.1.0",
21 "bluebird": "^3.4.6", 22 "bluebird": "^3.4.6",
22 "body-parser": "^1.15.2", 23 "body-parser": "^1.15.2",
23 "captchapng": "0.0.1", 24 "captchapng": "0.0.1",
@@ -3,8 +3,59 @@ @@ -3,8 +3,59 @@
3 * @author: liangzhifeng<zhifeng.liang@yoho.cn> 3 * @author: liangzhifeng<zhifeng.liang@yoho.cn>
4 * @date: 2015/10/12 4 * @date: 2015/10/12
5 */ 5 */
  6 +//加载css
  7 +require("layout/_loading.css")
  8 +require("layout/_utils.css")
  9 +
  10 +require("common/_filter.css")
  11 +require("common/_good.css")
  12 +require("common/_loading.css")
  13 +require("common/_suspend-home.css")
  14 +
  15 +require("channel/_banner-bottom.css")
  16 +require("channel/_banner-center.css")
  17 +require("channel/_banner-top.css")
  18 +require("channel/_brand.css")
  19 +require("channel/_cate.css")
  20 +require("channel/_creative-life.css")
  21 +require("channel/_divide-image.css")
  22 +require("channel/_fine-brands.css")
  23 +require("channel/_floor-header.css")
  24 +require("channel/_footer-tab.css")
  25 +require("channel/_fresh-only.css")
  26 +require("channel/_goods-category.css")
  27 +require("channel/_home-header.css")
  28 +require("channel/_home.css")
  29 +require("channel/_hot-brands.css")
  30 +require("channel/_hot-category.css")
  31 +require("channel/_hot-single.css")
  32 +require("channel/_icons-enter.css")
  33 +require("channel/_index.css")
  34 +require("channel/_left-right.css")
  35 +require("channel/_maybe-like.css")
  36 +require("channel/_new-first.css")
  37 +require("channel/_new-user-floor.css")
  38 +require("channel/_notice.css")
  39 +require("channel/_plus-star.css")
  40 +require("channel/_sale-floor.css")
  41 +require("channel/_search-input.css")
  42 +require("channel/_search.css")
  43 +require("channel/_seckill.css")
  44 +require("channel/_shop-recommand.css")
  45 +require("channel/_side-nav.css")
  46 +require("channel/_six-lines-floor.css")
  47 +require("channel/_three-picture.css")
  48 +require("channel/_thumb-row.css")
  49 +require("channel/_trend-topics.css")
  50 +require("channel/_trend-tops.css")
  51 +require("channel/_trendsetter-collocation.css")
  52 +require("channel/_two-column-goods.css")
  53 +require("channel/_vip-only.css")
  54 +
  55 +
6 var $ = require('yoho-jquery'), 56 var $ = require('yoho-jquery'),
7 Swiper = require('yoho-swiper'), 57 Swiper = require('yoho-swiper'),
  58 + alloytouch = require('alloytouch'),
8 lazyLoad = require('yoho-jquery-lazyload'), 59 lazyLoad = require('yoho-jquery-lazyload'),
9 fastclick = require('yoho-fastclick'), 60 fastclick = require('yoho-fastclick'),
10 noticeScroll = require('../plugin/notice-scroll'), 61 noticeScroll = require('../plugin/notice-scroll'),
@@ -101,17 +152,57 @@ highlight($subNav); @@ -101,17 +152,57 @@ highlight($subNav);
101 152
102 153
103 // 头部banner轮播 154 // 头部banner轮播
104 -if ($('.banner-swiper').find('li').size() > 1) {  
105 - new Swiper('.banner-swiper', {  
106 - lazyLoading: true,  
107 - lazyLoadingInPrevNext: true,  
108 - loop: true,  
109 - autoplay: 3000,  
110 - autoplayDisableOnInteraction: false,  
111 - paginationClickable: true,  
112 - slideElement: 'li',  
113 - pagination: '.banner-top .pagination-inner'  
114 - }); 155 +if ($('.banner-alloy').find('img').size() > 1) {
  156 + new alloytouch({
  157 + touch:".banner-alloy",//反馈触摸的dom
  158 + vertical: false,//不必需，默认是true代表监听竖直方向touch
  159 + target: $('.alloy-wrapper')[0], //运动的对象
  160 + property: "translateY", //被运动的属性
  161 + change:function(){ }, //不必需，属性改变的回调。alloytouch.css版本不支持该事件
  162 + touchStart:function(value){ },
  163 + touchMove:function(value){ },
  164 + touchEnd:function(evt, v, index){
  165 + var step_v = index * this.step * -1;
  166 + var dx = v - step_v;
  167 +
  168 + console.log(v)
  169 + if (Math.abs(dx) < 30) {
  170 + this.go(step_v);
  171 +
  172 + }
  173 + else if (dx > 0) {
  174 + this.go(step_v + this.step);
  175 +
  176 + } else {
  177 +
  178 + this.go(step_v - this.step);
  179 + }
  180 +
  181 + return false;
  182 + },
  183 + animationEnd:function(v, page){
  184 + var i = 0,
  185 + len = items.length;
  186 + for (; i < len; i++) {
  187 + if (i === page) {
  188 + items[i].classList.add("active");
  189 + } else {
  190 + items[i].classList.remove("active");
  191 + }
  192 + }
  193 + } //运动结束
  194 +
  195 + })
  196 + // new Swiper('.banner-swiper', {
  197 + // lazyLoading: true,
  198 + // lazyLoadingInPrevNext: true,
  199 + // loop: true,
  200 + // autoplay: 3000,
  201 + // autoplayDisableOnInteraction: false,
  202 + // paginationClickable: true,
  203 + // slideElement: 'li',
  204 + // pagination: '.banner-top .pagination-inner'
  205 + // });
115 } 206 }
116 207
117 // 店铺推荐人数和收藏初始查询 208 // 店铺推荐人数和收藏初始查询
@@ -3,6 +3,17 @@ @@ -3,6 +3,17 @@
3 * @author: xuqi<qi.xu@yoho.cn> 3 * @author: xuqi<qi.xu@yoho.cn>
4 * @date: 2015/10/10 4 * @date: 2015/10/10
5 */ 5 */
  6 +require("layout/_loading.css")
  7 +require("layout/_swiper.css")
  8 +require("layout/_utils.css")
  9 +
  10 +require("common/_loading.css")
  11 +require("common/_suspend-home.css")
  12 +
  13 +require("guang/_info-list.css")
  14 +require("guang/_info.css")
  15 +require("guang/_tvls.css")
  16 +
6 17
7 var $ = require('yoho-jquery'); 18 var $ = require('yoho-jquery');
8 19
@@ -3,6 +3,21 @@ @@ -3,6 +3,21 @@
3 * @author: xuqi<qi.xu@yoho.cn> 3 * @author: xuqi<qi.xu@yoho.cn>
4 * @date: 2015/10/10 4 * @date: 2015/10/10
5 */ 5 */
  6 +require("layout/_loading.css")
  7 +require("layout/_swiper.css")
  8 +require("layout/_utils.css")
  9 +
  10 +require("common/_good.css")
  11 +require("common/_loading.css")
  12 +require("common/_suspend-home.css")
  13 +
  14 +require("channel/_footer-tab.css")
  15 +
  16 +require("guang/_info-list.css")
  17 +require("guang/_info.css")
  18 +require("guang/_tvls.css")
  19 +
  20 +
6 21
7 var $ = require('yoho-jquery'); 22 var $ = require('yoho-jquery');
8 23
@@ -3,6 +3,16 @@ @@ -3,6 +3,16 @@
3 * @author: xuqi<qi.xu@yoho.cn> 3 * @author: xuqi<qi.xu@yoho.cn>
4 * @date: 2015/10/13 4 * @date: 2015/10/13
5 */ 5 */
  6 +require("layout/_common.css")
  7 +require("layout/_utils.css")
  8 +
  9 +require("common/_filter.css")
  10 +require("common/_good.css")
  11 +require("common/_loading.css")
  12 +require("common/_suspend-home.css")
  13 +
  14 +require("guang/_detail.css")
  15 +require("guang/_tvls.css")
6 16
7 var $ = require('yoho-jquery'), 17 var $ = require('yoho-jquery'),
8 ellipsis = require('yoho-mlellipsis'), 18 ellipsis = require('yoho-mlellipsis'),
@@ -55,3 +55,16 @@ @@ -55,3 +55,16 @@
55 } 55 }
56 } 56 }
57 } 57 }
  58 +.banner-alloy {
  59 + width: 100%;
  60 + overflow: hidden;
  61 + position: relative;
  62 + max-height: 312px;
  63 + .alloy-wrapper {
  64 + position: relative;
  65 + max-height: 312px;
  66 + img {
  67 + display: initial;
  68 + }
  69 + }
  70 +}
@@ -90,7 +90,10 @@ module.exports = (list) => { @@ -90,7 +90,10 @@ module.exports = (list) => {
90 if (floor.sale1T1L4R && floor.data && floor.data.big_image) { 90 if (floor.sale1T1L4R && floor.data && floor.data.big_image) {
91 floor.data.banner_image = floor.data.big_image; 91 floor.data.banner_image = floor.data.big_image;
92 } 92 }
93 - 93 + if (floor.focus && floor.data && floor.data.length) {
  94 + floor.widthFull = `${100 * floor.data.length}%`;
  95 + floor.width = `${100 / floor.data.length}%`;
  96 + }
94 formatData.push(floor); 97 formatData.push(floor);
95 }); 98 });
96 99