Exercises: remove wami audio recorder

pull/3768/head^2
Julio Montoya 5 years ago
parent 8ac4a85415
commit f9d05098d6
  1. BIN
      public/main/document/Wami.swf
  2. BIN
      public/main/inc/ajax/Wami.swf
  3. 155
      public/main/inc/ajax/record_audio_wami.ajax.php
  4. 8
      public/main/inc/lib/swfobject/index.html
  5. 13
      public/main/inc/lib/swfobject/swfobject.js
  6. 8
      public/main/inc/lib/swfobject/swfobject_source/index.html
  7. BIN
      public/main/inc/lib/swfobject/swfobject_source/swfobject_1_5.zip
  8. BIN
      public/main/inc/lib/swfobject/swfobject_source/swfobject_2_2.zip
  9. 1061
      public/main/inc/lib/swfobject/swfobject_source/swfobject_source.js
  10. BIN
      public/main/inc/lib/wami-recorder/Wami.swf
  11. BIN
      public/main/inc/lib/wami-recorder/buttons.png
  12. 353
      public/main/inc/lib/wami-recorder/gui.js
  13. 6
      public/main/inc/lib/wami-recorder/index.html
  14. 278
      public/main/inc/lib/wami-recorder/recorder.js
  15. 4
      public/main/lp/lp_add_audio.php
  16. 4
      public/main/messages/record_audio.php

Binary file not shown.

Binary file not shown.

@ -1,155 +0,0 @@
<?php
/* For licensing terms, see /license.txt */
use ChamiloSession as Session;
require_once __DIR__.'/../global.inc.php';
// Add security from Chamilo
api_block_anonymous_users();
$_course = api_get_course_info();
// Save the audio to a URL-accessible directory for playback.
parse_str($_SERVER['QUERY_STRING'], $params);
if (isset($params['waminame']) && isset($params['wamidir']) && isset($params['wamiuserid'])) {
$waminame = $params['waminame'];
$wamidir = $params['wamidir'];
$wamiuserid = $params['wamiuserid'];
} else {
api_not_allowed();
exit();
}
if (empty($wamiuserid)) {
api_not_allowed();
exit();
}
$type = isset($_REQUEST['type']) ? $_REQUEST['type'] : 'document'; // can be document or message
if ('document' === $type) {
api_protect_course_script();
}
// Clean
$waminame = Security::remove_XSS($waminame);
$waminame = Database::escape_string($waminame);
$waminame = api_replace_dangerous_char($waminame);
$waminame = disable_dangerous_file($waminame);
$wamidir = Security::remove_XSS($wamidir);
$content = file_get_contents('php://input');
if (empty($content)) {
exit;
}
$ext = explode('.', $waminame);
$ext = strtolower($ext[sizeof($ext) - 1]);
if ('wav' != $ext) {
exit();
}
switch ($type) {
case 'document':
// Do not use here check Fileinfo method because return: text/plain
$dirBaseDocuments = api_get_path(SYS_COURSE_PATH).$_course['path'].'/document';
$saveDir = $dirBaseDocuments.$wamidir;
if (!is_dir($saveDir)) {
DocumentManager::createDefaultAudioFolder($_course);
}
// Avoid duplicates
$waminame_to_save = $waminame;
$documentPath = $saveDir.'/'.$waminame_to_save;
// Add to disk
$fh = fopen($documentPath, 'w') or exit("can't open file");
fwrite($fh, $content);
fclose($fh);
$fileInfo = pathinfo($documentPath);
$courseInfo = api_get_course_info();
$file = [
'file' => [
'name' => $fileInfo['basename'],
'tmp_name' => $documentPath,
'size' => filesize($documentPath),
'type' => 'audio/wav',
'from_file' => true,
],
];
$output = true;
ob_start();
// Strangely the file path changes with a double extension
copy($documentPath, $documentPath.'.wav');
$documentData = DocumentManager::upload_document(
$file,
$wamidir,
$fileInfo['basename'],
'wav',
0,
'overwrite',
false,
$output
);
$contents = ob_get_contents();
if (!empty($documentData)) {
$newDocId = $documentData['id'];
$documentData['comment'] = 'mp3';
$newMp3DocumentId = DocumentManager::addAndConvertWavToMp3(
$documentData,
$courseInfo,
api_get_session_id(),
api_get_user_id(),
'overwrite',
true
);
if ($newMp3DocumentId) {
$newDocId = $newMp3DocumentId;
}
if (isset($_REQUEST['lp_item_id']) && !empty($_REQUEST['lp_item_id'])) {
$lpItemId = $_REQUEST['lp_item_id'];
/** @var learnpath $lp */
$lp = Session::read('oLP');
if (!empty($lp)) {
$lp->set_modified_on();
$lpItem = new learnpathItem($lpItemId);
$lpItem->add_audio_from_documents($newDocId);
echo Display::return_message(get_lang('Update successful'), 'info');
}
}
// Strangely the file path changes with a double extension
// Remove file with one extension
unlink($documentPath);
} else {
echo $contents;
}
break;
case 'message':
$tempFile = api_get_path(SYS_ARCHIVE_PATH).$waminame;
file_put_contents($tempFile, $content);
Session::write('current_audio_id', $waminame);
$file = [
'name' => basename($tempFile),
'tmp_name' => $tempFile,
'size' => filesize($tempFile),
'type' => 'audio/wav',
'move_file' => true,
];
api_upload_file('audio_message', $file, api_get_user_id());
break;
}

