master

分支 (1)

管理

管理

master

qieqie
/
main-mobile.js

var config = {} // 首页配置
var outPostName = '' // 选中的关卡
var draggerOn = true // 拖拽事件锁
var startGameDetail = {} // 用户信息详情
var gameStartSwiper
var gameRecord = {} // 当前游戏信息
var btnRuledialog = false //用于区分规则弹框

const loadingStep = loadingInit()

// 载入画面 进度控制
function loadingInit() {
  const total = 7
  let num = 0
  return function () {
    num++
    $('#laiqie .bar').css({ width: `${num * 100 / total}%` })
    if (num === total) {
      $('#laiqie .loading').fadeOut(200)
      // $('#extra').css('background', '#000')
    }
  }
}

// 初始化首页配置 载入产品图片
function configInit () {
  const login = http('/api-game/userInfo/game/login', { gameId: 1 }).then(
    res => {
      loadingStep()
      config.user = res
    }
  )

  const homeList = http('/api-game/config/home/info').then(
    res => {
      loadingStep()
      config.homeList = res.homeList

      const imgList = []
      config.homeList.forEach(item => {
        imgList.push({ item, url: item.outPostInnerImgUrl })
        imgList.push({ item: null, url: item.outPostOutImgUrl })
        item.configList.forEach(v => {
          imgList.push({ item: v, url: v.imgUrl })
          imgList.push({ item: null, url: v.leftImgUrl })
          imgList.push({ item: null, url: v.rightImgUrl })
        })
      })
      return Promise.all(imgList.map(url => loadImg(url)))
    }
  ).then(
    () => {
      loadingStep()
    }
  )

  const payment = http('/api-game/config/recharge/info', { gameId: 1 }).then(
    res => {
      loadingStep()
      config.payment = {
        amount: res.amount,
        chance: res.chance
      }
    }
  )

  const rules = http('/api-cosmetics-lanfu/marketMessage/queryPlatformConfigOne', { configModule: '游戏支付规则', configName: 1, type:3 }).then(
    res => {
      loadingStep()
      $('.payment-dialog .txt').html(res[0].configValue)
      $('.payment-dialog .MsoNormal').html()
    }
  )

  return Promise.all([login, homeList, payment, rules, getUserDetail(true)])
}

// 获取用户信息详情
function getUserDetail (init) {
  return http('/api-game/gameInfo/gameUserInfo', { gameId: 1 }).then(
    res => {
      if (init) loadingStep()
      config.userDetail = res
      $('#laiqie .account img').attr('src', config.userDetail.userImg)
      $('#laiqie .account .f-22').text(config.userDetail.nickName)
      $('#laiqie .account .f-20 span').text(config.userDetail.id)
      $('#laiqie .scores .mine span').text(config.userDetail.highestInHistory)
      $('#laiqie .scores .now span').text(config.userDetail.currentHighestScore)
    }
  )
}

// 游戏主页 额外信息展示
function showHome () {
  $('#laiqie .account').fadeIn(200)
  $('#laiqie .scores').fadeIn(200)
  $('#laiqie .home-btns').fadeIn(200)
}

// 游戏主页 额外信息隐藏
function hideHome () {
  $('#laiqie .account').fadeOut(200)
  $('#laiqie .scores').fadeOut(200)
  $('#laiqie .home-btns').fadeOut(200)
}

