<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">

	<xsl:template match="TAB-PANEL">
		<table class="sb-formtable" cellpadding="0" cellspacing="0" width="100%" border="0">
			<tr class="sb-formtableheader">
				<th valign="bottom" align="left" class="sb-formtableheader-th" style="width: 100%;">
					<table style="width:100%;" cellpadding="0" cellspacing="0" border="0" class="sb-formtable">
						<tr>
							<td valign="top" style="width:100%;"><table style="width:100%;" border="0" cellspacing="0" cellpadding="0">
								<tr>
									<td width="100%">
										<div style="width:100%; display: block;">
											<xsl:apply-templates select="TAB-PANEL-CARD" mode="label"><xsl:with-param name="tabpanelId"><xsl:value-of select="@ID"/></xsl:with-param></xsl:apply-templates>
										</div>
									</td>
								</tr>
							</table>
							</td>
						</tr>
					</table>
				</th>
			</tr>
			<tr>
				<td style="padding: 25px;" class="sb-page">
					<xsl:apply-templates select="TAB-PANEL-CARD" mode="content" />
				</td>
			</tr>
			<tr class="sb-formtablefooter">
				<th style="width: 100%;" >&#160;</th>
			</tr>
		</table>

		<script type="text/javascript">imgPath='<xsl:value-of select="$skinPath" />/images/';</script>
		<script type="text/javascript" src="/js/tabpanel.js?{$version}.{$build}"></script>
		<script type="text/javascript">
			<xsl:call-template name="TAB-PANEL-OBJECT-NAME"><xsl:with-param name="tabpanelId"><xsl:value-of select="@ID"/></xsl:with-param></xsl:call-template> = new TabPanel();
			<xsl:call-template name="TAB-PANEL-OBJECT-NAME"><xsl:with-param name="tabpanelId"><xsl:value-of select="@ID"/></xsl:with-param></xsl:call-template>.setupAllPages();
		</script>
		<xsl:apply-templates select="TAB-PANEL-CARD" mode="hint"><xsl:with-param name="tabpanelId"><xsl:value-of select="@ID"/></xsl:with-param></xsl:apply-templates>
	</xsl:template>

	<xsl:template name="TAB-PANEL-OBJECT-NAME">
		<xsl:param name="tabpanelId"/>
		<xsl:choose>
			<xsl:when test="$tabpanelId=''">sb_panel</xsl:when>
			<xsl:otherwise>sb_panel_<xsl:value-of select="$tabpanelId"/></xsl:otherwise>
		</xsl:choose>
	</xsl:template>

	<xsl:template match="TAB-PANEL-CARD" mode="label">
		<xsl:param name="tabpanelId"/>
		<xsl:choose>
			<xsl:when test="@ACTIVE != ''" >
				<xsl:call-template name="TAB-PANEL-CARD-SELECTED" ><xsl:with-param name="tabpanelId"><xsl:value-of select="$tabpanelId"/></xsl:with-param></xsl:call-template>
			</xsl:when>
			<xsl:otherwise >
				<xsl:call-template name="TAB-PANEL-CARD-NOTSELECTED" ><xsl:with-param name="tabpanelId"><xsl:value-of select="$tabpanelId"/></xsl:with-param></xsl:call-template>
			</xsl:otherwise>
		</xsl:choose>
	</xsl:template>

	<xsl:template name="TAB-PANEL-CARD-SELECTED">
		<xsl:param name="tabpanelId"/>
		<xsl:variable name="toggle"><xsl:choose><xsl:when test="../@TOGGLE"><xsl:value-of select="../@TOGGLE"/></xsl:when><xsl:otherwise>tabPanelToggle</xsl:otherwise></xsl:choose></xsl:variable>

		<xsl:if test="@CONTEXT-HELP">
			<script type="text/javascript">
				SbAppendLocaleKey('DEFAULT-CONTEXT-HELP', SbGetLocaleByKey('<xsl:value-of select="@CONTEXT-HELP"/>')); SetContextHelp();
			</script>
		</xsl:if>
					
		<table border="0" cellspacing="0" cellpadding="0" style="float: left; cursor:default;width:100px; height: 21px;" class="TabLabelSelectedStyle">
			<xsl:attribute name="id"><xsl:value-of select="@ID" /></xsl:attribute>
			<xsl:if test="@CONTEXT-HELP">
				<xsl:attribute name="onmouseout">SetContextHelp();</xsl:attribute>
				<xsl:attribute name="onmouseover">SetContextHelp('<xsl:value-of select="@CONTEXT-HELP"/>');</xsl:attribute>
			</xsl:if>
			
			<xsl:choose>
				<xsl:when test="@ACTION">
					<xsl:attribute name="onclick">javascript:document.location.href='<xsl:value-of select="@ACTION"/>'</xsl:attribute>
				</xsl:when>
				<xsl:otherwise>
					<xsl:choose>
						<xsl:when test="@CONTEXT-HELP">
							<xsl:attribute name="onclick">javascript:<xsl:value-of select="$toggle"/>('<xsl:call-template name="TAB-PANEL-OBJECT-NAME"><xsl:with-param name="tabpanelId"><xsl:value-of select="$tabpanelId"/></xsl:with-param></xsl:call-template>', this); SbAppendLocaleKey('DEFAULT-CONTEXT-HELP', SbGetLocaleByKey('<xsl:value-of select="@CONTEXT-HELP"/>')); SetContextHelp();</xsl:attribute>
						</xsl:when>
						<xsl:otherwise>
							<xsl:attribute name="onclick">javascript:<xsl:value-of select="$toggle"/>('<xsl:call-template name="TAB-PANEL-OBJECT-NAME"><xsl:with-param name="tabpanelId"><xsl:value-of select="$tabpanelId"/></xsl:with-param></xsl:call-template>', this);</xsl:attribute>
						</xsl:otherwise>
					</xsl:choose>
				</xsl:otherwise>
			</xsl:choose>

			<tr>
				<td>
					<img src="{$skinPath}/images/tabLeftOn.gif" alt="" >
						<xsl:attribute name="id"><xsl:value-of select="@ID" />_IL</xsl:attribute>
					</img>
				</td>
				<td class="sb-button-tabs-text" style="white-space:nowrap;width:100%;background-image:url({$skinPath}/images/tabMiddleOn.gif);background-repeat:repeat-x scroll 0px;">
					<xsl:attribute name="id"><xsl:value-of select="@ID" />_T</xsl:attribute>
					<xsl:value-of select="@TITLE" />
				</td>
				<td>
					<img src="{$skinPath}/images/tabRightOn.gif" id="TabGeneral_IR" alt="" >
						<xsl:attribute name="id"><xsl:value-of select="@ID" />_IR</xsl:attribute>
					</img>
				</td>
			</tr>
		</table>
	</xsl:template>

	<xsl:template name="TAB-PANEL-CARD-NOTSELECTED">
		<xsl:param name="tabpanelId"/>
		<xsl:variable name="toggle"><xsl:choose><xsl:when test="../@TOGGLE"><xsl:value-of select="../@TOGGLE"/></xsl:when><xsl:otherwise>tabPanelToggle</xsl:otherwise></xsl:choose></xsl:variable>
		<table border="0" cellspacing="0" cellpadding="0" style="float: left; cursor:pointer;width:100px;height: 21px;" class="TabLabelDefaultStyle">
			<xsl:attribute name="id"><xsl:value-of select="@ID" /></xsl:attribute>
			<xsl:if test="@CONTEXT-HELP">
				<xsl:attribute name="onmouseout">SetContextHelp();</xsl:attribute>
				<xsl:attribute name="onmouseover">SetContextHelp('<xsl:value-of select="@CONTEXT-HELP"/>');</xsl:attribute>
			</xsl:if>
			
			<xsl:choose>
				<xsl:when test="@ACTION">
					<xsl:attribute name="onclick">javascript:document.location.href='<xsl:value-of select="@ACTION"/>'</xsl:attribute>
				</xsl:when>
				<xsl:otherwise>
					<xsl:choose>
						<xsl:when test="@CONTEXT-HELP">
							<xsl:attribute name="onclick">javascript:<xsl:value-of select="$toggle"/>('<xsl:call-template name="TAB-PANEL-OBJECT-NAME"><xsl:with-param name="tabpanelId"><xsl:value-of select="$tabpanelId"/></xsl:with-param></xsl:call-template>', this); SbAppendLocaleKey('DEFAULT-CONTEXT-HELP', SbGetLocaleByKey('<xsl:value-of select="@CONTEXT-HELP"/>')); SetContextHelp();</xsl:attribute>
						</xsl:when>
						<xsl:otherwise>
							<xsl:attribute name="onclick">javascript:<xsl:value-of select="$toggle"/>('<xsl:call-template name="TAB-PANEL-OBJECT-NAME"><xsl:with-param name="tabpanelId"><xsl:value-of select="$tabpanelId"/></xsl:with-param></xsl:call-template>', this);</xsl:attribute>
						</xsl:otherwise>
					</xsl:choose>
				</xsl:otherwise>
			</xsl:choose>

			<tr>
				<td>
					<img src="{$skinPath}/images/tabLeftOff.gif" alt="" >
						<xsl:attribute name="id"><xsl:value-of select="@ID" />_IL</xsl:attribute>
					</img>
				</td>
				<td class="sb-button-tabs-text" style="white-space:nowrap;width:100%;background-image:url({$skinPath}/images/tabMiddleOff.gif);background-repeat:repeat-x scroll 0px;">
					<xsl:attribute name="id"><xsl:value-of select="@ID" />_T</xsl:attribute>
					<xsl:value-of select="@TITLE" />
				</td>
				<td>
					<img src="{$skinPath}/images/tabRightOff.gif" id="TabGeneral_IR" alt="" >
						<xsl:attribute name="id"><xsl:value-of select="@ID" />_IR</xsl:attribute>
					</img>
				</td>
			</tr>
		</table>
	</xsl:template>

	<xsl:template match="TAB-PANEL-CARD" mode="content">
		<xsl:choose>
			<xsl:when test="@ACTIVE=1" >
				<xsl:call-template name="TAB-PANEL-CARD-CONTENT-SELECTED" />
			</xsl:when>
			<xsl:otherwise >
				<xsl:call-template name="TAB-PANEL-CARD-CONTENT-NOTSELECTED" />
			</xsl:otherwise>
		</xsl:choose>
	</xsl:template>

    <xsl:template name="TAB-PANEL-CARD-CONTENT-SELECTED">
        <div style="display:block;">
            <xsl:attribute name="id"><xsl:value-of select="@ID" />Content</xsl:attribute>
            <xsl:apply-templates/>
        </div>
    </xsl:template>

    <xsl:template name="TAB-PANEL-CARD-CONTENT-NOTSELECTED">
        <div style="display:none;">
            <xsl:attribute name="id"><xsl:value-of select="@ID" />Content</xsl:attribute>
            <!-- <xsl:value-of select="@TEXT" /> -->
            <xsl:apply-templates/>
        </div>
    </xsl:template>

    <xsl:template match="TAB-PANEL-CARD" mode="hint">
    	<xsl:param name="tabpanelId">1</xsl:param>
    	<xsl:variable name="tabpanelIdInUpperCase"><xsl:call-template name="TO-UPPER-CASE"><xsl:with-param name="word"><xsl:value-of select="@ID"/></xsl:with-param></xsl:call-template></xsl:variable>
    	<xsl:variable name="localeKey"><xsl:value-of select="concat($tabpanelIdInUpperCase, '-HINT')"/></xsl:variable>
    	<xsl:variable name="localValue"><xsl:value-of select="/SITEBUILDER-PAGE/JS-LOCALE/*[name()=$localeKey]/text()" /></xsl:variable>
    	<xsl:if test="$localValue!=''">
	    	<script language="JavaScript">
	    		if (sb_status!= null) {
	    			<xsl:call-template name="TAB-PANEL-OBJECT-NAME"><xsl:with-param name="tabpanelId"><xsl:value-of select="$tabpanelId"/></xsl:with-param></xsl:call-template>.registerPageOnloadAction("<xsl:value-of select="current()/@ID" />", "sb_status.setByKey('<xsl:value-of select="$localeKey" />', 0);");
	    		}
	    	</script>
	    </xsl:if>
    </xsl:template>

    <xsl:template name="TAB-PANEl-CARD-ONLOAD-ACTION">
    	<xsl:param name="tabpanelId">1</xsl:param>
    	<xsl:param name="tabpanelCard"/>
    	<xsl:param name="action"/>
    	<xsl:call-template name="TAB-PANEL-OBJECT-NAME"><xsl:with-param name="tabpanelId"><xsl:value-of select="$tabpanelId"/></xsl:with-param></xsl:call-template>.registerPageOnloadAction("<xsl:value-of select="$tabpanelCard"/>","<xsl:value-of select="$action"/>");</xsl:template>

    <xsl:template name="TO-UPPER-CASE">
    	<xsl:param name="word"/>
		<xsl:value-of select="translate($word,'abcdefghijklmnopqrstuvwxyz','ABCDEFGHIJKLMNOPQRSTUVWXYZ')"/>
	</xsl:template>

</xsl:stylesheet>