User Tools

Site Tools


es:modeling_2.0

Differences

This shows you the differences between two versions of the page.

Link to this comparison view

es:modeling_2.0 [2024/10/09 14:49]
montse [Comentarios en diagramas]
es:modeling_2.0 [2024/12/12 15:39] (current)
montse [Editar un diagrama]
Line 56: Line 56:
   * **Asistentes**:​ muestra una lista con los asistentes disponibles:​   * **Asistentes**:​ muestra una lista con los asistentes disponibles:​
  
-{{ :es:asistentes.png?link&300 |}}+{{ :es:nuevoasistentes.png?direct&300 |}}
  
   * **Visualizar mapa del diagrama**: pulsando este botón, se muestra una miniatura del diagrama actual (a una escala de 4:1) que aparecerá en un recuadro en la parte superior derecha del Canvas. ​   * **Visualizar mapa del diagrama**: pulsando este botón, se muestra una miniatura del diagrama actual (a una escala de 4:1) que aparecerá en un recuadro en la parte superior derecha del Canvas. ​
Line 230: Line 230:
  
 Se ha incorporado un nuevo tipo de elemento en los diagramas: **el Comentario**.\\ \\ Un usuario que modela un diagrama podrá añadir comentarios en cualquier lugar del mismo, que le faciliten su comprensión cuando se trate de diagramas complejos.\\ \\ Los comentarios no serán tenidos en cuenta en la ejecución del diagrama, al igual que los comentarios en cualquier código fuente no son tenidos en cuenta ni por el compilador ni en la ejecución del código. Se ha incorporado un nuevo tipo de elemento en los diagramas: **el Comentario**.\\ \\ Un usuario que modela un diagrama podrá añadir comentarios en cualquier lugar del mismo, que le faciliten su comprensión cuando se trate de diagramas complejos.\\ \\ Los comentarios no serán tenidos en cuenta en la ejecución del diagrama, al igual que los comentarios en cualquier código fuente no son tenidos en cuenta ni por el compilador ni en la ejecución del código.
 +
  
 **Comentarios en Modeling** **Comentarios en Modeling**
  
  
-Para dibujar comentarios en el diagrama, se incluye la nueva tool **Comentario** en el menú de herramientas de dibujo:\\ \\ {{ :​es:​comentarios_en_diagrama1.png?​300 |}}\\ \\  +Para dibujar comentarios en el diagrama, se incluye la nueva herramienta ​**Comentario** en el menú de herramientas de dibujo:\\ \\ {{ :​es:​comentarios_en_diagrama1.png?​300 |}}\\ \\ Al hacer clic en el diagrama con esta herramienta se dibuja una caja con fondo gris donde podemos introducir el texto del nuevo comentario.\\ \\ También podemos usar el shortcut “ALT+C” para dibujar un comentario en el diagrama (ver tabla de shortcuts en la **ayuda del canvas**):​\\ \\ {{ :​es:​comentarios_en_diagrama2.png?​300 |}}\\ \\ Como cualquier elemento del diagrama, inicialmente la caja de comentario tendrá color rojo, que nos indica que aun debemos rellenar los campos del comentario, siendo entonces cuando la caja tendrá su fondo gris.\\ \\ {{ :​es:​comentarios_en_diagrama3.png?​400 |}}
-Al hacer clic en el diagrama con esta herramienta se dibuja una caja con fondo gris donde podemos introducir el texto del nuevo comentario.\\ \\ También podemos usar el shortcut “ALT+C” para dibujar un comentario en el diagrama (ver tabla de shortcuts en la **ayuda del canvas**):​\\ \\ {{ :​es:​comentarios_en_diagrama2.png?​400 |}}\\ \\ Como cualquier elemento del diagrama, inicialmente la caja de comentario tendrá color rojo, que nos indica que aun debemos rellenar los campos del comentario, siendo entonces cuando la caja tendrá su fondo gris.\\ \\ {{ :​es:​comentarios_en_diagrama3.png?​400 |}}+
  
  
 **Propiedades de un comentario** **Propiedades de un comentario**
  