// 初始化 按钮绑定之类的
function init () {
  $('#laiqie > .account').on('click', function (e) {
    // 点击头像的事件
    $('#myInfo-dialog').show()
    draggerOn = false
  })

  $('#laiqie .home-btns').children().on('click', function (e) {
    // 点击右侧四个按钮的事件
    // console.log(e)
  })

  // 开始游戏 返回按钮
  $('#laiqie .game-start .exit').on('click', function () {
    sence.switchSence('home-menu')
  })

  // 开始游戏按钮 绑定事件
  $('#laiqie .game-start .start-btn').on('click', function () {
    gameRecord = {}
    http('/api-game/gamession/start/game', {
      gameId: 1
    }).then(res => {
      gameRecord.gameRecordId = res.gameRecordId
      gameRecord.score = 0
      draggerOn = true
      $('#laiqie .game-start').fadeOut(200)
      sence.switchSence('game-body')
    }).catch(
      err => {
        if (err.code === -2) {
          sence.switchSence('start-body')
          $('#laiqie .game-start .rest-life-btn').click()
        }
      }
    )
  })

  // 点击游戏结束的返回按钮
  $('#laiqie .game-over .exit').on('click', function () {
    $('.bg-cover').fadeOut(200)
    $('#laiqie .game-over').fadeOut(200)
    // changeState( "click-enable" ).on()
    // document.body.click()
    sence.switchSence('start-body')
  })

  // 点击游戏结束的继续按钮
  $('#laiqie .game-over .continue-btn').on('click', function () {
    $('.bg-cover').fadeOut(200)
    $('#laiqie .game-over').fadeOut(200)
    sence.switchSence('continue-body')
  })

  // 支付 开启
  $('#laiqie .game-start .rest-life-btn').on('click', function () {
    const val = Number($(".payment-dialog .num").val())
    const chance = config.payment.chance
    const total = val * chance;
    $('.payment-dialog .total').html(`${val} × ${chance} = ${total}`)
    $(".payment-dialog .num").val(1)
    $(".payment-dialog").fadeIn(200)
  })

  // 支付 取消 和 关闭
  function closePay () {
    $(".payment-dialog").fadeOut(200).children('.num').val(1)
  }
  $('.payment-dialog .cancel').on('click', closePay)
  $('.payment-dialog .closeBtn').on('click', closePay)

  // 支付 输入
  $(".payment-dialog .num").on('input', function () {
    const val = Number($(this).val())
    const chance = config.payment.chance
    const total = val * chance;
    $('.payment-dialog .total').html(`${val} × ${chance} = ${total}`)
  })

  // 支付 加1
  $('.payment-dialog .right-btn').on('click', function () {
    const chance = config.payment.chance
    let val = Number($(".payment-dialog .num").val())
    val++
    let total = val * chance;
    $(".payment-dialog .num").val(val);
    $('.payment-dialog .total').html(`${val} × ${chance} = ${total}`)
  })

  // 支付 减1
  $('.payment-dialog .left-btn').on('click', function () {
    const chance = config.payment.chance
    let val = Number($(".payment-dialog .num").val())
    if (val === 1) return
    val--
    let total = val * chance;
    $(".payment-dialog .num").val(val);
    $('.payment-dialog .total').html(`${val} × ${chance} = ${total}`)
  })

  // 调起支付
  $('.payment-dialog .confirm').on('click', function () {
    if (window.__wxjs_environment !== 'miniprogram') {
      alert('不在小程序环境内')
      return
    }
    const btn = $(this)
    const number = $(".payment-dialog .num").val()
    const amount = config.payment.amount
    btn.addClass('pen')
    http('/api-game/gameOrder/create', {
      gameId: 1,
      number,
      payAmout: amount * number,
      price: amount
    }).then(
      id => {
        wx.miniProgram.navigateTo({ url: `/subPage/other/pages/wxpayH5/index?id=${id}` })
        alert('请在小程序内完成支付')
        return http('/api-game/gameInfo/gameStart', {
          gameId: 1,
          name: outPostName
        })
      }
    ).then(
      res => {
        startGameDetail.sessions = res.sessions
        $('#laiqie .game-start .rank .rest').text(res.sessions.total)
        $('#laiqie .game-start .rest-life-btn .num').text(res.sessions.surplus)
        $('#laiqie .game-start .rest-life-btn .total').text(res.sessions.count)
        closePay()
      }
    ).finally(
      () => {
        btn.removeClass('pen')
      }
    )
  })

  // 初始化配置 载入游戏主程
  configInit().then(() => {
    startModule("scripts/main")
  })
}

