El archivo WDGT es un archivo con la extensión .wdgt que contiene:

  • Archivos SWF con enlaces a otros recursos o archivos SWF

  • Una versión HTML del widget

  • El archivo description.xml que contiene información acerca de los vínculos

Los archivos HTML son necesarios para los archivos de salida HTML5. Si desea generar solo los archivos de salida SWF de los proyectos de Adobe Captivate, el archivo WDGT no debe contener los archivos HTML.

Creación de archivos WDGT solo para archivos de salida SWF

Un archivo WDGT para archivos de salida SWF debe contener los siguientes elementos:

  • swf (directorio): contiene el archivo de salida SWF del widget y otros recursos asociados.

  • description.xml (archivo): contiene información sobre el archivo SWF y versiones en HTML del widget que Adobe Captivate puede usar para publicar y mostrar el widget a los usuarios.

  1. Cree un nuevo directorio y asígnele el nombre correspondiente, por ejemplo, miwidget. A continuación, cree un subdirectorio: swf.

  2. Publique el archivo FLA como archivo SWF en Flash. Coloque el archivo SWF en el directorio swf.

  3. Cree un archivo description.xml. Si el archivo SWF principal ABC.swf utiliza dos archivos vinculados PQR.swf y XYZ.swf, el archivo description.xml tendrá el siguiente formato:

    <?xml version="1.0" encoding="ISO-8859-1" ?> 
    <widget> 
    <Description>This is a ABC widget(static)</Description> 
    <Type>isStatic</Type> 
    <Name>ABC.swf</Name> 
    <linkedfiles>PQR.swf</linkedfiles> 
    <linkedfiles>XYZ.swf</linkedfiles> 
    </widget>
  4. Coloque el archivo description.xml en el directorio raíz, que, en este caso, es miwidget.

  5. Comprima el directorio raíz (directorio miwidget) y cambie la extensión del archivo a .wdgt.

  6. Coloque el archivo .wdgt. en <directorio de instalación de Adobe Captivate>/Gallery/Widgets.

Creación de archivos WDGT para archivos de salida SWF y HTML5

