MDL-81478 tiny_recordrtc: Add webm audio support as a fallback

Co-authored-by: Djarran Cotleanu <[email protected]>
This commit is contained in:
meirzamoodle
2025-01-08 11:41:12 +07:00
co-authored by Djarran Cotleanu
parent c58bc49a07
commit a79727f18e
3 changed files with 17 additions and 6 deletions
@@ -1,3 +1,3 @@
define("tiny_recordrtc/audio_recorder",["exports","./base_recorder","./modal","tiny_recordrtc/common"],(function(_exports,_base_recorder,_modal,_common){function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _defineProperty(obj,key,value){return key in obj?Object.defineProperty(obj,key,{value:value,enumerable:!0,configurable:!0,writable:!0}):obj[key]=value,obj}Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.default=void 0,_base_recorder=_interopRequireDefault(_base_recorder),_modal=_interopRequireDefault(_modal);class Audio extends _base_recorder.default{configurePlayer(){return this.modalRoot.querySelector("audio")}getSupportedTypes(){return["audio/ogg;codecs=opus","audio/mp4;codecs=opus","audio/mp4;codecs=wav","audio/mp4;codecs=mp3"]}getRecordingOptions(){return{audioBitsPerSecond:parseInt(this.config.audiobitrate)}}getMediaConstraints(){return{audio:!0}}getRecordingType(){return"audio"}getTimeLimit(){return this.config.audiotimelimit}getEmbedTemplateName(){return"tiny_recordrtc/embed_audio"}getFileName(prefix){return"".concat(prefix,"-audio.").concat(this.getFileExtension())}getFileExtension(){return window.MediaRecorder.isTypeSupported("audio/ogg")?"ogg":window.MediaRecorder.isTypeSupported("audio/mp4")?"mp4":(window.console.warn("Unknown file type for MediaRecorder API"),"")}static getModalClass(){var _class;return _defineProperty(_class=class extends _modal.default{},"TYPE","".concat(_common.component,"/audio_recorder")),_defineProperty(_class,"TEMPLATE","".concat(_common.component,"/audio_recorder")),_class}}return _exports.default=Audio,_exports.default}));
define("tiny_recordrtc/audio_recorder",["exports","./base_recorder","./modal","tiny_recordrtc/common"],(function(_exports,_base_recorder,_modal,_common){function _interopRequireDefault(obj){return obj&&obj.__esModule?obj:{default:obj}}function _defineProperty(obj,key,value){return key in obj?Object.defineProperty(obj,key,{value:value,enumerable:!0,configurable:!0,writable:!0}):obj[key]=value,obj}Object.defineProperty(_exports,"__esModule",{value:!0}),_exports.default=void 0,_base_recorder=_interopRequireDefault(_base_recorder),_modal=_interopRequireDefault(_modal);class Audio extends _base_recorder.default{constructor(){super(...arguments),_defineProperty(this,"fileExtensions",{"audio/ogg":"ogg","audio/mp4":"mp4","audio/webm":"webm"})}configurePlayer(){return this.modalRoot.querySelector("audio")}getSupportedTypes(){return["audio/ogg;codecs=opus","audio/mp4;codecs=opus","audio/mp4;codecs=wav","audio/mp4;codecs=mp3","audio/webm;codecs=opus"]}getRecordingOptions(){return{audioBitsPerSecond:parseInt(this.config.audiobitrate)}}getMediaConstraints(){return{audio:!0}}getRecordingType(){return"audio"}getTimeLimit(){return this.config.audiotimelimit}getEmbedTemplateName(){return"tiny_recordrtc/embed_audio"}getFileName(prefix){return"".concat(prefix,"-audio.").concat(this.getFileExtension())}getFileExtension(){const options=super.getParsedRecordingOptions();if(null!=options&&options.mimeType){const mimeType=options.mimeType.split(";")[0];return this.fileExtensions[mimeType]}return window.console.warn("Unknown file type for MediaRecorder API"),""}static getModalClass(){var _class;return _defineProperty(_class=class extends _modal.default{},"TYPE","".concat(_common.component,"/audio_recorder")),_defineProperty(_class,"TEMPLATE","".concat(_common.component,"/audio_recorder")),_class}}return _exports.default=Audio,_exports.default}));
//# sourceMappingURL=audio_recorder.min.js.map
@@ -1 +1 @@
{"version":3,"file":"audio_recorder.min.js","sources":["../src/audio_recorder.js"],"sourcesContent":["// This file is part of Moodle - http://moodle.org/\n//\n// Moodle is free software: you can redistribute it and/or modify\n// it under the terms of the GNU General Public License as published by\n// the Free Software Foundation, either version 3 of the License, or\n// (at your option) any later version.\n//\n// Moodle is distributed in the hope that it will be useful,\n// but WITHOUT ANY WARRANTY; without even the implied warranty of\n// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n// GNU General Public License for more details.\n//\n// You should have received a copy of the GNU General Public License\n// along with Moodle. If not, see <http://www.gnu.org/licenses/>.\n\n/**\n * Tiny Record RTC - audio recorder configuration.\n *\n * @module tiny_recordrtc/audio_recorder\n * @copyright 2022 Stevani Andolo <[email protected]>\n * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later\n */\n\nimport BaseClass from './base_recorder';\nimport Modal from './modal';\nimport {component} from 'tiny_recordrtc/common';\n\nexport default class Audio extends BaseClass {\n configurePlayer() {\n return this.modalRoot.querySelector('audio');\n }\n\n getSupportedTypes() {\n return [\n // Firefox supports webm and ogg but Chrome only supports ogg.\n // So we use ogg to maximize the compatibility.\n 'audio/ogg;codecs=opus',\n\n // Safari supports mp4.\n 'audio/mp4;codecs=opus',\n 'audio/mp4;codecs=wav',\n 'audio/mp4;codecs=mp3',\n ];\n }\n\n getRecordingOptions() {\n return {\n audioBitsPerSecond: parseInt(this.config.audiobitrate),\n };\n }\n\n getMediaConstraints() {\n return {\n audio: true,\n };\n }\n\n getRecordingType() {\n return 'audio';\n }\n\n getTimeLimit() {\n return this.config.audiotimelimit;\n }\n\n getEmbedTemplateName() {\n return 'tiny_recordrtc/embed_audio';\n }\n\n getFileName(prefix) {\n return `${prefix}-audio.${this.getFileExtension()}`;\n }\n\n getFileExtension() {\n if (window.MediaRecorder.isTypeSupported('audio/ogg')) {\n return 'ogg';\n } else if (window.MediaRecorder.isTypeSupported('audio/mp4')) {\n return 'mp4';\n }\n\n window.console.warn(`Unknown file type for MediaRecorder API`);\n return '';\n }\n\n static getModalClass() {\n return class extends Modal {\n static TYPE = `${component}/audio_recorder`;\n static TEMPLATE = `${component}/audio_recorder`;\n };\n }\n}\n"],"names":["Audio","BaseClass","configurePlayer","this","modalRoot","querySelector","getSupportedTypes","getRecordingOptions","audioBitsPerSecond","parseInt","config","audiobitrate","getMediaConstraints","audio","getRecordingType","getTimeLimit","audiotimelimit","getEmbedTemplateName","getFileName","prefix","getFileExtension","window","MediaRecorder","isTypeSupported","console","warn","Modal","component"],"mappings":"ikBA2BqBA,cAAcC,uBAC/BC,yBACWC,KAAKC,UAAUC,cAAc,SAGxCC,0BACW,CAGH,wBAGA,wBACA,uBACA,wBAIRC,4BACW,CACHC,mBAAoBC,SAASN,KAAKO,OAAOC,eAIjDC,4BACW,CACHC,OAAO,GAIfC,yBACW,QAGXC,sBACWZ,KAAKO,OAAOM,eAGvBC,6BACW,6BAGXC,YAAYC,wBACEA,yBAAgBhB,KAAKiB,oBAGnCA,0BACQC,OAAOC,cAAcC,gBAAgB,aAC9B,MACAF,OAAOC,cAAcC,gBAAgB,aACrC,OAGXF,OAAOG,QAAQC,gDACR,oEAIA,cAAcC,kCACAC,kFACIA"}
{"version":3,"file":"audio_recorder.min.js","sources":["../src/audio_recorder.js"],"sourcesContent":["// This file is part of Moodle - http://moodle.org/\n//\n// Moodle is free software: you can redistribute it and/or modify\n// it under the terms of the GNU General Public License as published by\n// the Free Software Foundation, either version 3 of the License, or\n// (at your option) any later version.\n//\n// Moodle is distributed in the hope that it will be useful,\n// but WITHOUT ANY WARRANTY; without even the implied warranty of\n// MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the\n// GNU General Public License for more details.\n//\n// You should have received a copy of the GNU General Public License\n// along with Moodle. If not, see <http://www.gnu.org/licenses/>.\n\n/**\n * Tiny Record RTC - audio recorder configuration.\n *\n * @module tiny_recordrtc/audio_recorder\n * @copyright 2022 Stevani Andolo <[email protected]>\n * @license http://www.gnu.org/copyleft/gpl.html GNU GPL v3 or later\n */\n\nimport BaseClass from './base_recorder';\nimport Modal from './modal';\nimport {component} from 'tiny_recordrtc/common';\n\nexport default class Audio extends BaseClass {\n\n // A mapping of MIME types to their corresponding file extensions.\n fileExtensions = {\n 'audio/ogg': 'ogg',\n 'audio/mp4': 'mp4',\n 'audio/webm': 'webm',\n };\n\n configurePlayer() {\n return this.modalRoot.querySelector('audio');\n }\n\n getSupportedTypes() {\n return [\n // Firefox supports webm and ogg but Chrome only supports ogg.\n // So we use ogg to maximize the compatibility.\n 'audio/ogg;codecs=opus',\n\n // Safari supports mp4.\n 'audio/mp4;codecs=opus',\n 'audio/mp4;codecs=wav',\n 'audio/mp4;codecs=mp3',\n\n // Set webm as a fallback.\n 'audio/webm;codecs=opus',\n ];\n }\n\n getRecordingOptions() {\n return {\n audioBitsPerSecond: parseInt(this.config.audiobitrate),\n };\n }\n\n getMediaConstraints() {\n return {\n audio: true,\n };\n }\n\n getRecordingType() {\n return 'audio';\n }\n\n getTimeLimit() {\n return this.config.audiotimelimit;\n }\n\n getEmbedTemplateName() {\n return 'tiny_recordrtc/embed_audio';\n }\n\n getFileName(prefix) {\n return `${prefix}-audio.${this.getFileExtension()}`;\n }\n\n getFileExtension() {\n const options = super.getParsedRecordingOptions(); // Call parent method.\n if (options?.mimeType) {\n const mimeType = options.mimeType.split(';')[0];\n return this.fileExtensions[mimeType];\n }\n\n window.console.warn(`Unknown file type for MediaRecorder API`);\n return '';\n }\n\n static getModalClass() {\n return class extends Modal {\n static TYPE = `${component}/audio_recorder`;\n static TEMPLATE = `${component}/audio_recorder`;\n };\n }\n}\n"],"names":["Audio","BaseClass","configurePlayer","this","modalRoot","querySelector","getSupportedTypes","getRecordingOptions","audioBitsPerSecond","parseInt","config","audiobitrate","getMediaConstraints","audio","getRecordingType","getTimeLimit","audiotimelimit","getEmbedTemplateName","getFileName","prefix","getFileExtension","options","super","getParsedRecordingOptions","mimeType","split","fileExtensions","window","console","warn","Modal","component"],"mappings":"ikBA2BqBA,cAAcC,+FAGd,aACA,kBACA,mBACC,SAGlBC,yBACWC,KAAKC,UAAUC,cAAc,SAGxCC,0BACW,CAGH,wBAGA,wBACA,uBACA,uBAGA,0BAIRC,4BACW,CACHC,mBAAoBC,SAASN,KAAKO,OAAOC,eAIjDC,4BACW,CACHC,OAAO,GAIfC,yBACW,QAGXC,sBACWZ,KAAKO,OAAOM,eAGvBC,6BACW,6BAGXC,YAAYC,wBACEA,yBAAgBhB,KAAKiB,oBAGnCA,yBACUC,QAAUC,MAAMC,+BAClBF,MAAAA,SAAAA,QAASG,SAAU,OACbA,SAAWH,QAAQG,SAASC,MAAM,KAAK,UACtCtB,KAAKuB,eAAeF,iBAG/BG,OAAOC,QAAQC,gDACR,mEAIA,cAAcC,kCACAC,kFACIA"}
@@ -26,6 +26,14 @@ import Modal from './modal';
import {component} from 'tiny_recordrtc/common';
export default class Audio extends BaseClass {
// A mapping of MIME types to their corresponding file extensions.
fileExtensions = {
'audio/ogg': 'ogg',
'audio/mp4': 'mp4',
'audio/webm': 'webm',
};
configurePlayer() {
return this.modalRoot.querySelector('audio');
}
@@ -40,6 +48,9 @@ export default class Audio extends BaseClass {
'audio/mp4;codecs=opus',
'audio/mp4;codecs=wav',
'audio/mp4;codecs=mp3',
// Set webm as a fallback.
'audio/webm;codecs=opus',
];
}
@@ -72,10 +83,10 @@ export default class Audio extends BaseClass {
}
getFileExtension() {
if (window.MediaRecorder.isTypeSupported('audio/ogg')) {
return 'ogg';
} else if (window.MediaRecorder.isTypeSupported('audio/mp4')) {
return 'mp4';
const options = super.getParsedRecordingOptions(); // Call parent method.
if (options?.mimeType) {
const mimeType = options.mimeType.split(';')[0];
return this.fileExtensions[mimeType];
}
window.console.warn(`Unknown file type for MediaRecorder API`);