Mes: diciembre 2007

En el día 13-12-2007 tuvimos la oportunidad de realizar el segundo WebCast a la comunidad de desarrolladores de Sharepoint y le damos las gracias a Brandon Aday de Microsoft por la oportunidad que nos brindo nuevamente

En este WebCast desarrollamos unos componentes para gráfica datos utilizando JavaScript, Xslt y Emprise JavaScript Charts, motor para crear gráficas escritas totalmente en JavaScript y compatibles con todos los Browser. Este componente esta licenciado y se pude descargar una versión de evaluación para probarlo desde la siguiente página oficial del sitio. Esta versión de evaluación que nosotros utilizamos para realizar esta demostración solo consume datos de conformados por un Array de JavaScript, pero en la versión licenciada los orígenes de datos pueden ser otros, como por ejemplo Xml.
En el  siguiente artículo encontrarán el código fuente completo de la demostración uno realizada, el cual podrán copiar y pegar.

Código Fuente – Xslt

<xsl:stylesheet

xmlns:x="http://www.w3.org/2001/XMLSchema"

xmlns:dsp="http://schemas.microsoft.com/sharepoint/dsp"

version="1.0"

exclude-result-prefixes="xsl msxsl ddwrt"

xmlns:ddwrt="http://schemas.microsoft.com/WebParts/v2/DataView/runtime"

xmlns:asp="http://schemas.microsoft.com/ASPNET/20"

xmlns:__designer="http://schemas.microsoft.com/WebParts/v2/DataView/designer"

xmlns:xsl="http://www.w3.org/1999/XSL/Transform"

xmlns:msxsl="urn:schemas-microsoft-com:xslt"

xmlns:SharePoint="Microsoft.SharePoint.WebControls"

xmlns:ddwrt2="urn:frontpage:internal">

<xsl:output method="html" indent="no"/>

<xsl:template match="/" xmlns:x="http://www.w3.org/2001/XMLSchema" xmlns:dsp="http://schemas.microsoft.com/sharepoint/dsp" xmlns:asp="http://schemas.microsoft.com/ASPNET/20" xmlns:__designer="http://schemas.microsoft.com/WebParts/v2/DataView/designer" xmlns:SharePoint="Microsoft.SharePoint.WebControls">

<xsl:call-template name="dvt_1"/>

</xsl:template>

<xsl:template name="dvt_1">

<xsl:variable name="Rows" select="/dsQueryResponse/Rows/Row"/>

<table border="1" width="100%" cellpadding="2" cellspacing="0">

<tr>

<td align="center" valign="middle">

<xsl:call-template name="dvt_1.GraficaBarraMeses">

<xsl:with-param name="Rows" select="$Rows"/>

</xsl:call-template>

</td>

<td align="center" valign="middle">

<xsl:call-template name="dvt_1.GraficaBarraSector">

<xsl:with-param name="Rows" select="$Rows"/>

</xsl:call-template>

</td>

</tr>

<tr>

<td align="center" valign="middle" colspan="2">

<xsl:call-template name="dvt_1.GraficaBarra">

<xsl:with-param name="Rows" select="$Rows"/>

</xsl:call-template>

</td>

</tr>

</table>

</xsl:template>

<xsl:template name="dvt_1.GraficaBarraMeses">

<xsl:param name="Rows" />

<div id="chartsBarrasMeses" class="chart" align="center" style=’width:400px; height:300px;’></div>

<script type="text/javascript">

<xsl:for-each select="$Rows">

DatosArrayMeses(<xsl:value-of select="position()"/>,&apos;<xsl:value-of select="@Mes"></xsl:value-of>&apos;,<xsl:value-of select="@Importe"></xsl:value-of>);

</xsl:for-each>

var myChartBarrasMeses;

var chartBarrasMeses = new EJSC.Chart(&quot;chartsBarrasMeses&quot;,{title: "Ventas por Mes",show_x_axis: false});

chartBarrasMeses.y_axis_formatter = new EJSC.NumberFormatter({ forced_decimals: 2 });

chartBarrasMeses.x_axis_formatter = new EJSC.NumberFormatter({ forced_decimals: 2 });

chartBarrasMeses.setXAxisCaption("Meses");

chartBarrasMeses.setYAxisCaption("Importes");

myChartBarrasMeses = new EJSC.BarSeries(new EJSC.ArrayDataHandler(arrayDataMeses));

myChartBarrasMeses.y_axis_formatter = new EJSC.NumberFormatter({ forced_decimals: 2 });

myChartBarrasMeses.x_axis_formatter = new EJSC.NumberFormatter({ forced_decimals: 2 });

myChartBarrasMeses.color = &apos;rgb(50,210,50)&apos;;

myChartBarrasMeses.lineWidth = 2;

chartBarrasMeses.addSeries(myChartBarrasMeses)

</script>

</xsl:template>

<xsl:template name="dvt_1.GraficaBarraSector">

<xsl:param name="Rows" />

<div id="chartsBarrasSector" class="chart" align="center" style=’width:400px; height:300px;’></div>

<script type="text/javascript">

<xsl:for-each select="$Rows">