@ -1,8 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
</head>
<body>
<br />
</body>
</html>

File diff suppressed because one or more lines are too long

@ -1,8 +0,0 @@
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
</head>
<body>
<br />
</body>
</html>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 15 KiB

@ -1,353 +0,0 @@
var Wami = window.Wami || {};
// Upon a creation of a new Wami.GUI(options), we assume that a WAMI recorder
// has been initialized.
Wami.GUI = function(options) {
var RECORD_BUTTON = 1;
var PLAY_BUTTON = 2;
setOptions(options);
setupDOM();
var recordButton, playButton;
var recordInterval, playInterval;
function createDiv(id, style) {
var div = document.createElement("div");
if (id) {
div.setAttribute('id', id);
}
if (style) {
div.style.cssText = style;
}
return div;
}
function setOptions(options) {
if (!options.buttonUrl) {
options.buttonUrl = "buttons.png";
}
if (typeof options.listen == 'undefined' || options.listen) {
listen();
}
}
function setupDOM() {
var guidiv = createDiv(
null,
'position:absolute;width:214px;height:144px;padding-left:79px;padding-top:45px;left:50%;margin-left: -107px'
);
document.getElementById(options.id).appendChild(guidiv);
var rid = Wami.createID();
var recordDiv = createDiv(rid, '');
guidiv.appendChild(recordDiv);
recordButton = new Button(rid, RECORD_BUTTON, options.buttonUrl);
recordButton.onstart = startRecording;
recordButton.onstop = stopRecording;
recordButton.setEnabled(true);
//Chamilo hack single button
var pid = Wami.createID();
var playDiv = createDiv(pid, '');
guidiv.appendChild(playDiv);
if (!options.singleButton) {
playButton = new Button(pid, PLAY_BUTTON, options.buttonUrl);
} else {
playButton = new Button(pid, PLAY_BUTTON, options.buttonNoUrl);
}
playButton.onstart = startPlaying;
playButton.onstop = stopPlaying;
}
//end hack single button
/**
* These methods are called on clicks from the GUI.
*/
function startRecording() {
if (!options.recordUrl) {
alert("No record Url specified!");
}
recordButton.setActivity(0);
playButton.setEnabled(false);
Wami.startRecording(options.recordUrl,
Wami.nameCallback(onRecordStart), Wami
.nameCallback(onRecordFinish), Wami
.nameCallback(onError));
}
function stopRecording() {
Wami.stopRecording();
clearInterval(recordInterval);
recordButton.setEnabled(true);
}
function startPlaying() {
if (!options.playUrl) {
alert('No play URL specified!');
}
playButton.setActivity(0);
recordButton.setEnabled(false);
Wami.startPlaying(options.playUrl, Wami.nameCallback(onPlayStart), Wami
.nameCallback(onPlayFinish), Wami.nameCallback(onError));
}
function stopPlaying() {
Wami.stopPlaying();
}
this.setPlayUrl = function(url) {
options.playUrl = url;
}
this.setRecordUrl = function(url) {
options.recordUrl = url;
}
this.setPlayEnabled = function(val) {
playButton.setEnabled(val);
}
this.setRecordEnabled = function(val) {
recordButton.setEnabled(val);
}
/**
* Callbacks from the flash indicating certain events
*/
function onError(e) {
alert(e);
}
function onRecordStart() {
recordInterval = setInterval(function() {
if (recordButton.isActive()) {
var level = Wami.getRecordingLevel();
recordButton.setActivity(level);
}
}, 200);
if (options.onRecordStart) {
options.onRecordStart();
}
}
function onRecordFinish() {
playButton.setEnabled(true);
if (options.onRecordFinish) {
options.onRecordFinish();
}
}
function onPlayStart() {
playInterval = setInterval(function() {
if (playButton.isActive()) {
var level = Wami.getPlayingLevel();
playButton.setActivity(level);
}
}, 200);
if (options.onPlayStart) {
options.onPlayStart();
}
}
function onPlayFinish() {
clearInterval(playInterval);
recordButton.setEnabled(true);
playButton.setEnabled(true);
if (options.onPlayFinish) {
options.onPlayFinish();
}
}
function listen() {
Wami.startListening();
// Continually listening when the window is in focus allows us to
// buffer a little audio before the users clicks, since sometimes
// people talk too soon. Without "listening", the audio would record
// exactly when startRecording() is called.
window.onfocus = function() {
Wami.startListening();
};
// Note that the use of onfocus and onblur should probably be replaced
// with a more robust solution (e.g. jQuery's $(window).focus(...)
window.onblur = function() {
Wami.stopListening();
};
}
function Button(buttonid, type, url) {
var self = this;
self.active = false;
self.type = type;
init();
// Get the background button image position
// Index: 1) normal 2) pressed 3) mouse-over
function background(index) {
if (index == 1)
return "-56px 0px";
if (index == 2)
return "0px 0px";
if (index == 3)
return "-112px 0";
alert("Background not found: " + index);
}
// Get the type of meter and its state
// Index: 1) enabled 2) meter 3) disabled
function meter(index, offset) {
var top = 5;
if (offset)
top += offset;
if (self.type == RECORD_BUTTON) {
if (index == 1)
return "-169px " + top + "px";
if (index == 2)
return "-189px " + top + "px";
if (index == 3)
return "-249px " + top + "px";
} else {
if (index == 1)
return "-269px " + top + "px";
if (index == 2)
return "-298px " + top + "px";
if (index == 3)
return "-327px " + top + "px";
}
alert("Meter not found: " + self.type + " " + index);
}
function silhouetteWidth() {
if (self.type == RECORD_BUTTON) {
return "20px";
} else {
return "29px";
}
}
function mouseHandler(e) {
var rightclick;
if (!e)
var e = window.event;
if (e.which)
rightclick = (e.which == 3);
else if (e.button)
rightclick = (e.button == 2);
if (!rightclick) {
if (self.active && self.onstop) {
self.active = false;
self.onstop();
} else if (!self.active && self.onstart) {
self.active = true;
self.onstart();
}
}
}
function init() {
var div = document.createElement("div");
var elem = document.getElementById(buttonid);
if (elem) {
elem.appendChild(div);
} else {
alert('Could not find element on page named ' + buttonid);
}
self.guidiv = document.createElement("div");
self.guidiv.style.width = '56px';
self.guidiv.style.height = '63px';
self.guidiv.style.cursor = 'pointer';
self.guidiv.style.background = "url(" + url + ") no-repeat";
self.guidiv.style.backgroundPosition = background(1);
div.appendChild(self.guidiv);
// margin auto doesn't work in IE quirks mode
// http://stackoverflow.com/questions/816343/why-will-this-div-img-not-center-in-ie8
// text-align is a hack to force it to work even if you forget the
// doctype.
self.guidiv.style.textAlign = 'center';
self.meterDiv = document.createElement("div");
self.meterDiv.style.width = silhouetteWidth();
self.meterDiv.style.height = '63px';
self.meterDiv.style.margin = 'auto';
self.meterDiv.style.cursor = 'pointer';
self.meterDiv.style.position = 'relative';
self.meterDiv.style.background = "url(" + url + ") no-repeat";
self.meterDiv.style.backgroundPosition = meter(2);
self.guidiv.appendChild(self.meterDiv);
self.coverDiv = document.createElement("div");
self.coverDiv.style.width = silhouetteWidth();
self.coverDiv.style.height = '63px';
self.coverDiv.style.margin = 'auto';
self.coverDiv.style.cursor = 'pointer';
self.coverDiv.style.position = 'relative';
self.coverDiv.style.background = "url(" + url + ") no-repeat";
self.coverDiv.style.backgroundPosition = meter(1);
self.meterDiv.appendChild(self.coverDiv);
self.active = false;
self.guidiv.onmousedown = mouseHandler;
}
self.isActive = function() {
return self.active;
}
self.setActivity = function(level) {
self.guidiv.onmouseout = function() {
};
self.guidiv.onmouseover = function() {
};
self.guidiv.style.backgroundPosition = background(2);
self.coverDiv.style.backgroundPosition = meter(1, 5);
self.meterDiv.style.backgroundPosition = meter(2, 5);
var totalHeight = 31;
var maxHeight = 9;
// When volume goes up, the black image loses height,
// creating the perception of the colored one increasing.
var height = (maxHeight + totalHeight - Math.floor(level / 100
* totalHeight));
self.coverDiv.style.height = height + "px";
}
self.setEnabled = function(enable) {
var guidiv = self.guidiv;
self.active = false;
if (enable) {
self.coverDiv.style.backgroundPosition = meter(1);
self.meterDiv.style.backgroundPosition = meter(1);
guidiv.style.backgroundPosition = background(1);
guidiv.onmousedown = mouseHandler;
guidiv.onmouseover = function() {
guidiv.style.backgroundPosition = background(3);
};
guidiv.onmouseout = function() {
guidiv.style.backgroundPosition = background(1);
};
} else {
self.coverDiv.style.backgroundPosition = meter(3);
self.meterDiv.style.backgroundPosition = meter(3);
guidiv.style.backgroundPosition = background(1);
guidiv.onmousedown = null;
guidiv.onmouseout = function() {
};
guidiv.onmouseover = function() {
};
}
}
}
}

