RecordAudio.js 4.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136
  1. /* For licensing terms, see /license.txt */
  2. window.RecordAudio = (function () {
  3. function useRecordRTC(rtcInfo) {
  4. $(rtcInfo.blockId).show();
  5. var mediaConstraints = {audio: true},
  6. localStream = null,
  7. recordRTC = null,
  8. btnStart = $(rtcInfo.btnStartId),
  9. btnStop = $(rtcInfo.btnStopId),
  10. tagAudio = $(rtcInfo.plyrPreviewId);
  11. function saveAudio() {
  12. var recordedBlob = recordRTC.getBlob();
  13. if (!recordedBlob) {
  14. return;
  15. }
  16. var btnStopText = btnStop.html();
  17. var fileExtension = recordedBlob.type.split('/')[1];
  18. var formData = new FormData();
  19. formData.append('audio', recordedBlob, 'audio.' + fileExtension);
  20. for (var prop in rtcInfo.data) {
  21. if (!rtcInfo.data.hasOwnProperty(prop)) {
  22. continue;
  23. }
  24. formData.append(prop, rtcInfo.data[prop]);
  25. }
  26. $.ajax({
  27. url: _p.web_plugin + 'whispeakauth/ajax/record_audio.php',
  28. data: formData,
  29. processData: false,
  30. contentType: false,
  31. type: 'POST',
  32. beforeSend: function () {
  33. btnStart.prop('disabled', true);
  34. btnStop.prop('disabled', true).text(btnStop.data('loadingtext'));
  35. }
  36. }).done(function (response) {
  37. $('#messages-deck').html(response);
  38. if ($('#messages-deck > .alert.alert-success').length > 0) {
  39. tagAudio.parents('#audio-wrapper').addClass('hidden').removeClass('show');
  40. } else {
  41. tagAudio.parents('#audio-wrapper').removeClass('hidden').addClass('show');
  42. }
  43. btnStop.prop('disabled', true).html(btnStopText).parent().addClass('hidden');
  44. if ($('#messages-deck > .alert.alert-success').length > 0 ||
  45. $('#messages-deck > .alert.alert-warning [data-reach-attempts]').length > 0
  46. ) {
  47. btnStart.prop('disabled', true);
  48. } else {
  49. btnStart.prop('disabled', false);
  50. }
  51. btnStart.parent().removeClass('hidden');
  52. });
  53. }
  54. btnStart.on('click', function () {
  55. tagAudio.prop('src', '');
  56. function successCallback(stream) {
  57. localStream = stream;
  58. recordRTC = RecordRTC(stream, {
  59. recorderType: StereoAudioRecorder,
  60. numberOfAudioChannels: 1,
  61. type: 'audio'
  62. });
  63. recordRTC.startRecording();
  64. btnStop.prop('disabled', false).parent().removeClass('hidden');
  65. btnStart.prop('disabled', true).parent().addClass('hidden');
  66. tagAudio.removeClass('show').parents('#audio-wrapper').addClass('hidden');
  67. }
  68. function errorCallback(error) {
  69. alert(error.message);
  70. }
  71. if (navigator.mediaDevices.getUserMedia) {
  72. navigator.mediaDevices.getUserMedia(mediaConstraints)
  73. .then(successCallback)
  74. .catch(errorCallback);
  75. return;
  76. }
  77. navigator.getUserMedia = navigator.getUserMedia || navigator.mozGetUserMedia || navigator.webkitGetUserMedia;
  78. if (navigator.getUserMedia) {
  79. navigator.getUserMedia(mediaConstraints, successCallback, errorCallback);
  80. }
  81. });
  82. btnStop.on('click', function () {
  83. if (!recordRTC) {
  84. return;
  85. }
  86. recordRTC.stopRecording(function (audioURL) {
  87. tagAudio.prop('src', audioURL);
  88. localStream.getTracks()[0].stop();
  89. saveAudio();
  90. });
  91. });
  92. }
  93. return {
  94. init: function (rtcInfo) {
  95. $(rtcInfo.blockId).hide();
  96. var userMediaEnabled = (navigator.mediaDevices && navigator.mediaDevices.getUserMedia) ||
  97. !!navigator.webkitGetUserMedia ||
  98. !!navigator.mozGetUserMedia ||
  99. !!navigator.getUserMedia;
  100. if (!userMediaEnabled) {
  101. return;
  102. }
  103. useRecordRTC(rtcInfo);
  104. }
  105. }
  106. })();