(10:00 HS Colombia – 13:00 HS BUENOS AIRES)

Oradores:

·        Angel “HPC” Lopez

·        Sebastian Renzi

Abstract:

El termino HPC (High Performance Computing) se refiere a la necesidad de contar con gran potencia de computo para la resolución de problemas. Con el avance de la tecnología y el abaratamiento de los costos en hardware, hoy en día no es necesario contar con una supercomputadora e invertir grandes cantidades de dinero para obtener gran poder de computo. A partir de la aparición de “clusters”, conformados por máquinas convencionales, podemos explotar al máximo la capacidad de cálculo de cada una de ellas mediante la utilización de Windows HPC Server 2008. En esta oportunidad veremos una introducción al tema de HPC, conjuntamente con las principales características de Windows HPC Server 2008.

http://msevents.microsoft.com/CUI/WebCastEventDetails.aspx?EventID=1032390223&EventCategory=4&culture=es-AR&CountryCode=AR

Diciembre 3: HPC 2008: Instalación y Despliegue

(10:00 HS Colombia – 13:00 HS BUENOS AIRES)

Oradores:

·        Ezequiel Bella

·        Maximiliano Déboli

Abstract:

Con Windows HPC Server 2008, tenemos a nuestra disposición el poder de una supercomputadora: podemos armar un “cluster” de máquinas para ejecutar trabajos en paralelo, de forma de poder aumentar el poder de cálculo con solo agregar más máquinas en el sistema.

En esta oportunidad mostraremos como construir un clúster utilizando Windows HPC Server 2008. A lo largo de la sesión, analizaremos las diferentes topologías que se pueden conformar; las nuevas herramientas disponibles para la instalación y puesta en marcha de nuevas máquinas en un clúster basada en plantillas; y por ultimo ejecutaremos una tarea sencilla sobre el clúster.

http://msevents.microsoft.com/CUI/WebCastEventDetails.aspx?EventID=1032390230&EventCategory=4&culture=es-AR&CountryCode=AR

Diciembre 4: HPC 2008: Ejecución y Administración

(15:30 HS Colombia – 18:30 HS BUENOS AIRES)

Oradores:

·        Maximiliano Déboli

·        Jorge Andrés Garcia

Abstract:

Con Windows HPC Server 2008, tenemos a nuestra disposición el poder de una supercomputadora: podemos armar un “cluster” de máquinas para ejecutar trabajos en paralelo, de forma de poder aumentar el poder de cálculo con solo agregar más máquinas en el sistema.

En esta sesión veremos distintas formas de enviar trabajo a un “cluster” de HPC y obtener sus resultados. Al tener varias máquinas bajo control, estudiaremos las facilidades de administración, monitoreo y diagnóstico que ofrece esta plataforma. Podremos ver gráficamente el estado de los nodos, su carga de trabajo, así como verificar la salud de su funcionamiento.

http://msevents.microsoft.com/CUI/WebCastEventDetails.aspx?EventID=1032390234&EventCategory=4&culture=es-AR&CountryCode=AR

(fuente: MVC preview 2 Readme)

Cambios en la estructura del proyecto

Agregado de las librerías de MVC v2 y remoción de MVC Toolkit y Web.Extensions 3.6.0.0

• Hay que remover las librerías MVCToolkit y Web.Extensions 3.6.0.0 y agregar las librerías System.Web.Abstractions, System.Web.Mvc y System.Web.Routing

Agregado de nuevo archivo de Web.Config en el directorio Views

• Hay que agregar un Web.config en la carpeta views con el siguiente código:

<?xml version="1.0"?>
<configuration>
  <system.web>
    <httpHandlers>
      <remove verb="*" path="*.aspx"/>
      <add path="*.aspx" verb="*"
          type="System.Web.HttpNotFoundHandler"/>
    </httpHandlers>
  </system.web>
 
  <system.webServer>
    <validation validateIntegratedModeConfiguration="false"/>
    <handlers>
      <remove name="PageHandlerFactory-ISAPI-2.0"/>
      <remove name="PageHandlerFactory-ISAPI-1.1"/>
      <remove name="PageHandlerFactory-Integrated"/>
      <add name="BlockViewHandler" path="*.aspx" verb="*"
          preCondition="integratedMode"
          type="System.Web.HttpNotFoundHandler"/>
    </handlers>
  </system.webServer>
