checkEnvironment()
click()
mySwiper()

mySwiper2()
IsPC()
$(window).resize(function () {
    IsPC()
});
function IsPC() {
    var userAgentInfo = navigator.userAgent;
    var Agents = [
        "Android",
        "iPhone",
        "SymbianOS",
        "Windows Phone",
        "iPad",
        "iPod",
    ];
    var flag = true;
    for (var v = 0; v < Agents.length; v++) {
        if (userAgentInfo.indexOf(Agents[v]) > 0) {
            flag = false;
            break;
        }
    }
    if (flag) {
        window.location.href = "index.html";
    }
}

function checkEnvironment() {
    var u = navigator.userAgent;
    var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
    var isWeiXin = false; //是否是微信浏览器
    var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1;
    //window.navigator.userAgent属性包含了浏览器类型、版本、操作系统类型、浏览器引擎类型等信息，这个属性可以用来判断浏览器类型
    var ua = window.navigator.userAgent.toLowerCase();
    //通过正则表达式匹配ua中是否含有MicroMessenger字符串
    if (ua.match(/MicroMessenger/i) == 'micromessenger') {
        isWeiXin = true;
    } else {
        isWeiXin = false;
    }
    this.isiOS = isiOS;
    this.isWeiXin = isWeiXin;
    if (isWeiXin) {
        this.initWxSdk();
    }
}

function initWxSdk() {
    var that = this;
    $.ajax({
        url: "https://h5.ptcmc.net/api4/WxSdk/getSignature",
        type: "POST",
        data: JSON.stringify({
            "url": window.location.href
        }),
        dataType: "json",
        contentType: "application/json;charset=UTF-8",
        success: function (res) {
            var result = res.content;
            wx.config({
                debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
                appId: result.appId, // 必填，公众号的唯一标识
                timestamp: result.timestamp, // 必填，生成签名的时间戳
                nonceStr: result.nonceStr, // 必填，生成签名的随机串
                signature: result.signature, // 必填，签名
                jsApiList: [
                    'onMenuShareTimeline',
                    'onMenuShareAppMessage',
                ] // 必填，需要使用的JS接口列表
            });
            wx.ready(function () {
                wx.onMenuShareAppMessage({
                    title: "璀璨非遗 平潭华章",
                    link: "https://h5.ptcmc.net/file/2024-6-24-%E5%B9%B3%E6%BD%AD%E9%9D%9E%E9%81%97/mobile.html",
                    desc: "",
                    imgUrl: "https://h5.ptcmc.net/file/2024-6-24-%E5%B9%B3%E6%BD%AD%E9%9D%9E%E9%81%97/images/share.jpg",
                    success: function () { },
                    cancel: function () { }
                });
                wx.onMenuShareTimeline({
                    title: "璀璨非遗 平潭华章",
                    link: "https://h5.ptcmc.net/file/2024-6-24-%E5%B9%B3%E6%BD%AD%E9%9D%9E%E9%81%97/mobile.html",
                    desc: "",
                    imgUrl: "https://h5.ptcmc.net/file/2024-6-24-%E5%B9%B3%E6%BD%AD%E9%9D%9E%E9%81%97/images/share.jpg",
                    success: function () { },
                    cancel: function () { }
                });
            });
        },
        error: function () { }
    });
}

//判断手机横竖屏
window.addEventListener("onorientationchange" in window ? "orientationchange" : "resize", function () {
    if (window.orientation === 180 || window.orientation === 0) {
        //options.orientationchange('portrait');
        $('.black_page').css('display', 'none')
    }
    if (window.orientation === 90 || window.orientation === -90) {//横屏时
        //options.orientationchange('landscape')
        $('.black_page').css('display', 'flex')
    }
}, false);
//传文脉swiper
var mySwiper
var realIndexs
function mySwiper() {
    mySwiper = new Swiper('#swiper-container', {
        slidesPerView: 1,
        loopAdditionalSlides: 1,
        direction: 'vertical',
        loop: true,
        speed: 1000,
        observeParents: true, //修改swiper的父元素时，自动初始化swiper
        observer: true,  //修改swiper自己或子元素时，自动初始化swiper
        autoplay: {
            delay: 2500,
            disableOnInteraction: false,
        },
        allowTouchMove: false,
        slideChangeTransitionEnd: function () {
            this.autoplay.start(); // 在滑动结束时重新启动自动播放
        }

    });
}

