MSIB Page Transformer

MSIBPlusPack.Web Namespace

The MSIBPlusPack.Web Namespace contains the classes to transform the HTML rendered into various formats with ease, such as XHTML, Print and Text Only versions of a page.

Getting Started

In order for your site to be affected by the Page Transformer, you need to

  1. Add a reference to MSIBPlusPackPageTransformer.dll in the references section of your project.
  2. Add a section to the <configuration> section of the web.config file for your website as shown:

      <configSections>

         <section name="OutputFiltering"

              type="MSIBPlusPack.Web.OutputFilteringConfigurationHandler, MSIBPlusPackPageTransformer" />

      </configSections>

  1. Add a section to the <system.web> section of the web.config file for your website as shown:

      <httpModules>

         <add name="OutputFilteringModule" type="MSIBPlusPack.Web.OutputFilteringModule, MSIBPlusPackPageTransformer"/>

      </httpModules>

  1. Add an <OutputFiltering> section to the <configuration> section of the web.config file for your website.

Transforming a Page

The Page Transformer takes its settings from sections added to the <OutputFiltering> section of the web.config file for the website.  An example section can be seen below.

<add name="TextOnly" activateOn="queryString" activateOnValue="textonly">

    <tag name="img" action="replaceWithAttribute">alt</tag>

    <tag name="b" action="replace">i</tag>

    <tag name="notfortextonly" action="remove" />

</add>

What the above section does it state that when the QueryString passed to the page contains a reference to the text: "textonly=1", replace the <img> tags with the text from the "alt" attribute, change all the bold tags <b> to italic <i> and remove the contents of any tag called <notfortext>.

The <add> element contains any number of tag elements describing the actions to take on HTML tags within the Output.

The attributes for the <add> element are:

Attribute Description
name

User Reference to this section (Has no effect on the Page Transformer)

activateOn What is this section triggered by (See Activate On Section Below)
activateOnValue The value to act upon (This would be the text that would appear in a QueryString if activateOn was set to QueryString)
xhtml

Setting this attribute to true instructs the page transformer to convert all the page's output to XHTML)

 

Examining this step by step we can see what happens:

  1. To view our home page normally the user would pass the url http://mywebsite/index.htm
  2. This would then output the following HTML (segment):

        <img src="header.jpg" alt="Welcome to My Company" />

        <b>Hello Everyone<b>

        <notfortextonly>

            <a href="greatgraphics.htm">Click here for awesome graphics</a>

        </notfortextonly>

  1. To activate the page transformer to show a text only version, we would pass the url http://mywebsite/index.htm?textonly=1
  2. Once transformed, the output would look like this:

        Welcome to My Company

        <i>Hello Everyone</i>

Note, the element and contents of <notfortextonly> have been removed, bold has become italics, and the image has been removed leaving only the alternate text.

Based on the above example it is clear that any number of combinations can be used to easily create actions for text only sites, print versions of a page etc.

XHTML

To convert the page output to XHTML, all you have to do it add an attribute to the <add> element stating xhtml to be true

<add name="xhtml" activateOn="always" xhtml=true />

Again, this section can have <tags> so that as well as converting to xhtml you may want to remove certain sections of the output.

Activate On

The following are the valid settings for the Activate On attribute of the <add> section:

 

Type Description
Always

Perform this action always, independent of other settings for the site.

You may want to use this for example when converting to xhtml so that it always does this, not just on certain criteria being met

QueryString

Perform this action when the QueryString contains this reference

For example, you may want to perform this set of tags when the url contains "printmode=1"

HostHeader

Perform this action if we are on a certain host (Useful for development)

For example, you may want to render the output differently if HostHeader is "mydevbox", but not on "mylivebox"

Actions

Type Description
remove Completely remove the element and contents
replace Replace the element with the one specified
removeContents leave the element intact but remove it's contents
removeAttribute Completely remove the attribute from the element
replaceWithAttribute Replace the contents of the element with the contents of the atttribute specified
none Take no action