pfhwyigou/mobile/web/js/house/album.js

// var _window = $(window).height();  //获取屏幕高度
// $('.m_album_box').height(_window);

$('.qwpuic').hide();

$(function(){    //导航移动

    //demo示例六 通过id调取
    $('#demo06').navbarscroll({
        defaultSelect:0,
        scrollerWidth:6,
        fingerClick:1,
        endClickScroll:function(obj){
            // console.log(obj.text())
        }
    });
});



$.getUrlParam = function (name) {
   var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
   var r = window.location.search.substr(1).match(reg);
   if (r != null) return unescape(r[2]); return null;
  }


var _lpStyleId = $.getUrlParam('lpStyleId');

window.onload = function(){
	// console.log(_lpStyleId);

  if (_lpStyleId == 2) {
      $('.m_albumtnav_box ul li[styleid="'+_lpStyleId+'"]').eq(0).click();
       // console.log(2);
  }else{
  	  $('.m_albumtnav_box ul li[styleid="'+_lpStyleId+'"]').click();
      // console.log(1);
  }



}





// var  Interface = "./sp.json";   //默认接口
var _styleid = $('.scroller ul li').eq(0).attr('styleid');  //默认类型
var _dataid = $('.scroller ul li').eq(0).attr('dataid');    //默认ID
var _dataHid = $('.scroller ul li').eq(0).attr('datahid');    //默认ID
SWitchStyleApi(_styleid);
_xcajax();  // 切换ajax调用

$('.scroller ul li').on('click',function(){       //切换事件

    _styleid = $(this).attr('styleid');  //获取接口类型
    _dataHid = $(this).attr('datahid');
    _dataid = $(this).attr('dataid');  //获取ID
    SWitchStyleApi(_styleid);
    _xcajax();   // 切换ajax调用
})

function SWitchStyleApi(_styleid) {
    switch(_styleid)    //判断接口
    {
        case '1':
            Interface = "/housecategory/video";    // 视频接口
            break;
        case '3':
            Interface = "/housecategory/housetypeimg";    // 视频户型
            break;
        case '2':
            Interface = "/housecategory/albumimg";   // 相册接口
            break;
        case '4':
            Interface = "/housecategory/live";   // 直播借口
            break;
        default:
            PublicAction.hint('未提交成功！');
            break;
    }
}



function _xcajax(){
    var html = '';
    $.ajax({
        url: Interface,
        data:{aid:_dataid,hid:_dataHid,csrf_token_m:csrfToken},// hid:hid, csrf_token_m:csrfToken
        type: "POST",
        dataType: "json",
        success: function(data) {//请求成功完成后要执行的方法

            if(data.code == '200'){
                var _data =data.data;
                html+='<div class="m_albumlb_box swiper-container" id="swiper1">';
                html+='<ul class="swiper-wrapper">';
                 console.log(_styleid);
                switch(_styleid)    //判断接口
                {
                    case '1':
                    case '4':
                        html+='<li class="swiper-slide">';
                        html+='<div class="m_video">';
                        html+='<video class="m_video_sp" id="myVideo" src="'+data.data.video+'" poster="'+data.data.thumb+'" width="100%" height="100%"  autobuffer style="object-fit:fill" preload="none">';
                        html+='</video>';
                        html+='<div class="m_video_img"><img src="/image/housealbum/m_xc2.png" alt=""/></div>';
                        html+='</div>';
                        html+='</li>';

                        break;
                    case '3':
                        $.each(data.data, function (i, data) {
                            html+='<li class="swiper-slide">';
                            html+='<img src="'+data.img+'" alt="">';
                            html+='<div class="m_album_text">';
                            html+='<div class="m_album_textTop">';
                            if (data.title != "" &&  data.title != undefined & data.title != null) {
                              html+='<span>'+data.title+'</span>'; 
                            };
                            if (data.area != "" &&  data.area != undefined & data.area != null) {
                            html+='<span>约￥'+data.area+'</span>';
                            };
                            html+='</div>';
                            html+='<div class="m_album_textTop">';
                            html+='<span>'+data.indoor_info+'</span>';
                            // html+='<span>建筑面积 '+data.indoor_info+'</span>';
                            html+='</div>';
                            html+='</div>';
                            html+='</li>';
                        })
                        break;
                    case '2':
                        $.each(data.data, function (i, data) {
                            html+='<li class="swiper-slide">';
                            html+='<img src="'+data.img+'" alt="">';
                            html+='</li>';
                        })
                        break;

                    default:
                        PublicAction.hint('未提交成功！');
                        break;
                }

                html+='</ul>';
                html+='<div class="swiper-pagination"></div>';
                html+='</div>';

                $('.m_swiper_box').html("");
                $('.m_swiper_box').html(html);



                $('.m_video_img').on('click',function(){   //处理视频播放图标

                    var _video = document.getElementById("myVideo");

                    myVideo.play();   //点击图标视频播放
                    $('.m_video_sp').attr('controls','controls');    //点击 显示默认的控件
                    $(this).hide();
                })





                var _lirWidth = $('#swiper1 ul li').outerWidth();  //获取 LI 宽度
                var _ulWidth= $('#swiper1 ul').outerWidth();       // UL 的 宽度
                var _lilength = $('#swiper1 ul li').length;        //获取 LI 总数
                var Swiper_length = _lirWidth * _lilength +  25  - _ulWidth;   //计算总长度
                console.log(Swiper_length);


                var _nexttj = true;
                function _next(){       //只执行一次方法
                    if(_nexttj){        //等于 true 执行
                        // console.log('左边');
                        $('.wrapper02 .scroller li.cur').next().click();  //上一个类型
                        _nexttj = false;    //等于 false 不执行
                    }
                }

                var _prevtj = true;
                function _prev(){         //只执行一次方法
                    if(_prevtj){          //等于 true 执行
                        // console.log('右边');
                        $('.wrapper02 .scroller li.cur').prev().click();   //下一个类型
                        _prevtj = false;      //等于 false 不执行
                    }
                }

                var mySwiper1 = new Swiper('.swiper-container',{
                    // autoplay:true,  //自动切换
                    loop : false,    //循环
                    pagination: '.swiper-pagination',
                    paginationType : 'fraction',

                    paginationFractionRender: function (swiper, currentClassName, totalClassName) {   //图片数量
                        return '<span class="' + currentClassName + '"></span>' +
                            ' / ' +
                            '<span class="' + totalClassName + '"></span>';
                    },

                    onTouchMove: function(swiper){   // 移动执行 上或下一个类型
                        TR=swiper.translate
                        console.log(TR);

                        if(TR > 25){
                            _prev();    //调用  //下一个类型
                        }else if(TR < -Swiper_length){
                            _next();   //调用  //上一个类型
                        }
                    }
                })
            }


        }
    });
}