mirror of https://github.com/BTCPrivate/copay.git
Add copayer list at sidebar, separate snippet and clean video controller code
This commit is contained in:
parent
b17bc2310d
commit
0c3709ceee
25
css/main.css
25
css/main.css
|
@ -76,6 +76,8 @@ body, html{
|
||||||
|
|
||||||
.page, .main, .sidebar {
|
.page, .main, .sidebar {
|
||||||
height:100%;
|
height:100%;
|
||||||
|
overflow-y: auto;
|
||||||
|
overflow-x: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.sidebar {
|
.sidebar {
|
||||||
|
@ -91,10 +93,33 @@ body, html{
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.sidebar ul.copayer-list {
|
||||||
|
list-style-type: none;
|
||||||
|
padding:0; margin:0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sidebar ul.copayer-list li {
|
||||||
|
margin-top: 15px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sidebar ul.copayer-list img {
|
||||||
|
width: 30px;
|
||||||
|
height: 30px;
|
||||||
|
}
|
||||||
|
|
||||||
.button.small.side-bar {
|
.button.small.side-bar {
|
||||||
padding: 0.2rem 0.4rem;
|
padding: 0.2rem 0.4rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.online {
|
||||||
|
border: 3px solid #1ABC9C;
|
||||||
|
}
|
||||||
|
|
||||||
|
.offline {
|
||||||
|
border: 3px solid gray;
|
||||||
|
opacity: 0.4;
|
||||||
|
}
|
||||||
|
|
||||||
.main {
|
.main {
|
||||||
margin-left: 250px;
|
margin-left: 250px;
|
||||||
padding: 1.5rem
|
padding: 1.5rem
|
||||||
|
|
|
@ -3,16 +3,35 @@
|
||||||
angular.module('copayApp.controllers').controller('VideoController',
|
angular.module('copayApp.controllers').controller('VideoController',
|
||||||
function($scope, $rootScope, $sce) {
|
function($scope, $rootScope, $sce) {
|
||||||
|
|
||||||
|
// Cached list of copayers
|
||||||
|
$scope.copayers = $rootScope.wallet.getRegisteredPeerIds();
|
||||||
|
|
||||||
|
$scope.copayersList = function() {
|
||||||
|
return $rootScope.wallet.getRegisteredPeerIds();
|
||||||
|
}
|
||||||
|
|
||||||
|
$scope.hasVideo = function(copayer) {
|
||||||
|
return $rootScope.videoInfo[copayer.peerId];
|
||||||
|
}
|
||||||
|
|
||||||
|
$scope.isConnected = function(copayer) {
|
||||||
|
return $rootScope.wallet.getOnlinePeerIDs().indexOf(copayer.peerId) != -1;
|
||||||
|
}
|
||||||
|
|
||||||
|
$scope.isBackupReady = function(copayer) {
|
||||||
|
return $rootScope.wallet.publicKeyRing.isBackupReady(copayer.copayerId);
|
||||||
|
}
|
||||||
|
|
||||||
$scope.getVideoURL = function(copayer) {
|
$scope.getVideoURL = function(copayer) {
|
||||||
if (config.disableVideo) return;
|
if (config.disableVideo) return;
|
||||||
|
|
||||||
var vi = $rootScope.videoInfo[copayer]
|
var vi = $scope.videoInfo[copayer.peerId];
|
||||||
if (!vi) return;
|
if (!vi) return;
|
||||||
|
|
||||||
if ($rootScope.wallet.getOnlinePeerIDs().indexOf(copayer) === -1) {
|
if ($scope.isConnected(copayer)) {
|
||||||
// peer disconnected, remove his video
|
// peer disconnected, remove his video
|
||||||
delete $rootScope.videoInfo[copayer]
|
delete $rootScope.videoInfo[copayer.peerId];
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
var encoded = vi.url;
|
var encoded = vi.url;
|
||||||
|
|
|
@ -0,0 +1,28 @@
|
||||||
|
<div ng-controller="VideoController">
|
||||||
|
Icon Copayers
|
||||||
|
{{$root.wallet.requiredCopayers}} of {{$root.wallet.totalCopayers}}
|
||||||
|
|
||||||
|
<ul class="copayer-list" ng-repeat="copayer in copayers">
|
||||||
|
<li>
|
||||||
|
<video
|
||||||
|
ng-if="hasVideo(copayer)"
|
||||||
|
peer="{{copayer}}" avatar autoplay
|
||||||
|
ng-class="isConnected(copayer) ? 'online' : 'offline'"
|
||||||
|
ng-src="{{getVideoURL(copayer)}}"></video>
|
||||||
|
|
||||||
|
<img
|
||||||
|
class="no-video"
|
||||||
|
ng-if="!hasVideo(copayer)"
|
||||||
|
ng-class="isConnected(copayer) ? 'online' : 'offline'"
|
||||||
|
src="./img/satoshi.gif"
|
||||||
|
alt="{{copayer}}">
|
||||||
|
|
||||||
|
<span
|
||||||
|
tooltip="ID: {{copayer.peerId}}"
|
||||||
|
tooltip-placement="bottom">
|
||||||
|
<span ng-show="copayer.index == 0">you</span>
|
||||||
|
<span ng-show="copayer.index > 0">{{copayer.nick}}</span>
|
||||||
|
</span>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
|
@ -52,9 +52,8 @@
|
||||||
</a>
|
</a>
|
||||||
</li>
|
</li>
|
||||||
</ul>
|
</ul>
|
||||||
{{$root.wallet.requiredCopayers}}-of-{{$root.wallet.totalCopayers}} wallet
|
|
||||||
|
|
||||||
<div ng-include="'views/includes/video.html'"></div>
|
<div ng-include="'views/includes/peer-list.html'"></div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
|
@ -1,30 +1,27 @@
|
||||||
<div
|
<div ng-controller="VideoController">
|
||||||
class="video-box"
|
<div class="video-box" ng-repeat="copayer in copayersList()">
|
||||||
ng-controller="VideoController"
|
<video
|
||||||
ng-repeat="c in $root.wallet.getRegisteredPeerIds()">
|
ng-if="hasVideo(copayer)"
|
||||||
<video
|
peer="{{copayer}}" avatar autoplay
|
||||||
ng-if="$root.videoInfo[c.peerId]"
|
ng-class="isConnected(copayer) ? 'online' : 'offline'"
|
||||||
avatar
|
ng-src="{{getVideoURL(copayer)}}"></video>
|
||||||
peer="{{c}}"
|
|
||||||
autoplay
|
<img
|
||||||
ng-class="($root.wallet.getOnlinePeerIDs().indexOf(c.peerId) != -1) ? 'online' : 'offline'"
|
class="no-video"
|
||||||
ng-src="{{getVideoURL(c.peerId)}}"
|
ng-if="!hasVideo(copayer)"
|
||||||
></video>
|
ng-class="isConnected(copayer) ? 'online' : 'offline'"
|
||||||
<img
|
src="./img/satoshi.gif"
|
||||||
class="no-video"
|
alt="{{copayer}}">
|
||||||
ng-if="!$root.videoInfo[c.peerId]"
|
|
||||||
avatar
|
<div
|
||||||
peer="{{c}}"
|
tooltip="ID: {{copayer.peerId}}"
|
||||||
ng-class="($root.wallet.getOnlinePeerIDs().indexOf(c.peerId) != -1) ? 'online' : 'offline'"
|
tooltip-placement="bottom">
|
||||||
src="./img/satoshi.gif"
|
<span ng-show="copayer.index == 0">you</span>
|
||||||
alt="{{c}}">
|
<span ng-show="copayer.index > 0">{{copayer.nick}}</span>
|
||||||
<div
|
</div>
|
||||||
tooltip="ID: {{c.peerId}}"
|
|
||||||
tooltip-placement="bottom">
|
<div class="success label" ng-show="isBackupReady(copayer)">
|
||||||
<span ng-show="c.index==0">you</span>
|
Backup ready
|
||||||
<span ng-show="c.index>0">{{c.nick}}</span>
|
</div>
|
||||||
</div>
|
|
||||||
<div class="success label" ng-show="$root.wallet.publicKeyRing.isBackupReady(c.copayerId)">
|
|
||||||
Backup ready
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
Loading…
Reference in New Issue