Initial page. Signin.

css/main.css

@@ -13,10 +13,12 @@ html, body {height: 100%;}
 
 #wrap {min-height: 100%;}
 
-#main {overflow:auto;
+#main {
+  overflow:auto;
 	padding-bottom: 91px;}  /* must be same height as the footer */
 
-#footer {position: relative;
+#footer {
+  position: relative;
 	margin-top: -91px; /* negative value of footer height */
 	height: 91px;
 	clear:both;
@@ -27,6 +29,7 @@ html, body {height: 100%;}
   display: block;
   width: 130px;
   height: 51px;
+  margin: 0 auto;
 }
 
 @media (max-width: 640px) {
@@ -189,6 +192,13 @@ span.panel-res {
   margin: 0.5rem 0 1rem;
 }
 
+.line-dashed {
+  border-top: 2px dashed #ccc;
+  margin: 3rem 0;
+  padding: 1rem 0;
+}
+
+
 small.is-valid {
   font-weight: bold;
 }
@@ -332,3 +342,20 @@ hr { margin: 2.25rem 0;}
   background: #C0392B;
 }
 
+.box-signin {
+  padding: 20px 40px;
+  border: 1px solid #eee;
+  background-color: #fff;
+  text-align: center;
+  margin-bottom: 20px;
+}
+
+.box-signin h3 {
+  margin-bottom: 20px;
+}
+
+.box-signin .button {
+  margin: 20px 0;
+  width: 200px;
+}
+

index.html

@@ -14,7 +14,7 @@
       <div data-ng-init="init()" data-ng-controller="HeaderController">
         <div class="header"> 
           <div class="header-content">
-            <div class="large-3 medium-3 columns">
+            <div class="columns" ng-class="{'large-12':!$root.wallet, 'large-3 medium-3':$root.wallet}">
               <span class="logo"></span>
             </div>
             <div class="large-9 medium-9 columns text-center p10t" ng-show="$root.wallet">
@@ -135,58 +135,47 @@
           Looking for peers...
         </div>
         <div ng-show="!loading">
-          <div ng-show="!wallets.length">
-            <div class="row">
-              <div class="large-6 columns">
-                <h3>Create a New Wallet</h3>
-              </div>
-              <div class="large-3 columns">
-                <button class="button secondary expand round" ng-click="create()" ng-disabled="loading" loading="Creating">Create</button>
-              </div>
-            </div>
-            <hr>
-          </div>
-          <div ng-show="wallets.length">
-            <div class="row">
-              <div class="large-6 columns">
-                <h3>Open Wallet</h3>
-                <select class="form-control" ng-model="selectedWalletId"
-                   ng-options="w.id as w.show for w in wallets">
-                </select>
-              </div>
-              <div class="large-3 columns">
-                <button class="button secondary expand round" type="button"
-                   ng-click="open(selectedWalletId)" ng-disabled="loading" loading="Opening">Open</button>
-              </div>
-            </div>
-            <hr>
-          </div>
-          <div ng-show="true">
+          
           <div class="row">
             <div class="large-6 columns">
+              <div class="box-signin">
               <h3>Join a Wallet in Creation</h3>
               <input type="text" class="form-control" placeholder="Paste wallet secret here"
                ng-model="connectionId" required autofocus>
-              </div>
-              <div class="large-3 columns">
               <button class="button primary expand round"
                 ng-click="join(connectionId)" ng-disabled="loading" loading="Joining">Join</button>
               </div>
             </div>
-            <hr>
+            <div class="large-6 columns">
+              <div class="box-signin">
+              <div ng-show="wallets.length">
+                <h3>Open Wallet</h3>
+                <select class="form-control" ng-model="selectedWalletId"
+                  ng-options="w.id as w.show for w in wallets">
+                </select>
+                <button class="button secondary expand round" type="button"
+                  ng-click="open(selectedWalletId)" ng-disabled="loading" loading="Opening">Open</button>
+              </div>
+              <div ng-show="!wallets.length">
+                <h3>Create a new wallet</h3>
+                <input type="text" class="form-control" ng-model="walletName" placeholder="Wallet name (optional)">
+                <button class="button secondary expand round" ng-click="create(walletName)" ng-disabled="loading" loading="Creating">Create</button>                
+              </div>
+              </div>
+            </div>
           </div>
 
           <div class="row">
-            <div class="large-12 columns">
-              <div ng-show="wallets.length">
-                <a ng-click="create()" ng-disabled="loading" loading="Creating">Create a new wallet</a>
-              </div>
-              <a class="right" ng-href="#import">Import from file</a>
+            <div class="large-12 columns text-center line-dashed">
+              <span ng-show="wallets.length">
+                <a ng-click="create()" ng-disabled="loading" loading="Creating">Create a new wallet</a> &middot;
+              </span>
+              <a ng-href="#import">Import from file</a>
             </div>
           </div>
           
 
-        </div>
+        </div> <!-- End !loading -->
       </div>
     </script>
  

js/controllers/signin.js

@@ -6,8 +6,9 @@ angular.module('copay.signin').controller('SigninController',
     $scope.wallets = walletFactory.getWallets();
     $scope.selectedWalletId = $scope.wallets.length ? $scope.wallets[0].id : null;
 
-    $scope.create = function() {
+    $scope.create = function(walletName) {
       $scope.loading = true;
+      $rootScope.walletName = walletName;
       $location.path('setup');
     };
 

js/services/video.js

@@ -7,7 +7,7 @@ var Video = function() {
 
   this.mediaConnections = {};
   this.localStream = null;
-  this.onlineSound = new Audio('../../sound/online.wav');
+  this.onlineSound = new Audio('./sound/online.wav');
 };
 
 Video.prototype.setOwnPeer = function(peer, wallet, cb) {