123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262 |
- var numPage = 0;//第几页
- var dataList = [];//商品list
- $().ready(function () {
- swiperPage();
- getActivityGoodsList();//专题列表
- writeLogH5({action:'必剁清单首页',channel:'H5',url:window.location.href});//首页埋点
- })
- function swiperPage () {
- var mySwiper = new Swiper(".swiper-container", {
- direction: "vertical", //纵向展示
- // pagination: ".swiper-pagination", //小点
- //virtualTranslate : true,
- mousewheelControl: true,
- onInit: function(swiper) {
- swiperAnimateCache(swiper);
- swiperAnimate(swiper);
- },
- onSlideChangeEnd: function(swiper) {
- swiperAnimate(swiper);
- },
- onTransitionEnd: function(swiper) {
- //回调函数,过渡结束时触发,接收Swiper实例作为参数。
- if(numPage != $(".swiper-slide-active").attr('data-num') && $(".swiper-slide-active").attr('data-num')){
- //监控动画执行到哪里了
- numPage = $(".swiper-slide-active").attr('data-num');
- if(numPage != 1 && numPage){
- var title = $(".swiper-slide-active .title-swiper-slide").html();
- var categroy_id = $(".swiper-slide-active .title-swiper-slide").attr("categroy_id");//专题id
- writeLogH5({action:'必剁清单-' + title,channel:'H5',categroy_id:categroy_id,url:window.location.href});//专题埋点
- }
- }
- swiperAnimate(swiper);
- },
- watchSlidesProgress: true,
- onProgress: function(swiper) {
- //回调函数,当Swiper的progress被改变时执行。接受Swiper实例和progress作为参数(可选)。
- for (var i = 0; i < swiper.slides.length; i++) {
- var slide = swiper.slides[i];
- var progress = slide.progress;
- var translate = progress * swiper.height / 4;
- var scale = 1 - Math.min(Math.abs(progress * 0.5), 1);
- var opacity = 1 - Math.min(Math.abs(progress / 2), 0.5);
- slide.style.opacity = opacity;
- var es = slide.style;
- es.webkitTransform = es.MsTransform = es.msTransform = es.MozTransform = es.OTransform = es.transform =
- "translate3d(0," +
- translate +
- "px,-" +
- translate +
- "px) scaleY(" +
- scale +
- ")";
- }
- },
- onSetTransition: function(swiper, speed) {
- //回调函数,每当设置Swiper开始过渡动画时执行。transtion获取到的是Swiper的speed值
- for (var i = 0; i < swiper.slides.length; i++) {
- var es = swiper.slides[i].style;
- es.webkitTransitionDuration = es.MsTransitionDuration = es.msTransitionDuration = es.MozTransitionDuration = es.OTransitionDuration = es.transitionDuration =
- speed + "ms";
- }
- }
- });
- }
- function getActivityGoodsList () {
- //专题列表
- $.ajax({
- type:"post",
- url:"/api/v2/channel/getActivityGoodsList",
- dataType:'json',
- success:function (res) {
- // console.log(res)
- if(res && res.errno == 0){
- dataList = res.rst.data;
- var categoryList = '';
- dataList.forEach(function (item, index) {
- if(index < 6){
- categoryList += `<li>${item.groups.name}</li>`
- }
- })
- $('.home_content .category').html(categoryList)
- sectionPageHtml();//页面渲染
- }
- }
- });
- }
- function sectionPageHtml () {
- //页面渲染
- var pageArrHtml = [];
- dataList.forEach(function (item, index) {
- var commodityHtml = '';
- item.goods.forEach(function (it,id){
- if(id<12){
- commodityHtml += `<li goods_id="${it.goods_id}" is_coupon="${it.is_coupon}" goods_url="${it.goods_url}">
- <img class="commodityImg" src="${it.img}" />
- <div class="title">${it.title}</div>
- <div class="price">
- <span class="newPrice">¥${it.discount_price}</span>
- <span class="oldPrice">¥${it.price}</span>
- </div>
- </li>`
- }
- })
- pageArrHtml[index] = `<div id="share" class="shareGo" onclick="shareWechatUrl()"><img src="https://kx-youhuiquan.oss-cn-beijing.aliyuncs.com/shuangshiyi/commodityListFirst/share.png"/><span>分享</span></div><div class="title-swiper-slide" categroy_id = "${item.groups.id}">${item.groups.name}</div><ul class="commodityList">${commodityHtml}</ul><div id="goApp" class="goApp" onclick="downLoadApp()"><img src="https://kx-youhuiquan.oss-cn-beijing.aliyuncs.com/shuangshiyi/commodityListFirst/goApp.png" /></div><img src="https://kx-youhuiquan.oss-cn-beijing.aliyuncs.com/shuangshiyi/yure/huojian.png" id="array" class="resize">`;
- if(index == 5){//最后一页
- pageArrHtml[index] = `<div id="share" class="shareGo" onclick="shareWechatUrl()"><img src="https://kx-youhuiquan.oss-cn-beijing.aliyuncs.com/shuangshiyi/commodityListFirst/share.png"/><span>分享</span></div><div class="title-swiper-slide">${item.groups.name}</div><ul class="commodityList">${commodityHtml}</ul><div id="goApp" class="goApp" onclick="downLoadApp()"><img src="https://kx-youhuiquan.oss-cn-beijing.aliyuncs.com/shuangshiyi/commodityListFirst/goApp.png" /></div>`;
- }
- })
- $('.swiper-slide-two').html(pageArrHtml[0])
- $('.swiper-slide-three').html(pageArrHtml[1])
- $('.swiper-slide-four').html(pageArrHtml[2])
- $('.swiper-slide-five').html(pageArrHtml[3])
- $('.swiper-slide-six').html(pageArrHtml[4])
- $('.swiper-slide-seven').html(pageArrHtml[5])
- goTaobaoDetail()
- isWeixinEvent();//判断是否是微信浏览器
- }
- function goTaobaoDetail (){
- $(".commodityList").find("li").click(function () {
- //判断是不是微信端,选择app方法获取token 还是后端提供
- if(navigator.userAgent.toLowerCase().match(/MicroMessenger/i) == "micromessenger"){
- //微信
- downLoadApp();
- }else{
- //app端
- var goods_id = $(this).attr('goods_id');
- var url = $(this).attr('goods_url');
- var is_coupon = $(this).attr('is_coupon');
- writeLogH5({action:'必剁清单-单个商品',channel:'H5',goods_id:goods_id,url:window.location.href});//商品埋点
- openTaobao(url,is_coupon,goods_id)
- }
- })
- }
- function writeLogH5 (data) {
- //H5页面埋点
- $.ajax({
- type:'post',
- url:'/api/v2/channel/writeLogH5',
- dataType:'json',
- data:data,
- success:function (res) {
- }
- })
- }
- // 打开淘宝
- function openTaobao (url,is_coupon,goods_id) {
- var param = {"taobaoUrl" : url}
- param = JSON.stringify(param)
- try{
- if(navigator.userAgent.match(/(iPhone|iPod|iPad);?/i)){
- window.webkit.messageHandlers.app_h5_open_taobao_url.postMessage(param);
- }
- if(navigator.userAgent.match(/android/i)){
- obj4H5.app_h5_open_taobao_url(param);
- }
- }catch(e){
- //TODO handle the exception
- getTaoKouLing(goods_id,is_coupon)
- copyPassword()
- }
- }
- //分享到微信url
- function shareWechatUrl () {
- writeLogH5({action:'必剁清单-分享',channel:'H5',url:window.location.href});//分享埋点
- var param = {
- "shareImageUrl" : "https://kx-youhuiquan.oss-cn-beijing.aliyuncs.com/shuangshiyi/commodityListFirst/shareWechat.png",
- "shareTitle" : "我剁手了,你呢?",
- "shareDescirpt":"终于找到一份双十一抢购清单,平台大额券+给力双十一活动,双重折扣优惠到底!",
- "shareUrl":window.location.href,//详情链接
- "shareType":"1" //1:微信好友 2:朋友圈
- }
- param = JSON.stringify(param)
- try{
- if(navigator.userAgent.match(/(iPhone|iPod|iPad);?/i)){
- window.webkit.messageHandlers.app_h5_wx_share_url.postMessage(param);
- }
- if(navigator.userAgent.match(/android/i)){
- obj4H5.app_h5_wx_share_url(param);
- }
- }catch(e){
- showMsg("先更新,再分享哦~")
- }
- }
- //点击复制淘口令
- function getTaoKouLing(goods_id,is_coupon){
- $.ajax({
- type: "post",
- url: "/api/v2/adzoneCreate/h5CopyOfTheNaughtyPassword",
- headers:{
- source : 6000
- },
- data:{
- goods_id: goods_id ,
- is_coupon : is_coupon
- },
- success:function(res){
- if(res.errno == 0 && res.rst){
- var taokouling =res.rst.data;
- $("#taokouling").text(taokouling);
- }
- }
- })
- }
- //复制淘口令
- function copyPassword() {
- var data=document.getElementById("taokouling").innerHTML;
- if(data == ''){
- return;
- }
- console.log(data)
- copy_2.innerHTML = data;
- copy_1.setAttribute('value',data)
- if(Boolean(navigator.userAgent.match(/(iPhone|iPod|iPad);?/i))){
- //区分iPhone设备
- window.getSelection().removeAllRanges();//这段代码必须放在前面否则无效
- var Url2=document.getElementById("copy_2");//要复制的节点
- var range = document.createRange();
- //选中需要复制的节点
- range.selectNode(Url2);
- //执行选中元素
- window.getSelection().addRange(range);
- //执行copy操作
- var successful = document.execCommand("copy");
- //移除选中的元素
- window.getSelection().removeAllRanges();
- }else{
- var Url2=document.getElementById("copy_1");//要复制的节点
- Url2.select();//选择对象
- document.execCommand("Copy");//执行浏览器复制命令
- }
- showMsg('复制淘口令成功,请打开淘宝查看商品')
- }
- /**
- * [showMsg 提示各种错误信息,3s后消失]
- */
- function showMsg(msg) {
- var msgBox = document.getElementsByClassName('alert-info')[0];
- msgBox.getElementsByTagName("p")[0].innerHTML=msg;
- msgBox.style.display="block";
- setTimeout(function() {
- msgBox.style.display="none";
- }, 2000);
- }
- //判断是否是微信浏览器
- function isWeixinEvent () {
- //判断是不是微信端,选择app方法获取token 还是后端提供
- if(navigator.userAgent.toLowerCase().match(/MicroMessenger/i) == "micromessenger"){
- //微信
- $(".shareGo").css("display","none");
- $(".goApp").css("display","block");
- }else{
- //app端
- $("#goApp").css("display","none");
- }
- }
- function downLoadApp () {
- window.location.href = 'http://a.app.qq.com/o/simple.jsp?pkgname=com.kuxuan.coupon_packet'
- }
|