|
@@ -0,0 +1,433 @@
|
|
|
+var userDown = false //用户鼠标判断
|
|
|
+var bgMove = false
|
|
|
+
|
|
|
+var indexPath = $('body').attr('data-path')
|
|
|
+
|
|
|
+var until = {
|
|
|
+ // 浮层动画
|
|
|
+ animateModal() {
|
|
|
+ var w = document.body.offsetWidth/2;
|
|
|
+ var h = document.body.offsetHeight/2;
|
|
|
+
|
|
|
+ var modal = document.getElementsByClassName('animate-wrap');
|
|
|
+ var $moveBg = $('.comment-page').find('.move-bg') //评论背景移动
|
|
|
+ var $fullBg = $('.mod-full-picture')
|
|
|
+
|
|
|
+ document.body.onmousedown = function (event) {
|
|
|
+ userDown = true
|
|
|
+ }
|
|
|
+ document.body.onmouseup = function (event) {
|
|
|
+ userDown = false
|
|
|
+ }
|
|
|
+ document.body.onmousemove = function (event) {
|
|
|
+ var mx = event.clientX,
|
|
|
+ my = event.clientY;
|
|
|
+ if(userDown) {
|
|
|
+ for (var i=0; i<modal.length; i++) {
|
|
|
+ modal[i].style.marginLeft=(w-mx)/60 +'px';
|
|
|
+ modal[i].style.marginTop=(h-my)/40 +'px';
|
|
|
+ }
|
|
|
+ }
|
|
|
+ if(bgMove) {
|
|
|
+ $moveBg.css({
|
|
|
+ 'backgroundPositionX': (w-mx)/120,
|
|
|
+ 'backgroundPositionY': (h-my)/80
|
|
|
+ })
|
|
|
+ }
|
|
|
+ $fullBg.css({
|
|
|
+ 'backgroundPositionX': (w-mx)/100,
|
|
|
+ 'backgroundPositionY': (h-my)/60
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ bgMove($item) {
|
|
|
+ var w = document.body.offsetWidth/2;
|
|
|
+ var h = document.body.offsetHeight/2;
|
|
|
+ document.body.onmousemove = function (event) {
|
|
|
+ var mx = event.clientX,
|
|
|
+ my = event.clientY;
|
|
|
+
|
|
|
+ $item.css({
|
|
|
+ 'backgroundPositionX': (w-mx)/100,
|
|
|
+ 'backgroundPositionY': (h-my)/60
|
|
|
+ })
|
|
|
+ }
|
|
|
+ },
|
|
|
+ handleModel() {
|
|
|
+ // 点击背景关闭弹窗
|
|
|
+ $(document).on('click', '.pub-modal-mask', function() {
|
|
|
+ until.pauseVideo()
|
|
|
+ $(this).fadeOut()
|
|
|
+ })
|
|
|
+ $(document).on('click', '.part-screen', function(e) {
|
|
|
+ return false
|
|
|
+ })
|
|
|
+ $(document).on('click', '.close-mask-icon', function() {
|
|
|
+ until.pauseVideo()
|
|
|
+ $(this).parents('.pub-modal-mask').fadeOut()
|
|
|
+ })
|
|
|
+ $(document).on('click', '.close-full-video', function() {
|
|
|
+ until.pauseVideo()
|
|
|
+ $(this).parents('.fullscreen-video').fadeOut()
|
|
|
+ })
|
|
|
+ $(document).on('click', '.close-icon', function() {
|
|
|
+ $(this).parents('.pub-modal').fadeOut()
|
|
|
+ })
|
|
|
+ $(document).on('click', '.go-back', function() {
|
|
|
+ $('.mod-full-picture').fadeOut()
|
|
|
+ })
|
|
|
+ },
|
|
|
+ pauseVideo() {
|
|
|
+ // video暂停播放
|
|
|
+ var videoDom = document.getElementsByTagName('video')
|
|
|
+ for(let i = 0; i < videoDom.length; i++) {
|
|
|
+ videoDom[i].pause()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ decr(r) {
|
|
|
+ var e = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789@!~*-_.()'".split("");
|
|
|
+ var n = [];
|
|
|
+ var a = [];
|
|
|
+ r.split("").reverse().forEach(function (r, t) {
|
|
|
+ var o = e.indexOf(r);
|
|
|
+ if (parseInt((t + 1) % 2) == 1) {
|
|
|
+ a.push(o)
|
|
|
+ } else {
|
|
|
+ var p = parseInt(o - a[(t + 1) / 2 - 1]);
|
|
|
+ n.push(e[p])
|
|
|
+ }
|
|
|
+ });
|
|
|
+ var t = n.join("").replace(/@/g, "%");
|
|
|
+ return decodeURIComponent(t)
|
|
|
+ },
|
|
|
+ /**
|
|
|
+ * 解密数据
|
|
|
+ */
|
|
|
+ deCodeArg(target) {
|
|
|
+ var srcMap = {};
|
|
|
+ if (JSON.parse) {
|
|
|
+ srcMap = JSON.parse(until.decr(target));
|
|
|
+ } else {
|
|
|
+ srcMap = eval('(' + until.decr(target) + ')');
|
|
|
+ }
|
|
|
+ return srcMap;
|
|
|
+ },
|
|
|
+ //立即预约
|
|
|
+ bookClick() {
|
|
|
+ function bookAnimate() {
|
|
|
+ $('.book-modal-1').removeClass('fade-in').addClass('bounceInLeft')
|
|
|
+ $('.book-modal-2').removeClass('fade-in').addClass('bounceInRight')
|
|
|
+ $('.poster-wrapper').removeClass('fade-in').addClass('bounceInUp')
|
|
|
+ $('.bear').removeClass('fade-in').addClass('bounceInLeft')
|
|
|
+ $('.deer').removeClass('fade-in').addClass('bounceInRight')
|
|
|
+ }
|
|
|
+
|
|
|
+ $('.book-icon').click(function() {
|
|
|
+ $('.page-comment').hide()
|
|
|
+ $('.page-book').show()
|
|
|
+ $('.mod-btn').removeClass('active')
|
|
|
+ $('.book-btn').addClass('active')
|
|
|
+ $('.comment-page').fadeIn()
|
|
|
+ bookAnimate()
|
|
|
+
|
|
|
+ bgMove= true
|
|
|
+ })
|
|
|
+ // 返回
|
|
|
+ $('#book-gack-btn').click(function() {
|
|
|
+ $('.comment-page').fadeOut()
|
|
|
+ bgMove = false
|
|
|
+ })
|
|
|
+
|
|
|
+ // 切换评论页
|
|
|
+ $('.book-header').find('.mod-btn').click(function() {
|
|
|
+ var $this = $(this)
|
|
|
+ $('.mod-btn').removeClass('active')
|
|
|
+ $this.addClass('active')
|
|
|
+ var tab = $this.attr('data-tab')
|
|
|
+ if(tab == 'comment') {
|
|
|
+ $('.page-book').hide()
|
|
|
+ $('.page-comment').show()
|
|
|
+ } else if(tab == 'book') {
|
|
|
+ bookAnimate()
|
|
|
+ $('.page-comment').hide()
|
|
|
+ $('.page-book').show()
|
|
|
+ }
|
|
|
+ })
|
|
|
+
|
|
|
+ // 预约成功
|
|
|
+ var successModal = `<div class="progress-modal reset-modal book-success-modal" style="display: block;">
|
|
|
+ <p class="tips">预约成功!</p>
|
|
|
+ <div class="btn-wrap">
|
|
|
+ <div class="btn success-btn book-success-btn">是</div>
|
|
|
+ </div>
|
|
|
+ </div>`
|
|
|
+ $('.book-btn-bottom').click(function() {
|
|
|
+ $('.comment-page').append(successModal)
|
|
|
+ })
|
|
|
+ $('.comment-page').on('click', '.book-success-btn', function() {
|
|
|
+ $('.book-success-modal').remove()
|
|
|
+ })
|
|
|
+
|
|
|
+ // 视频播放
|
|
|
+ $('.poster-lake').click(function() {
|
|
|
+ $('.book-video').hide()
|
|
|
+ $('#book-video-wrapper').show()
|
|
|
+ $('#book-lake-video').show()
|
|
|
+ document.getElementById('book-lake-video').play()
|
|
|
+ })
|
|
|
+ $('.poster-taiga').click(function() {
|
|
|
+ $('.book-video').hide()
|
|
|
+ $('#book-video-wrapper').show()
|
|
|
+ $('#book-taiga-video').show()
|
|
|
+ document.getElementById('book-taiga-video').play()
|
|
|
+ })
|
|
|
+ $('.poster-elden').click(function() {
|
|
|
+ $('.book-video').hide()
|
|
|
+ $('#book-video-wrapper').show()
|
|
|
+ $('#book-elden-video').show()
|
|
|
+ document.getElementById('book-elden-video').play()
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 右上角工具栏
|
|
|
+ toolbarClick() {
|
|
|
+ // 暂停
|
|
|
+ $('.toolbar-box').find('.bgm-icon').click(function() {
|
|
|
+ var $this = $(this)
|
|
|
+ var audio = document.getElementById('bgm-audio')
|
|
|
+ if($this.hasClass('pause')) {
|
|
|
+ audio.play()
|
|
|
+ $this.removeClass('pause')
|
|
|
+ } else {
|
|
|
+ audio.pause()
|
|
|
+ $this.addClass('pause')
|
|
|
+ }
|
|
|
+ })
|
|
|
+
|
|
|
+ // 评论
|
|
|
+ $('.toolbar-box').find('.comment-icon').click(function() {
|
|
|
+ $('.comment-btn').trigger('click')
|
|
|
+ $('.comment-page').fadeIn()
|
|
|
+ bgMove = true
|
|
|
+ })
|
|
|
+
|
|
|
+ // 重置进度
|
|
|
+ $('.toolbar-box').find('.reset-icon').click(function() {
|
|
|
+ $('.reset-modal').fadeIn()
|
|
|
+ })
|
|
|
+
|
|
|
+ $('.yes-btn').click(function() {
|
|
|
+ localStorage.removeItem('hunter_permision')
|
|
|
+ localStorage.removeItem('entry')
|
|
|
+ window.location.href = indexPath
|
|
|
+ })
|
|
|
+
|
|
|
+ $('.no-btn').click(function() {
|
|
|
+ $('.reset-modal').fadeOut()
|
|
|
+ })
|
|
|
+ },
|
|
|
+ //确认装备
|
|
|
+ shooting() {
|
|
|
+
|
|
|
+ var step = 1 //步骤
|
|
|
+ var stepB = 1
|
|
|
+
|
|
|
+ var openVideo = document.getElementById('open-video')
|
|
|
+ var aimVideo = document.getElementById('aim-video')
|
|
|
+ var shootVideo = document.getElementById('shoot-video')
|
|
|
+
|
|
|
+ var openVideoB = document.getElementById('open-video-b')
|
|
|
+ var aimVideoB = document.getElementById('aim-video-b')
|
|
|
+ var shootVideoB = document.getElementById('shoot-video-b')
|
|
|
+
|
|
|
+ openVideo.addEventListener("ended",openVideoEnd)
|
|
|
+ aimVideo.addEventListener("ended",aimVideoEnd)
|
|
|
+ shootVideo.addEventListener("ended",shootVideoEnd)
|
|
|
+
|
|
|
+ openVideoB.addEventListener("ended",openVideoEndB)
|
|
|
+ aimVideoB.addEventListener("ended",aimVideoEndB)
|
|
|
+ shootVideoB.addEventListener("ended",shootVideoEndB)
|
|
|
+
|
|
|
+ var bag
|
|
|
+
|
|
|
+ $('.start-equit-btn').click(function() {
|
|
|
+
|
|
|
+ bag = $('#equit-modal').attr('data-bag')
|
|
|
+ if(bag == 'A') {
|
|
|
+ $('.group-A').show()
|
|
|
+ $('.group-B').hide()
|
|
|
+ }
|
|
|
+ if(bag == 'B') {
|
|
|
+ $('.group-B').show()
|
|
|
+ $('.group-A').hide()
|
|
|
+ }
|
|
|
+
|
|
|
+ $('#equit-video-wrap').fadeIn()
|
|
|
+
|
|
|
+ if(stepB == 1 && bag == 'B') {
|
|
|
+ openVideoB.play()
|
|
|
+ }
|
|
|
+
|
|
|
+ })
|
|
|
+
|
|
|
+ function openVideoEnd() {
|
|
|
+ if(step == 1) {
|
|
|
+ $(openVideo).hide();
|
|
|
+ $(aimVideo).show();
|
|
|
+ $('.space-tips').show()
|
|
|
+ }
|
|
|
+ step = 2
|
|
|
+ }
|
|
|
+
|
|
|
+ function aimVideoEnd() {
|
|
|
+ if(step == 2) {
|
|
|
+ $(aimVideo).hide();
|
|
|
+ $(shootVideo).show();
|
|
|
+ $('.space-tips').hide();
|
|
|
+ $('.open-qiang-tips').show()
|
|
|
+ }
|
|
|
+ step = 3
|
|
|
+ }
|
|
|
+
|
|
|
+ function shootVideoEnd() {
|
|
|
+ $('.equit-success-a').fadeIn()
|
|
|
+ document.getElementById('hunter-audio').play()
|
|
|
+ }
|
|
|
+
|
|
|
+ function openVideoEndB() {
|
|
|
+ if(stepB == 1) {
|
|
|
+ $(openVideoB).hide();
|
|
|
+ $(aimVideoB).show();
|
|
|
+ $('.space-tips-B').show()
|
|
|
+ }
|
|
|
+ stepB = 2
|
|
|
+ }
|
|
|
+
|
|
|
+ function aimVideoEndB() {
|
|
|
+ if(stepB == 2) {
|
|
|
+ $(aimVideoB).hide();
|
|
|
+ $(shootVideoB).show();
|
|
|
+ $('.space-tips-B').hide();
|
|
|
+ $('.open-qiang-tips-B').show()
|
|
|
+ }
|
|
|
+ stepB = 3
|
|
|
+ }
|
|
|
+
|
|
|
+ function shootVideoEndB() {
|
|
|
+ $('.equit-success-b').fadeIn()
|
|
|
+ document.getElementById('hunter-audio').play()
|
|
|
+ }
|
|
|
+
|
|
|
+ $('.close-equit-a').click(function() {
|
|
|
+ $('#equit-video-wrap').hide()
|
|
|
+ $('.equit-success').hide()
|
|
|
+ $('.open-jin-tips').show()
|
|
|
+ $('#equit-modal').hide()
|
|
|
+ $(openVideo).show()
|
|
|
+ $(shootVideo).hide()
|
|
|
+ openVideo.currentTime = 0
|
|
|
+ aimVideo.currentTime = 0
|
|
|
+ shootVideo.currentTime = 0
|
|
|
+ step = 1
|
|
|
+ })
|
|
|
+
|
|
|
+ $('.close-equit-b').click(function() {
|
|
|
+ $('#equit-video-wrap').hide()
|
|
|
+ $('.equit-success').hide()
|
|
|
+ $('#equit-modal').hide()
|
|
|
+ $(openVideoB).show()
|
|
|
+ $(shootVideoB).hide()
|
|
|
+ openVideoB.currentTime = 0
|
|
|
+ aimVideoB.currentTime = 0
|
|
|
+ shootVideoB.currentTime = 0
|
|
|
+ stepB = 1
|
|
|
+ })
|
|
|
+
|
|
|
+ $(document).on('keyup', function(e) {
|
|
|
+ var isShow = $('#equit-video-wrap').css('display') == 'none' ? false : true
|
|
|
+ if(isShow) {
|
|
|
+ if(e.keyCode == 70 && step == 1 && bag == 'A'){
|
|
|
+ $('.open-jin-tips').hide()
|
|
|
+ openVideo.play()
|
|
|
+ }
|
|
|
+ if(e.keyCode == 32 && step == 2 && bag == 'A'){
|
|
|
+ $('.space-tips').show()
|
|
|
+ aimVideo.pause()
|
|
|
+ }
|
|
|
+ if(e.keyCode == 70 && step == 3 && bag == 'A'){
|
|
|
+ $('.open-qiang-tips').hide()
|
|
|
+ shootVideo.play()
|
|
|
+ }
|
|
|
+
|
|
|
+ if(e.keyCode == 32 && stepB == 2 && bag == 'B'){
|
|
|
+ $('.space-tips-B').show()
|
|
|
+ aimVideoB.pause()
|
|
|
+ }
|
|
|
+ if(e.keyCode == 70 && stepB == 3 && bag == 'B'){
|
|
|
+ $('.open-qiang-tips-B').hide()
|
|
|
+ shootVideoB.play()
|
|
|
+ }
|
|
|
+ }
|
|
|
+ // console.log(step)
|
|
|
+ })
|
|
|
+
|
|
|
+ $(document).on('keydown', function(e) {
|
|
|
+ if(e.keyCode == 32 && step == 2 && bag == 'A'){
|
|
|
+ $('.space-tips').hide()
|
|
|
+ aimVideo.play()
|
|
|
+ }
|
|
|
+ if(e.keyCode == 32 && stepB == 2 && bag == 'B'){
|
|
|
+ $('.space-tips-B').hide()
|
|
|
+ aimVideoB.play()
|
|
|
+ }
|
|
|
+ })
|
|
|
+
|
|
|
+ // 开始狩猎
|
|
|
+ $('.hunt-btn').click(function(){
|
|
|
+ $('.big-modal').hide()
|
|
|
+ $('#equit-modal').show()
|
|
|
+ })
|
|
|
+
|
|
|
+ $('.nav-item-wrap').click(function() {
|
|
|
+ $('.nav-item-wrap').removeClass('active')
|
|
|
+ $(this).parents('.container').find('.main').hide()
|
|
|
+ $(this).addClass('active')
|
|
|
+ var ind = $(this).attr('data-ind')
|
|
|
+ var bag = $('#equit-modal').attr('data-bag')
|
|
|
+
|
|
|
+ if(ind == 1 && bag == 'A'){
|
|
|
+ $('#weapon-modal').show()
|
|
|
+ }
|
|
|
+ if(ind == 2 && bag == 'A'){
|
|
|
+ $('#fodder-modal').show()
|
|
|
+ }
|
|
|
+ if(ind == 1 && bag == 'B'){
|
|
|
+ $('#weapon-modal-b').show()
|
|
|
+ }
|
|
|
+ if(ind == 2 && bag == 'B'){
|
|
|
+ $('#fodder-modal-b').show()
|
|
|
+ }
|
|
|
+ })
|
|
|
+
|
|
|
+ $('.bag-a').click(function() {
|
|
|
+ var $this = $(this)
|
|
|
+ if(!$this.hasClass('bag-a-active')) {
|
|
|
+ $this.addClass('bag-a-active')
|
|
|
+ $('.bag-b').removeClass('bag-b-active')
|
|
|
+ $('#equit-modal').attr('data-bag', 'A')
|
|
|
+ $('.nav-item-wrap').eq(0).trigger('click')
|
|
|
+ }
|
|
|
+ })
|
|
|
+
|
|
|
+ $('.bag-b').click(function() {
|
|
|
+ var $this = $(this)
|
|
|
+ if(!$this.hasClass('bag-b-active')) {
|
|
|
+ $this.addClass('bag-b-active')
|
|
|
+ $('.bag-a').removeClass('bag-a-active')
|
|
|
+ $('#equit-modal').attr('data-bag', 'B')
|
|
|
+ $('.nav-item-wrap').eq(0).trigger('click')
|
|
|
+ }
|
|
|
+ })
|
|
|
+ },
|
|
|
+}
|
|
|
+
|
|
|
+export default until
|