@ -1,6 +0,0 @@
<html>
<head>
</head>
<body>
</body>
</html>

@ -1,278 +0,0 @@
var Wami = window.Wami || {};
// Returns a (very likely) unique string with of random letters and numbers
Wami.createID = function() {
return "wid" + ("" + 1e10).replace(/[018]/g, function(a) {
return (a ^ Math.random() * 16 >> a / 4).toString(16)
});
}
// Creates a named callback in WAMI and returns the name as a string.
Wami.nameCallback = function(cb, cleanup) {
Wami._callbacks = Wami._callbacks || {};
var id = Wami.createID();
Wami._callbacks[id] = function() {
if (cleanup) {
Wami._callbacks[id] = null;
}
cb.apply(null, arguments);
};
var named = "Wami._callbacks['" + id + "']";
return named;
}
// This method ensures that a WAMI recorder is operational, and that
// the following API is available in the Wami namespace. All functions
// must be named (i.e. cannot be anonymous).
//
// Wami.startPlaying(url, startfn = null, finishedfn = null, failedfn = null);
// Wami.stopPlaying()
//
// Wami.startRecording(url, startfn = null, finishedfn = null, failedfn = null);
// Wami.stopRecording()
//
// Wami.getRecordingLevel() // Returns a number between 0 and 100
// Wami.getPlayingLevel() // Returns a number between 0 and 100
//
// Wami.hide()
// Wami.show()
//
// Manipulate the WAMI recorder's settings. In Flash
// we need to check if the microphone permission has been granted.
// We might also set/return sample rate here, etc.
//
// Wami.getSettings();
// Wami.setSettings(options);
//
// Optional way to set up browser so that it's constantly listening
// This is to prepend audio in case the user starts talking before
// they click-to-talk.
//
// Wami.startListening()
//
Wami.setup = function(options) {
if (Wami.startRecording) {
// Wami's already defined.
if (options.onReady) {
options.onReady();
}
return;
}
// Assumes that swfobject.js is included if Wami.swfobject isn't
// already defined.
Wami.swfobject = Wami.swfobject || swfobject;
if (!Wami.swfobject) {
alert("Unable to find swfobject to help embed the SWF.");
}
var _options;
setOptions(options);
embedWamiSWF(_options.id, Wami.nameCallback(delegateWamiAPI));
function supportsTransparency() {
// Detecting the OS is a big no-no in Javascript programming, but
// I can't think of a better way to know if wmode is supported or
// not... since NOT supporting it (like Flash on Ubuntu) is a bug.
//return (navigator.platform.indexOf("Linux") == -1);
// Chamilo change
return true;
}
function setOptions(options) {
// Start with default options
_options = {
swfUrl : "Wami.swf",
onReady : function() {
Wami.hide();
},
onSecurity : checkSecurity,
onError : function(error) {
alert(error);
}
};
if (typeof options == 'undefined') {
alert('Need at least an element ID to place the Flash object.');
}
if (typeof options == 'string') {
_options.id = options;
} else {
_options.id = options.id;
}
if (options.swfUrl) {
_options.swfUrl = options.swfUrl;
}
if (options.onReady) {
_options.onReady = options.onReady;
}
if (options.onLoaded) {
_options.onLoaded = options.onLoaded;
}
if (options.onSecurity) {
_options.onSecurity = options.onSecurity;
}
if (options.onError) {
_options.onError = options.onError;
}
// Create a DIV for the SWF under _options.id
var container = document.createElement('div');
container.style.position = 'absolute';
container.style.marginLeft = '-107px';
container.style.left = '50%';
_options.cid = Wami.createID();
container.setAttribute('id', _options.cid);
var swfdiv = document.createElement('div');
var id = Wami.createID();
swfdiv.setAttribute('id', id);
container.appendChild(swfdiv);
document.getElementById(_options.id).appendChild(container);
_options.id = id;
}
function checkSecurity() {
var settings = Wami.getSettings();
if (settings.microphone.granted) {
_options.onReady();
} else {
// Show any Flash settings panel you want:
// http://help.adobe.com/en_US/FlashPlatform/reference/actionscript/3/flash/system/SecurityPanel.html
Wami.showSecurity("privacy", "Wami.show", Wami
.nameCallback(_options.onSecurity), Wami
.nameCallback(_options.onError));
}
}
// Embed the WAMI SWF and call the named callback function when loaded.
function embedWamiSWF(id, initfn) {
var flashVars = {
visible : false,
loadedCallback : initfn
}
var params = {
allowScriptAccess : "always",
wmode: 'transparent'
}
if (supportsTransparency()) {
params.wmode = "transparent";
}
if (typeof console !== 'undefined') {
flashVars.console = true;
}
var version = '10.0.0';
document.getElementById(id).innerHTML = "WAMI requires Flash "
+ version
+ " or greater<br />https://get.adobe.com/flashplayer/";
// This is the minimum size due to the microphone security panel
Wami.swfobject.embedSWF(_options.swfUrl, id, 214, 137, version, null,
flashVars, params);
// Without this line, Firefox has a dotted outline of the flash
Wami.swfobject.createCSS("#" + id, "outline:none");
}
// To check if the microphone settings were 'remembered', we
// must actually embed an entirely new Wami client and check
// whether its microphone is granted. If it is, it was remembered.
function checkRemembered(finishedfn) {
var id = Wami.createID();
var div = document.createElement('div');
div.style.top = '-999px';
div.style.left = '-999px';
div.setAttribute('id', id);
var body = document.getElementsByTagName('body').item(0);
body.appendChild(div);
var fn = Wami.nameCallback(function() {
var swf = document.getElementById(id);
Wami._remembered = swf.getSettings().microphone.granted;
Wami.swfobject.removeSWF(id);
eval(finishedfn + "()");
});
embedWamiSWF(id, fn);
}
// Attach all the audio methods to the Wami namespace in the callback.
function delegateWamiAPI() {
var recorder = document.getElementById(_options.id);
function delegate(name) {
Wami[name] = function() {
return recorder[name].apply(recorder, arguments);
}
}
delegate('startPlaying');
delegate('stopPlaying');
delegate('startRecording');
delegate('stopRecording');
delegate('startListening');
delegate('stopListening');
delegate('getRecordingLevel');
delegate('getPlayingLevel');
delegate('setSettings');
// Append extra information about whether mic settings are sticky
Wami.getSettings = function() {
var settings = recorder.getSettings();
settings.microphone.remembered = Wami._remembered;
return settings;
}
Wami.showSecurity = function(panel, startfn, finishedfn, failfn) {
// Flash must be on top for this.
var container = document.getElementById(_options.cid);
var augmentedfn = Wami.nameCallback(function() {
checkRemembered(finishedfn);
container.style.cssText = "position: absolute; left:50%; margin-left:-107px";
});
container.style.cssText = "position: absolute; z-index: 99999";
recorder.showSecurity(panel, startfn, augmentedfn, failfn);
}
Wami.show = function() {
if (!supportsTransparency()) {
recorder.style.visibility = "visible";
}
}
Wami.hide = function() {
// Hiding flash in all the browsers is tricky. Please read:
// https://code.google.com/p/wami-recorder/wiki/HidingFlash
if (!supportsTransparency()) {
recorder.style.visibility = "hidden";
}
}
// If we already have permissions, they were previously 'remembered'
Wami._remembered = recorder.getSettings().microphone.granted;
if (_options.onLoaded) {
_options.onLoaded();
}
if (!_options.noSecurityCheck) {
checkSecurity();
}
}
}

