Ledger hardware wallet support

public/views/create.html

@@ -8,7 +8,7 @@
 
 <div class="content p20v" ng-controller="createController as create" ng-init="create.setTotalCopayers(1)">
 
-  <div class="onGoingProcess" ng-show="create.loading">
+  <div class="onGoingProcess" ng-show="create.loading && !create.ledger">
     <div class="onGoingProcess-content" ng-style="{'background-color':'#222'}">
     <div class="spinner">
       <div class="rect1"></div>
@@ -21,6 +21,19 @@
     </div>
   </div>
 
+  <div class="onGoingProcess" ng-show="create.ledger">
+    <div class="onGoingProcess-content" ng-style="{'background-color':'#222'}">
+    <div class="spinner">
+      <div class="rect1"></div>
+      <div class="rect2"></div>
+      <div class="rect3"></div>
+      <div class="rect4"></div>
+      <div class="rect5"></div>
+    </div>
+    <span translate>Connecting to Ledger Wallet...</span>
+    </div>
+  </div>
+
   <div class="create-tab small-only-text-center" ng-hide="create.hideTabs">
     <div class="row">
     <div class="tab-container small-6 medium-3 large-2">
@@ -87,12 +100,22 @@
             <i ng-if="!hideAdv" class="icon-arrow-up4"></i>
           </a>
         </div>
-        <div ng-hide="hideAdv" class="row">
+        <div ng-hide="hideAdv" class="row" ng-init="hideSlots=true">
           <div class="large-12 columns">
             <label for="network-name" class="line-b oh">
               <span translate>Testnet</span>
               <switch id="network-name" name="isTestnet" ng-model="isTestnet" class="green right m5t m10b"></switch>
             </label>
+            <label ng-show="create.isChromeApp()" for="hw-ledger" class="line-b oh">
+              <span translate>Use Ledger hardware wallet</span>
+              <switch id="hw-ledger" name="hwLedger" ng-model="hwLedger" class="green right m5t m10b" ng-change="hideSlots=false"></switch>
+            </label>
+            <div ng-hide="hideSlots">
+              <label class="line-b oh"><span translate>Select slot number for Ledger key</span>
+                <select class="m10t" ng-model="externalIndex" ng-options="externalIndex as externalIndex for externalIndex in create.externatIndexValues">
+                </select>
+              </label>
+            </div>         
             <label for="ext-master" class="m10t">
               <span translate>Master extended private key</span>
               <small translate>If not given, a secure key will be generated</small>

public/views/join.html

@@ -6,7 +6,7 @@
 
 
 <div class="content p20v" ng-controller="joinController as join">
-  <div class="onGoingProcess" ng-show="join.loading">
+  <div class="onGoingProcess" ng-show="join.loading && !join.ledger">
     <div class="onGoingProcess-content" ng-style="{'background-color':'#222'}">
     <div class="spinner">
       <div class="rect1"></div>
@@ -19,6 +19,19 @@
     </div>
   </div>
 
+  <div class="onGoingProcess" ng-show="join.ledger">
+    <div class="onGoingProcess-content" ng-style="{'background-color':'#222'}">
+    <div class="spinner">
+      <div class="rect1"></div>
+      <div class="rect2"></div>
+      <div class="rect3"></div>
+      <div class="rect4"></div>
+      <div class="rect5"></div>
+    </div>
+    <span translate>Connecting to Ledger Wallet...</span>
+    </div>
+  </div>
+
   <div class="row">
     <div class="large-12 columns">
 
@@ -71,7 +84,20 @@
             <i ng-show="!join.hideAdv" class="icon-arrow-down4"></i>
             <i ng-show="join.hideAdv" class="icon-arrow-up4"></i>
           </a>
-          <div ng-show="join.hideAdv" class="row">
+          <div ng-show="join.hideAdv" class="row" ng-init="hideSlots=true">
+            <div class="large-12 columns" ng-show="join.isChromeApp()">
+              <label for="hw-ledger" class="line-b oh">
+                <span translate>Use Ledger hardware wallet</span>
+                <switch id="hw-ledger" name="hwLedger" ng-model="hwLedger" class="green right m5t m10b" ng-change="hideSlots=false"></switch>
+              </label>
+            </div>
+            <div class="large-12 columns" ng-hide="hideSlots">
+              <label class="line-b oh">
+                <span translate>Select slot number for Ledger key</span>
+                <select class="m10t" ng-model="externalIndex" ng-options="externalIndex as externalIndex for externalIndex in join.externatIndexValues">
+                </select>
+              </label>
+            </div>         
             <div class="large-12 columns">
               <label for="ext-master">{{'Master extended private key'|translate}}
               <small translate>If not given, a secure key will be generated</small>

public/views/preferences.html

@@ -36,10 +36,17 @@
         <span ng-style="{'color':index.backgroundColor}">&block;</span>
       </span>      
     </li>
-    <li class="line-b p20">
+    <li class="line-b p20" ng-hide="preferences.externalIndex >= 0">
       <span translate>Encrypt Private Key</span>
       <switch id="network-name" name="encrypt" ng-model="encrypt" class="green right"></switch>
-  </li>
+    </li>
+    <li class="line-b p20" ng-show="preferences.externalIndex >= 0">
+      <span translate>Hardware wallet</span>
+      <span class="right text-gray">
+        {{preferences.externalSource}} 
+        (index {{preferences.externalIndex}})
+      </span>
+    </li>
  
     <h4 class="title m0">&nbsp;</h4>
     <li class="line-b p20" ng-click="$root.go('backup')">