Cree una variable del tipo Geoubicación y asígnele los valores siguientes:
- Latitud
- Longitud
- Precisión
Gracias a la nueva función de interfaz JavaScript, Adobe Captivate permite a los usuarios crear contenido aún más eficaz. Esta función ofrece una plataforma común para la ejecución de acciones JavaScript entre SWF y HTML. Además, facilita todavía más el acceso al contenido mediante JavaScript.
Ahora, puede escribir fragmentos de código JavaScript más pequeños para acceder a distintas variables del contenido. Puede suscribirse a los distintos eventos generados por el contenido. Además, puede llevar a cabo todas estas pequeñas y eficaces tareas fácilmente, sin preocuparse por si el contenido es SWF o HTML.
La interfaz común de JavaScript puede usarse de dos maneras:
Como puede verse en el diagrama anterior, JavaScript actúa como una interfaz entre el navegador y el contenido (SWF/HTML5).
Este es el objeto principal que contiene toda la interfaz JavaScript. Contiene diversas funciones de utilidad pequeñas que se requieren a menudo en las acciones Ejecutar Javascript.
cpAPIInterface es un objeto disponible en el ámbito de ventana. Para acceder al objeto de interfaz, se recomienda el uso siguiente: window.cpAPIInterface
Métodos:
Nombre |
Descripción |
Parámetros |
Uso |
---|---|---|---|
getVariableValue | Devuelve el valor del nombre de variable proporcionado. | - | window.cpAPIInterface. getVariableValue ("cpQuizInfoStudentID"); |
setVariableValue | Define el valor del nombre de variable proporcionado con el valor especificado. | variableName:Cadena | window.cpAPIInterface. setVariableValue ("cpQuizInfoStudentID", "John"); |
play | Reproduce la película. | window.cpAPIInterface. play(); |
|
pause | Pone en pausa la película. | window.cpAPIInterface. pause(); |
|
stop | Detiene la película. | window.cpAPIInterface. stop(); |
|
rewind | Rebobina y reproduce la película. | window.cpAPIInterface. rewind(); |
|
next | La película pasa a la diapositiva siguiente. | window.cpAPIInterface. next(); |
|
previous | La película pasa a la diapositiva anterior. | window.cpAPIInterface. previous(); |
|
fastForward | Aumenta la velocidad de la película a 2x, después a 4x y después vuelve a la reproducción normal al realizarse llamadas consecutivas. | window.cpAPIInterface. fastForward(); |
|
getPlaySpeed | Devuelve la velocidad de reproducción de la película en fotogramas por segundo (fps). | window.cpAPIInterface. getPlaySpeed(); |
|
getDurationInFrames | Devuelve el número total de fotogramas de la película. | window.cpAPIInterface. getDurationInFrames(); |
|
getDurationInSeconds | Devuelve la duración total de la película en segundos. | window.cpAPIInterface. getDurationInSeconds(); |
|
getVolume | Devuelve el volumen de la película en modo de porcentaje. | window.cpAPIInterface. getVolume(); |
|
setVolume | Define el volumen de la película. | volume:Número (intervalo : 0 - 1) | window.cpAPIInterface. setVolume(0.7); |
navigateToTime | Accede a un tiempo determinado (milisegundos) de la película. | timeInMilliseconds:Número | window.cpAPIInterface. navigateToTime(3000); |
canNavigateToTime | Devuelve el valor booleano que muestra si se puede o no acceder a un tiempo determinado de la película. | timeInMilliseconds:Número | window.cpAPIInterface. canNavigateToTime(3000); |
getCurrentFrame | Devuelve el fotograma actual de la película. | window.cpAPIInterface. getCurrentFrame(); |
|
getCurrentSlideIndex | Devuelve el índice de diapositivas actual de la película. | window.cpAPIInterface. getCurrentSlideIndex(); |
|
getEventEmitter | El identificador se devuelve al objeto cpAPIEventEmitter. | window.cpAPIInterface. getEventEmitter(); |
Este objeto se parece a cualquier otro administrador de eventos. Proporciona un mecanismo para suscribirse o anular la suscripción a distintos eventos generados dentro del contenido.
cpAPIEventEmitter es un objeto disponible en el ámbito de ventana. Para acceder al objeto de interfaz, se recomienda el uso siguiente: window.cpAPIEventEmitter
Métodos:
Nombre | Descripción | Parámetros | Uso |
---|---|---|---|
add EventListener |
Agrega una función de escucha de eventos a un evento determinado. |
|
|
remove EventListener |
Elimina la función de escucha de eventos de un evento determinado. |
|
|
Lista de eventos:
Nombre | Descripción | Datos de evento | Enumeraciones |
---|---|---|---|
CPAPI_SLIDEENTER |
Informa de que la película ha entrado en una nueva diapositiva. | slideNumber=NÚMERO; frameNumber=NÚMERO; lcpversion=CADENA; |
|
CPAPI_SLIDEEXIT |
Informa de que la película está saliendo de una diapositiva. | slideNumber=NÚMERO; frameNumber=NÚMERO; lcpversion=CADENA; percentageSlideSeen= |
|
CPAPI_ STARTPLAYBARSCRUBBING |
Informa de que el usuario ha empezado a desplazarse por la película con la barra de reproducción. | ||
CPAPI_ ENDPLAYBARSCRUBBING |
Informa de que el usuario ha dejado de desplazarse por la película con la barra de reproducción. | ||
CPAPI_ INTERACTIVEITEMSUBMIT |
Informa de que el usuario ha interactuado con un elemento interactivo. | frameNumber=NÚMERO; includedInQuiz=BOOLEANO; issuccess=BOOLEANO; itemname=CADENA; objecttype=NÚMERO; questioneventdata= [object Object]; slideNumber=NÚMERO; |
|
CPAPI_MOVIEPAUSE | Informa de que la película se ha puesto en pausa. | ||
CPAPI_MOVIERESUME | Informa de que la película ha vuelto a reproducirse después de estar en pausa. | ||
CPAPI_MOVIESTART | Informa de que la película se ha iniciado. | ||
CPAPI_MOVIESTOP | Informa de que la película se ha detenido. | ||
CPAPI_QUESTIONSKIP | Informa de que el usuario ha omitido una diapositiva de pregunta. | correctAnswer=CADENA; infiniteAttempts=BOOLEANO; interactionID=NÚMERO; objectiveID=CADENA; questionAnswered=BOOLEANO; questionAnsweredCorrectly =BOOLEANO; questionAttempts=NÚMERO; questionMaxAttempts=NÚMERO; questionMaxScore=NÚMERO; questionNumber=NÚMERO; questionScore=NÚMERO; questionScoringType= [object Object],{Name:CADENA}; questionType=CADENA; quizName=CADENA; reportAnswers=BOOLEANO; selectedAnswer=CADENA; slideNumber=NÚMERO; |
interactionType -
questionType -
questionScoringType
|
CPAPI_QUESTIONSUBMIT | Informa de que el usuario ha respondido a una diapositiva de pregunta. | correctAnswer=CADENA; infiniteAttempts=BOOLEANO; interactionID=NÚMERO; objectiveID=CADENA; questionAnswered=BOOLEANO; questionAnsweredCorrectly= BOOLEANO; questionAttempts=NÚMERO; questionMaxAttempts=NÚMERO; questionMaxScore=NÚMERO; questionNumber=NÚMERO; questionScore=NÚMERO; questionScoringType=[object Object],{Name:CADENA}; questionType=CADENA; quizName=CADENA; reportAnswers=BOOLEANO; selectedAnswer=CADENA; slideNumber=NÚMERO; |
|
CPAPI_ VARIABLEVALUECHANGED |
La suscripción a este evento requiere un parámetro adicional: variableName. Una vez iniciada la suscripción, se notificará cualquier cambio realizado en la variable proporcionada. |
captivateVersion=STRING; |
El contenido de Captivate también publica un evento moduleReadyEvent en el objeto de ventana principal para informar de que el contenido se ha cargado. Los usuarios pueden usar este evento como notificación de la disponibilidad de la interfaz JavaScript. El fragmento de código siguiente le permite agregar una función de escucha a moduleReadyEvent :
window.addEventListener("moduleReadyEvent", function(evt) { //evt.Data lleva el objeto de interfaz. //Es lo mismo que window.cpAPIInterface var interfaceObj = evt.Data; var eventEmitterObj = interfaceObj.getEventEmitter(); });
El código siguiente genera un número aleatorio entre 0 y 1.
alert(Math.random());
El código siguiente genera un número entre 1 y 10.
alert(Math.floor((Math.random()*10)+1));
El código siguiente utiliza una función para generar un número aleatorio entre dos enteros que se transfieren como argumentos en la función.
function getRandomInt(min, max) { var jsRandomNumber = Math.floor(Math.random() * (max - min + 1)) + min; alert(jsRandomNumber); } getRandomInt(10, 300);
Con la geolocalización, puede utilizar la ubicación geográfica del estudiante para activar ciertos eventos en un curso o determinar qué objetos de aprendizaje permanecen ocultos o se muestran.
Puede configurar esta situación utilizando Acciones avanzadas, pero también establecer el soporte de la geolocalización utilizando JavaScript.
Cree una variable del tipo Geoubicación y asígnele los valores siguientes:
Cree un proyecto con dos objetos, ss1 y ss2.
En función de la variable Geoubicación configurada, mostrará el objeto ss2 y ocultará el objeto ss1.
Para ocultar un objeto, utilice cp.hide("object_name");
Para mostrar un objeto, utilice cp.show("object_name");
En la primera diapositiva, seleccione Acciones y Ejecutar JavaScript en la lista desplegable Al entrar. En la ventana Script, introduzca el código siguiente:
window.cpAPIInterface.setVariableValue("cpInfoGeoLocation","BLR"); if (window.cpAPIInterface.getVariableValue("cpInfoGeoLocation")==="BLR") { cp.hide("ss1"); // hide object ss1 cp.show("ss2"); // show object ss2 }
Previsualice el proyecto. En función de la variable Geolocalización, un objeto se muestra o se oculta.
Con el almacenamiento local, puede guardar datos localmente en el navegador. Por ejemplo,
localStorage.setItem("learnerName","John");
Con la notación de puntos,
localStorage.learnerName="John";
En el almacenamiento local, los datos se mantienen incluso después de cerrar y volver a abrir el navegador.
En Adobe Captivate, puede utilizar el almacenamiento local para transferir variables de un curso al siguiente. Para implementar el almacenamiento local,
En un proyecto en blanco, cree una variable learnerName que guarde el nombre del estudiante.
Asigne la variable a un cuadro de entrada de texto. Cualquier nombre que introduzca en el cuadro se asignará a la nueva variable.
Cree un botón junto al cuadro de entrada de texto. Introduzca el código de JavaScript siguiente para que se active el código al hacer clic en el botón.
localStorage.setItem("learnerName", window.cpAPIInterface.getVariableValue("learnerName"));
Previsualice el proyecto en un navegador. Escriba el nombre de un estudiante y haga clic en Enviar. Una vez asignado el nombre a la variable, el valor se guarda en el almacenamiento local.
Abra el modo de depuración del navegador. Por ejemplo, en Chrome, abra el modo de depurador y haga clic en la ficha Recursos. Expanda el almacenamiento local y elija el host deseado.
Puede ver el valor de la variable guardado en el almacenamiento local como par clave-valor.
1 |
Nombre del estudiante. |
2 |
Nombre de la variable. |
3 |
Valor de la variable. |
En el almacenamiento de sesión, los datos almacenados se borran al finalizar la sesión de página. Una sesión de página está activa mientras esté abierta la página en un navegador. Si abre la página en una pestaña o una ventana nuevas, se inicia una sesión nueva.
sessionStorage("learnerName","John");
Para obtener los datos del almacenamiento de sesión,
var myData = sessionStorage.getItem("learnerName");
Para eliminar los datos del almacenamiento de sesión,
sessionStorage.removeItem("learnerName");
en Captivate, puede guardar el nombre de un estudiante en el almacenamiento de sesión. Por ejemplo,
sessionStorage.setItem("newLearner", window.cpAPIInterface.getVariableValue("newLearner"));
Después de previsualizar el proyecto en el navegador, abra la consola de depuración y, en sessionStorage, encontrará el nombre del estudiante, como se muestra a continuación:
1 |
Nombre de la variable. |
2 |
Valor de la variable. |
El código siguiente obtiene un valor de la variable personalizada "mySlideVisitCounter", lo incrementa cuando un usuario entra en una diapositiva y lo define en el contenido.
//comprobar si window.cpAPIInterface is available if(window.cpAPIInterface) { //comprobar si window.cpAPIEventEmitter is available if(window.cpAPIEventEmitter) { //añadir una función de escucha a CPAPI_SLIDEENTER event window.cpAPIEventEmitter.addEventListener("CPAPI_SLIDEENTER",function(e) { //obtener el valor actual de mySlideVisitCounter from Captivate content var lSlideVisitCtr = window.cpAPIInterface.getVariableValue("mySlideVisitCounter"); //incrementar lSlideVisitCtr by 1 lSlideVisitCtr = lSlideVisitCtr + 1; //establecer el valor de mySlideVisitCounter en el contenido de Captivate window.cpAPIInterface.setVariableValue("mySlideVisitCounter",lSlideVisitCtr); }); } }
El código anterior puede usarse de la manera siguiente:
Es posible ejecutar acciones de Javascript desde cualquier acción de Captivate, como se muestra en la captura de pantalla siguiente:
Modificar el contenido publicado
También puede publicar el contenido y, a continuación, acceder a interior del contenido mediante la interfaz JavaScript desde fuera.
Agregue el fragmento de código siguiente a la salida HTML publicada:
<script> var interfaceObj; var eventEmitterObj; window.addEventListener("moduleReadyEvent", function(evt) { //evt.Data lleva la interfaz del objeto. //Es lo mismo quie window.cpAPIInterface interfaceObj = evt.Data; eventEmitterObj = interfaceObj.getEventEmitter(); }); //comprobar si window.cpAPIInterface está disponible if(interfaceObj) { //comprobar si window.cpAPIEventEmitter está disponible if(eventEmitterObj) { //añadir una función de escucha al evento CPAPI_SLIDEENTER eventEmitterObj.addEventListener("CPAPI_SLIDEENTER",function(e) { //obtener el valor actual de mySlideVisitCounter del contenido de Captivate var lSlideVisitCtr = interfaceObj.getVariableValue("mySlideVisitCounter"); //incrementar lSlideVisitCtr by 1 lSlideVisitCtr = lSlideVisitCtr + 1; //establecer el valor de mySlideVisitCounter en el contenido de Captivate interfaceObj.setVariableValue("mySlideVisitCounter",lSlideVisitCtr); }); } } </script>
Inicia sesión en tu cuenta