cocoon-cvs mailing list archives

Site index · List index
Message view « Date » · « Thread »
Top « Date » · « Thread »
From sylv...@apache.org
Subject cvs commit: cocoon-2.1/src/blocks/woody/samples/resources woody-page-layout.xsl
Date Fri, 05 Sep 2003 17:11:50 GMT
sylvain     2003/09/05 10:11:49

  Modified:    src/blocks/woody/samples/forms form1_template_action.xml
                        form1_template_flow.xml
               src/blocks/woody/samples/resources woody-page-layout.xsl
  Log:
  New tab layout using a <select>
  
  Revision  Changes    Path
  1.5       +8 -9      cocoon-2.1/src/blocks/woody/samples/forms/form1_template_action.xml
  
  Index: form1_template_action.xml
  ===================================================================
  RCS file: /home/cvs/cocoon-2.1/src/blocks/woody/samples/forms/form1_template_action.xml,v
  retrieving revision 1.4
  retrieving revision 1.5
  diff -u -r1.4 -r1.5
  --- form1_template_action.xml	4 Sep 2003 16:07:45 -0000	1.4
  +++ form1_template_action.xml	5 Sep 2003 17:11:49 -0000	1.5
  @@ -8,15 +8,14 @@
         <table align="center">
           <tr>
             <td>
  -          
  -            <!-- artificial widget needed to keep tab state. Work still needed on that
-->
  -            <wt:widget id="tab-state">
  -              <wi:styling type="hidden"/>
  -            </wt:widget>
  -            
  +                      
               <!-- group with tabs. Each of the children of <items> will constitute
a tab -->
  -            <wi:group state-widget="tab-state">
  +            <wi:group>
                 <wi:styling type="tabs"/>
  +              <wi:label>Choose a panel: </wi:label>
  +              <wi:state>
  +                <wt:widget id="tab-state"/>
  +              </wi:state>
                 
                 <wi:items>
                   <!-- group with automatic two-column layout -->
  @@ -56,7 +55,7 @@
                 </wi:items>
               </wi:group>
               
  -            <br/>
  +            <p>Checkout the <a href="form1.flow">form1 flow page</a>
for another way of formatting panels</p>
               
               <!-- Group of type 'fieldset' will have a surrounding frame -->
               <wi:group>
  @@ -65,10 +64,10 @@
                 <wi:items>
                   <wt:widget id="visa"/>
                   <wt:widget id="ipaddress"/>
  +                <wt:widget id="altbirthdate"/>
                   <wt:widget id="birthdate">
                     <wi:styling type="date" format="dd/MM/yyyy"/>
                   </wt:widget>
  -                <wt:widget id="altbirthdate"/>
                   <wt:widget id="dieselprice"/>
                 </wi:items>
               </wi:group>
  
  
  
  1.5       +48 -38    cocoon-2.1/src/blocks/woody/samples/forms/form1_template_flow.xml
  
  Index: form1_template_flow.xml
  ===================================================================
  RCS file: /home/cvs/cocoon-2.1/src/blocks/woody/samples/forms/form1_template_flow.xml,v
  retrieving revision 1.4
  retrieving revision 1.5
  diff -u -r1.4 -r1.5
  --- form1_template_flow.xml	4 Sep 2003 16:07:45 -0000	1.4
  +++ form1_template_flow.xml	5 Sep 2003 17:11:49 -0000	1.5
  @@ -8,51 +8,61 @@
       <table align="center">
        <tr><td>
        
  -      <!-- a wi:group produces a columnized layout of fields, along with a <fieldset>
  -           frame if there is a <wi:label> -->
  -      <wi:group>
  -        <wi:label>String fields</wi:label>
  -        <wi:styling type="fieldset" layout="columns"/>
  -        <wi:items>
  -          <wt:widget id="email"/>
  -          <wt:widget id="fourchars">
  -            <!-- particular styling for the enumeration -->
  -            <wi:styling list-type="listbox" listbox-size="4"/>
  -          </wt:widget>
  -        </wi:items>
  -      </wi:group>
  -      
  -      <wi:group>
  -        <wi:label>Number fields</wi:label>
  -        <wi:styling type="fieldset" layout="columns"/>
  -        <wi:items>
  -          <wt:widget id="number1"/>
  -          <wt:widget id="number2"/>
  -          <wt:widget id="account"/>
  -          <wt:widget id="cowheight">
  -            <wi:styling list-type="radio"/>
  -          </wt:widget>
  -        </wi:items>
  -      </wi:group>
  -      
  -      <!-- wi:group with no label : columnized layout without a surrounding frame -->
  -      <wi:group>
  -        <wi:label>Boolean fields</wi:label>
  -        <wi:styling type="fieldset" layout="columns"/>
  -        <wi:items>
  -          <wt:widget id="somebool"/>
  -          <wt:widget id="drinks"/>
  -        </wi:items>
  -      </wi:group>
  -
  +            <!-- group with tabs. Each of the children of <items> will constitute
