Client select has 'custom derivation path' option

* Specific clients cause derivation path input to be readonly
* Rename ambiguous variable client-phrase to bip32-client

2 files changed, 20 insertions, 14 deletions

diff --git a/src/index.html b/src/index.html
index a5ac637..5495fe9 100644
--- a/src/index.html
+++ b/src/index.html
@@ -368,9 +368,10 @@
                                     </p>
                                 </div>
                                 <div class="form-group">
-                                    <label for="client-phrase" class="col-sm-2 control-label" data-translate>Client</label>
+                                    <label for="bip32-client" class="col-sm-2 control-label" data-translate>Client</label>
                                     <div class="col-sm-10">
-                                        <select id="client-phrase" class="client form-control">
+                                        <select id="bip32-client" class="client form-control">
+                                            <option value="custom">Custom derivation path</option>
                                             <!-- populated by javascript -->
                                         </select>
                                     </div>
diff --git a/src/js/index.js b/src/js/index.js
index 8c54cab..22bf599 100644
--- a/src/js/index.js
+++ b/src/js/index.js
@@ -23,9 +23,8 @@
 
     var DOM = {};
     DOM.network = $(".network");
-    DOM.client = $(".client");
+    DOM.bip32Client = $("#bip32-client");
     DOM.phraseNetwork = $("#network-phrase");
-    DOM.phraseClient = $("#client-phrase");
     DOM.useEntropy = $(".use-entropy");
     DOM.entropyContainer = $(".entropy-container");
     DOM.entropy = $(".entropy");
@@ -79,7 +78,7 @@
     function init() {
         // Events
         DOM.network.on("change", networkChanged);
-        DOM.client.on("change", clientChanged);
+        DOM.bip32Client.on("change", bip32ClientChanged);
         DOM.useEntropy.on("change", setEntropyVisibility);
         DOM.entropy.on("input", delayedEntropyChanged);
         DOM.entropyMnemonicLength.on("change", entropyChanged);
@@ -120,15 +119,21 @@
             rootKeyChanged();
         }
     }
-    
-    function clientChanged(e) {
-        var clientIndex = e.target.value;
-        clients[clientIndex].onSelect();
-        if (seed != null) {
-            phraseChanged();
+
+    function bip32ClientChanged(e) {
+        var clientIndex = DOM.bip32Client.val();
+        if (clientIndex == "custom") {
+            DOM.bip32path.prop("readonly", false);
         }
         else {
-            rootKeyChanged();
+            DOM.bip32path.prop("readonly", true);
+            clients[clientIndex].onSelect();
+            if (seed != null) {
+                phraseChanged();
+            }
+            else {
+                rootKeyChanged();
+            }
         }
     }
 
@@ -725,14 +730,14 @@
             DOM.phraseNetwork.append(option);
         }
     }
-    
+
     function populateClientSelect() {
         for (var i=0; i<clients.length; i++) {
             var client = clients[i];
             var option = $("<option>");
             option.attr("value", i);
             option.text(client.name);
-            DOM.phraseClient.append(option);
+            DOM.bip32Client.append(option);
         }
     }