...

Los eventos de personalización para definir formularios son creados a partir del Fluig Studio. Para publicar un formulario siga los pasos según el ejemplo a continuación:

...

La personalización de definición de formularios se realiza a través de la creación de scripts en el lenguaje JavaScript. El código de implementación de cada script se almacena en un banco de datos y dispensa el uso de otros archivos, como por ejemplo, “plugin.p”.

Los eventos de personalización para definir formularios son creados a partir del Fluig Studio. Para publicar un formulario siga los pasos según el ejemplo a continuación:

...

Todos los eventos de la definición de formularios reciben la referencia al formulario. A través de esta referencia es posible ingresar a los espacios del formulario, ingresar/definir el valor de un espacio e ingresar/definir el estado de presentación del espacio. Los detalles de cada evento se presentarán en las próximas secciones de este documento.

...

• ADD: indicando modo de inclusión.
• MOD: indicando modo de edición.
• VIEW: indicando modo de visualización.
• NONE: indicando que no hay comunicación con el formulario, por ejemplo, ocurre al momento de validar los espacios del formularios donde no está siendo presentado.
  

A continuación se detallarán los eventos disponibles para la personalización de una definición de formulario en Fluig.

AfterProcessing

Es el último evento a realizar para el fichero. El evento recibe como parámetro una referencia al formulario de la definición de formulario.

Ejemplo:

function afterProcessing(form){
}

En el marco de este evento la variable form solo se puede utilizar para consultas a los espacios de la definición de formularios, sus valores y estado de presentación.

AfterSaveNew

Este evento se realiza después de crear un nuevo formulario. El evento recibe como parámetro una referencia al formulario de la definición de formulario.

Para obtener el valor de un determinado espacio del formulario:

 form.getValue("nome-do-campo")

Ejemplo:

 function afterSaveNew(form) {
  log.info("Colaborador de abertura: " + form.getValue("RNC_colab_abertura"));
}

La consulta a los espacios del formulario es case insensitve. En el ejemplo anterior, podríamos obtener el valor del espacio utilizando rnc_colab_abertura.

BeforeProcessing

Este evento es el primero a realizarse. Se produce antes de cualquier otro evento de la definición de formulario. El evento recibe como parámetro una referencia al formulario de la definición de formulario.

Ejemplo:

function beforeProcessing(form){
}

En el marco de este evento la variable form solo se puede utilizar para consultar a los espacios de la definición de formularios, sus valores y estado de presentación.

DisplayFields

Este evento se realiza en el momento en que se presentan los objetos del formulario. El evento recibe como parámetro una referencia al formulario de la definición de formulario y la referencia para salida de presentación del formulario.

En este evento es posible modificar los valores a presentar en el espacio del formulario. Para esto basta utilizar el siguiente procedimiento:

form.setValue(“nome-do-campo”, “valor”);

Ejemplo:

 function displayFields(form, customHTML) {
   if ( form.getFormMode() == “MOD” ) {
     form.setValue('RNC_colab_abertura', new java.lang.Integer(1));
   }
}

Aún en el evento DisplayFields es posible utilizar tres métodos de forma independiente o conjunta para modificar la forma en qué se presenta la renderización del formulario, eliminar renglones de un fichero hijo y ocultar los botones “Imprimir” e “Imprimir en nueva Ventana”.

Para visualizar el formulario en el formato original con los espacios deshabilitados, se debe utilizar el método  setShowDisabledFields.

Para habilitar o deshabilitar el botón de excluir en los renglones del fichero hijo, que por patrón está habilitado, se debe utilizar el método setHideDeleteButton.

Para ocultar los botones  Imprimir  e Imprimir en nueva Ventana, se debe utilizar el método setHidePrintLink.

Ejemplo de visualización sin utilizar los métodos.

Image Removed

Figura 11 - Ejemplo sin utilizar los métodos .

Ejemplo de utilización de los métodos setShowDisabledFields y setHidePrintLink:

function displayFields(form, customHTML) { 
   form.setShowDisabledFields(true);
   form.setHidePrintLink(true);
}

Image Removed

Figura 12 - Ejemplo de utilización de los métodos.

Ejemplo de visualización sin utilizar el método setHideDeleteButton:

Image Removed

Figura 13 - Ejemplo sin utilizar el método.

Ejemplo utilizando el método setHideDeleteButton:

function displayFields(form, customHTML) { 
   form.setHideDeleteButton(false);
}

Image Removed

Figura 14 - Ejemplo de utilización de los métodos.

Es importante destacar que este evento es el único que permite la modificación de los valores a presentar en los espacios formulario antes de su renderización.

A continuación un ejemplo para utilizar la salida de presentación del formulario:

if(form.getFormMode() != "VIEW")  {
    customHTML.append("<script>");
    customHTML.append("function MostraEscondeBtn_zoom()");
    customHTML.append("{");
    customHTML.append("document.getElementById(\'zoomUsuario\').className = \'show\';"); 
    customHTML.append("document.getElementById(\'zoomModulo\').className = \'show\';");
    customHTML.append("}"); 
    customHTML.append("</script>");
}

EnableFields

Este evento se realiza en el momento que se habilitan los objetos del formulario, permitiendo deshabilitar algunos espacios, en caso sea necesario. El evento recibe como parámetro una referencia al formulario de la definición de formulario.

Para habilitar o deshabilitar un espacio del formulario se debe ejecutar el siguiente procedimiento:

 form.setEnabled("nome-do-campo",true/false)

Donde “true” habilita el espacio y “falso” deshabilita el campo.

Ejemplo:

function enableFields(form) { 
    if ( form.getFormMode() != 'ADD' ){    
		form.setEnabled("rnc_area",false);
        form. setEnabled("rnc_tipo_ocorrencia",false);
    }
}

Cabe destacar que el evento ocurre al momento de la renderización del formulario y es el único que permite modificar el estado de presentación de los espacios del formulario.

Otra forma de deshabilitar los espacios es utilizando comandos JavaScript implementados directamente en funciones del formulario. Sin embargo, en este caso, no se permite utilizar la propiedad disabled, ya que los espacios no se grabarán al guardar la ficha. Para esta situación, se debe utilizar la propiedadreadonly según el ejemplo a continuación:

document.forms['nomeForm'].nomeCampo.setAttribute('readonly',true);

InputFields

Este evento se realiza en el momento en que se informan los datos del formulario al BO responsable del formulario del Fluig. El evento recibe como parámetro una referencia al formulario de la definición de formulario. Ejemplo:

function inputFields(form){
}

SetEnable

