game-sdk/public/static/h5wap/js/my_personal.js

$(function() {
  var needToLogin = urlParse('need_to_login')
  if (needToLogin == 1) {
    HuoUtils.switchTemplate('login')
  }
  window.redirectUrl = decodeURIComponent(urlParse('redirect_url'))

  //弹窗
  var $login_icon = $('.login_icon');
  var $register = $('.register');
  var $toLogin = $('.toLogin');
  var $toAccountRegister = $('.toAccountRegister')
  var $toPhoneRegister = $('.toPhoneRegister')

  var $gameLogin = $('.gameLogin')
  var $accountRegister = $('.accountRegister')

  $login_icon.on('click', function(){
    initPop();
    $register.show()
  });
  $toLogin.on('click', function(){
    initPop();
    $gameLogin.show()
  })
  $toPhoneRegister.on('click', function(){
    initPop()
    $register.show()
  })
  $toAccountRegister.on('click', function(){
    initPop()
    $accountRegister.show()
  })

  var $forgetPassword = $('.forgetPassword')
  var $findPassword1 = $('.findPassword1')
  var $findPassword2 = $('.findPassword2')
  var $nextFindPassword = $('.nextFindPassword')
  $forgetPassword.on('click', function(){
    initPop()
    $findPassword1.show()
  })
  $nextFindPassword.on('click',function(){
    initPop()
    $findPassword2.show()
  })

  //初始化弹窗
  function initPop(){
    $accountRegister.hide()
    $gameLogin.hide()
    $register.hide()
    $findPassword1.hide()
    $findPassword2.hide()
  }

  // 积分tab切换
  $('.jifenjilu_tab__p').click(function () {
    $(this).addClass('tabSelect').siblings().removeClass('tabSelect')
    $('.jiluList').eq($(this).index()).removeClass('hidden').siblings('.jiluList').addClass('hidden')

    huoScrollMore()
  })

  // 首页新开服，开服提醒tab切换
  $('.xinfuTab_item__list').on('click', function () {
    $(this).addClass('activitySelected').siblings().removeClass('activitySelected')
    $('.runCoolKid').eq($(this).index()).show().siblings('.runCoolKid').hide()

    huoScrollMore()
  })

  // 首页：热门，新上架，活动，新开服Tab切换
  $('.hotTabBox_item').on('click', function () {
    $('.shadowScroll').scrollTop(0)
    $(this).addClass('tabBox_selected').siblings().removeClass('tabBox_selected')
    $('.game_content').eq($(this).index()).show().siblings('.game_content').hide()
    localStorage.setItem('tabIndex', $(this).index())
    huoScrollMore()
  })

  // 首页-活动:活动，有奖，公告Tab切换
  $('.activityTab_item__list').on('click', function () {
    // $(this).addClass('activitySelected').siblings().removeClass('activitySelected')
    $('.noMore2').hide()
    $('.activity_content').eq($(this).index()).show().siblings('.activity_content').hide()

    huoScrollMore()
  })

  // 礼包
  $(document).on('click', '.getMore', function(e){
    var $target = $(e.currentTarget).parent().find('.giftList_others')

    var high = $target.find('li').length * 96;
    if($target.css("height") == high + "px"){
      $target.animate({"height": "0px"})
    }else{
      $target.animate({"height": high + "px"})
    }
    var $sq = $(e.currentTarget).find('.shouqi')
    if ($sq.text() === '收起') {
      $sq.text('查看更多礼包')
      $(this).find('img').attr({src : $('#staticSite').val() + "/h5wap/images/icon_denglu_xialaanniu.png"})
    } else {
      $sq.text('收起')
      $(this).find('img').attr({src : $('#staticSite').val() + "/h5wap/images/icon_xiangshang.png"})
    }
  })

  // 礼包查看
  $(document).on('click', '[giftcode]', function () {
    var code = $(this).attr('giftcode')
    $('.getSucess_p2__code').html(code)
    $('.getSucess').show().css('z-index', 2001)
  })

  // 复制
  $(document).on('click', '.getSucessBox_p4:not(.noCopy)', function () {
    //复制礼包码
    var $text = $('.getSucess_p2__code').html()
    var input = document.createElement('input')
    input.setAttribute('readonly', 'readonly');
    input.setAttribute('value', $text );
    document.body.appendChild(input)
    input.select()
    input.setSelectionRange(0, 9999)
    if (document.execCommand('copy')) {
      document.execCommand('copy')
    }
    document.body.removeChild(input)
    $('.fuzhiSucess').css({'display': 'block', 'z-index': 2001}).html('复制成功')
    $('.getSucess').hide()
    setTimeout(function(){
      $(".fuzhiSucess").hide()
    },1000)
  })

  //积分商城：虚拟产品与实物产品tab切换
  var $product_real = $(".product_real")
  var $product_virtual = $(".product_virtual")
  var $realProductList = $(".realProductList")
  var $virtualProductList =$(".virtualProductList")
  function initProduct(){
    $product_real.removeClass("product_selected")
    $product_virtual.removeClass("product_selected")
    $realProductList.hide()
    $virtualProductList.hide()
  }
  $product_real.on('click', function(e){
    initProduct()
    $(e.currentTarget).addClass("product_selected")
    $realProductList.show()
  })
  $product_virtual.on('click', function(e){
    initProduct()
    $(e.currentTarget).addClass("product_selected")
    $virtualProductList.show()
  })
  //游戏详情页
  $('.detailsContainer_content').scroll( function() {
    var scrollLength = $('.detailsContainer_content').scrollTop()
    if (scrollLength >= 17) {
      $('.detailsContainer .overScroll').css({"padding-top":"0"})
    } else if (scrollLength === 0) {
      $('.detailsContainer .overScroll').css({"padding-top":"16px"})
    }
  });
  // 绑定游戏详情悬浮窗关闭事件
  $(document).on('click', '.gameShare_close', function () {
    $('.detailsContainer').animate({'height': '0px'}, 500)
    $('.shadow').animate({'height': '100%'}, 500, function(){
      $('#gameDetail').hide().html('').removeAttr('open')
    })
  })

  $(document).on('click', '.ui-checked', function () {
    $(this).attr('select', +$(this).attr('select') == '1' ? '2' : '1')
  })

  $(document).on('click', '[stopPropagation]', function (e) {
    e.stopPropagation()
  })

  // 积分商城签到
  var $jifenqiandao = $('.jifenqiandao')
  var $jifenqiandao_btn = $('.jifenqiandao_btn')
  $jifenqiandao_btn.on('click', function () {
    $jifenqiandao.hide()
    location.reload()
  })


  //轮播图
  //轮播图样式随窗口变化而变化
  var $width
  function change(){
    $width = $(window).width()
    if($width<750){
      $(".banner").css({"width": $width+"px","margin":"0","padding":"0","overflow":"hidden","position":"relative"})
      $(".bannerBox").css({"width": $('.bannerBox_list').length*$width+"px","margin":"0","padding":"0","overflow":"hidden","position":"relative"})
      $(".bannerBox_list").css({"width": $width+"px"})
    }else{
      var width = parseInt($('.wrap').css("width"))
      $(".banner").css({"width": width+"px","margin":"0","padding":"0","overflow":"hidden","position":"relative"})
      $(".bannerBox").css({"width": $('.bannerBox_list').length*width+"px","margin":"0","padding":"0","overflow":"hidden","position":"relative"})
      $(".bannerBox_list").css({"width": width+"px","margin":"0","padding":"0"})
    }
  }
  function banner(time){

    if($width<750){
      var distance = $width

    }else{
      var distance = parseInt($('.wrap').css("width"))
    }
    num++
    if(num >= $('.bannerBox_list').length){
      num=0;
    }
    $(".bannerBox").css({"transform":"translate(-"+ distance*num +"px,0)","transition-duration": time ||"200ms"})
  }
  var num = 0;
  var timer
  if ($('.bannerBox_list').length > 1) {
    timer = setInterval(banner, 3000)
  }

  change();
  $(window).resize(function() {
    change();
    banner("0ms")
  });

  /**
   * 首页吸顶
   */
  var homeTop = $('.homeContent').offset() && $('.homeContent').offset().top
  var hotTop = $('.hotTab').offset() && $('.hotTab').offset().top
  $('#homeCeil').scroll(function () {
    if ($(this).scrollTop() >= hotTop - homeTop) {
      $('.hotTab').addClass('hotTab__ceil')
      $(this).css('padding-top', 44)
    } else {
      $('.hotTab').removeClass('hotTab__ceil')
      $(this).css('padding-top', 0)
    }
  })
  $('.banner img').load(function () {
    // hotTop = $('.hotTab').offset().top
  })

  //修改昵称
  if($('.personalAccount_detail').length > 0){
    var $xiugai = $('.personalAccount_detail').find('.xiugai')

    $('.personalAccount').on('click',function(e){
      if($(e.target).hasClass('xiugai')){
        var $niCheng = $('.niCheng').html()
        $('.personalAccount_detail__p1').replaceWith("<p class='personalAccount_detail__p1'><input type='text' class='newNiCheng'	value=" + $niCheng + "/><button class='newNiChengBtn'>修改</button></p>")
        $('.newNiChengBtn').on('click',function(){
          var $newNiCheng = $('.newNiCheng').val()
          $('.personalAccount_detail__p1').replaceWith("<p class='personalAccount_detail__p1'><span class='niCheng'>" + $newNiCheng +"</span><img class='xiugai' src='../images/mine_xiugaimingcheng.png'  /></p>")
        })
      }
    })
  }

  /**
   * 返回列表
   * 可指定返回的 url
   */
  $(document).on('click', '[returntolist]', function () {
    var url = $(this).attr('returntolist')
    if (url) {
      window.location.href = url
    } else {
      location.replace(document.referrer)

    }
  })

  $('.returnBtn').click(function(){
    location.replace('/wap/user/index')
  })

  /**
   * 积分商城虚拟产品和实物产品分类
   */
  $('.sort_container').on('click', 'a', function () {
    $(this).addClass('active').siblings().removeClass('active')

    var $parent = $(this).parents('.sort').siblings('.productList')
    var type = $(this).attr('type')
    if (type) {
      type = type.toUpperCase()
      if (type === 'ALL') {
        $('.productList_item', $parent).show()
      } else {
        $('.productList_item', $parent).each(function (i, item) {
          var _type = $(this).attr('type').toUpperCase()
          if (type.indexOf(_type) > -1) {
            $(this).show()
          } else {
            $(this).hide()
          }
        })
      }
    }
  })

  /**
   * 地址级联
   */
  $('.address_select').change(function () {
    addressList($(this).val(), $(this).attr('level'))
  })

  /**
   * 弹出游戏详情框
   */
  $(document).on('click', '[gameid]', function () {
    if ($('#gameDetail').attr('open')) return false
    $('#gameDetail').attr('open', true)
    fetchGameDetail($(this).attr('gameid'))
  })

  /**
   * 跳转到礼包详情页
   */
  $(document).on('click', '[giftid]', function (e) {
    if (!$(e.target).hasClass('lingqu') && !$(e.target).hasClass('jiaqun')) {
      window.location.href = '/wap/gift/detail?gift_id=' + $(this).attr('giftid')
    }
  })

  /**
   * 跳转到资讯详情页
   */
  $(document).on('click', '[newsid]', function () {
    window.location.href = '/wap/news/detail?news_id=' + $(this).attr('newsid')
  })

  /**
   * 跳转到抽奖
   */
  $(document).on('click', '[awardid]', function (e) {
    var _this = $(this)
    $.get('/wap/news/list', {type: 5,format: 'json'}, function (res) {
      if (res.code === 200) {
        if(res.data.list[_this.index()].url == ''){
          window.location.href = '/wap/lottery/index?act_id=' + _this.attr('awardid')
        }else{
          window.location.href = res.data.list[_this.index()].url
        }
      }
    })

    // window.location.href = '/wap/lottery/index?act_id=' + $(this).attr('awardid')
  })

  /**
   * 中奖消息列表滚动
   */
  $('.getPrizeList').myScroll({
    speed: 40, //数值越大，速度越慢
    rowHeight: 32 //li的高度
  })

  /**
   * 我的奖品伸缩
   */
  $('.myPrizeOtherList').slideToggle()
  $('.myPrize_box').on('click', '.checkMore', function () {
    $('.myPrizeOtherList').slideToggle(function () {
      if ($('.checkMore').text() === '查看更多') {
        $('.checkMore').text('收起')
      } else {
        $('.checkMore').text('查看更多')
      }
    })
  })

  /**
   * 分享
   */
  $('#shareBtn').click(function () {
    if (/micromessenger/i.test(navigator.userAgent)) {
      $('.zhiyin').show()
    } else {
      $('.popShareBox').show()
      $('.popShare').animate({'bottom': 0})
    }
  })
  $('.cancelShare').on('click', function () {
    $('.popShare').animate({'bottom': -170}, function () {
      $('.popShareBox').hide()
    })
  })

  /**
   * Mac 去除滚动条的占位空间
   */
  var ua = navigator.userAgent
  if (/mac os x/i.test(ua)) {
    $('.shadowScroll').css({
      width: '100%',
      overflowY: 'auto'
    })
  }

  /**
   * 微信环境操作
   */
  if (/micromessenger/i.test(navigator.userAgent)) {
    // 移除个人中心的登录/退出按钮
    // $('.wx-remove').remove()
    $('#shareBtn').show()
    $('.zhuanjifenList_item[name="wx_share"]').css('display', 'flex')
  }

  /**
   * app 环境
   */
  if (window.huo && window.huo.getEnvironment) {
    var app = huo.getEnvironment()
    switch (app) {
      case 'and_app':
      case 'ios_app':
      case 'and_sdk':
      case 'ios_sdk':
      case 'and_h5_app':
      case 'ios_h5_app':
        $('.app-remove').remove()
        break
    }
  }
})