// 打开开始游戏画面时调用
function showStartGame() {
  draggerOn = false
  return http('/api-game/gameInfo/gameStart', {
    gameId: 1,
    name: outPostName
  }).then(
    res => {
      startGameDetail = { index: 0, ...res, list: [] }
      $('#laiqie .game-start .left .title').text(res.checkpoint.name)
      $('#laiqie .game-start .left .guanqia-cover img').attr('src', res.checkpoint.imgUrl)
      $('#laiqie .game-start .start-btn img').attr('src', res.checkpoint.imgUrl)
      $('#laiqie .game-start .swiper-wrapper').html('')
      let list = [...startGameDetail.recommendList]
      for (let i = 0; i < 4; i++) {
        if (list.length) {
          const index = Math.floor(Math.random() * list.length)
          const item = list.splice(index, 1)[0]
          $('#laiqie .game-start .swiper-wrapper').append(`
                                    <div class="item fr ac swiper-slide">
                                        <div class="img-cover fr ac jc pen">
                                            <img src="${item.imgUrl}">
                                        </div>
                                        <div class="f1 pen" style="overflow: hidden;">
                                            <div class="name">${item.name}</div>
                                            <div class="value fr ac">
                                                <span>${item.score}</span>
                                                <img src="images/laiqie/start_game_coin.png">
                                            </div>
                                        </div>
                                    </div>
          `)
        }
      }
      $('#laiqie .game-start .rank .rest').text(res.sessions.total)
      $('#laiqie .game-start .rest-life-btn .num').text(res.sessions.surplus)
      $('#laiqie .game-start .rest-life-btn .total').text(res.sessions.count)
      return http('/api-game/gameInfo/rankingList', {
        gameId: 1,
        state: 1,
        page: 1,
        rows: 5
      })
    }
  ).then(
    res => {
      $('#laiqie .game-start .rank .item').each(function (i) {
        const item = $(this)
        if (!res[i]) {
          item.hide()
          return
        }
        item.show()
        item.children('.item-account').attr('src', res[i].userImg)
        item.children('.name').text(res[i].userName)
        item.children('.value').text(res[i].score)
      })
      $('.bg-cover').fadeIn(200)
      $('#laiqie .game-start').fadeIn(200)
      gameStartSwiper = new Swiper ('.swiper-container', {
        loop: true, // 循环模式选项
          // 如果需要分页器
        pagination: {
          el: '.swiper-pagination',
          renderBullet (i, c) {
            return `<div class="${c} dot"></div>`
          }
        },
        // 如果需要前进后退按钮
        navigation: {
          nextEl: '.right-btn',
          prevEl: '.left-btn',
        },
        autoplay: {
          delay: 2000,//2秒切换一次
        }
      })
    }
  )
}


// 游戏结束时 显示游戏结束画面
function showGameOver () {
  return http('/api-game/gamession/end/game', gameRecord).then(
    res => {
      $('#laiqie .game-over .score .num span').text(gameRecord.score)
      $('#laiqie .game-over .high-score .num').text(res.bestScore)
      $('#laiqie .game-over .rest .life').text(res.surplus)
      $('#laiqie .game-over .bottom .num').text(res.games)

      return getUserDetail()
    }
  ).then(
    () => {
      $('.bg-cover').fadeIn(200)
      $('#laiqie .game-over').fadeIn(200)
    }
  )
}

function toDetail (data) {
  if (window.__wxjs_environment !== 'miniprogram') {
    alert('不在小程序环境内')
    return
  }
  wx.miniProgram.navigateTo({ url: `pages/ticket/ticket` })
}

$('.goback').on('click', function (e) {
  $('#myInfo-dialog').fadeOut(200)
  draggerOn = true
})

$('#btn-duihuan').on('click', function (e) {
  draggerOn = false
  // exchangeShow()
  $('#myInfo-dialog .myInfo_tabs li:nth-child(3)').click()
  $('#myInfo-dialog').show()
})

$('#btn-rule').on('click', function (e) {
  draggerOn = false
  ruleShow()
})

$('#btn-rank').on('click', function (e) {
  draggerOn = false
  rankShow()
})

$('#btn-store').on('click', function (e) {
  if (window.__wxjs_environment !== 'miniprogram') {
    alert('不在小程序环境内')
    return
  }
  wx.miniProgram.navigateTo({ url: `pages/category/category` })
})

createDom(0)
var goodsList;   //兑换列表
var goodTabsList;   //兑换tab列表
var count = 0;   //左右步数
//tabs切换
$('#myInfo-dialog .myInfo_tabs li').on('click', function (e) {
  $(this).addClass('tabs_active');
  $(this).siblings().removeClass('tabs_active');
  let idx = $(this).index() - 1;
  $('#myInfo-dialog .panel>div').eq(idx).addClass('panel_item_active');
  $('#myInfo-dialog .panel>div').eq(idx).siblings().removeClass('panel_item_active');

  if ($(`#myInfo-dialog .panel_item_${idx + 1}`).length > 0) {
    $(`#myInfo-dialog .panel_item_${idx + 1}`).empty()
  }
  createDom(idx)
})

try {
  init()
} catch (e) {
  alert(e)
}