reading.js 9.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320
  1. import httpRequestApi from '../../../utils/APIClient';
  2. Page({
  3. data: {
  4. title: '',
  5. id: '',
  6. img: '',
  7. fullScreenBtn: false,
  8. playBtn: false,
  9. gesture: true,
  10. muted: false,
  11. gesture: false,
  12. centerBtn: false,
  13. recordFlag: 0,
  14. recordSource: '',
  15. videoCtr: 'recordingVideoEnd',
  16. btnFlag: false,
  17. btnImgFlag: false,
  18. microphonePng: '../../../static/image/microphone.png',
  19. recordingGif: '../../../static/image/readingNow.gif',
  20. videoUrl: '',
  21. readingText: ''
  22. },
  23. onLoad: function (option) {
  24. console.log(option);
  25. this.videoCtx = null;
  26. const uid = wx.getStorageSync('uid')
  27. httpRequestApi.getClassDetail(uid, option.id).success(res => {
  28. wx.setNavigationBarTitle({
  29. title: res.data.data.title //页面标题为路由参数
  30. })
  31. let reg = /\\n/g
  32. this.setData({
  33. title: res.data.data.lesson.title,
  34. videoUrl: res.data.data.lesson.accompany || res.data.data.playUrl,
  35. img: res.data.data.lesson.iconImg,
  36. id: res.data.data.lesson.id,
  37. // readingText: res.data.data.lessonText.replace(reg,'')
  38. readingText: res.data.data.lesson.lessonText,
  39. grade: res.data.data.lesson.gradeClassify
  40. })
  41. console.log(this.data.readingText)
  42. console.log(this.data.img)
  43. })
  44. this.recorderManager = wx.getRecorderManager();
  45. // 监听录音部分
  46. // 录音开始
  47. this.recorderManager.onStart(() => {
  48. // this.saveVideo();
  49. this.setData({
  50. btnImgFlag: true,
  51. btnFlag: false
  52. })
  53. console.log('recorder start')
  54. })
  55. // this.recorderManager.onPause(() => {
  56. // wx.showToast({
  57. // title: '录音被暂停',
  58. // icon: 'fail',
  59. // duration: 500
  60. // })
  61. // })
  62. // this.recorderManager.onInterruptionBegin(() => {
  63. // wx.showToast({
  64. // title: '录音被应用中断开始',
  65. // icon: 'fail',
  66. // duration: 500
  67. // })
  68. // })
  69. // this.recorderManager.onInterruptionEnd(() => {
  70. // wx.showToast({
  71. // title: '录音中断结束',
  72. // icon: 'fail',
  73. // duration: 500
  74. // })
  75. // })
  76. this.recorderManager.onError(() => {
  77. wx.getSetting({
  78. success(res) {
  79. if (!res.authSetting['scope.record']) {
  80. wx.showModal({
  81. title: '无法开启您的录音权限',
  82. content: '点击右上角浮点按钮->进入关于->点击右上角按钮->设置,进行授权',
  83. confirmText: '我知道了',
  84. showCancel: false,
  85. success(res) {
  86. console.log('用户点击确定')
  87. }
  88. })
  89. }
  90. // else {
  91. // wx.showToast({
  92. // title: 'onError',
  93. // icon: 'fail',
  94. // duration: 500
  95. // })
  96. // }
  97. }
  98. })
  99. })
  100. // 录音结束
  101. this.recorderManager.onStop((res) => {
  102. // wx.showToast({
  103. // title: 'onStop',
  104. // icon: 'fail',
  105. // duration: 500
  106. // })
  107. this.videoCtx.stop();
  108. console.log('recorder stop', res)
  109. const recordFile = res.tempFilePath;
  110. this.setData({
  111. recordFlag: 0,
  112. recordSource: recordFile,
  113. btnFlag: true,
  114. btnImgFlag: false
  115. })
  116. })
  117. },
  118. onHide: function () {
  119. console.log('onhide')
  120. if (this.data.btnImgFlag) {
  121. this.recorderManager.stop();
  122. }
  123. if (this.innerAudioContext) {
  124. this.innerAudioContext.stop();
  125. }
  126. },
  127. onUnload: function () {
  128. console.log('onUnload')
  129. if (this.recorderManager) {
  130. this.recorderManager.stop();
  131. }
  132. if (this.innerAudioContext) {
  133. this.innerAudioContext.stop();
  134. }
  135. },
  136. // onShow:function(){
  137. // },
  138. // 视频缓冲
  139. // videoWaiting: function () {
  140. // this.recorderManager.pause();
  141. // },
  142. // //视频播放
  143. // videoPlay: function () {
  144. // this.recorderManager.resume();
  145. // },
  146. // 录音中视频播放结束 (控制录音同时结束)
  147. recordingVideoEnd: function () {
  148. console.log(this.data.videoCtr)
  149. console.log('recordingVideoEnd');
  150. //
  151. if (this.data.recordFlag === 0) {
  152. // this.recordStop();
  153. this.playingVideoEnd();
  154. return;
  155. }
  156. // 录音结束
  157. if (this.data.recordFlag === 1) {
  158. this.recordStop();
  159. }
  160. },
  161. // 播放中视频播放结束 (控制录音同时结束)
  162. playingVideoEnd: function () {
  163. console.log('playingVideoEnd')
  164. this.innerAudioContext.stop();
  165. },
  166. /***
  167. * recordFlag:
  168. * 0 初始状态
  169. * 1 录音中
  170. * 2 录音结束
  171. ***/
  172. audioRecord: function () {
  173. console.log(this.data.recordFlag)
  174. if (this.data.recordFlag === 0) {
  175. // this.recordStart();
  176. // this.saveVideo();
  177. if (this.videoCtx) {
  178. this.videoCtx.stop();
  179. }
  180. if (this.recorderManager) {
  181. this.recorderManager.stop();
  182. }
  183. if (this.innerAudioContext) {
  184. this.innerAudioContext.stop();
  185. }
  186. this.videoComplete();
  187. return;
  188. }
  189. // 录音结束后
  190. if (this.data.recordFlag === 1) {
  191. wx.showLoading({
  192. title: '作品转码中',
  193. mask: true
  194. })
  195. this.recordStop();
  196. }
  197. },
  198. // 录音开始
  199. /**
  200. * duration: 时长 最长10分钟
  201. sampleRate: 44100, 采样率
  202. numberOfChannels: 1, 录音通道
  203. encodeBitRate: 192000, 码率
  204. format: 'mp3', 格式
  205. frameSize: 50 制定帧大小
  206. */
  207. recordStart: function () {
  208. console.log('录音开始');
  209. const options = {
  210. duration: 600000,
  211. sampleRate: 44100,
  212. numberOfChannels: 1,
  213. encodeBitRate: 192000,
  214. format: 'mp3',
  215. frameSize: 50
  216. }
  217. this.recorderManager.start(options);
  218. },
  219. // 录音结束
  220. recordStop: function () {
  221. console.log('录音结束')
  222. this.recorderManager.stop();
  223. wx.hideLoading()
  224. },
  225. // 播放录音
  226. audioPlay: function () {
  227. console.log('音频播放');
  228. if (this.innerAudioContext) {
  229. this.innerAudioContext.stop();
  230. this.videoCtx.stop();
  231. }
  232. this.innerAudioContext = wx.createInnerAudioContext();
  233. this.innerAudioContext.src = this.data.recordSource; // 这里可以是录音的临时路径
  234. console.log(this.innerAudioContext.src);
  235. this.videoCtx.play();
  236. this.innerAudioContext.play();
  237. },
  238. videoComplete: function () {
  239. // let videoUrl = 'http://efunimgs.ai160.com/ott/test/002tPr2Xlx07oP7B4ro40104120022hP0k010.mp4';
  240. this.setData({
  241. recordFlag: 1
  242. }, () => {
  243. })
  244. this.videoCtx = wx.createVideoContext('myVideo', this);
  245. this.videoCtx.play();
  246. this.recordStart();
  247. },
  248. // 上传
  249. upload: function () {
  250. if (this.videoCtx) {
  251. this.videoCtx.stop();
  252. }
  253. if (this.recorderManager) {
  254. this.recorderManager.stop();
  255. }
  256. if (this.innerAudioContext) {
  257. this.innerAudioContext.stop();
  258. }
  259. wx.showLoading({
  260. title: '作品分享中',
  261. mask: true
  262. })
  263. const recordSource = this.data.recordSource;
  264. wx.uploadFile({
  265. url: 'https://reader.lingjiao.cn/readerBase/file/upload',
  266. filePath: recordSource,
  267. name: '朗读录音',
  268. header: {
  269. uid: wx.getStorageSync('uid')
  270. },
  271. success: (res) => {
  272. const formateRes = JSON.parse(res.data);
  273. let audioPath = formateRes.data;
  274. let uid = wx.getStorageSync('uid');
  275. shareWorks(uid, audioPath);
  276. }
  277. })
  278. let shareWorks = (uid, audio) => {
  279. if (this.innerAudioContext) {
  280. this.innerAudioContext.stop();
  281. }
  282. const data = {
  283. "lessonId": this.data.id,
  284. "originVideo": this.data.videoUrl,
  285. "audioPath": audio,
  286. "title": this.data.title,
  287. "iconImg": this.data.img,
  288. "summary": this.data.grade,
  289. };
  290. httpRequestApi.postWork(uid, data).success(res => {
  291. wx.hideLoading({
  292. success: () => {
  293. wx.showToast({
  294. title: '上传成功',
  295. icon: 'success',
  296. duration: 1000,
  297. success: () => {
  298. console.log(res);
  299. wx.redirectTo({
  300. url: `../../social/works/works?id=${res.data.data.id}`
  301. })
  302. }
  303. })
  304. }
  305. });
  306. })
  307. };
  308. }
  309. })