// 省级非遗卷轴swiper
var mySw1 = false
var mySwipers
function mySwiper1() {
    mySwipers = new Swiper('#swiper-container1', {
        slidesPerView: 1,
        slidesPerGroup: 1,
        loopAdditionalSlides: 1,
        direction: 'vertical',
        loop: true,
        speed: 1000,
        observeParents: true, //修改swiper的父元素时，自动初始化swiper
        observer: true,  //修改swiper自己或子元素时，自动初始化swiper

        navigation: {
            nextEl: '.second_right',
            prevEl: '.second_left'
        },
        on: {
            slideChangeTransitionStart: function () {
                mySw1 = true
                if ($('.introduce').hasClass('animate__animated animate__zoomIn')) {
                    $('.introduce').removeClass('animate__animated animate__zoomIn')

                } else {
                    $('.introduce').addClass('animate__animated animate__zoomIn')
                    setTimeout(() => {
                        $('.introduce').removeClass('animate__animated animate__zoomIn')
                    }, 1000);

                }

            },

            slideChange: function () {

                var activeIndex = this.realIndex; // 当前活动的slide的下标
                if (activeIndex == 0) {
                    $('.introduce').css('display', 'flex')
                    $('.p1').css('display', 'block')
                } else {
                    $('.p1').css('display', 'none')
                }
                if (activeIndex == 1) {

                    $('.introduce').css('display', 'flex')
                    $('.p2').css('display', 'block')
                } else {
                    $('.p2').css('display', 'none')
                }
                if (activeIndex == 2) {

                    $('.introduce').css('display', 'flex')
                    $('.p3').css('display', 'block')
                } else {
                    $('.p3').css('display', 'none')
                }
                if (activeIndex == 3) {

                    $('.introduce').css('display', 'flex')
                    $('.p4').css('display', 'block')
                } else {
                    $('.p4').css('display', 'none')
                }
            },

            // click: function () {
            //     var clickedIndex = this.clickedSlide.dataset.swiperSlideIndex || this.clickedIndex;
            //     if (clickedIndex == 0) {
            //         $('.introduce').css('display', 'flex')
            //         $('.p1').css('display', 'block')
            //     } else {
            //         $('.p1').css('display', 'none')
            //     }
            //     if (clickedIndex == 1) {
            //         $('.introduce').css('display', 'flex')
            //         $('.p2').css('display', 'block')

            //     } else {
            //         $('.p2').css('display', 'none')
            //     }
            //     if (clickedIndex == 2) {
            //         $('.introduce').css('display', 'flex')
            //         $('.p3').css('display', 'block')

            //     } else {
            //         $('.p3').css('display', 'none')
            //     }
            //     if (clickedIndex == 3) {
            //         $('.introduce').css('display', 'flex')
            //         $('.p4').css('display', 'block')

            //     } else {
            //         $('.p4').css('display', 'none')
            //     }
            // },


        }
    });
}
//区级非遗swiper
function mySwiper2() {
    var mySwiper2 = new Swiper('#swiper-container2', {
        slidesPerView: 3,
        slidesPerGroup: 1,
        loopAdditionalSlides: 1,
        direction: 'vertical',
        loop: true,
        speed: 1000,
        observeParents: true, //修改swiper的父元素时，自动初始化swiper
        observer: true,  //修改swiper自己或子元素时，自动初始化swiper
        autoplay: {
            delay: 2500,
            disableOnInteraction: false
        }
    });
}
// 图片预加载
preLoadData()
function preLoadData() {
    var that = this;
    $('.preload').css('display', 'flex');
    var preload = new createjs.LoadQueue(true);
    this.preload = preload;
    // preload.installPlugin(createjs.Sound);
    preload.on("progress", handleFileProgress);
    preload.on("complete", loadComplete);
    $.getJSON("./json/preload_mobile.json", function (data) {
        preload.loadManifest(data);
    });
}
function handleFileProgress(event) {
    var progress = (event.progress * 100 | 0) + "%";
    $('.progress-bar').css('width', progress);
    if (event.progress == 1) {
        $('.progress-bar').css('background-color', '#dac4a8');
    } else if (event.progress > 0.75) {
        $('.progress-bar').css('background-color', '#dac9b3');
    } else if (event.progress > 0.5) {
        $('.progress-bar').css('background-color', '#d8cdbf');
    } else if (event.progress > 0.25) {
        $('.progress-bar').css('background-color', '#d8d2ca');
    } else {
        $('.progress-bar').css('background-color', '#dad9d7');
    }
}

