source: main/trunk/model-sites-dev/heritage-nz/collect/reports-2019/transform/pages/classifier.xsl@ 33021

<?xml version="1.0" encoding="ISO-8859-1"?>
<xsl:stylesheet version="1.0"
        xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
        xmlns:java="http://xml.apache.org/xslt/java"
        xmlns:util="xalan://org.greenstone.gsdl3.util.XSLTUtil"
        xmlns:gslib="http://www.greenstone.org/skinning"
        xmlns:gsf="http://www.greenstone.org/greenstone3/schema/ConfigFormat"
        extension-element-prefixes="java util"
        exclude-result-prefixes="java util gsf">
  

  <xsl:template match="classifier">
    <xsl:param name="collName"/>
    <xsl:param name="serviceName"/>
    <div id="classifiers">
      <xsl:variable name="cl_name"><xsl:value-of select="@name"/></xsl:variable>
      <xsl:choose>
    <xsl:when test="@childType = 'HList'">
      <xsl:call-template name="HList">
        <xsl:with-param name='collName' select='$collName'/>
        <xsl:with-param name='serviceName' select='$serviceName'/>
      </xsl:call-template>
    </xsl:when>
    <xsl:otherwise>
      <div style="position: relative">
        <xsl:if test="$cl_name = 'CL4'">          
          <!--
          width="1380.2666"
          height="1746.2094"
          -->
          
          <iframe src="sites/{$site_name}/collect/{$collName}/iframe/nz-territorial-authorities-v06.svg"
              style="float:right; positionXX: absolute; width: 345px; height: 436px; border: none; ">
        <gsf:comment>filler</gsf:comment>
          </iframe>
        </xsl:if>       
        <table id="classifiernodelist">
          <xsl:text> </xsl:text>
          <xsl:call-template name="processNodeChildren">
        <xsl:with-param name='collName' select='$collName'/>
        <xsl:with-param name='serviceName' select='$serviceName'/>
          </xsl:call-template>
        </table>
      </div>
    </xsl:otherwise>
      </xsl:choose>
    </div>
  </xsl:template>
  


  <xsl:template name="HList">
    <xsl:param name="collName"/>
    <xsl:param name="serviceName"/>
    <xsl:variable name="selectedNode"><xsl:value-of select="/page/pageRequest/paramList/param[@name = 'cl']/@value"/></xsl:variable>
    <xsl:variable name="cl_name"><xsl:value-of select="@name"/></xsl:variable>

    <ul class="horizontalContainer">
      <xsl:for-each select='classifierNode'>
    <li>
      <xsl:attribute name="class">
        <xsl:if test="starts-with($selectedNode, @nodeID) or (not(contains($selectedNode, '.')) and @nodeID = concat($selectedNode, '.1'))">selectedHorizontalClassifierNode </xsl:if>
        <xsl:text>horizontalClassifierNode</xsl:text>
      </xsl:attribute>
      <xsl:apply-templates select='.'>
        <xsl:with-param name='collName' select='$collName'/>
        <xsl:with-param name='serviceName' select='$serviceName'/>
      </xsl:apply-templates>
    </li>
      </xsl:for-each>
    </ul>
    <xsl:choose>
      <!-- if the children are HLists-->
      <xsl:when test="classifierNode[@childType = 'HList']">
    <xsl:for-each select='classifierNode'><!-- there should be only one-->
      <xsl:call-template name="HList">
        <xsl:with-param name='collName' select='$collName'/>
        <xsl:with-param name='serviceName' select='$serviceName'/>
      </xsl:call-template>
    </xsl:for-each>
    </xsl:when>
    <xsl:otherwise>
      <div style="position: relative">
        <xsl:if test="$cl_name = 'CL4'">          