// 最近在玩 PC鼠标移动事件
function recentInit () {
  var $li_num = $('.recentGame').find('li').length
  $('.recentGame').css({width: 100 * $li_num + 16})

  $('.recentGame').on({
    mousemove: _opacity,
    touchmove: _opacity
  })

  function _opacity () {
    var x = parseInt($(this).parent().css('margin-left'))
    if (x === 0) {
      $('.recentGame_tip').css('opacity', 1)
    } else {
      $('.recentGame_tip').css('opacity', 0.3)
    }
  }

  $('.recentGame').find('li').click(function (e) {
    var t = new Date().getTime() - $(this).parents('.recentPlay_main').attr('t')
    if (t > 200) {
      e.stopPropagation()
    }
  })
}

// 打开实名认证页面
function openIdentifyPage () {
  $('.wrap').append('<iframe id="huoFrame" name="huoFrame" src="' + $('#h5iSite').val() + '/api/wap/identify/index" style="height: 100%; width: 100%; position: absolute; left: 0; top: 0; z-index: 1002; background-color: transparent; border: 0 none;"></iframe>')
}

// 分享任务
function handleShareTask (flag) {
  if (/micromessenger/i.test(navigator.userAgent)) {
    $('.wxShare').show()
    if (!flag) {
      $.get('/user/share/notify', function (res) {
      })
    }
  } else {
    alert('去微信内分享')
  }
}

