<!--
Licensed to the Apache Software Foundation (ASF) under one or more
contributor license agreements.  See the NOTICE file distributed with
this work for additional information regarding copyright ownership.
The ASF licenses this file to You under the Apache License, Version 2.0
(the "License"); you may not use this file except in compliance with
the License.  You may obtain a copy of the License at

http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
-->
<div id="replication" class="clearfix" ng-class="{replicating:settings.isReplicating}">

  <div id="frame">

    <div id="error" ng-show="progress.ERROR">{{ progress.ERROR }}</div>

    <div class="replicating block" ng-show="settings.isReplicating">

      <div id="progress">

        <div id="start"><div class="info">

          <span>{{progress.replicationStartTime}}</span>
                
        </div></div>

        <div id="speed"><div class="info">

          <span>5.1 MB</span>/s
                
        </div></div>

        <div id="bar">

          <div id="bar-info"><div class="info">

              <div class="files"><span>{{progress.numFilesToDownload}}</span> File<span ng-show="progress.numFilesToDownload&gt;1">s</span></div>
              <div class="size"><span>{{progress.bytesToDownload}}</span></div>

          </div></div>

          <div id="eta"><div class="info">

            ETA: <span>{{progress.timeRemaining | readableSeconds }}</span>
                    
          </div></div>

          <div id="done" style="width: {{progress.totalPercentWidth}}">

            <div class="percent">

              <span>{{progress.totalPercent}}</span>%

            </div>

            <div id="done-info"><div class="info">

              <div class="files"><span>{{progress.numFilesDownloaded}}</span> File<span ng-show="progress.numFilesDownloaded&gt;1">s</span></div>
              <div class="size"><span>{{progress.bytesDownloaded}}</span></div>

            </div></div>

          </div>

        </div>

      </div>

      <div id="current-file" class="clearfix">

        <div class="label"><span class="loader">Current File:</span></div>
        <div class="file">{{progress.currentFile}}</div>
        <div class="progress">
          <span class="done">{{progress.currentFileSizeDownloaded}}</span> / <span class="total">{{progress.currentFileSize}}</span> [<span class="percent">{{progress.currentFileSizePercent}}</span>%]
        </div>

      </div>
        
    </div>

    <div id="iterations" class="slaveOnly block clearfix" ng-show="isSlave">

      <div class="label"><span class="">Iterations:</span></div>
      <div class="iterations" ng-show="iterations && showIterations">
        <ul>
            <li class="{{iteration.status}}" ng-class="{latest:iteration.latest}" ng-repeat="iteration in iterations |limitTo:iterationCount">{{iteration.date}}</li>
        </ul>
        <span ng-show="iterations.length&gt;1">
          <a ng-show="iterationCount==1" ng-click="showIterations()"><span class="expand">Show all Iterations</span></a>
          <a ng-show="iterationCount&gt;1" ng-click="hideIterations()"><span class="collapse">Hide past Iterations</span></a>
        </span>

      </div>
        
    </div>

    <div id="details" class="block clearfix">

      <table border="0" cellspacing="0" cellpadding="0">

        <thead>

          <tr>
                        
            <td><span>Index</span></td>
            <th>Version</th>
            <th><abbr title="Generation">Gen</abbr></th>
            <th>Size</th>
                    
          </tr>
                
        </thead>
        <tbody>

          <tr class="masterSearch">

            <th>Master (Searching)</th>
            <td class="version" ng-class="{diff:versions.changedVersion}">
                <div>{{versions.masterSearch.version}}</div>
            </td>
            <td class="generation" ng-class="{diff:versions.changedGeneration}">
                <div>{{versions.masterSearch.generation}}</div>
            </td>
            <td class="size">
                <div>{{versions.masterSearch.size}}</div>
            </td>

          </tr>

          <tr class="master">

            <th>Master (Replicable)</th>
            <td class="version" ng-class="{diff:versions.changedVersion}">
                <div>{{versions.master.version}}</div>
            </td>
            <td class="generation" ng-class="{diff:versions.changedGeneration}">
                <div>{{versions.master.generation}}</div>
            </td>
            <td class="size">
                <div>{{versions.master.size}}</div>
            </td>

          </tr>

          <tr class="slave slaveOnly" ng-show="isSlave">

            <th>Slave (Searching)</th>
            <td class="version" ng-class="{diff:versions.changedVersion}">
                <div>{{versions.slave.version}}</div>
            </td>
            <td class="generation" ng-class="{diff:versions.changedGeneration}">
                <div>{{versions.slave.generation}}</div>
            </td>
            <td class="size">
                <div>{{versions.slave.size}}</div>
            </td>

          </tr>

        </tbody>

      </table>

    </div>

    <div id="settings" class="settings block clearfix slaveOnly" ng-show="isSlave">

      <div class="label"><span>Settings:</span></div>
      <ul>
        <li class="masterUrl" ng-show="settings.masterUrl">
            <dl class="clearfix">
                <dt>master url:</dt>
                <dd>{{settings.masterUrl}}</dd>
            </dl>
        </li>
        <li class="isPollingDisabled"><dl class="clearfix">
          <dt>polling enable:</dt>
            <dd class="ico" ng-class="{'ico-0':settings.isPollingDisabled, 'ico-1':!settings.isPollingDisabled}">
                <span ng-show="settings.pollInterval">(interval: {{settings.pollInterval}})</span>&nbsp;
            </dd>
        </dl></li>
      </ul>
        
    </div>

    <div id="master-settings" class="settings block clearfix">

      <div class="label"><span>Settings (Master):</span></div>
      <ul>
        <li class="replicationEnabled"><dl class="clearfix">
          <dt>replication enable:</dt>
            <dd class="ico" ng-class="{'ico-0':!master.replicationEnabled, 'ico-1':master.replicationEnabled}">&nbsp;</dd>
        </dl></li>
        <li class="replicateAfter"><dl class="clearfix">
          <dt>replicateAfter:</dt>
            <dd>{{master.replicateAfter}}</dd>
        </dl></li>
        <li class="confFiles" ng-show="master.files"><dl class="clearfix">
          <dt>confFiles:</dt>
            <dd><span ng-repeat="file in master.files"><attr title="{{file.title}}">{{file.name}}</attr>{{ $last ? '' :', '}}</span></dd>
        </dl></li>
      </ul>
        
    </div>
    
  </div>

  <div id="navigation">

    <div class="timer" ng-show="isSlave && !settings.isPollingDisabled &&!settings.isReplicating">

      <p>Next Run: <span class="approx" ng-show="settings.isApprox">~</span><span class="tick">{{settings.tick | readableSeconds}}</span></p>
      <small ng-show="settings.nextExecutionAt">{{settings.nextExecutionAt}}</small>
    </div>

    <button class="refresh-status" ng-click="refresh()"><span>Refresh Status</span></button>

    <div class="slaveOnly" ng-show="isSlave">
      <button class="optional replicate-now primary" ng-click="execute('fetchindex')" ng-show="!settings.isReplicating"><span>Replicate now</span></button>
      <button class="optional abort-replication warn" ng-click="execute('abortfetch')" ng-show="settings.isReplicating"><span>Abort Replication</span></button>

      <button class="optional disable-polling" ng-click="execute('disablepoll')" ng-show="!settings.isPollingDisabled"><span>Disable Polling</span></button>
      <button class="optional enable-polling" ng-click="execute('enablepoll')" ng-show="settings.isPollingDisabled"><span>Enable Polling</span></button>
    </div>

    <div class="masterOnly" ng-show="!isSlave">
      <button class="optional disable-replication warn" ng-click="execute('disablereplication')" ng-show="master.replicationEnabled"><span>Disable Replication</span></button>
      <button class="optional enable-replication warn" ng-click="execute('enablereplication')" ng-show="!master.replicationEnabled"><span>Enable Replication</span></button>
    </div>
    
  </div>

</div>