tag:help-archives.hannonhill.com,2010-02-09:/discussions/xslt-formats/653-creating-javascript-files-using-xsltCascade CMS: Discussion 2013-08-20T02:03:41Ztag:help-archives.hannonhill.com,2010-02-09:Comment/228857642012-12-19T18:59:38Z2012-12-19T18:59:38ZCreating Javascript files using XSLT<div><p>Hi,</p>
<p>Would you be able to provide us with your Template and XSLT
Format code and a screenshot of your Configuration Set so we can
have a look at where things are at?</p>
<p>Also, if you could provide a sample XML output of the Index
Block you are applying your Format to that would be very helpful
with some local testing.</p>
<p>Please let me know if you have any questions.</p>
<p>Thanks</p></div>Ryan Griffithtag:help-archives.hannonhill.com,2010-02-09:Comment/228857642012-12-28T21:11:55Z2012-12-28T21:11:55ZCreating Javascript files using XSLT<div><p>My XSLT</p>
<pre>
<code>
<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="1.0">
<xsl:import href="site://_common/formats/include/video-embed"/>
<xsl:template match="*">
<xsl:comment>#START-ROOT-CODE
var banner = {
<xsl:apply-templates select="banner"/>
};
//#END-ROOT-CODE</xsl:comment>
</xsl:template>
<xsl:template match="banner">
<xsl:value-of select="position()-1"/>: {
title: '<xsl:value-of select="title"/>',
blurb: '<xsl:value-of select="blurb"/>',
mediaType: '<xsl:value-of select="mediaType"/>',
mediaSrc:
<xsl:choose>
<xsl:when test="mediaType='youtube'">
'<xsl:call-template name="get-youtube-id">
<xsl:with-param name="video-id"/>
</xsl:call-template>'
</xsl:when>
<xsl:when test="mediaType = 'image'">
'<xsl:value-of select="image-src/path"/>'
</xsl:when>
</xsl:choose>,
readMore: '<xsl:value-of select="readmore"/>',
splash: '<xsl:value-of select="splash/path"/>'
}<xsl:if test="position() != last()">
,
</xsl:if>
</xsl:template>
</xsl:stylesheet></code>
</pre>
<p>The Template</p>
<pre>
<code><passthrough><system-region name="DEFAULT"/></passthrough></code>
</pre>
<p>And I've attached the configuration set and the xml i'm using.
It's not an index block but a data definition on that page.</p></div>cpayantag:help-archives.hannonhill.com,2010-02-09:Comment/228857642012-12-28T21:13:16Z2012-12-28T21:13:16ZCreating Javascript files using XSLT<div><p>oh, the video-embed template, which is imported.</p>
<pre>
<code>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" extension-element-prefixes="vpre" version="1.0" xmlns:vpre="vpre" xmlns:xalan="http://xml.apache.org/xalan">
<xalan:component functions="identify_video_site vimeo_id youtube_id" prefix="vpre">
<xalan:script lang="javascript">
function identify_video_site(url){
var re = /(youtu\.?be|vimeo)/i;
var match = url.match(re);
if( !match ){ return "unsupported"; }
else { match = match[1]; }
if( match == "youtube" || match == "youtu.be" ){ return "youtube"; }
else { return "vimeo"; }
}
function vimeo_id(url){
var re = /http:\/\/(www\.)?vimeo.com\/(\d+)($|\/)/;
return url.match(re)[2];
}
function youtube_id(url){
var re = /.*(?:youtu.be\/|v\/|u\/\w\/|embed\/|watch\?v=)([^#\&amp;\?]*).*/;
return url.match(re)[1];
}
</xalan:script>
</xalan:component>
<xsl:template name="url-to-embed">
<xsl:param name="url"/>
<xsl:param name="width">560</xsl:param>
<xsl:param name="height">315</xsl:param>
<xsl:param name="class"/>
<xsl:variable name="site" select="vpre:identify_video_site(string($url))"/>
<xsl:choose>
<xsl:when test="$site = 'youtube'">
<div>
<xsl:attribute name="class">
<xsl:text>youtube </xsl:text>
<xsl:value-of select="$class"/>
</xsl:attribute>
<iframe allowfullscreen="true" frameborder="0" height="{$height}" width="{$width}">
<xsl:attribute name="src">
<xsl:value-of select="concat('http://www.youtube.com/embed/',vpre:youtube_id(string($url)))"/>
</xsl:attribute>
</iframe>
</div>
</xsl:when>
<xsl:when test="$site = 'vimeo'">
<div>
<xsl:attribute name="class">
<xsl:text>vimeo </xsl:text>
<xsl:value-of select="$class"/>
</xsl:attribute>
<iframe allowfullscreen="true" frameborder="0" height="{$height}" width="{$width}">
<xsl:attribute name="src">
<xsl:value-of select="concat('http://player.vimeo.com/video/', vpre:vimeo_id(string($url))) "/>
</xsl:attribute>
</iframe>
</div>
</xsl:when>
<xsl:otherwise>
<p>This video can not be embedded</p>
</xsl:otherwise>
</xsl:choose>
</xsl:template>
<xsl:template name="get-youtube-id">
<xsl:param name="url"/>
<xsl:value-of select="vpre:youtube_id(string($url))"/>
</xsl:template>
</xsl:stylesheet></code>
</pre></div>cpayantag:help-archives.hannonhill.com,2010-02-09:Comment/228857642012-12-31T14:36:13Z2012-12-31T14:36:13ZCreating Javascript files using XSLT<div><p>Hi,</p>
<p>It looks like there was an issue with your
<code><xsl:choose></code> statement used when building the
<em>medaiSrc</em> attribute for your banner objects.</p>
<p>The <strong>get-youtube-id</strong> template expects a variable
called <em>url</em>, but you were passing in a blank variable
called <em>video-id</em>. The following adjustment for your choose
statement should do the trick:</p>
<pre>
<code> <xsl:choose>
<xsl:when test="mediaType='youtube'">
'<xsl:call-template name="get-youtube-id">
<xsl:with-param name="url" select="video-id"/>
</xsl:call-template>'
</xsl:when>
<xsl:when test="mediaType = 'image'">
'<xsl:value-of select="image-src/path"/>'
</xsl:when>
</xsl:choose></code>
</pre>
<p>Please let me know if you have any questions.</p>
<p>Thanks</p></div>Ryan Griffith