Un archivo WDGT para archivos de salida SWF y HTML5 debe contener los siguientes archivos y directorios:

  • swf (directorio): contiene el archivo de salida SWF del widget y de otros recursos asociados.

  • html5 (directorio): contiene los recursos y los scripts relacionados con el widget creado en HTML y javascript. Esta es la estructura típica de directorio:

    • imágenes (directorio)

    • scripts (directorio)

    • xyz_oam.xml (archivo)

    El directorio html5 puede contener otros directorios de recursos, como los temas. Debe crear el archivo xml de metadatos openAJAX (xyz_oam.xml) para almacenar toda la información de los widgets como, por ejemplo, secuencias de comandos y recursos.

  • description.xml (archivo): contiene información sobre las versiones SWF y HTML del widget que Adobe Captivate puede usar para publicar y mostrar el widget a los usuarios.

  1. Cree un nuevo directorio y asígnele el nombre correspondiente, por ejemplo, miwidgethtml. A continuación, cree los siguientes subdirectorios:

    • swf

    • html5

  2. Publique el archivo FLA como archivo SWF en Flash. Coloque el archivo SWF en el directorio swf.

  3. Cree el widget mediante HTML y JavaScript.

  4. Coloque todos los recursos y las secuencias de comandos en el directorio html5.

  5. Cree un archivo XML de metadatos OpenAjax que almacene toda la información relevante del widget, como por ejemplo, las secuencias de comandos y las bibliotecas javascript.

    Para obtener más información sobre el esquema OpenAjax, consulte esta página web.

    A continuación, se muestra un ejemplo:

    <?xml version="1.0" encoding="UTF-8"?> 
    <!-- 
     
            OpenAjax Alliance Widget Specification 
    --> 
    <widget name="Arrow" id="com.adobe.captivate.dev.sample.widgets.arrow" 
            spec="0.1b" jsClass='Arrow' sandbox='true' width='300' height='300' 
            xmlns="http://openajax.org/metadata"> 
     
        <requires> 
            <libraries> 
                <library name="dojo" version="1.7" copy="true" src="js/dojo-release-1.7.1" includeRef="false"> 
                    <preload> 
                        djConfig="{parseOnLoad:true}" 
                    </preload> 
                    <require type="javascript" src="dojo/dojo.js" copy="false" includeRef="true"/> 
                </library> 
                <library name ="jQuery" version="1.6.1" copy="true" src="js/jquery1.7.1/jquery-1.7.1.min.js" type="javascript"/> 
                <library name="jQuery.svg" version="1.4.4" copy="false" src="js/jquery.svg" includeRef="false"> 
                    <require type="javascript" src="jquery.svg.js"/> 
                    <require type="css" src="jquery.svg.css"/> 
                </library> 
            </libraries> 
            <require type="folder" src="assets/svg"/> 
        </requires> 
        <javascript src="js/arrow.js"/> 
        <!-- 
     
            Properties are currently ignored by captivate since we expect the widget to do all the work that has to be done from widget xml 
            or the widget JSON. Still we give it a stab to see if we can get in property replacement 
        --> 
        <properties> 
          <property name="style" datatype="String" default="AeroArrow"/> 
        </properties> 
     
        <content type='fragment'> 
        <![CDATA[ 
            <H1>Hello Widget!!!</H1> 
            <div ID="__WID___ArrowShape"/> 
        ]]> 
        </content> 
    </widget>
  6. Abra el javascript que corresponde al valor especificado para el atributo jsclass en el archivo XML de metadatos. Por ejemplo, si el valor jsclass es Arrow, abra el archivo arrow.js del directorio scripts.

  7. Asegúrese de que el archivo arrow.js incluye la función onLoad() que invoca la función getMovieProps(). A continuación, se muestra un ejemplo:

    arrow1 = { 
        onLoad: function() 
        { 
            if ( ! this.captivate ){ 
                return; 
            } 
            //Gives access to the the movie handle 
            this.movieProps = this.captivate.CPMovieHandle; 
            //Gives access to the widget params 
            this.movieProps = this.captivate.CPMovieHandle.widgetParams(); 
            //Function to replace all instances 
            //of a Captivate variable by their associated values 
            this.movieProps = this.captivate.CPMovieHandle.replaceVariables(varString); 
            //Access to the event dispatcher where addEventListener and 
            //removeEventListener can be called. Also contains the constants 
            //needed for registering for events such as 
            //<Widget>.captivate. CPMovieHandle.getMovieProps().eventDispatcher 
            //.SLIDE_ENTER_EVENT 
            this.movieProps = this.captivate.CPMovieHandle.getMovieProps().eventDispatcher; 
            //Access to the variables handle 
            this.movieProps = this.captivate.CPMovieHandle.getMovieProps().variablesHandle; 
            //Access to the external resource loader 
            this.movieProps = this.captivate.CPMovieHandle.getMovieProps().ExternalResourceLoader); 
            if ( ! this.movieProps ){ 
                return; 
            } 
            this.varHandle = this.movieProps.variablesHandle; 
            this.eventDisp = this.movieProps.eventDispatcher; 
            // other code 
        }; 
        //To unload your widget 
        onUnload: function() 
        { 
            /*Unload your widget here*/ 
        }; 
    } 
    // Ensure that there is a constructor function 
    // available for the JavaScript class identified by 
    // the 'jsClass' attribute. The constructor has no arguments. 
    arrow = function () 
    { 
        return arrow1; 
    }

    Nota:

    • no registre directamente controladores de sucesos onload de navegador (por ejemplo, window.addEventListener('load',myCallback,0);) para que el widget sea portátil en muchos escenarios, entre ellos los de tiempo de ejecución dinámicos donde el widget se puede añadir al documento después de realizarse el evento de 'carga' del navegador.

      En su lugar, los widgets deben basarse en la función de callback onLoad definida en esta especificación para notificar que el widget ha terminado de cargar y está listo para el procesamiento.

    • no registre directamente controladores de sucesos onunload de navegador (por ejemplo, window.addEventListener('unload',myCallback,0);) para que el widget sea portátil en muchos escenarios, entre ellos los de tiempo de ejecución dinámicos donde el widget se puede quitar del documento mucho antes de la página descargada.

      En su lugar, los widgets deben basarse en la función de callback onUnload definida en esta especificación para notificar que el widget se va a quitar de la página.

    Para obtener más información sobre getMovieProps(), consulte Métodos y propiedades.

  8. Coloque el archivo XML de metadatos OpenAjax en el directorio html5.

  9. Cree el archivo description.xml.

    Para obtener más información sobre el esquema del archivo description.xml, consulte esquema de description.xml.

  10. Coloque el archivo description.xml en el directorio raíz (en este caso, el directorio miwidgethtml).

  11. Comprima el directorio raíz (directorio miwidgethtml) y cambie la extensión del archivo a .wdgt.

  12. Coloque el archivo .wdgt. en <directorio de instalación de Adobe Captivate>Gallery/Widgets.

Muestra del archivo description.xml

Si el archivo SWF principal es ABC.swf y el archivo XML openAJAX que creó es XYZ_oam.xml, el archivo description.xml es:

