Ignore:
Timestamp:
2011-05-10T14:33:12+12:00 (13 years ago)
Author:
sjm84
Message:

Another round of improvements to the oran skin including a tree view of the classifiers

File:
1 edited

Legend:

Unmodified
Added
Removed

  • main/trunk/greenstone3/web/interfaces/oran/transform/pages/classifier.xsl

    r23989 r24009  
    1919    <!-- the page content -->
    2020    <xsl:template match="/page/pageResponse">
    21 
    22         <!-- show the classifiers if more than one (title, subject, etc.) -->
    23         <!--<xsl:if test="service/classifierList/classifier[2]">
    24             <div id="classifierList" class="navList">
    25                 <ul>
    26                     <xsl:for-each select="service/classifierList/classifier">
    27                         <li><gslib:classifierLink/></li>
    28                     </xsl:for-each>
    29                 </ul>
    30                 <div class="clear"><xsl:text> </xsl:text></div>
    31             </div>
    32         </xsl:if>-->
    33 
     21        <xsl:call-template name="classifierLoadScript"/>
    3422        <!-- this right sidebar -->
    3523        <xsl:if test="$berryBasketOn">
    … …  
    7866    <xsl:template match="classifierNode" priority="3">
    7967
    80         <li class="shelf">
     68        <table id="title{@nodeID}"><tr>
     69            <!-- Expand/collapse button -->
     70            <td class="headerTD">
     71                <img id="toggle{@nodeID}" onclick="toggleSection('{@nodeID}');" class="icon">           
     72                    <xsl:attribute name="src">
     73                        <xsl:value-of select="util:getInterfaceText($interface_name, /page/@lang, 'expand_image')"/>
     74                    </xsl:attribute>
     75                </img>
     76            </td>
     77            <!-- Bookshelf icon -->
     78            <td>
     79                <img>
     80                    <xsl:attribute name="src"><xsl:value-of select="util:getInterfaceText($interface_name, /page/@lang, 'bookshelf_image')"/></xsl:attribute>
     81                </img>
     82            </td>
     83            <!-- Link title -->
     84            <td>
     85                <a href="javascript:toggleSection('{@nodeID}');">
     86                    <xsl:value-of disable-output-escaping="yes"  select="metadataList/metadata[@name='Title']"/>
     87                </a>
     88            </td>
     89        </tr></table>
     90       
     91        <!-- Show any documents or sub-groups in this group -->
     92        <xsl:if test="documentNode|classifierNode">
     93            <div id="div{@nodeID}" class="classifierContainer" style="display:block;">
     94                <xsl:apply-templates select="documentNode|classifierNode"/>
     95            </div>
     96        </xsl:if>
     97    </xsl:template>
     98   
     99    <xsl:template name="classifierLoadScript">
     100        <script type="text/javascript">
     101            <xsl:text disable-output-escaping="yes">
     102                var collapseImageURL = "</xsl:text><xsl:value-of select="util:getInterfaceText($interface_name, /page/@lang, 'collapse_image')"/><xsl:text disable-output-escaping="yes">";
     103                var expandImageURL = "</xsl:text><xsl:value-of select="util:getInterfaceText($interface_name, /page/@lang, 'expand_image')"/><xsl:text disable-output-escaping="yes">";
     104                var loadingImageURL = "</xsl:text><xsl:value-of select="util:getInterfaceText($interface_name, /page/@lang, 'loading_image')"/><xsl:text disable-output-escaping="yes">";
     105                var inProgress = new Array();
     106           
     107                function isExpanded(sectionID)
     108                {
     109                    var divElem = document.getElementById("div" + sectionID);
     110                    if(divElem.style.display == "block")
     111                    {
     112                        return true;
     113                    }
     114                    return false;
     115                }
     116           
     117                function toggleSection(sectionID)
     118                {
     119                    var section = document.getElementById("div" + sectionID);
     120                    var sectionToggle = document.getElementById("toggle" + sectionID);
     121                   
     122                    if(section)
     123                    {
     124                        if(isExpanded(sectionID))
     125                        {
     126                            section.style.display = "none";
     127                            sectionToggle.setAttribute("src", expandImageURL);
     128                        }
     129                        else
     130                        {
     131                            section.style.display = "block";
     132                            sectionToggle.setAttribute("src", collapseImageURL);
     133                        }
     134                    }
     135                    else
     136                    {
     137                        httpRequest(sectionID);
     138                    }
     139                }
     140               
     141                function httpRequest(sectionID)
     142                {
     143                    if(!inProgress[sectionID])
     144                    {
     145                        inProgress[sectionID] = true;
     146                        var httpRequest;
     147                        if (window.XMLHttpRequest) {
     148                            httpRequest = new XMLHttpRequest();
     149                        }
     150                        else if (window.ActiveXObject) {
     151                            httpRequest = new ActiveXObject("Microsoft.XMLHTTP");
     152                        }
     153                       
     154                        var sectionToggle = document.getElementById("toggle" + sectionID);
     155                        sectionToggle.setAttribute("src", loadingImageURL);
    81156
    82             <a>
    83                 <xsl:attribute name="href">
    84                     <xsl:value-of select="$library_name"/>?a=b&amp;rt=r&amp;s=<xsl:value-of select="/page/pageResponse/service/@name"/>&amp;c=<xsl:value-of select="/page/pageResponse/collection/@name"/>&amp;cl=<xsl:value-of select='@nodeID'/><xsl:if test="classifierNode|documentNode">.pr</xsl:if></xsl:attribute>
    85                 <xsl:value-of disable-output-escaping="yes"  select="metadataList/metadata[@name='Title']"/>
    86             </a>
     157                        var url = document.URL;
     158                        url = url.replace(/(&amp;|\?)cl=([a-z\.0-9]+)/gi, "$1cl=" + sectionID + "&amp;excerptid=div" + sectionID);
    87159
    88             <!-- show any documents or sub-groups in this group -->
    89             <xsl:if test="documentNode|classifierNode">
    90                 <ul>
    91                     <xsl:apply-templates select="documentNode|classifierNode"/>
    92                 </ul>
    93             </xsl:if>
    94         </li>
     160                        httpRequest.open('GET', url, true);
     161                        httpRequest.onreadystatechange = function()
     162                        {
     163                            if (httpRequest.readyState == 4)
     164                            {
     165                                if (httpRequest.status == 200)
     166                                {
     167                                    var newDiv = document.createElement("div");         
     168                                    var sibling = document.getElementById("title" + sectionID);
     169                                    var parent = sibling.parentNode;
     170                                   
     171                                    if(sibling.nextSibling)
     172                                    {
     173                                        parent.insertBefore(newDiv, sibling.nextSibling);
     174                                    }
     175                                    else
     176                                    {
     177                                        parent.appendChild(newDiv);
     178                                    }
    95179
     180                                    newDiv.innerHTML = httpRequest.responseText;
     181                                    sectionToggle.setAttribute("src", collapseImageURL);
     182                                }
     183                                else
     184                                {
     185                                    sectionToggle.setAttribute("src", expandImageURL);
     186                                }
     187                                inProgress[sectionID] = false;
     188                            }
     189                        }
     190                        httpRequest.send();
     191                    }
     192                }
     193            </xsl:text>
     194        </script>
    96195    </xsl:template>
    97196
Note: See TracChangeset for help on using the changeset viewer.