Changeset 25433


Ignore:
Timestamp:
2012-04-19T15:52:38+12:00 (12 years ago)
Author:
sjm84
Message:

Some major changes to the document page, mostly to do with changing the page so that it loads sections dynamically instead of all at once

File:
1 edited

Legend:

Unmodified
Added
Removed
  • main/trunk/greenstone3/web/interfaces/oran/transform/pages/document.xsl

    r25398 r25433  
    6262    <!-- If editing, be aware that the Document Basket looks for specific classes that this template bakes in (key points marked with ***) -->
    6363    <xsl:template name="wrapDocumentNodes">
    64         <xsl:for-each select="documentNode">
    65             <a name="{@nodeID}"><xsl:text> </xsl:text></a>
    66             <!-- Section header -->
    67             <table class="sectionHeader"><tr>
    68            
    69                 <!-- Expand/collapse button -->
    70                 <xsl:if test="not(/page/pageResponse/format[@type='display' or @type='browse' or @type='search']/gsf:option[@name='sectionExpandCollapse']/@value) or /page/pageResponse/format[@type='display' or @type='browse' or @type='search']/gsf:option[@name='sectionExpandCollapse']/@value = 'true'">
    71                     <td class="headerTD">
    72                         <img id="dtoggle{@nodeID}" onclick="toggleSection('{@nodeID}');" class="icon">         
    73                             <xsl:attribute name="src">
    74                                 <xsl:choose>
    75                                     <xsl:when test="/page/pageRequest/paramList/param[@name = 'ed']/@value = '1' or util:oidIsMatchOrParent(@nodeID, /page/pageResponse/document/@selectedNode)">
    76                                         <xsl:value-of select="util:getInterfaceText($interface_name, /page/@lang, 'collapse_image')"/>
    77                                     </xsl:when>
    78                                     <xsl:otherwise>
    79                                         <xsl:value-of select="util:getInterfaceText($interface_name, /page/@lang, 'expand_image')"/>
    80                                     </xsl:otherwise>
    81                                 </xsl:choose>
    82                             </xsl:attribute>
    83                         </img>
    84                     </td>
    85                 </xsl:if>
    86                
    87                 <!-- Title -->
    88                 <td id="header{@nodeID}" class="headerTD sectionTitle"><!-- *** -->
    89                     <!-- Get the title from the title sectionTitle template -->
    90                     <xsl:choose>
    91                         <xsl:when test="not(/page/pageRequest/paramList/param[@name = 'dmd']) or /page/pageRequest/paramList/param[@name = 'dmd']/@value = 'false'">
    92                             <xsl:apply-templates select="." mode="sectionTitleFormat"/>
    93                         </xsl:when>
    94                         <xsl:otherwise>
    95                             <xsl:apply-templates select="." mode="sectionTitle"/>
    96                         </xsl:otherwise>
    97                     </xsl:choose>
    98                 </td>
    99                
    100                 <!-- "back to top" link -->
    101                 <xsl:if test="util:hashToDepthClass(@nodeID) != 'sectionHeaderDepthTitle'">
    102                     <td class="backToTop headerTD">
    103                         <a href="javascript:scrollToTop();">
    104                             <xsl:text disable-output-escaping="yes">&#9650;</xsl:text><xsl:value-of select="util:getInterfaceText($interface_name, /page/@lang, 'doc.back_to_top')"/>
    105                         </a>
    106                     </td>
    107                 </xsl:if>
    108             </tr></table>
    109            
    110             <div id="doc{@nodeID}"><!-- *** -->
    111                 <xsl:choose>
    112                     <xsl:when test="/page/pageRequest/paramList/param[@name = 'ed']/@value = '1' or /page/pageResponse/document/@selectedNode = @nodeID">
    113                         <xsl:attribute name="class">
    114                             <xsl:text>sectionContainer hasText</xsl:text>
    115                         </xsl:attribute>
    116                         <xsl:attribute name="style">
    117                             <xsl:text>display:block;</xsl:text>
    118                         </xsl:attribute>
    119                     </xsl:when>
    120                     <xsl:when test="/page/pageRequest/paramList/param[@name = 'ed']/@value = '1' or util:oidIsMatchOrParent(@nodeID, /page/pageResponse/document/@selectedNode)">
    121                         <xsl:attribute name="class">
    122                             <xsl:text>sectionContainer noText</xsl:text>
    123                         </xsl:attribute>
    124                         <xsl:attribute name="style">
    125                             <xsl:text>display:block;</xsl:text>
    126                         </xsl:attribute>
    127                     </xsl:when>
    128                     <xsl:otherwise>
    129                         <xsl:attribute name="class">
    130                             <xsl:text>sectionContainer noText</xsl:text>
    131                         </xsl:attribute>
    132                         <xsl:attribute name="style">
    133                             <xsl:text>display:none;</xsl:text>
    134                         </xsl:attribute>
    135                     </xsl:otherwise>
    136                 </xsl:choose>
    137            
    138                 <xsl:if test="/page/pageRequest/userInformation and (util:contains(/page/pageRequest/userInformation/@groups, 'administrator') or util:contains(/page/pageRequest/userInformation/@groups, 'all-collections-editor') or util:contains(/page/pageRequest/userInformation/@groups, $thisCollectionEditor))">
    139                     <table id="meta{@nodeID}">
    140                         <xsl:attribute name="style">
     64        <a name="{@nodeID}"><xsl:text> </xsl:text></a>
     65        <!-- Section header -->
     66        <table class="sectionHeader"><tr>
     67       
     68            <!-- Expand/collapse button -->
     69            <xsl:if test="not(/page/pageResponse/format[@type='display' or @type='browse' or @type='search']/gsf:option[@name='sectionExpandCollapse']/@value) or /page/pageResponse/format[@type='display' or @type='browse' or @type='search']/gsf:option[@name='sectionExpandCollapse']/@value = 'true'">
     70                <td class="headerTD">
     71                    <img id="dtoggle{@nodeID}" onclick="toggleSection('{@nodeID}');" class="icon">         
     72                        <xsl:attribute name="src">
    14173                            <xsl:choose>
    142                                 <xsl:when test="/page/pageRequest/paramList/param[@name = 'dmd']/@value = 'true'">
    143                                     <xsl:text>display:block;</xsl:text>
     74                                <xsl:when test="/page/pageRequest/paramList/param[@name = 'ed']/@value = '1' or util:oidIsMatchOrParent(@nodeID, /page/pageResponse/document/@selectedNode)">
     75                                    <xsl:value-of select="util:getInterfaceText($interface_name, /page/@lang, 'collapse_image')"/>
    14476                                </xsl:when>
    14577                                <xsl:otherwise>
    146                                     <xsl:text>display:none;</xsl:text>
     78                                    <xsl:value-of select="util:getInterfaceText($interface_name, /page/@lang, 'expand_image')"/>
    14779                                </xsl:otherwise>
    14880                            </xsl:choose>
    14981                        </xsl:attribute>
    150                         <xsl:value-of select="util:clearMetadataStorage()"/>
    151                         <xsl:for-each select="metadataList/metadata">
    152                             <xsl:sort select="@name"/>
    153                             <xsl:if test="util:checkMetadataNotDuplicate(@name, .)">
    154                                 <tr>
    155                                     <td class="metaTableCellName"><xsl:value-of select="@name"/></td>
    156                                     <td class="metaTableCell"><xsl:value-of select="."/></td>
    157                                 </tr>
    158                             </xsl:if>
    159                         </xsl:for-each>
    160                     </table>
    161                 </xsl:if>
    162 
    163                 <gsf:variable name="screenImageWidth"><gsf:metadata name="ScreenWidth"/></gsf:variable>
    164                 <gsf:variable name="screenImageHeight"><gsf:metadata name="ScreenHeight"/></gsf:variable>
    165                 <gsf:variable name="imageWidth"><gsf:metadata name="ImageWidth"/></gsf:variable>
    166                 <gsf:variable name="imageHeight"><gsf:metadata name="ImageHeight"/></gsf:variable>
    167 
     82                    </img>
     83                </td>
     84            </xsl:if>
     85           
     86            <!-- Title -->
     87            <td id="header{@nodeID}" class="headerTD sectionTitle"><!-- *** -->
     88                <!-- Get the title from the title sectionTitle template -->
    16889                <xsl:choose>
    169                     <xsl:when test="metadataList/metadata[@name = 'Screen'] and metadataList/metadata[@name = 'Source']">
    170                         <div id="wrap{util:replace(@nodeID, '.', '_')}" class="zoomImage" style="position:relative; width: {$screenImageWidth}px; height: {$screenImageHeight}px;">
    171                             <div id="small{util:replace(@nodeID, '.', '_')}" style="position:relative; width: {$screenImageWidth}px; height: {$screenImageHeight}px;">
    172                                 <gsf:image type="screen"/>
    173                             </div>
    174                             <div id="mover{util:replace(@nodeID, '.', '_')}" style="border: 1px solid green; position: absolute; top: 0; left: 0; width: 198px; height: 198px; overflow: hidden; z-index: 100; background: white; display: none;">
    175                                 <div id="overlay{util:replace(@nodeID, '.', '_')}" style="width: 200px; height: 200px; position: absolute; top: 0; left: 0; z-index: 200;">
    176                                     <xsl:text> </xsl:text>
    177                                 </div>
    178                                 <div id="large{util:replace(@nodeID, '.', '_')}" style="position: relative;">
    179                                     <gsf:image type="source"/>
    180                                 </div>
    181                             </div>
    182                         </div>
    183                         <script type="text/javascript">
    184                             <xsl:text disable-output-escaping="yes">
    185                                 $(window).load(function()
    186                                 {
    187                                     var nodeID = "</xsl:text><xsl:value-of select="@nodeID"/><xsl:text disable-output-escaping="yes">";
    188                                     var bigHeight = </xsl:text><xsl:value-of select="$imageHeight"/><xsl:text disable-output-escaping="yes">;
    189                                     var smallHeight = </xsl:text><xsl:value-of select="$screenImageHeight"/><xsl:text disable-output-escaping="yes">;
    190                                    
    191                                     nodeID = nodeID.replace(/\./g, "_");
    192                                     var multiplier = bigHeight / smallHeight;
    193 
    194                                     $("#wrap" + nodeID).anythingZoomer({
    195                                         smallArea: "#small" + nodeID,
    196                                         largeArea: "#large" + nodeID,
    197                                         zoomPort: "#overlay" + nodeID,
    198                                         mover: "#mover" + nodeID,
    199                                         expansionSize:50, 
    200                                         speedMultiplier:multiplier   
    201                                     });
    202                                 });
    203                             </xsl:text>
    204                         </script>
     90                    <xsl:when test="not(/page/pageRequest/paramList/param[@name = 'dmd']) or /page/pageRequest/paramList/param[@name = 'dmd']/@value = 'false'">
     91                        <xsl:apply-templates select="." mode="sectionTitleFormat"/>
    20592                    </xsl:when>
    206                     <xsl:when test="metadataList/metadata[@name = 'Screen']">
    207                         <div id="image{@nodeID}">
    208                             <xsl:attribute name="style">
    209                                 <xsl:choose>
    210                                     <xsl:when test="/page/pageRequest/paramList/param[@name = 'view']/@value = 'text'">
    211                                         <xsl:text>display:none;</xsl:text>
    212                                     </xsl:when>
    213                                     <xsl:otherwise>
    214                                         <xsl:text>display:block;</xsl:text>
    215                                     </xsl:otherwise>
    216                                 </xsl:choose>
    217                             </xsl:attribute>
    218                             <gsf:image type="screen"/>
    219                         </div>
    220                     </xsl:when>
     93                    <xsl:otherwise>
     94                        <xsl:apply-templates select="." mode="sectionTitle"/>
     95                    </xsl:otherwise>
    22196                </xsl:choose>
    222                 <div id="text{@nodeID}" class="sectionText"><!-- *** -->
     97            </td>
     98           
     99            <!-- "back to top" link -->
     100            <xsl:if test="util:hashToDepthClass(@nodeID) != 'sectionHeaderDepthTitle'">
     101                <td class="backToTop headerTD">
     102                    <a href="javascript:scrollToTop();">
     103                        <xsl:text disable-output-escaping="yes">&#9650;</xsl:text><xsl:value-of select="util:getInterfaceText($interface_name, /page/@lang, 'doc.back_to_top')"/>
     104                    </a>
     105                </td>
     106            </xsl:if>
     107        </tr></table>
     108       
     109        <div id="doc{@nodeID}"><!-- *** -->
     110            <xsl:choose>
     111                <xsl:when test="/page/pageRequest/paramList/param[@name = 'ed']/@value = '1' or /page/pageResponse/document/@selectedNode = @nodeID">
     112                    <xsl:attribute name="class">
     113                        <xsl:text>sectionContainer hasText</xsl:text>
     114                    </xsl:attribute>
     115                    <xsl:attribute name="style">
     116                        <xsl:text>display:block;</xsl:text>
     117                    </xsl:attribute>
     118                </xsl:when>
     119                <xsl:when test="/page/pageRequest/paramList/param[@name = 'ed']/@value = '1' or util:oidIsMatchOrParent(@nodeID, /page/pageResponse/document/@selectedNode)">
     120                    <xsl:attribute name="class">
     121                        <xsl:text>sectionContainer noText</xsl:text>
     122                    </xsl:attribute>
     123                    <xsl:attribute name="style">
     124                        <xsl:text>display:block;</xsl:text>
     125                    </xsl:attribute>
     126                </xsl:when>
     127                <xsl:otherwise>
     128                    <xsl:attribute name="class">
     129                        <xsl:text>sectionContainer noText</xsl:text>
     130                    </xsl:attribute>
     131                    <xsl:attribute name="style">
     132                        <xsl:text>display:none;</xsl:text>
     133                    </xsl:attribute>
     134                </xsl:otherwise>
     135            </xsl:choose>
     136       
     137            <xsl:if test="/page/pageRequest/userInformation and (util:contains(/page/pageRequest/userInformation/@groups, 'administrator') or util:contains(/page/pageRequest/userInformation/@groups, 'all-collections-editor') or util:contains(/page/pageRequest/userInformation/@groups, $thisCollectionEditor))">
     138                <table id="meta{@nodeID}">
    223139                    <xsl:attribute name="style">
    224140                        <xsl:choose>
    225                             <xsl:when test="/page/pageRequest/paramList/param[@name = 'view']/@value = 'image'">
    226                                 <xsl:text>display:none;</xsl:text>
     141                            <xsl:when test="/page/pageRequest/paramList/param[@name = 'dmd']/@value = 'true'">
     142                                <xsl:text>display:block;</xsl:text>
    227143                            </xsl:when>
    228144                            <xsl:otherwise>
    229                                 <xsl:text>display:block;</xsl:text>
     145                                <xsl:text>display:none;</xsl:text>
    230146                            </xsl:otherwise>
    231147                        </xsl:choose>
    232148                    </xsl:attribute>
    233                     <!-- Get the section content from the document template -->
    234                     <xsl:apply-templates select="." mode="document"/>
    235                 </div>
    236                 <xsl:if test="documentNode">
     149                    <xsl:value-of select="util:clearMetadataStorage()"/>
     150                    <xsl:for-each select="metadataList/metadata">
     151                        <xsl:sort select="@name"/>
     152                        <xsl:if test="util:checkMetadataNotDuplicate(@name, .)">
     153                            <tr>
     154                                <td class="metaTableCellName"><xsl:value-of select="@name"/></td>
     155                                <td class="metaTableCell"><xsl:value-of select="."/></td>
     156                            </tr>
     157                        </xsl:if>
     158                    </xsl:for-each>
     159                </table>
     160            </xsl:if>
     161           
     162            <xsl:for-each select=".">
     163                <xsl:call-template name="sectionImage"/>
     164            </xsl:for-each>
     165           
     166            <div id="text{@nodeID}" class="sectionText"><!-- *** -->
     167                <xsl:attribute name="style">
     168                    <xsl:choose>
     169                        <xsl:when test="/page/pageRequest/paramList/param[@name = 'view']/@value = 'image'">
     170                            <xsl:text>display:none;</xsl:text>
     171                        </xsl:when>
     172                        <xsl:otherwise>
     173                            <xsl:text>display:block;</xsl:text>
     174                        </xsl:otherwise>
     175                    </xsl:choose>
     176                </xsl:attribute>
     177                <!-- Get the section content from the document template -->
     178                <xsl:apply-templates select="." mode="document"/>
     179            </div>
     180            <xsl:if test="documentNode">
     181                <xsl:for-each select="documentNode">
    237182                    <xsl:call-template name="wrapDocumentNodes"/>
    238                 </xsl:if>
    239             </div> 
    240         </xsl:for-each>
     183                </xsl:for-each>
     184            </xsl:if>
     185        </div> 
    241186    </xsl:template>
    242187
     
    305250                            <xsl:call-template name="documentPre"/>
    306251                            <div id="gs-document-text" class="documenttext" collection="{/page/pageResponse/collection/@name}"><!-- *** -->
    307                                 <xsl:call-template name="wrapDocumentNodes"/>
     252                                <xsl:for-each select="documentNode">
     253                                    <xsl:call-template name="wrapDocumentNodes"/>
     254                                </xsl:for-each>
    308255                            </div>
    309256                        </div>
     
    321268                                    loadTopLevelPage(function()
    322269                                    {
    323                                         focusSection("</xsl:text><xsl:value-of select="/page/pageResponse/document/@selectedNode"/><xsl:text disable-output-escaping="yes">");
     270                                        //Don't focus the section until the table of contents is loaded
     271                                        var tocCheck = function()
     272                                        {
     273                                            if(gs.variables.tocLoaded)
     274                                            {
     275                                                focusSection("</xsl:text><xsl:value-of select="/page/pageResponse/document/@selectedNode"/><xsl:text disable-output-escaping="yes">");
     276                                            }
     277                                            else
     278                                            {
     279                                                setTimeout(tocCheck, 500);
     280                                            }
     281                                        }
     282                                        tocCheck();
    324283                                    });
    325                                     console.log("HASH IS " + gs.functions.hashString("" + (new Date()).getTime()) + " ON " + (new Date()).getTime());
    326284                                });
    327285                            </xsl:text>
     
    375333                    <!-- the contents (if enabled) -->
    376334                    <xsl:choose>
    377                         <xsl:when test="/page/pageResponse/document/@docType = 'paged'">
     335                        <xsl:when test="/page/pageResponse/document/documentNode/@docType = 'paged'">
     336                            <gsf:image type="Thumb"/>
    378337                            <!-- Table of contents will be dynamically retrieved when viewing a paged document -->
    379338                            <script type="text/javascript">
     
    385344                                </xsl:text>
    386345                            </script>
     346                            <div id="tableOfContents"><xsl:text> </xsl:text></div>
    387347                            <div id="tocLoadingImage" style="text-align:center;">
    388348                                <img src="{util:getInterfaceText($interface_name, /page/@lang, 'loading_image')}"/><xsl:value-of select="util:getInterfaceText($interface_name, /page/@lang, 'doc.loading')"/><xsl:text>...</xsl:text>
    389349                            </div>
     350                            <table style="width:100%;"><tbody><tr>
     351                                <td><xsl:value-of select="util:getInterfaceText($interface_name, /page/@lang, 'doc.filter_pages')"/><xsl:text>: </xsl:text><input id="filterText" type="text" size="27"/></td>
     352                            </tr></tbody></table>
    390353                        </xsl:when>
    391354                        <xsl:when test="not(/page/pageRequest/paramList/param[@name = 'ed']/@value = '1')">
     
    413376                                </xsl:attribute>
    414377                                <xsl:apply-templates select="documentNode" mode="TOC"/>
    415                                 <xsl:if test="@docType = 'paged'">
    416                                     <table style="width:100%;"><tbody><tr>
    417                                         <td><xsl:value-of select="util:getInterfaceText($interface_name, /page/@lang, 'doc.filter_pages')"/><xsl:text>: </xsl:text><input id="filterText" type="text" size="27"/></td>
    418                                     </tr></tbody></table>
    419                                 </xsl:if>
    420378                            </div>
    421379                        </xsl:otherwise>
     
    458416    </xsl:template>
    459417   
     418    <xsl:template name="sectionImage">
     419        <gsf:variable name="screenImageWidth"><gsf:metadata name="ScreenWidth"/></gsf:variable>
     420        <gsf:variable name="screenImageHeight"><gsf:metadata name="ScreenHeight"/></gsf:variable>
     421        <gsf:variable name="imageWidth"><gsf:metadata name="ImageWidth"/></gsf:variable>
     422        <gsf:variable name="imageHeight"><gsf:metadata name="ImageHeight"/></gsf:variable>
     423
     424        <xsl:choose>
     425            <xsl:when test="metadataList/metadata[@name = 'Screen'] and metadataList/metadata[@name = 'Source']">
     426                <div id="wrap{util:replace(@nodeID, '.', '_')}" class="zoomImage" style="position:relative; width: {$screenImageWidth}px; height: {$screenImageHeight}px;">
     427                    <div id="small{util:replace(@nodeID, '.', '_')}" style="position:relative; width: {$screenImageWidth}px; height: {$screenImageHeight}px;">
     428                        <gsf:image type="screen"/>
     429                    </div>
     430                    <div id="mover{util:replace(@nodeID, '.', '_')}" style="border: 1px solid green; position: absolute; top: 0; left: 0; width: 198px; height: 198px; overflow: hidden; z-index: 100; background: white; display: none;">
     431                        <div id="overlay{util:replace(@nodeID, '.', '_')}" style="width: 200px; height: 200px; position: absolute; top: 0; left: 0; z-index: 200;">
     432                            <xsl:text> </xsl:text>
     433                        </div>
     434                        <div id="large{util:replace(@nodeID, '.', '_')}" style="position: relative;">
     435                            <gsf:image type="source"/>
     436                        </div>
     437                    </div>
     438                </div>
     439                <script type="text/javascript">
     440                    <xsl:text disable-output-escaping="yes">
     441                        $(window).load(function()
     442                        {
     443                            var nodeID = "</xsl:text><xsl:value-of select="@nodeID"/><xsl:text disable-output-escaping="yes">";
     444                            var bigHeight = </xsl:text><xsl:value-of select="$imageHeight"/><xsl:text disable-output-escaping="yes">;
     445                            var smallHeight = </xsl:text><xsl:value-of select="$screenImageHeight"/><xsl:text disable-output-escaping="yes">;
     446                           
     447                            nodeID = nodeID.replace(/\./g, "_");
     448                            var multiplier = bigHeight / smallHeight;
     449
     450                            $("#wrap" + nodeID).anythingZoomer({
     451                                smallArea: "#small" + nodeID,
     452                                largeArea: "#large" + nodeID,
     453                                zoomPort: "#overlay" + nodeID,
     454                                mover: "#mover" + nodeID,
     455                                expansionSize:50, 
     456                                speedMultiplier:multiplier   
     457                            });
     458                        });
     459                    </xsl:text>
     460                </script>
     461            </xsl:when>
     462            <xsl:when test="metadataList/metadata[@name = 'Screen']">
     463                <div id="image{@nodeID}">
     464                    <xsl:attribute name="style">
     465                        <xsl:choose>
     466                            <xsl:when test="/page/pageRequest/paramList/param[@name = 'view']/@value = 'text'">
     467                                <xsl:text>display:none;</xsl:text>
     468                            </xsl:when>
     469                            <xsl:otherwise>
     470                                <xsl:text>display:block;</xsl:text>
     471                            </xsl:otherwise>
     472                        </xsl:choose>
     473                    </xsl:attribute>
     474                    <gsf:image type="screen"/>
     475                </div>
     476            </xsl:when>
     477        </xsl:choose>
     478    </xsl:template>
     479   
    460480    <!-- The default template for displaying the document content -->
    461481    <xsl:template match="documentNode" mode="document">
     482        <!-- Hides the "This document has no text." message -->
     483        <xsl:variable name="noText"><gsf:metadata name="NoText"/></xsl:variable>
     484
    462485        <!-- Section text -->
    463486        <xsl:for-each select="nodeContent">
     
    465488                <xsl:choose>
    466489                    <xsl:when test="not(name())">
    467                         <xsl:value-of select="." disable-output-escaping="yes"/>
     490                        <xsl:if test="not($noText = '1')">
     491                            <xsl:value-of select="." disable-output-escaping="yes"/>
     492                        </xsl:if>
    468493                    </xsl:when>
    469494                    <xsl:otherwise>
     
    617642       
    618643            <!-- Paged-image options -->
    619             <xsl:if test="count(//documentNode/metadataList/metadata[@name = 'Screen']) > 0 or /page/pageRequest/paramList/param[@name = 'dt']/@value = 'paged'">
     644            <xsl:if test="count(//documentNode/metadataList/metadata[@name = 'Screen']) > 0 or /page/pageResponse/document/documentNode/@docType = 'paged'">
    620645                <td>
    621646                    <select id="viewSelection" onchange="changeView();">
Note: See TracChangeset for help on using the changeset viewer.