audio-player.js 2.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107
  1. const Audio = require('./Audio');
  2. Component({
  3. options: {
  4. styleIsolation: 'shared'
  5. },
  6. properties: {
  7. data: {
  8. type: Object,
  9. value: {}
  10. }
  11. },
  12. lifetimes:{
  13. // 页面生命周期
  14. attached:function(){
  15. const _ts = this,
  16. audio = _ts.audio = new Audio(this.data.data);
  17. audio.eventPlay = function(){
  18. _ts.setData({tips:{state:'h2w__audio--play',text:'Playing'}});
  19. };
  20. audio.eventCanplay = function(){
  21. _ts.setData({tips:{state:'h2w__audio--readyed',text:'Readyed'}});
  22. };
  23. audio.eventTimeUpdate = function(duration,currentTime){
  24. _ts.setData({time:{currentTime:currentTime,duration:duration,schedule:Math.round(_ts.audio.currentTime) / Math.round(_ts.audio.duration) * 100 + '%'}});
  25. };
  26. audio.eventPause = function(){
  27. _ts.setData({tips:{state:'h2w__audio--pause',text:'Pause'}});
  28. };
  29. audio.eventStop = function(){
  30. _ts.setData({tips:{state:'h2w__audio--end',text:'End'}});
  31. };
  32. // // 更新播放状态
  33. // _ts.audio.onTimeUpdate = function(duration,currentTime){
  34. // _ts.setData({
  35. // playerData:{
  36. // state:'h2w__audio--play',
  37. // tips:'Playing',
  38. // currentTime:currentTime,
  39. // duration:duration,
  40. // schedule:_ts.audio.currentTime / _ts.audio.duration * 100 + '%'
  41. // }
  42. // });
  43. // };
  44. // _ts.audio.onPause = function(){
  45. // _ts.setData({playerData:{state:'h2w__audio--pause',tips:'Pause'}});
  46. // };
  47. // _ts.audio.onCanplay = function(){
  48. // _ts.setData({playerData:{state:'h2w__audio--readyed',tips:'Readyed'}});
  49. // };
  50. // _ts.audio.onError = function(){
  51. // _ts.setData({playerData:{state:'h2w__audio--error',tips:'Error'}});
  52. // };
  53. // _ts.audio.onEnded = ()=>{
  54. // _ts.setData({playerData:{state:'h2w__audio--end',tips:'End'}});
  55. // };
  56. },
  57. moved:function(){
  58. const _ts = this;
  59. _ts.audio.stop();
  60. _ts.audio.destroy();
  61. },
  62. detached:()=>{
  63. const _ts = this;
  64. _ts.audio.stop();
  65. _ts.audio.destroy();
  66. },
  67. },
  68. data: {
  69. tips:{
  70. state:'',
  71. text:'--'
  72. },
  73. time: {
  74. currentTime:'00:00:00',
  75. duration:'00:00:00',
  76. schedule:'0%'
  77. }
  78. },
  79. methods: {
  80. playAndPause: function () {
  81. const _ts = this,
  82. audio = _ts.audio;
  83. // console.log(audio);
  84. audio.isTouch = true;
  85. if(audio.status === 'update' || audio.status === 'play'){
  86. // console.log('pause');
  87. audio.pause();
  88. }else{
  89. // console.log('play');
  90. audio.play();
  91. };
  92. }
  93. }
  94. })