function loadComplete() {

    setTimeout(() => {
        $('.cloud_left').addClass('animate__animated animate__fadeInTopRight')
        $('.cloud_right').addClass('animate__animated animate__fadeInBottomRight')
        setTimeout(() => {
            $('.title').addClass('show animate__animated animate__backInDown')
        }, 500);

        $('.loading_page').css('display', 'none')

        $('.directory_container').css('display', 'block')
        $('.mouse_logo').css('display', 'block')
    }, 1000);
}
// 视频播放
function videoShow() {

    $('.begin_logo').on('click', function () {
        $('.video_box').css('display', 'flex')
        yunMovie = false
        if (videoIndex === 1) {
            $('.main_video').attr("src", './images/movie/平潭藤牌操.mp4')
        }
        if (videoIndex === 2) {
            $('.main_video').attr("src", './images/movie/平潭贝雕.mp4')
        }
        if (videoIndex === 3) {
            $('.main_video').attr("src", './images/movie/平潭米糊药.mp4')
        }
        if (videoIndex === 4) {
            $('.main_video').attr("src", './images/movie/平潭词明戏.mp4')
        }
        if (videoIndex === 5) {
            $('.main_video').attr("src", './images/movie/海坛老酒.mp4')
        }
        if (videoIndex === 6) {
            $('.main_video').attr("src", './images/movie/平潭沙画.mp4')
        }
        setTimeout(() => {
            $('.main_video').trigger('play');
        }, 100);
    })
}
function click() {
    // 省级非遗/区级非遗切换
    $('.second_change').click(function () {
        $(".second_text").css('display', 'none')
        $('.second_scroll').css('display', 'none')
        $('.introduce').css('display', 'none')
        $('.second_ifram').css('display', 'flex')
    })

    $('.back').click(function () {

        $(".second_text").css('display', 'block')
        $('.second_scroll').css('display', 'flex')
        $('.second_ifram').css('display', 'none')

    })
    // 视频关闭
    $('.video_close').on('click', function () {

        yunMovie = true
        $('.video_box').css('display', 'none')
        $('.main_video').trigger('pause')
    })
    // 展示目录
    $('.directory_title,.pull').click(function () {
        $('.directory').addClass('show animate__animated animate__slideInRight ')
        $('.pull').css('display', 'none')
        $('.push').addClass('animate__animated animate__heartBeat animate__infinite')
    })
    // 收回目录
    $('.push').click(function () {
        $('.directory').removeClass('animate__slideInRight')
        $('.directory').addClass('animate__fadeOutRight ')
        $('.pull').css('display', 'block')
    })
}
// 跳转到指定的 URL 地址
function toOut(url) {
    window.open(url)
}
// 点击视频图片事件
var videoIndex = 1
function tvChange(index) {
    if (index === 1) {
        $('.tv_picture').attr("src", './images/mobile/three_1.png')
        videoIndex = 1
    }
    if (index === 2) {
        $('.tv_picture').attr("src", './images/mobile/three_2.png')
        videoIndex = 2
    }
    if (index === 3) {
        $('.tv_picture').attr("src", './images/mobile/three_3.png')
        videoIndex = 3
    }
    if (index === 4) {
        $('.tv_picture').attr("src", './images/mobile/three_4.png')
        videoIndex = 4
    }
    if (index === 5) {
        $('.tv_picture').attr("src", './images/mobile/three_5.png')
        videoIndex = 5
    }
    if (index === 6) {
        $('.tv_picture').attr("src", './images/mobile/three_6.png')
        videoIndex = 6
    }
}
// 点击目录事件
var text = false
function directoryChange(index) {
    var ph = $('.first_page').height()
    if (index === 1) {
        yunAnimate()
        setTimeout(() => {
            $('.begin_page').css('display', 'flex')
        }, 2000);

        scences = -1
    } else {
        setTimeout(() => {
            $('.begin_page').css('display', 'none')
        }, 2100);
    }
    if (index === 2) {
        resetFirstAnimate()
        yunAnimate()
        setTimeout(() => {
            $('.first_page').css('display', 'flex')
        }, 2000);
        firstAnimate()
        scences = 0
    } else {
        setTimeout(() => {
            $('.first_page').css('display', 'none')
        }, 2100);
    }
    if (index === 3) {
        if (mySw1) {
            mySwipers.destroy()
        }
        $('.introduce').css('display', 'none')
        yunAnimate()
        setTimeout(() => {
            $('.second_page').css('display', 'flex')
            setTimeout(() => {
                mySwiper1()
                $('.introduce').css('display', 'flex')
                $('.p3').css('display', 'none')
                $('.p1').css('display', 'block')
            }, 1000);
        }, 2000);
        scences = 1
    } else {
        setTimeout(() => {
            $('.second_page').css('display', 'none')
            mySwipers.destroy()
        }, 2100);
    }
    if (index === 4) {
        resetTvAnimate()
        yunAnimate()
        setTimeout(() => {
            $('.third_page').css('display', 'flex')
        }, 2000);
        tvAnimate()
        scences = 2
    } else {
        setTimeout(() => {
            $('.third_page').css('display', 'none')
        }, 2100);
    }
    if (index === 5) {
        resetRoleAnimate()
        yunAnimate()
        setTimeout(() => {
            $('.fourth_page').css('display', 'flex')
        }, 2000);
        roleIntroduce()
        scences = 3
    } else {
        setTimeout(() => {
            $('.fourth_page').css('display', 'none')
        }, 2100);
    }
    if (index === 6) {
        setTimeout(() => {
            $('.fifth_page').css('display', 'flex')
        }, 2000);
        yunAnimate()
        scences = 4
        $('.tishi_logo').css('display', 'none')
    } else {
        setTimeout(() => {
            $('.fifth_page').css('display', 'none')
        }, 2100);
    }
}
// 人物介绍飞入动画
var role = false
function roleIntroduce() {
    role = true
    setTimeout(() => {
        $('.role1').addClass('show animate__animated animate__bounceInLeft')
        setTimeout(() => {
            $('.role2').addClass('show animate__animated animate__bounceInLeft')
        }, 500);
        setTimeout(() => {
            $('.role3').addClass('show animate__animated animate__bounceInLeft')
        }, 1000);
        setTimeout(() => {
            $('.role4').addClass('show animate__animated animate__bounceInLeft')
        }, 1500);
        setTimeout(() => {
            $('.role5').addClass('show animate__animated animate__bounceInLeft')
        }, 2000);
        setTimeout(() => {
            $('.role6').addClass('show animate__animated animate__bounceInLeft')
        }, 2500);
        setTimeout(() => {
            $('.role7').addClass('show animate__animated animate__bounceInLeft')
        }, 3000);
    }, 2000);

}
// 重置人物介绍飞入动画
function resetRoleAnimate() {
    if (role) {
        $('.role1,.role2,.role3,.role4,.role5,.role6,.role7').removeClass('show')
        $('.role1,.role2,.role3,.role4,.role5,.role6,.role7').addClass('hidden')
    }
}
//云层渐入淡出动画
var yunMovie = true
function yunAnimate(e) {
    //禁止滚动
    yunMovie = false
    $('.container_box').addClass('out')
    $('.yun_box').css('display', 'flex')
    $('.yun_left').addClass('show animate__fadeInDown');
    $('.yun_right').addClass('show animate__fadeInUp');
    //收回目录
    $('.directory').removeClass('animate__slideInRight')
    $('.directory').addClass('animate__fadeOutRight ')
    $('.pull').css('display', 'block')
    setTimeout(() => {
        $('.yun_left').addClass('animate__fadeOutUp');
        $('.yun_right').addClass('animate__fadeOutDown');
        setTimeout(() => {
            $('.container_box').removeClass('out')
            yunMovie = true
            $('.yun_left').removeClass('show animate__fadeInDown');
            $('.yun_right').removeClass('show animate__fadeInUp');
            $('.yun_box').css('display', 'none')
            $('.yun_left').removeClass('animate__fadeOutUp');
            $('.yun_right').removeClass('animate__fadeOutDown');
        }, 1000);
    }, 2000);

}
//是否存在鼠标移入背景变量