<?xml version="1.0" encoding="ISO-8859-1" ?> 
<!-- widget header 
      spec - compulsorily required. if not present will be treated as spec 1 which doesnt support html5 etc 
      version - widget version number 
      type - widget type 
-->         
<widget spec="2" name="Certificate" description="This is a test for Process Tabs" uri="www.mycomapny.com" version="1.0" type="static"> 
    <!-- Authors header - Can contain multiple authors      
    --> 
    <authors> 
    <!-- Author header - author info 
        about is to show off some skills like i am cool widget developer. contact me for custom widgets 
    --> 
        <author name="Dominique Skyler" email="dominique@mycomapny.com" organization="MyCompany" uri="www.mycompany.com"> 
            <about>Widget Developer</about> 
        </author> 
    </authors> 
    <!-- license info - author info 
    --> 
    <license name="CC" description="Creative Commons License" text="Feel free to use this" uri="http://creativecommons.org/licenses/by/3.0/"/> 
     
    <!-- different output formats supported 
        each format has one directory in the wgt file 
        paths can refer to other formats by using .. notation 
    --> 
    <formats> 
        <!-- for the output format swf 
        --> 
        <format type="swf"> 
            <content source="ABC.swf"/> 
        </format> 
        <!-- for the html5 output --> 
        <format type="html5"> 
            <!-- reference to the oam file --> 
            <content source="XYZ.xml"/>             
        </format> 
    </formats> 
</widget>

esquema de description.xml

widget

<widget> es el elemento raíz que define un solo widget e incluye los siguientes elementos secundarios:

  • autores

  • licencia

  • formatos

El elemento <widget> incluye los siguientes atributos:

Atributo

Descripción

Tipo

Obligatorio

Valor

especificación

Indica la especificación en la que se basa el XML. El valor predeterminado '2' indica que el archivo XML incluye información sobre la versión HTML del widget.

Entero positivo

2

nombre

Nombre del widget.

Cadena

No

N/D

descripción

Descripción del widget.

Cadena

No

N/D

uri

URL de la página Web correspondiente, por ejemplo, sitio Web de la empresa.

Cadena

No

N/D

versión

Versión del widget.

Entero positivo.

No

N/D

tipo

El tipo de widget: estático o interactivo.

Cadena

  • estático

  • interactivo

autores

<autores> es el elemento secundario del elemento <widget> e incluye los siguientes atributos:

Atributo

Descripción

Tipo

Requerido

Valores predeterminados

nombre

Nombre del desarrollador o autor del widget.

Cadena

No

N/D

correo electrónico

ID de correo electrónico del desarrollador o autor del widget.

Cadena

No

N/D

organización

Nombre de la organización del desarrollador o autor del widget.

Cadena

No

N/D

uri

URL del sitio Web de la organización o cualquier otro sitio Web que el autor desee mencionar.

Cadena

No

N/D

Nota:

todos estos atributos se omiten en esta versión de Adobe Captivate.

licencia

<licencia> es el elemento secundario del elemento <widget> e incluye los siguientes atributos:

Atributo

Descripción

Tipo

Requerido

Valores predeterminados

nombre

Un nombre corto para la licencia de widget.

Cadena

No

N/D

descripción

Descripción de la licencia del widget.

Cadena

No

N/D

texto

El texto de la licencia que desea mostrar con el widget.

También puede incluir texto de las licencias del software de otros fabricantes utilizado en el widget.

Cadena

No

N/D

uri

Vínculo al sitio Web donde los usuarios del widget pueden encontrar más información sobre la licencia.

Cadena

No

N/D

Nota:

todos estos atributos se omiten en esta versión de Adobe Captivate.

formatos y formato

<formatos> incluye el elemento secundario <formato>, que incluye los nombres de las versiones SWF y HTML del widget.

El elemento <formato> incluye el atributo siguiente:

Atributo

Descripción

Tipo

Requerido

Valor

tipo

El tipo de origen: SWF o HTML.

Cadena

  • swf

  • html5

contenido

<contenido> es el elemento secundario de <formato> e incluye el siguiente atributo:

Atributo

Descripción

Tipo

Requerido

Valor

origen

Se refiere al archivo de salida SWF o la versión HTML del widget.

Cadena

Nombre del archivo SWF o el archivo XML de metadatos de la versión HTML del widget.

Esta obra está autorizada con arreglo a la licencia de Reconocimiento-NoComercial-CompartirIgual 3.0 Unported de Creative Commons.  Los términos de Creative Commons no cubren las publicaciones en Twitter™ y Facebook.

Avisos legales   |   Política de privacidad en línea