reading.js 13 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392
  1. import httpRequestApi from '../../../utils/APIClient';
  2. import {
  3. formatDate
  4. } from '../../../utils/util';
  5. Page({
  6. data: {
  7. title: '',
  8. id: '',
  9. img: '',
  10. fullScreenBtn: false,
  11. playBtn: false,
  12. gesture: true,
  13. muted: false,
  14. gesture: false,
  15. centerBtn: false,
  16. recordFlag: 0,
  17. recordSource: '',
  18. videoCtr: 'recordingVideoEnd',
  19. btnFlag: false,
  20. btnImgFlag: false,
  21. microphonePng: '../../../static/image/microphone.png',
  22. recordingGif: '../../../static/image/readingNow.gif',
  23. videoUrl: '',
  24. readingText: '',
  25. videoList: [],
  26. pageNo: 1,
  27. nextMargin: getApp().globalData.nextMargin
  28. },
  29. onLoad: function (option) {
  30. console.log(option);
  31. this.videoCtx = null;
  32. const uid = wx.getStorageSync('uid')
  33. httpRequestApi.getClassDetail(uid, option.id).success(res => {
  34. console.log(res)
  35. let reg = /\\n/g
  36. this.setData({
  37. title: res.data.data.lesson.title,
  38. videoUrl: res.data.data.lesson.accompany || res.data.data.playUrl,
  39. img: res.data.data.lesson.iconImg,
  40. id: res.data.data.lesson.id,
  41. // readingText: res.data.data.lessonText.replace(reg,'')
  42. readingText: res.data.data.lesson.lessonText,
  43. grade: res.data.data.lesson.gradeClassify,
  44. productId: res.data.data.product.id
  45. })
  46. console.log(this.data.readingText)
  47. console.log(this.data.img)
  48. httpRequestApi.userIntoPage('pages/main/reading/reading', '朗读页面').success((res) => {
  49. })
  50. })
  51. this.getReadInfo()
  52. this.recorderManager = wx.getRecorderManager();
  53. // 监听录音部分
  54. // 录音开始
  55. this.recorderManager.onStart(() => {
  56. // this.saveVideo();
  57. this.setData({
  58. btnImgFlag: true,
  59. btnFlag: false
  60. })
  61. console.log('recorder start')
  62. })
  63. // this.recorderManager.onPause(() => {
  64. // wx.showToast({
  65. // title: '录音被暂停',
  66. // icon: 'fail',
  67. // duration: 500
  68. // })
  69. // })
  70. // this.recorderManager.onInterruptionBegin(() => {
  71. // wx.showToast({
  72. // title: '录音被应用中断开始',
  73. // icon: 'fail',
  74. // duration: 500
  75. // })
  76. // })
  77. // this.recorderManager.onInterruptionEnd(() => {
  78. // wx.showToast({
  79. // title: '录音中断结束',
  80. // icon: 'fail',
  81. // duration: 500
  82. // })
  83. // })
  84. let dialogFlag = true;
  85. this.recorderManager.onError(() => {
  86. wx.getSetting({
  87. success(res) {
  88. if (!res.authSetting['scope.record'] && dialogFlag) {
  89. wx.showModal({
  90. title: '录音前请打开麦克风权限',
  91. content: '点击右上角浮点...,选择:设置-麦克风,点击/打开。',
  92. confirmText: '我知道了',
  93. showCancel: false,
  94. success(res) {
  95. console.log('用户点击确定')
  96. // dialogFlag = false;
  97. }
  98. })
  99. dialogFlag = false;
  100. setTimeout(() => {
  101. dialogFlag = true;
  102. }, 1000)
  103. }
  104. // else {
  105. // wx.showToast({
  106. // title: 'onError',
  107. // icon: 'fail',
  108. // duration: 500
  109. // })
  110. // }
  111. }
  112. })
  113. })
  114. // 录音结束
  115. this.recorderManager.onStop((res) => {
  116. // wx.showToast({
  117. // title: 'onStop',
  118. // icon: 'fail',
  119. // duration: 500
  120. // })
  121. this.videoCtx.stop();
  122. console.log('recorder stop', res)
  123. const recordFile = res.tempFilePath;
  124. this.setData({
  125. recordFlag: 0,
  126. recordSource: recordFile,
  127. btnFlag: true,
  128. btnImgFlag: false
  129. })
  130. })
  131. },
  132. onHide: function () {
  133. console.log('onhide')
  134. if (this.data.btnImgFlag) {
  135. this.recorderManager.stop();
  136. }
  137. if (this.innerAudioContext) {
  138. this.innerAudioContext.stop();
  139. }
  140. this.setData({
  141. recordFlag: 0
  142. })
  143. },
  144. onUnload: function () {
  145. console.log('onUnload')
  146. if (this.recorderManager) {
  147. this.recorderManager.stop();
  148. }
  149. if (this.innerAudioContext) {
  150. this.innerAudioContext.stop();
  151. }
  152. },
  153. onShow: function () {
  154. this.setData({
  155. statusbarobj: {
  156. isshowbtn: false, //是否显示按钮
  157. title: "小学语文课文朗读", //标题
  158. },
  159. })
  160. },
  161. // 视频缓冲
  162. // videoWaiting: function () {
  163. // this.recorderManager.pause();
  164. // },
  165. // //视频播放
  166. // videoPlay: function () {
  167. // this.recorderManager.resume();
  168. // },
  169. // 录音中视频播放结束 (控制录音同时结束)
  170. recordingVideoEnd: function () {
  171. console.log(this.data.videoCtr)
  172. console.log('recordingVideoEnd');
  173. //
  174. if (this.data.recordFlag === 0) {
  175. // this.recordStop();
  176. this.playingVideoEnd();
  177. return;
  178. }
  179. // 录音结束
  180. if (this.data.recordFlag === 1) {
  181. this.recordStop();
  182. }
  183. },
  184. // 播放中视频播放结束 (控制录音同时结束)
  185. playingVideoEnd: function () {
  186. console.log('playingVideoEnd')
  187. this.innerAudioContext.stop();
  188. },
  189. /***
  190. * recordFlag:
  191. * 0 初始状态
  192. * 1 录音中
  193. * 2 录音结束
  194. ***/
  195. audioRecord: function () {
  196. console.log(this.data.recordFlag)
  197. if (this.data.recordFlag === 0) {
  198. // this.recordStart();
  199. // this.saveVideo();
  200. if (this.videoCtx) {
  201. this.videoCtx.stop();
  202. }
  203. if (this.recorderManager) {
  204. this.recorderManager.stop();
  205. }
  206. if (this.innerAudioContext) {
  207. this.innerAudioContext.stop();
  208. }
  209. const that = this;
  210. wx.getSetting({
  211. success(res) {
  212. if (res.authSetting['scope.record']) {
  213. that.videoComplete();
  214. }
  215. // else {
  216. // wx.showToast({
  217. // title: 'onError',
  218. // icon: 'fail',
  219. // duration: 500
  220. // })
  221. // }
  222. }
  223. })
  224. return;
  225. }
  226. // 录音结束后
  227. if (this.data.recordFlag === 1) {
  228. wx.showLoading({
  229. title: '作品转码中',
  230. mask: true
  231. })
  232. this.recordStop();
  233. }
  234. },
  235. // 录音开始
  236. /**
  237. * duration: 时长 最长10分钟
  238. sampleRate: 44100, 采样率
  239. numberOfChannels: 1, 录音通道
  240. encodeBitRate: 192000, 码率
  241. format: 'mp3', 格式
  242. frameSize: 50 制定帧大小
  243. */
  244. recordStart: function () {
  245. console.log('录音开始');
  246. const options = {
  247. duration: 600000,
  248. sampleRate: 44100,
  249. numberOfChannels: 1,
  250. encodeBitRate: 192000,
  251. format: 'mp3',
  252. frameSize: 50
  253. }
  254. this.recorderManager.start(options);
  255. },
  256. // 录音结束
  257. recordStop: function () {
  258. console.log('录音结束')
  259. this.recorderManager.stop();
  260. wx.hideLoading()
  261. },
  262. // 播放录音
  263. audioPlay: function () {
  264. console.log('音频播放');
  265. if (this.innerAudioContext) {
  266. this.innerAudioContext.stop();
  267. this.videoCtx.stop();
  268. }
  269. this.innerAudioContext = wx.createInnerAudioContext();
  270. this.innerAudioContext.src = this.data.recordSource; // 这里可以是录音的临时路径
  271. console.log(this.innerAudioContext.src);
  272. this.videoCtx.play();
  273. this.innerAudioContext.play();
  274. },
  275. videoComplete: function () {
  276. // let videoUrl = 'http://efunimgs.ai160.com/ott/test/002tPr2Xlx07oP7B4ro40104120022hP0k010.mp4';
  277. this.setData({
  278. recordFlag: 1
  279. }, () => {
  280. })
  281. this.videoCtx = wx.createVideoContext('myVideo', this);
  282. this.videoCtx.play();
  283. this.recordStart();
  284. },
  285. // 上传
  286. upload: function () {
  287. if (this.videoCtx) {
  288. this.videoCtx.stop();
  289. }
  290. if (this.recorderManager) {
  291. this.recorderManager.stop();
  292. }
  293. if (this.innerAudioContext) {
  294. this.innerAudioContext.stop();
  295. }
  296. wx.showLoading({
  297. title: '作品分享中',
  298. mask: true
  299. })
  300. const recordSource = this.data.recordSource;
  301. wx.uploadFile({
  302. url: 'https://reader.lingjiao.cn/readerBase/file/upload',
  303. filePath: recordSource,
  304. name: '朗读录音',
  305. header: {
  306. uid: wx.getStorageSync('uid')
  307. },
  308. success: (res) => {
  309. const formateRes = JSON.parse(res.data);
  310. let audioPath = formateRes.data;
  311. let uid = wx.getStorageSync('uid');
  312. shareWorks(uid, audioPath);
  313. }
  314. })
  315. let shareWorks = (uid, audio) => {
  316. if (this.innerAudioContext) {
  317. this.innerAudioContext.stop();
  318. }
  319. const data = {
  320. "lessonId": this.data.id,
  321. "originVideo": this.data.videoUrl,
  322. "audioPath": audio,
  323. "title": this.data.title,
  324. "iconImg": this.data.img,
  325. "summary": this.data.grade,
  326. productId: this.data.productId
  327. };
  328. httpRequestApi.postWork(uid, data).success(res => {
  329. wx.hideLoading({
  330. success: () => {
  331. wx.showToast({
  332. title: '上传成功',
  333. icon: 'success',
  334. duration: 1000,
  335. success: () => {
  336. console.log(res);
  337. wx.redirectTo({
  338. url: `../../social/works/works?id=${res.data.data.id}&flowerCount=${res.data.count}`
  339. })
  340. }
  341. })
  342. }
  343. });
  344. })
  345. };
  346. },
  347. // 获取本课朗读内容
  348. getReadInfo: function (pageNo, pageSize) {
  349. // const uid = wx.getStorageSync('uid');
  350. const data = {
  351. lessonId: this.data.id,
  352. pageNo: this.data.pageNo,
  353. pageSize: 10
  354. };
  355. httpRequestApi.getClassRead(this.uid, data).success(res => {
  356. const readInfo = res.data.data.list;
  357. console.log(res)
  358. readInfo.forEach(item => {
  359. const temp = {};
  360. temp.title = item.userRead ? item.userRead.title : '';
  361. temp.img = item.userRead.iconImg;
  362. temp.plays = item.userRead.playAmount ? item.userRead.playAmount : 0;
  363. temp.likes = item.userRead.likeAmount ? item.userRead.likeAmount : 0;
  364. temp.classId = item.userRead.lessonId;
  365. temp.time = formatDate(item.userRead.gmtCreated, 3);
  366. temp.avatar = item.user ? item.user.avatar : '';
  367. temp.uid = item.user ? item.user.uid : '';
  368. temp.url = item.userRead.originVideo;
  369. // temp.avatar = item.user.avatar;
  370. temp.nickName = item.user ? item.user.wechatName : '';
  371. temp.id = item.userRead.id;
  372. // recommendWorks.push(temp);
  373. // that.data.hotData.hotWorks.push(temp);
  374. this.data.videoList.push(temp);
  375. });
  376. this.setData({
  377. videoList: this.data.videoList
  378. })
  379. });
  380. },
  381. })