﻿<?xml version="1.0" encoding="utf-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
    xmlns:msxsl="urn:schemas-microsoft-com:xslt" exclude-result-prefixes="msxsl">
	<xsl:output method="xml" indent="yes" omit-xml-declaration="yes"/>

	<xsl:template match="/">
		<xsl:variable name="Sync" select="AjaxRequest/Sync/."></xsl:variable>
		<xsl:variable name="FolderItemID" select="AjaxRequest/Params/FolderItemID"></xsl:variable>
		<xsl:call-template name="ResourceSyncProgress">
			<xsl:with-param name="Sync" select="$Sync"></xsl:with-param>
			<xsl:with-param name="FolderItemID" select="$FolderItemID"></xsl:with-param>
		</xsl:call-template>
	</xsl:template>

	<xsl:template name="ResourceSyncProgress">
		<xsl:param name="Sync" select="'N/A'"></xsl:param>
		<xsl:param name="FolderItemID" select="'N/A'"></xsl:param>
		<xsl:choose>
			<xsl:when test="$Sync/Status/PendingFiles &gt; 0">
				<div class="tpdiv">
           <div class="tooltipdrpBox">
              <!--<xsl:value-of select="$Sync/Status/PendingFiles"/>  Files of <xsl:value-of select="$Sync/Status/TotalFiles"/> Files Pending-->
             <xsl:value-of select="$Sync/Status/PendingFiles"/> Files remaining... 
             <ul class="tooltiptext">
                  <li>
                    <xsl:value-of select="$Sync/Status/PendingFiles"/> New Files</li>
                  </ul>
          </div>
					<input id="btnDropBoxSync" type="button" value="Sync"   class="form-control nwbtns"
						   onClick="dropboxSyncInitiate({$FolderItemID}, {$Sync/Status/APIRequestID}, ''); document.getElementById('imgDropboxSyncProgress').style.display='block';"></input>
          <span class="nwspan">
            <xsl:variable name="t1" select="$Sync/Status/PendingFiles"></xsl:variable>
            <xsl:variable name="t2" select="$Sync/Status/TotalFiles"></xsl:variable>
            <xsl:variable name="t3" select="$t2 - $t1"></xsl:variable>
	          <input type="hidden" value="{$t1}" id="resourcesPending"></input>

            <xsl:variable name="CompletePercentage" >
              <xsl:value-of select="($t3 div $t2) * 100"/>
            </xsl:variable>
            
          <!--  <div class="progress">
              <div class="progress-bar" role="progressbar" aria-valuenow="70"
              aria-valuemin="0" aria-valuemax="100" style="width:70%">
                <span class="sr-only">70% Complete</span>
              </div>
            </div>
            -->
            <div id="progressBar" class="progress progrssup">
              <div class="progress-bar" role="progressbar" aria-valuenow="{$CompletePercentage}"
                 aria-valuemax="100"  style="width:{$CompletePercentage}%">      
                <span style="color:#000;">
                <xsl:value-of select="round($CompletePercentage)"/>%               
                </span>                  
            </div>
            </div>
            <div id="loadingprocessing" style="display:None" >
              <img id="loadingprocessing" src="image/processing-small.gif"></img>
            </div>
          </span>
          <div class="widcomp">
          <input id="btnCancelDropBoxSync" type="button" class="form-control" value="Cancel" style="float:left;width:auto;display:inline;margin-right:2%;"
          onClick="dropboxCancelSync({$FolderItemID}, {$Sync/Status/APIRequestID}, ''); document.getElementById('imgDropboxSyncProgress').style.display='';"></input>
         
          
					<input id="btnDropBoxSyncProgressRef" type="button" value="Refresh" class="form-control" style="float:left;width:auto;display:inline;"
						   onClick="dropboxSyncProgressUpdate({$FolderItemID}, {$Sync/Status/APIRequestID}, 'divResourceSyncProgress');"></input>
          </div>
          <img id="imgDropboxSyncProgress" src="image/progress.gif" width="28px"  height="28px" style="display:None"></img>
          
        </div>
       
			</xsl:when>
      <xsl:otherwise>
        <script>
          <!--<xsl:choose>
            <xsl:when test="$Sync/Status/PendingFiles &lt; 1">-->
          var divid = "BreadcrumFolder_" + <xsl:value-of select="round($FolderItemID)"/>;

          var evt = document.createEvent("HTMLEvents");
          evt.initEvent("click", true, true);
          document.getElementById(divid).dispatchEvent(evt);

          <!--</xsl:when>
          </xsl:choose>-->
        </script>
      </xsl:otherwise>
		</xsl:choose>
   
	</xsl:template>
</xsl:stylesheet>