Este evento se puede ejecutar en diferentes eventos de las definiciones de formulario. Este evento no se implementa automáticamente en la personalización de la definición de formulario.

Ejemplo:

function setEnable() {
  log.info(“Teste de chamada de função”);
}
 
function displayFields(form, customHTML) {
  setEnable();
}

ValidateForm

Este evento se ejecuta antes de guardar los datos del formulario en el banco de datos. El evento recibe como parámetro una referencia al formulario de la definición de formulario. En caso de errores de validación de los datos del formulario ese evento responderá un mensaje de error.

Ejemplo:

function validateForm(form) {
   if (form.getValue('RNC_colab_abertura') == null){
     throw "O colaborador de abertura não foi informado";
   }   
}  

<input name="cep" type="text" mask="00000-000">

Para elaborar la máscara es posible utilizar:

                     
                     Data: "00/00/0000"
                  Horário: "00:00:00"
              Data e Hora: "00/00/0000 00:00:00"
                      CEP: "00000-000"
                 Telefone: "0000-0000"
            Telefone(ddd): "(00) 0000-0000"
Telefone(ddd + 9ºdígitos): "(00) 90000-0000"
           Placa de carro: "SSS 0000"
                      CPF: "000.000.000-00"
                     CNPJ: "00.000.000/0000-00"
                       IP: "099.099.099.099"
              porcentagem: "#00.000,00%"
				    Valor: "#00.000.000.000.000,00"

ComboBox

Geralmente é necessário popular um ComboBox de um formulário com um determinado grupo de valores.

No Fluig isto é possível através da utilização de Datasets. Os Datasets são serviços de dados padrão disponibilizados pelo Fluig, como por exemplo, o serviço de “Volumes” do produto.

Para habilitar o Dataset no ComboBox basta usar a seguinte construção:

<select name="RNC_volume" id="RNC_volume" dataset="nome-dataset" datasetkey="chave" datasetvalue="valor" addBlankLine=”false”></select>

Onde:

• dataset é o nome do Dataset.
• datasetkey é a chave do registro.
• datasetvalue é o valor de um determinado campo do registro.
• addBlankLine é o que define se a primeira linha do combo será um valor em branco.

Exemplo:

<select name="RNC_volume" id="RNC_volume" dataset="destinationVolume" datasetkey="volumeID" datasetvalue="volumeDescription"></select>

No exemplo acima estamos listando em um ComboBox todas os Volumes cadastradas no Fluig.

Caso seja necessária a ordenação dos dados provindos de um dataset interno, indicamos a criação de um dataset customizado que execute o interno e ordene os dados, antes de alimentar o componente combobox.

Para utilizar um ComboBox com somente uma opção não deve ser utilizado caracteres especiais e espaço no value da tag option.

Exemplos:

• Forma correta

<select>
  <option value="te">Teste</option>
</select>

• Forma Incorreta

<select>
  <option value="te te te">Teste</option>
</select>

Zoom

Permite a consulta de entidades e outros formulário criados no Fluig para seleção de dados pelo usuário.

"/webdesk/zoom.jsp?datasetId="+dataset+"&dataFields="+campos+"&resultFields="+resultFields+"$type="+"&title="+titulo

Onde:

• title: é o título para a janela de zoom.
• datasetId: é o nome do dataset (Built-in, CardIndex ou Customized).
• dataFields: são os nomes dos campos a serem apresentados.
• resultFields: são os campos que devem ser retornados para o registro selecionado pelo usuário.
• likeField: o nome do campo para filtro de dados (se necessário).
• likeValue: o valor a ser usado no filtro de dados (se necessário).

ATENÇÃO: Este parâmetro só é válido para datasets internos. Datasets customizados não permitem a utilização de filtros.

function setSelectedZoomItem(selectedItem) {               
}

Onde selectItem é o registro selecionado pelo usuário na tela de zoom.

selectedItem["fieldName"]

Onde fieldName é o nome do campo de retorno que foi definido na chamada de zoom.Para obter o registroo componente de Zoom do Fluig foi desenvolvido para permitir que o recurso de zoom fosse utilizado em definições de formulários.

Para que seja possível visualizar e resgatar informações dos campos “metadatas” do formulário, é necessário utilizar a seguinte nomenclatura:

Abaixo um exemplo de código utilizado para visualização e resgate destes valores:

function zoomFormulario(titulo, dataset, campos, resultFields, type){
	window.open("/webdesk/zoom.jsp?datasetId="+dataset+"&dataFields="+campos+
	"&resultFields="+resultFields+"&type="+type+"&title="+titulo, "zoom", "status , scrollbars=no ,width=600, height=350 , top=0 , left=0");
} 

function setSelectedZoomItem(selectedItem) {
	alert("Grupo: " + selectedItem['groupId'] + " Colaborador: "+ selectedItem['colleagueGroupPK.colleagueId']);
}
 
<input type="button" class="btZoom" onclick="zoomFormulario('title', 'colleagueGroup', 'groupId,Codigo,colleagueGroupPK.colleagueId,Matricula','groupId,colleagueGroupPK.colleagueId', 'nofield');">
 

Para utilizar filtros a chamada é similar ao de dataFields.

Segue exemplo abaixo:

window.open("/webdesk/zoom.jsp?datasetId=preCad&dataFields=codigo, Código, descricao, Descrição&resultFields=descricao&type=precad&filterValues=metadata_active, false","zoom" , "status, scrollbars=no, width=600, height=350, top=0, left=0");

Neste exemplo, o zoom irá retornar somente as fichas inativas.

Zoom Externo

Em situações aonde os dados dos elementos externos ao Fluig são muito volumosos é recomendada a construção de uma aplicação externa ao Fluig que fará o papel de zoom para o usuário. Abaixo será descrita uma técnica JavaScript aonde será possível chamar uma aplicação externa e a mesma poderá devolver o dado solicitado pelo usuário para um campo do formulário do Fluig.

O primeiro passo para implementação dessa técnica é criar uma lógica em JavaScript que irá abrir uma nova janela chamando a aplicação externa que irá se comportar como zoom para o formulário. Vamos utilizar e explanar o comando window.open neste exemplo:

Window.open(URL Aplicação Externa, Nome da Janela que será aberta, comandos adicionais)

Onde:

• URL Aplicação Externa: É a url da aplicação externa que funcionará como zoom para o Fluig. Ex: http://servidor/applications/forneczoom.asp.
• Nome da Janela: Nome da janela que será utilizado pelo navegador do usuário como identificador. Para evitar a sobreposição de conteúdo em janela é recomendado que para cada zoom chamado por um mesmo formulário seja adicionado um nome diferente. Ex: “ZoomFormec”.
• Comandos Adicionais: Comandos adicionais utilizados para a criação da janela que irá conter a aplicação zoom. Ex: “width=230, height=230”.