// $('.awardBox_p1__guanbi').on('click',function(){
// 	$('.award').hide()
// })
// $('.awardBox_confirm').on('click',function(){
// 	$('.award').hide()
// 	// $('.getAwardInformation').show();
// })
// $('.getAwardInformationBox_p1__img').on('click',function(){
// 	$('.getAwardInformation').hide();
// })
// $('.getAwardInformationBox_confirm__btn').on('click',function(){
// 	$('.getAwardInformation').hide()
// 	$('.getAwardSucess').show();
// })
// $('.getAwardSucess').on('click',function(){
// 	$('.getAwardSucess').hide();
// })

//无缝滚动
$.fn.myScroll = function(options){
//默认配置
  var defaults = {
    speed: 40,  //滚动速度,值越大速度越慢
    rowHeight: 24 //每行的高度
  };

  var opts = $.extend({}, defaults, options),intId = [];

  function marquee(obj, step){
    obj.find("ul").animate({
      marginTop: '-=1'
    },0,function(){
        var s = Math.abs(parseInt($(this).css("margin-top")));
        if(s >= step){
          $(this).find("li").slice(0, 1).appendTo($(this));
          $(this).css("margin-top", 0);
        }
    });
  }

  this.each(function(i){
    var sh = opts["rowHeight"],speed = opts["speed"],_this = $(this);
    intId[i] = setInterval(function(){
      if(_this.find("ul").height()<=_this.height()){
        clearInterval(intId[i]);
      }else{
        marquee(_this, sh);
      }
    }, speed);

    _this.hover(function(){
      clearInterval(intId[i]);
    },function(){
      intId[i] = setInterval(function(){
        if(_this.find("ul").height()<=_this.height()){
          clearInterval(intId[i]);
        }else{
          marquee(_this, sh);
        }
      }, speed);
    });
  });
}

