copay/views/home.html

<div class="home" ng-controller="HomeController" ng-init="init()">

  <div ng-show="$root.starting">
    <div ng-include="'views/includes/loading.html'" ng-init="title = 'Accessing your profile'"></div>
  </div>

  <div class="large-4 large-centered medium-6 medium-centered columns" ng-show="!$root.starting">
    <div class="logo-setup" ng-show="!$root.iden">
      <img src="img/logo-negative-beta.svg" alt="Cop ay" width="100">
      <div ng-include="'views/includes/version.html'"></div>
    </div>

    <div class="p10 bg-success m20b text-white" ng-show="confirmedEmail">
      <div class="left">
        <i class="size-36 fi-check m10r"></i>
      </div>
      <div class="size-14">
        <h3>
        Your email was confimed!
        </h3>
        Please sign in to access your wallets
      </div>
    </div>

    <div ng-if="askForPin">
      <div class="clipo">
        <img src="img/clipo-pin.png" alt="clipo" width="380">
      </div>

      <div class="box-notification" ng-show="error">
        <div class="box-icon error">
          <i class="fi-x size-24"></i>
        </div>
        <span class="text-warning size-14">
          {{error|translate}}
        </span>
      </div>

      <form name="setPinForm" ng-model="setPinForm" novalidate>
        <div class="input" ng-show="askForPin == 1">
          <input id="newpin" type="tel" ng-model="newpin" class="form-control" ng-maxlength="4" ng-minlength="4" maxlength="4" ng-pattern="/^[0-9]{1,4}$/" placeholder="PIN" name="newpin" required show-focus="askForPin == 1">
          <i class="icon-locked"></i>
        </div>
        <div class="input" ng-show="askForPin == 2">
          <input id="repeatpin" type="tel" ng-model="repeatpin" class="form-control" ng-maxlength="4" ng-minlength="4" maxlength="4" ng-pattern="/^[0-9]{1,4}$/" placeholder="Confirm your PIN" name="repeatpin" required show-focus="askForPin == 2">
          <i class="icon-locked"></i>
        </div>

        <div class="row collapse">
          <div class="large-6 medium-6 small-6 columns">
            <a class="button secondary radius m0" ng-click="openWallets()">
              <span translate>Skip</span> 
            </a>
          </div>
          <div class="large-6 medium-6 small-6 columns text-right">
            <button translate ng-click="createPin(setPinForm.repeatpin.$modelValue)" class="button primary radius expand m0" 
              ng-disabled="setPinForm.$invalid || error">
              OK
            </button>
          </div>
        </div>


      </form>
    </div>

    <div ng-if='$root.hasPin && !$root.iden'>
      <div class="clipo">
        <img src="img/clipo-pin-enter.png" alt="clipo" width="300">
      </div>
      <form name="pinForm" novalidate>
        <div class="box-notification" ng-show="error">
          <div class="box-icon error">
            <i class="fi-x size-24"></i>
          </div>
          <span class="text-warning size-14">
            {{error|translate}}
          </span>
        </div>

        <div class="input">
          <input id="pin" type="tel" ng-model="pin" class="form-control" ng-maxlength="4" ng-minlength="4" maxlength="4" ng-pattern="/^[0-9]{1,4}$/" placeholder="Pin number" name="pin" required>
          <i class="icon-locked"></i>
        </div>

        <div class="row collapse">
          <div class="large-6 medium-6 small-6 columns">
            <a class="button warning radius m0" ng-click="pinLogout()">
              <i class="icon-power"></i> 
              <span translate>Logout</span>
            </a>
          </div>
          <div class="large-6 medium-6 small-6 columns text-right">
            <button translate ng-click="openWithPin(pinForm.pin.$modelValue)" class="button primary radius expand m0" 
              ng-disabled="pinForm.$invalid || error">
              Sign in
            </button>
          </div>
        </div>
      </form>
    </div>

    <div ng-if='!$root.hasPin && !askForPin && !$root.iden'>
      <div class="clipo">
        <img src="img/clipo-signin.png" alt="clipo" width="310">
      </div>
      <div class="p10 m20b size-14 bg-success text-white" ng-show="anyWallet && !confirmedEmail && !error">
        <div class="left">
          <i class="size-36 fi-alert m10r"></i>
        </div>
        <b>Copay now needs a profile to access wallets.</b>
        You can import your current wallets after
        <a class="text-white" ng-click="$root.go('/createProfile')">creating your profile</a>
      </div>
      <div class="p10 bg-success m20b text-white" ng-show="pendingPayment">
        <div class="left">
          <i class="size-36 m10r"></i>
        </div>
        <div class="size-14">
          Please sign in to make the payment
        </div>
      </div>
      <form name="loginForm" ng-submit="openWithCredentials(loginForm)" novalidate>
        <div class="box-notification" ng-show="error">
          <div class="box-icon error">
            <i class="fi-x size-24"></i>
          </div>
          <span class="text-warning size-14">
            {{error|translate}}
          </span>
        </div>

        <div class="input" ng-if="!usingLocalStorage">
          <input type="email" ng-model="email" class="form-control" name="email" placeholder="Email" required show-focus="!isMobile">
          <i class="icon-email"></i>
        </div>

        <div class="input" ng-if="usingLocalStorage">
          <input type="text" ng-model="email" class="form-control" name="email" placeholder="Username" required show-focus="!isMobile">
          <i class="icon-person"></i>
        </div>
        <div class="input">
          <input type="password" ng-model="password" class="form-control" name="password" placeholder="Password" required>
          <i class="icon-locked"></i>
        </div>

        <button translate type="submit" class="button primary radius expand m0" ng-disabled="loginForm.$invalid">
          Sign in
        </button>
      </form>

        <div ng-if="usingLocalStorage" class="text-gray size-12 m10v">
          * Using this device storage. Change to cloud storage on 'settings'.
        </div>



      <div class="box-setup-footer">

        <div class="right">
          <a class="button-setup text-gray"  ng-click="$root.go('/settings')">
            <i class="icon-wrench"></i> 
            <span translate>Settings</span>
          </a>
        </div>

        <div class="left m10r">
          <a class="button-setup text-gray"  ng-click="$root.go('/createProfile')">
            <i class="icon-person"></i> 
            <span translate>Create profile</span>
          </a>
        </div>
        <div class="left">
          <a class="button-setup text-gray"  ng-click="$root.go('/importProfile')">
            <i class="icon-upload"></i> 
            <span translate>Import</span>
          </a>
        </div>
      </div>
    </div>
  </div>
</div>