|
...
|
...
|
@@ -6,18 +6,12 @@ |
|
|
|
|
|
|
|
var $ = require('yoho-jquery'),
|
|
|
|
Swiper = require('yoho-swiper'),
|
|
|
|
tip = require('../plugin/tip'),
|
|
|
|
lazyLoad = require('yoho-jquery-lazyload'),
|
|
|
|
ellipsis = require('yoho-mlellipsis'),
|
|
|
|
loading = require('../plugin/loading'),
|
|
|
|
PullRefresh = require('../plugin/pull-refresh');
|
|
|
|
|
|
|
|
var $window = $(window),
|
|
|
|
stopLoading = false,
|
|
|
|
$mainContent = $('.main-content'),
|
|
|
|
$headTab = $('.head-tab'),
|
|
|
|
headTabH = $headTab.height(),
|
|
|
|
scrollH = $(window).height() - headTabH,
|
|
|
|
$loadingTip = $('.loading-tip'),
|
|
|
|
u = navigator.userAgent,
|
|
|
|
isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
|
|
...
|
...
|
@@ -32,8 +26,8 @@ var $window = $(window), |
|
|
|
var mySwiper;
|
|
|
|
*/
|
|
|
|
|
|
|
|
var avatarKey, bannerLen, res, avatarSwiper, avatarSwiperClone, getIndexHtml,
|
|
|
|
$avatarClone, $starArticle, $avatarWrap, starIScroll;
|
|
|
|
var avatarKey, bannerLen, res, avatarSwiper, avatarSwiperClone, getIndexHtml, bannerSwiper,
|
|
|
|
$avatarClone, $avatarWrap, starIScroll;
|
|
|
|
|
|
|
|
var swiperNum = $('.avatar-wrap .swiper-slide').width() / 2;
|
|
|
|
|
|
...
|
...
|
@@ -42,39 +36,36 @@ if ($window.width() === 375 && isiOS) { |
|
|
|
}
|
|
|
|
|
|
|
|
require('../common');
|
|
|
|
|
|
|
|
lazyLoad($('img.lazy'));
|
|
|
|
ellipsis.init();
|
|
|
|
require('yoho-jquery-lazyload');
|
|
|
|
|
|
|
|
$window.on('mousewheel', false);
|
|
|
|
$('#yoho-header, .head-tab').on('touchmove', function() {
|
|
|
|
return false;
|
|
|
|
});
|
|
|
|
|
|
|
|
// 限制标题字数
|
|
|
|
function txtLimit(dom, item1, item2) {
|
|
|
|
var $title = dom.find(item1),
|
|
|
|
$cont = dom.find(item2);
|
|
|
|
|
|
|
|
$title[0].mlellipsis(2);
|
|
|
|
$cont[0].mlellipsis(3);
|
|
|
|
}
|
|
|
|
|
|
|
|
// 设置默认头像
|
|
|
|
function setAvatar($userAvatar) {
|
|
|
|
var myImage = new Image(),
|
|
|
|
avatar = '';
|
|
|
|
|
|
|
|
// 部分老用户没有头像，显示默认头像
|
|
|
|
avatar = $userAvatar.data('avatar');
|
|
|
|
|
|
|
|
myImage.onload = function() {
|
|
|
|
$userAvatar.css('background-image', 'url(' + avatar + ')');
|
|
|
|
};
|
|
|
|
|
|
|
|
if (avatar) {
|
|
|
|
myImage.src = avatar;
|
|
|
|
} else {
|
|
|
|
$userAvatar.addClass('default-avater');
|
|
|
|
}
|
|
|
|
}
|
|
|
|
// function txtLimit() {
|
|
|
|
//
|
|
|
|
// }
|
|
|
|
|
|
|
|
// // 设置默认头像
|
|
|
|
// function setAvatar($userAvatar) {
|
|
|
|
// var myImage = new Image(),
|
|
|
|
// avatar = '';
|
|
|
|
//
|
|
|
|
// // 部分老用户没有头像，显示默认头像
|
|
|
|
// avatar = $userAvatar.data('avatar');
|
|
|
|
//
|
|
|
|
// // myImage.onload = function() {
|
|
|
|
// // $userAvatar.css('background-image', 'url(' + avatar + ')');
|
|
|
|
// // };
|
|
|
|
// //
|
|
|
|
// // if (avatar) {
|
|
|
|
// // myImage.src = avatar;
|
|
|
|
// // } else {
|
|
|
|
// // $userAvatar.addClass('default-avater');
|
|
|
|
// // }
|
|
|
|
// }
|
|
|
|
|
|
|
|
|
|
|
|
// 明星头像点击居中显示或跳转
|
|
...
|
...
|
@@ -98,14 +89,18 @@ function bindAvatar(dom) { |
|
|
|
}
|
|
|
|
|
|
|
|
function setIndexAction() {
|
|
|
|
$('.avatar').each(function(key, item) {
|
|
|
|
$(item).addClass('avatar-' + key);
|
|
|
|
});
|
|
|
|
// $('.avatar').each(function(key, item) {
|
|
|
|
// $(item).addClass('avatar-' + key);
|
|
|
|
// });
|
|
|
|
|
|
|
|
// 明星头像 swiper 初始化
|
|
|
|
if (bannerLen > 1) {
|
|
|
|
avatarSwiper = new Swiper('.avatar-1', {
|
|
|
|
loop: true,
|
|
|
|
console.log(Math.floor($avatarWrap.find('.swiper-slide').length / 2));
|
|
|
|
avatarSwiper = new Swiper($avatarWrap.find('.avatar-swiper')[0], {
|
|
|
|
lazyLoading: true,
|
|
|
|
lazyLoadingInPrevNextAmount: 3,
|
|
|
|
|
|
|
|
// loop: true,
|
|
|
|
initialSlide: 2,
|
|
|
|
centeredSlides: true,
|
|
|
|
slidesPerView: 'auto',
|
|
...
|
...
|
@@ -115,7 +110,7 @@ function setIndexAction() { |
|
|
|
watchSlidesProgress: true,
|
|
|
|
watchSlidesVisibility: true,
|
|
|
|
onInit: function() {
|
|
|
|
$('.avatar-1 li').on('click', function() {
|
|
|
|
$avatarWrap.on('click', 'li', function() {
|
|
|
|
res = bindAvatar($(this));
|
|
|
|
return res;
|
|
|
|
});
|
|
...
|
...
|
@@ -124,19 +119,19 @@ function setIndexAction() { |
|
|
|
}
|
|
|
|
|
|
|
|
// 明星动态头像左右滑动
|
|
|
|
if ($('.article-avatar-swiper').find('li').length > 1) {
|
|
|
|
new Swiper('.article-avatar-swiper', {
|
|
|
|
initialSlide: 0,
|
|
|
|
lazyLoading: true,
|
|
|
|
lazyLoadingInPrevNext: true,
|
|
|
|
loop: true,
|
|
|
|
autoplay: 5000
|
|
|
|
});
|
|
|
|
}
|
|
|
|
// if ($('.article-avatar-swiper').find('li').length > 1) {
|
|
|
|
// new Swiper('.article-avatar-swiper', {
|
|
|
|
// initialSlide: 0,
|
|
|
|
// lazyLoading: true,
|
|
|
|
// lazyLoadingInPrevNext: true,
|
|
|
|
// loop: true,
|
|
|
|
// autoplay: 5000
|
|
|
|
// });
|
|
|
|
// }
|
|
|
|
|
|
|
|
// banner swiper 初始化
|
|
|
|
if ($('.banner-swiper').find('li').length > 1) {
|
|
|
|
new Swiper('.banner-swiper', {
|
|
|
|
bannerSwiper = new Swiper('.banner-swiper', {
|
|
|
|
lazyLoading: true,
|
|
|
|
lazyLoadingInPrevNext: true,
|
|
|
|
loop: true,
|
|
...
|
...
|
@@ -148,25 +143,20 @@ function setIndexAction() { |
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
if ($('.star-info').find('li').length > 0) {
|
|
|
|
$starArticle.each(function(key, item) {
|
|
|
|
txtLimit($(item), '.article-title', 'p');
|
|
|
|
|
|
|
|
// articleImgAction($(item), key);
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
|
|
|
$('.rank-avatar').each(function(key, item) {
|
|
|
|
setAvatar($(item));
|
|
|
|
});
|
|
|
|
|
|
|
|
$('#yoho-header, .head-tab').on('touchmove', function() {
|
|
|
|
return false;
|
|
|
|
});
|
|
|
|
// if ($('.star-info').find('li').length > 0) {
|
|
|
|
// $starArticle.each(function(key, item) {
|
|
|
|
// txtLimit($(item), '.article-title', 'p');
|
|
|
|
//
|
|
|
|
// // articleImgAction($(item), key);
|
|
|
|
// });
|
|
|
|
// }
|
|
|
|
|
|
|
|
// $('.rank-avatar').each(function(key, item) {
|
|
|
|
// setAvatar($(item));
|
|
|
|
// });
|
|
|
|
}
|
|
|
|
|
|
|
|
function initAction() {
|
|
|
|
$starArticle = $('.star-article');
|
|
|
|
$avatarWrap = $('.avatar-wrap');
|
|
|
|
bannerLen = $('.avatar-wrap').find('.swiper-slide').length;
|
|
|
|
|
|
...
|
...
|
@@ -178,16 +168,14 @@ function initAction() { |
|
|
|
|
|
|
|
$avatarClone = $('.avatar-clone');
|
|
|
|
|
|
|
|
// 限制标题字数
|
|
|
|
$('.cont-area').each(function() {
|
|
|
|
txtLimit($(this), '.title', '.cont-txt');
|
|
|
|
$('img.lazy').lazyload({
|
|
|
|
effect: 'fadeIn'
|
|
|
|
});
|
|
|
|
|
|
|
|
lazyLoad($('img.lazy'));
|
|
|
|
|
|
|
|
setIndexAction();
|
|
|
|
}
|
|
|
|
|
|
|
|
initAction();
|
|
|
|
|
|
|
|
// 首页数据请求
|
|
|
|
getIndexHtml = function() {
|
|
...
|
...
|
@@ -195,33 +183,27 @@ getIndexHtml = function() { |
|
|
|
$.ajax({
|
|
|
|
url: '/guang/star/getIndexHtml',
|
|
|
|
dataType: 'html',
|
|
|
|
success: function(data) {
|
|
|
|
stopLoading = false;
|
|
|
|
|
|
|
|
if (data) {
|
|
|
|
if (avatarSwiperClone) {
|
|
|
|
avatarSwiperClone.destroy(true, true);
|
|
|
|
avatarSwiperClone = '';
|
|
|
|
}
|
|
|
|
|
|
|
|
$mainContent.html(data);
|
|
|
|
|
|
|
|
initAction();
|
|
|
|
})
|
|
|
|
.done(function(data) {
|
|
|
|
if (data) {
|
|
|
|
if (avatarSwiperClone) {
|
|
|
|
avatarSwiperClone.destroy(true, true);
|
|
|
|
avatarSwiperClone = null;
|
|
|
|
}
|
|
|
|
|
|
|
|
loading.hideLoadingMask();
|
|
|
|
},
|
|
|
|
error: function() {
|
|
|
|
tip.show('网络断开连接了~');
|
|
|
|
$mainContent.html(data);
|
|
|
|
|
|
|
|
initAction();
|
|
|
|
}
|
|
|
|
})
|
|
|
|
.always(function() {
|
|
|
|
stopLoading = false;
|
|
|
|
loading.hideLoadingMask();
|
|
|
|
});
|
|
|
|
};
|
|
|
|
|
|
|
|
initAction();
|
|
|
|
|
|
|
|
// 下拉刷新，上拉加载
|
|
|
|
starIScroll = new PullRefresh('.star-main', {
|
|
|
|
height: scrollH,
|
|
|
|
pullDown: function() {
|
|
|
|
if (!stopLoading) {
|
|
|
|
stopLoading = true;
|
|
...
|
...
|
@@ -232,58 +214,66 @@ starIScroll = new PullRefresh('.star-main', { |
|
|
|
|
|
|
|
starIScroll.iScroll.on('scrollStart', function() {
|
|
|
|
// 下拉
|
|
|
|
if (this.directionY === -1) {
|
|
|
|
$loadingTip.slideDown();
|
|
|
|
}
|
|
|
|
});
|
|
|
|
// if (this.directionY === -1) {
|
|
|
|
// $loadingTip.slideDown();
|
|
|
|
// }
|
|
|
|
|
|
|
|
starIScroll.iScroll.on('scroll', function() {
|
|
|
|
if (this.directionY !== -1) {
|
|
|
|
starIScroll.iScroll.refresh();
|
|
|
|
}
|
|
|
|
|
|
|
|
if ($avatarWrap.offset().top <= headTabH) {
|
|
|
|
$avatarClone.show();
|
|
|
|
|
|
|
|
if (!avatarSwiperClone) {
|
|
|
|
avatarSwiperClone = new Swiper('.avatar-0', {
|
|
|
|
loop: true,
|
|
|
|
initialSlide: $('.avatar-1').find('.swiper-slide-active').index() % bannerLen,
|
|
|
|
centeredSlides: true,
|
|
|
|
slidesPerView: 'auto',
|
|
|
|
loopedSlides: bannerLen,
|
|
|
|
spaceBetween: 10,
|
|
|
|
slidesOffsetBefore: -swiperNum,
|
|
|
|
watchSlidesProgress: true,
|
|
|
|
watchSlidesVisibility: true,
|
|
|
|
onInit: function() {
|
|
|
|
$('.avatar-0 li').on('click', function() {
|
|
|
|
res = bindAvatar($(this));
|
|
|
|
return res;
|
|
|
|
});
|
|
|
|
}
|
|
|
|
});
|
|
|
|
|
|
|
|
avatarSwiperClone.params.control = avatarSwiper;
|
|
|
|
avatarSwiper.params.control = avatarSwiperClone;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
if ($avatarWrap.offset().top > $('.avatar-1')[0].scrollHeight) {
|
|
|
|
$avatarClone.hide();
|
|
|
|
}
|
|
|
|
bannerSwiper && bannerSwiper.startAutoplay();
|
|
|
|
});
|
|
|
|
|
|
|
|
// starIScroll.iScroll.on('scroll', function() {
|
|
|
|
// var avatarOffsetT;
|
|
|
|
//
|
|
|
|
// if (this.directionY !== -1) {
|
|
|
|
// setTimeout(function() {
|
|
|
|
// starIScroll.iScroll.refresh();
|
|
|
|
// }, 0);
|
|
|
|
// }
|
|
|
|
//
|
|
|
|
// avatarOffsetT = $avatarWrap[0].offsetTop;
|
|
|
|
//
|
|
|
|
// if (-this.y >= avatarOffsetT) {
|
|
|
|
// $avatarClone.show();
|
|
|
|
//
|
|
|
|
// if (!avatarSwiperClone) {
|
|
|
|
// avatarSwiperClone = new Swiper($avatarClone[0], {
|
|
|
|
// loop: true,
|
|
|
|
// initialSlide: $avatarWrap.find('.swiper-slide-active').index() % bannerLen,
|
|
|
|
// centeredSlides: true,
|
|
|
|
// slidesPerView: 'auto',
|
|
|
|
// loopedSlides: bannerLen,
|
|
|
|
// spaceBetween: 10,
|
|
|
|
// slidesOffsetBefore: -swiperNum,
|
|
|
|
// watchSlidesProgress: true,
|
|
|
|
// watchSlidesVisibility: true,
|
|
|
|
// onInit: function() {
|
|
|
|
// $avatarClone.find('li').on('click', function() {
|
|
|
|
// res = bindAvatar($(this));
|
|
|
|
// return res;
|
|
|
|
// });
|
|
|
|
// }
|
|
|
|
// });
|
|
|
|
//
|
|
|
|
// avatarSwiperClone.params.control = avatarSwiper;
|
|
|
|
// avatarSwiper.params.control = avatarSwiperClone;
|
|
|
|
// }
|
|
|
|
// } else {
|
|
|
|
// $avatarClone.hide();
|
|
|
|
// }
|
|
|
|
// });
|
|
|
|
|
|
|
|
starIScroll.iScroll.on('scrollEnd', function() {
|
|
|
|
$loadingTip.slideUp();
|
|
|
|
});
|
|
|
|
// $loadingTip.slideUp();
|
|
|
|
|
|
|
|
$('img').on('load', function() {
|
|
|
|
starIScroll && starIScroll.iScroll.refresh();
|
|
|
|
bannerSwiper && bannerSwiper.stopAutoplay();
|
|
|
|
});
|
|
|
|
|
|
|
|
window.setCookie('guangStarUid', window.queryString.uid);
|
|
|
|
|
|
|
|
// $('img').on('load', function() {
|
|
|
|
// starIScroll && starIScroll.iScroll.refresh();
|
|
|
|
// });
|
|
|
|
|
|
|
|
// 明星动态文章图片相关操作
|
|
|
|
/*
|
|
|
|
function articleImgAction(dom, key) {
|
...
|
...
|
|
