RE: [xsl] Dynamic image and text alignment

Subject: RE: [xsl] Dynamic image and text alignment
From: "Tiffany Blake" <Tiffany_Blake@xxxxxxx>
Date: Mon, 3 Jan 2005 16:28:23 -0800
here's the XSLT:

<?xml version="1.0" encoding="utf-8"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform";
	xmlns:java="http://xml.apache.org/xslt/java";
	xmlns:xalan-nodeset = "http://xml.apache.org/xalan";
	exclude-result-prefixes = "xalan"
	version="1.0">
<xsl:output method="html" indent="yes"/>

<!-- The session ID and the r_object_id of the content object are
automatically passed as parameters to the XSL file -->
<xsl:param name="DMS_SESSION_ID" select="'default value'"/>
<xsl:param name="DMS_INPUT_OBJECT_ID"/>

<!-- xsl:copy-of select="$query1"/ -->
<xsl:variable name = "query1">select r_object_id, search_keywords, description
from gapinc_web_content where r_object_id ='<xsl:value-of
select="$DMS_INPUT_OBJECT_ID"/>'</xsl:variable>
<xsl:variable name = "query1_results">
	<xsl:call-template name="XDQL">
		<xsl:with-param name="dql" select="string($query1)"/>
   </xsl:call-template>
</xsl:variable>

<xsl:template match="gapinc">
<html>
	<xsl:text disable-output-escaping="yes">
		&lt;head&gt;
	</xsl:text>
	<title><xsl:value-of select="/gapinc/title"/></title>

	<script language="Javascript" type="text/javascript"
src="/public/includes/javascripts/common.js"/>
	<script language="Javascript" type="text/javascript"
src="/public/includes/javascripts/printFriendly.js"/>

	<script language="JavaScript">
		<xsl:text disable-output-escaping="yes">&lt;!--</xsl:text>
		<xsl:text disable-output-escaping="yes">
			var isMac = (navigator.appVersion.indexOf(&quot;Mac&quot;)!=-1) ? true :
false;
			document.write(&quot;&lt;link href=\&quot;/public/includes/GapInc&quot; + (
(isMac) ? &quot;_mac&quot; : &quot;&quot; ) + &quot;.css\&quot;
rel=\&quot;styleSheet\&quot; type=\&quot;text/css\&quot;&gt;&quot;);
			var str = navigator.userAgent;
			--&gt;
		</xsl:text>
	</script>

	<script language="JavaScript">
		<xsl:text disable-output-escaping="yes">&lt;!--</xsl:text>

		<!-- launch a new/popup window -->
		function openPopupWindow(url)
		{
			window.open(url,
"popupwindow","width=620,height=500,resizable=1,toolbar=0");
		}

		var SectionID=&quot;<xsl:value-of select="/gapinc/nav_section_id"/>&quot;;

		<xsl:text disable-output-escaping="yes">
			function roll(name, stat) {
				document.images[name].src= eval(name + stat + &quot;.src&quot;);
			}
			function loadImages() {
		</xsl:text>
		}
		loadImages();

		<xsl:text disable-output-escaping="yes">--&gt;</xsl:text>
	</script>

	<!-- Page Formating Begin -->
	<body>
		<div align="center">
			<!-- TOP NAVIGATION BEGIN -->
			<table width="760" border="0" cellspacing="0" cellpadding="0"
class="border" align="center">
				<tr>
					<td>
						<xsl:text disable-output-escaping="yes">
							<!-- TOP NAVIGATION INCLUDE -->
							&lt;!--#include virtual= "/public/includes/navTop.htm" --&gt;
						</xsl:text>
					</td>
				</tr>
			</table>
			<!-- TOP NAVIGATION END -->

			<table border="0" cellspacing="0" cellpadding="0" width="740"