DatosArraySector(<xsl:value-of select="position()"/>,&apos;<xsl:value-of select="@Sector"></xsl:value-of>&apos;,<xsl:value-of select="@Importe"></xsl:value-of>);

</xsl:for-each>

var myChartBarrasSector;

var chartBarrasSector = new EJSC.Chart(&quot;chartsBarrasSector&quot;,{title: "Ventas por Sector"});

chartBarrasSector.y_axis_formatter = new EJSC.NumberFormatter({ forced_decimals: 2 });

chartBarrasSector.x_axis_formatter = new EJSC.NumberFormatter({ forced_decimals: 2 });

chartBarrasSector.setXAxisCaption("Sector");

chartBarrasSector.setYAxisCaption("Importes");

myChartBarrasSector = new EJSC.BarSeries(new EJSC.ArrayDataHandler(arrayDataSector));

myChartBarrasSector.y_axis_formatter = new EJSC.NumberFormatter({ forced_decimals: 2 });

myChartBarrasSector.x_axis_formatter = new EJSC.NumberFormatter({ forced_decimals: 2 });

myChartBarrasSector.color = &apos;rgb(50,210,50)&apos;;

myChartBarrasSector.lineWidth = 2;

chartBarrasSector.addSeries(myChartBarrasSector)

</script>

</xsl:template>

<xsl:template name="dvt_1.GraficaBarra">

<xsl:param name="Rows" />

<div id="chartsTorta" class="chart" align="center" style=’width:400px; height:300px;’></div>

<script type="text/javascript">

<xsl:for-each select="$Rows">

DatosArrayTorta(<xsl:value-of select="position()"/>,<xsl:value-of select="@Importe"></xsl:value-of>,&apos;<xsl:value-of select="@Mes"></xsl:value-of>&apos;,&apos;<xsl:value-of select="@Sector"></xsl:value-of>&apos;);

</xsl:for-each>

var myChartTorta;

var chart = new EJSC.Chart(&quot;chartsTorta&quot;,{title: "Ventas Totales",show_x_axis: false});

chart.setXAxisCaption("Meses");

chart.setYAxisCaption("Importes");

myChartTorta = new EJSC.PieSeries(new EJSC.ArrayDataHandler(arrayDataTorta),{onPieceNeedsColor: ColoresPorMes});

myChartTorta.y_axis_formatter = new EJSC.NumberFormatter({ forced_decimals: 2 });

myChartTorta.x_axis_formatter = new EJSC.NumberFormatter({ forced_decimals: 2 });

chart.addSeries(myChartTorta)

</script>

</xsl:template>

</xsl:stylesheet>

Código Fuente – JavaScript

En el día 13-12-2007 tuvimos la oportunidad de realizar el segundo WebCast a la comunidad de desarrolladores de Sharepoint y le damos las gracias a Brandon Aday de Microsoft por la oportunidad que nos brindo nuevamente

En este WebCast desarrollamos unos componentes para gráfica datos utilizando JavaScript, Xslt y Emprise JavaScript Charts, motor para crear gráficas escritas totalmente en JavaScript y compatibles con todos los Browser. Este componente esta licenciado y se pude descargar una versión de evaluación para probarlo desde la siguiente página oficial del sitio. Esta versión de evaluación que nosotros utilizamos para realizar esta demostración solo consume datos de conformados por un Array de JavaScript, pero en la versión licenciada los orígenes de datos pueden ser otros, como por ejemplo Xml.

En el  siguiente artículo encontrarán el código fuente completo de la demostración uno realizada, el cual podrán copiar y pegar.

Código Fuente – Xslt

<xsl:stylesheet

xmlns:x="http://www.w3.org/2001/XMLSchema"

xmlns:dsp="http://schemas.microsoft.com/sharepoint/dsp"

version="1.0"

exclude-result-prefixes="xsl msxsl ddwrt"

xmlns:ddwrt="http://schemas.microsoft.com/WebParts/v2/DataView/runtime"

xmlns:asp="http://schemas.microsoft.com/ASPNET/20"

xmlns:__designer="http://schemas.microsoft.com/WebParts/v2/DataView/designer"

xmlns:xsl="http://www.w3.org/1999/XSL/Transform"

xmlns:msxsl="urn:schemas-microsoft-com:xslt"

xmlns:SharePoint="Microsoft.SharePoint.WebControls"

xmlns:ddwrt2="urn:frontpage:internal">

<xsl:output method="html" indent="no"/>

<xsl:template match="/">

<xsl:call-template name="dvt_1"/>

</xsl:template>

<xsl:template name="dvt_1">

<xsl:variable name="Rows" select="/dsQueryResponse/Rows/Row"/>

<table border="1" width="100%" cellpadding="2" cellspacing="0">

<tr>

<td align="center" valign="middle">

<xsl:call-template name="dvt_1.GraficaTorta">

<xsl:with-param name="Rows" select="$Rows"/>

</xsl:call-template>

</td>

<td align="center" valign="middle">

<xsl:call-template name="dvt_1.GraficaBarras">

<xsl:with-param name="Rows" select="$Rows"/>

</xsl:call-template>

</td>

</tr>

<tr>

<td align="center" valign="middle" colspan="2">

<xsl:call-template name="dvt_1.GraficaAreas">

