Skip to content

Commit 8015124

Browse files
AngelFQCAngelFQC
committed
Create JS lib for record audio and oral expression question - refs BT#12615
1 parent 7a9a04c commit 8015124

File tree

6 files changed

+237
-316
lines changed

6 files changed

+237
-316
lines changed

‎main/document/record_audio.php‎

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -142,6 +142,8 @@
142142
$htmlHeadXtra[] = '<script src="'.api_get_path(WEB_LIBRARY_PATH).'wami-recorder/recorder.js"></script>';
143143
$htmlHeadXtra[] = '<script src="'.api_get_path(WEB_LIBRARY_PATH).'wami-recorder/gui.js"></script>';
144144
$htmlHeadXtra[] = '<script type="text/javascript" src="'.api_get_path(WEB_LIBRARY_PATH).'swfobject/swfobject.js"></script>';
145+
$htmlHeadXtra[] = '<script src="'.api_get_path(WEB_LIBRARY_PATH).'swfobject/swfobject.js"></script>';
146+
$htmlHeadXtra[] = api_get_js('record_audio/record_audio.js');
145147

146148
$actions = Display::toolbarButton(
147149
get_lang('BackTo').' '.get_lang('DocumentsOverview'),

‎main/exercise/exercise_submit.php‎

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -69,6 +69,7 @@
6969
$htmlHeadXtra[] = '<script src="'.api_get_path(WEB_LIBRARY_PATH).'wami-recorder/recorder.js"></script>';
7070
$htmlHeadXtra[] = '<script src="'.api_get_path(WEB_LIBRARY_PATH).'wami-recorder/gui.js"></script>';
7171
$htmlHeadXtra[] = '<script type="text/javascript" src="'.api_get_path(WEB_LIBRARY_PATH).'swfobject/swfobject.js"></script>';
72+
$htmlHeadXtra[] = api_get_js('record_audio/record_audio.js');
7273
}
7374

7475
$template = new Template();

‎main/inc/ajax/record_audio_rtc.ajax.php‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -33,7 +33,7 @@
3333
$saveDir = $dirBaseDocuments.$audioDir;
3434

3535
if (!is_dir($saveDir)) {
36-
DocumentManager::createDefaultAudioFolder($courseInfo);
36+
mkdir($saveDir, api_get_permissions_for_new_directories(), true);
3737
}
3838

3939
$documentPath = $saveDir.'/'.$audioFileName;

‎main/inc/lib/javascript/record_audio/record_audio.js‎