class="subBanner">
				<!-- SLIVER IMAGES BEGIN -->
				<tr>
					<td width="210">
						<xsl:element name="img">
							<xsl:attribute name="src">
								<!-- FIRST SLIVER IMAGE INCLUDE -->
								<xsl:value-of select = "/gapinc/title_sliver1" />
							</xsl:attribute>
						</xsl:element>
					</td>
					<td width="532">
						<xsl:element name="img">
							<xsl:attribute name="src">
								<!-- SECOND SLIVER IMAGE INCLUDE -->
								<xsl:value-of select="/gapinc/title_sliver2" />
							</xsl:attribute>
							<xsl:attribute name="class">hdrImg</xsl:attribute>
						</xsl:element>
						<xsl:element name="img">
							<xsl:attribute name="src">
								<!-- SECOND SLIVER IMAGE INCLUDE -->
								<xsl:value-of select="/gapinc/title_sliver3" />
							</xsl:attribute>
							<xsl:attribute name="class">hdrImg</xsl:attribute>
						</xsl:element>
					</td>
				</tr>
				<!-- SLIVER IMAGES END -->
				<tr>
					<td><img src="/public/images/clear.gif" alt="" width="1" height="23"
title=""/></td>
					<!-- PRINTER FRIENDLY BEGIN -->
					<td class="link">
						<a href="javascript:void(printFriendly())">
							<img src="images/iconPrinterFriendly.gif" alt="Printer-friendly
version" width="20" height="16" border="0"/>Printer-friendly version
						</a>
						<!-- Printer Friendly END -->
					</td>

				</tr>
			</table>

			<table width="758" border="0" cellpadding="0" cellspacing="0"
class="main">
				<tr>
					<td width="211" height="1"><img src="/public/images/clear.gif" alt=""
width="211" height="1" title=""/></td>
					<td width="547" height="1"><img src="/public/images/clear.gif" alt=""
width="547" height="1" title=""></img></td>
				</tr>
				<tr>
					<!-- LEFT SIDE NAVIGATION BEGIN-->
					<td width="211" class="mainLeft">
						<!-- LEFT SIDE NAVIGATION INCLUDE -->
						<!-- This include is based on the specified navigation section ID -->
						<xsl:choose>
							<xsl:when test="starts-with(/gapinc/nav_section_id,'1')">
								<xsl:text disable-output-escaping="yes">
									&lt;!--#include virtual= "/public/includes/navSide_About.html"
--&gt;
								</xsl:text>
							</xsl:when>
							<xsl:when test="starts-with(/gapinc/nav_section_id,'2')">
								<xsl:text disable-output-escaping="yes">
									&lt;!--#include virtual= "/public/includes/navSide_OurBrands.html"
--&gt;
								</xsl:text>
							</xsl:when>
							<xsl:when test="starts-with(/gapinc/nav_section_id,'3')">
								<xsl:text disable-output-escaping="yes">
									&lt;!--#include virtual= "/public/includes/navSide.html" --&gt;
								</xsl:text>
							</xsl:when>
							<xsl:otherwise>
								<xsl:text disable-output-escaping="yes">
									&lt;!--#include virtual= "/public/includes/navSide.html" --&gt;
								</xsl:text>
							</xsl:otherwise>
						</xsl:choose>
					</td>
					<!-- LEFT SIDE NAVIGATION END -->

					<td width="549" class="mainRight">
						<div id="printFriendly">
							<div class="bNoVRule">
								<div class="bIntro">
									<!-- INTRO PARAGRAPH HEADER 1 TEXT BEGIN -->
									<!-- Only include the text if it has been specified -->
									<xsl:if test="string-length(/gapinc/intro_para_header1_text)&gt;0">
										<h1>
										<!-- INTRO PARAGRAPH HEADER 1 TEXT INCLUDE -->
										<xsl:value-of select="/gapinc/intro_para_header1_text"/>
										</h1>
									</xsl:if>
									<!-- INTRO PARAGRAPH HEADER 1 TEXT END -->

									<!-- INTRO PARAGRAPH TEXT BEGIN -->
									<!-- Only include the text if it has been specified -->
									<xsl:if test="string-length(/gapinc/intro_para_text)&gt;0">
										<!-- INTRO PARAGRAPH TEXT INCLUDE -->
										<p><xsl:apply-templates select="intro_para_text"/></p>
									</xsl:if>
									<!-- INTRO PARAGRAPH TEXT END -->

									<!-- INTRO PARAGRAPH MODULE BEGIN -->
									<!-- Only include the module if it has been specified -->
									<xsl:if test="string-length(/gapinc/intro_para_module)&gt;0">
										<xsl:text disable-output-escaping="yes">&lt;!--#include virtual=