<xsl:with-param name="Rows" select="$Rows"/>

</xsl:call-template>

</td>

</tr>

</table>

</xsl:template>

<xsl:template name="dvt_1.GraficaTorta">

<xsl:param name="Rows" />

<div id="chartsTorta" class="chart" align="center" style=’width:400px; height:300px;’></div>

<script type="text/javascript">

<xsl:for-each select="$Rows">

DatosGraficaTorta(<xsl:value-of select="position()"/>,<xsl:value-of select="@Importe"></xsl:value-of>,&apos;<xsl:value-of select="@Title"></xsl:value-of>&apos;);

</xsl:for-each>

var myChartSeries;

var chart = new EJSC.Chart(&quot;chartsTorta&quot;,{title: "Ventas Anuales – Gráfica de Torta"});

chart.y_axis_formatter = new EJSC.NumberFormatter({ forced_decimals: 2 });

chart.x_axis_formatter = new EJSC.NumberFormatter({ forced_decimals: 2 });

chart.setXAxisCaption("Meses");

chart.setYAxisCaption("Importes");

myChartSeries = new EJSC.PieSeries(new EJSC.ArrayDataHandler(arrayData));

myChartSeries.y_axis_formatter = new EJSC.NumberFormatter({ forced_decimals: 2 });

myChartSeries.x_axis_formatter = new EJSC.NumberFormatter({ forced_decimals: 2 });

chart.addSeries(myChartSeries)

</script>

</xsl:template>

<xsl:template name="dvt_1.GraficaBarras">

<xsl:param name="Rows" />

<div id="chartsBarras" class="chart" align="center" style=’width:400px; height:300px;’></div>

<script type="text/javascript">

<xsl:for-each select="$Rows">

DatosGraficaBarras(<xsl:value-of select="position()"/>,&apos;<xsl:value-of select="@Title"></xsl:value-of>&apos;,<xsl:value-of select="@Importe"></xsl:value-of>);

</xsl:for-each>

var myChartBarras;

var chartBarras = new EJSC.Chart(&quot;chartsBarras&quot;,{title: "Ventas Anuales – Gráfica de Barras",show_x_axis: false});

chartBarras.y_axis_formatter = new EJSC.NumberFormatter({ forced_decimals: 2 });

chartBarras.x_axis_formatter = new EJSC.NumberFormatter({ forced_decimals: 2 });

chartBarras.setXAxisCaption("Meses");

chartBarras.setYAxisCaption("Importes");

alert(arrayDataBarras);

myChartBarras = new EJSC.BarSeries(new EJSC.ArrayDataHandler(arrayDataBarras));

myChartBarras.y_axis_formatter = new EJSC.NumberFormatter({ forced_decimals: 2 });

myChartBarras.x_axis_formatter = new EJSC.NumberFormatter({ forced_decimals: 2 });

myChartBarras.color = &apos;rgb(50,210,50)&apos;;

myChartBarras.lineWidth = 2;

chartBarras.addSeries(myChartBarras)

</script>

</xsl:template>

<xsl:template name="dvt_1.GraficaAreas">

<xsl:param name="Rows" />

<div id="chartsAreas" class="chart" align="center" style=’width:400px; height:300px;’></div>

<script type="text/javascript">

<xsl:for-each select="$Rows">

DatosGraficaAreas(<xsl:value-of select="position()"/>,&apos;<xsl:value-of select="@Title"></xsl:value-of>&apos;,<xsl:value-of select="@Importe"></xsl:value-of>);

</xsl:for-each>

var myChartAreas;

var chartAreas = new EJSC.Chart(&quot;chartsAreas&quot;,{title: "Ventas Anuales – Gráfica de Área",show_x_axis: false});

chartAreas.y_axis_formatter = new EJSC.NumberFormatter({ forced_decimals: 2 });

chartAreas.x_axis_formatter = new EJSC.NumberFormatter({ forced_decimals: 2 });

chartAreas.setXAxisCaption("Meses");

chartAreas.setYAxisCaption("Importes");

alert(arrayDataAreas);

myChartAreas = new EJSC.AreaSeries(new EJSC.ArrayDataHandler(arrayDataAreas));

myChartAreas.y_axis_formatter = new EJSC.NumberFormatter({ forced_decimals: 2 });

myChartAreas.x_axis_formatter = new EJSC.NumberFormatter({ forced_decimals: 2 });

myChartAreas.color = &apos;rgb(50,210,50)&apos;;

myChartAreas.lineWidth = 2;

chartAreas.addSeries(myChartAreas)

</script>

</xsl:template>

</xsl:stylesheet>

Código Fuente – JavaScript

var arrayData = new Array();
var arrayAux;
var arrayDataBarras = new Array();
var arrayDataAreas = new Array();
function DatosGraficaTorta(pPos, pValueX, pValueY)
{
    arrayAux = new Array(pValueX,pValueY);
    arrayData[pPos-1] = arrayAux;
}
function DatosGraficaBarras(pPos, pValueX, pValueY)
{       
    arrayAux = new Array(pValueX,pValueY);
    arrayDataBarras[pPos-1] = arrayAux;
}
function DatosGraficaAreas(pPos, pValueX, pValueY)
{       
    arrayAux = new Array(pValueX,pValueY);
    arrayDataAreas[pPos-1] = arrayAux;

}