function showAll (e) {
  e = e || window.event
  $(e.target).parent().find('.gameDescript').css({'display':'block','height':'auto'});
  $(e.target).hide();
}

function showQQGroup () {
  var type = qqGroupDeviceType()
  switch (type) {
    case 'idkey':
      $('[qqgrouptype="and_key"], [qqgrouptype="ios_key"]').remove()
      break
    case 'and_key':
      $('[qqgrouptype="idkey"], [qqgrouptype="ios_key"]').remove()
      break
    case 'ios_key':
      $('[qqgrouptype="idkey"], [qqgrouptype="and_key"]').remove()
      break
  }
  $('[qqgrouptype]').show()
}

// QQ加群
function qqGroupDeviceType () {
  var ua = navigator.userAgent
  var type = 'idkey'
  var ios = /i(pad|phone|pod)/i.test(ua)
  var and = /android/i.test(ua)
  var wx = /micromessenger/i.test(ua)
  if (wx) {
    type = 'idkey'
  } else if (ios) {
    type = 'ios_key'
  } else if (and) {
    type = 'and_key'
  }
  return type
}

// 抽取 url 中的参数
function urlParse (key) {
  var value = ''
  var reg = new RegExp('(^|&)' + key + '=([^&]*)(&|$)')
  var r = window.location.search.substr(1).match(reg)
  if (r != null) {
    value = r[2]
  }
  return value
}
/***
 * 关闭我的账号内所有弹框
 * */