O código abaixo irá programar um formulário do Fluig contendo um campo e um botão lateral que irá invocar a janela da aplicação externa.

<form name=”FornecedorForm”>
  Código do Fornecedor:
  <input name=”cod_fornec” size=’10” value=”” type=”text”>
  <input value=”lista” onClick=”mostraLista()” type=”button”>
</form>

<script language=”JavaScript”>
   Function mostraLista() {
     Window.open(“fornecedores.html”, “list”,”width=230,height=230”);
   }
</script>       

O segundo passo é programar dentro da aplicação externa uma função JavaScript que devolva para o campo do formulário o valor escolhido para o usuário na aplicação externa. Essa aplicação externa poderá ser desenvolvida em qualquer tecnologia de desenvolvimento web existente no mercado de que a mesma possa realizar a execução de scripts JavaScript no lado do cliente. Segue exemplo de uma função JavaScript que passa o valor para o campo do formulário:

<input name="cep" type="text" mask="00000-000">

Para elaborar la máscara es posible utilizar:

                     
                     Data: "00/00/0000"
                  Horário: "00:00:00"
              Data e Hora: "00/00/0000 00:00:00"
                      CEP: "00000-000"
                 Telefone: "0000-0000"
            Telefone(ddd): "(00) 0000-0000"
Telefone(ddd + 9ºdígitos): "(00) 90000-0000"
           Placa de carro: "SSS 0000"
                      CPF: "000.000.000-00"
                     CNPJ: "00.000.000/0000-00"
                       IP: "099.099.099.099"
              porcentagem: "#00.000,00%"
				    Valor: "#00.000.000.000.000,00"

ComboBox

Generalmente es necesario popular un ComboBox de un formulario con un determinado grupo de valores.

En el Fluig esto es posible a través de la utilización de Datasets. Los Datasets son servicios de datos patrón disponibles por el Fluig, como por ejemplo, el servicio de “Volúmenes” del producto.

Para habilitar el Dataset en el ComboBox basta utilizar la siguiente construcción:

<select name="RNC_volume" id="RNC_volume" dataset="nome-dataset" datasetkey="chave" datasetvalue="valor" addBlankLine=”false”></select>

Donde:

• dataset es el nombre del Dataset.
• datasetkey es la clave del registro.
• datasetvalue es el valor de un determinado espacio del registro.
• addBlankLine es lo que define si el primer renglón del combo será un valor en blanco.

Ejemplo:

<select name="RNC_volume" id="RNC_volume" dataset="destinationVolume" datasetkey="volumeID" datasetvalue="volumeDescription"></select>

En el ejemplo anterior realizamos una lista en un ComboBox con todos los Volúmenes registrados en el Fluig.

En caso sea necesario ordenar los datos provenientes de un dataset interno, indicamos la creación de un dataset personalizado que ejecute el interno y ordene los datos, antes de eliminar el componente combobox.

Para utilizar un ComboBox con solamente una opción no se deben utilizar carácteres especiales y espacio en el value da tag option.

Ejemplos:

• Forma correcta

<select>
  <option value="te">Teste</option>
</select>

• Forma Incorrecta

<select>
  <option value="te te te">Teste</option>
</select>

Zoom

Permite la consulta de entidades y otros formularios creados en el Fluig para que el usuario pueda seleccionar datos.

"/webdesk/zoom.jsp?datasetId="+dataset+"&dataFields="+campos+"&resultFields="+resultFields+"$type="+"&title="+titulo

Donde:

• title: es el título para la ventaja de zoom.
• datasetId: es el nombre del dataset (Built-in, CardIndex o Customized).
• dataFields: son los nombres de los espacios a presentar.
• resultFields: son los espacios que se deben devolver al registro seleccionado por el usuario.
• likeField: el nombre del espacio para filtro de datos (si es necesario)
• likeValue: el valor a usar en el filtro de datos (si es necesario)

ATENCIÓN: Este parámetro sólo es válido para datasets internos. Datasets personalizados no permiten utilizar filtros.

function setSelectedZoomItem(selectedItem) {               
}

Donde selectItem es el registro seleccionado por el usuario en la ventana de zoom.

selectedItem["fieldName"]

Donde fieldName es el nombre del espacio de devolución que se ha definido en la llamada de zoom. Para obtener el registro componente de Zoom del Fluig se ha desarrollado para permitir que el recurso de zoom se utilice en definiciones de formularios.

Para que sea posible visualizar y rescatar información de los espacios “metadatos” del formulario, es necesario utilizar la siguiente nomenclatura:

A continuación un ejemplo de código utilizado para visualizar y rescatar estos valores:

function zoomFormulario(titulo, dataset, campos, resultFields, type){
	window.open("/webdesk/zoom.jsp?datasetId="+dataset+"&dataFields="+campos+
	"&resultFields="+resultFields+"&type="+type+"&title="+titulo, "zoom", "status , scrollbars=no ,width=600, height=350 , top=0 , left=0");
} 

function setSelectedZoomItem(selectedItem) {
	alert("Grupo: " + selectedItem['groupId'] + " Colaborador: "+ selectedItem['colleagueGroupPK.colleagueId']);
}
 
<input type="button" class="btZoom" onclick="zoomFormulario('title', 'colleagueGroup', 'groupId,Codigo,colleagueGroupPK.colleagueId,Matricula','groupId,colleagueGroupPK.colleagueId', 'nofield');">
 

Para utilizar filtros la llamada es similar al del dataFields.

Sigue el ejemplo a continuación:

window.open("/webdesk/zoom.jsp?datasetId=preCad&dataFields=codigo, Código, descricao, Descrição&resultFields=descricao&type=precad&filterValues=metadata_active, false","zoom" , "status, scrollbars=no, width=600, height=350, top=0, left=0");

En este ejemplo, el zoom devolverá solamente las fichas inactivas.

Zoom Externo

En situaciones donde los datos de los elementos externos al Fluig son muy voluminosos, se recomienda la construcción de una aplicación externa al Fluig que realizará el papel de zoom para el usuario. A continuación se describirá una técnica JavaScrip donde será posible llamar una aplicación externa y la misma podrá retornar el dato solicitado por el usuario a un espacio del formulario del Fluig.

El primer paso para implementar esta técnica es crear una lógica en JavaScript que abrirá una nueva ventana llamando la aplicación externa que funcionará como zoom para el formulario. Vamos a utilizar y explicar el comando window.open en este ejemplo:

Window.open(URL Aplicação Externa, Nome da Janela que será aberta, comandos adicionais)

Donde:

• URL Aplicación Externa: Es la url de la aplicación externa que funcionará como zoom para el Fluig. Ej: http://servidor/applications/forneczoom.asp.
• Nombre de la Ventana: Nombre de la ventana que utilizará el navegador del usuario como identificador. Para evitar la sobreposición del contenido en ventana, se recomienda que a cada zoom llamado por un mismo formulario se agregue un nombre diferente. Ej: “ZoomFormec”.
• Comandos Adicionales: Comandos adicionales utilizados para crear la ventana que contendrá la aplicación zoom. Ej: “width=230, height=230”.

El código a continuación programará un formulario del Fluig conteniendo un espacio y un botón lateral que invocará la ventana de la aplicación externa.

<form name=”FornecedorForm”>
  Código do Fornecedor:
  <input name=”cod_fornec” size=’10” value=”” type=”text”>
  <input value=”lista” onClick=”mostraLista()” type=”button”>
</form>

<script language=”JavaScript”>
   Function mostraLista() {
     Window.open(“fornecedores.html”, “list”,”width=230,height=230”);
   }
</script>       

El segundo paso consiste en programar dentro de la aplicación externa una función JavaScript que devuelva al campo del formulario el valor elegido al usuario en la aplicación externa. Esta aplicación externa se podrá desarrollar en cualquier tecnología de desarrollo web existente en el mercado donde la misma pueda realizar la ejecución de scripts JavaScript al lado del cliente. A continuación se indica un ejemplo de una función JavaScript que informa el valor al espacio del formulario.

<script language=”JavaScript”>
   function elegir(valor) {
       // El siguiente renglón prueba si la ventana del formulario del fluig que abrió la ventana de zoom aún está abierta
       if (window.opener && !window.opener.close) {
              // establece el valor informado al espacio
              window.opener.document.(id del form en el formulario fluig).(nombre del campo).value = valor;
       }
       // Cierra la ventana de la aplicación zoom
       window.close();
   }
</script>

Donde:

• Id del form en el formulario Fluig: En caso de que se haya definido algún id para el tag <form> en el formulario del Fluig, es interesante realizar una referencia en este comando. Se puede utilizar también la referencia de colección forms dentro del comando (forms[posición]). 
  Ej: ProveedorForm, forms[0].

• Nombre del espacio: Nombre del espacio que recibirá el valor informado a la función. 
  Ej: cod_proveed.
• Valor: Datos que se informará al espacio del formulario del Fluig.

El ejemplo a continuación programará un ejemplo de zoom externo realizado enteramente en HTML con datos estáticos apenas para ilustrar. Los datos de zoom provienen de cualquier fuente sea esta interna o externa al Fluig.

<html>
  <head>
  <title>Lista de proveedores</title> 

<script language="JavaScript"> 
function elegir(valor) { 
  // Prueba de validez del Opener 
  if (window.opener && !window.opener.closed) { 
      // grabando el valor del espacio cod_fornec 
      window.opener.document.forms[0].cod_fornec.value = valor; 
  } 
   window.close(); 
} 
</script>
 
  </head>
  <body>   
  <!-- Los datos a continuación están fijos pero se podrían configurar a partir de cualquier origen. --> 
  <table border="1" cellpadding="5" cellspacing="0"> 
  <tbody><tr bgcolor="#cccccc"><td colspan="2"><b>Exemplo aplicacao ECM</b></td></tr> 
  <tr bgcolor="#cccccc"><td><b>Codigo</b></td><td><b>NASDAQ</b></td></tr> 
  <tr><td><a href="javascript:escolha('TOTVSv3')">TOTVS</a></td> 
  <td><a href="javascript:escolha('TOTVSv3')">TOTVSv3</a></td></tr> 
  <tr><td><a href="javascript:escolha('RM1')">RM</a></td> 
  <td><a href="javascript:escolha('RM1')">RM1</a></td></tr> 
  <tr><td><a href="javascript:escolha('DTS3')">Datasul</a></td> 
  <td><a href="javascript:escolha('dts3')">Dts3</a></td></tr> 
  <tr><td><a href="javascript:escolha('Lgx2')">Logix</a></td> 
  <td><a href="javascript:escolha('Lgx2')">Lgx2</a></td></tr> 
  </tbody>
  </table> 
  <!-- Fin de los datos--> 
  </body>
</html>

Para colocar un ejemplo en práctica en el el producto, se debe publicar la definición del formulario e informar el archivo del zoom externo como anexo de la definición de formulario.

Ejemplo de Zoom.zip

Al hacer clic en uno de los ítems de la pantalla de zoom aparecerá la función JavaScript elección que enviará el valor al campo cod_fornec en el formulario do Fluig.

El Flui posee integración con dos tipos de servicios de datos, estos son: Dataset y Servicios Externos. Ambos se pueden utilizar en todos los eventos disponibles para personalizar la definición de formulario.

Dataset

Es un servicio de datos que provee acceso a la información, independiente del origen de los datos. El Fluig provee Datasets internos que permiten el acceso a entidades, como Usuarios, Grupo de Usuarios, entre otros. Consulte el registro de Datasets del Fluig para obtener la relación completa de los Datasets disponibles y sus respectivos espacios.

En la función getDatasetValues, NO se devolverán los valores de todos los espacios por cuestiones de seguridad. Para obtener todos los datos se utiliza el DatasetFactory, ejemplificado en Personalización de Datasets.

Por ejemplo, para ingresar el Dataset de usuarios del Fluig en el evento displayFields de una definición de formulario:

function displayFields(form,customHTML) {
     // Obteniendo el usuario a través de dataset.
     filter = new java.util.HashMap();
     filter.put("colleaguePK.colleagueId","adm");
     usuario = getDatasetValues('colleague',filter);
     form.setValue('RNC_colab_abertura',usuario.get(0).get("colleagueId"));
}

También se puede realizar una llamada a los Datasets dentro de la definición de formulario a través de funciones JavaScript.

El acceso a los Datasets también se puede realizar directamente en el formulario de la definición de formulario. Por ejemplo, para ingresar el Dataset de usuario e ingresar los valores en los espacios del HTML:

  <html>
    <head>
        <title>
            Prueba XMLRPC
        </title>
        <script language="javascript">      