-Haciendo doble clic sobre un comentario o seleccionando la opción “Editar propiedades” del menú contextual (botón derecho del ratón sobre un elemento del diagrama), accedemos a la pestaña de propiedades para editar el comentario:​\\ \\ {{ :​es:​comentarios_en_diagrama4.png?​400 |}}\\ \\  +Haciendo doble clic sobre un comentario o seleccionando la opción “Editar propiedades” del menú contextual (botón derecho del ratón sobre un elemento del diagrama), accedemos a la pestaña de propiedades para editar el comentario:​\\ \\ {{ :​es:​comentarios_en_diagrama4.png?​500 |}}\\ 
- +
 Un comentario incluye 3 campos:​\\ ​ Un comentario incluye 3 campos:​\\ ​
   * **Nombre**: nombre del comentario. No se puede dejar vacío.   * **Nombre**: nombre del comentario. No se puede dejar vacío.
   * **Comentario**:​ el texto del comentario en sí. Se puede dejar vacío (no es obligatorio),​ aunque en este caso en el canvas aparecerá el cuadrado en rojo.   * **Comentario**:​ el texto del comentario en sí. Se puede dejar vacío (no es obligatorio),​ aunque en este caso en el canvas aparecerá el cuadrado en rojo.
-  * **Modo oculto**: si este checkbox está marcado, en la caja del comentario solo se muestra el nombre del comentario. Por el contrario, si el checkbox está desmarcado, en la caja aparece el nombre seguido del texto del comentario. ​ Por defecto siempre aparece desmarcado.\\ \\ Ejemplo del mismo comentario, en su modo normal (modo oculto desmarcado):​\\ \\ {{ :​es:​comentarios_en_diagrama5.png?​400 |}}\\ \\ Y en modo oculto:\\ \\ {{ :​es:​comentarios_en_diagrama6.png?​400 |}}\\ \\ **Diagrama con comentarios**+  * **Modo oculto**: si este checkbox está marcado, en la caja del comentario solo se muestra el nombre del comentario. Por el contrario, si el checkbox está desmarcado, en la caja aparece el nombre seguido del texto del comentario. ​ Por defecto siempre aparece desmarcado.\\ \\ Ejemplo del mismo comentario, en su modo normal (modo oculto desmarcado):​\\ \\ {{ :​es:​comentarios_en_diagrama5.png?​400 |}}\\ \\ Y en modo oculto:\\ \\ {{ :​es:​comentarios_en_diagrama6.png?​400 |}}\\  
 + 
 + 
 +**Diagrama con comentarios**
  
 {{ :​es:​comentarios_en_diagrama7.png?​500 |}}\\ \\  {{ :​es:​comentarios_en_diagrama7.png?​500 |}}\\ \\ 
    
-Un comentario puede dibujarse en cualquier lugar del diagrama ya que es un elemento flotante y no está asociado con ningún otro elemento del diagrama.\\ \\ Un comentario puede ser desplazado por el canvas y cambiarse de tamaño.\\ \\ El rectángulo del comentario intentará ajustarse automáticamente al texto que contiene.\\ \\ Un comentario puede incluirse en una multiselección de elementos del canvas.\\ \\ Un comentario se puede incluir en operaciones de copy/paste.\\ \\ En la redistribución vertical del diagrama se tendrán en cuenta los comentarios que estén sobre las líneas de adaptadores,​ pero no aquellos que estén en la zona vacía del diagrama.\\ \\ El contenido de los comentarios también se tiene en cuenta en las operaciones de búsqueda en el diagrama (ver botón **Buscar en diagrama**)\\ \\ {{ :​es:​comentarios_en_diagrama8.png?​400 |}}\\ \\ +  * Un comentario puede dibujarse en cualquier lugar del diagrama ya que es un elemento flotante y no está asociado con ningún otro elemento del diagrama. 
 +  * Un comentario puede ser desplazado por el canvas y cambiarse de tamaño. 
 +  * El rectángulo del comentario intentará ajustarse automáticamente al texto que contiene. 
 +  * Un comentario puede incluirse en una multiselección de elementos del canvas. 
 +  * Un comentario se puede incluir en operaciones de copy/paste. 
 +  * En la redistribución vertical del diagrama se tendrán en cuenta los comentarios que estén sobre las líneas de adaptadores,​ pero no aquellos que estén en la zona vacía del diagrama. 
 +  * El contenido de los comentarios también se tiene en cuenta en las operaciones de búsqueda en el diagrama (ver botón **Buscar en diagrama**)\\ \\ {{ :​es:​comentarios_en_diagrama8.png?​400 |}}\\ \\ 
        
  
