reading.js 10 KB

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