@ -134,10 +134,6 @@ $page .= '</div>';
$recordVoiceForm = '<h3 class="page-header">'.get_lang('RecordYourVoice').'</h3>';
$page .= '<div id="doc_form" class="col-md-8">';
$htmlHeadXtra[] = '<script src="'.api_get_path(WEB_LIBRARY_JS_PATH).'rtc/RecordRTC.js"></script>';
$htmlHeadXtra[] = '<script src="'.api_get_path(WEB_LIBRARY_PATH).'wami-recorder/recorder.js"></script>';
$htmlHeadXtra[] = '<script src="'.api_get_path(WEB_LIBRARY_PATH).'wami-recorder/gui.js"></script>';
$htmlHeadXtra[] = '<script type="text/javascript" src="'.api_get_path(WEB_LIBRARY_PATH).'swfobject/swfobject.js"></script>';
$tpl = new Template(get_lang('Add'));
$tpl->assign('unique_file_id', api_get_unique_id());
$tpl->assign('course_code', api_get_course_id());

@ -7,10 +7,6 @@ require_once __DIR__.'/../inc/global.inc.php';
api_block_anonymous_users();
$htmlHeadXtra[] = '<script src="'.api_get_path(WEB_LIBRARY_JS_PATH).'rtc/RecordRTC.js"></script>';
$htmlHeadXtra[] = '<script src="'.api_get_path(WEB_LIBRARY_PATH).'wami-recorder/recorder.js"></script>';
$htmlHeadXtra[] = '<script src="'.api_get_path(WEB_LIBRARY_PATH).'wami-recorder/gui.js"></script>';
$htmlHeadXtra[] = '<script type="text/javascript" src="'.api_get_path(WEB_LIBRARY_PATH).'swfobject/swfobject.js"></script>';
$htmlHeadXtra[] = '<script src="'.api_get_path(WEB_LIBRARY_PATH).'swfobject/swfobject.js"></script>';
$htmlHeadXtra[] = api_get_js('record_audio/record_audio.js');
$tpl = new Template(get_lang('Compose message'), false, false, false, true);

Loading…
Cancel
Save