video.js 1.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100
  1. function getRandomColor() {
  2. const rgb = []
  3. for (let i = 0; i < 3; ++i) {
  4. let color = Math.floor(Math.random() * 256).toString(16)
  5. color = color.length === 1 ? `0${color}` : color
  6. rgb.push(color)
  7. }
  8. return `#${rgb.join('')}`
  9. }
  10. Page({
  11. onShareAppMessage() {
  12. return {
  13. title: 'video',
  14. path: 'packageComponent/pages/media/video/video'
  15. }
  16. },
  17. onReady() {
  18. this.videoContext = wx.createVideoContext('myVideo')
  19. },
  20. onHide() {
  21. },
  22. inputValue: '',
  23. data: {
  24. theme: 'light',
  25. enableAutoRotation: true,
  26. src: '',
  27. danmuList:
  28. [{
  29. text: '第 1s 出现的弹幕',
  30. color: '#ff0000',
  31. time: 1
  32. }, {
  33. text: '第 3s 出现的弹幕',
  34. color: '#ff00ff',
  35. time: 3
  36. }],
  37. },
  38. bindInputBlur(e) {
  39. this.inputValue = e.detail.value
  40. },
  41. bindButtonTap() {
  42. const that = this
  43. wx.chooseVideo({
  44. sourceType: ['album', 'camera'],
  45. maxDuration: 60,
  46. camera: ['front', 'back'],
  47. success(res) {
  48. that.setData({
  49. src: res.tempFilePath
  50. })
  51. }
  52. })
  53. },
  54. bindVideoEnterPictureInPicture() {
  55. console.log('进入小窗模式')
  56. },
  57. bindVideoLeavePictureInPicture() {
  58. console.log('退出小窗模式')
  59. },
  60. bindPlayVideo() {
  61. this.videoContext.play()
  62. },
  63. bindSendDanmu() {
  64. this.videoContext.sendDanmu({
  65. text: this.inputValue,
  66. color: getRandomColor()
  67. })
  68. },
  69. videoErrorCallback(e) {
  70. console.log('视频错误信息:')
  71. console.log(e.detail.errMsg)
  72. },
  73. handleSwitchChange(e) {
  74. this.setData({
  75. enableAutoRotation: e.detail.value
  76. })
  77. },
  78. onLoad() {
  79. this.setData({
  80. theme: wx.getSystemInfoSync().theme || 'light'
  81. })
  82. if (wx.onThemeChange) {
  83. wx.onThemeChange(({theme}) => {
  84. this.setData({theme})
  85. })
  86. }
  87. }
  88. })