<!--
          <ul>

        <li id="zoomOptions" style="display:none;">
          <xsl:attribute name="title"><xsl:value-of select="util:getInterfaceText($interface_name, /page/@lang, 'doc.zoomTooltip')"/></xsl:attribute>
          <img id="zoomToggleImage">
            <xsl:attribute name="src"><xsl:value-of select="util:getInterfaceText($interface_name, /page/@lang, 'zoom_image')"/></xsl:attribute>
          </img>
          <input id="zoomToggle" type="checkbox"/>
          <script type="text/javascript">
            <xsl:text disable-output-escaping="yes">

              $("#zoomToggle").change(function()
              {
                _imageZoomEnabled = $("#zoomToggle").prop("checked");
            if (_imageZoomEnabled) {
              $('#moverHASH').css("display","block");
            }
              });
              
              $("#zoomToggleImage").click(function()
              {
                $("#zoomToggle").prop("checked", !$("#zoomToggle").prop("checked"));
                _imageZoomEnabled = $("#zoomToggle").prop("checked");
              });
            </xsl:text>
          </script>
        </li>
          </ul>

-->
          <!--
          width="1380.2666"
          height="1746.2094"
          -->
<!--
          <iframe src="sites/{$site_name}/collect/{$collName}/iframe/nz-territorial-authorities-v06.svg"
              style="float:right; positionXX: absolute; width: 483px; height: 610px; border: none; ">
        <gsf:comment>filler</gsf:comment>
          </iframe>
-->



<div>
              <div class="zoomImage" id="wrapHASH" style="float: right; position:relative; width: 483px; height: 610px;">
        <div id="smallHASH" style="position: relative; width: 483px; height: 610px;">
          <iframe src="sites/{$site_name}/collect/{$collName}/iframe/nz-territorial-authorities-v06.svg"
              style="floatXX:right; positionXXXX: absolute; width: 483px; height: 610px; border: none; ">
            <xsl:comment>filler</xsl:comment>
          </iframe>
        </div>  
        <div id="moverHASH" style="border: 1px solid #820404; position: absolute; top: -61.7667px; left: -20.5px; width: 498px; height: 498px; overflow: hidden; z-index: 100; background: #f5f3e5; none repeat scroll 0% 0%; display: none;">
                  <div id="overlayHASH" style="width: 500px; height: 500px; position: absolute; top: 0; left: 0; z-index: 200;"> 
            <xsl:comment>filler</xsl:comment> 
          </div>
          
                  <div id="largeHASH" style="position: relative; width: 1380px; height:1744px; left: 600px; top: 100px; leftXX: -57.48px; topXX: -4.65867px;">

            <iframe id="largeHASH-iframe" src="sites/{$site_name}/collect/{$collName}/iframe/nz-territorial-authorities-v06-large.svg"
                style="floatXX:right; positionXXXX: absolute; width: 1380px; height: 1744px; border: none; ">
              <xsl:comment>filler</xsl:comment>
            </iframe>
                  </div>
        </div>
          </div>

        <script type="text/javascript">
          <xsl:text disable-output-escaping="yes">
          //{
          //var bigHeight = 690;
          //var smallHeight = 436;

          var multiplier = 2;

          var aZoomer = $("#wrapHASH").anythingZoomer({
            smallArea: "#smallHASH",
            largeArea: "#largeHASH",
            zoomPort: "#overlayHASH",
            mover: "#moverHASH",
            expansionSize:50,  
            speedMultiplier:3
          });

          $("#zoomOptions input").prop("checked", false);
          $("#zoomOptions").css("display", "");
          //}

          _imageZoomEnabled = true;

          aZoomer.mouseenter(function (e) { 
         $('#moverHASH').css("display","block");
             //console.log("**** mouseenter: pageX = " + e.pageX + "," + "PageY = " + e.pageY); 
             $(aZoomer).trigger('mousemove',[e.pageX, e.pageY]); 

         //mme = $.Event('mousemove');
         //mme.pageX = e.pageX;
         //mme.pageY = e.pageY;

         //$(document).trigger(e);
         //$('#moverHASH').fadeIn(); 
          } );
          //aZoomer.mouseout(function (e) { console.log("Mouse out") } );
                
                   

          </xsl:text>
        </script>

</div>
        </xsl:if>
        
        <table id="classifiernodelist">
          <xsl:for-each select='classifierNode'>
        <xsl:call-template name="processNodeChildren">
          <xsl:with-param name='collName' select='$collName'/>
          <xsl:with-param name='serviceName' select='$serviceName'/>
        </xsl:call-template>
          </xsl:for-each>
        </table>
      </div>
    </xsl:otherwise>
    </xsl:choose>
  </xsl:template>   


</xsl:stylesheet>