En el día de ayer, 06-12-2007 tuvimos la oportunidad de realizar un WebCast a la comunidad de desarrolladores de Sharepoint y le damos las gracias a Brandon Aday de Microsoft por la oportunidad que nos brindo.

En este WebCast presentamos una forma alternativa de realizar componentes para Sharepoint sin utilizar código de servidor.

Acá les dejamos parte del código fuente de la primera presentación realizada, los archivos JavaScript y el formulario ASPX utilizado

Código Fuente – Formulario aspx

<asp:Content id="Content1" runat="Server" contentplaceholderid="PlaceHolderMain">

<WebPartPages:DataFormWebPart runat="server" IsIncluded="True" FrameType="None" NoDefaultStyle=’TRUE’ ViewFlag=’0′ Title=’Documentos’ __markuptype=’vsattributemarkup’ __WebPartId='{DA04C944-BB6F-4DE1-B39A-7C1D47C2DD20}’ id=’g_5d5344cf_89e6_45b9_b8be_3698bebad8f6′>

<DataSources>

<SharePoint:SPDataSource runat="server" DataSourceMode="List" UseInternalName="true" selectcommand="&lt;View&gt;&lt;/View&gt;" id="Documentos1"><UpdateParameters><WebPartPages:dataformparameter PropertyName="ParameterValues" ParameterKey="ListID" DefaultValue="{2256D73A-FF33-4F07-A8E4-EBC8B69C47D9}" Name="ListID">

</WebPartPages:dataformparameter>

</UpdateParameters><DeleteParameters><WebPartPages:dataformparameter PropertyName="ParameterValues" ParameterKey="ListID" DefaultValue="{2256D73A-FF33-4F07-A8E4-EBC8B69C47D9}" Name="ListID">

</WebPartPages:dataformparameter>

</DeleteParameters><InsertParameters><WebPartPages:dataformparameter PropertyName="ParameterValues" ParameterKey="ListItemId" DefaultValue="0" Name="ListItemId">

</WebPartPages:dataformparameter><WebPartPages:dataformparameter PropertyName="ParameterValues" ParameterKey="ListID" DefaultValue="{2256D73A-FF33-4F07-A8E4-EBC8B69C47D9}" Name="ListID">

</WebPartPages:dataformparameter>

</InsertParameters><SelectParameters><WebPartPages:dataformparameter PropertyName="ParameterValues" ParameterKey="ListID" DefaultValue="{2256D73A-FF33-4F07-A8E4-EBC8B69C47D9}" Name="ListID">

</WebPartPages:dataformparameter>

</SelectParameters>

</SharePoint:SPDataSource>

</DataSources>

<ParameterBindings>

<ParameterBinding Name="dvt_apos" Location="Postback;Connection"/>

<ParameterBinding Name="UserID" Location="CAMLVariable" DefaultValue="CurrentUserName"/>

<ParameterBinding Name="Today" Location="CAMLVariable" DefaultValue="CurrentDate"/>

<ParameterBinding Name="ListID" Location="None" DefaultValue="{2256D73A-FF33-4F07-A8E4-EBC8B69C47D9}"/>

</ParameterBindings>

<datafields>@FileLeafRef,Nombre (para uso en formularios);@Title,Título;@_DCDateCreated,Fecha de creación;@ID,ID;@ContentType,Tipo de contenido;@Created,Creado;@Author,Creado por;@Modified,Modificado;@Editor,Modificado por;@_CopySource,Copiar origen;@CheckoutUser,Desprotegido para;@_CheckinComment,Comentario de protección;@CheckedOutTitle,Desprotegido para;@CheckedOutUserId,Id. del usuario que tiene desprotegido el elemento;@FileDirRef,Ruta;@FSObjType,Tipo de elemento;@HTML_x0020_File_x0020_Type,Tipo de archivo HTML;@File_x0020_Type,Tipo de archivo;@IsCheckedoutToLocal,Está desprotegido en local;@_SourceUrl,Dirección URL de origen;@_HasCopyDestinations,Tiene destinos de copia;@ContentTypeId,Id. de tipos de contenido;@_ModerationStatus,Estado de aprobación;@_UIVersion,Versión de IU;@Created_x0020_Date,Creado;@FileRef,Dirección URL;@File_x0020_Size,Tamaño de archivo;@_UIVersionString,Versión;@ParentVersionString,Versión del origen (documento convertido);@ParentLeafName,Nombre del origen (documento convertido);@TemplateUrl,Vinculo de la plantilla;</datafields>

<XSL>

<xsl:stylesheet

xmlns:x="http://www.w3.org/2001/XMLSchema"

xmlns:d="http://schemas.microsoft.com/sharepoint/dsp"

version="1.0"

exclude-result-prefixes="dt s z rs xsl msxsl ddwrt"

xmlns:ddwrt="http://schemas.microsoft.com/WebParts/v2/DataView/runtime"

xmlns:asp="http://schemas.microsoft.com/ASPNET/20"

xmlns:__designer="http://schemas.microsoft.com/WebParts/v2/DataView/designer"

