Widgets styles?

What's the easiest way to control a widget:tabs style?

I'm just trying to set a default width and, as it is rendered as a table,
I tried:
<widget:tabs style="width:500px;">
and
<widget:tabs width="500">
however, in both cases, the customization is ignored and the generated code is:
<table class="widget-tabs" cellpadding="0" cellspacing="0" border="0">
thanks
*P





--
You receive this message as a subscriber of the [hidden email] mailing list.
To unsubscribe: mailto:[hidden email]
For general help: mailto:[hidden email]?subject=help
ObjectWeb mailing lists service home page: http://www.objectweb.org/wws

Pascal,

Have a look at the file xforms-widgets.xsl. You can find it in the
config directory. If you want to control the style, you will have to
either modify that file by adding your CSS there or modify it to copy
attributes from <widget:tabs>.

If you decide to implement the latter, and it works for you, let us
know what you changed in xforms-widgets.xsl and we can maybe include
your changes in PresentationServer.

Alex

On 5/4/06, Pascal Heus <[hidden email]> wrote:
--
Blog (XML, Web apps, Open Source):
http://www.orbeon.com/blog/



--
You receive this message as a subscriber of the [hidden email] mailing list.
To unsubscribe: mailto:[hidden email]
For general help: mailto:[hidden email]?subject=help
ObjectWeb mailing lists service home page: http://www.objectweb.org/wws

Alex:
Thanks for the tip. Just added 1 line in config/xforms-widgets.xsl to copy the <widget:tabs> attributes into the <table> element:
Before:
line 31 <xhtml:table class="widget-tabs" cellpadding="0" cellspacing="0" border="0">
line 32   <xhtml:tr>
After:
line 31 <xhtml:table class="widget-tabs" cellpadding="0" cellspacing="0" border="0">
line 32   <xsl:copy-of select="@*"/>
line 33   <xhtml:tr>
This seems to wok fine. Let me know if/when you integrated this change.
cheers,
*P

Alessandro Vernet wrote:

Pascal,

Have a look at the file xforms-widgets.xsl. You can find it in the
config directory. If you want to control the style, you will have to
either modify that file by adding your CSS there or modify it to copy
attributes from <widget:tabs>.

If you decide to implement the latter, and it works for you, let us
know what you changed in xforms-widgets.xsl and we can maybe include
your changes in PresentationServer.

Alex

On 5/4/06, Pascal Heus [hidden email] wrote:

What's the easiest way to control a widget:tabs style?

I'm just trying to set a default width and, as it is rendered as a table,
I tried:
<widget:tabs style="width:500px;">
and
<widget:tabs width="500">
however, in both cases, the customization is ignored and the generated code is:
<table class="widget-tabs" cellpadding="0" cellspacing="0" border="0">
thanks
*P






--
You receive this message as a subscriber of the [hidden email] mailing list.
To unsubscribe: [hidden email]
For general help: [hidden email]
ObjectWeb mailing lists service home page: http://www.objectweb.org/wws

--
Blog (XML, Web apps, Open Source):
http://www.orbeon.com/blog/

--
You receive this message as a subscriber of the [hidden email] mailing list.
To unsubscribe: [hidden email]
For general help: [hidden email]
ObjectWeb mailing lists service home page: http://www.objectweb.org/wws
  

<!--
    Copyright (C) 2004 Orbeon, Inc.

    This program is free software; you can redistribute it and/or modify it under the terms of the
    GNU Lesser General Public License as published by the Free Software Foundation; either version
    2.1 of the License, or (at your option) any later version.

    This program is distributed in the hope that it will be useful, but WITHOUT ANY WARRANTY;
    without even the implied warranty of MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.
    See the GNU Lesser General Public License for more details.

    The full text of the license is available at http://www.gnu.org/copyleft/lesser.html
