RecordRTC

De MoodleDocs


¿Qué es RecordRTC?

RecordRTC (GrabarRTC) es una característica estándar del Editor de texto que le permite a los usuarios grabar audio, video o la pantalla en cualquier lado en donde esté presente un editor de texto. Este plugin añade botones para grabar a la barra de herramientas del editor.

Usando tecnologías WebRTC, todas las grabaciones se hacen instantáneamente en el navegador. Después de grabar, los usuarios pueden incrustar la anotación directamente adentro del texto que actualmente están editando. Las grabaciones aparecerán como un reproductor de audio o video en el escrito publicado.

El plugin funciona bien con Chrome, Firefox y Opera en computadoras de escritorio que ejecutan Windows Linux, Mac OS y Chrome OS.

¿ Cuales son las configuraciones administrativas ?

En la Administración del sitio > Plugins > Editores de texto > Editor TinyMCE > RecordRTC usted puede:

  • Seleccionar los tipos de grabación - Audio, Video o Pantalla
  • Configurar la tasa de muestreo (bitrate) para grabaciones de audio, video y pantalla
  • Configurar el límite de tiempo para grabaciones grabaciones de audio, video y pantalla
  • Configurar el tamaño de la grabación de pantalla
  • Permitir que se pueda pausar la grabación

La tasa de muestreo (bitrate) predeterminada para grabaciones de audio (128000) debería producir archivos de aproximadamente 15kB por minuto, y la tasa de muestreo (bitrate) para grabación de video (2500000) debería generar archivos de 20MB por minuto. Mientras más baja sea la tasa de muestreo (bitrate) menor será el tamaño del archivo producido.

El límite de tiempo de grabación está configurado a 120 segundos de forma predeterminada, por lo que el tamaño máximo esperado de los archivos de video debería ser alrededor de 40MB.

Capacidades

Hay tres capacidades para controlar quienes pueden grabar audio, video o pantalla:


De forma predeterminada, todas las capacidades están permitidas ara el rol de usuario autenticado. Para restringir la grabación a ciertos roles, usted necesita desactivar la capacidad desde el rol del usuario autenticado y permitirla para otros roles que la requieran.

¿ Cómo funciona ?

  • El editor de texto mostrará íconos para audio o video, dependiendo de las configuraciones del administrador.

ícons para audio y video en la barra de herramientas

  • Haga clic en el ícono para grabación de audio o video. Usted verá un botón ára 'Iniciar grabación'. Actívelo y hable.

attachasannotation.png

  • Cuando usted haya terminado, haga clic para detener la grabación. Le preguntará el nombre a usar y anexará la grabación.

Solución de problemas

La grabación se detiene después de unos pocos segundos

recordingrtc error limit reached.png

Hay dos configuraciones que establecen el tamaño máximo del archivo que puede ser subido a Moodle. Estos ajustes están definidos en el archivo php.ini para el servidor web.

post_max_size = 8M
upload_max_filesize = 2M

Usted simplemente edita el archivo y aumenta sus valorees a algo alrededor de 40M-50M para grabaciones de video de 2 minutos. En Ubuntu

vi /etc/php/7.0/apache2/php.ini

Usted puede configurar algunos valores más grandes como se describe en this Moodle tracker issue:

post_max_size = 1024M
upload_max_filesize = 1024M 
translator note icon.png Nota del traductor: Yo uso valores de 2000M para estas variables porque a veces necesito subir archivos de respaldos de Moodle muy grandes


Nota: Pendiente de Traducir. ¡Anímese a traducir esta página!.     ( y otras páginas pendientes)

Problemas conocidos

  • The media files don't show duration
  • The controls for navigating the files do not work properly in the player.

FAQ

¿ Porqué estos plugins no funcionan con todos los navegadores ?

WebRTC ("Web Real-Time Communication") is a collection of communications protocols and application programming interfaces that enable real-time communication over peer-to-peer connections. Implemented in browsers it enables applications such as video conferencing, file transfer, chat, or desktop sharing without the need of either internal or external plugins.[Wikipedia]

MediaStream Recording API, sometimes simply referred to as the Media Recording API or the MediaRecorder API, is closely affiliated with the Media Capture and Streams API and the WebRTC API. The MediaStream Recording API makes it easy to record audio and/or video streams. When used with navigator.mediaDevices.getUserMedia(), it provides an easy way to record from the user's input devices and instantly use the result in web apps. Both audio and video may be recorded, separately or together. [MediaRecorder Documentation]

As these plugins make use of diverse WebRTC technologies, they can only be used in browsers that have implemented both WebRTC 1.0 and MediaRecorder API. This is the case for Chrome, Firefox and Opera. See `Supported browsers and platforms` Therefore, these are the only ones that the initial version of these plugins (1.0) support.

Edge has implemented WebRTC 1.0 in Microsoft Edge but it does not include MediaRecorder API, so implementing the plugins for this browser requires some customisation to the libraries and the use of an external server.

Safari 11 for iOS will support WebRTC 1.0 [See] but same as edge, the implementation of MediaRecorder API has not been announced.

As this covers only about the 60% of the browsers, there are plans for adding support to these two browsers by making use of Media Streaming as in version 2.0 of these plugins.

¿ Puedo tener grabaciones de más de dos minutos ?

Yes. That can be changed in the plugin configuration. Keep in mind that as the file size will increase, the settings in php should also be edited. Also, because the size can be too much for the browser itself, we recommend not going to large. The only solution for giving a really large limit to the file size is to include a server component for doing a progressive upload and trans coding. But the first version of these plugins do not cover that possibility.

¿ En donde se almacenan las grabaciones ?

Storing the RecordRTC recordings is not different than storing any other media file that is uploaded to Moodle. So, it depends of the file system your Moodle server has configured. When using the default configuration, all files are stored in /moodlepath/moodledata/filedir/xx/yy/ where xx and yy are the path defined by the API when the file was uploaded. If you are a developer interested in learning more details about this you can see File storage on disk. It is an old article but it gives a good idea on what is underneath. Also see Amazon S3 repository for information on storing files externally in Amazon S3 buckets.

¿ Cómo lo configuro con Ubuntu?

Notas para los administradores de sistema

Aumento del tamaño máximo del archivo

The default maximum size of uploads in PHP is very small, it is recommended to set the upload_max_filesize setting to 40M and the post_max_size setting to 50M for a time limit of 2:00 to avoid getting an alert while recording.

The file size of recorded video for Firefox will likely be twice that of other browsers, even with the same settings; this is expected as it uses a different writing library for recording video. The audio file size should be similar across all browsers.

Notas para desarrolladores

Actualización de bibliotecas (librerías)

These plugins makes use of two libraries. Adapter.js which makes all the WebRTC magic and Bowser.js that helps to identify the browser and OS where the application is running.

If trying to update Bowser or Adapter.js dependencies for the project, it is necessary to replace the named definition at the top of the file with an anonymous one, like so For Bowser.js:

Old code: !function (root, name, definition) { if (typeof module != 'undefined' && module.exports) module.exports = definition() else if (typeof define == 'function' && define.amd) define(name, definition) else root[name] = definition() }(this, 'bowser', function () {

New code: define([], function() {

Or so for Adapter.js:

Old code (function(f){if(typeof exports==="object"&&typeof module!=="undefined"){module.exports=f()}else if(typeof define==="function"&&define.amd){define([],f)}else{var g;if(typeof window!=="undefined"){g=window}else if(typeof global!=="undefined"){g=global}else if(typeof self!=="undefined"){g=self}else{g=this}g.adapter = f()}})(function(){

New code define([], function() {