function introChange(index) {
    if (index == 0) {
        mySwiper.slideTo(2)
        toOut('https://www.ptnet.cn/a/2022-01/04/content_2006722.html')
    }

    if (index == 1) {

        mySwiper.slideTo(3)
        toOut('https://www.ptnet.cn/a/2024-04/28/content_2075779.html')

    }
    if (index == 2) {

        mySwiper.slideTo(4)
        toOut('https://www.ptnet.cn/pl/2024-06/14/content_2079328.html')

    }
    if (index == 3) {
        mySwiper.slideTo(5)
        toOut('https://www.ptnet.cn/pl/2023-10/07/content_2061561.html')

    }
    if (index == 4) {

        mySwiper.slideTo(6)
        toOut('https://www.ptnet.cn/content/2022-08/05/content_2026022.html')

    } if (index == 5) {

        mySwiper.slideTo(7)
        toOut('https://www.ptnet.cn/a/2023-09/20/content_2060385.html')

    }

}

var startx, starty;
//获得角度
function getAngle(angx, angy) {
    return Math.atan2(angy, angx) * 180 / Math.PI;
};

//根据起点终点返回方向 1向上 2向下 3向左 4向右 0未滑动
function getDirection(startx, starty, endx, endy) {
    var angx = endx - startx;
    var angy = endy - starty;
    var result = 0;

    //如果滑动距离太短
    if (Math.abs(angx) < 2 && Math.abs(angy) < 2) {
        return result;
    }

    var angle = getAngle(angx, angy);
    if (angle >= -135 && angle <= -45) {
        result = 1;
    } else if (angle > 45 && angle < 135) {
        result = 2;
    } else if ((angle >= 135 && angle <= 180) || (angle >= -180 && angle < -135)) {
        result = 3;
    } else if (angle >= -45 && angle <= 45) {
        result = 4;
    }

    return result;
}


