copay/views/profile.html

<div class="backup" ng-controller="ProfileController" ng-init="init()">
  <div class="row hide-for-large-up">
    <div class="large-12 medium-12 small-12 columns">
      <h1>{{$root.title}}</h1>
    </div>
  </div>
  <div class="row">
    <div class="large-12 columns">
      <div class="panel">
        <div class="row">
          <div class="large-2 medium-2 columns text-center">
            <a class="photo-container profile" href="https://en.gravatar.com/" ng-init="isHover=0" ng-mouseenter="isHover=1" ng-mouseleave="isHover=0" target="_blank">
              <img ng-show="!isHover" gravatar-src="'{{username}}'" gravatar-size="80">
              <img ng-show="isHover" src="img/change-avatar.png" with="80">
            </a>
          </div>
          <div class="large-7 medium-7 columns">
            <h2>Profile <span class="size-12 text-warning" ng-if="$root.iden.backupNeeded"> [ Needs Backup ]</span></h2>
            <p translate class="text-gray">It's important to backup your profile so that you can recover it in case of disaster. The backup will include all your profile's wallets</p>
          </div>
          <div class="large-3 medium-3 columns">
              <a translate class="button primary m0" ng-click="downloadProfileBackup()"
                ng-show="!isSafari && !isCordova">Backup profile</a>
              <a translate class="button primary m0" ng-click="viewProfileBackup()"
                ng-show="isSafari || isCordova && !hideViewProfileBackup">View profile backup</a>
          </div>
        </div>
        <div class="row" ng-show="backupProfilePlainText">
          <div class="large-12 columns">
            <textarea class="show-for-large-up" readonly rows="5">{{backupProfilePlainText}}</textarea>
            <textarea class="hide-for-large-up" rows="5">{{backupProfilePlainText}}</textarea>
            <div translate class="size-12 m10t text-gray text-right">
              Copy this text as it is in a safe place (notepad or email)
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>

  <div class="line-dashed-h m20b"></div>
  
  <div class="row" ng-init="setWallets()">
    <div class="large-12 columns">
      <h2>Manage wallets</h2> 

      <div class="box-notification" ng-show="success">
        <div class="box-icon success">
          <i class="fi-check size-24"></i>
        </div>
        <span class="text-success size-14">
          {{success|translate}}
        </span>
        <a href ng-click="success=false" class="close-notification success">&#215;</a>
      </div>

      <table class="manage-wallets">
        <thead>
          <tr>
            <th>Name</th>
            <th>Type</th>
            <th class="hide-for-small-only">Status</th>
            <th class="hide-for-small-only">Balance</th>
            <th class="hide-for-small-only">Approx Size</th>
          </tr>
        </thead>
        <tbody>
          <tr 
              data-ng-repeat="item in wallets | orderBy:'name'" 
              ng-init="isComplete = item.isComplete(); networkName = item.getNetworkName()"
              ng-click="showWalletInfo(item)">
            <td>
              <span ng-show="loading == item.id"><i class="fi-bitcoin-circle icon-rotate spinner"></i></span>
              <span ng-show="loading != item.id">
                {{item.name || item.id }}
              </span>
            </td>
            <td>{{item.requiredCopayers}} of {{item.totalCopayers}} - {{networkName}}</td>
            <td class="hide-for-small-only">
              {{isComplete ? 'Complete' : 'Waiting for copayers...'}}
            </td>
            <td class="hide-for-small-only">
              <span ng-if="!isComplete">-</span>
              <span ng-if="isComplete">
                  {{item.balanceInfo.totalBalance || 0}} {{item.settings.unitName}}
              </span>
            </td>
            <td class="hide-for-small-only">
              <span>
                  {{item.kb}} kB 
                  <span ng-if="item.usage">({{item.usage}}%) </span>
              </span>
            </td>
          </tr>
        </tbody>
      </table>

      <div class="size-12">
        <div ng-if="perItem">
          Your current server usage quotas are: <b>{{perItem}}kB</b> per wallet and up to <b>{{nrWallets}}</b> wallets.
        </div>
        <div ng-if="$root.needsEmailConfirmation" class="m10t">
          <i class="fi-alert"></i> Confirm your email address to increase storage usage limits.
        </div>
      </div>
    </div>
  </div> 

  <div class="line-dashed-h m20b"></div>
  
  <div class="m50b row oh">
    <div class="large-12 columns">
      <a class="small left button-setup" ng-click="hideAdv=!hideAdv">
        <i class="fi-widget m3r"></i>
        <span translate ng-hide="!hideAdv">Show</span> 
        <span translate ng-hide="hideAdv">Hide</span> 
        <span translate>advanced options</span> 
        <i ng-if="hideAdv" class="icon-arrow-down4"></i>
        <i ng-if="!hideAdv" class="icon-arrow-up4"></i>
      </a>
    </div>
  </div>

  <div ng-hide="hideAdv" class="row m50b">
    <div class="large-12 columns">
      <div class="panel">
        <h2><i class="fi-minus-circle m10r"></i> 
          <span translate>Delete Profile</span>
        </h2>
        <p translate class="text-gray">Permanently delete this profile and all its wallets. WARNING: this action cannot be reversed.</p>
        <div ng-show="!confirmDelete">
          <a translate class="button warning m0" ng-click="confirmDelete=!confirmDelete">Delete Profile
          </a>
        </div>
        <div class="text-center" ng-show="confirmDelete">
          <h2>Are you sure you want to delete this profile?</h2>
          <div class="row">
            <div class="large-6 medium-6 small-6 columns">
              <a translate class="button gray m0" ng-click="confirmDelete=!confirmDelete">Cancel</a>
            </div>
            <div class="large-6 medium-6 small-6 columns">
              <a translate class="button warning m0" ng-click="deleteProfile()">Delete</a>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>