Reemplazando el diagrama de Workflow en SharePoint 2010 usando un Delegate Control

Como sabemos, los controles delegados (Delegate Controls) son básicamente contenedores que encapsulan contenido y que SharePoint permite substituir este contenido con contenido personalizado diferente a la implementación predeterminada. Una de sus funciones primordiales es proveer de una manera fácil de hacer Branding de los sitios SharePoint. SharePoint define varios controles delegados dentro de la master page v4.

En este post, les propongo usar esta característica para sustituir (y mejorar) la manera predeterminada en que se muestran los diagramas de los flujos de trabajo en la página de detalle del flujo de trabajo en SharePoint 2010.

Y poder adicionarle un poco de vida!

Primero se debe crear un proyecto nuevo y vacío (obviamente de SharePoint 2010)

Agregamos un usercontrol, en el cual vamos a escribir el código aspx que sustituirá al diagrama de flujo. De hecho este user control tendra el mismo contenido que el WorkflowStatus.ascx, y solo agregaremos una referencia a un archivo js que será el encargado de manipular el diagrama de Visio utilizando la API de Visio Services.

Agregamos una nueva Feature con Scope Site a la solución, la cual se encargará de desplegar el elemento que crearemos en el siguiente paso

La magia viene aquí; agregamos un nuevo elemento a la solución de tipo Empty Element y agregamos la siguiente definición:

El valor del atributo Id y el atributo Sequence son importantes ya que el Id debe coincidir con la definición del control que queremos reemplazar, y el valor de la propiedad Sequence debe ser menor a la especificada en la definición original del control para que tenga precedencia sobre este. A continuación como fue definido originalmente el control en la feature VisioWebAccess

Si quieren saber como poder agregar este tipo de mejoras a los diagramas de Visio, pueden checar dos de mis anteriores posts:

Visio Services API

Agregando controles Silverlight a un diagrama de Visio Services

Anticipando algunas de sus posibles preguntas:

Porque utilizar un delegate control solo para adicionar la referencia a un archivo js?

Se podría haber agregado la referencia a este archivo .js desde la Master Page, incluso se puede sustituir el archivo workflowstatus.js que es el que se encarga de manera predeterminada del dibujado de todos los diagramas de Visio para los flujos de trabajo, sin embargo esto es muy invasivo ya que sería un cambio global y de la manera que este post propone el cambio sería a nivel de Sitio, es decir, lo menos invasivo posible.

Happy Coding!