SharePoint: Integrate ASP.net controls with Forms – Part 6: Bonus: Embed documents to pages

Guest Author: Matt Bramer
http://mattbramer.blogspot.com

I’ve been thinking about a few comments I’ve received during this series. Specifically, this comment from Jeremy on EUSP: “Would adding a document view/preview window be possible? It sounds like it might fit into where you are headed with this project.” I initially wrote that it would not be possible without some code. That comment is still valid, but I’ve gone ahead and written the code to display certain document types. Initially this XSL template will handle: .pdf’s, png’s, jpg’s, gif’s, mp3’s, wmv’s and .vsd’s. I’m sure there’s more to add, so feel free to post a comment if you’d like to see something added.

SPXSLT

I’m a big fan of this project. Isn’t it obvious? My avatar on Twitter was the SPXSLT logo for a week or so. If you haven’t been to the codeplex site and used these templates, you now have every reason to…

What does it do?

I’m going to go over the most complex file type. This should give you a good understanding of how all of the other file types work. Let’s give credit where credit is due. http://www.wssdemo.com/Pages/visio.aspx is where you can find this code:

<OBJECT classid="CLSID:279D6C9A-652E-4833-BEFC-312CA8887857"
codebase="http://www.microsoft.com/downloads/info.aspx?na=90&p=&SrcDisplayLang=en&SrcCategoryId=&SrcFamilyId=d88e4542-b174-4198-ae31-6884e9edd524&u=http%3a%2f%2fdownload.microsoft.com%2fdownload%2f6%2ff%2f5%2f6f569198-e7d0-49af-b162-54a11f38d301%2fvisioviewer.exe"
id="viewer1" width="100%" height="100">
<param name="BackColor" value="16777120">
<param name="AlertsEnabled" value="1">
<param name="ContextMenuEnabled" value="1">
<param name="GridVisible" value="0">
<param name="HighQualityRender" value="1">
<param name="PageColor" value="16777215">
<param name="PageVisible" value="1">
<param name="PropertyDialogEnabled" value="1">
<param name="ScrollbarsVisible" value="1">
<param name="ToolbarVisible" value="1">
<param name="SRC" value="http://www.wssdemo.com/Shared%20Documents/carpark.vsd">
<param name="CurrentPageIndex" value="0">
<param name="Zoom" value="-1">
</object>

This code allows you to embed visio files within IE (Internet Explorer). I know, I know, it doesn’t work in Chrome or any other browser for that matter, but it’s still nice if you have an audience that will be using IE only. I’ve tried to make all of the other file types adhere to standards, so they all should work no matter what browser you use.

Breaking It Down

To use this template, you have to call it like this:

<xsl:call-template name="EmbeddedFilePreview">
	<xsl:with-param name="FileType" select="@File_x0020_Type"/>
	<xsl:with-param name="FilePath" select="@FileRef"/>
	<xsl:with-param name="paramHeight" select="500"/>
	<xsl:with-param name="paramWidth" select="1000"/>
	<xsl:with-param name="curr_Site" select="$curr_Site" />
</xsl:call-template>

The FileType, FilePath, and curr_Site parameter are required if you want to display .vsd files in your page. For some reason, the .vsd object requires a full URL and not a relative path. To get the current site, you’ll want to setup a Server Variable: SERVER_NAME. You’ll see why that’s important within the .vsd file type. All of the other file types that you would display using this template *do not* require the curr_Site variable. There are two other variables that are optional. They are paramHeight and paramWidth. If these aren’t set when you call the template, the values are defaulted to 500px and 100%, respectively.

Here’s the SPXSLT code to embed a visio document:

<xsl:when test="$FileType = 'vsd'">
	<xsl:choose>
		<xsl:when test="$curr_Site = ''">
			<b>The current site parameter *must* be provided!</b>
		</xsl:when>
		<xsl:otherwise>
			<object>
				<xsl:attribute name="classid">
					<xsl:text>CLSID:279D6C9A-652E-4833-BEFC-312CA8887857</xsl:text>
				</xsl:attribute>
				<xsl:attribute name="id">
					<xsl:text>VSDViewer</xsl:text>
				</xsl:attribute>
				<xsl:attribute name="width">
					<xsl:value-of select="$Width" />
				</xsl:attribute>
				<xsl:attribute name="height">
					<xsl:value-of select="$Height" />
				</xsl:attribute>
				<xsl:text disable-output-escaping="yes">
				&lt;param name=&quot;BackColor&quot; value=&quot;16777120&quot;&gt;
				&lt;param name=&quot;AlertsEnabled&quot; value=&quot;1&quot;&gt;
				&lt;param name=&quot;ContextMenuEnabled&quot; value=&quot;1&quot;&gt;
				&lt;param name=&quot;GridVisible&quot; value=&quot;0&quot;&gt;
				&lt;param name=&quot;HighQualityRender&quot; value=&quot;1&quot;&gt;
				&lt;param name=&quot;PageColor&quot; value=&quot;16777215&quot;&gt;
				&lt;param name=&quot;PageVisible&quot; value=&quot;1&quot;&gt;
				&lt;param name=&quot;PropertyDialogEnabled&quot; value=&quot;1&quot;&gt;
				&lt;param name=&quot;ScrollbarsVisible&quot; value=&quot;1&quot;&gt;
				&lt;param name=&quot;ToolbarVisible&quot; value=&quot;1&quot;&gt;
				&lt;param name=&quot;SRC&quot; value=&quot;http://</xsl:text>
				<xsl:value-of select="concat($curr_Site, $FilePath)"/><xsl:text disable-output-escaping="yes">&quot;&gt;
				&lt;param name=&quot;CurrentPageIndex&quot; value=&quot;0&quot;&gt;
				&lt;param name=&quot;Zoom&quot; value=&quot;-1&quot;&gt;</xsl:text>
				<p>It appears you don't have a Visio Viewer plugin for this browser.</p>
			</object>
		</xsl:otherwise>
	</xsl:choose>
</xsl:when>

You’ll notice the test is to see whether or not curr_Site is blank. If the curr_Site and FilePath match a document, then it’ll embed the visio drawing into the page. I do a little bit of magic with the concat in the middle there, so if you are trying to use this in an SSL environment, change the text to: https://.

Where’s the code?

The preview is only shown here. I’m going to post all of the code to the SPXSLT site, so get the latest revision from the Discussion Thread until Marc can fit it into the official download. If you have any tweaks for me or need to get this working, I’m always glad to hear from you.

Screenshots?

You know I have screenshots! Here’s a visio drawing:

Here’s a .pdf:

Here’s a .jpg:

Hey, why not a video? .wmv

Guest Author: Matt Bramer
http://mattbramer.blogspot.com

Matt Bramer works as a Systems Admin in the construction industry. He has been working with Search Server Express since 2008 and frequently blogs about his findings at http://mattbramer.blogspot.com. Matt often posts to Stump the Panel and likes to tweet about his IT projects on Twitter (@iOnline247).