a tab -->
  +            <wi:group>
  +              <wi:styling type="choice"/>
  +              <wi:label>Choose a panel: </wi:label>
  +              <wi:state>
  +                <wt:widget id="tab-state"/>
  +              </wi:state>
  +              
  +              <wi:items>
  +                <!-- group with automatic two-column layout -->
  +                <wi:group>
  +                  <wi:label>String fields</wi:label>
  +                  <wi:styling layout="columns"/>
  +                  <wi:items>
  +                    <wt:widget id="email"/>
  +                    <wt:widget id="fourchars">
  +                      <!-- particular styling for the enumeration -->
  +                      <wi:styling list-type="listbox" listbox-size="4"/>
  +                    </wt:widget>
  +                  </wi:items>
  +                </wi:group>
  +                
  +                <wi:group>
  +                  <wi:label>Number fields</wi:label>
  +                  <wi:styling layout="columns"/>
  +                  <wi:items>
  +                    <wt:widget id="number1"/>
  +                    <wt:widget id="number2"/>
  +                    <wt:widget id="account"/>
  +                    <wt:widget id="cowheight">
  +                      <wi:styling list-type="radio"/>
  +                    </wt:widget>
  +                  </wi:items>
  +                </wi:group>
  +                
  +                <wi:group>
  +                  <wi:styling layout="columns"/>
  +                  <wi:label>Boolean fields</wi:label>
  +                  <wi:items>
  +                    <wt:widget id="somebool"/>
  +                    <wt:widget id="drinks"/>
  +                  </wi:items>
  +                </wi:group>
  +              </wi:items>
  +            </wi:group>
  +            
  +            <p>Checkout the <a href="form1">form1 action page</a> for