Line 970: Line 978:
    ​* ​ Una vez pones la almohadilla es posible autocompletar con las claves del repositorio,​ como se muestra en la imagen siguiente. Para usar estas claves, las variables se generan concatenando los niveles de las claves con “_” (barra baja), hasta llegar al valor por lo que las claves deberán ser usadas como variables separadas por “_” como se muestra en el apartado de glosario.\\ \\ {{ :​es:​gestion_de_repositorios13.png?​direct&​500 |}}\\ \\     ​* ​ Una vez pones la almohadilla es posible autocompletar con las claves del repositorio,​ como se muestra en la imagen siguiente. Para usar estas claves, las variables se generan concatenando los niveles de las claves con “_” (barra baja), hasta llegar al valor por lo que las claves deberán ser usadas como variables separadas por “_” como se muestra en el apartado de glosario.\\ \\ {{ :​es:​gestion_de_repositorios13.png?​direct&​500 |}}\\ \\ 
   ​   ​
-   * Como nota importante, no usar en los nombres de las propiedades del repositorio nombres compuestos por “_” ya que a la hora de concatenar estos, podría ocasionar algún error.\\ ​+   * Como nota importante, no usar en los nombres de las propiedades del repositorio nombres compuestos por “_” ya que a la hora de concatenar estos, podría ocasionar algún error.\\ ​\\  
 + 
 + 
 + 
 + 
 + 
 +=====Gestión de Bibliotecas==== 
 + 
 +====Introducción==== 
 + 
 +La Gestión de Bibliotecas proporciona a TAST y en concreto a la parte del modelado de diagramas, una herramienta para el manejo de bibliotecas,​ mediante la cual se puedan almacenar, organizar y consultar funciones javascript ó queries Sql, que el usuario considere que son de utilidad, por ejemplo para ser reusadas en los mensajes de otros diagramas. 
 + 
 +Funciones predefinidas como por ejemplo **executeJavascript** o **dbGetQueryData**,​ son ejemplos de mensajes que incluyen un //código javascript//​ ó a una //query sql//:\\ \\ {{ :​es:​librarymanagement1.png?​direct&​500 |}}\\ \\ \\ {{ :​es:​librarymanagement2.png?​direct&​500 |}}\\    
 +  
 + 
 +  
 + 
 +  
 +====Página de Gestión de Bibliotecas==== 
 + 
 +===Menú Gestión de Bibliotecas=== 
 + 
 +Puesto que se trata de una herramienta de apoyo al modelado de diagramas, encontramos la Gestión de Bibliotecas como un submenú dentro del menú principal **Modelo**:​\\ \\ {{ :​es:​librarymanagement3.png?​direct&​200 |}}\\ \\  
 + 
 +  
 +===Pantalla Gestión de Bibliotecas=== 
 +En esta pantalla podemos crear y catalogar, editar y hacer consultas sobre los ítems de biblioteca:​\\ \\ {{ :​es:​librarymanagement4.png?​direct&​600 |}} 
 +  
 + 
 +A continuación veremos cada una de las distintas funcionalidades de la pantalla. 
 + 
 + 
 +  
 +==Crear ​ nuevo ítem de biblioteca== 
 +{{:​es:​librarymanagementicono_mas.png?​direct&​20|}} Pulsando este botón en la parte superior derecha de la pantalla, aparece un formulario donde el usuario rellenará los campos para dar de alta el nuevo ítem de biblioteca:​\\ \\ {{ :​es:​librarymanagement5.png?​direct&​400 |}}\\ \\   
 +  
 +Todos estos campos son obligatorios y no se pueden dejar vacíos. A continuación vemos dichos campos:\\ \\  
 +1. **Dominio y Proyecto**\\ \\ El usuario debe seleccionar un dominio, y dentro de él un proyecto para el nuevo ítem. Todos los usuarios pertenecientes a ese dominio tendrán acceso a los ítems de biblioteca guardados en él.\\ \\ 2. **Tipo**\\ \\ Este campo permite elegir el tipo de ítem que se va a crear, que será uno de estos dos:  
 +  * Javascript function 
 +  * Sql Query 
 +3. **Nombre**\\ \\ Campo de texto para introducir un nombre lo suficientemente descriptivo que identifique al ítem y que posteriormente facilite las búsquedas. No puede contener espacios.\\ \\ 4. **Etiquetas**\\ \\ Campo de texto para introducir uno o varias etiquetas (separadas por comas) lo suficientemente descriptivas que posteriormente faciliten su catalogación y búsquedas.\\ \\ 5. **Descripción**\\ \\ Campo de texto para introducir una descripción lo suficientemente descriptiva que posteriormente facilite la comprensión del contenido. Por ejemplo, en el caso de una función javascript, se puede describir brevemente qué hace la función, qué parámetros recibe y que resultado devuelve.\\ \\ 6. **Contenido**\\ \\ Haciendo **click** sobre este campo, se expande y nos lleva a una ventana modal con el editor de código especial para introducir código Javascript o Sql.\\ \\ Este editor admite eventos copiar/​pegar desde cualquier otro editor.\\ \\ {{ :​es:​librarymanagement6.png?​direct&​600 |}} 
 +  
 + 
 +==Selección de Dominio== 
 +  
 +{{ :​es:​librarymanagement7.png?​direct&​800 |}}\\ \\ En la pantalla //Gestión de Bibliotecas//​ inicialmente aparecerán en la lista los ítems pertenecientes al Dominio actual. Todos los usuarios que pertenezcan a dicho dominio tendrán acceso a los ítems de bibliotecas almacenados en él.\\ \\  
 + 
 + 
 +==Filtros: búsquedas para localizar ítems en las bibliotecas== 
 +  
 +{{ :​es:​librarymanagement8.png?​direct&​600 |}}\\ \\ Como se ha dicho, inicialmente aparecerán en la lista todos los ítems pertenecientes al dominio actual.\\ \\ Posteriormente el usuario puede refinar su búsqueda usando cualquiera de los filtros que se le proporcionan,​ **individual** o **conjuntamente**.\\ \\ 1. **Proyecto**\\ \\ Se pueden filtrar los resultados según su proyecto, por defecto se mostrarán todos los ítems del dominio y de cualquier proyecto dentro del mismo.\\ \\ 2. **Tipo**\\ \\ Se muestran los resultados según su tipo: Javascript code o Sql query.\\ \\ 3. **Nombre**\\ \\ Si se desea filtrar resultados por el nombre del ítem, escriba una cadena en este campo y pulse ENTER para aceptar. En la lista se mostrarán los ítems cuyo nombre sea igual o contenga la cadena introducida en este campo.\\ \\ 4. **Etiquetas**\\ \\ Si se desea filtrar resultados según las etiquetas de los ítems, escriba una o varias etiquetas en este campo (separadas por comas) y pulse ENTER para aceptar. En la lista se mostrarán los ítems cuyas etiquetas sean iguales o contengan cualquiera de las introducidas en este campo.\\ \\ 5. **Descripción**\\ \\ Si se desea filtrar resultados según la descripción del ítem, escriba una cadena en este campo y pulse ENTER para aceptar. En la lista se mostrarán los ítems cuya descripción sea igual o contenga la cadena introducida en este campo.\\ \\  
 + 
 +{{:​es:​librarymanagementicono_limpar_filtros.png?​direct&​20 |}} Pulse el botón “Limpiar filtros” en el momento que quiera limpiar los campos y reponer el estado inicial de los filtros.\\ \\  
 + 
 + 
 +==Lista o Tabla de resultados== 
 +{{ :​es:​librarymanagement9.png?​direct&​800 |}}\\ \\  
 +   
 +En la lista o tabla de resultados se muestran los ítems de biblioteca encontrados según los criterios de búsqueda en cada momento. Cada ítem aparece en una fila de la tabla.\\ \\ 1. Las Columnas **Nombre**, **Etiquetas** y **Descripción** muestran los respectivos campos y pueden ser ordenables alfabéticamente.\\ \\ 2. Columna **Ver contenido:​**\\ \\  
 +{{:​es:​librarymagementicono_content_preview.png?​direct&​40|}} Pulsando en el icono “ojo”, abrimos una previsualización del contenido del ítem, así como el último usuario que lo editó:\\ \\ {{ :​es:​librarymanagement10.png?​direct&​400 |}}\\ \\   
 +{{:​es:​librarymanagementicono_content_preview2.png?​direct&​40|}} Pulsando de nuevo el icono ocultamos la previsualización.\\ \\ 3.**Columna Acciones:​**\\ \\ {{ :​es:​librarymanagement11.png?​direct&​100 |}}\\ \\ Contiene una serie de botones para realizar acciones sobre cada ítem de biblioteca: editar, editar contenido, copiar y eliminar. 
 + 
 + 
 +==Editar un ítem de la biblioteca== 
 +{{:​es:​librarymanagement12a.png?​direct&​40|}} Pulsando el botón **Editar ítem de biblioteca** de la columna Acciones, muestra un formulario donde el usuario podrá modificar cualquiera de los campos y guardarlo de nuevo. En esta acción se comprueba además que no haya ningún otro usuario que esté editando el ítem en ese mismo momento.\\ \\ {{ :​es:​librarymanagement13.png?​direct&​400 |}} 
 +  
 + 
 +==Editar el contenido de un ítem de biblioteca== 
 +{{:​es:​librarymanagement14.png?​direct&​40|}} ​ Pulsando el botón **Editar contenido** de la columna Acciones se accede directamente al editor de código, donde el usuario podrá modificar el código javascript o sql del ítem y salvarlo de nuevo. En esta acción se comprueba además que no haya ningún otro usuario que esté editando el contenido del ítem en ese mismo momento.\\ \\ {{:​es:​librarymanagement15.png?​direct&​600|}}\\ \\   
 +  
 + 
 +==Copiar un ítem de biblioteca== 
 +{{:​es:​librarymanagement16.png?​direct&​40|}} Pulsando el botón **Copiar ítem de biblioteca** de la columna Acciones aparece un formulario para poder copiar este ítem, por ejemplo en otro dominio o proyecto, y se permite modificar ciertos campos como Nombre, Etiquetas o Descripción.\\ \\ {{ :​es:​librarymanagement17.png?​direct&​400 |}}\\ \\    
 +  
 + 
 +==Eliminar un ítem de biblioteca== 
 +{{:​es:​librarymanagement18.png?​direct&​40|}} Pulsando el botón **Borrar ítem de biblioteca** de la columna Acciones aparece un diálogo de confirmación para poder eliminar definitivamente este ítem.\\ \\ {{ :​es:​librarymanagement19.png?​direct&​400 |}}    
 +  
 + 
 + 
 + 
 +  
 +====Usabilidad desde Modeling==== 
 + 
 +===Acceso a Gestión de Bibliotecas desde Modeling=== 
 +Cuando el usuario está modelando su diagrama y necesita acceder o consultar sus bibliotecas de código Javascript o Queries Sql, puede hacerlo de 2 maneras:\\  
 + 
 +==Manualmente== 
 +Abriendo una nueva pestaña de TAST en su navegador, donde abrirá la pantalla de **Gestión de Bibliotecas**.  
 + 
 +==Automáticamente== 
 +  
 +{{:​es:​librarymanagement20.png?​direct&​100|}} Pulsando el botón **Abrir Gestión de Bibiotecas** desde //la ventana de edición de código Javascript/​Sql de Modeling//, que automáticamente le lanzará la página Gestión de Bibliotecas en una nueva pestaña de su navegador.\\ \\ {{ :​es:​librarymanagement21.png?​direct&​500 |}}{{ :​es:​librarymanagementflecha.png?​direct&​40 |}} {{ :​es:​librarymanagement22.png?​direct&​500 |}}\\ \\   
 +Nota: Recordar que la ventana de edición de código Javascript/​Sql aparece en Modeling cuando se edita el código de mensajes tales como **executeJavascript**,​ o **dbGetQueryData**,​ por ejemplo.\\ \\  
 +  
 +===Guardar código Javascript/ Sql desde Modeling en una biblioteca=== 
 +Cuando el usuario está modelando su diagrama y desea guardar el código javascript/​query sql utilizado en un mensaje determinado,​ puede hacerlo de 2 maneras:​\\ ​  
 + 
 +==Manualmente== 
 +En la pantalla Gestión de Bibliotecas el usuario creará un nuevo ítem, y hará copiar el código de Modeling y a continuación **pegar** en el campo Contenido del nuevo ítem de biblioteca.\\ \\ 
 + 
 +==Automáticamente== 
 +  
 +{{:​es:​librarymanagement23.png?​direct&​100|}} Pulsando el botón **Nuevo ítem de biblioteca** desde la ventana de edición de código Javascript/​Sql de Modeling, que automáticamente lanzará la página Gestión de Bibliotecas en una nueva pestaña de su navegador, y con el formulario de **Crear un nuevo ítem de biblioteca** abierto y con los campos Dominio, Proyecto, Tipo y Contenido ya rellenos.\\ \\ {{ :​es:​librarymanagement24.png?​direct&​500 |}}\\ {{ :​es:​librarymanagementflecha.png?​direct&​40 |}}\\ {{ :​es:​librarymanagement25.png?​direct&​500 |}}\\ \\  
 +  
 + 
 +  
 +===Recuperar código Javascript/​Sql desde una biblioteca para usarlo en Modeling=== 
 + 
 +Cuando un usuario está modelando un diagrama y editando el código javascript o sql de un mensaje, y le gustaría traerse el código desde alguna de sus bibliotecas,​ este sería el procedimiento:​\\ \\    
 +1. Abrir la pantalla de Gestión de Bibliotecas en una nueva pestaña de su navegador y localizar el código deseado,\\ \\ 2. y simplemente hacer un **copiar** del código y un **pegar** del mismo en ventana de edición de código //​Javascript/​Sql de Modeling//​.\\ \\ {{ :​es:​librarymanagement26.png?​direct&​500 |}}\\ {{ :​es:​librarymanagementflecha.png?​direct&​40 |}}\\ {{ :​es:​librarymanagement27.png?​direct&​500 |}} 
 + 
 +  
 +  
 +  
 + 
 + 
 + 
 + 
 + 
 + 
 + 
 + 
 + 
 + 
 + 
  
  
es/modeling_2.0.1728485391.txt.gz · Last modified: 2024/10/09 14:49 by montse