"</xsl:text>
										<!-- INTRO PARAGRAPH MODULE INCLUDE -->
										<xsl:value-of select="/gapinc/intro_para_module" />
										<!-- THIS CHOOSE BLOCK REQUIRED BECAUSE WE WANT SELECTED XML CONTENT
OBJECTS TO END IN .HTM, BUT NOT FOR OBJECTS OF OTHER FORMATS -->
										<xsl:choose>
											<xsl:when test="contains(/gapinc/intro_para_module,'.')" />
											<xsl:otherwise>.htm</xsl:otherwise>
										</xsl:choose>
										<xsl:text disable-output-escaping="yes">" --&gt; </xsl:text>
									</xsl:if>
									<!-- INTRO PARAGRAPH MODULE END -->

									<!-- INTRO PARAGRAPH WIDE CALLOUT BEGIN -->
									<!-- Only include the wide callout if it has been specified -->
									<xsl:if test="string-length(/gapinc/intro_para_callout1)&gt;0">
										<div class="bCallOut">
											<!-- INTRO PARAGRAPH WIDE CALLOUT TEXT INCLUDE -->
											<div class="subheader"><xsl:value-of
select="/gapinc/intro_para_callout1"/></div>
											<!-- INTRO PARAGRAPH WIDE CALLOUT LARGE TEXT INCLUDE -->
											<div class="subfooter"><xsl:value-of
select="/gapinc/intro_para_callout2"/></div>
										</div>
									</xsl:if>
									<!-- INTRO PARAGRAPH WIDE CALLOUT END -->
								</div>
							</div>
							<div class="bLeftVRule">
								<table width="516" border="0" cellspacing="0" cellpadding="0"
class="inner">
									<tr>
										<td class="innerLeft">
											<!-- BODY PARAGRAPHS BEGIN -->
											<table width="100%" border="0" cellspacing="0" cellpadding="0">
												<xsl:for-each
select="/gapinc/body_content_block/body_repeat_content_block">
													<!-- BODY PARAGRAPH BEGIN -->
													<tr>
														<!-- Include the image on the right if an image placement of
"left-right" has been specified -->
														<!-- THIS CHOOSE BLOCK IS REQUIRED BECAUSE WE WANT TO CREATE A
COLUMN OF WIDTH "0" IF THE IMAGE ISN'T SPECIFIED -->
														<xsl:if test="body_image_placement='left-right'">
															<xsl:choose>
																<xsl:when test="string-length(body_image)&gt;0">
																	<td class="bodyImgLeft">
																		<!-- BODY PARAGRAPH IMAGE INCLUDE -->
																		<xsl:apply-templates select="body_image"/>
																	</td>
																</xsl:when>
																<xsl:otherwise>
																	<!-- There is no image specified -->
																	<td width="0"></td>
																</xsl:otherwise>
															</xsl:choose>
														</xsl:if>
														<td>
															<!-- BODY PARAGRAPH HEADER (Header 2) BEGIN -->
															<!-- Only include the header if it has been specified -->
															<xsl:if test="string-length(body_header2_text)&gt;0">
																<!-- BODY PARAGRAPH HEADER INCLUDE -->
																<xsl:element name="h2">
																	<xsl:if test="body_header2_underline_flag='Y'">
																		<xsl:attribute name="class">hr</xsl:attribute>
																	</xsl:if>
																	<xsl:value-of select="body_header2_text"/>
																</xsl:element>
															</xsl:if>
															<!-- BODY PARAGRAPH HEADER (Header 2) END -->

															<!-- BODY PARAGRAPH IMAGE BEGIN -->
															<!-- Include the image on top if an image placement of
