Minimalist example for getting my fork of BBC News' Imager.js (https://github.com/firegoby/Imager.js) working with Symphony CMS

data.xml

<images>
    <file size="345 KB" path="/images" type="image/jpeg">
        <filename>1z9x6l7.jpg</filename>
        <meta creation="2013-09-11T13:39:53+01:00" width="2560" height="1440" />
    </file>
    <file size="367 KB" path="/images" type="image/jpeg">
        <filename>adfp6hk.jpg</filename>
        <meta creation="2013-09-11T13:40:30+01:00" width="1920" height="1280" />
    </file>
    <file size="4.15 MB" path="/images" type="image/jpeg">
        <filename>031384sjw.jpg</filename>
        <meta creation="2013-09-11T14:30:37+01:00" width="2880" height="1800" />
    </file>
</images>

page.xslt

<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
 
   <xsl:template name="imager">
        <xsl:param name="image"/>
        <xsl:param name="width"/>
        <xsl:param name="class" select="'imager'"/>
        <div class="{$class}" data-src="/image/1/{$width}/0{$image/@path}/{$image/filename}" data-width="{$width}"></div>
    </xsl:template>
 
    <xsl:template match="/">
 
        <style>
            img {
                max-width: 100%;
            }
        </style>
 
        <xsl:apply-templates select="//images/file"/>
 
        <script src="/workspace/scripts/Imager.js"></script>
        <script>
            var imager = new Imager();
        </script>
 
    </xsl:template>
 
    <xsl:template match="//images/file">
        <xsl:call-template name="imager">
            <xsl:with-param name="image" select="."/>
            <xsl:with-param name="width" select="900"/>
        </xsl:call-template>
    </xsl:template>
 
</xsl:stylesheet>