<script language=”JavaScript”>
   function escolha(valor) {
       // A linha abaixo testa se a janela do formulário do fluig que abriu a janela de zoom ainda está aberta
       if (window.opener && !window.opener.close) {
              // seta o valor passando para o campo
function init(){                   window.opener.document.(id do form no formulário fluig).(nome do campo).value = valor;
       }
       // Fecha avar janelafilter da= aplicação zoom
new Object();
                window.close();
   }
</script>

Onde:

• Id do form no formuário Fluig: Caso algum id tenha sido definido para a tag <form> no formulário do Fluig é interessante referenciar neste comando. Pode ser utilizada também a referência de coleção forms dentro do comando (forms[posição]). 
  Ex: FornecedorForm, forms[0].

• Nome do Campo: Nome do campo que irá receber o valor passado para a função. 
  Ex: cod_fornec.
• Valor: Dado que será passado para o campo do formulário do Fluig.

O exemplo a seguir irá programar um exemplo de zoom externo feito inteiramente em HTML com dados estáticos apenas para ilustração. Os dados de zoom podem provir de qualquer fonte seja ela interna ou externa ao Fluig.

<html>
  <head>
  <title>Lista de fornecedores</title> 


<script language="JavaScript"> 
function escolha(valor) { 
  // Teste de validade do Opener 
  if (window.opener && !window.opener.closed) { filter["colleaguePK.colleagueId"] = "adm";  
                var colleagues = getDatasetValues("colleague", filter);
                if(colleagues.length > 0){        
					document.getElementById("colleagueName").value = colleagues[0].colleagueName;
                	document.getElementById("colleagueId").value = colleagues[0].colleagueId;
               	 	document.getElementById("login").value = colleagues[0].login;
      // gravando o valor do campo cod_fornec 
    	  window.opener.document.forms[0].cod_fornec.	document.getElementById("extensionNr").value = valorcolleagues[0].extensionNr; 
  } 
   window.close(); 
} 
</script>
 
  </head>
  <body>   

  <!-- Os dados abaixo estão fixos mas poderiam ser montados a partir de qualquer origem. --> 

  <table border="1" cellpadding="5" cellspacing="0"> 
  <tbody><tr bgcolor="#cccccc"><td colspan="2"><b>Exemplo aplicacao ECM</b></td></tr> 
  <tr bgcolor="#cccccc"><td><b>Codigo</b></td><td><b>NASDAQ</b></td></tr> 
  <tr><td><a href="javascript:escolha('TOTVSv3')">TOTVS</a></td> 
  <td><a href="javascript:escolha('TOTVSv3')">TOTVSv3</a></td></tr> 
  <tr><td><a href="javascript:escolha('RM1')">RM</a></td> 
  <td><a href="javascript:escolha('RM1')">RM1</a></td></tr> 
  <tr><td><a href="javascript:escolha('DTS3')">Datasul</a></td> 
  <td><a href="javascript:escolha('dts3')">Dts3</a></td></tr> 
  <tr><td><a href="javascript:escolha('Lgx2')">Logix</a></td> 
  <td><a href="javascript:escolha('Lgx2')">Lgx2</a></td></tr> 
  </tbody>
  </table> 

  <!-- Fim dos dados --> 

  </body>
</html>

Para colocar o exemplo em prática no produto, basta publicar a definição de formulário a seguir informando o arquivo do zoom externo como anexo da definição de formulário.

Exemplo de Zoom.zip

Ao clicar em um dos itens da tela de zoom será chamada a função JavaScript escolha que ira enviar o valor para o campo cod_fornec no formulário do Fluig.

O Fluig possui integração com dois tipos de serviços de dados, são eles: Dataset e Serviços Externos. Ambos podem ser usados em todos os eventos disponíveis para customização de definição de formulário.

Dataset

É um serviço de dados que fornece acesso às informações, independente da origem dos dados. O Fluig fornece Datasets internos que permitem acesso as entidades, como Usuários, Grupos de Usuários, entre outros. Consulte o cadastro de Datasets do Fluig para obter a relação completa dos Datasets disponíveis e seus respectivos campos.

Na função getDatasetValues, NÃO são retornados os valores de todos os campos por questões de segurança. Para obter todos os dados é utilizado o DatasetFactory, exemplificado em Desenvolvimento de Datasets.

Por exemplo, para acessar o Dataset de usuários do Fluigno evento displayFields de uma definição de formulário:

function displayFields(form,customHTML) {
     // Obtendo o usuario via dataset
     filter = new java.util.HashMap();
     filter.put("colleaguePK.colleagueId","adm");
     usuario = getDatasetValues('colleague',filter);
     form.setValue('RNC_colab_abertura',usuario.get(0).get("colleagueId"));
}

Também é possível fazer uma chamada aos Datasets dentro da definição de formulário através de funções JavaScript.

O acesso aos Datasets também pode ser realizado diretamente no formulário da definição de formulário. Por exemplo, para acessar o Dataset de usuário e inserir os valores nos campos do HTML:

 <html>
    <head>
        <title>
            Teste XMLRPC
        </title>
        <script language="javascript">      
            function init(){                            
                var filter = new Object();
                filter["colleaguePK.colleagueId"] = "adm";  
                var colleagues = getDatasetValues("colleague", filter);
                if(colleagues.length > 0){        
					document.getElementById("colleagueName").value = colleagues[0].colleagueName;
                	document.getElementById("colleagueId").value = colleagues[0].colleagueId;
               	 	document.getElementById("login").value = colleagues[0].login;
               	 	document.getElementById("extensionNr").value = colleagues[0].extensionNr;                
					document.getElementById("groupId").value = colleagues[0].groupId;
					document.getElementById("mail").value = colleagues[0].mail;
                }else{
                    alert("Nenhum Usuário Encontrado");
				}
            }
        </script>
    </head>
    <script src="../vcXMLRPC.js"></script>
    <body onload="init()">
    <form id="form1">
        <b> Nome do Usuário: </b>
        <input type="text" name="colleagueName" id="colleagueName" />
	    <br><br>    
		<b> Matricula do Usuário: </b>
        <input type="text" name="colleagueId" id="colleagueId" />
		<br><br>
		<b>Login do Usuário:</b>
        <input type="text" name="login" id="login" />
        <br><br>            
		<b> Ramal do Usuário: </b>
        <input type="text" name="extensionNr" id="extensionNr" />
        <br><br>
        <b> Grupo do Usuário: </b>
        <input type="text" name="groupId" id="groupId" />
        <br><br>
        <b> E-mail do Usuário: </b>
        <input type="text" name="mail" id="mail" />
        <br><br>
    </form>
    </body>
</html>

O Dataset para definição de formulário utiliza a mesma chamada do Dataset de entidades, como no caso do usuário. Entretanto ao invés de passarmos como parâmetro o nome do Dataset passaremos o número da definição de formulário, por exemplo:

function displayFields(form,customHTML) {
     // Obtendo o usuario via dataset
     filter = new java.util.HashMap();
     filter.put("RNC_nr_solicitacao",new java.lang.Integer(20));
     fichas = getDatasetValues(Number(676),filter);
	 log.info("Usuário de Abertura: "+ fichas.get(0).get("RNC_colab_abertura"));
}

Download de exemplo de Formulário Combobox e Dataset: form.html.

DataService

É um serviço de dados que permite o acesso de aplicações de terceiros através do Fluig. Este serviço de dados suporta dois tipos de conexão, são eles: AppServer do Progress® e Web Services.

Os serviços de dados são cadastrados e configurados a partir da função Visualização de Serviços do Fluig Studio.

Para mais informações sobre o cadastro dos serviços consulte: Integração Com Aplicativos Externos. E para informações de utilização dos serviços nos eventos consulte: Desenvolvimento de Workflow.

A técnica Pai X Filho foi modificada e agora a posição da tag tablename é feita dentro da tag "table" do código html.

No novo modelo implementado agora o parser do fichário aplicará as mudanças do pai filho da seguinte forma:

<table tablename="teste"> - A propriedade tablename determina que Agora abaixo dessa tabela será implementado um sistema de pai filho dentro da definição de formulário. A tag <table> terá seus parâmetros varridos na busca de outros parâmetros relacionados à técnica que serão explicados mais adiante nesse texto. Será criada uma outra <table> ao redor da tabela principal que conterá um  botão que permite adicionar novos filhos. Isso não ocorrerá apenas em casos em que a propriedade noaddbutton também seja informada em conjunto com  a propriedade tablename.                                                                                                    

<TR> (primeiro abaixo do table) - A primeira tag de <TR> encontrada dentro da tabela é visualizada como uma tag que conterá os labels da tabela pai filho a esta tag será adicionada uma coluna <TD> contendo o ícone e a função de eliminar filhos existentes em tela. Está nova coluna será a primeira coluna a esquerda da tabela.

<TR> (Segundo abaixo do table) - A técnica pai filho irá ocultar a linha <TR> original e transforma lá no seu “template mestre” para criação dos filhos daquela tabela. Cada vez que o botão “novo” for acionado todo o conjunto de campos existentes dentro desse segundo <TR> será replicado em tela com os dados iniciais definidos para estes campos.

</table>  - Fim do escopo da técnica.

A técnica também suporta novos atributos que podem ser passados eu usados para customizar a técnica pai e filho. São elas:

noaddbutton - Remove o botão “adicionar” da tela no momento da edição do formulário. Isso permite ao desenvolvedor escolher aonde ele vai colocar a função  que criará os filhos em tela podendo amarrar a chamada da função em um link texto ou uma figura ou outro objeto do html.

<table tablename="teste" noaddbutton=true>

nodeletebutton - Remove o botão “lixeira” da tela no momento da edição da ficha. Isso permite ao desenvolvedor impedir a eliminação dos registros ou definir outra forma de executar a função que removerá os filhos da tabela.

 <table tablename="teste" nodeletebutton=true>

addbuttonlabel - Determina que texto será posto no botão de adicionar filhos da técnica. Caso não seja informado o botão virá com o texto padrão (novo).                                    

 <table tablename="teste" addbuttonlabel="Adicionar novo ingrediente">

addbuttonclass - Permite definir qual classe css será utilizada pelo botão. Essa classe css deverá estar disponível no documento html do fichário.

 <table tablename="teste" addbuttonclass="wdkbuttonClass">

deleteicon - Permite determinar qual será a imagem que funcionará como ícone da eliminação de filhos em tela. Essa imagem deverá ser um anexo da definição de formulário e deverá ser informada na classe como uma imagem qualquer utilizada como anexo na definição de formulário.

<table tablename="teste" deleteicon="teste.jpg">       

customFnDelete - Permite a customização da função que é chamada ao clicar no botão que elimina um filho da tabela. A função customizada deverá estar disponível no documento html da definição de formulário e, obrigatoriamente, chamar a função padrão.

<table tablename="teste" customFnDelete="fnCustomDelete(this)">
    function fnCustomDelete(oElement){

    //Customização
	alert ("Eliminando filho!");

    // Chamada a funcao padrao, NAO RETIRAR
    fnWdkRemoveChild(oElement);

    //Customização
    alert ("Filho eliminado!");
}

É possível usar a combinação de um ou mais atributos na mesma tabela pai filho. Contudo se a propriedade noaddbutton for utilizada os valores das propriedades addbuttonlabel e addbuttonclass serão ignoradas. Não será gerada uma mensagem de erro na publicação ou versionamento dessa definição de formulário, porém no momento da edição do formulário a mesma não irá apresentar o botão padrão que permite cadastrar novos filhos na definição de formulário. A propriedade deleteicon não é afetada pela propriedade noaddbutton. Exemplo de uso combinado de parâmetros:

<table tablename="teste" addbuttonlabel="Adicionar novo ingrediente" addbuttonclass="wdkbuttonClass" deleteicon="teste.jpg">

Pai Filho Radio Button

Para utilizar campos radio button, além da definição padrão do componente html, é necessário que seja utilizado o atributo ‘value’ para os dados serem salvos corretamente.

<table border="1" tablename="teste" addbuttonlabel="Adicionar Filho"  nodeletebutton="true">
	<thead>
		<tr>
			<td><b>Nome</b></td>
			<td><b>Idade</b></td>
			<td><b><font face =	"arial" size=5 color ="blue">Sim:</b></td>
		 	<td><b><font face = "arial" size=5 color ="blue">Não:</b></td>
	 	</tr>
	</thead>
	<tr>
		<td><input type="text" name="nomefilho"></td>
		<td><input type="text" name="idadefilho"></td>
 		<td><input type="radio" name="nameradiofilho" id = "idsimfilho" value="ant_yes"></td>
	 	<td><input type="radio" name="nameradiofilho" id = "idnaofilho" value="ant_no"></td>
	</tr>
</table>

function validateForm(form){
    var indexes = form.getChildrenIndexes("tabledetailname");
    var total = 0;
    for (var i = 0; i < indexes.length; i++) {
        var fieldValue = parseInt(form.getValue("valor___" + indexes[i]));
        if (isNaN(fieldValue)){
            fieldValue = 0;
        } 
        total = total + fieldValue;
        log.info(total);
    }
    log.info(total);
    if (total < 100) {
        throw "Valor Total da requisição não pode ser inferior a 100";
    }
}

Com a inclusão de definição de formulários que suportem a visualização em dispositivos móveis, é possível movimentar solicitações Workflow através destes dispositivos e realizar o preenchimento das informações da definição de formulários HTML, garantindo maior mobilidade e agilidade para realizar movimentações de solicitações workflow.

Para incluir um novo fichário com suporte de dispositivos móveis, realize o procedimento padrão para exportação da definição de formulário e selecione os campos que irão compor o formulário mobile na tela antes da conclusão da exportação. Após a exportação será incluindo também outro arquivo HTML e marcando-o como "mobile" na pasta forms do projeto Fluig. 

Veja na imagem a seguir a tela de seleção mobile na exportação de uma definição de formulário:

Image Removed

Figura 15 - Definição de formulário mobile.

Após exportado o formulário deve ficar conforme a seguir:

Image Removed

Figura 16 - Resultado formulário mobile.

Pai Filho para dispositivos móveis

Os campos que empregam a técnica de pai e filho não são inseridos no formulário gerado automaticamente para dispositivos móveis pelo Fluig. Porem o produto lhe permite desenvolver um formulário customizado para dispositivos móveis consultando estes campos.

A consulta aos campos pai e filho em dispositivos móveis é realizada por meio de funções javaScript, disponíveis dentro do objeto masterList no momento da exibição do formulário. São elas:

getValue

Retorna uma string com o valor de um campo pai e filho, recebendo como parâmetros o numero de sequencia do filho e o nome do campo.

masterList.getValue(sequence,field);

getValues

Retorna um objeto com todos os valores dos campos pai e filho, agrupados pelo numero de sequencia. Este método não possui parâmetros.

masterList.getValues();

getValuesBySequence

Retorna um objeto com todos os valores do campos de uma determinada sequencia. Recebe como paramento o numero da sequencia.

masterList.getValuesBySequence(sequence);

getValuesByField

Retorna todas as sequencias e valores de um determinado campo. Recebe como parâmetro o nome do campo.

masterList.getValuesByField(field);

Exemplos: Formulários Pai Filho + Eventos. 

Para traduzir formulários é necessário utilizar a função i18n.translate(“literal_da_tradução”) nos pontos do arquivo HTML que devem ser traduzidos, conforme exemplo a seguir:

<label>i18n.translate("nm_cliente")</label>
<input name=”nm_cliente”>
<br>
<label>i18n.translate("contato_cliente")</label>
<input name=”contato_cliente”>

Os arquivos contendo as literais têm a seguinte nomenclatura:

• Português: nome_do_formulario_pt_BR.properties;
• Inglês: nome_do_formulario_en_US.properties;
• Espanhol: nome_do_formulario_es.properties.

Os arquivos de propriedades são criados de acordo com os passos apresentados a seguir:

...

					document.getElementById("groupId").value = colleagues[0].groupId;
					document.getElementById("mail").value = colleagues[0].mail;
                }else{
                    alert("Ningún Usuario Encontrado");
				}
            }
        </script>
    </head>
    <script src="../vcXMLRPC.js"></script>
    <body onload="init()">
    <form id="form1">
        <b> Nombre del Usuario: </b>
        <input type="text" name="colleagueName" id="colleagueName" />
	    <br><br>    
		<b> Matrícula del Usuario: </b>
        <input type="text" name="colleagueId" id="colleagueId" />
		<br><br>
		<b>Login del Usuario:</b>
        <input type="text" name="login" id="login" />
        <br><br>            
		<b> Ramal del Usuario: </b>
        <input type="text" name="extensionNr" id="extensionNr" />
        <br><br>
        <b> Grupo del Usuario: </b>
        <input type="text" name="groupId" id="groupId" />
        <br><br>
        <b> Correo electrónico del Usuario: </b>
        <input type="text" name="mail" id="mail" />
        <br><br>
    </form>
    </body>