xmlns:xsl="http://www.w3.org/1999/XSL/Transform"

xmlns:msxsl="urn:schemas-microsoft-com:xslt"

xmlns:SharePoint="Microsoft.SharePoint.WebControls"

xmlns:ddwrt2="urn:frontpage:internal"

xmlns:s="uuid:BDC6E3F0-6DA3-11d1-A2A3-00AA00C14882"

xmlns:dt="uuid:C2F41010-65B3-11d1-A29F-00AA00C14882"

xmlns:rs="urn:schemas-microsoft-com:rowset"

xmlns:z="#RowsetSchema">

<xsl:output method="html" indent="no"/>

<xsl:decimal-format NaN=""/>

<xsl:param name="dvt_apos">'</xsl:param>

<xsl:param name="ListID">{2256D73A-FF33-4F07-A8E4-EBC8B69C47D9}</xsl:param>

<xsl:variable name="dvt_1_automode">0</xsl:variable>

<xsl:variable name="CountRow" select="count(//Row)" ></xsl:variable>

<xsl:variable name="listName" select="self::text"></xsl:variable>

<xsl:template match="/" xmlns:x="http://www.w3.org/2001/XMLSchema" xmlns:d="http://schemas.microsoft.com/sharepoint/dsp" xmlns:asp="http://schemas.microsoft.com/ASPNET/20" xmlns:__designer="http://schemas.microsoft.com/WebParts/v2/DataView/designer" xmlns:SharePoint="Microsoft.SharePoint.WebControls">

<xsl:call-template name="dvt_1"/>

</xsl:template>

<xsl:template name="dvt_1">

<xsl:variable name="dvt_StyleName">Table</xsl:variable>

<xsl:variable name="Rows" select="/dsQueryResponse/Rows/Row"/>

<xsl:variable name="dvt_RowCount" select="count($Rows)" />

<xsl:variable name="dvt_IsEmpty" select="$dvt_RowCount = 0" />

<xsl:choose>

<xsl:when test="$dvt_IsEmpty">

<xsl:call-template name="dvt_1.empty" />

</xsl:when>

<xsl:otherwise>

<xsl:call-template name="dvt_1.header">

<xsl:with-param name="Rows" select="$Rows"/>

</xsl:call-template>

<table border="0" width="100%" cellpadding="2" cellspacing="0">

<tr valign="top">

<xsl:if test="$dvt_1_automode = ‘1’" ddwrt:cf_ignore="1">

<th class="ms-vh" width="1%" nowrap="nowrap"></th>

</xsl:if>

<th class="ms-vh" nowrap="" align="left">

<input type="checkbox" id="chSelectAll">

<xsl:attribute name="onClick">javascript:SelectAllRow(<xsl:value-of select="$CountRow"></xsl:value-of>);</xsl:attribute>

</input>

</th>

<th class="ms-vh" nowrap="" align="left">Id</th>

<th class="ms-vh" nowrap="" align="left">Tipo</th>

<th class="ms-vh" nowrap="" align="left">Título</th>

<th class="ms-vh" nowrap="" align="left">Fecha Creación</th>

<th class="ms-vh" nowrap="" align="left">Creado por</th>

<th class="ms-vh" nowrap="" align="left">Modificado por</th>

</tr>

<xsl:call-template name="dvt_1.body">

<xsl:with-param name="Rows" select="$Rows"/>

</xsl:call-template>

</table></xsl:otherwise>

</xsl:choose>

</xsl:template>

<xsl:template name="dvt_1.body">

<xsl:param name="Rows"/>

<xsl:for-each select="$Rows">

<xsl:call-template name="dvt_1.rowview">

<xsl:with-param name="Pos" select="concat(‘_’, position())" />

</xsl:call-template>

</xsl:for-each>

</xsl:template>

<xsl:template name="dvt_1.rowview">

<xsl:param name="Pos" />

<tr>

<xsl:attribute name="id">row<xsl:value-of select="$Pos"></xsl:value-of></xsl:attribute>

<xsl:if test="position() mod 2 = 1">

<xsl:attribute name="class">ms-alternating</xsl:attribute>

</xsl:if>

<xsl:if test="$dvt_1_automode = ‘1’" ddwrt:cf_ignore="1">

<td class="ms-vb" width="1%" nowrap="nowrap">

<span ddwrt:amkeyfield="ID" ddwrt:amkeyvalue="ddwrt:EscapeDelims(string(@ID))" ddwrt:ammode="view"></span>

</td>

</xsl:if>

<td class="ms-vb">

<input type="checkbox">

<xsl:attribute name="id">chk<xsl:value-of select="$Pos"></xsl:value-of></xsl:attribute>

<xsl:attribute name="onclick">javascript:SelectRow(‘<xsl:value-of select="$Pos"></xsl:value-of>’);</xsl:attribute>

</input>

</td>

<td class="ms-vb" align="left">

<xsl:value-of select="format-number(@ID, ‘#,##0.#;-#,##0.#’)"/>

</td>

<td class="ms-vb" align="left">

<xsl:if test="@DocIcon=’docx’">

<img border="0" src="icdocx.gif" width="16" height="16" />

