anders/Wallet
1
0
Fork 0
Code Issues Projects Releases Packages Wiki Activity

Merge pull request #9 from cmgustavo/feature/signin-signup-flow

Browse source 
integrate new name and header. Flow of signin/signout. Reorder forms.
This commit is contained in:
Ryan X. Charles 2014-03-31 11:59:12 -04:00
commit 5aad170bec
12 changed files with 130 additions and 74 deletions
Download patch file Download diff file Expand all files Collapse all files

5
css/main.css
View file

@ -32,13 +32,14 @@ body {
.header { .header {
background: #111; background: #111;
margin: 0!important;
overflow: hidden;
color: white; color: white;
overflow: hidden;
margin-bottom: 30px;
} }
.header-content { .header-content {
padding: 1.5rem; padding: 1.5rem;
overflow: hidden;
} }
.header h1, h5 { .header h1, h5 {

70
index.html
View file

@ -11,18 +11,16 @@
<link href='http://fonts.googleapis.com/css?family=Ubuntu:300,400,700,700italic' rel='stylesheet' type='text/css'> <link href='http://fonts.googleapis.com/css?family=Ubuntu:300,400,700,700italic' rel='stylesheet' type='text/css'>
</head> </head>
<body> <body>
<div data-ng-init="init()" data-ng-controller="HeaderController"> <div class="header" data-ng-init="init()" data-ng-controller="HeaderController">
<div class="header">
<div class="header-content"> <div class="header-content">
<h1 class="left">Copay</h1> <h1 class="left">Copay</h1>
<div class="text-right"> <div class="text-right" ng-show="$root.peerId">
<h5>Company Funds</h5> <h5>Company Funds</h5>
<p>4.324 BTC</ <p>4.324 BTC</p>
</div> </div>
</div> </div>
</div>
<nav class="top-bar" data-topbar> <nav class="top-bar" data-topbar ng-show="$root.peerId">
<ul class="title-area" data-ng-repeat="item in menu" ui-route="/{{item.link}}" data-ng-class="{active: isActive(item)}"> <ul class="title-area" data-ng-repeat="item in menu" ui-route="/{{item.link}}" data-ng-class="{active: isActive(item)}">
<li class="name"></li> <li class="name"></li>
<li class="toggle-topbar menu-icon"> <li class="toggle-topbar menu-icon">
@ -44,45 +42,63 @@
<div class="row"> <div class="row">
<div class="large-12 columns" ng-view></div> <div class="large-12 columns" ng-view></div>
</div> </div>
<div ng-controller="HeaderController" ng-show="$root.peerId">
<hr>
<div class="row">
<div class="text-center large-12 columns">
<a href="#" ng-click="signout()" class="button tiny">Signout</a>
</div>
</div>
</div>
<!-- Templates --> <!-- Templates -->
<script type="text/ng-template" id="signin.html"> <script type="text/ng-template" id="signin.html">
<div class="text-center" ng-controller="SigninController"> <div ng-controller="SigninController">
<div ng-if="!peerReady">Opening peers...</div> <div class="panel callout radius" ng-show="loading">
<div ng-if="peerReady"> Connecting to wallet...
<h1>Join or Create a New Connection</h1> </div>
<div class="col-lg-12"> <div ng-show="!loading">
<div class="input-group"> <div class="row">
<input type="text" class="form-control" placeholder="Peer ID" ng-model="connectionId" autofocus> <div class="large-6 columns">
<span class="input-group-btn"> <h3>Join wallet</h3>
<button class="btn btn-default" type="button" ng-click="join(connectionId)"><i class="glyphicon glyphicon-log-in"></i> Join</button> <input type="text" class="form-control" placeholder="Peer ID" ng-model="connectionId" autofocus>
</span>
</div>
<hr>
<button class="btn btn-primary btn-block" ng-click="join()"><i class="glyphicon glyphicon-plus"></i> Create a New Connection</button>
</div> </div>
<div class="large-6 columns">
<button class="btn btn-default" type="button" ng-click="join(connectionId)">Join</button>
</div>
</div>
<hr>
<div class="row">
<div class="large-6 columns">
<h3>Create a new wallet</h3>
</div>
<div class="large-6 columns">
<button class="btn btn-primary btn-block" ng-click="create()">Create</button>
</div>
</div>
</div> </div>
</div> </div>
</script> </script>
<script type="text/ng-template" id="join.html"> <script type="text/ng-template" id="peer.html">
<div ng-controller="JoinController" ng-init="init()"> <div ng-controller="PeerController" ng-init="init()">
<h1>Joined to <span class="text-muted">{{connectionId}}</span></h1> <h1>I am <span class="text-muted">{{$root.peerId}}</span></h1>
<div class="panel panel-default"> <div class="panel panel-default">
<div class="panel-heading"> <div class="panel-heading">
<h3 class="panel-title">Copayers ({{copayers.length}}/5)</h3> <h3 class="panel-title">Copayers ({{$root.copayers.length}}/5)</h3>
</div> </div>
<div class="panel-body"> <div class="panel-body">
<ul> <ul>
<li ng-repeat="copayer in copayers"> <li ng-repeat="copayer in $root.copayers">
<span ng-if="copayer == $root.peerId">You ({{$root.peerId}})</span> <span ng-if="copayer == $root.peerId">You ({{$root.peerId}})</span>
<span ng-if="copayer != $root.peerId">{{copayer}}</span> <span ng-if="copayer != $root.peerId">{{copayer}}</span>
</li> </li>
</ul> </ul>
</div> </div>
</div> </div>
<a href="#/home">Skip</a> <div class="text-center">
<a href="#/home">Go home</a>
</div>
</div> </div>
</script> </script>
@ -196,7 +212,7 @@
<script src="js/controllers/send.js"></script> <script src="js/controllers/send.js"></script>
<script src="js/controllers/backup.js"></script> <script src="js/controllers/backup.js"></script>
<script src="js/controllers/signin.js"></script> <script src="js/controllers/signin.js"></script>
<script src="js/controllers/join.js"></script> <script src="js/controllers/peer.js"></script>
<script src="js/init.js"></script> <script src="js/init.js"></script>
</body> </body>

4
js/app.js
View file

@ -11,7 +11,7 @@ angular.module('copay',[
'copay.backup', 'copay.backup',
'copay.network', 'copay.network',
'copay.signin', 'copay.signin',
'copay.join' 'copay.peer'
]); ]);
angular.module('copay.header', []); angular.module('copay.header', []);
@ -21,5 +21,5 @@ angular.module('copay.send', []);
angular.module('copay.backup', []); angular.module('copay.backup', []);
angular.module('copay.network', []); angular.module('copay.network', []);
angular.module('copay.signin', []); angular.module('copay.signin', []);
angular.module('copay.join', []); angular.module('copay.peer', []);

3
js/config.js
View file

@ -18,6 +18,9 @@ angular
.when('/join/:id', { .when('/join/:id', {
templateUrl: 'join.html' templateUrl: 'join.html'
}) })
.when('/peer', {
templateUrl: 'peer.html'
})
.when('/transactions', { .when('/transactions', {
templateUrl: 'transactions.html' templateUrl: 'transactions.html'
}) })

10
js/controllers/header.js
View file

@ -1,10 +1,10 @@
'use strict'; 'use strict';
angular.module('copay.header').controller('HeaderController', angular.module('copay.header').controller('HeaderController',
function($scope, $rootScope, $location) { function($scope, $rootScope, $location, Network) {
$scope.menu = [{ $scope.menu = [{
'title': 'Home', 'title': 'Home',
'link': '#/' 'link': '#/home'
}, { }, {
'title': 'Transactions', 'title': 'Transactions',
'link': '#/transactions' 'link': '#/transactions'
@ -16,6 +16,10 @@ angular.module('copay.header').controller('HeaderController',
'link': '#/backup' 'link': '#/backup'
}]; }];
if (!$rootScope.peerId) {
$location.path('signin');
}
$scope.isActive = function(item) { $scope.isActive = function(item) {
if (item.link.replace('#','') == $location.path()) { if (item.link.replace('#','') == $location.path()) {
return true; return true;
@ -29,7 +33,7 @@ angular.module('copay.header').controller('HeaderController',
$scope.signout = function() { $scope.signout = function() {
$rootScope.isLogged = false; $rootScope.isLogged = false;
Network.disconnect();
$location.path('signin'); $location.path('signin');
}; };
}); });

4
js/controllers/home.js
View file

@ -6,6 +6,10 @@ angular.module('copay.home').controller('HomeController',
$scope.oneAtATime = true; $scope.oneAtATime = true;
if (!$rootScope.peerId) {
$location.path('signin');
}
$scope.addrs = [ $scope.addrs = [
{ addrStr: 'n3zUqNR7Bbbc4zJhPVj1vG2Lx66K3Xhzvb'}, { addrStr: 'n3zUqNR7Bbbc4zJhPVj1vG2Lx66K3Xhzvb'},
{ addrStr: 'my9wnLwwUrwpNfEgSrWY62ymEGf1edKf4J'} { addrStr: 'my9wnLwwUrwpNfEgSrWY62ymEGf1edKf4J'}

21
js/controllers/join.js
View file

@ -1,21 +0,0 @@
'use strict';
angular.module('copay.join').controller('JoinController',
function($scope, $rootScope, $routeParams, Network) {
$scope.connectionId = $routeParams.id;
$scope.copayers = [];
$scope.init = function() {
console.log('-------- init --------');
console.log($rootScope.peerId);
$scope.copayers.push($rootScope.peerId);
Network.connect($scope.connectionId, function(copayer) {
console.log('----- join connect --------');
console.log(copayer);
$scope.copayers.push(copayer);
$scope.$digest();
});
};
});

13
js/controllers/peer.js Normal file
View file

@ -0,0 +1,13 @@
'use strict';
angular.module('copay.peer').controller('PeerController',
function($scope, $rootScope, $location, $routeParams, Network) {
$scope.init = function() {
Network.connect($rootScope.connectionId, function(copayer) {
console.log(copayer);
console.log($rootScope.copayers);
});
};
});

5
js/controllers/send.js
View file

@ -3,4 +3,9 @@
angular.module('copay.send').controller('SendController', angular.module('copay.send').controller('SendController',
function($scope, $rootScope, $location) { function($scope, $rootScope, $location) {
$scope.title = 'Send'; $scope.title = 'Send';
if (!$rootScope.peerId) {
$location.path('signin');
}
}); });

41
js/controllers/signin.js
View file

@ -2,23 +2,36 @@
angular.module('copay.signin').controller('SigninController', angular.module('copay.signin').controller('SigninController',
function($scope, $rootScope, $location, Network) { function($scope, $rootScope, $location, Network) {
$scope.loading = false;
$rootScope.peerId = null; $rootScope.peerId = null;
$scope.peerReady = false; $rootScope.copayers = [];
// Init peer $scope.create = function() {
Network.init(function(pid) { $scope.loading = true;
$rootScope.peerId = pid; Network.init(function(pid) {
$rootScope.$digest(); $rootScope.copayers.push(pid);
$location.path('peer');
$scope.peerReady = true; });
$scope.$digest(); };
});
$scope.join = function(cid) { $scope.join = function(cid) {
console.log('------- join --------'); $scope.loading = true;
console.log(cid); $rootScope.connectionId = cid;
Network.init(function(pid) {
console.log('------- join --------');
console.log(pid);
$rootScope.copayers.push(pid);
Network.connect(cid, function(copayer) {
console.log('----- join master --------');
console.log(copayer);
$rootScope.copayers.push(copayer);
$location.path('peer');
});
});
var pid = cid || $rootScope.peerId;
$location.path('join/' + pid);
}; };
}); });

4
js/controllers/transactions.js
View file

@ -6,6 +6,10 @@ angular.module('copay.transactions').controller('TransactionsController',
$scope.oneAtATime = true; $scope.oneAtATime = true;
if (!$rootScope.peerId) {
$location.path('signin');
}
$scope.txsinput = [ $scope.txsinput = [
{ {
fromAddr: "n3zUqNR7Bbbc4zJhPVj1vG2Lx66K3Xhzvb", fromAddr: "n3zUqNR7Bbbc4zJhPVj1vG2Lx66K3Xhzvb",

26
js/services/network.js
View file

@ -6,14 +6,15 @@ angular.module('copay.network')
return 2; return 2;
}; };
}) })
.factory('Network', function() { .factory('Network', function($rootScope) {
var peer; var peer;
var connectedPeers = {}; var connectedPeers = {};
var _onConnect = function(c, cb) { var _onConnect = function(c, cb) {
if (c.label === 'wallet') { if (c.label === 'wallet') {
var a = peer.connections[c.peer][0]; var a = peer.connections[c.peer][0];
console.log(peer.connections[c.peer]); console.log(peer.connections[c.peer][0]);
console.log(a);
a.send('------ origin recived -------'); a.send('------ origin recived -------');
c.on('data', function(data) { c.on('data', function(data) {
@ -43,7 +44,12 @@ angular.module('copay.network')
debug: 3 debug: 3
}); });
peer.on('open', cb); peer.on('open', function() {
$rootScope.peerId = peer.id;
$rootScope.peerReady = true;
cb(peer.id);
$rootScope.$digest();
});
}; };
var _connect = function(pid, cb) { var _connect = function(pid, cb) {
@ -59,17 +65,18 @@ angular.module('copay.network')
}); });
c.on('open', function() { c.on('open', function() {
c.send('-------oopen-------'); c.send('-------open-------');
}); });
c.on('data', function(data) { c.on('data', function(data) {
if (data) if (data)
console.log(data); console.log('Data:' + data);
}); });
c.on('error', function(err) { c.on('error', function(err) {
console.error(err); console.error(err);
}); });
cb(c.peer);
}; };
var _sendTo = function(pid, data) { var _sendTo = function(pid, data) {
@ -81,10 +88,17 @@ angular.module('copay.network')
console.log(data); console.log(data);
}; };
var _disconnect = function() {
peer.disconnect();
peer.destroy();
console.log('Disconnected and destroyed connection');
}
return { return {
init: _init, init: _init,
connect: _connect, connect: _connect,
sendTo: _sendTo sendTo: _sendTo,
disconnect: _disconnect
} }
}); });