</html>

El Dataset para definir el formulario utiliza la misma llamada del Dataset de entidades, como en el caso del usuario. Mientras al contrario de pasar como parámetro el nombre del Dataset informaremos el número de la definición de formulario, por ejemplo:

function displayFields(form,customHTML) {
     // Obteniendo el usuario a través de dataset.
     filter = new java.util.HashMap();
     filter.put("RNC_nr_solicitacao",new java.lang.Integer(20));
     fichas = getDatasetValues(Number(676),filter);
	 log.info("Usuario de Apertura: "+ fichas.get(0).get("RNC_colab_abertura"));
}

Download de ejemplo de Formulario Combobox y Dataset: form.html.

DataService

Es un servicio de datos que permite el acceso de aplicaciones de terceros a través del Fluig. Este servicio de datos soporta dos tipos de conexión, estos son: AppServer del Progress® y Web Services.

Los servicios de datos se registran y configuran a partir de la función Visualización de Servicios del Fluig Studio.

Para más información sobre el registro de los servicios, consulte: Integración con Aplicaciones Externos. Y para información sobre el uso de los productos en los eventos, consulte:; Personalización de Workflow.

La técnica Padre X Hijo ha sido modificada y ahora la posición del tag tablename se realiza dentro del tag "table" en el código html.

