reading.js 10 KB

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