UDA-Utilidades de desarrollo de aplicaciones • UDA-Componentes RUP. Idioma http://uda-ejie.github.io/

1. UDA - Utilidades de Desarrollo de Aplicaciones
Componentes RUP – Idioma
Fecha: 09/01/2013 Referencia:
EJIE S.A.
Mediterráneo, 14
Tel. 945 01 73 00*
Fax. 945 01 73 01
01010 Vitoria-Gasteiz
Posta-kutxatila / Apartado: 809
01080 Vitoria-Gasteiz
www.ejie.es
UDA – Utilidades de desarrollo de aplicaciones by EJIE is licensed under a Creative Commons Reconocimiento-
NoComercial-CompartirIgual 3.0 Unported License.

2. Componentes RUP – Idioma ii/7
Control de documentación
Título de documento: Componentes RUP – Idioma
Histórico de versiones
Código: Versión: Fecha: Resumen de cambios:
1.0.0 06/06/2011 Primera versión.
1.0.1 18/07/2011
Correcciones en los números de versión de
ficheros.
1.1.0 14/09/2011
Actualización de las versiones de las librerías
JavaScript subyacentes.
Añadido el apartado Integración con UDA.
2.0.0 11/07/2012 Cambios de formato y correcciones ortográficas.
2.1.0 18/09/2012
Actualización de las versiones de las librerías
JavaScript subyacentes.
2.1.1 09/01/2013 Nuevo formato para el componente Menú.
Cambios producidos desde la última versión
Actualización de las versiones de las librerías JavaScript subyacentes.
Control de difusión
Responsable: Ander Martínez
Aprobado por:
Firma: Fecha:
Distribución:
Referencias de archivo
Autor:
Nombre archivo:

3. Componentes RUP – Idioma iii/7
Localización:
Contenido
Capítulo/sección Página
1. Introducción 4
2. Ejemplo 4
3. Casos de uso 4
4. Infraestructura 5
4.1. Ficheros 5
4.2. Dependencias 5
5. Invocación 6
6. Parámetros 6
7. Sobreescritura del theme 6
8. Internacionalización (i18n) 6
9. Integración con UDA 7

4. Componentes RUP – Idioma 4/7
1. Introducción
La descripción del Componente Idioma, visto desde el punto de vista de RUP, es la siguiente:
El componente de idioma esta diseñado para permitir al usuario elegir, de forma intuitiva, el idioma en el
que se presenta la aplicación.
2. Ejemplo
Se muestra a continuación los dos posibles formatos de maquetación dispone en el componente:
Modo por defecto
Modo portal
3. Casos de uso
Se aconseja la utilización de este componente:
• Situaciones en las que se disponga de varias versiones idiomáticas del sitio web y se desee que el
usuario pueda cambiar el idioma durante su interacción con la aplicación.
Las razones para el uso del componente son las siguientes:
• Ocupa poco espacio en la interfaz.
• Es fácil de comprender y utilizar.
• Es escalable: podemos incluir varios idiomas en el combo desplegable sin afectar al resto de la
interfaz.

5. Componentes RUP – Idioma 5/7
4. Infraestructura
A continuación se comenta la infraestructura necesaria para el correcto funcionamiento del componente.
Únicamente se requiere la inclusión de los ficheros que implementan el componente (js y css) comentados
en los apartados Ficheros y Dependencias.
4.1. Ficheros
Ruta Javascript: rup/scripts/
Fichero de plugin: rup.lang-x.y.z.js
Ruta theme: rup/basic-theme/
Fichero css del theme: theme.rup.lang-x.y.z.css
4.2. Dependencias
Por la naturaleza de desarrollo de los componentes (patrones) como plugins basados en la librería
JavaScript jQuery, es necesaria la inclusión del esta. La versión elegida para el desarrollo ha sido la
versión 1.8.0.
• jQuery 1.8.0: http://jquery.com/
La gestión de la ciertas partes visuales de los componentes, se han realizado mediante el plugin jQuery
UI que se basa en jQuery y se utiliza para construir aplicaciones web altamente interactivas. Este plugin,
proporciona abstracciones de bajo nivel de interacción y animación, efectos avanzados de alto nivel,
componentes personalizables (estilos) ente otros. La versión utilizada en el desarrollo ha sido la 1.8.23.
• jQuery UI 1.8.23: http://jqueryui.com/
Los ficheros necesarios para el correcto funcionamiento del componente son:
• jquery-1.8.0.js
• jquery-ui-1.8.23.custom.js
• jquery-ui-1.8.23.custom.css
• rup.base-x.y.z.js
• rup.lang-x.y.z.js
• theme.rup.lang-x.y.z.css

6. Componentes RUP – Idioma 6/7
5. Invocación
La creación del componente idioma se realiza de forma automática gracias al wizard de creación de
proyectos, ya que este crea el layout correspondiente para la aplicación y esta integrado en el mismo, pero
siempre haciendo uso del código de aplicación para crear el id de la capa donde si insertara el componente:
$("#idlanguage").rup_language();
Los posibles idiomas de la aplicación se cargan a través de la variable AVAILABLE_LANGS que se carga
en el fichero “base-includes.jsp”. Esta variable se genera automáticamente con los idiomas seleccionados en
la creación de la aplicación.
6. Parámetros
A continuación se muestran los posibles parámetros de configuración que recibe el componente.
• languages: Conjunto de idiomas que serán gestionados con el componente. El listado de
los mismos, por configuración general, se gestiona a través de la variable jQuery
“$.rup.AVAILABLE_LANGS_ARRAY”. Para mas información, consultar el documento
“Anexo-Gestion_idiomatica.doc” de la documentación de UDA.
languages: $.rup.AVAILABLE_LANGS_ARRAY
• modo: determina el tipo de maquetación que utilizara el componente para presentar las
diferentes opciones idiomáticas. Si el valor especificado es “portal”, los idiomas se
presentaran en un listado horizontal separado por barras (ver ejemplo visual del
capítulo/Sección “2. Ejemplo”). En cualquier otro caso, se mostrara el modo por defecto (ver
ejemplo visual del capítulo/Sección “2. Ejemplo”).
7. Sobreescritura del theme
El componente idioma se presenta con una apariencia visual definida en el fichero de estilos
theme.rup.lang-x.y.z.css.
Si se quiere modificar la apariencia del componente, se recomienda redefinir el/los estilos necesarios en un
fichero de estilos propio de la aplicación situado dentro del proyecto de estáticos
(codAppStatics/WebContent/codApp/styles).
8. Internacionalización (i18n)
La gestión de los literales del componente idioma se realiza a través de ficheros json lo que flexibiliza el
desarrollo. Para acceder a los literales se hará uso del objeto base RUP, por el cual se accederá al objeto
json correspondiente según el idioma para obtener tanto los literales a través de esta sentencia.
$.rup.i18n.rup_language

7. Componentes RUP – Idioma 7/7
Los literales marcados para este componente son los siguientes:
"rup_language" : {
"es": "Castellano",
"eu":"Euskara",
"en":"Ingles",
"changeLanguage": "Cambiar Idioma"
}
9. Integración con UDA
No aplica.