"top-bottom" has been specified -->
															<xsl:if test="body_image_placement='top-bottom'">
																<xsl:if test="string-length(body_image)&gt;0">
																	<div class="bodyImg">
																		<!-- BODY PARAGRAPH IMAGE INCLUDE -->
																		<xsl:apply-templates select="body_image"/>
																	</div>
																</xsl:if>
															</xsl:if>
															<!-- BODY PARAGRAPH IMAGE END -->

															<div class="bBodyCopy">
																<!-- BODY PARAGRAPH TEXT INCLUDE -->
																<p><xsl:apply-templates select="body_text"/></p>

																<!-- BODY PARAGRAPH SUBTEXT BEGIN -->
																<!-- Only include the subtext if it has been specified -->
																<xsl:if test="string-length(body_subtext)&gt;0">
																	<!-- BODY PARAGRAPH SUBTEXT INCLUDE -->
																	<p class="last"><xsl:apply-templates
select="body_subtext"/></p>
																</xsl:if>
																<!-- BODY PARAGRAPH TEXT END -->
															</div>
														</td>
													</tr>
												</xsl:for-each>
											</table>

											<!-- BODY BOTTOM CALLOUT BEGIN -->
											<!-- Only include the callout if it's content has been specified
-->
											<xsl:if test="string-length(/gapinc/bottom_callout_content)&gt;0">
												<table width="100%"  border="0" cellspacing="0" cellpadding="0"
class="bCallOut">
													<tr>
														<td class="icon" width="24">
															<xsl:element name="img">
																<xsl:attribute name="src">
																	<!-- BODY BOTTOM CALLOUT ICON INCLUDE -->
																	<xsl:value-of select="/gapinc/bottom_callout_icon"/>
																</xsl:attribute>
																<xsl:attribute name="width">15</xsl:attribute>
																<xsl:attribute name="height">19</xsl:attribute>
															</xsl:element>
														</td>
														<td>
															<div class="span">
																<!-- BODY BOTTOM CALLOUT CONTENT INCLUDE -->
																<xsl:apply-templates select="bottom_callout_content"/>
															</div>
														</td>
													</tr>
												</table>
											</xsl:if>
											<!-- BODY BOTTOM CALLOUT END -->

											<!-- BODY BOTTOM MODULES BEGIN -->
											<!-- Only include body bottom modules if a page layout of "Wide"
has been selected. -->
											<xsl:if test="/gapinc/body_content_block/body_page_layout='Wide'">
												<!-- Only include modules if they have been specified -->
												<xsl:if
test="string-length(/gapinc/module_block/module_Choice)&gt;0">
													<table width="100%"  border="0" cellspacing="0" cellpadding="0"
class="bottomModules">
														<tr>
															<td width="50%" class="leftModule">
																<xsl:text disable-output-escaping="yes">&lt;!--#include
virtual= "</xsl:text>
																<!-- FIRST BODY BOTTOM MODULE INCLUDE -->
																<xsl:value-of select="/gapinc/module_block[1]/module_Choice"
/>
																<!-- THIS CHOOSE BLOCK REQUIRED BECAUSE WE WANT SELECTED XML
CONTENT OBJECTS TO END IN .HTM, BUT NOT FOR OBJECTS OF OTHER FORMATS -->
																<xsl:choose>
																	<xsl:when
test="contains(/gapinc/module_block[1]/module_Choice,'.')" />
																	<xsl:otherwise>.htm</xsl:otherwise>
																</xsl:choose>
																<xsl:text disable-output-escaping="yes">" --&gt;</xsl:text>
															</td>
															<td width="50%" class="rightModule">
																<xsl:text disable-output-escaping="yes">&lt;!--#include
virtual= "</xsl:text>
																<!-- SECOND BODY BOTTOM MODULE INCLUDE -->
																<xsl:value-of select="/gapinc/module_block[2]/module_Choice"
/>
																<!-- THIS CHOOSE BLOCK REQUIRED BECAUSE WE WANT SELECTED XML
CONTENT OBJECTS TO END IN .HTM, BUT NOT FOR OBJECTS OF OTHER FORMATS -->
																<xsl:choose>
																	<xsl:when
test="contains(/gapinc/module_block[2]/module_Choice,'.')" />
																	<xsl:otherwise>.htm</xsl:otherwise>
																</xsl:choose>
																<xsl:text disable-output-escaping="yes">" --&gt;</xsl:text>
															</td>
														</tr>
													</table>
												</xsl:if>
											</xsl:if>
											<!-- BODY BOTTOM MODULES END -->
										</td>

										<!-- RIGHT SIDE MODULES BEGIN -->
										<!-- Only include right side modules if a page layout of "Standard"