</xsl:if>

<xsl:if test="@DocIcon=’doc’">

<img border="0" src="_layouts/images/icdocx.gif" width="16" height="16" />

</xsl:if>

<xsl:if test="@DocIcon=’xlsx’">

<img border="0" src="_layouts/images/icxlsx.gif" width="16" height="16" />

</xsl:if>

<xsl:if test="@DocIcon=’xls’">

<img border="0" src="_layouts/images/icxlsx.gif" width="16" height="16" />

</xsl:if>

</td>

<td class="ms-vb" align="left">

<a>

<xsl:attribute name="href"><xsl:value-of select="@FileRef"></xsl:value-of></xsl:attribute>

<xsl:value-of select="@Title"/>

</a>

</td>

<td class="ms-vb" align="left">

<xsl:value-of select="ddwrt:FormatDate(string(@_DCDateCreated), 3082, 1)"/>

</td>

<td class="ms-vb" align="left">

<xsl:value-of select="@Author" disable-output-escaping="yes"/>

</td>

<td class="ms-vb" align="left">

<xsl:value-of select="@Editor" disable-output-escaping="yes"/>

</td>

</tr>

</xsl:template>

<xsl:template name="dvt_1.header">

<xsl:param name="Rows" />

<table cellSpacing="0" class="ms-menutoolbar" cellPadding="0" border="0" width="100%">

<tr>

<td class="ms-toolbar" width="50%">

Documentos de la lista

</td>

<td class="ms-toolbar" align="left" width="30%">

<a>

<xsl:attribute name="href">javascript:EliminarDocSeleccionados(‘<xsl:value-of select="$CountRow"></xsl:value-of>’);</xsl:attribute>

Eliminar Seleccionados

</a>

</td>

<td class="ms-toolbar" align="left" width="20%"><xsl:value-of select="count(/dsQueryResponse/Rows/Row)" />

documentos activos

<xsl:text xmlns:ddwrt="http://schemas.microsoft.com/WebParts/v2/DataView/runtime" ddwrt:nbsp-preserve="yes" disable-output-escaping="yes">&amp;nbsp; </xsl:text>

</td>

<td class="ms-toolbar" align="left" width="20%">

</td>

</tr>

</table>

</xsl:template>

<xsl:template name="dvt_1.empty">

<xsl:variable name="dvt_ViewEmptyText">No hay elementos que mostrar en esta vista.</xsl:variable>

<table border="0" width="100%">

<tr>

<td class="ms-vb">

<xsl:value-of select="$dvt_ViewEmptyText" />

</td>

</tr>

</table>

</xsl:template>

</xsl:stylesheet>

</XSL>

</WebPartPages:DataFormWebPart>

</asp:Content>

<asp:Content id="Content2" runat="server" contentplaceholderid="PlaceHolderAdditionalPageHead">

<script type="text/javascript" src="soap.js" ID="SoapJs"></script>

<script type="text/javascript" src="Utilidades.js" ID="UtilidadesJs"></script>

</asp:Content>

En el día de ayer, 06-12-2007 tuvimos la oportunidad de realizar un WebCast a la comunidad de desarrolladores de Sharepoint y le damos las gracias a Brandon Aday de Microsoft por la oportunidad que nos brindo.

En este WebCast presentamos una forma alternativa de realizar componentes para Sharepoint sin utilizar código de servidor.

Acá les dejamos parte del código fuente de la primera presentación realizada, los archivos JavaScript y el formulario ASPX utilizado

Código Fuente – Formulario aspx

Código Fuente – JavaScript demo2.js

function OnLoadListsStart(){

alert("Comienza invocación al WebService.");

}

function OnLoadListsComplete(pStrXml){

LoadResultado(pStrXml);

}

function OnLoadListsError(){

alert(‘Se produjo un error en la invocación.’);

}

function LoadResultado(successResponse)

