mirror of https://github.com/BTCPrivate/copay.git
integrate new name and header. Signin/signout flow
This commit is contained in:
parent
28247a87c6
commit
4cd48b7bb2
|
@ -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 {
|
||||
|
|
64
index.html
64
index.html
|
@ -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</
|
||||
</div>
|
||||
<p>4.324 BTC</p>
|
||||
</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">
|
||||
<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>
|
||||
<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>
|
||||
<div class="large-6 columns">
|
||||
<button class="btn btn-default" type="button" ng-click="join(connectionId)">Join</button>
|
||||
</div>
|
||||
</div>
|
||||
<hr>
|
||||
<button class="btn btn-primary btn-block" ng-click="join()"><i class="glyphicon glyphicon-plus"></i> Create a New Connection</button>
|
||||
<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>
|
||||
|
|
|
@ -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', []);
|
||||
|
||||
|
|
|
@ -18,6 +18,9 @@ angular
|
|||
.when('/join/:id', {
|
||||
templateUrl: 'join.html'
|
||||
})
|
||||
.when('/peer', {
|
||||
templateUrl: 'peer.html'
|
||||
})
|
||||
.when('/transactions', {
|
||||
templateUrl: 'transactions.html'
|
||||
})
|
||||
|
|
|
@ -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');
|
||||
};
|
||||
});
|
||||
|
|
|
@ -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'}
|
||||
|
|
|
@ -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();
|
||||
});
|
||||
};
|
||||
});
|
|
@ -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);
|
||||
});
|
||||
};
|
||||
});
|
||||
|
|
@ -3,4 +3,9 @@
|
|||
angular.module('copay.send').controller('SendController',
|
||||
function($scope, $rootScope, $location) {
|
||||
$scope.title = 'Send';
|
||||
|
||||
if (!$rootScope.peerId) {
|
||||
$location.path('signin');
|
||||
}
|
||||
|
||||
});
|
||||
|
|
|
@ -2,23 +2,36 @@
|
|||
|
||||
angular.module('copay.signin').controller('SigninController',
|
||||
function($scope, $rootScope, $location, Network) {
|
||||
$scope.loading = false;
|
||||
$rootScope.peerId = null;
|
||||
$scope.peerReady = false;
|
||||
$rootScope.copayers = [];
|
||||
|
||||
// Init peer
|
||||
$scope.create = function() {
|
||||
$scope.loading = true;
|
||||
Network.init(function(pid) {
|
||||
$rootScope.peerId = pid;
|
||||
$rootScope.$digest();
|
||||
|
||||
$scope.peerReady = true;
|
||||
$scope.$digest();
|
||||
$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);
|
||||
};
|
||||
});
|
||||
|
|
|
@ -6,6 +6,10 @@ angular.module('copay.transactions').controller('TransactionsController',
|
|||
|
||||
$scope.oneAtATime = true;
|
||||
|
||||
if (!$rootScope.peerId) {
|
||||
$location.path('signin');
|
||||
}
|
||||
|
||||
$scope.txsinput = [
|
||||
{
|
||||
fromAddr: "n3zUqNR7Bbbc4zJhPVj1vG2Lx66K3Xhzvb",
|
||||
|
|
|
@ -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
|
||||
}
|
||||
});
|
||||
|
||||
|
|
Loading…
Reference in New Issue