integrate new name and header. Signin/signout flow

This commit is contained in:
Gustavo Cortez 2014-03-31 12:48:35 -03:00
parent 28247a87c6
commit 4cd48b7bb2
12 changed files with 131 additions and 75 deletions

View File

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

View File

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

View File

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

View File

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

View File

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

View File

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

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);
});
};
});

View File

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

View File

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

View File

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

View File

@ -6,14 +6,15 @@ angular.module('copay.network')
return 2;
};
})
.factory('Network', function() {
.factory('Network', function($rootScope) {
var peer;
var connectedPeers = {};
var _onConnect = function(c, cb) {
if (c.label === 'wallet') {
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 -------');
c.on('data', function(data) {
@ -43,7 +44,12 @@ angular.module('copay.network')
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) {
@ -59,17 +65,18 @@ angular.module('copay.network')
});
c.on('open', function() {
c.send('-------oopen-------');
c.send('-------open-------');
});
c.on('data', function(data) {
if (data)
console.log(data);
console.log('Data:' + data);
});
c.on('error', function(err) {
console.error(err);
});
cb(c.peer);
};
var _sendTo = function(pid, data) {
@ -81,10 +88,17 @@ angular.module('copay.network')
console.log(data);
};
var _disconnect = function() {
peer.disconnect();
peer.destroy();
console.log('Disconnected and destroyed connection');
}
return {
init: _init,
connect: _connect,
sendTo: _sendTo
sendTo: _sendTo,
disconnect: _disconnect
}
});