</configuration>

Cambios en el archivo Web.config

Cambio de versión de Web.Extensions v3.6.0.0 a v3.5.0.0

• Cambiar en el web.config todas las versiones de la librería web.extensions (donde dice 3.6.0.0 hay que poner 3.5.0.0

Remover Bindings y Dynamic Data and Routing Modules and Handlers

• Remover las dependetAssembly que mapeaba las versiones anteriores de Web.Extensions a la versión 3.6.0.0 (esto está dentro del tag
• Remover de  los tags con namespace System.Web.DynamicData y tagName ~/App_Shared/DynamicDataFields/FilterUserControl.ascx
• Remover de el tag de System.Web.DynamicData.DynamicDataControlSessions
• Remover la sección bajo
• Remover de la sección los modulos de DynamicDataModule y UrlRoutingModule
• Remover de el módulo UrlRoutingModule.

Nuevo ruteo usando System.Web.Routing

• En  agregar el siguiente código en la sección : <add name="UrlRoutingModule" type="System.Web.Routing.UrlRoutingModule, System.Web.Routing, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" />

• En  agregar el siguiente código en la sección : <add name="MvcScriptMap" preCondition="classicMode,bitness32" verb="*" path="*.mvc"modules="IsapiModule" scriptProcessor="%windir%\Microsoft.NET\Framework\v2.0.50727\aspnet_isapi.dll" />

  <add name="MvcScriptMap64" preCondition="classicMode,bitness64" verb="*" path="*.mvc" modules="IsapiModule" scriptProcessor="%windir%\Microsoft.NET\Framework64\v2.0.50727\aspnet_isapi.dll" />

  <add name="UrlRoutingHandler" preCondition="integratedMode" verb="*" path="UrlRouting.axd" type="System.Web.Routing.UrlRoutingHandler, System.Web.Routing,Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" />

• En agregar el siguiente código:<add namespace="System.Web.Routing"/>

• En httpModules agregar el siguiente código: <add name="UrlRoutingModule" type="System.Web.Routing.UrlRoutingModule, System.Web.Routing, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35" />

Nuevos modulos de MVC

• Agregar el siguiente código en : <add assembly="System.Web.Abstractions, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>
  <add assembly="System.Web.Routing, Version=3.5.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>
  <add assembly="System.Web.Mvc, Version=1.0.0.0, Culture=neutral, PublicKeyToken=31BF3856AD364E35"/>

Cambios en Global.asax

Nueva alta de rutas

• Se genera un nuevo método que es llamado por Application_Start: protected void Application_Start(object sender, EventArgs e)
  {
      RegisterRoutes(RouteTable.Routes);
  }

• El método agrega rutas en una collection: private static void RegisterRoutes(RouteCollection routes)
  {
      // Note: Change the URL to "{controller}.mvc/{action}/{id}" to enable
      //       automatic support on IIS6 and IIS7 classic mode
   
      routes.Add(new Route("{controller}/{action}/{id}", new MvcRouteHandler())
      {
          Defaults = new RouteValueDictionary(new { action = "Index",
              id = ""}),
      });
  

  Cambio de identificación de los parámetros (cambio de [] a {})

Cambio de identificación de los parámetros (cambio de [] a {})

• Verificar que los parámetros en las rutas estén declarados entre llaves {} y no entre corchetes []: "{controller}/{action}/{id}"

Cambios en Controllers

Remover los tags ControllerAction de los métodos y agregar los tags NonAction

• Todos los métodos públicos de un controller (a excepción de los constructores) son considerados actions. Hay que remover los tags [ControllerAction] porque no sirven más

• Todos los métodos públicos de un controller (a excepción de los constructores) que no quieran ser considerados actions deben etiquetarse con el tag [NonAction]

Cambios en Views

Cambios en HtmlHelper y UrlHelper

• El método ActionLink de HtmlHelper no conserva la firma (string linkText, object values). Estos métodos deben reemplazarse por la firma (string linkText, string actionName, object values) quitando la property Action del objecto values.

• El método Action de UrlHelper no conserva la firma (object values). Estos métodos deben reemplazarse por la firma (string actionName, object values) quitando la property Action del objecto values.

Escribir un controller base desde el cual heredan los controllers y una view base desde la cual heredan todas las views tiene muchos beneficios. Aquí presentamos algunos que se vuelven particularmente interesantes al momento de migrar de MVC v1 a v2.

Reescritura de HtmlHelper.ActionLink y UrlHelper.Action

Como vimos en el post anterior, el HtmlHelper.ActionLink y el UrlHelper.Action perdieron 2 firmas, lo que implicaría cambiar TODAS las llamadas a los métodos ActionLink y Action que usen esa firma en TODAS las views. Si existiera una view base de la cual hereden todas las views, una solución a este problema es sobreescribir las property Html y Url de la view Base con clases que hereden de HtmlHelper y UrlHelper y que implementen los métodos ActionLink y Action con los parámetros anteriores. No es una solución prolija, pero en caso de tener muchas views es mucho más rápida que cambiar todas las vistas. El código sería el siguiente:

Reemplazo de OnError por HandleUnknowAction

Antes

Después

Cambio de OnPreAction por OnActionExecuting

Antes

Después

Sobreescribir InvokeActionMethod

Este es el primero de una serie de post en el cual mostraremos paso a paso la implementación de la aplicación del proyecto Miyagi.  Esta serie tiene como objeto mostrar a través de un ejemplo práctico el proceso de desarrollo de aplicaciones en Southworks mostrando el avance que día a día fue ocurriendo en la aplicación.

Cabe destacar que esta serie de posts comienza una vez que ya se definió el alcance del proyecto (Capacity, Project Charter, business stories, etc). Las etapas previas del proyecto estarán publicadas en otra serie de post (que se publicará en breve).

Brevemente, Miyagi es un proyecto  de administración de recursos y proyectos. La aplicación provee funcionalidad para asignar tiempos de dedicación de recursos a proyectos, proveer una serie de alertas en casos especiales (sobre-asignación de horas, sub-asignación, etc) y varias funcionalidades para consultar esta información. 

Partimos entonces desde el punto en el que se consensuó que el alcance de la aplicación se reduce al desarrollo de 3 vistas principales que son las mínimas que se necesitan para satisfacer las necesidades del cliente. Las vistas se muestran en la figura 1.

Figura 1: Vistas de Capacidad, Alocación y Proyecto

La idea es crear rápidamente un prototipo de la aplicación que se va a desarrollar con varios objetivos en mente:

Ø  Darle rápidamente algo tangible al cliente

Ø  Mostrarle que entendimos lo que necesita

Ø  Mostrarle cómo la aplicación que desarrollemos va a agregarle valor

Ø  Que sirva para validar o refutar lo que tenemos relevado hasta el momento.

Ø  Bajar a tierra las ideas que estaban en papel para que el mismo equipo de desarrollo empiece a pensar en algo más tangible

La filosofía es simple: Hacer sólo lo necesario, de la forma más sencilla y rápida posible para conseguir lo que queremos. La idea es no perder el foco de lo que queremos conseguir (un prototipo en este caso) y tratar de no buscar la mejor solución sino una que funcione. Cualquier semejanza con TDD no es casualidad.

Para generar el prototipo, el primer paso es crear un primer diseño de la BD. En la figura 2 se muestra el diseño resultante que permite almacenar la información necesaria. La tabla Resource almacena los recursos de la empresa, la tabla Project almacena los proyectos y las tablas HotAllocation y ColdAllocation almacenan las asignaciones a un recurso en un proyecto en un día determinado (la asignación por día es la menor granularidad posible). La división entre hot y cold allocation está pensada a efectos de mejorar la performance de la aplicación (ya se verá más adelante el funcionamiento de estas tablas).

Figura 2: Primer diseño de la BD.

El segundo paso es crear la arquitectura básica de la aplicación que vamos a desarrollar.  En nuestro caso, para este primer prototipo se estipulo crear una aplicación web desarrollada en ASP 2.0. Por lo tanto creamos una solución .Net que más simple que permite cumplir con este requisito:

Ø  Un web site (WebUX)

Ø  Un web service (Host.Asmx)

Ø  Una capa de negocio (Services)

Ø  Una aplicación de test de la capa de negocios (Services.Test)

La figura 3 muestra esta arquitectura.

Figura 3: Arquitecura de la aplicación

Aquí empieza el concepto de desarrollo en TDD.  Tenemos que tener una aplicación que compile siempre y que tenga un código correcto, pero que sea lo más fácil y rápido para implementar. Lo primero que hacemos entonces es compilar la solución que creamos y corregir los bugs que surjan. Luego tenemos que correr el analizador de código estático (FxCop) y corregir los warnings que este nos tira. Una vez que corregimos todo esto, tenemos nuestra primera versión correcta.

Luego tenemos que volver a pensar, cuál es el foco? Qué es lo primero, lo más importante que quiero hacer? Ante esta pregunta, la respuesta que surgió es “quiero mostrarle al cliente, el diseño de las pantallas que me pidió en papel en una aplicación”. Según TDD esta pregunta tiene que trasladarse a un test. El test, en este caso es manual, es un test de diseño: Necesitamos 3 páginas web que cumplan con el diseño gráfico previamente consensuado.

Ahora hay que pensar, “Para lograr esto, cual es la forma más rápida y fácil?”. La respuesta que se presentó es sorprendente y obvia: Exportar las vistas de Excel a HTML y pegarlas en 3 páginas Aspx cumple con este objetivo!!!

Por lo tanto, creamos 3 páginas aspx (ver Figura 4) y exportamos las vistas a html y pegamos el código en estos archivos. Rápidamente concluímos una implementación que cumple con el primer test: Comparando las vistas eran idénticas a las que estaban en Excel. Nuevamente compilamos la aplicación y corrimos el FxCop para asegurarnos que no tenemos problemas. Esto se convirtió en nuestra segunda versión de la aplicación. Fijense que aunque mínimo, esta versión muestra un incremento y que se acerca un poco más al objetivo que buscamos (no perdimos el foco).

Figura 4: Las 3 vistas de la aplicación.

Luego, con un poco de ayuda de expertos, mejoramos el html, en lo que sería un primer refactor de la aplicación (la idea es que en el refactor se elimina código redundante y se mejorar atributos de calidad de la aplicación). En este caso, se limpió el código html generado y se creó un css style que evita repetir código y permite reducir los errores de escritura del html. La figura 5 muestra el diseño final.

Figura 5: Diseño de la vista de capacity luego del refactor.

Hoy les quiero mostrar una forma sencilla de hacer controles utilizando la tecnología Silverlight 1.0 (con  una ayudita de JavaScript). Debido a la extensión del documento voy a dividir la creación del control en 2 partes, una que muestre la creación del XAML de presentación y otra que muestre la lógica Javascript del control.

Seguramente se preguntarán porque hacer controles en Silverlight 1.0 si en la versión 1.1 es sencillo hacer controles utilizando C#. Estas son, en mi opinión, las ventajas:

Ø  Primero, Silverlight 1.1  requiere el Framework .Net versión 3.0 instalado en la máquina servidor además de un Servidor que soporte ASP.Net. Silverlight 1.0 en cambio requiere solamente el plug-in de Silverlight instalado en la/s máquina/s cliente para funcionar. Esto permite que las aplicaciones en Silverlight 1.0 puedan ejecutarse en muchas máquinas sin la necesidad de instalar componentes adicionales (salvo el plug-in, que es necesario también para la versión 1.1) ni de modificar toda la aplicación para cambiar el look&feel.

Ø  Segundo, Silverlight 1.0 se corre enteramente del lado cliente. Esto trae una enorme mejora en la performance de la aplicación. Y si bien con Ajax se logra lo mismo, Silverlight permite realizar con mucho menos esfuerzo componentes gráficos muy interesantes.

Ø  Tercero, si planean hacer desarrollos basados en la plataforma .Net en el futuro (y especialmente en la rama de Foundation),  migrar el look&feel de su aplicación a Silverlight 1.0 es un excelente primer paso. Estos controles y los XAML pueden utilizarse sobre la aplicación actual y van a seguir siendo utilizables cuando se quiera migrar esa aplicación a nuevas tecnologías.

Ø  Cuarto,  es bueno hacer controles. Los controles son porciones de código reutilizables, encapsulan funcionalidades coherentes, tienen un comportamiento previsible y una larga lista de etcéteras.

Ø  Quinto y no menos importante, provee todas las ventajas del entorno Silverlight-WPF (es multi-browser, se ejecuta puramente del lado del cliente, es multiplataforma ya que para funcionar interpreta el XAML mediante DLR y otra larga lista de etcéteras).

En suma, Silverlight 1.0 puede ser implementado en su actual aplicación, con un mínimo esfuerzo y sin necesidad de cambiar nada más que cambiar el look&feel de las páginas de su aplicación. Lo único que requiere es un plug-in ActiveX para funcionar instalado del lado cliente y el esfuerzo requerido para estos cambios va a ser una inversión para el crecimiento de su aplicación en un futuro no muy lejano.

Desarrollo del XAML

Elegí hacer un control que simule el efecto de una gota de agua. No encontré ejemplos de esta animación en Silverlight y por eso me pareció interesante. Voy a utilizar el Microsoft Expression Blend para hacer el xaml.  Lo primero es generar un objeto elipse sin relleno de 12 pixels de width y 10 de heigth (aproximadamente, en el código de ejemplo está hecho a ojo),  el borde se configura con un gradiente radial con 3 tonalidades, que empiece y termine con color blanco y en el medio con color negro.  También configuramos el ancho de la línea con valor 0 y la opacidad en un 30%. Copiamos 2 veces el objeto elipse y llamamos a las copias ElipseAgua, ElipseAgua1 y ElipseAgua2. Asegurarse que los 3 objetos estén centrados en un mismo punto de inicio (setear las propiedades Canvas.Left y Canvas.Top con los mismos valores).

Figura 1: Vista del Expression Blend con los elipses generados.

Ahora hacemos una animación que modifique los Elipses para simular el movimiento que se produce cuando cae una gota de agua. Para eso generamos una nueva animación a la que llamamos TimelineAgua y elegimos en orden el ElipseAgua, ElipseAgua1 y ElipseAgua2. Grabamos en el ElipseAgua la posición actual al comienzo de la animación y luego grabamos a los 2 segundos un movimiento estirando el objeto hasta cubrir todo el ancho del Canvas (teniendo en cuenta que tenga una forma de elipse y siempre manteniéndose centrado con respecto al centro original). También configuramos en ese momento la propiedad ancho de línea a 0.5. Luego, 1 cuarto de segundo después, volvemos a grabar el ElipseAgua pero el único cambio que hacemos es volver el ancho de línea al valor 0. Repetimos la animación para el ElipseAgua1, pero comenzando la animación 1 segundo después que el caso anterior y terminando 1 segundo más tarde y teniendo en cuenta estirar el objeto en una proporción menor que el caso anterior. El cambio de la propiedad ancho de línea a 0 debe durar un poco menos que 1 cuarto de segundo. Repetimos la animación para el caso ElipseAgua2 cambiando nuevamente el momento del inicio de la animación y el momento de finalización. Debería verse una animación similar a la que se muestra en la figura 2.

Figura 2: Vista del Expression Blend mostrando el Timeline de Animación.

Para probar la animación cree una función start que vinculé con el evento MouseLeftButtonDown del Canvas. El código es muy sencillo:

En Silverlight 1.0 se pueden generar animaciones a partir de UI Elements.  

Para darle animación a un elemento tiene que setearse la propiedad Name del elemento. Esto sirve para identificar al elemento que se quiere animar.

Se puede utilizar un Trigger para capturar un evento (en Silverlight 1.0 el único disponible es el load de un Canvas). Se establece en el tag BeginStoryboard los pasos que va a realizar la animación.

Scripting y eventos de mouse

Se pueden capturar eventos del mouse y manejarlos mediante scripting.  Para esto se tiene que acceder a los objetos (el plug-in, el canvas y los objetos contenidos en el canvas) en las funciones javascript y cambiar el valor de sus propiedades. También se pueden crear en forma dinámica objetos manipulando el XAML y controlar animaciones también mediante scripting.

Todos los objetos pueden capturar eventos del mouse.

Para acceder a un objeto en javascript existen 3 posibilidades:

-          Que sea pasado como parámetro: Cuando se indican parámetros en las funciones que se utilizan para manejar el evento, el primer parámetro siempre es el objeto que capturó el evento (sender).

-          Qué esté contenido dentro del objeto pasado como parámetro: En ese caso se utiliza sender.findName(“nombreObjeto”). El objeto a buscar debe tener seteada la propiedad Name.

-          Que se esté buscando el objeto plug-in: En este caso puede obtenerse mediante el método getHost() del objeto sender (siempre que exista un objeto sender) o invocando al método getElementById.

Dos métodos interesantes son:

-          sender[“attachedPropertyName”]:  Permite manipular las propiedades adjuntas del objeto sender . Por ejemplo:

-     function changelocation(sender, args) {

-         

-         sender["Canvas.Top"] = 70;

-     }

-          createFromXAML: Permite modificar el archivo XAML dinámicamente. Se invoca llamando al objeto plug-in.content.createFromXaml. A continuación se ve el código de una función que agrega un elipse en la pantalla:

-     function createEllipse(sender, args) {

-         

-         var slControl = sender.getHost();

-         var e = 

-             slControl.content.createFromXaml(

-                 '');

-         var canvas = sender;

-         canvas.children.Add(e);

-     }

El objeto “Canvas” puede contener muchos objetos que representan UIElements (son objetos que se muestran en pantalla). Se pueden construir figuras geométricas y ubicarlas con referencia al objeto Canvas que las contiene. Además un objeto Canvas puede contener otros objetos Canvas.

Dibujar y pintar

Propiedades para relleno de objetos
SolidColorBrush	Rellena un objeto con una color sólido
LinearGradientBrush	Rellena con una transición de colores gradual que se separan mediante líneas. Para detener el avance de un color se pueden indicar GradientStop.
RadialGradientBrush	Rellena con una transición de colores gradual que se separa formando círculos. Para detener el avance de un color se pueden indicar GradientStop. Además se puede setear el centro de la figura circular con las propiedades GradientOrigin, Center, RadiusX, and RadiusY
ImageBrush	Rellena un objeto con una imagen
VideoBrush	Rellena un objeto con un video

Propiedades Gráficas comunes

Se puede manejar la opacidad de las figuras (tanto de toda la figura como utilizando gradientes).  También se puede usar la propiedad Clip (que permite mostrar una parte de una figura).  Y utilizar Render Transform que es básicamente redibujar las imágenes (por ejemplo, un rectángulo se convierte en un rombo, etc).

Imagenes

La imagen se carga mediante el tag Image.

Texto

Se puede darle formato a un texto (tamaño de letra, color, screcht, etc). Pueden aplicarse las propiedades generales de UI Elements (Opacidad, Clip, etc). Se utiliza un tag TextBlock para indicar un bloque de texto.

Media (audio y video)

Se puede agregar video en formato WMV. Como es la versión 1.0, se tienen que generar los scripts necesarios para manipular el video (stop, pause, play). Se puede ver el video en pantalla completa. Se utiliza un tag MediaElement para indicar el objeto multimedia.

Todo proyecto Silverlight en la versión 1.0 tiene 4 elementos:

-          Una o más páginas HTML

-          Uno o más archivos de scripting

-          Uno o más archivos de XAML

-          Un Plug-in que se ejecuta sobre la aplicación cliente y el archivo Silverlight.js

La aplicación puede instanciar muchos objetos “plug-in” que representan objetos que pueden procesarse mediante la capa Core de la arquitectura. Para lograr eso debe generar divisiones en el html y asignarle un objeto plug-in a cada división.

El archivo Silverlight.js es un archivo de ayuda que permite que el proyecto Silverlight sea visto en múltiples plataformas.

Para ejecutar el plug-in de Silverlight es necesario llamar al método Silverlight.createObject. A continuación

vemos los parámetros que este método toma: 

Silverlight.createObject(

        "myxaml.xaml",                  // Archivo xaml que se asocia al plug-in.

        parentElement,                  // referencia a la División que contiene este plug-in.

        "mySilverlightPlugin",         // ID del plug-in. Debe ser único.

        {                               // Propiedades por instancia.

            width:’300′,                // Ancho de la región del plug-in en pixels

            height:’300′,               // Alto de la región del plug-in en pixels

            inplaceInstallPrompt:false, // Determina si se muestra el prompt de

                                          // instalación si se identifica que

                                          // la versión es inválida

            background:’#D6D6D6′,       // Color de fondo en el área del objeto

                                          // plug-in.

            isWindowless:’false’,       // Determina si se muestra el plug-in

                                        // en modo Windowless.

            framerate:’24′,             // Propiedad MaxFrameRate.

            version:’1.0′               // Versión de Silverlight a usar.

        },

        {

            onError:null,               // valor de la propiedad OnError —

                                        // se debe indicar el nombre de la función

                                          //que manejará el evento

            onLoad:null                 // valor de la propiedad OnLoad —

                                        // se debe indicar el nombre de la función

                                          //que manejará el evento

        },

        null);                          // Valor de la propiedad de Contexto –

                                        // se debe indicar el nombre de la función

                                          //que manejará el evento

 A continuación se muestra con un gráfico la vista de módulos  (que identifica la relación “Contiene A”) que genera esta estructura:

Figura: Elementos de una aplicación Silverlight

Crear un archivo XAML

El XAML representa un objeto a procesar mediante un objeto plug-in.  En esencia es un archivo XML con un formato especial extendido. En Silverlight sólo puede tener como raíz un objeto “Canvas” (es el único objeto contenedor que existe). Un XAML puede procesarse en más de un objeto plug-in.

Silverlight es un nuevo avance para desarrollos de aplicaciones web. Las principales ventajas que se observan son:

- Provee un framework de diseño independiente del control de la página, lo que le da herramientas reales a los diseñadores que no necesitan la intervención de un programador.

- Permite que la misma aplicación se ejecute en diferentes web browsers.

- Utiliza Windows Presentation Fundation (WPF) como herramienta  para el desarrollo.

- Incluye Language Integrated Query (LINQ) lo que permite acceso a datos.

- Posee soporte para ejecutar scripting bajo JavaScript

- Se integra con las tecnologías ya existentes (.Net AJAX, Phyton, Ruby, JavaScript, WebServices, etc).

- Permite un manejo fácil de elementos multimedia (video, sonido).

Arquitectura

La arquitectura de Silverlight se divide en 2 partes:

-          El Core Presentation Fundation que es básicamente un Software Development Kit (SDK) que permite la renderización de elementos de interfase, control de eventos de usuario (clicks, teclado, etc), un conjunto de elementos de interfase (UIElements) con valor agregado respecto de los UIElements  que se encuentran en .Net 2.0 (en la versión 1.1)  y permite la ejecución de elementos multimedia (en la versión 1.1) todo del lado del cliente!!!. Para utilizarlo hay que instalar un plugin (que permite ejecutar los componentes en un área restringida de la máquina cliente) y es multi-browser (o sea, se puede implementar un plug-in para distintos web browsers). Toda la programación de esta capa puede hacerse mediante scripting.

-          El Framework .Net de Silverlight  que es básicamente un subconjunto del Framework .Net que implementa herramientas para el manejo de datos (LINQ),  Controles extendidos (WPF),  DLR para interpretar scripting y herramientas para la conexión a accesos remotos. La versión 1.0 de Silverlight no tiene una implementación muy interesante de esta capa de la arquitectura, la versión 1.1 (todavía en desarrollo) incluye todas estas herramientas y agrega un CLR que implementa el manejo de los objetos de esta capa (se encarga del garbage collection, chequeo de tipos y manejo de excepciones).

-          Para comunicarse entre las capas se utiliza un XAML Object (un Extensible Application Markup Language) que es básicamente un XML con un formato especializado (ver WPF).

Conclusión

En suma, Silverlight corre un poco más la barrera entre el diseño de la interfaz web y la programación en ASP.Net necesaria para lograr interactividad lo que facilita el diseño de la interfaz de la aplicación web. Además mejora la performance sobre todo en aplicaciones multimedia pues ejecuta muchas más cosas del lado cliente de la aplicación. Y permite hacer el desarrollo con la certeza de que la interfaz se ejecuta en los browser más populares sin necesidad de cambios.