$('.mask_close').click(function(){
  $('.mask').fadeOut()
  $('.mask_content').html('')
})

/***
 * 修改昵称弹框
 * */
$('#editUsernameId').click(function(){
  $('.mask').fadeIn()
  $('.mask_content').html('')
  $('.mask_content').append(`<p class="editTitle">修改昵称</p>
                                    <input class="editInput" id="editInput" type="text" placeholder="请输入">
                                    <div class="confirmBtn">
                                      <button class="confirmBtn_button" type="button" onclick="editUsernameApi()">保存</button>
                                    </div>`)
})
/***
 * 修改密码
 * */

$('#userStatus').click(function(){
  let status = Number($(this).attr('data-status'))
  // HuoFloat.showAddress('editPassWord', status)
  $('.mask').fadeIn()
  $('.mask_content').html('')
  if(status == 1){
    $('.mask_content').append(`<div class="resetWrap">
                              <p class="editTitle">设置密码</p>
                              <input class="editInput" id="editPassNew" name="editPassWord" style="margin-bottom: 14px" type="text" placeholder="请输入新密码">
                              <input class="editInput" id="editPassNewRepeat" name="editPassWord" type="text" placeholder="请重复输入新密码">
                              <div class="confirmBtn">
                                <button class="confirmBtn_button" type="button" onclick="savePassWord(${status})">确认</button>
                              </div>
                            </div>`)
  }else{
    $('.mask_content').append(`<div class="resetWrap">
                              <p class="editTitle">修改密码</p>
                              <input class="editInput" style="margin-bottom: 16px" id="editPass" name="editPassWord" type="text" placeholder="请输入旧密码">
                              <input class="editInput" id="editPassNew" name="editPassWord" style="margin-bottom: 14px" type="text" placeholder="请输入新密码">
                              <input class="editInput" id="editPassNewRepeat" name="editPassWord" type="text" placeholder="请重复输入新密码">
                              <div class="confirmBtn">
                                <button class="confirmBtn_button" type="button" onclick="savePassWord(${status})">确认</button>
                              </div>
                             </div>`)
  }
})