(or no page layout) has been selected. -->
										<xsl:if test="/gapinc/body_content_block/body_page_layout!='Wide'">
											<!-- Only include modules if they have been specified -->
											<xsl:if
test="string-length(/gapinc/module_block/module_Choice)&gt;0">
												<td class="innerRight">
													<xsl:for-each select="/gapinc/module_block">
														<xsl:text disable-output-escaping="yes">&lt;!--#include virtual=
"</xsl:text>
														<!-- RIGHT SIDE MODULE INCLUDE -->
														<xsl:value-of select="module_Choice" />
														<!-- THIS CHOOSE BLOCK REQUIRED BECAUSE WE WANT SELECTED XML
CONTENT OBJECTS TO END IN .HTM, BUT NOT FOR OBJECTS OF OTHER FORMATS -->
														<xsl:choose>
															<xsl:when test="contains(module_Choice,'.')" />
															<xsl:otherwise>.htm</xsl:otherwise>
														</xsl:choose>
														<xsl:text disable-output-escaping="yes">" --&gt;</xsl:text>
													</xsl:for-each>
												</td>
											</xsl:if>
										</xsl:if>
										<!-- RIGHT SIDE MODULES END -->
									</tr>

									<!-- ENFORCES WIDTH OF RIGHT SIDE COLUMN IF PAGE LAYOUT IS "STANDARD"
OR BLANK -->
									<xsl:if test="/gapinc/body_content_block/body_page_layout!='Wide'">
										<tr>
											<td><img src="/public/images/clear.gif" alt="" width="353"
height="1" title=""/></td>
											<td><img src="/public/images/clear.gif" alt="" width="163"
height="1" title=""/></td>
										</tr>
									</xsl:if>
								</table>
							</div>
						</div>

						<!-- BOTTOM NAVIGATION BEGIN -->
						<!-- BOTTOM NAVIGATION INCLUDE -->
						<xsl:text disable-output-escaping="yes">
							&lt;!--#include virtual= "/public/includes/navBottom.htm" --&gt;
						</xsl:text>
						<!-- BOTTOM NAVIGATION END -->
					</td>
				</tr>
			</table>
		</div>
	</body>
	<!-- Page Formating End -->
</html>
</xsl:template>

<!-- INTRO PARAGRAPH TEXT, BODY TEXT, BODY SUBTEXT AND BOTTOM CALLOUT CONTENT
TEMPLATE -->
<xsl:template
match="intro_para_text|body_text|body_subtext|bottom_callout_content">
<xsl:apply-templates />
</xsl:template>

<!-- BODY GRAPHIC TEMPLATE -->
<xsl:template match="body_image">
	<xsl:element name="img">
		<xsl:attribute name="src">
			<xsl:value-of select="."/>
		</xsl:attribute>
	</xsl:element>
</xsl:template>

<!-- THIS TEMPLATE CHECKS HYPERLINKS EMBEDDED IN CONTENT BLOCKS FOR LINKS TO
XML CONTENT AND CONVERTS TO SHTML -->
<xsl:template match="a">
 <xsl:element name="a">
<!-- insert new 9/28 -->
<xsl:if test="string-length(@name)&gt;0">
  <xsl:attribute name="name">
    <xsl:value-of select="@name" />
  </xsl:attribute>
</xsl:if>

  <xsl:attribute name="href">
   <xsl:choose>
    <xsl:when test="contains(@href,'.xml')"><xsl:value-of
select="substring(@href,1,string-length(@href)-4)" />.shtml</xsl:when>
    <xsl:otherwise><xsl:value-of select="@href" /></xsl:otherwise>
   </xsl:choose>
  </xsl:attribute>
  <xsl:value-of select="."/>
 </xsl:element>
</xsl:template>

<xsl:template match="@*|node()">
<xsl:copy>
   <xsl:apply-templates select="@*|node()"/>
</xsl:copy>
</xsl:template>

<xsl:template match="search_keywords">
<xsl:value-of select="."/>
<xsl:if test="position()!=last()">, </xsl:if>
</xsl:template>