En el nuevo modelo implementado ahora el procesador del fichero aplicará los cambios de padre hijo de la siguiente manera:

<table tablename="prueba"> - La propriedad tablename determina que ahora abajo de esa tabla se implementará un sistema de padre hijo dentro de la definición de formulario. La etiqueta < table > tendrá sus barridos en la búsqueda de otros parámetros relacionados a la técnica que se explicarán más adelante en este texto. Se creará una otra <table> alrededor de la tabla principal que contendrá un botón que permite agregar nuevos hijos. Esto no ocurrirá apenas en los casos en que la propiedad noaddbutton también se ha informado en conjunto con la propiedad tablename.   

<TR> (primero abajo del table) - El primer tag de <TR> encontrada dentro de la tabla se visualiza como un tag que contendrá los labels de la tabla padre hijo a esta tag se agregará una columna <TD> conteniendo el ícono y la función de eliminar hijos existentes en ventana. Esta nueva columna será la primera columna a la izquierda de la tabla.

<TR>  (Segundo abajo del table) - La técnica padre hijo ocultará el renglón <TR> original, y transforma en su “template mestre” para crear hijos de aquellos tabla. Cada vez que se activa el botón “nuevo” todo el conjunto de espacios existentes dentro de este segundo <TR> se replicará en la ventana con los datos iniciales definidos para estos espacios.

