Authored by biao

update for channel floor data process and browser compatibility

/**
* 获取各个楼层的数据
* @author: 赵彪<bill.zhao@yoho.cn>
* @date: 2016/08/05
*/
'use strict';
const _ = require('lodash');
/**
* 获取楼层title
* @param {String || Object} 原始title
* @return {Object} 转换后的title
*/
const _getTitle = t => {
const reg = /\w+/g;
let arr = [];
let r;
let cn;
let en;
if (!t) {
return {
en: '',
cn: ''
};
}
if (_.isObject(t)) {
t = t.title;
}
do {
r = reg.exec(t);
if (r) {
arr.push(r[0]);
}
} while (r);
en = arr.join(' ');
cn = t.replace(en, '');
return {
en,
cn
};
};
/**
* 获取slider楼层数据
* @param {Object} d 接口返回的楼层数据
* @return {Object} 处理之后的数据
*/
const getSliderData = d => {
return {
slider: d
};
};
/**
* 获取BrandsAd楼层数据
* @param {Object} d 接口返回的楼层数据
* @return {Object} 处理之后的数据
*/
const getBrandAdFloor = d => {
const list = d.list;
_.forEach(list, data => {
data.btnText = 'shop now';
});
return {
brandsAd: list
};
};
/**
* 获取new arrivals楼层数据
* @param {Object} d 接口返回的楼层数据
* @return {Object} 处理之后的数据
*/
const getNewArrivals = d => {
const list = d.list;
const title = _getTitle(d.title);
_.forEach(list, (data, index) => {
if (index === 0 || index === list.length - 1) {
data.smallImg = true;
}
if (index % 2 !== 0) {
data.even = true;
}
});
return {
floorZh: title.cn,
floorEn: title.en,
newArrivals: list
};
};
/**
* 获取classic brands楼层数据
* @param {Object} d 接口返回的楼层数据
* @return {Object} 处理之后的数据
*/
const getClassicBrands = d => {
let brands = [];
let subArr;
let i = 0;
const list = d.list;
const title = _getTitle(d.title);
_.forEach(list, (data, index) => {
if (index === 0 || index === 1 || index === 6 || index === 7) {
brands.push({
big: [list[index]]
});
} else if ((index > 1 && index < 6 || index > 7 && index < 12) && index % 2 === 0) {
if (i < 4) {
subArr = list.slice(index, index + 2);
brands[i].small = subArr;
i += 1;
}
}
});
_.forEach(brands, (data, index) => {
if (index < 2) {
data.bottomSpace = true;
}
if (index === 1 || index === 3) {
data.right = true;
}
});
return {
floorZh: title.cn,
floorEn: title.en,
classicBrands: brands
};
};
/**
* 获取潮流标志楼层数据
* @param {Object} d 接口返回的楼层数据
* @return {Object} 处理之后的数据
*/
const getStyleIcon = d => {
const list = d.list;
const title = _getTitle(d.title);
_.forEach(list, data => {
data.btnText = '去看看';
});
return {
floorZh: title.cn,
floorEn: title.en,
styleIcon: list
};
};
/**
* 获取广告楼层数据
* @param {Object} d 接口返回的楼层数据
* @return {Object} 处理之后的数据
*/
const getAdBanner = d => {
return {
adBanner: d
};
};
/**
* 获取咨询楼层数据
* @param {Object} d 接口返回的楼层数据
* @return {Object} 处理之后的数据
*/
const getEditorial = d => {
const list = d.list;
const title = _getTitle(d.title);
let e = {
big: {},
small: []
};
_.forEach(list, (data, index) => {
if (index === 0) {
e.big = data;
} else {
e.small.push(data);
}
});
_.forEach(e.small, (data, index) => {
if (index === 0 || index === 1) {
data.bottomSpace = true;
}
if (index === 0 || index === 2) {
data.rightSpace = true;
}
});
return {
floorZh: title.cn,
floorEn: title.en,
editorial: e
};
};
module.exports = {
getSliderData,
getBrandAdFloor,
getNewArrivals,
getClassicBrands,
getStyleIcon,
getAdBanner,
getEditorial
};
... ...
... ... @@ -6,199 +6,90 @@
'use strict';
const channelApi = require('./channel-api');
const floorDataHandler = require('./floor-data-handler');
const camelCase = global.yoho.camelCase;
const _ = require('lodash');
/**
* 获取slider楼层数据
* @param {Object} d 接口返回的楼层数据
* @return {Object} 处理之后的数据
*/
const _getSliderData = d => {
return {
slider: d
};
};
/**
* 获取BrandsAd楼层数据
* 获取模板名为single_image的数据
* @param {Object} d 接口返回的楼层数据
* @return {Object} 处理之后的数据
*/
const _getBrandAdFloor = d => {
_.forEach(d, data => {
data.btnText = 'shop now';
});
return {
brandsAd: d
};
const _processSingleImage = (d) => {
return floorDataHandler.getAdBanner(d);
};
/**
* 获取new arrivals楼层数据
* 获取模板名为focus的数据
* @param {Object} d 接口返回的楼层数据
* @return {Object} 处理之后的数据
*/
const _getNewArrivals = d => {
_.forEach(d, (data, index) => {
if (index === 0 || index === d.length - 1) {
data.smallImg = true;
}
if (index % 2 !== 0) {
data.even = true;
}
});
return {
floorZh: '新品抢鲜看',
floorEn: 'NEW ARRIVALS',
newArrivals: d
};
const _processFocus = (d) => {
return floorDataHandler.getSliderData(d);
};
/**
* 获取classic brands楼层数据
* 获取模板名为blk_brand的数据
* @param {Object} d 接口返回的楼层数据
* @return {Object} 处理之后的数据
*/
const _getClassicBrands = d => {
let brands = [];
let subArr;
let i = 0;
const _processBlkBrand = (d) => {
let len;
_.forEach(d, (data, index) => {
if (index === 0 || index === 1 || index === 6 || index === 7) {
brands.push({
big: [d[index]]
});
} else if ((index > 1 && index < 6 || index > 7 && index < 12) && index % 2 === 0) {
if (i < 4) {
subArr = d.slice(index, index + 2);
brands[i].small = subArr;
i += 1;
}
}
});
if (!d.list) {
return false;
}
_.forEach(brands, (data, index) => {
if (index < 2) {
data.bottomSpace = true;
}
if (index === 1 || index === 3) {
data.right = true;
}
});
len = d.list.length;
return {
floorZh: '经典品牌',
floorEn: 'CLASSIC BRANDS',
classicBrands: brands
};
if (len === 2) {
return floorDataHandler.getBrandAdFloor(d);
} else if (len === 4) {
return floorDataHandler.getStyleIcon(d);
}
};
/**
* 获取潮流标志楼层数据
* 获取模板名为image_list的数据
* @param {Object} d 接口返回的楼层数据
* @return {Object} 处理之后的数据
*/
const _getStyleIcon = d => {
_.forEach(d, data => {
data.btnText = '去看看';
});
const _processImageList = (d) => {
let len;
return {
floorZh: '潮流标志',
floorEn: 'STYLE ICON',
styleIcon: d
};
};
if (!d.list) {
return false;
}
const _getAdBanner = d => {
return {
adBanner: d
};
len = d.list.length;
if (len === 4) {
return floorDataHandler.getNewArrivals(d);
} else if (len === 5) {
return floorDataHandler.getEditorial(d);
}
};
/**
* 获取咨询楼层数据
* 获取模板名为recommend_content_five的数据
* @param {Object} d 接口返回的楼层数据
* @return {Object} 处理之后的数据
*/
const _getEditorial = d => {
let e = {
big: {},
small: []
};
_.forEach(d, (data, index) => {
if (index === 0) {
e.big = data;
} else {
e.small.push(data);
}
});
_.forEach(e.small, (data, index) => {
if (index === 0 || index === 1) {
data.bottomSpace = true;
}
if (index === 0 || index === 2) {
data.rightSpace = true;
}
});
return {
floorZh: '资讯',
floorEn: 'EDITORIAL',
editorial: e
};
const _processRecommendContentFive = (d) => {
return floorDataHandler.getClassicBrands(d);
};
const floorMap = {
slider: _getSliderData,
标题: _getBrandAdFloor,
NEW: _getNewArrivals,
CLASSIC: _getClassicBrands,
STYLE: _getStyleIcon,
EDITORIAL: _getEditorial,
adBanner: _getAdBanner
};
/**
* 获取floorMap中对应的key
* @param {String} d 含有key的字符串
* @return {String} 得到的key值
*/
const _getKey = d => {
let k = d.split(' ')[0];
return k;
};
/**
* 判断title类型是否为对象
* @param {Object} t title
* @return {Boolen}
*/
const _isObjectTitle = t => {
return _.isObject(t);
// 根据templete_name字段找到不同的处理方法
const templateMap = {
single_image: _processSingleImage,
blkBrand: _processBlkBrand,
image_list: _processImageList,
focus: _processFocus,
recommend_content_five: _processRecommendContentFive
};
/**
* 判断是否为Banner焦点图楼层
* @param {Object} d 楼层数据
* @return {Boolen}
*/
const _isBannerFloor = d => {
return d.templateName === 'focus' && d.templateIntro === '焦点图';
};
/**
* 获取用于渲染模板的数据
... ... @@ -209,32 +100,14 @@ const _processFloorData = d => {
let floorList = [];
_.forEach(d, data => {
let floorTitle;
let floorData;
if (!data.data) {
return false;
}
// 处理banner
if (_isBannerFloor(data)) {
floorData = floorMap.slider(data.data);
// 判断标题类型
} else if (_isObjectTitle(data.data.title)) {
floorTitle = _getKey(data.data.title.title);
if (floorMap[floorTitle]) {
floorData = floorMap[floorTitle](data.data.list);
}
} else if (data.data.title) {
floorTitle = _getKey(data.data.title);
if (floorMap[floorTitle]) {
floorData = floorMap[floorTitle](data.data.list);
}
} else if (data.templateName === 'single_image') {
floorData = floorMap.adBanner(data.data);
if (templateMap[data.templateName]) {
floorData = templateMap[data.templateName](data.data);
}
floorList.push(floorData);
... ... @@ -243,6 +116,11 @@ const _processFloorData = d => {
return floorList;
};
/**
* 获取楼层数据
* @param {String} type 当前的频道
* @return {Object} 完整的楼层数据
*/
const getContent = type => {
return channelApi.getChannelDataAsync(type).then(result => {
if (result.data && result.data.list) {
... ... @@ -254,259 +132,6 @@ const getContent = type => {
return floor;
}
});
/* eslint-disable */
const content = {
content: [
{
slider: [
{
img: '//placehold.it/{width}x{height}',
link: '/'
},
{
img: '//img10.static.yhbimg.com/yhb-img01/2016/06/28/11/015a86ade17dc6213bab85b2162adebcd6.jpg?imageView2/2/w/1920/h/650',
link: '/'
},
{
img: '//img10.static.yhbimg.com/yhb-img01/2016/06/23/13/01ebff30179db84975c42a4f3c8b1f4d44.jpg?imageView2/1/w/1150/h/450',
link: '/'
},
{
img: '//img10.static.yhbimg.com/yhb-img01/2016/06/23/13/01ebff30179db84975c42a4f3c8b1f4d44.jpg?imageView2/1/w/1150/h/450',
link: '/'
},
{
img: '//img10.static.yhbimg.com/yhb-img01/2016/06/23/13/01ebff30179db84975c42a4f3c8b1f4d44.jpg?imageView2/1/w/1150/h/450',
link: '/'
},
{
img: '//placehold.it/{width}x{height}',
link: '/'
},
{
img: '//img10.static.yhbimg.com/yhb-img01/2016/06/28/11/015a86ade17dc6213bab85b2162adebcd6.jpg?imageView2/2/w/1150/h/450',
link: '/'
},
{
img: '//img10.static.yhbimg.com/yhb-img01/2016/06/28/11/015a86ade17dc6213bab85b2162adebcd6.jpg?imageView2/2/w/1150/h/450',
link: '/'
},
{
img: '//img10.static.yhbimg.com/yhb-img01/2016/06/28/11/015a86ade17dc6213bab85b2162adebcd6.jpg?imageView2/2/w/1150/h/450',
link: '/'
},
{
img: '//img10.static.yhbimg.com/yhb-img01/2016/06/28/11/015a86ade17dc6213bab85b2162adebcd6.jpg?imageView2/2/w/1150/h/450',
link: '/'
}
]
},
{
brandsAd: [
{
img: '//placehold.it/{width}x{height}',
name: 'GINZA',
des: '藤原浩于银座停车场藤原浩于银座停车场藤原浩于银座停车场藤原浩于银座停车场藤原浩于银座停车场藤原浩于银座停车场藤原浩于银座停车场',
btnText: 'shop now'
},
{
img: '//placehold.it/{width}x{height}',
name: 'STUSSY',
des: '藤原浩于银座停车场藤原浩于银座停车场藤原浩于银座停车场藤原浩于银座停车场藤原浩于银座停车场藤原浩于银座停车场藤原浩于银座停车场',
btnText: 'shop now'
}
]
},
{
floorZh: '新品抢鲜看',
floorEn: 'NEW ARRIVALS',
newArrivals: [
{
img: '//placehold.it/{width}x{height}',
name: 'STUSSY',
link: '/',
smallImg: true
},
{
img: '//placehold.it/{width}x{height}',
name: 'DAILY PAPER',
link: '/',
even: true
},
{
img: '//placehold.it/{width}x{height}',
name: 'BAPE',
link: '/'
},
{
img: '//placehold.it/{width}x{height}',
name: 'SUPREME',
link: '/',
even: true,
smallImg: true
}
]
},
{
floorZh: '经典品牌',
floorEn: 'CLASSIC BRANDS',
classicBrands: [
{
big: [
{
img: '//placehold.it/{width}x{height}',
link: ''
}
],
small: [
{
img: '//img10.static.yhbimg.com/yhb-img01/2016/06/30/10/01714bacda5e9fa323a1dc5f720a7f7140.jpg?imageView2/1/w/185/h/248',
link: ''
},
{
img: '//img10.static.yhbimg.com/yhb-img01/2016/06/30/10/01714bacda5e9fa323a1dc5f720a7f7140.jpg?imageView2/1/w/185/h/248',
link: ''
}
],
bottomSpace: true
},
{
big: [
{
img: '//placehold.it/{width}x{height}',
link: ''
}
],
small: [
{
img: '//placehold.it/{width}x{height}',
link: ''
},
{
img: '//placehold.it/{width}x{height}',
link: ''
}
],
right: true,
bottomSpace: true
},
{
big: [
{
img: '//placehold.it/{width}x{height}',
link: ''
}
],
small: [
{
img: '//placehold.it/{width}x{height}',
link: ''
},
{
img: '//placehold.it/{width}x{height}',
link: ''
}
]
},
{
big: [
{
img: '//placehold.it/{width}x{height}',
link: ''
}
],
small: [
{
img: '//placehold.it/{width}x{height}',
link: ''
},
{
img: '//placehold.it/{width}x{height}',
link: ''
}
],
right: true
}
]
},
{
floorZh: '潮流标志',
floorEn: 'STYLE ICON',
styleIcon: [
{
img: '//placehold.it/{width}x{height}',
name: 'COTE&CIEL',
des: '这都什么时代了?短发女生这都什么时代了?短发女生这都什么时代了?短发女生这都什么时代了?短发女生',
link: '/ ',
btnText: '去看看'
},
{
img: '//placehold.it/{width}x{height}',
name: 'COTE&CIEL',
des: '这都什么时代了?短发女生这都什么时代了?短发女生这都什么时代了?短发女生这都什么时代了?短发女生',
link: '/ ',
btnText: '去看看'
},
{
img: '//placehold.it/{width}x{height}',
name: 'COTE&CIEL',
des: '这都什么时代了?短发女生这都什么时代了?短发女生这都什么时代了?短发女生这都什么时代了?短发女生',
link: '/ ',
btnText: '去看看'
},
{
img: '//placehold.it/{width}x{height}',
name: 'COTE&CIEL',
des: '这都什么时代了?短发女生这都什么时代了?短发女生这都什么时代了?短发女生这都什么时代了?短发女生',
link: '/ ',
btnText: '去看看'
}
]
},
{
adBanner: {
img: '//placehold.it/{width}x{height}',
link: ''
}
},
{
floorZh: '资讯',
floorEn: 'EDITORIAL',
editorial: {
big: {
img: '//placehold.it/{width}x{height}',
link: ''
},
small: [
{
img: '//placehold.it/{width}x{height}',
link: '/',
bottomSpace: true,
rightSpace: true
},
{
img: '//placehold.it/{width}x{height}',
link: '/',
bottomSpace: true
},
{
img: '//placehold.it/{width}x{height}',
link: '/',
rightSpace: true
},
{
img: '//placehold.it/{width}x{height}',
link: ''
}
]
}
}
]
};
/* eslint-enable */
// return content;
};
module.exports = {
... ...
... ... @@ -10,6 +10,7 @@
<meta name="apple-mobile-web-app-status-bar-style" content="black" />
<meta content="telephone=no" name="format-detection" />
<meta content="email=no" name="format-detection" />
<meta name="renderer" content="webkit">
<link rel="dns-prefetch" href="//cdn.yoho.cn">
<link rel="dns-prefetch" href="//static.yohobuy.com">
<link rel="dns-prefetch" href="//img12.static.yhbimg.com">
... ...