Cesnavarra 2009-boletín 12

Título Casos reales de la supercomputación.
Texto La última charla dedicada a la supercomputación celebrada
dentro de la Semana Internacional de la Computación, mostró
cuatro casos reales de empresas que se dedican a ofrecer dichos
servicios.

Gregorio Chillón, de Sun Microsystems, presentó esta tecnología
como una herramienta estratégica, ya que se puedo utilizar en
estos ámbitos:
 Reducir costes (por ejemplo con la disminución de
construcción prototipos, simulándolos en su lugar).
 Mejorar la calidad de los productos (ej.: estudio de la
aerodinámica de un vehículo).
 Innovación (los primeros en tener un producto, algo
habitual en la industria farmacéutica).
 Certificar comportamiento de productos en circunstancias
extremas (ej.: en la construcción de aviones).
 Tomar las mejores decisiones de la forma más rápida
posible (como ocurre en el entorno financiero).
 Ejecutar aplicaciones que demandan mayor potencia de
cálculo.
 Analizar y clasificar grandes cantidades de datos.

Daniel Navas-Parejo, de IBM, expuso cómo la supercomputación
es algo presente en nuestra vida diaria.
Que hay un beneficio para cualquiera de nosotros.
Esto es así puesto que se utiliza para realizar estudios de
meteorología, para extraer petróleo de forma más eficiente (de
un pozo se extrae sólo el 30% de su contenido).
O simular que el límite de velocidad puede variar en función de
la congestión del tráfico, disminuyendo la contaminación. Y el
tráfico lo pueden componer vehículos más seguros que han
simulado situaciones de accidentes mediante supercomputación.
Obligatoriamente dicho vehículo estará asegurado y las
compañías pueden analizar los riesgos de cada cliente mediante
modelos matemáticos. Asimismo interesa que las inversiones
bursátiles de esa compañía aseguradora estén en buenas
manos, no sea que no podamos pagar a nuestros clientes en
caso de grandes desembolsos. Todo ello lo puede simular con
supercomputación.
Puede que estemos utilizando ese automóvil para acudir al cine
para ver una película de Pixar, pongamos por caso.
La industria del calzado (con el diseño de zapatos a medidas
mediante renderización), la del juguete securizando los
productos, etc.
La supercomputación está a nuestro alrededor: incluso puede
que en breve participe en un concurso televisivo.

Tafco (premio Ideactiva 2009), de la mano de Jesús Illescas

y Fran Falcone, presentó los servicios que ofrecen. La empresa
surge de un grupo de investigación de la Universidad Pública de
Navarra.
Se dedica al diseño y fabricación de componentes (filtros o
antenas) que se aplican en entornos de telecomunicación.
Realizan también consultoría avanzada en el comportamiento de
ciertos dispositivos dentro de campos electromagnéticos.
Para el diseño de ciertos componentes crean sus propios
materiales para lo cual necesitan simulación electromagnética.

Finalmente, Rafael Grimán, de Silicon Graphics, mostró cómo su
compañía se centró desde el inicio en la gama alta de la
computación.
Sus clientes han simulado entre otras cosas el efecto de
fármacos sobre un corazón humano en tiempo real, o el
comportamiento aerodinámico de una pringle al ser disparada
para ser introducida en el bote, o el estudio hidrodinámico del
tambor de una lavadora para minimizar el consumo de agua y
electricidad, o el comportamiento deMichael Phelps en el agua
para diseñar su bañador.

Con este artículo cerramos el pequeño ciclo dedicado la
supercomputación.

P.S.: el mundo de la supercomputación cambia constantemente.
Hay un nuevo líder del Top 500: el Jaguar, con tecnología Cray.

Si quieres enviar algún comentario o sugerir temas a tratar en otros artículos, escribe a:
curtasun[simboloArroba]cein.es

Categorías General
Tema Varios
Autor Carlos Urtasun
Mes Diciembre
Año 2009
Boletín 12

Título WriteAbleBitmap en Silverlight 3
Texto En el siguiente artículo vamos a elaborar un proyecto basado en la
plataforma Silverlight3. Para este fin utilizaremos la clase
WriteAbleBitmap, con la que conseguiremos crear un efecto lupa,
que podrá ser utilizado con cualquier objeto. El resultado final de
nuestro artículo es que podamos aumentar cualquier parte de
nuestro proyecto simplemente presionando con el botón izquierdo

del ratón, así como la persistencia de dicho efecto al desplazarnos
por todo el proyecto con el botón izquierdo presionado.