//手指接触屏幕
document.addEventListener("touchstart", function (e) {
    startx = e.touches[0].pageX;
    starty = e.touches[0].pageY;

}, false);

//手指离开屏幕
document.addEventListener("touchend", function (e) {

    var endx, endy;
    endx = e.changedTouches[0].pageX;
    endy = e.changedTouches[0].pageY;

    var direction = getDirection(startx, starty, endx, endy);
    switch (direction) {
        case 4:

            if (scences < 4 && yunMovie === true) {

                addScence()
            }
            break;
        case 3:

            if (scences > -1 && yunMovie === true) {

                delScence()
            }
            break;
        default:
    }
}, false);

//first_page动画
function firstAnimate() {
    setTimeout(() => {
        text = true
        $('.first_text').addClass('show animate__animated animate__backInDown ')
        $('.first_pictrue').addClass('show animate__animated animate__fadeInLeft animate__delay-1s')
    }, 2000);

}
//重置first_page动画
function resetFirstAnimate() {
    if (text) {
        $('.first_text').removeClass('show')
        $('.first_pictrue').removeClass('show')

        $('.first_text').addClass('hidden ')
        $('.first_pictrue').addClass('hidden')
    }
}
var scences = -1
function addScence() {
    var ph = $('.first_page').height()
    scences = scences + 1
    console.log(scences)
    if (scences == 0) {
        resetFirstAnimate()
        yunAnimate()
        setTimeout(() => {
            $('.begin_page').css('display', 'none')
            $('.first_page').css('display', 'flex')
        }, 2000);
        firstAnimate()
    } else {
        setTimeout(() => {
            $('.first_page').css('display', 'none')
        }, 2100);
    }
    if (scences == 1) {

        $('.introduce').css('display', 'none')
        yunAnimate()
        setTimeout(() => {
            mySwiper1()
            $('.second_page').css('display', 'flex')
            $('.introduce').css('display', 'flex')
            $('.p3').css('display', 'none')
            $('.p1').css('display', 'block')
        }, 2000);

    } else {
        setTimeout(() => {
            mySwipers.destroy()
            $('.second_page').css('display', 'none')
        }, 2100);
    }
    if (scences == 2) {
        resetTvAnimate()
        yunAnimate()
        setTimeout(() => {
            $('.third_page').css('display', 'flex')
        }, 2000);
        tvAnimate()
    } else {
        setTimeout(() => {
            $('.third_page').css('display', 'none')
        }, 2100);
    }
    if (scences == 3) {
        resetRoleAnimate()
        setTimeout(() => {
            $('.fourth_page').css('display', 'flex')
        }, 2000);

        yunAnimate()
        roleIntroduce()
    } else {
        setTimeout(() => {
            $('.fourth_page').css('display', 'none')
        }, 2100);
    }
    if (scences == 4) {
        yunAnimate()
        setTimeout(() => {
            $('.fifth_page').css('display', 'flex')
        }, 2000);
        $('.tishi_logo').css('display', 'none')
    } else {
        setTimeout(() => {
            $('.fifth_page').css('display', 'none')
            $('.tishi_logo').css('display', 'block')
        }, 2100);
    }
}
function delScence() {
    var ph = $('.first_page').height()
    scences = scences - 1
    if (scences == -1) {
        yunAnimate()
        setTimeout(() => {
            $('.begin_page').css('display', 'flex')
        }, 2000);
    } else {
        setTimeout(() => {
            $('.begin_page').css('display', 'none')
        }, 2100);
    }
    if (scences == 0) {
        resetFirstAnimate()
        yunAnimate()
        setTimeout(() => {
            $('.first_page').css('display', 'flex')
        }, 2000);
        firstAnimate()
    } else {
        setTimeout(() => {
            $('.first_page').css('display', 'none')
        }, 2100);
    }
    if (scences == 1) {

        $('.introduce').css('display', 'none')
        yunAnimate()
        setTimeout(() => {
            mySwiper1()
            $('.second_page').css('display', 'flex')
            $('.introduce').css('display', 'flex')
            $('.p3').css('display', 'none')
            $('.p1').css('display', 'block')
        }, 2000);

    } else {
        setTimeout(() => {
            mySwipers.destroy()
            $('.second_page').css('display', 'none')
        }, 2100);
    }
    if (scences == 2) {
        resetTvAnimate()
        yunAnimate()
        setTimeout(() => {
            $('.third_page').css('display', 'flex')
        }, 2000);
        tvAnimate()
    } else {
        setTimeout(() => {
            $('.third_page').css('display', 'none')
        }, 2100);
    }
    if (scences == 3) {
        resetRoleAnimate()
        setTimeout(() => {
            $('.fourth_page').css('display', 'flex')
        }, 2000);

        yunAnimate()
        roleIntroduce()
    } else {
        setTimeout(() => {
            $('.fourth_page').css('display', 'none')
        }, 2100);
    }
    if (scences == 4) {
        yunAnimate()
        setTimeout(() => {
            $('.fifth_page').css('display', 'flex')
        }, 2000);
        $('.tishi_logo').css('display', 'none')
    } else {
        setTimeout(() => {
            $('.fifth_page').css('display', 'none')
            $('.tishi_logo').css('display', 'block')
        }, 2100);
    }

}

// 电视动画
var tv = false
function tvAnimate() {
    tv = true
    setTimeout(() => {
        $('.tv_box').addClass('show animate__animated animate__zoomInLeft')
    }, 2000);

}
function resetTvAnimate() {
    if (tv) {
        $('.tv_box').removeClass('show')
        $('.tv_box').addClass('hidden')
    }
}
function textBg(index) {
    if (index === 1) {
        $('.text_box1').css('display', 'block')
    } else {
        $('.text_box1').css('display', 'none')
    }
}
textBg()