{

var strHtml;

var XmlRsp = successResponse;

successResponse = null;

var XMLDoc;

boolLoadSltList = false;

if (window.ActiveXObject)

{

XMLDoc=new ActiveXObject("Microsoft.XMLDOM");

XMLDoc.async=false;

XMLDoc.loadXML(XmlRsp);

}

// code for Mozilla, Firefox, Opera, etc.

else if (document.implementation && document.implementation.createDocument)

{

XMLDoc=document.implementation.createDocument("","",null);

XMLDoc.load(XmlRsp);

}

strHtml = "<table cellSpacing=’0′ class=’ms-menutoolbar’ cellPadding=’0′ border=’0′ width=’100%’>";

strHtml += "<tr>";

strHtml += "<td class=’ms-toolbar’ width=’80%’>Documentos de la lista</td>";

strHtml += "</tr>";

strHtml += "</table>";

strHtml += "<table>";

var nodeList = XMLDoc.getElementsByTagName("rs:data");

var node = nodeList.item(0);

if(node.childNodes.length > 0)

{

for(i=0; i < node.childNodes.length; i++)

{

strHtml += "<tr>";

var childNode = node.childNodes[i];

strHtml += "<td>" + DevolverImg(childNode.getAttribute("ows_DocIcon"));

strHtml += "</td>";

strHtml += "<td class=’ms-vb’>" + "<a href=’/" + childNode.getAttribute("ows_FileRef").split(‘#’)[1] + "’>" + childNode.getAttribute("ows_LinkFilename");

strHtml += "</a>";

strHtml += "</td>";

strHtml += "</tr>";

}

}

else

{

strHtml += "<tr>";

strHtml += "<td> No hay elementos que mostrar en esta vista.";

strHtml += "</td>";

strHtml += "</tr>";

}

strHtml += "</table>";

var divRes = document.getElementById("divResultado");

divRes.innerHTML = strHtml;

}

function DevolverImg(tipoDoc)

{

var strImg = "<img border=’0′ src=’";

var src;

if(tipoDoc=="docx")

{

src="_layouts/images/icdocx.gif";

}

else if (tipoDoc=="doc")

{

src="_layouts/images/icdocx.gif";

}

else if (tipoDoc=="xlsx")

{

src="_layouts/images/icxlsx.gif";

}

else if (tipoDoc=="xls")

{

src="_layouts/images/icxlsx.gif";

}

else

{

src="_layouts/images/edit.gif";

}

strImg += src + "’ width=’16’ height=’16’ />";

return strImg;

}

function InvocarWebService()

{

var lUrlWebService = ‘/webcast/_vti_bin/Lists.asmx’;

var lSoapActionNamespace = ‘http://schemas.microsoft.com/sharepoint/soap/’;

var lSoapAction = ‘GetListItems’;

var lParameters = new Array();

lParameters[0] = ‘listName’;

lParameters[1] = ‘Documentos’;

CallWebService(lUrlWebService,lSoapActionNamespace,lSoapAction,

lParameters,OnLoadListsStart,OnLoadListsComplete,OnLoadListsError);

}

Código Fuente – Soap.js

/// Libreria para consumir webservices

// Objeto para crear el envelop

var Soap = {

createEnvelope: function(action, ns, parameters){

var soap = ‘<?xml version="1.0" encoding="utf-8"?><soap:Envelope xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:soap="http://www.w3.org/2003/05/soap-envelope"><soap:Body>’;

//var soap = ‘<?xml version="1.0" encoding="utf-8"?><soap:Envelope xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/ "><soap:Body>’;

soap += ‘<‘ + action + ‘ xmlns="’ + ns + ‘">’;

soap += Soap.__parseParameters(parameters);

soap += ‘</’ + action + ‘></soap:Body></soap:Envelope>’;

return soap;

},

__parseParameters: function(parameters){

var params = "";

if (typeof parameters == ‘object’){

// check if we were provided an array or an object

if (typeof parameters.push == ‘function’){

for (var i = 0, length = parameters.length; i < length; i += 2){

params += "<" + parameters[i] + ">" + parameters[i+1] + "</" + parameters[i] + ">";

}

}

else{

$H(parameters).each(

function(pair){

params += "<" + pair.key + ">" + pair.value + "</" + pair.key + ">";

});

}

}

return params;

}

}

// CallWebServices

// pUrlWebService

// pSoapActionNamespace

// pSoapAction

// pParameters

// pStartEvent

// pCompleteEvent

// pErrorEvent

function CallWebService(pUrlWebService, pSoapActionNamespace, pSoapAction, pParameters, pStartEvent, pCompleteEvent, pErrorEvent){

var lXmlSoap = Soap.createEnvelope(pSoapAction,pSoapActionNamespace,pParameters);

__getServiceResults(pUrlWebService,pSoapActionNamespace + pSoapAction,lXmlSoap,pStartEvent,pCompleteEvent,pErrorEvent);

}

function __getServiceResults(pUrlWebService, pSoapAction, pXmlSoap, pStartEvent, pCompleteEvent, pErrorEvent){

var lXmlHttp;

function onReadyStateChange(e){

switch(lXmlHttp.readyState){

case 1:

//pStartEvent();

break;

case 4:

if(lXmlHttp.status == 200){

pCompleteEvent(lXmlHttp.responseText);

}

else{

pErrorEvent();

}

break;

default:

break;

}

}

try{

if (pXmlSoap.length > 0){

pStartEvent();

// debug:

//alert(pXmlSoap);

if (window.XMLHttpRequest){

lXmlHttp = new XMLHttpRequest()

}

else if (window.ActiveXObject){

lXmlHttp = new ActiveXObject("Microsoft.XMLHTTP")

}

lXmlHttp.open("POST", pUrlWebService, true);

lXmlHttp.onreadystatechange = onReadyStateChange;

lXmlHttp.setRequestHeader("SOAPAction", pSoapAction);

lXmlHttp.setRequestHeader("Content-Type", "text/xml");

lXmlHttp.send(pXmlSoap);

}

}

catch(e){

alert(e.message);

pErrorEvent();

}

}

En el día de ayer, 06-12-2007 tuvimos la oportunidad de realizar un WebCast a la comunidad de desarrolladores de Sharepoint y le damos las gracias a Brandon Aday de Microsoft por la oportunidad que nos brindo.

En este WebCast presentamos una forma alternativa de realizar componentes para Sharepoint sin utilizar código de servidor. En el mismo vimos como podemos interactuar con esta plataforma de desarrollo altamente robusta y escalable sin utilizar componentes que se necesiten instalar en el servidor, usamos Xslt, JavaScript, WebService y como herramienta de desarrollo Sharepoint Designer.

Estamos muy contentos por sus comentarios y agradecimientos que nos hicieron llegar y más contento nos puso al saber que nuestro WebCast fue de utilidad para más de uno de los asistentes, eso para nosotros es lo más importante, saber que pudimos colaborar…

Presentación

En el artículo anterior configuramos y extendimos la pagina de resultado de Sharepoint agregando columnas nuevas y XSLT para colocar un link al formulario de edición de las propiedades del documento mostrado por la búsqueda.

En este artículo vamos a crear un ámbito de búsqueda para poder utilizar el mismo en el ComboBox donde se listan las distintas opciones para buscar contenido.

Los ámbitos de búsqueda se pueden crear en dos lugares, el primero lugar es el Shared Service Provider (SSP), para que los ámbitos creados en dicho lugar sean utilizados por todas las aplicaciones Web que tengan asociados.  El segundo lugar es en el propio sitio que queremos que contenga ese ámbito de búsqueda.

Nosotros vamos a crear el ámbito en el sitio donde lo vamos a utilizar, para lo cual lo primero que tenemos que hacer es acceder a la configuración de la colección de sitio de nuestro portal, en la imagen 1 se muestra la pantalla de configuración.

Imagen 1

Una vez en la administración de la colección de sitio, seleccionamos el link “Ámbitos de búsqueda” y accedemos a la configuración de ámbitos como se muestra en la imagen 2

Imagen 2

Imagen 3

Una vez en la pagina para crear un nuevo ámbito de búsqueda debemos agregar el Nombre, descripción. De la sección “Mostrar Grupos” debemos seleccionar donde queremos que aparezca nuestro nuevo ámbito de búsqueda, en nuestro caso, vamos a seleccionar solo la opción “Cuadro desplegable de búsqueda” y de la sección “Página de resultados de destino” vamos a dejar la opción que nos indica que se utilizara la pagina predeterminada de resultado.

Una vez cargado los datos, presionamos el botón “Aceptar”, a lo cual el nuevo ámbito es creado y volvemos a la página de configuración de ámbitos y como se puede ver en la imagen 4, el nuevo ámbito esta creado.

Imagen 4

Ahora lo que vamos hacer es crear una regla para nuestro ámbito de búsqueda, para eso presionamos sobre el link “Agregar regla” para acceder a la pantalla de configuración de la nueva regla como se ve en la imagen 5.

Las propiedades que podremos utilizar para crear la regla son las que previamente establecimos en la configuración de la búsqueda del SSP y seleccionamos en la propiedad la opción de que la misma pueda ser utilizada en un ámbito de búsqueda.  Para ver como se realiza la configuración de la búsqueda en el Shared Service Provider ver el post siguiente que se detalla paso a paso como realizar la configuración “Configuración Búsqueda Sharepoint 2007” 

Imagen 5

 Podemos crear más la regla basándonos en tres criterios, a partir de una dirección web, a partir de una consulta a una propiedad de los metadatos o que la regla sea para todo el contenido rastreado y almacenado en el índice.

Nosotros vamos a crear la regla a partir de una propiedad así que seleccionamos esta opción y el sistema desplegara un nueva sección llamada “Consulta de propiedad” donde vamos a tener que elegir qué propiedad vamos a utilizar y cuál será el valor que utilizaremos, vamos a seleccionar la propiedad creada en el artículo anterior llamada “Filename”. Cargamos el valor que queremos utilizar para realizar la consulta sobre la propiedad. Debemos tener en cuenta que al crear de esta forma el ámbito utilizando una propiedad con un valor asociado, estamos haciendo que la misma sea estática, puesto que no podremos cambiarle el valor una vez la misma sea compilada y almacenada en nuestro sitio. Esto nos puede llegar a limitar un poco  las búsquedas, pero podemos ofrecerle al usuario de nuestro portal búsquedas rápidas contra ciertos tipos de propiedades y así mostrar resultados asociados.

Al terminar de configurar la regla lo que debemos hacer es guardarla, para eso presionamos el botón “Aceptar” y volvemos a la pantalla de configuración donde vemos que la regla fue creada y debe ser procesada para ser utilizada como vemos en la figura 6.

Imagen 6

Para poder utilizar en nuevo ámbito de búsqueda debemos acceder al Shared Service Provider (SSP) para actualizar los ámbitos modificados. Esto lo podemos realizar de forma manual o dejar que la programación estipulada por Sharepoint actualice el ámbito. Una vez  finalizada la actualización vamos a  iniciar un rastreo de la búsqueda.

 Si tenemos el motor de búsqueda configurado para que se hagan los rastreos en un cierto periodo de tiempo, podemos utilizarlo cuando el mismo se lleva a cabo, si no podemos acceder a  la configuración de la búsqueda en nuestro Shared Service Provider y comenzar nosotros mismos el rastreo para poder probarlo. En la siguiente imagen vemos como nuestro nuevo ámbito de búsqueda aparece en el ComboBox de la búsqueda de nuestro sitio.

Imagen 7