En primer lugar vamos a crear un nuevo proyecto. Ejecutaremos
Expression Blend 3, seleccionamos Archivo->Nuevo Proyecto. En
el área tipo de proyecto seleccionamos Silverlight y aplicación
Silverlight. Introduciremos los valores de Nombre del proyecto
(“EfectoLupa”), la ubicación (Escritorio) y el lenguaje(C#),
presionamos OK y de este modo nuestro proyecto Silverlight 3 ha
sido creado.

Los objetos que nuestro proyecto tiene por defecto son User
control que actúa como contenedor de todos los elementos del
proyecto y Layout Root que es la capa encargada de la
organización de los distintos elementos.

Vamos a añadir un objeto Canvas, para ello nos situamos en el
área de objetos y líneas de tiempo y seleccionamos Layout Root.
Nos desplazamos hasta la barra de herramientas, y seleccionamos
el objeto Canvas.

Presionamos doble clic cobre el objeto Canvas y este se añadirá
como hijo de Layout Root.

Teniendo seleccionado el Objeto Canvas en el área de Objetos y

Líneas de Tiempo, accederemos a establecer los valores de algunas
de sus propiedades. Para ello accedemos a la pestaña propiedades
situada en la parte superior derecha de Expression Blend.

Estableceremos los siguientes valores de las correspondientes
propiedades:

 Name: Principal

 Width: 800

 Height: 720

Ahora vamos a añadir un nuevo Canvas que será el contenedor de
los distintos objetos en los que actúa el usuario. El citado Canvas
será sobre el que se va realizar la instantánea a través de la clase
WriteAbleBitmap.

Seleccionamos el objeto Principal del área de objetos y línea de
tiempos, nos situamos en la barra de herramientas, seleccionamos
un nuevo objeto Canvas, presionamos doble clic sobre el mismo y
se añadirá como hijo del objeto Principal.

Establecemos los siguientes valores para las siguientes
propiedades siguiendo los mismos pasos que en objeto anterior:

 Name:Raiz

 Width: 800

 Height:750

 Background: el color es sólido y elegimos en la paleta
de colores el color negro, para poder distinguir esta
capa del resto.

Seguidamente introduciremos dos Canvas como hijos del Objeto
Raiz y las propiedades para cada uno de ellos serán las siguientes:

Canvas1
 Name: AreaImagen

 Width:679

 Height:445

 Left: 54

 Top:45

Canvas2
 Name: AreaTexto

 Width:679

 Height:179

 Left:54

 Top:528

El último paso del diseño es incluir los objetos sobre los que van a
interactuar los usuarios. Seleccionamos el objeto AreaImagen, nos
situamos en la barra de herramientas y seleccionamos el último
icono de la misma. En la ventana emergente, en la sección de
búsqueda introducimos la palabra Image, de este modo podremos
insertar una imagen en nuestro proyecto.

Presionamos doble clic sobre el objeto Image de la barra de
herramientas, de este modo se añadirá como hijo de nuestro
objeto AreaImagen.

Ahora deberemos introducir los siguientes valores de las siguientes
propiedades:

 Width: 679

 Height: 445

 Source: elegiremos la ruta de la imagen que
deseamos que aparezca en nuestro proyecto.

Con el objeto AreaTexto seleccionado, nos situamos en la barra de
herramientas y realizamos doble clic sobre el Objeto TextBlock,
para añadirlo como hijo de área de texto. Otorgaremos los
siguientes valores a las siguientes propiedades:

 Width : 679

 Height: 169

 Background: blanco

 Text: Introduciremos el texto que deseemos.

 Tamaño de la letra será de 14 pt.

Con este último paso hemos finalizado la parte de diseño de
nuestro proyecto.

La segunda parte de nuestro artículo se basa en la creación de una
instantánea de nuestro proyecto a través de la clase Writeable
Bitmap.

Nos situamos en la carpeta de nuestro proyecto y buscamos la
solución (en mi caso “EfectoLupa.sln”), presionamos con el botón
derecho sobre esta, elegimos abrir con, elegimosVisual Studio
2008, de este modo podemos controlar la aplicación de forma
simultánea con las dos aplicaciones.

En Visual Studio 2008 abrimos MainPage.xaml.cs. Vamos a
declarar las variables que más adelante utilizaremos para lograr el
efecto. Dichas variables las situaremos dentro del constructor antes
del método public MainPage():
Boolean Aumento=false;//true cuando se produzca el aumento
private const double escala = 4.0;// Factor de escalado
private double radio = 80.0;// Radio de la lente
private Image Imagen;// imagen que va ser aumentada
private EllipseGeometry Lente;// Región de la lente
private EllipseGeometry Borde;// borde de la lente
private Path _Path; // Ruta de acceso

Dentro del método public MainPage() vamos a crear un nuevo
objeto Image, que aumentará de forma suavizada en función del
valor de la escala que le hayamos otorgado. Tomando como
referencia el alto y ancho del Canvas Raiz y lo ocultaremos para
hacerlo visible más adelante:
Imagen = new Image();
Imagen.Width = Raiz.Width * escala; //ancho de el canvas Raiz
Imagen.Height = Raiz.Height * escala; //Alto de el canvas Raiz
Imagen.Visibility = Visibility.Collapsed;

Crearemos un objeto WriteableBitmap que realizará una instantánea
del objeto Raiz y lo transformará en función de la escala del

siguiente modo:
//instantanea de Raiz en función de tamaño de la imagen
WriteableBitmap bitmap
= new WriteableBitmap((int)Imagen.Width,(int)Imagen.Height)
;
ScaleTransform tranform = new ScaleTransform();
tranform.ScaleX = tranform.ScaleY = escala; //escala la
imagen en x e y en función de la variable escala
bitmap.Render(Raiz, tranform); //procesa la imagen y la
transforma
bitmap.Invalidate();//invalidamos el bitmap para sea
procesado
Imagen.Source = bitmap; //asigna al objeto imagen la imagen
aumentada

Aplicamos un recorte a la imagen para asimilar nuestra imagen a
una lente:
Lente = new EllipseGeometry();//creamso una elipse
Lente.RadiusX = Lente.RadiusY = radio; //el radio de la
elipse será= que la variable declarada al inicio
Imagen.Clip = Lente; //recortamos la imagen

Añadimos la imagen ampliada a Raiz:
Raiz.Children.Add(_image);

Creamos una ruta de acceso para representar el borde y añadimos
la ruta al objeto Raiz
Borde = new EllipseGeometry();//creamos una nueva elipse
para representar el borde
Borde.RadiusX = Borde.RadiusX = radio; //le otorgamos el
mismo radio que la anterior elipse
_Path= new Path();
_Path.Stroke = new SolidColorBrush(Color.FromArgb(0xFF,
0x80, 0x80, 0x80)); //le asignamos el color del borde
_Path.StrokeThickness = 1.0; //le asignamos el grosor
_Path.Data = Borde;
_Path.Visibility = Visibility.Collapsed; //ocultamos el
borde
//añadimos el Path al canvas Raíz
Raiz.Children.Add(_Path);

Nos situamos en Expression Blend 3 y creamos los eventos que van
hacer que el efecto Lupa funcione con el ratón. Para ello
seleccionaremos en el área objetos y líneas de tiempo el objeto
Principal, nos desplazaremos a la pestaña propiedades y
seleccionaremos el icono para poder elegir los eventos. Los
eventos que nos interesan son MouseLeftButtonDown,
MouseLeftButtonUp y MouseMove. Para lanzarlos simplemente
haremos doble clic en el área de color gris situada a la derecha del
nombre del evento. El resultado en Expression Blend de lanzar
estos 3 eventos es el siguiente:

De este modo en nuestra parte lógica del proyecto escrita en c#, se
han creado los tres eventos.

Nos situaremos en el primer evento MouseLeftButtonDown desde
Visual Studio 2008 en el archivo MainPage.xaml.cs:
private void Raiz_MouseLeftButtonDown(object sender,
System.Windows.Input.MouseButtonEventArgs e)
{
double x = e.GetPosition(Raiz).X;
double y = e.GetPosition(Raiz).Y;
//Mostrar la lupa si el cursor está dentro del canvas.
if (x > 0.0 || x < Raiz.Width || y > 0.0 || y <
Raiz.Height)
{
PosLente(x, y); //metodo que escala la lente
Imagen.Visibility = Visibility.Visible; //muestra la
imagen aumentada
_Path.Visibility = Visibility.Visible; //muestra el
borde de la imagen
Aumento = true;
}
}

Introduciremos el código para el evento MouseLeftButtonUp:
private void Raiz_MouseLeftButtonUp(object sender,
System.Windows.Input.MouseButtonEventArgs e)
{
//ocultar la lupa cuando soltamos el botón del
ratón
if (Aumento)
{
Imagen.Visibility
= Visibility.Collapsed; //oculta la imagen
_Path.Visibility
= Visibility.Collapsed; //oculta el borde
((FrameworkElement)sender).ReleaseMouseCapt
ure();
Aumento = false;

}
}

Añadimos el siguiente código al evento MouseMove:
private void Raiz_MouseMove(object sender,
System.Windows.Input.MouseEventArgs e)

{
if (Aumento)
{
double x = e.GetPosition(Raiz).X;
double y = e.GetPosition(Raiz).Y;
//ocultaremos la lupa si el cursor sale del
canvas
if (x < 0.0 || x > Raiz.Width || y > 0.0 ||
y < Raiz.Height)
{
Imagen.Visibility
= Visibility.Collapsed; //oculta la imagen
_Path.Visibility
= Visibility.Collapsed; //oculta el borde
((FrameworkElement)sender).ReleaseMouse
Capture();
Aumento = false;

}
else
PosLente(x, y);

}
}

Por último incluiremos el método encargado de representar la
imagen de la lente en nuestro proyecto:
private void PosLente(double x, double y)
{
Lente.Center = new Point(x * escala, y *
escala); //estable el centro de la lente basandose en la
posición del ratón
Borde.Center = new Point(x, y); //estable el
centro del borde basandose en la posición del ratón
Imagen.SetValue(Canvas.LeftProperty, (1 -
escala) *
x); Imagen.SetValue(Canvas.TopProper
ty, (1 - escala) * y);
//escala la imagen

}

El último paso que debemos hacer es ejecutar nuestra
aplicación(F5) y disfrutar del evento Lupa, desplazándonos por los
controles que hemos añadido a lo largo del proyecto sin perder ni
un ápice de calidad de la imagen a la hora de aumentarla

Referencias a tener en cuenta para desarrollar este proyecto:

 Material necesario para desarrollar en la plataforma
Silverlight 3: http://silverlight.net/getstarted/

 Proyectos basados en
WriteAbleBitmap: http://www.wintellect.com/CS/blogs/jprosi
se/default.aspx

 Para descargar el proyecto completo hacer clic aquí

Categorí CES Microsoft
as
Tema Desarrollo
Autor Raúl Mayo González
Mes Diciembre
Año 2009
Boletín 12

Título ASP.Net MVC 101

Texto El modelo de ASP.NET MVC ya es muy conocido y
empleado en muchos desarrollos actualmente. Scott
Guthrie y compañía llevan desde Octubre de 2007
presentando este nuevo modelo de desarrollo a toda la
comunidad. Antes de que llegue ASP.NET MVC 2.0 con el
.NET Framework 4.0 y sus mejoras (el concepto de Área
para particionar aplicaciones grandes y facilitar su
desarrollo; los atributos de DataAnnotation para aplicar
validación a los datos, y los Template Helpers que facilitan
la creación del UI de un modelo=, vamos a ver un repaso
básico de ASP.Net MVC en este artículo que esperamos
sirva de apoyo en futuros desarrollos.
ASP.Net MVC en “dos palabros”

El patrón de arquitectura modelo vista controlador (MVC)
separa una aplicación en tres componentes principales:

 Modelos: los objetos del modelo son las partes de la
aplicación que implementan la lógica de dominio. A
menudo, el modelo de objetos también almacena y
recupera el estado del modelo en una base de datos.
 Vistas: las vistas son los componentes que muestran
interfaz de usuario la aplicación (UI). Normalmente,
esta interfaz de usuario se crea a partir de los datos
del modelo. Un ejemplo sería una vista de edición de
una tabla de productos que muestra cuadros de
texto, listas desplegables y casillas de verificación
basadas en el estado actual de un objeto de
producto.
 Controladores: son los componentes que controlan
la interacción del usuario, manipulan el modelo y, en
última instancia, seleccionan una vista para
representar la interfaz de usuario. En una aplicación
de MVC, la vista sólo muestra la información; el
controlador gestiona y responde a la entrada e
interacción del usuario.

El patrón MVC ayuda a crear aplicaciones que separan los
diferentes aspectos de la aplicación (entrada de datos,
lógica empresarial y lógica de la interfaz de usuario), al
tiempo que proporciona un acoplamiento flexible entre
estos elementos. Esta separación le ayuda a administrar la

complejidad al generar una aplicación, ya que permite que
pueda centrarse en un único aspecto de la aplicación en
un momento dado. Además de administrar la complejidad,
el patrón MVC hace más fácil probar aplicaciones que en
una aplicación ASP.NET Web tradicional, y fomenta el uso
de desarrollo guiado por pruebas (TDD) para crear un
aplicación. ASP.NET MVC también se trata de un
framework de presentación ligero al estar integrado con
las características ASP.NET existentes, tales como las
páginas maestras y autenticación basada en la
pertenencia a un grupo. Además, el acoplamiento flexible
entre los tres principales componentes de una aplicación
de MVC promueve el desarrollo paralelo. Por ejemplo, un
desarrollador puede trabajar en la vista, un segundo
desarrollador puede trabajar en la lógica del controlador y
un tercer desarrollador puede centrarse en la lógica de
negocios en el modelo.
Creando una aplicación ASP.Net MVC

A continuación vamos a crear una aplicación ASP.Net MVC
sencilla. Para empezar tendremos que bajarnos e instalar
el MVC Framework desde esta página.Luego, en Visual
Studio 2008 creamos un nuevo proyecto con la versión del
Framework 3.5 y C# de tipo ASP.Net MVC Web
Application a la que daremos el nombre que queramos. A
continuación se nos pregunta si queremos crear otro
proyecto adicional de tipo Test, a lo que diremos también
que sí. Cuando se crea una nueva aplicación Web de MVC,
Visual Studio ofrece la opción de crear dos proyectos al
mismo tiempo. El primer proyecto es un proyecto Web
donde puede implementar nuestra aplicación. El segundo
proyecto es un proyecto de prueba donde se pueden
escribir pruebas unitarias para los componentes MVC.

Vamos a configurar el proyecto principal para que escuche
en el puerto 50000, para lo que abriremos su página de
Propiedades y en la pestaña Web en la sección Servidores
elegimos “Puerto específico” e introducimos 50000. Tras
esto salvamos la aplicación (Ctrl+S).

Si nos detenemos en examinar el Explorador de soluciones
encontraremos la arquitectura de la solución MVC
compuesta de los siguientes directorios:

 * App_data: esta carpeta es el almacén físico de los
datos. Esta carpeta tiene el mismo papel como lo
hace en sitios Web de ASP.NET que utilizan las
páginas de formularios Web Forms.
 * Content: esta carpeta es la ubicación
recomendada para agregar archivos de contenido
como archivos CSS, imágenes, etc. En general, la
carpeta de contenido es para archivos estáticos.
 * Controllers: clases de controlador. En una
aplicación basada en MVC son los componentes
responsables de controlar la interacción con el
usuario final, manipular el modelo y, en última
instancia, seleccionar una vista para representar la
interfaz de usuario a mostrar. El framework MVC
requiere que los nombres de todos los controladores
terminen con la palabra "Controller" — por ejemplo,
HomeController, LoginController o ProductController.

 * Models: La carpeta de modelos se proporciona
para las clases que representan el modelo de
aplicación para la aplicación Web de MVC.
Normalmente incluye el código que define los
objetos y define la lógica para la interacción con el
almacén de datos. Normalmente, los objetos del
modelo se encontrarán en bibliotecas de clases
separadas. Sin embargo, cuando se crea una nueva
aplicación, puede poner las clases aquí y,
posteriormente, moverlos a las bibliotecas de clases
separadas.
 * Scripts: Éste es el lugar recomendado para
almacenar archivos JavaScript de la aplicación.
 * Vistas: La carpeta de vistas es la ubicación
recomendada para las vistas. Las vistas son los
componentes responsables para mostrar la interfaz
de usuario de la aplicación. Las vistas utilizan .aspx,
.ascx y archivos .master, además de otros archivos
que están relacionados con vistas de representación.
La carpeta de vistas contiene una carpeta para cada
controlador; la carpeta se denomina con el nombre
del controlador como prefijo. Por ejemplo, si tiene
un controlador llamado HomeController, la carpeta
de vistas contendrá una carpeta denominada Home.
Por defecto, cuando ASP.NET MVC carga una vista,
busca un archivo .aspx que tiene el nombre de vista
solicitada en la carpeta ViewscontrollerName
(Views[ControllerName][Action].aspx).
 * ViewsShared: De forma predeterminada, hay
también una carpeta denominada Shared en la
carpeta de vistas, que no se corresponde con ningún
controlador. La carpeta compartida se utiliza para
las vistas que se comparten entre varios
controladores. Por ejemplo, puede colocar la página
maestra de la aplicación Web en esta carpeta
compartida.

Además de las carpetas enumeradas anteriormente, una
aplicación Web de MVC utiliza el archivo global.asax para
establecer valores predeterminados de enrutamiento de
URL globales, y utiliza el archivo Web.config para
configurar la aplicación.
En las aplicaciones ASP.NET que no utilizan el MVC
framework, la interacción del usuario se organiza
alrededor de páginas y alrededor de levantar y gestionar
eventos en esas páginas. Por el contrario, la interacción

del usuario con aplicaciones de ASP.NET MVC se organiza
en torno a los Controladores y sus métodos de acción.
ASP.NET MVC asigna direcciones URL a los Controladores,
estos procesan las solicitudes entrantes, manejan datos
proporcionados por el usuario y las interacciones y
ejecutan lógica de aplicación apropiada. Normalmente,
una clase de Controlador llama a un componente de Vista
separado para generar el formato HTML de la solicitud que
ha de devolver. En una aplicación MVC, la Vista sólo
muestra la información; el Controlador gestiona y
responde a la entrada del usuario e interacción.
Si abrimos el Controlador HomeController.cs de la carpeta
de Controllers veremos el código siguiente:
using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.Mvc;

namespace CESDigitalMvcApplication.Controllers

{

[HandleError]

public class HomeController : Controller

{

public ActionResult Index()

{

ViewData["Message"] = "Welcome to ASP.NET
MVC!";

return View();

}

public ActionResult About()

{

return View();

}

}

}

Las Vistas sólo deben representar su salida utilizando los
datos específicos proporcionados por la clase de
Controlador. En ASP.NET MVC estos datos específicos de
la vista se llaman ViewData. Si vemos ahora el
archivo Index.aspx de la carpeta ViewsHome
(recordemos que las vistas para cada controlador van en
su carpeta particular) veremos este código:
<%@ Page Language="C#"
MasterPageFile="~/Views/Shared/Site.Master"
Inherits="System.Web.Mvc.ViewPage" %>

<asp:Content ID="indexTitle"
ContentPlaceHolderID="TitleContent" runat="server">

Home Page

</asp:Content>

<asp:Content ID="indexContent"
ContentPlaceHolderID="MainContent" runat="server">

<h2><%= Html.Encode(ViewData["Message"])
%></h2>

<p>

To learn more about ASP.NET MVC visit <a
href="http://asp.net/mvc" title="ASP.NET MVC

Website">http://asp.net/mvc</a>.

</p>

</asp:Content>

Aquí tenemos que dentro de unas etiquetas <h2> se
devolverá como HTML el mensaje de ViewData que hemos
generado en el Controlador. En el flujo de trabajo normal
de una aplicación Web de MVC, los métodos del
Controlador se ocupan de una solicitud Web entrante.
Estos métodos utilizan los valores de parámetros
entrantes para ejecutar el código de la aplicación y
recuperar o actualizar objetos del modelo de datos de una
base de datos, para lo que harían uso de los Modelos que
hayamos definido. A continuación, seleccionan
una Vista que representa una respuesta para el cliente
que la recibirá en su navegador Web.
De manera gráfica podemos representarlo así:

Por último nos queda ver cómo se mapean las URL a las
peticiones a los Controladores de ASP.NET MVC. ASP.NET
MVC utiliza enrutamiento ASP.NET para asignar
direcciones URL a clases de Controlador y a sus acciones.
El enrutamiento ASP.NET analiza variables en la dirección
URL de acuerdo con un patrón que se define y pasa
automáticamente las variables a una acción de
Controlador como argumentos de parámetro. De esta
manera las URL no se tienen que asignar a determinados
archivos de un sitio Web. De manera predeterminada, los
proyectos ASP.NET MVC tienen un conjunto
preconfigurado de reglas de enrutamiento de URLs que
permiten fácilmente empezar a trabajar en una aplicación
sin necesidad de configurar explícitamente nada. Este
conjunto predeterminado está dentro del
archivo global.asax creado por la plantilla de proyecto de

ASP.NET MVC en Visual Studio. La regla de enrutamiento
preconfigurada indica que el marco de ASP.NET MVC debe
asignar por defecto las URLs a controladores según el
patrón [controlador]/[acción]/[id] al determinar qué
Controlador debe instanciar y qué Acción se va a invocar
(junto con los parámetros que se le deben pasar).
using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.Mvc;

using System.Web.Routing;

namespace CESDigitalMvcApplication

{

// Note: For instructions on enabling IIS6 or IIS7
classic mode,

// visit http://go.microsoft.com/?LinkId=9394801

public class MvcApplication :
System.Web.HttpApplication

{

public static void RegisterRoutes(RouteCollection
routes)

{

routes.IgnoreRoute("{resource}.axd/{*pathInfo}");

routes.MapRoute(

"Default", //

Route name

"{controller}/{action}/{id}",
// URL with parameters

new { controller = "Home", action = "Index",
id = "" } // Parameter defaults

);

}

protected void Application_Start()

{

RegisterRoutes(RouteTable.Routes);

}

}

}

Con esto ya conocemos todos los elementos que debemos
manejar dentro del modelo ASP.NET MVC de desarrollo. Si
ejecutamos nuestro proyecto ahora mismo ya podemos
“jugar” con una aplicación MVC y con las dos acciones de
su único controlador.
Página inicial. Esta página es la misma que si
introducimos http://localhost:50000/Home/Index manual
mente en la barra de direcciones, ya que en el archivo
global.asax se crea una ruta por defecto a Home/Index.

Página About, la llamada
es http://localhost:50000/Home/About

Como este básico ejemplo demuestra, el crear
aplicaciones con el modelo MVC es también muy sencillo,
a la vez que potente. Hemos dejado fuera de este “101”
temas como:
- Acceso con Modelos a diversas fuentes de datos
- Interacciones avanzadas con los Controladores
- Presentaciones “de diseño” con Vistas avanzadas
- Todos los beneficios que aporta el uso del Test Driven
Development en el desarrollo de aplicaciones MVC
- Routing de peticiones avanzado con otros mapeos
diversos de URL
Esto nos daría para un 102, un 103… que ya iremos
viendo.
Espero que en cualquier caso los conceptos base de MVC
hayan quedado claros. Y aprovecho desde aquí para
desear a todos los que nos hayan leído unas muy Felices
Navidades y un Próspero Año Nuevo, Zorionak eta Urte
Berri On!

Categorí CES Microsoft
as

Tema Desarrollo

Autor Rafael Flores

Mes Diciembre

Año 2009

Boletín 12

Título Tácticas de guerrilla para desarrolladores
Texto En el artículo de este mes, para variar, no voy a mostrar
ningún tipo de plataforma novedosa, ni ninguna
aplicación práctica ni, por supuesto, nada de código.
Como regalo navideño voy a hablar de un libro que estoy
leyendo y cuya lectura debo agradecer a un compañero…
¡¡gracias Carlos!!

Este libro no es otro que "The Career: guerrilla tactics
for an imperfect world" y que nada tiene que ver con
tácticas de guerrilla para conquistar el mundo…bueno sí,
el mundo de la programación. A través de él, el autor,
nos plantea la situación típica que se suele dar en los
proyectos de desarrollo y las "tácticas" que podemos
emplear para solventar los problemas que van surgiendo
a lo largo del mismo.

Capítulo a capítulo se exponen, entre otras muchas
cosas, las dificultades que encuentran los
desarrolladores y "las personas de negocios" para
comunicarse, que problemas o imprevistos nos surgen
durante el desarrollo de un proyecto, y por último, que
es lo que podemos hacer o como podemos evitar esto
para garantizar que ambas partes consigan lo que
quieren. Mientras los empresarios, obtienen beneficios
en el menor periodo de tiempo, los desarrolladores
sufren menos estrés, obtienen una mayor calidad del
producto y consiguen una carrera más satisfactoria.
Realmente compensa ¿no?

De todos los temas que se tratan en el libro voy a tratar
de sintetizar la información más interesante y me voy a
centrar en lo expuesto en las dos primeras partes,

principalmente porque a la tercera ("Bulding a better
career") no he llegado. En la primera de
ellas, Christopher Duncan cuenta como en el mundo de
los negocios, muchas veces se plantea una guerra entre
los desarrolladores y las personas de negocios. Nos
viene a decir que cuando estamos creando un producto
de tipo software, los programadores debemos ser
capaces de hablar en un "lenguaje" en el que los
empresarios nos entiendan. De nada sirven nuestros
conocimientos técnicos si no sabemos "vender" lo que
estamos haciendo a aquellas personas que, queramos o
no, son las que se encargan de fijar los plazos de
desarrollo, decidir el alcance del proyecto… y despedir a
quienes no cumplan sus demandas. Para ello, lo primero
que tenemos que hacer es ser conscientes de que en el
mundo de la empresa existen múltiples factores que
pueden influir en el desarrollo de un proyecto software:
las políticas internas de la empresa, calendarios poco
realistas, una gestión incorrecta, la falta de recursos
humanos y materiales… Lo que lleva consigo un
desgaste por parte del desarrollador que, generalmente,
se traduce en horas extras continuas y niveles altos de
estrés.

Para evitar todo esto, lo que el autor sugiere es
aprender a comunicarnos con las personas de negocios
de nuestra empresa y ser capaces de transmitir en su
"lenguaje" que es lo que estamos haciendo, cómo y
cuanto tiempo nos va a llevar. De esta manera podemos
tener una oportunidad para gestionar nuestros proyectos
de forma exitosa y conseguir, por ejemplo, que se
establezcan fechas de entrega más reales, que se
empleen los recursos adecuados y que no se nos pidan
cosas que no se pueden hacer (¡o por lo menos no de la
forma en la que nos lo piden!).

En la segunda parte se habla de las pautas que debemos
seguir para evitar los problemas que suelen aparecer
durante el desarrollo de una aplicación software que, en
general, están relacionados con una gestión incorrecta
del proyecto o con unos tiempos de entrega irreales.
Este último es uno de los factores que más estrés
genera al desarrollador, ya que en la mayoría de los
casos la lista de características de un proyecto va
cambiando o aumentando sobre la marcha, mientras que
los tiempos de entrega se mantienen. Así que por regla

de tres:

Características iniciales en Tiempo X = Nº Horas

+ Características en Tiempo X = + Nº de Horas

Para evitar esto, lo que el autor propone, es definir y
entender el proceso de nuestra aplicación
correctamente, estimar los esfuerzos que vamos a
dedicar al diseño y a la implementación de la misma, y
por último gestionar nuestra gestión. Es decir, nadie
mejor que nosotros mismos, sabe cuáles son nuestras
capacidades y nuestras limitaciones, por lo tanto dentro
de la gestión global del proyecto debemos ser capaces
de gestionar nuestro propio tiempo. De forma que si
conseguimos optimizar el tiempo de desarrollo en
función de nuestras aptitudes reduciremos, en parte, el
estrés generado o las horas extras continuadas, pero
esto no depende únicamente de nosotros…

En definitiva, este libro está diseñado para ayudarnos a
ser mejores programadores dentro del mundo de los
negocios, que al fin y al cabo es en el mundo en el que
nos movemos. Así que si alguien quiere ver lo tratado en
este artículo en profundidad, y otros aspectos
relacionados ¡Ya sabéis!…
Categorías General
Tema Desarrollo
Autor Goretti Ortigosa Rada
Mes Diciembre
Año 2009
Boletín 12

Título Mashups con JavaFX
Texto Tras la introducción a JavaFX del artículo del mes de Octubre y el artículo
sobre mashups del mes de septiembre, he pensado que sería interesante
mezclarlos a ver que sale. La idea me la dio un artículo que leí sobre la
creación de un mashup con JavaFX que recopilaba y mostraba fotos de
Flickr de temas determinados.
En este caso se pensó en crear un buscador de cursos. Este buscador
recopilaría la información de los cursos que se ofrecen en los Centros de
Excelencia de Software de Navarra y en la página de Navactiva. En estos

dos casos la información viene recogida en un feed RSS. Así lo que la
aplicación debía hacer era conectarse a los RSS, coger toda la información y
procesarla para quedarse sólo con lo que interesaba que era el título de la
formación y luego la descripción de la misma. Una vez obtenida la
información requerida debía mostrarse para lo que había que crear un
interfaz gráfico donde reflejarlo.
Tras ver todo lo que era necesario, entonces se pasó a construir la
aplicación. Se intentó que siguiera un patrón MVC (Modelo, Vista,
Controlador), separando el modelo por un lado (Evento), la vista por otro
(Fondo, imágenes…) y el controlador (MashupPrueba). Por otro lado se
incluyeron las clases encargadas del parseo de los documentos
XML recibidos.
JavaFX provee de varios paquetes interesantes como javafx.io.http que da la
posibilidad de conectarse a un sitio web para hacer peticiones. En este
paquete, se encuentra la clase HttpRequest que ofrece varios métodos para
hacer peticiones GET o POST.
Ésta fue la clase que se empleó para conectarse a la las fuentes RSS de las
páginas de Navactiva y de las páginas de los Centros de Excelencia de
Software de Navarra. Después mediante la
clase javafx.data.pull.PullParser y la
clase javafx.data.pull.Event se procesa la información recibida para
poder obtener el título y la descripción de los eventos. Hay otros campos
que se incluyen dentro del contenido, pero sin embargo, no es interesante el
contenido que aportan. Para obtener todos los eventos procesados, se debe
emplear el siguiente código:

def parser = PullParser {
documentType: PullParser.XML;
input: inputStream;
onEvent: function(event: Event) {
println(event)
}
}

Con esto se puede ver todo lo que aparece al recibir los eventos. Se debe ver
el nombre del evento (campo qname) que interesa, el nivel del mismo
(campo level) y el tipo de evento que es (Type).
Se comprobó que la información que se quería obtener de los Centros de
Excelencia de Software, a partir de ahora CES, venía incluida en campos de
tipoPullParser.END_ELEMENT, mientras que la de Navactiva era en
campos PullParser.CDATA. Para separar los dos elementos y evitar
problemas, se decidió que fueran en clases diferentes. Por otra parte, los
textos que se obtenían venían formateados utilizando etiquetas de
HTML. Para evitarlo, se empleó la funcionalidad de búsqueda y sustitución

de expresiones que ofrece Java en su paquete java.util.regex. Así se
empleará el siguiente código para formatear el contenido obtenido en el RSS
de Navactiva:

public function parse(input: InputStream) {

// Parsea los datos de entrada (RSS) y
construye los objetos Evento
def parser = PullParser {

input: input

onEvent: function(event: Event) {
if (event.type ==
PullParser.CDATA) {
if (event.qname.name
== "title" andevent.level == 3){
var txDescripcion:
String = event.text;
var p: Pattern =
Pattern.compile("n");
var m: Matcher =
p.matcher(txDescripcion);
txDescripcion =
m.replaceAll("");
p =
Pattern.compile("</?.*?>");
m =
txDescripcion =
m.replaceAll(" ");
p =
Pattern.compile("s{2,}?");
m =
txDescripcion =
m.replaceAll("");
p =
Pattern.compile("t+?");
m =
txDescripcion =
m.replaceAll("");
var evento = Evento {
txTitle:
txDescripcion;
}
insert evento into

eventos;
} else if (event.qname.na
me =="description" and event.level == 3){
var txDescripcion:
String = event.text;
var p: Pattern =
Pattern.compile("n");
var m: Matcher =
txDescripcion =
m.replaceAll("");
p =
Pattern.compile("<br />");
m =
txDescripcion =
m.replaceAll("n");
p =
Pattern.compile("</?.*?>");
m =
txDescripcion =
m.replaceAll(" ");
p =
Pattern.compile("[s&&[^n]]{2,}?");
m =
txDescripcion =
m.replaceAll("");
p =
Pattern.compile("t+?");
m =
txDescripcion =
m.replaceAll("");
eventos[sizeof(eventos
)-1].txDescription=txDescripcion;
}
} else if (event.type ==
PullParser.END_DOCUMENT) {
if (onDone != null) {
onDone(eventos); }
}
}
}

parser.parse();
}

}

Así por ejemplo de:

Noáin,
15 y 22 de enero de 2010<br /> <a
href="/web/es/colaboradores/ces"><em>Centros de
Excelencia Software (CES) -
CEIN</em></a>

Se pasa tras el formateo a:

Noáin, 15 y 22 de enero de 2010
Centros de Excelencia Software (CES) - CEIN

Con </?.*?>, se buscan todas las etiquetas HTML y se reemplazan por un
espacio. Si no se pusiera el interrogante, cogería desde el comienzo de la
primera etiqueta, hasta el final de la última. Con “*?”, se indica que da igual
el contenido y con “/?.” se indica que la barra (/), puede aparecer una o
ninguna vez. En [s&&[^n]]{2,}?, lo que se hace es eliminar todo
tipo de espacio (espacio en blanco, tabulador, salto de línea …) salvo los
saltos de línea de los que aparezcan al menos 2 seguidos. En las expresiones
regulares s implica todo tipo de espacio en blanco, con [^n], lo que se
hace es decir que no sean de tipo salto de línea y con {2,}, se dice que haya
al menos dos juntos. Las barras, se incluyen porque es un String, y si no, no
funciona bien. Este último patrón, no me funcionaba todavía bien con los
tabuladores, así que incluí t+?, con esto, lo que se hace es coger todos los
tabuladores, pues con el + se dice que aparezcan al menos una vez.
Para hacer el panel con desplazamiento que aparece cuando el texto es
demasiado grande, se ha empleado la clase ScrollPane que emplea la
claseBounds, ambas creadas por Sergey Malenkov y publicadas
en: http://weblogs.java.net/blog/malenkov/archive/2009/06/ui_ontrols_in_j.h
tml. Como se ha empleado un SwingComboBox del
paquete javafx.ext.swing, dado que en la
librería javafx.scene.control no había ninguno, entonces, esto implica,
que la aplicación sólo puede tener el perfil de escritorio, si se hubiesen
empleado sólo elementos de javafx.scene.control, entonces se podría
utilizar también el perfil móvil. Si se quisiera saber el perfil del dispositivo
que se emplea habría que utilizar un if, de forma que:

if("{__PROFILE__}" == "mobile") {

} else if ("{__PROFILE__}" == "browser"){
} else if ("{__PROFILE__}" == "desktop"){
}

Se pondría el contenido apropiado a cada perfil. Esto al final no es necesario
en esta aplicación, puesto que se ha comentado que sólo puede tener un
único perfil.

Desde el script principal que es MashupPrueba.fx, se da acceso al resto de
elementos. En este script principal, aparecen elementos necesarios para la
creación de la aplicación gráfica, como son la definición de los
elementos Stage y Scene, aunque para lograr el aspecto final de la misma
se definan como transparentes. El uso de Stage es fundamental, pues lo que
hace es crear la ventana donde se muestra la aplicación y con Scene, lo que
se hace es definir el contenedor donde se van a situar el resto de
elementos. Además, esta representación que se hace en este script, y puesto
que se emplean variables de tipo Stage y Scene, se deberá emplear la
función run(), para que se ejecute. Dentro de esta función se invoca a las
clases que permiten la visualización de la aplicación
como com.cein.javafx.mashup.view.Fondo y se obtienen y procesan
los datos.
Dentro de la aplicación se han empleado varios botones para cerrarla,
maximizarla y minimizarla, además se ha puesto que
tanto Stage como Scene sean transparentes. Esto implica que sobre Linux
no va a funcionar correctamente, pues la implementación de JavaFX para
este sistema operativo no lo soporta. Para utilizarlo sobre
Linux, Stage debería tener el estilo Stage.UNDECORATED. Un fallo de la
misma y que no se ha podido resolver es que cuando se maximiza la ventana
y luego se minimiza, al volverla a restaurar, no aparece maximizada, aparece
con el tamaño inicial. Se han buscado por Internet posibles soluciones a este
problema, pero parece ser, que esto funciona así. Para cambiar el tamaño de
la ventana, se utilizan las variables iconified yfullScreen de la
clase Stage. Estas variables son de tipo booleano. Para cerrar la aplicación
se emplea la función javafx.lang.FX.exit(). Estos cambios se pasan
como valores cuando se pulsa con el ratón sobre los botones de disminuir,
tamaño completo o cerrar que aparecen en el extremo superior derecho de la
aplicación. Se pasará una función que cambie estos valores a la
variable onMousePressed que aparece en cualquier tipo de componente
gráfico, ya que todos heredan de la clase javafx.scene.Node.
Para comprobar el funcionamiento de la misma, el código fuente completo
de la aplicación se puede descargar desde aquí. Sólo se incluyen los archivos
fx, no las clases generadas.
Al final la aplicación terminada queda así:

Figura 1. La aplicación recién cargada

Figura 2. Selección de evento.

Figura 3. Muestra del evento.

Figura 4. Aplicación maximizada.

ENLACES DE INTERÉS:

 http://javafx.com/

 http://en.wikipedia.org/wiki/JavaFX

 http://es.wikipedia.org/wiki/JavaFX

 http://en.wikipedia.org/wiki/JavaFX_Script

 http://en.wikipedia.org/wiki/JavaFX_Mobile

 http://onjava.com/pub/a/onjava/2007/07/27/introduct
ion-to-javafx-script.html

 http://www.javaworld.com/javaworld/jw-11-2008/jw-
11-jump-into-jfx-1.html

12-jump-into-jfx-2.html

02-javafx-fights-flash.html

 http://java.sun.com/developer/technicalArticles/javafx
/mobile/

 http://java.sun.com/javafx/1/tutorials/core/

 http://www.ibm.com/developerworks/web/library/wa-
javafx/index.html

 http://javafx.com/docs/tutorials/mediabrowser/module
3_task1.jsp

 http://arstechnica.com/old/content/2008/12/hands-
on-building-rich-internet-apps-with-javafx-1-0.ars

 http://today.java.net/pub/a/today/2009/02/17/javafx-
http-networking-and-xml-parsing.html

 http://weblogs.java.net/blog/caroljmcdonald/archive/2
009/02/javafx_restful_1.html

 http://www.javafx.com/samples/Tweeter/index.html

 http://blogs.sun.com/clarkeman/entry/javafx_1_0_ano
ther_improvment

 http://www.javapassion.com/javafx/

 http://java.sun.com/javafx/1/reference/system-
requirements-1-2.html#javafxsdk

Categ CES OpenSouce/Java
orías
Tema Desarrollo
Autor Blanca Cubas Cruz
Mes Diciembre
Año 2009
Boletí 12
n

Títul Google App Engine
o
Text Google App Engine para aplicaciones java
o
Ya está Google App Engine para java. Con el complemento de
Google para Eclipse, es aún más fácil. El complemento te permite
crear, probar y subir aplicaciones App Engine desde Eclipse.

DESCARGAS NECESARIAS

Eclipse 3.3:

http://www.eclipse.org/downloads/download.php?file=/technology/
epp/downloads/release/europa/winter/eclipse-jee-europa-winter-
win32.zip

Instalación del Componente de Google para Eclipse:

El componete de Google se instala a través de la función "Software
Update" de Eclipse.

Desde el menú seleccionamos Help > Software Updates > Find and
Install. Se abrirá la ventana “Feature Updates”, y elegimos “Search
for new features and install “.

Hacemos clic en el botón New Remote Site y se abrirá la
ventana New Update Site. Le damos un nombre e introducimos la
ubicación del complemento:

http://dl.google.com/eclipse/plugin/3.3

Desplegamos la nueva ubicación y seleccionamos las opciones a
intalar. Activamos las casillas "Google Plugin for Eclipse 3.4" y
"Google App Engine Java SDK". Aceptamos la instalación y al
finalizar nos pedirá reiniciar Eclipse. El complemento está instalado.

CREACIÓN DE UN PROYECTO

Para crear un nuevo proyecto de App Engine:

Seleccionamos el menú File > New > Web Application
Project. También podemos acceder desde el botón "New Web
Application Project" de la barra de herramientas: .

Se abrirá el asistente "Create a Web Application Project". En
"Project name", introduce un nombre para tu proyecto como, por
ejemplo, Guestbook para el proyecto descrito en la Guía de
introducción. En "Package", introduce un nombre de paquete
adecuado como, por ejemplo, guestbook.

Si no utilizas Google Web Toolkit, desactiva la casilla de verificación
"Use Google Web Toolkit". Comprueba que la casilla de verificación
"Use Google App Engine" esté activada.

Al darle a Finish crearemos el proyecto.

El asistente crea una estructura de directorio para el proyecto, que
incluye un directorio src/ para los archivos de origen Java y un
directorio war/ para las clases compiladas y otros archivos de la
aplicación, bibliotecas, archivos de configuración, archivos estáticos
(como, por ejemplo, imágenes y CSS), así como otros archivos de
datos. El asistente también crea un archivo de origen servlet y dos
archivos de configuración. La estructura de directorio completa es
similar a:

El directorio war/ utiliza el formato estándar WAR para asociar
aplicaciones web. (Los archivos del archivo WAR no son compatibles
con el SDK). El complemento de Eclipse utiliza este directorio para
ejecutar el servidor de desarrollo y para implementar la aplicación
en App Engine.

Cuando Eclipse crea tu proyecto, crea un directorio
denominado classes/ en war/WEB-INF/ y coloca los archivos de la
clase compilada en él. Eclipse también copia archivos sin origen que
se encuentran en src/ a war/WEB-INF/classes/, entre los que se
incluyen META-INF/ y los
archivos log4j.properties y logging.properties. El contenido final del
directorio war/ prepara la aplicación para probarse e
implementarse.

EJECUCIÓN DEL PROYECTO

Ejecutamos el proyecto desde la barra de herramientas y podremos
verlo en http://localhost:8080

SUBIDA A GOOGLE APP ENGINE

Creación de la aplicación en Google App Engine:

Con nuestro usuario Gmail podemos crearnos aplicaciones en
Google App Engine. Al crear la aplicación nos piden un identificador
y título. El identificador debe contener sólo números, letras
minúsculas y guiones. Debe tener entre 6 y 30 caracteres. Podemos
consultar la disponibilidad de nuestro identificador con el
botón Check Availability. También podemos implementar la
aplicación en cualquier dominio de tu propiedad añadiendo
dominios. También desde esta ventana podremos restringir el
acceso a nuestra aplicación ya que por defecto todo usuario de
Google podrá acceder.

Subir la aplicación a Google App Engine:

El botón de implementación de App Engine sube tu aplicación
a App Engine. Debemos introducir los datos de la cuenta con la que
hemos creado la aplicación en Google App Engine.

Antes de implementar debemos definir el Application ID antes
definida al crear la aplicación en Google App Engine.

Ahora ya podemos acceder a nuestra aplicación desde la url:

http://<ID de la aplicación>.appspot.com

MONITORIZACIÓN DE NUESTRA APLICACIÓN

Desde http://appengine.google.com/ podemos acceder a todas
nuetras aplicaciones y nos mostrara la siguiente ventana donde
podemos controlarlas.

http://code.google.com/intl/es-ES/eclipse/

http://code.google.com/intl/es-
ES/appengine/docs/java/tools/eclipse.html

http://code.google.com/intl/es/appengine/docs/java/tools/uploadin
ganapp.html

http://code.google.com/intl/es/appengine/downloads.html

Cate General
goría
s
Tema Desarrollo

Auto Edurne Berastegi Zabalza
r
Mes Diciembre

Año 2009

Bolet 12
ín

Cesnavarra 2009-boletín 12

Más contenido relacionado

Destacado (20)

Similar a Cesnavarra 2009-boletín 12 (20)

Más de Cein (20)

Cesnavarra 2009-boletín 12