// index.wxs
let startY = 0; // 起始Y坐标
let isStart = false; // 是否开始滑动
let moveDistance = 0; // 移动距离
let currentOffset = 0; // 保存累计偏移量


// 触摸开始事件
function touchstart(event, ins) {
  if (!isStart) {
    isStart = true;
    const touch = event.touches[0];
    startY = touch.pageY;
  }
}


// 触摸移动事件
function touchmove(event, ins) {
  const { pageY } = event.touches[0];
  moveDistance = currentOffset + (pageY - startY);
  
  // 更新元素位置
  ins.selectComponent('.videoBox').setStyle({
    transform: `translateY(${moveDistance}px)`
  });
}


// 触摸结束事件
function touchend(event, ins) {
  isStart = false;
  currentOffset = moveDistance;
}


module.exports = {
  touchstart,
  touchmove,
  touchend
};

.container {
  width: 100vw;
  height: 100%;
  position: relative;
  overflow: hidden;
  top: 0;
  position: absolute;
  background: #000;
}

.videoBox {
  width: 100vw;
  height: 100%;
  position: absolute;
}

.video-item {
  width: 100vw;
  height: 100%;
  display: block;
}

// utils/debounce.js
function debounce(fn, delay = 300, immediate = false) {
  let timer = null;
  return function (...args) {
    if (timer) clearTimeout(timer);
    
    if (immediate && !timer) {
      fn.apply(this, args); // 立即执行一次
    }
    
    timer = setTimeout(() => {
      if (!immediate) {
        fn.apply(this, args);
      }
      timer = null;
    }, delay);
  };
}
module.exports = debounce;



// pages/live.js
const debounce = require('../../utils/debounce');

Page({
  data: { danmuText: '' },
  
  onLoad() {
    // 创建防抖后的更新函数，并绑定当前 Page 的 this
    this.debouncedUpdateDanmu = debounce(this.updateDanmu.bind(this), 300);
  },

  updateDanmu(text) {
    this.setData({ danmuText: text });
  }

  // 接收WebSocket实时消息
  onSocketMessage(msg) {
    this.debouncedUpdateDanmu(msg.content); // 高频调用会自动合并
  }
});

Page({
  data: {
    open: false,
  },
  handleOpen: function () {
    this.setData({
      open: true
    })
  },
  handleClose: function () {
    this.setData({
      open: false
    })
  },
})

.container {
  width: 100vw;
  height: 100vh;
  display: flex;
  flex-direction: column;
  background-color: #000;
}
.liver-pusher {
  width: 100%;
  flex: 1;
}
.action-button {
  position: absolute;
  height: 50px;
  line-height: 50px;
  text-align: center;
  background-color: white;
}

.close {
  left: 100px;
}

.comments-modal {
  width: 100%;
  background-color: #fff;
  height: 40vh;
}