-->
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
    xmlns:xforms="http://www.w3.org/2002/xforms"
    xmlns:xxforms="http://orbeon.org/oxf/xml/xforms"
    xmlns:ev="http://www.w3.org/2001/xml-events"
    xmlns:widget="http://orbeon.org/oxf/xml/widget"
    xmlns:xs="http://www.w3.org/2001/XMLSchema"
    xmlns:f="http://orbeon.org/oxf/xml/formatting"
    xmlns:xhtml="http://www.w3.org/1999/xhtml">

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

    <xsl:template match="widget:tabs">
        <xsl:variable name="tabs" select="widget:tab"/><!-- as="element()*"  -->
        <xhtml:table class="widget-tabs" cellpadding="0" cellspacing="0" border="0">
                        <xsl:copy-of select="@*"/>
            <xhtml:tr>
                <xhtml:td class="widget-tab-spacer-side"/>
                <!-- Tabs at the top -->
                <xsl:variable name="selected-tab-specified" select="count(widget:tab[@selected = 'true']) = 1"/><!-- as="xs:boolean"  -->
                <xsl:for-each select="$tabs">
                    <xsl:variable name="tab-id" select="@id"/><!-- as="xs:string"  -->
                    <xsl:if test="position() > 1">
                        <xhtml:td class="widget-tab-spacer-between"/>
                    </xsl:if>
                    <xhtml:td class="widget-tab">
                        <xforms:switch>
                            <!-- Case where this tab is inactive -->
                            <xforms:case id="{$tab-id}-inactive">
                                <xhtml:div class="widget-tab-inactive">
                                    <xforms:trigger appearance="xxforms:link">
                                        <xsl:choose>
                                            <xsl:when test="widget:label/@ref">
                                                <xforms:label ref="{widget:label/@ref}"/>
                                            </xsl:when>
                                            <xsl:otherwise>
                                                <xforms:label><xsl:value-of select="widget:label"/></xforms:label>
                                            </xsl:otherwise>
                                        </xsl:choose>
                                        <xforms:action ev:event="DOMActivate">
                                            <xforms:toggle case="{$tab-id}"/>
                                            <xforms:toggle case="{$tab-id}-active"/>
                                            <xsl:for-each select="$tabs[@id != $tab-id]">
                                                <xforms:toggle case="{@id}-inactive"/>
                                            </xsl:for-each>
                                        </xforms:action>
                                    </xforms:trigger>
                                </xhtml:div>
                            </xforms:case>
                            <!-- Case where this tab is active -->
                            <xforms:case id="{$tab-id}-active">
                                <xsl:if test="(not($selected-tab-specified) and position() = 1) or @selected = 'true'">
                                    <xsl:attribute name="selected">true</xsl:attribute>
                                </xsl:if>
                                <xhtml:div class="widget-tab-active">
                                    <xsl:choose>
                                        <xsl:when test="widget:label/@ref">
                                            <xforms:output ref="{widget:label/@ref}"/>
                                        </xsl:when>
                                        <xsl:otherwise>
                                            <xsl:value-of select="widget:label"/>
                                        </xsl:otherwise>
                                    </xsl:choose>
                                </xhtml:div>
                            </xforms:case>
                        </xforms:switch>
                    </xhtml:td>
                </xsl:for-each>
                <xhtml:td class="widget-tab-spacer-side"/>
            </xhtml:tr>
            <!-- Main area with the switch -->
            <xhtml:tr>
                <xhtml:td class="widget-tabs-panel" colspan="{count(widget:tab) * 4 + 1}">
                    <xforms:switch>
                        <xsl:for-each select="widget:tab">
                            <xforms:case>
                                <xsl:copy-of select="@*"/>
                                <xsl:apply-templates select="node()"/>
                            </xforms:case>
                        </xsl:for-each>
                    </xforms:switch>
                </xhtml:td>
            </xhtml:tr>
        </xhtml:table>
    </xsl:template>

    <xsl:template match="widget:label"/>
   
</xsl:stylesheet>


--
You receive this message as a subscriber of the [hidden email] mailing list.
To unsubscribe: mailto:[hidden email]
For general help: mailto:[hidden email]?subject=help
ObjectWeb mailing lists service home page: http://www.objectweb.org/wws

Alex:
Thanks for the tip. Just added 1 line in config/xforms-widgets.xsl to copy the <widget:tabs> attributes into the <table> element:
Before:
line 31 <xhtml:table class="widget-tabs" cellpadding="0" cellspacing="0" border="0">
line 32   <xhtml:tr>
After:
line 31 <xhtml:table class="widget-tabs" cellpadding="0" cellspacing="0" border="0">
line 32   <xsl:copy-of select="@*"/>
line 33   <xhtml:tr>
This seems to wok fine. Let me know if/when you integrated this change.
cheers,
*P

Alessandro Vernet wrote:

Pascal,

Have a look at the file xforms-widgets.xsl. You can find it in the
config directory. If you want to control the style, you will have to
either modify that file by adding your CSS there or modify it to copy
attributes from <widget:tabs>.

If you decide to implement the latter, and it works for you, let us
know what you changed in xforms-widgets.xsl and we can maybe include
your changes in PresentationServer.

Alex

On 5/4/06, Pascal Heus [hidden email] wrote:

What's the easiest way to control a widget:tabs style?

I'm just trying to set a default width and, as it is rendered as a table,
I tried:
<widget:tabs style="width:500px;">
and
<widget:tabs width="500">
however, in both cases, the customization is ignored and the generated code is:
<table class="widget-tabs" cellpadding="0" cellspacing="0" border="0">
thanks
*P






--
You receive this message as a subscriber of the [hidden email] mailing list.
To unsubscribe: [hidden email]
For general help: [hidden email]
ObjectWeb mailing lists service home page: http://www.objectweb.org/wws

--
Blog (XML, Web apps, Open Source):
http://www.orbeon.com/blog/

--
You receive this message as a subscriber of the [hidden email] mailing list.
To unsubscribe: [hidden email]
For general help: [hidden email]
ObjectWeb mailing lists service home page: http://www.objectweb.org/wws
  

--
You receive this message as a subscriber of the [hidden email] mailing list.
To unsubscribe: mailto:[hidden email]
For general help: mailto:[hidden email]?subject=help
ObjectWeb mailing lists service home page: http://www.objectweb.org/wws

Pascal,

This change looks good. I just checked it in the code base, so you
will find it in the next "unstable build".

Alex

On 5/6/06, Pascal Heus <[hidden email]> wrote:
--
Blog (XML, Web apps, Open Source):
http://www.orbeon.com/blog/



--
You receive this message as a subscriber of the [hidden email] mailing list.
To unsubscribe: mailto:[hidden email]
For general help: mailto:[hidden email]?subject=help
ObjectWeb mailing lists service home page: http://www.objectweb.org/wws