/***
 * 保存修改昵称
 * */
function editUsernameApi(){
  $.ajax({
    url: '/cfloat/user/nickname/update',
    data: {
      "nickname": $('#editInput').val(),
      "format": 'json'
    },
    dataType: 'json',
    success: res => {
      console.log('res===', res)
      if(res.code == 200){
        $('.mask').fadeOut()
        $('.mask_content').html('')
        window.location.reload()

      }else{
        HuoUtils.tips(res.msg)
      }
    }
  })
}

/**
 * 保存修改密码
 * */
function savePassWord(id){
  console.log('id===', id)
  let oldPwd = $('.resetWrap #editPass').val();
  let newPwd = $('.resetWrap #editPassNew').val();
  let repPwd = $('.resetWrap #editPassNewRepeat').val();
  let data
  if(repPwd != newPwd){
    HuoUtils.tips('两次输入的密码不一致')
    return false
  }
  if(id == 1){
    data={
      "status": 1,
      "newpwd": newPwd,
      "format": 'json'
    }
  }else{
    data={
      "oldpwd": oldPwd,
      "newpwd": newPwd,
      "format": 'json'
    }

  }

  $.ajax({
    url: '/cfloat/user/passwd/update',
    data: data,
    dataType: 'json',
    success: res => {
      if(res.code == 200){
        $('.mask').fadeOut()
        $('.mask_content').html('')
        HuoApi.userLogout()
      }else{
        HuoUtils.tips(res.msg)
      }
    }
  })
}

/**
 * 修改头像
 * */
$('#modifying').click(function(){
  let img = $(this).attr('data-img')
  $('.mask').fadeIn()
  $('.mask_content').html('')
  $('.mask_content').append(`<p class="editTitle">修改头像</p>
                              <input type="file" id="uploadUserHead" style="display: none" name="file" onchange="uoloadImg(event, this)" accept="image/*">
                              <div style="text-align: center;">
                                <label for="uploadUserHead">
                                  <img id="showUserImg" crossorigin="anonymous" style="width: 66px;max-height: 66px" src="${img}" alt="">
                                </label>
                              </div>
                              <div class="confirmBtn">
                                <button class="confirmBtn_button" id="saveImg" type="button" disabled onclick="EditAgentInfo(this)">保存修改</button>
                              </div>`)
})

/**
 * 修改头像
 * */
function uoloadImg(e, item){
  let file = $(item)[0].files[0];    //获取文件信息
  console.log('files===', file)
  let fd = new FormData();
  fd.append("enctype", 'multipart/form-data');
  fd.append("filetype", "image");
  fd.append("app", "agent");
  fd.append("file", file);
  fd.append("id", "UPLOAD_FILE_LOGO");
  fd.append("name", file.name);
  fd.append("type", file.type);
  fd.append("lastModifiedDate", file.lastModifiedDate);
  fd.append("size", file.size);
  fd.append("format", 'json');
  fd.append('method', 'POST')
  let xhr = new XMLHttpRequest();
  xhr.open("POST", "/user/asset/upload");
  xhr.upload.onprogress = function(ev) {
    let percent = ((ev.loaded / ev.total) * 100).toFixed(0) + "%";
    console.log(percent);
  };
  xhr.send(fd);
  xhr.onreadystatechange = function() {
    if (xhr.readyState === 4 && xhr.status === 200) {
      let res = JSON.parse(xhr.response);
      console.log(res)
      if (res.code === 200) {
        $('#showUserImg').attr('src', res.data.url)
        $('#saveImg').attr('data-url', res.data.url)
        $('#saveImg').attr('disabled', false)
      } else {
        HuoUtils.tips(res.msg)
      }
    }
  };

}
/**
 * 保存修改后的头像
 * */
function EditAgentInfo(item) {
  let url = $(item).attr('data-url');
  $.ajax({
    url: '/user/avatar/update',
    data: {
      "avatar": url,
      "format": 'json'
    },
    dataType: 'json',
    success: res =>{
      console.log(res)
      if(res.code == 200){
        $('.mask').fadeOut()
        $('.mask_content').html('')
        window.location.reload()
      }else{
        HuoUtils.tips(res.msg)
      }
    }
  })

}