<!-- XDQL - Add template to handle XDQL -->
<xsl:template name="XDQL">
 <xsl:param name="dql"/>
 <xsl:param name="includecontent" select="string('true')"/>
 <xsl:param name="ContentEncoding" select="string('dom')"/>
 <xsl:param name="ContentTag" select="string('content')"/>
 <xsl:param name="ContentFormat" select="string('xml')"/>
 <xsl:param name="UseGivenCaseTagNames" select="true"/>
 <xsl:param name="ErrorTag" select="string('XDQLError')"/>

 <!-- create and init xdql class and specify dql query -->
 <xsl:variable name="xdql"
select="java:com.documentum.xml.xdql.DfXmlQuery.new()"/>
 <xsl:variable name="init" select="java:init($xdql)"/>

 <!-- set the properties of query object -->
 <xsl:variable name="param" select="java:setDql($xdql,$dql)" />
 <xsl:variable name="param" select="java:includeContent($xdql,false())"/>
 <xsl:variable name="param" select="java:setContentTag($xdql,$ContentTag)"/>
 <xsl:variable name="param"
select="java:setContentEncoding($xdql,$ContentEncoding)"/>
 <xsl:variable name="param"
select="java:setContentFormat($xdql,$ContentFormat)"/>
 <xsl:variable name="param" select="java:useGivenCaseTagNames($xdql)"/>
 <xsl:variable name="param" select="java:setErrorTag($xdql,$ErrorTag)"/>

 <!-- execute and return pure xml -->
 <xsl:variable name="execute"
select="java:execute($xdql,'DF_READ_QUERY',$DMS_SESSION_ID)"/>
 <xsl:variable name="queryresult" select ="java:getXMLDOM($xdql)"/>

 <xsl:copy-of select="$queryresult" />
</xsl:template>

</xsl:stylesheet>

-----Original Message-----
From: Pieter Reint Siegers Kort [mailto:pieter.siegers@xxxxxxxxxxx]
Sent: Monday, January 03, 2005 2:30 PM
To: xsl-list@xxxxxxxxxxxxxxxxxxxxxx
Subject: RE: [xsl] Dynamic image and text alignment


Hi Tiffany,

Could you post your XSLT sofar? And also some typical input XML, that'll
help too.

Cheers,
<prs/>

-----Original Message-----
From: Tiffany Blake [mailto:Tiffany_Blake@xxxxxxx]
Sent: Monday, January 03, 2005 3:53 PM
To: xsl-list@xxxxxxxxxxxxxxxxxxxxxx
Subject: [xsl] Dynamic image and text alignment

i am trying to control the image and text alignment in my presentation
dynamically based on the user choice input.  the trick is to allow multiple
variations of image/text presentation on one page.

Page example:

paragraph 1 (user choice creates flag = left-right <xsl:if
test="body_image_placement='left-right'">)

	image flush left
	text right aligned to image


paragraph 2 (user choice creates flag = top-bottom <xsl:if
test="body_image_placement='top-bottom'">)

	image above text
	text below image

paragraph 3 (user choice creates flag = top-bottom <xsl:if
test="body_image_placement='top-bottom'">)

	no image
	text flush left

Rendered page:


paragraph 1		X	this is the text that appears
				right aligned to image



paragraph 2		X

			this is the text that appears below the
			image


paragraph 3		this is the text that apppears with no image


any suggestions?
tiffany_blake@xxxxxxx


-----Original Message-----
From: Michael Kay [mailto:mike@xxxxxxxxxxxx]
Sent: Monday, January 03, 2005 1:07 PM
To: 'Dimtre Novatchev'
Cc: xsl-list@xxxxxxxxxxxxxxxxxxxxxx
Subject: RE: [xsl] Computational complexity of accessing the Nth item in a
sequence and in a node-set


> So, if I have understood correctly, having
>
>    $sequence[last()]
>
> (and somehow more than one reference to $sequence) will guarantee that
> any further access to the items of $sequence will be performed in
> constant time?

No guarantees: but yes, that's what I would expect to happen.
>
> Cant this be pre-computed automatically by the XSLT processor?
> Something like computing a function with @memo-function="yes", but
> done by the XSLT processor?

I'm not clear what you mean.

Michael Kay
http://www.saxonica.com/

Current Thread