Lines changed: 198 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,198 @@
1+
/* For licensing terms, see /license.txt */
2+
window.RecordAudio = (function () {
3+
function useRecordRTC(rtcInfo, fileName) {
4+
$(rtcInfo.blockId).show();
5+
6+
var mediaConstraints = {audio: true},
7+
recordRTC = null,
8+
btnStart = $(rtcInfo.btnStartId),
9+
btnPause = $(rtcInfo.btnPauseId),
10+
btnPlay = $(rtcInfo.btnPlayId),
11+
btnStop = $(rtcInfo.btnStopId),
12+
btnSave = $(rtcInfo.btnSaveId),
13+
tagAudio = $(rtcInfo.plyrPreviewId);
14+
15+
btnStart.on('click', function () {
16+
if (!fileName) {
17+
fileName = $('#audio-title-rtc').val();
18+
19+
if (!$.trim(fileName)) {
20+
return;
21+
}
22+
}
23+
24+
navigator.getUserMedia = navigator.getUserMedia || navigator.mozGetUserMedia || navigator.webkitGetUserMedia;
25+
26+
function successCallback(stream) {
27+
recordRTC = RecordRTC(stream, {
28+
numberOfAudioChannels: 1,
29+
type: 'audio'
30+
});
31+
recordRTC.startRecording();
32+
33+
$('#audio-title-rtc').prop('readonly', true);
34+
btnSave.prop('disabled', true).addClass('hidden');
35+
btnStop.prop('disabled', false).removeClass('hidden');
36+
btnStart.prop('disabled', true).addClass('hidden');
37+
btnPause.prop('disabled', false).removeClass('hidden');
38+
tagAudio.removeClass('show').addClass('hidden');
39+
}
40+
41+
function errorCallback(error) {
42+
alert(error.message);
43+
}
44+
45+
if (navigator.getUserMedia) {
46+
navigator.getUserMedia(mediaConstraints, successCallback, errorCallback);
47+
} else if (navigator.mediaDevices.getUserMedia) {
48+
navigator.mediaDevices.getUserMedia(mediaConstraints)
49+
.then(successCallback)
50+
.error(errorCallback);
51+
}
52+
});
53+
54+
btnPause.on('click', function () {
55+
if (!recordRTC) {
56+
return;
57+
}
58+
59+
btnPause.prop('disabled', true).addClass('hidden');
60+
btnPlay.prop('disabled', false).removeClass('hidden');
61+
btnStop.prop('disabled', true).addClass('hidden');
62+
recordRTC.pauseRecording();
63+
});
64+
65+
btnPlay.on('click', function () {
66+
if (!recordRTC) {
67+
return;
68+
}
69+
70+
btnPlay.prop('disabled', true).addClass('hidden');
71+
btnPause.prop('disabled', false).removeClass('hidden');
72+
btnStop.prop('disabled', false).removeClass('hidden');
73+
recordRTC.resumeRecording();
74+
});
75+
76+
btnStop.on('click', function () {
77+
if (!recordRTC) {
78+
return;
79+
}
80+
81+
recordRTC.stopRecording(function (audioURL) {
82+
btnStart.prop('disabled', false).removeClass('hidden');
83+
btnPause.prop('disabled', true).addClass('hidden');
84+
btnStop.prop('disabled', true).addClass('hidden');
85+
btnSave.prop('disabled', false).removeClass('hidden');
86+
87+
tagAudio
88+
.removeClass('hidden')
89+
.addClass('show')
90+
.prop('src', audioURL);
91+
});
92+
});
93+
94+
btnSave.on('click', function () {
95+
if (!recordRTC) {
96+
return;
97+
}
98+
99+
var recordedBlob = recordRTC.getBlob();
100+
101+
if (!recordedBlob) {
102+
return;
103+
}
104+
105+
var fileExtension = '.' + recordedBlob.type.split('/')[1];
106+
107+
var formData = new FormData();
108+
formData.append('audio_blob', recordedBlob, fileName + fileExtension);
109+
formData.append('audio_dir', rtcInfo.directory);
110+
111+
$.ajax({
112+
url: _p.web_ajax + 'record_audio_rtc.ajax.php',
113+
data: formData,
114+
processData: false,
115+
contentType: false,
116+
type: 'POST'
117+
}).then(function (fileUrl) {
118+
if (!fileUrl) {
119+
return;
120+
}
121+
122+
btnSave.prop('disabled', true).addClass('hidden');
123+
btnStop.prop('disabled', true).addClass('hidden');
124+
btnStart.prop('disabled', false).removeClass('hidden');
125+
126+
if ($('#audio-title-rtc').length) {
127+
$('#audio-title-rtc').prop('readonly', false);
128+
129+
window.location.reload();
130+
}
131+
});
132+
});
133+
}
134+
135+
function useWami(wamiInfo, fileName) {
136+
$(wamiInfo.blockId).show();
137+
138+
if (!fileName) {
139+
$('#btn-activate-wami').on('click', function (e) {
140+
e.preventDefault();
141+
142+
fileName = $('#audio-title-wami').val();
143+
144+
if (!$.trim(fileName)) {
145+
return;
146+
}
147+
148+
$('#audio-title-wami').prop('readonly', true);
149+
$(this).prop('disabled', true);
150+
151+
Wami.setup({
152+
id: wamiInfo.containerId,
153+
onReady : setupGUI,
154+
swfUrl: _p.web_lib + 'wami-recorder/Wami.swf'
155+
});
156+
});
157+
} else {
158+
Wami.setup({
159+
id: wamiInfo.containerId,
160+
onReady: setupGUI,
161+
swfUrl: _p.web_lib + 'wami-recorder/Wami.swf'
162+
});
163+
}
164+
165+
function setupGUI() {
166+
var gui = new Wami.GUI({
167+
id: wamiInfo.containerId,
168+
singleButton: true,
169+
recordUrl: _p.web_ajax + 'record_audio_wami.ajax.php?' + $.param({
170+
waminame: fileName + '.wav',
171+
wamidir: wamiInfo.directory,
172+
wamiuserid: wamiInfo.userId
173+
}),
174+
buttonUrl: _p.web_lib + 'wami-recorder/buttons.png',
175+
buttonNoUrl: _p.web_img + 'blank.gif'
176+
});
177+
178+
gui.setPlayEnabled(false);
179+
}
180+
}
181+
182+
return {
183+
init: function (rtcInfo, wamiInfo, fileName) {
184+
$(rtcInfo.blockId + ', ' + wamiInfo.blockId).hide();
185+
186+
var webRTCIsEnabled = navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.getUserMedia ||
187+
navigator.mediaDevices.getUserMedia;
188+
189+
if (webRTCIsEnabled) {
190+
useRecordRTC(rtcInfo, fileName);
191+
192+
return;
193+
}
194+
195+
useWami(wamiInfo, fileName);
196+
}
197+
}
198+
})();

0 commit comments

Comments
 (0)