another way of formatting panels</p>
   
         <wi:group>
           <wi:styling layout="columns"/>
           <wi:items>
             <wt:widget id="visa"/>
             <wt:widget id="ipaddress"/>
  -          <wt:widget id="birthdate"><wi:styling type="date" format="dd/MM/yyyy"/></wt:widget>
             <wt:widget id="altbirthdate"/>
  +          <wt:widget id="birthdate"><wi:styling type="date" format="dd/MM/yyyy"/></wt:widget>
             <wt:widget id="dieselprice"/>
           </wi:items>
         </wi:group>
  
  
  
  1.3       +84 -6     cocoon-2.1/src/blocks/woody/samples/resources/woody-page-layout.xsl
  
  Index: woody-page-layout.xsl
  ===================================================================
  RCS file: /home/cvs/cocoon-2.1/src/blocks/woody/samples/resources/woody-page-layout.xsl,v
  retrieving revision 1.2
  retrieving revision 1.3
  diff -u -r1.2 -r1.3
  --- woody-page-layout.xsl	4 Sep 2003 16:07:45 -0000	1.2
  +++ woody-page-layout.xsl	5 Sep 2003 17:11:49 -0000	1.3
  @@ -13,13 +13,20 @@
         
       <script language="JavaScript">
         function showWoodyTab(tabgroup, idx, length, state) {
  +        //alert(tabgroup + " - " + idx);
           for (var i = 0; i &lt; length; i++) {
  +          // Change tab status (selected/unselected)
             var tab = document.getElementById(tabgroup + "_tab_" + i);
  -          tab.className = (i == idx) ? 'woody-tab woody-activeTab': 'woody-tab';
  -           
  +          if (tab != null) {
  +            tab.className = (i == idx) ? 'woody-tab woody-activeTab': 'woody-tab';
  +          }
  +          // Change tab content visibilty
             var tabitems = document.getElementById(tabgroup + "_items_" + i);
  -          tabitems.style.display = (i == idx) ? '' : 'none';
  +          if (tabitems != null) {
  +            tabitems.style.display = (i == idx) ? '' : 'none';
  +          }
           }
  +        // Change state value
           if (state.length > 0) {
             document.forms[0][state].value = idx;
           }
  @@ -51,8 +58,8 @@
       -->
       <xsl:variable name="active">
         <xsl:choose>
  -        <xsl:when test="@state-widget">
  -          <xsl:variable name="value" select="string(//wi:field[@id = current()/@state-widget]/wi:value)"/>
  +        <xsl:when test="wi:state">
  +          <xsl:variable name="value" select="wi:state/wi:*/wi:value"/>
             <xsl:choose>
               <xsl:when test="string-length($value) > 0"><xsl:value-of select="$value"/></xsl:when>
               <xsl:otherwise>0</xsl:otherwise>
  @@ -63,11 +70,16 @@
       </xsl:variable>
       
       <!-- copy the "state-widget" attribute for use in for-each -->
  -    <xsl:variable name="state-widget" select="@state-widget"/>
  +    <xsl:variable name="state-widget" select="wi:state/wi:*/@id"/>
       
       <xsl:variable name="id" select="generate-id()"/>
       <div id="{$id}">
       
  +      <!-- add an hidden input for the state -->
  +      <xsl:if test="$state-widget">
  +        <input type="hidden" name="{$state-widget}" value="{$active}"/>
  +      </xsl:if>
  +    
         <!-- div containing the tabs -->
         <div class="woody-tabArea">
           <xsl:for-each select="wi:items/wi:*">
  @@ -99,6 +111,72 @@
           </div>
         </xsl:for-each>
       </div>
  +  </xsl:template>
  +  
  +  
  +  <!--
  +    wi:group of type choice : a popup is used instead of tabs
  +  -->
  +  <xsl:template match="wi:group[wi:styling/@type='choice']">
  +    <!-- find the currently selected tab.
  +         Thoughts still needed here, such as autogenerating a field in the woodytransformer
  +         to hold this state.
  +    -->
  +    <xsl:variable name="active">
  +      <xsl:choose>
  +        <xsl:when test="wi:state">
  +          <xsl:variable name="value" select="wi:state/wi:*/wi:value"/>
  +          <xsl:choose>
  +            <xsl:when test="string-length($value) > 0"><xsl:value-of select="$value"/></xsl:when>
  +            <xsl:otherwise>0</xsl:otherwise>
  +          </xsl:choose>
  +        </xsl:when>
  +        <xsl:otherwise>0</xsl:otherwise>
  +      </xsl:choose>
  +    </xsl:variable>
  +    
  +    <!-- copy the "state-widget" attribute for use in for-each -->
  +    <xsl:variable name="state-widget" select="wi:state/wi:*/@id"/>
  +    
  +    <xsl:variable name="id" select="generate-id()"/>
  +    <fieldset id="{$id}">
  +      <legend>
  +        <xsl:apply-templates select="wi:label/node()"/>
  +        <select name="{$state-widget}" onchange="showWoodyTab('{$id}', this.selectedIndex,
{count(wi:items/*)}, '{$state-widget}')">
  +          <xsl:for-each select="wi:items/wi:*">
  +            <option>
  +              <xsl:attribute name="value">
  +                <xsl:choose>
  +                  <xsl:when test="wi:value">
  +                    <xsl:value-of select="wi:value"/>
  +                  </xsl:when>
  +                  <xsl:otherwise>
  +                    <xsl:value-of select="position() - 1"/>
  +                  </xsl:otherwise>
  +                </xsl:choose>
  +              </xsl:attribute>
  +              <xsl:if test="$active = (position() - 1)">
  +                <xsl:attribute name="selected">selected</xsl:attribute>
  +              </xsl:if>
  +              <xsl:copy-of select="wi:label"/>
  +            </option>
  +          </xsl:for-each>
  +        </select>
  +        <xsl:if test="wi:items/*//wi:validation-message">
  +          <span style="color:red; font-weight: bold">&#160;!&#160;</span>
  +        </xsl:if>
  +      </legend>
  +      
  +      <!-- a div for each of the items -->
  +      <xsl:for-each select="wi:items/wi:*">
  +        <div id="{$id}_items_{position() - 1}">
  +          <xsl:if test="$active != position() - 1">
  +            <xsl:attribute name="style">display:none</xsl:attribute>
  +          </xsl:if>
  +          <xsl:apply-templates select="."/>
  +        </div>
  +      </xsl:for-each>
  +    </fieldset>
     </xsl:template>
     
     <!--
  
  
  

Mime
View raw message