</table>  - Fin del objetivo de la técnica.

La técnica también soporta nuevos atributos que se pueden pasar y utilizar para personalizar la técnica padre e hijo. Son ellas:

noaddbutton - Remueve el botón “agregar” de la ventana en el momento de la edición del formulario. Esto permite al desarrollador elegir donde colocará la función que creará los hijos en ventana pudiendo amarrar la llamada de la función en un link texto o una figura u otro objeto del html.

<table tablename="teste" noaddbutton=true>

nodeletebutton - Remueve el botón “papelera” de la ventana en el momento de la edición de la ficha. Esto permite al desarrollador impedir la eliminación de los registros o definir otra forma de ejecutar la función que removerá los hijos de la tabla.

 <table tablename="teste" nodeletebutton=true>

addbuttonlabel - Determina que texto será colocado en el botón de agregar hijos de la técnica. En caso que no se indique el botón vendrá con el texto patrón (nuevo) 

 <table tablename="teste" addbuttonlabel="Adicionar novo ingrediente">

addbuttonclass - Permite definir que clases css será utilizada por el botón. Esa clase css deberá estar disponible en el documento html del fichero.

 <table tablename="teste" addbuttonclass="wdkbuttonClass">

deleteicon - Permite determinar que imagen funcionará como icono de la eliminación de hijos en ventana. Esta imagen deberá ser un anexo de la definición de formulario, y se deberá informar en la clase como cualquier imagen utilizada como anexo en la definición de formulario.

<table tablename="teste" deleteicon="teste.jpg">       

customFnDelete - Permite la personalización de la función que aparece al presionar clic que elimina un hijo de la table. La función personalizada deberá estar disponible en el documento html de la definición de formulario y, obligatoriamente, llamar la función patrón.

<table tablename="prueba" customFnDelete="fnCustomDelete(this)">
    function fnCustomDelete(oElement){
    //Personalización
	alert ("¡Eliminando hijo!");
    // Llamada la función patrón, NO RETIRAR.
    fnWdkRemoveChild(oElement);
    //Personalización
    alert ("¡Hijo eliminado!");
}

Es posible utilizar la combinación de uno o más atributos en la misma tabla padre hijo. No obstante si se utiliza la propiedad noaddbutton los valores de las propiedades addbuttonlabel y addbuttonclass serán ignorados. No se generará un mensaje de error en la publicación o apersonamiento de esta definición de formulario, sin embargo en el momento de la edición del formulario la misma no presentará el botón patrón que permite registrar nuevos hijos en la definición de formulario. La propiedad deleteicon no se afecta por la propiedad noaddbutton. Ejemplo de uso combinado de parámetros:

<table tablename="teste" addbuttonlabel="Adicionar novo ingrediente" addbuttonclass="wdkbuttonClass" deleteicon="teste.jpg">

Padre Hijo Radio Button

Para utilizar los espacios radio button, además de la definición patrón del componente html, es necesario que se utilice el atributo ‘value’ para que los datos se guarden correctamente.

<table border="1" tablename="prueba" addbuttonlabel="Agregar Hijo"  nodeletebutton="true">
	<thead>
		<tr>
			<td><b>Nome</b></td>
			<td><b>Idade</b></td>
			<td><b><font face =	"arial" size=5 color ="blue">Sim:</b></td>
		 	<td><b><font face = "arial" size=5 color ="blue">Não:</b></td>
	 	</tr>
	</thead>
	<tr>
		<td><input type="text" name="nombrehijo"></td>
		<td><input type="text" name="edadhijo"></td>
 		<td><input type="radio" name="nameradiohijo" id = "idsimhijo" value="ant_yes"></td>
	 	<td><input type="radio" name="nameradiohijo" id = "idnaohijo" value="ant_no"></td>
	</tr>
</table>

Ejemplos: Formularios Padre Hijo + Eventos. 

Para traducir los formularios se debe utilizar la función i18n.translate(“literal_de_la_traducción”) en los puntos del archivo HTML que se deben traducir, según el ejemplo a continuación:

<label>i18n.translate("nm_cliente")</label>
<input name=”nm_cliente”>
<br>
<label>i18n.translate("contato_cliente")</label>
<input name=”contato_cliente”>

Los archivos que contienen las literales tienen la siguiente nomenclatura:

• Portugués: nombre_del_formulario_pt_BR.properties;
• Inglés: nombre_del_formulario_en_US.properties;
• Español: nombre_del_formulario_es.properties.

Los archivos de propiedades se crearán según los pasos presentados a continuación:

Al exportar un formulario para el Fluig, los archivos de propiedades conteniendo las literales son publicados como sus anexos.
El formulario se presenta en el idioma que está configurado para el usuario corriente.

...

• Os arquivos contendo as literais são criados na pasta do formulário.

Image Removed

Figura 2 - Arquivos Properties na Pasta do Formulário.

...

• Informe os valores correspondentes às literais para o idioma de cada arquivo.

Image Removed

Figura 3 - Edição de um Arquivo Properties.

Ao exportar um formulário para o Fluig, os arquivos de propriedades contendo as literais são publicados como anexos dele.
O formulário é apresentado no idioma que está configurado para o usuário corrente.

Adobe, Flash, Flex, Flex Builder, PostScript and Reader are either registered trademarks or trademarks of Adobe Systems Incorporated in the United States and/or other countries.

Apache is a trademark of The Apache Software Foundation.

Apple is a trademark of Apple Inc., registered in the U.S. and other countries.

Firefox and Mozilla are registered trademarks of the Mozilla Foundation.

Google, Android and Google Chrome are trademarks of the Google Inc.

IOS is a trademark or registered trademark of Cisco in the U.S. and other countries and is used under license.

JavaScript is a trademark of Oracle Corporation.

Linux® is the registered trademark of Linus Torvalds in the U.S. and other countries.

Microsoft, Active Directory, Excel, Internet Explorer, Outlook, PowerPoint, SQL Server, Windows and Windows Vista are either registered trademarks or trademarks of Microsoft Corporation in the United States and/or other countries.

MySQL is a trademark of Oracle Corporation and/or its affiliates.

Oracle, Java and OpenOffice.org are registered trademarks of Oracle and/or its affiliates. Other names may be trademarks of their respective owners.

Progress and OpenEdge are trademarks or registered trademarks of Progress Software Corporation or one of its subsidiaries or affiliates in the U.S. and other countries.

Red Hat and JBoss are registered trademarks of Red Hat, Inc. in the United States and other countries.

Any other third party trademarks are the property of their respective owners.