var webrtcroom = require('../../../utils/webrtcroom.js')
var imHandler = require('./im_handler.js')
var webim = require('../../../utils/webim_wx');

const SHOWINTERACT_TYPE = {
  BOARD: 1, // 白板
  COMMENT: 2 // 聊天
}

const ROLE_TYPE = {
  AUDIENCE: 'audience', // 观众， 可以看到白板
  PRESENTER: 'presenter' // 主播， 没有白板，暂时不支持小程序端作为老师
}

Page({
  /**
   * 页面的初始数据
   */
  data: {
    webrtcroomComponent: null,
    roomID: '', // 房间id
    roomname: '', // 房间名称
    beauty: 5,
    muted: false,
    debug: false,
    frontCamera: true,
    role: ROLE_TYPE.AUDIENCE, // presenter 代表主播，audience 代表观众
    userID: '',
    userSig: '',
    sdkAppID: '',
    roomCreator: '',
    comment: [],
    toview: null,
    showInteractType: SHOWINTERACT_TYPE.COMMENT, // 标识不展示
    // 互动类型
    SHOWINTERACT_TYPE: SHOWINTERACT_TYPE,
    ROLE_TYPE: ROLE_TYPE,
    sketchpad: {
      width: 0,
      height: 0
    },
    isErrorModalShow: false,
    heartBeatFailCount: 0, //心跳失败次数
    autoplay: true,
    enableCamera: true
  },

  /**
   * 监听 IM 事件
   */
  onIMEvent: function (e) {
    const CONSTANT = this.data.webrtcroomComponent.data.CONSTANT;
    let code = e.detail.code;
    let tag = e.detail.tag;
    let data = e.detail.detail;

    switch (tag) {
      // 登录事件
      case CONSTANT.IM.LOGIN_EVENT:
        if (code) {
          wx.showToast({
            icon: 'none',
            title: `登录IM失败，ErrCode: ${code}`
          });
          console.error(`登录IM失败，ErrCode: ${code}`);
        } else {
          wx.showToast({
            title: '登录IM成功'
          });
          console.log('登录IM成功');
        }
        break;
        // 创建群|进群状态
      case CONSTANT.IM.JOIN_GROUP_EVENT:
        if (code) {
          wx.showToast({
            icon: 'none',
            title: `创建群|进群失败，ErrCode: ${code}`
          });
          console.error(`创建群|进群失败，ErrCode: ${code}`);
        } else {
          wx.showToast({
            title: '创建群|进群成功'
          });
          console.log('创建群|进群成功');
        }
        break;
        // 连接状态
      case CONSTANT.IM.CONNECTION_EVENT:
        switch (code) {
          case webim.CONNECTION_STATUS.ON:
            console.log('连接状态正常...');
            break;
          case webim.CONNECTION_STATUS.OFF:
            console.error('连接已断开，无法收到新消息，请检查下你的网络是否正常');
            break;
          default:
            console.error('未知连接状态,status=' + code);
            break;
        }
        break;

      case CONSTANT.IM.GROUP_SYSTEM_NOTIFYS: // 监听（多终端同步）群系统消息事件，必填
        console.log(`群系统消息事件，code:${code}`);
        break;

      case CONSTANT.IM.GROUP_INFO_CHANGE_NOTIFY: // 监听群资料变化事件，选填
        console.log("执行 群资料变化 回调： " + JSON.stringify(groupInfo));
        var groupId = groupInfo.GroupId;
        var newFaceUrl = groupInfo.GroupFaceUrl; //新群组图标, 为空，则表示没有变化
        var newName = groupInfo.GroupName; //新群名称, 为空，则表示没有变化
        var newOwner = groupInfo.OwnerAccount; //新的群主id, 为空，则表示没有变化
        var newNotification = groupInfo.GroupNotification; //新的群公告, 为空，则表示没有变化
        var newIntroduction = groupInfo.GroupIntroduction; //新的群简介, 为空，则表示没有变化

        if (newName) {
          console.log("群id=" + groupId + "的新名称为：" + newName);
        }
        break;
      case CONSTANT.IM.BIG_GROUP_MSG_NOTIFY: // 接收到IM大群消息
        console.log('接收到大群(直播聊天室)消息通知');
        var msgs = data;
        imHandler.handleGroupMessage(msgs, (msg) => {
          if (!msg.content) {
            return;
          }

          var time = new Date();
          var h = time.getHours() + '',
            m = time.getMinutes() + '',
            s = time.getSeconds() + '';
          h.length == 1 ? (h = '0' + h) : '';
          m.length == 1 ? (m = '0' + m) : '';
          s.length == 1 ? (s = '0' + s) : '';
          time = h + ':' + m + ':' + s;
          msg.time = time;

          if (msg.fromAccountNick == '@TIM#SYSTEM') {
            msg.fromAccountNick = '';
            msg.content = msg.content.split(';');
            msg.content = msg.content[0];

            this.updateComment({
              roomID: this.data.roomID,
              userID: msg.fromAccountNick,
              userName: msg.userName,
              userAvatar: msg.userAvatar,
              message: msg.content,
              time: msg.time
            });
          } else {
            var content
            try {
              // 自定义消息
              content = JSON.parse(msg.content);
            } catch (error) {
              // 普通消息
              this.updateComment({
                roomID: this.data.roomID,
                userID: msg.fromAccountNick,
                userName: msg.userName,
                message: msg.data,
                time: msg.time
              });
              return;
            }
            var data = content.data;
            var desc = null;
            try {
              desc = JSON.parse(content.desc);
            } catch (error) {
              desc = {};
            }
            var ext = content.ext;
            if (ext === 'TXWhiteBoardExt') { // 如果是白板消息
              var whiteBoardCom = this.selectComponent('#white_board');
              if (whiteBoardCom) {
                var data = JSON.parse(data);
                if (data.action === 'currentBoard') {
                  whiteBoardCom.updateCurrentBoard(data.currentBoard);
                } else {
                  whiteBoardCom.addData(data);
                }
              }
            } else if (ext === 'TEXT') { // 如果是普通消息
              this.updateComment({
                roomID: this.data.roomID,
                userID: msg.fromAccountNick,
                userName: desc.nickName,
                message: data,
                time: msg.time
              });
            }
          }
        });
        break;
    }
  },

  /**
   * 监听房间事件
   */
  onRoomEvent: function (e) {
    var self = this;
    switch (e.detail.tag) {
      case 'error':
        if (this.data.isErrorModalShow) {
          return;
        }
        if (e.detail.code === -10) { // 进房失败，一般为网络切换的过程中
          this.data.isErrorModalShow = true;
          wx.showModal({
            title: '提示',
            content: e.detail.detail,
            confirmText: '重试',
            cancelText: '退出',
            success: function (res) {
              self.data.isErrorModalShow = false
              if (res.confirm) {
                self.joinRoom();
              } else if (res.cancel) { //
                self.goBack();
              }
            }
          });
        } else {
          // 在房间内部才显示提示
          console.error("error:", e.detail.detail);
          var pages = getCurrentPages();
          console.log(pages, pages.length, pages[pages.length - 1].__route__);
          if (pages.length > 1 && (pages[pages.length - 1].__route__ == 'pages/webrtcroom/room/room')) {
            this.data.isErrorModalShow = true;
            wx.showModal({
              title: '提示',
              content: e.detail.detail,
              showCancel: false,
              complete: function () {
                self.data.isErrorModalShow = false
                pages = getCurrentPages();
                if (pages.length > 1 && (pages[pages.length - 1].__route__ == 'pages/webrtcroom/room/room')) {
                  wx.showToast({
                    title: `code:${e.detail.code} content:${e.detail.detail}`
                  });
                  wx.navigateBack({
                    delta: 1
                  });
                }
              }
            });
          }
        }
        break;
    }
  },

  /**
   * 更新聊天内容
   * @param {Object} msg 消息内容
   */
  updateComment(msg) {
    // 普通消息
    this.data.comment.push({
      content: msg.message,
      name: msg.userName,
      uid: msg.userID,
      time: msg.time
    });
    this.setData({
      comment: this.data.comment,
      toview: null // 滚动条置底
    });

    this.setData({
      toview: 'scroll-bottom' // 滚动条置底
    });
  },

  /**
   * 切换摄像头
   */
  changeCamera: function () {
    this.data.webrtcroomComponent.switchCamera();
    this.setData({
      frontCamera: !this.data.frontCamera
    })
  },

  /**
   * 设置美颜
   */
  setBeauty: function () {
    this.data.beauty = (this.data.beauty == 0 ? 5 : 0);
    this.setData({
      beauty: this.data.beauty
    });
  },

  /**
   * 切换是否静音
   */
  changeMute: function () {
    this.data.muted = !this.data.muted;
    this.setData({
      muted: this.data.muted
    });
  },

  /**
   * 是否显示日志
   */
  showLog: function () {
    this.data.debug = !this.data.debug;
    this.setData({
      debug: this.data.debug
    });
  },

  /**
   * 创建房间
   * 房间创建成功后，发送心跳包，并启动webrtc-room标签
   */
  createRoom: function () {
    var self = this;
    webrtcroom.createRoom(self.data.userID, this.data.roomname,
      function (res) {
        console.log('创建房间成功:', res);
        self.data.roomID = res.data.roomID;

        // 成功进房后发送心跳包
        self.sendHeartBeat(self.data.userID, self.data.roomID);

        // 设置webrtc-room标签中所需参数，并启动webrtc-room标签
        self.setData({
          userID: self.data.userID,
          userSig: self.data.userSig,
          sdkAppID: self.data.sdkAppID,
          roomID: self.data.roomID,
          privateMapKey: res.data.privateMapKey
        }, function () {
          self.data.webrtcroomComponent.start();
        })
      },
      function (res) {
        console.error('创建房间失败[' + res.errCode + ';' + res.errMsg + ']');
        self.onRoomEvent({
          detail: {
            tag: 'error',
            code: -999,
            detail: '创建房间失败[' + res.errCode + ';' + res.errMsg + ']'
          }
        })
      });
  },

  /**
   * 进入房间， 包括进入IM和进入推流房间
   */
  enterRoom: function () {
    var self = this;
    webrtcroom.enterRoom(self.data.userID, self.data.roomID,
      function (res) {

        // 成功进房后发送心跳包
        self.sendHeartBeat(self.data.userID, self.data.roomID);

        // 设置webrtc-room标签中所需参数，并启动webrtc-room标签
        self.setData({
          userID: self.data.userID,
          userSig: self.data.userSig,
          sdkAppID: self.data.sdkAppID,
          roomID: self.data.roomID,
          privateMapKey: res.data.privateMapKey
        }, function () {
          self.data.webrtcroomComponent.start();
        })
      },
      function (res) {
        console.error(self.data.ERROR_CREATE_ROOM, '进入房间失败[' + res.errCode + ';' + res.errMsg + ']')
        self.onRoomEvent({
          detail: {
            tag: 'error',
            code: -999,
            detail: '进入房间失败[' + res.errCode + ';' + res.errMsg + ']'
          }
        })
      });
  },

  /**
   * 发送心跳包
   */
  sendHeartBeat(userID, roomID) {
    var self = this;
    // 发送心跳
    webrtcroom.startHeartBeat(userID, roomID, function () {
      self.data.heartBeatFailCount = 0;
    }, function () {
      self.data.heartBeatFailCount++;
      // wx.navigateTo({
      //   url: '../roomlist/roomlist'
      // });
      // 2次心跳都超时，则认为真正超时了
      if (self.data.heartBeatFailCount > 2) {
        wx.hideToast();
        wx.showToast({
          icon: 'none',
          title: '心跳超时，请重新进入房间',
          complete: function () {
            setTimeout(() => {
              self.goBack();
            }, 1000);
          }
        });
      } else {
        wx.hideToast();
        wx.showToast({
          icon: 'none',
          title: '心跳超时，正在重试...'
        });
      }
    });
  },

  /**
   * 返回上一页
   */
  goBack() {
    var pages = getCurrentPages();
    if (pages.length > 1 && (pages[pages.length - 1].__route__ == 'pages/webrtcroom/room/room')) {
      wx.navigateBack({
        delta: 1
      });
    }
  },


  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    this.setData({
      userID: wx.getStorageSync('webrtc_room_userid')
    });

    this.data.roomID = options.roomID || '';
    this.data.roomname = options.roomName;
    this.data.username = options.userName;
    this.setData({
      roomCreator: options.roomCreator || this.data.userID
    });
    this.joinRoom();
  },

  /**
   * 进入房间
   */
  joinRoom() {
    console.log('room.js onLoad');
    var time = new Date();
    time = time.getHours() + ':' + time.getMinutes() + ':' + time.getSeconds();
    console.log('*************开始多人音视频：' + time + '**************');

    // webrtcComponent
    this.data.webrtcroomComponent = this.selectComponent('#webrtcroom');
    var self = this;
    wx.showToast({
      icon: 'none',
      title: '获取登录信息中'
    });
    webrtcroom.getLoginInfo(
      self.data.userID,
      function (res) {
        self.data.userID = res.data.userID;
        wx.setStorageSync('webrtc_room_userid', self.data.userID);

        self.data.sdkAppID = res.data.sdkAppID;
        self.data.userSig = res.data.userSig;

        if (self.data.roomID) {
          self.enterRoom();
        } else {
          self.createRoom();
        }
        if (self.data.userID === self.data.roomCreator || !self.data.roomCreator) { // 如果创建房间是自己，则是主播
          self.setData({
            role: ROLE_TYPE.PRESENTER
          });
        } else {
          self.setData({
            role: ROLE_TYPE.AUDIENCE
          });
        }
      },
      function (res) {
        wx.showToast({
          icon: 'none',
          title: '获取登录信息失败，请重试',
          complete: function () {
            setTimeout(() => {
              self.goBack();
            }, 1500);
          }
        });
      });
  },


  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {
    // 设置房间标题
    wx.setNavigationBarTitle({
      title: this.data.roomname
    });
    // 计算一次白板的宽高
    this.resizeSketchpad();
  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {
    var self = this;
    console.log('room.js onShow');
    // 保持屏幕常亮
    wx.setKeepScreenOn({
      keepScreenOn: true
    })
  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {
    var self = this;
    console.log('room.js onHide');
  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {
    console.log('room.js onUnload');
    webrtcroom.quitRoom(this.data.userID, this.data.roomID);
  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {
    return {
      // title: '',
      path: '/pages/main/main',
      imageUrl: 'https://mc.qcloudimg.com/static/img/dacf9205fe088ec2fef6f0b781c92510/share.png'
    }
  },

  /**
   * 展示白板
   */
  showBoard() {
    this.setData({
      showInteractType: this.data.SHOWINTERACT_TYPE.BOARD
    }, () => {
      if (this.data.webrtcroomComponent) {
        var body = {
          cmd: 'sketchpad',
          data: {
            userID: this.data.userID,
            userName: this.data.userName,
            userAvatar: '',
            msg: '{"type":"request", "action":"currentBoard"}'
          }
        }
        var msg = {
          data: JSON.stringify(body)
        }
        // 同步当前白板
        this.data.webrtcroomComponent.sendC2CCustomMsg(this.data.roomCreator, msg, (res) => {
          console.log('C2C消息发送成功');
        }, (err) => {
          wx.showToast({
            icon: 'none',
            title: `消息发送失败，code: ${err.ErrorCode}`
          });
        });
      }
    });
  },

  /**
   * 展示聊天面板
   */
  showComment() {
    this.setData({
      showInteractType: this.data.SHOWINTERACT_TYPE.COMMENT
    });
  },

  // IM输入框的信息
  bindInputMsg: function (e) {
    this.data.inputMsg = e.detail.value;
  },

  // 发送IM消息
  sendComment: function () {
    var msg = this.data.inputMsg || '';

    if (this.data.webrtcroomComponent) {
      if (!msg || !msg.trim()) {
        wx.showToast({
          icon: 'none',
          title: '不能发送空消息'
        });
        console.error('不能发送空消息');
        return;
      }
      var msgLen = webim.Tool.getStrBytes(msg);
      var maxLen, errInfo;
      maxLen = webim.MSG_MAX_LENGTH.GROUP; // 群组最大支持的消息长度
      if (msgLen > maxLen) {
        errInfo = "消息长度超出限制(最多" + Math.round(maxLen / 3) + "汉字)";
        wx.showToast({
          icon: 'none',
          title: errInfo
        });
        console.error(errInfo);
        return;
      }

      this.data.webrtcroomComponent.sendGroupCustomMsg({
        data: msg, // 要发送的消息内容
        ext: 'TEXT', // 自定义消息的类型
        desc: JSON.stringify({ // 扩展数据
          nickName: '自定义昵称' + new Date().getTime()
        })
      }, (res) => {
        // 发送成功
        this.setData({
          inputMsg: ''
        });
      }, (err) => {
        wx.showToast({
          icon: 'none',
          title: `消息发送失败，code: ${err.ErrorCode}`
        });
        console.error(`消息发送失败，code: ${err.ErrorCode} info:${err.SrcErrorInfo}`);
      });
    }
  },


  /**
   * 计算宽高
   */
  pixel: function ({
    value,
    unit
  }, cb) {
    wx.getSystemInfo({
      success: function (res) {
        var vw = res.windowWidth;
        var vh = res.windowHeight;
        var resultPixelValue = 0;
        if (unit == 'px') {
          resultPixelValue = value;
        } else if (unit == 'vw') {
          resultPixelValue = value / 100 * vw;
        } else if (unit == 'vh') {
          resultPixelValue = value / 100 * vh;
        } else {
          console.log('支持单位：vw, vh');
        }
        console.log("{value: %d, unit: %s} ==> %d px", value, unit, resultPixelValue);
        cb(resultPixelValue);
      },
      fail: function () {
        console.log('获取系统信息失败');
        cb(0);
      }
    })
  },

  /**
   * 重置画面的宽高
   */
  resizeSketchpad() {
    var self = this;
    self.pixel({
      value: 100,
      unit: 'vh'
    }, function (res1) {
      self.pixel({
        value: 100,
        unit: 'vw'
      }, function (res2) {
        var fullHeight = res1;
        var fullWidth = res2;

        // 100vh - 100vw*9/16 - 100vw/3 - 1vh - 10vh - 5vh + 2vw/3
        var rHeight = fullHeight - fullWidth * 9 / 16 - fullWidth / 3 - fullHeight * 0.01 - fullHeight * 0.1 - fullHeight * 0.05 + fullWidth * 0.02 / 3;
        self.setData({
          sketchpad: {
            height: rHeight,
            width: fullWidth,
          }
        }, () => {
          console.log("normal screen: h1 = %d, w1 = %d", rHeight, fullWidth);
        });
      });
    });
  }
})