mirror of
https://github.com/nextcloud/passman.git
synced 2025-10-29 23:05:56 +08:00
Show spinner during vault decryption
This commit is contained in:
brantje
parent
994c9839fa
commit
e789ad4926
7 changed files with 139 additions and 53 deletions
41
css/app.css
41
css/app.css
|
|
@ -144,8 +144,14 @@
|
|||
overflow-x: hidden; }
|
||||
#app-content #app-content-wrapper {
|
||||
min-height: 95%; }
|
||||
#app-content #app-content-wrapper #controls {
|
||||
#app-content #app-content-wrapper #passman-controls {
|
||||
border-bottom: 1px solid #c9c9c9; }
|
||||
#app-content #app-content-wrapper .title {
|
||||
width: calc( 100% - 325px);
|
||||
text-align: center;
|
||||
display: inline-block;
|
||||
font-weight: bold;
|
||||
margin-top: 10px; }
|
||||
#app-content #app-content-wrapper .actions.creatable {
|
||||
float: left;
|
||||
overflow: hidden; }
|
||||
|
|
@ -166,11 +172,6 @@
|
|||
right: inherit;
|
||||
left: 10px;
|
||||
top: -19px; }
|
||||
#app-content #app-content-wrapper .actions.creatable .title {
|
||||
width: calc( 100% - 325px);
|
||||
text-align: center;
|
||||
display: inline-block;
|
||||
font-weight: bold; }
|
||||
#app-content #app-content-wrapper .searchboxContainer {
|
||||
display: inline-block;
|
||||
margin-right: 14px;
|
||||
|
|
@ -332,6 +333,34 @@
|
|||
background-image: none;
|
||||
background-color: #0082c9; }
|
||||
|
||||
.loaderContainer {
|
||||
height: 140px;
|
||||
width: 120px;
|
||||
margin-top: 30px;
|
||||
margin-left: -60px;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
position: absolute; }
|
||||
|
||||
.loaderContainer .text {
|
||||
width: 120px;
|
||||
text-align: center; }
|
||||
|
||||
.loader {
|
||||
border-bottom: 10px solid #1d2d44;
|
||||
border-left: 10px solid #c9c9c9;
|
||||
border-right: 10px solid #c9c9c9;
|
||||
border-top: 10px solid #c9c9c9;
|
||||
height: 120px;
|
||||
width: 120px;
|
||||
border-radius: 120px;
|
||||
animation: 1.1s linear 0s normal none infinite running load8; }
|
||||
|
||||
@keyframes load8 {
|
||||
0% {
|
||||
transform: rotate(0deg); }
|
||||
100% {
|
||||
transform: rotate(360deg); } }
|
||||
.settings-container div {
|
||||
padding-left: 15px; }
|
||||
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
|
|
@ -52,7 +52,7 @@ angular.module('passmanApp')
|
|||
var _credential = angular.copy(credential);
|
||||
$rootScope.$emit('app_menu', false);
|
||||
SettingsService.setSetting('share_credential', CredentialService.encryptCredential(_credential));
|
||||
$location.path('/vault/' + $scope.active_vault.vault_id + '/' + _credential.credential_id +'/share')
|
||||
$location.path('/vault/' + $scope.active_vault.vault_id + '/' + _credential.credential_id + '/share')
|
||||
};
|
||||
|
||||
var notification;
|
||||
|
|
@ -112,12 +112,12 @@ angular.module('passmanApp')
|
|||
|
||||
};
|
||||
|
||||
$scope.destroyCredential = function(credential){
|
||||
$scope.destroyCredential = function (credential) {
|
||||
var _credential = angular.copy(credential);
|
||||
CredentialService.destroyCredential(_credential.credential_id).then(function (result) {
|
||||
for (var i = 0; i < $scope.credentials.length; i++) {
|
||||
if ($scope.credentials[i].credential_id == credential.credential_id) {
|
||||
$scope.credentials.splice(i,1);
|
||||
$scope.credentials.splice(i, 1);
|
||||
NotificationService.showNotification('Credential destroyed', 5000);
|
||||
break;
|
||||
}
|
||||
|
|
@ -135,20 +135,20 @@ angular.module('passmanApp')
|
|||
var to;
|
||||
$rootScope.$on('selected_tags_updated', function (evt, _sTags) {
|
||||
var _selectedTags = [];
|
||||
for(var x = 0; x < _sTags.length; x++){
|
||||
for (var x = 0; x < _sTags.length; x++) {
|
||||
_selectedTags.push(_sTags[x].text)
|
||||
}
|
||||
$scope.selectedtags = _selectedTags;
|
||||
$timeout.cancel(to);
|
||||
if(_selectedTags.length > 0) {
|
||||
if (_selectedTags.length > 0) {
|
||||
to = $timeout(function () {
|
||||
if ($scope.filtered_credentials) {
|
||||
var _filtered_tags = [];
|
||||
for (var i = 0; i < $scope.filtered_credentials.length; i++) {
|
||||
var tags = $scope.filtered_credentials[i].tags_raw;
|
||||
for(var x = 0; x < tags.length; x++){
|
||||
for (var x = 0; x < tags.length; x++) {
|
||||
var tag = tags[x].text;
|
||||
if(_filtered_tags.indexOf(tag) === -1){
|
||||
if (_filtered_tags.indexOf(tag) === -1) {
|
||||
_filtered_tags.push(tag);
|
||||
}
|
||||
}
|
||||
|
|
@ -197,33 +197,46 @@ angular.module('passmanApp')
|
|||
|
||||
});
|
||||
|
||||
$scope.show_spinner = true;
|
||||
// A timeout give the browser some time to render a loading spinner.
|
||||
$timeout(function(){
|
||||
|
||||
try {
|
||||
var credential_cache = JSON.parse(CacheService.get('credential_cache_'+ $scope.active_vault.vault_id));
|
||||
if(credential_cache.length > 0){
|
||||
$scope.credentials = credential_cache;
|
||||
for (var i = 0; i < credential_cache.length; i++) {
|
||||
TagService.addTags(credential_cache[i].tags_raw);
|
||||
try {
|
||||
var credential_cache = JSON.parse(CacheService.get('credential_cache_' + $scope.active_vault.vault_id));
|
||||
if (credential_cache.length > 0) {
|
||||
$scope.show_spinner = false;
|
||||
$scope.credentials = credential_cache;
|
||||
for (var i = 0; i < credential_cache.length; i++) {
|
||||
TagService.addTags(credential_cache[i].tags_raw);
|
||||
}
|
||||
}
|
||||
} catch (e) {
|
||||
|
||||
}
|
||||
} catch (e){
|
||||
|
||||
}
|
||||
var fetchCredentials = function () {
|
||||
VaultService.getVault($scope.active_vault).then(function (credentials) {
|
||||
var _credentials = [];
|
||||
for (var i = 0; i < credentials.length; i++) {
|
||||
var _c = CredentialService.decryptCredential(angular.copy(credentials[i]));
|
||||
_c.tags_raw = _c.tags;
|
||||
TagService.addTags(_c.tags);
|
||||
_credentials.push(_c);
|
||||
}
|
||||
$scope.credentials = _credentials;
|
||||
$scope.show_spinner = false;
|
||||
CacheService.set('credential_cache_' + $scope.active_vault.vault_id, JSON.stringify(_credentials));
|
||||
|
||||
var fetchCredentials = function () {
|
||||
VaultService.getVault($scope.active_vault).then(function (credentials) {
|
||||
var _credentials = [];
|
||||
for (var i = 0; i < credentials.length; i++) {
|
||||
var _c = CredentialService.decryptCredential(angular.copy(credentials[i]));
|
||||
_c.tags_raw = _c.tags;
|
||||
TagService.addTags( _c.tags);
|
||||
_credentials.push(_c);
|
||||
}
|
||||
$scope.credentials = _credentials;
|
||||
CacheService.set('credential_cache_'+ $scope.active_vault.vault_id, JSON.stringify(_credentials));
|
||||
});
|
||||
};
|
||||
|
||||
if ($scope.active_vault) {
|
||||
$scope.$parent.selectedVault = true;
|
||||
fetchCredentials();
|
||||
}
|
||||
|
||||
}, 50);
|
||||
|
||||
});
|
||||
};
|
||||
|
||||
$scope.downloadFile = function (file) {
|
||||
FileService.getFile(file).then(function (result) {
|
||||
|
|
@ -238,8 +251,4 @@ angular.module('passmanApp')
|
|||
});
|
||||
};
|
||||
|
||||
if ($scope.active_vault) {
|
||||
$scope.$parent.selectedVault = true;
|
||||
fetchCredentials();
|
||||
}
|
||||
}]);
|
||||
|
|
|
|||
|
|
@ -10,9 +10,16 @@ angular.module('passmanApp')
|
|||
.directive('useTheme', ['$window', function ($window) {
|
||||
return {
|
||||
restrict: 'A',
|
||||
scope:{
|
||||
type: '=type'
|
||||
},
|
||||
link: function (scope, el, attr, ctrl) {
|
||||
var _color = $('#header').css('background-color');
|
||||
$(el).css('background-color', _color);
|
||||
if(!scope.type) {
|
||||
$(el).css('background-color', _color);
|
||||
} else {
|
||||
$(el).css(scope.type, _color);
|
||||
}
|
||||
}
|
||||
};
|
||||
}]);
|
||||
|
|
|
|||
|
|
@ -107,7 +107,7 @@ angular.module('views/share_credential.html', []).run(['$templateCache', functio
|
|||
angular.module('views/show_vault.html', []).run(['$templateCache', function($templateCache) {
|
||||
'use strict';
|
||||
$templateCache.put('views/show_vault.html',
|
||||
'<div id="passman-controls"><div class="breadcrumb"><div class="breadcrumb"><div class="crumb svg ui-droppable" data-dir="/"><a><i class="fa fa-home"></i></a></div><div class="crumb svg last"><a>{{active_vault.name}}</a></div></div></div><div class="actions creatable"><span ng-click="menuOpen = !menuOpen" class="button new" ng-init="menuOpen = false" off-click="menuOpen = false;"><span>+</span></span><div class="actionList popovermenu bubble menu" ng-show="menuOpen"><ul><li><span ng-click="addCredential()" class="menuitem action"><span class="icon icon-rename"></span> <span>New credential</span></span></li><li><span href="#" class="menuitem action"><span class="icon icon-shared"></span> <span>New shared credential</span></span>w</li></ul></div><span class="title" ng-if="delete_time">Showing deleted since: <span ng-if="delete_time == 1">All time</span> <span ng-if="delete_time > 1">{{delete_time | date:\'dd-MM-yyyy @ HH:mm:ss\'}}</span></span></div><div class="searchboxContainer"><input type="text" ng-model="filterOptions.filterText" class="searchbox" placeholder="Search credential..." select-on-click></div></div><div off-click="closeSelected()"><table class="credential-table" ng-init="menuOpen = false;"><tr ng-repeat="credential in credentials | credentialSearch:filterOptions | tagFilter:selectedtags | orderBy:\'label\'| as:this:\'filtered_credentials\'" ng-if="credential.hidden == 0 && showCredentialRow(credential)" ng-click="selectCredential(credential)" ng-class="{\'selected\': selectedCredential.credential_id == credential.credential_id}"><td><span class="icon"><i class="fa fa-lock"></i></span> <span class="label">{{credential.label}}</span> <span class="tags"><span class="tag" ng-repeat="tag in credential.tags_raw">{{tag.text}}</span></span></td></tr></table><div id="app-sidebar" class="detailsView scroll-container app_sidebar" ng-show="selectedCredential"><span class="close icon-close" ng-click="closeSelected()" alt="Close"></span><table><tr ng-show="selectedCredential.label"><td>Label</td><td>{{selectedCredential.label}}</td></tr><tr ng-show="selectedCredential.username"><td>Account</td><td><span credential-field value="selectedCredential.username"></span></td></tr><tr ng-show="selectedCredential.password"><td>Password</td><td><span credential-field value="selectedCredential.password" secret="\'true\'"></span></td></tr><tr ng-show="selectedCredential.otp.secret"><td>OTP</td><td><span otp-generator secret="selectedCredential.otp.secret"></span></td></tr><tr ng-show="selectedCredential.email"><td>E-mail</td><td><span credential-field value="selectedCredential.email"></span></td></tr><tr ng-show="selectedCredential.url"><td>URL</td><td><span credential-field value="selectedCredential.url"></span></td></tr><tr ng-show="selectedCredential.files.length > 0"><td>Files</td><td><div ng-repeat="file in selectedCredential.files" class="link" ng-click="downloadFile(file)">{{file.filename}} ({{file.size | bytes}})</div></td></tr><tr ng-repeat="field in selectedCredential.custom_fields"><td>{{field.label}}</td><td><span credential-field value="field.value" secret="field.secret"></span></td></tr><tr ng-show="selectedCredential.expire_time > 0"><td>Expire time</td><td>{{selectedCredential.expire_time * 1000 | date:\'dd-MM-yyyy @ HH:mm:ss\'}}</td></tr><tr ng-show="selectedCredential.changed"><td>Changed</td><td>{{selectedCredential.changed * 1000 | date:\'dd-MM-yyyy @ HH:mm:ss\'}}</td></tr><tr ng-show="selectedCredential.created"><td>Created</td><td>{{selectedCredential.created * 1000 | date:\'dd-MM-yyyy @ HH:mm:ss\'}}</td></tr></table><div class="tags"><span class="tag" ng-repeat="tag in selectedCredential.tags">{{tag.text}}</span></div><div ng-show="selectedCredential"><button class="button" ng-click="editCredential(selectedCredential)" ng-if="selectedCredential.delete_time == 0"><span class="fa fa-edit"></span> Edit</button> <button class="button" ng-click="deleteCredential(selectedCredential)" ng-if="selectedCredential.delete_time == 0"><span class="fa fa-trash"></span> Delete</button> <button class="button" ng-click="shareCredential(selectedCredential)" ng-if="selectedCredential.delete_time == 0"><span class="fa fa-share"></span> Share</button> <button class="button" ng-click="getRevisions(selectedCredential)" ng-if="selectedCredential.delete_time == 0"><span class="fa fa-undo"></span> Revisions</button> <button class="button" ng-if="selectedCredential.delete_time > 0" ng-click="recoverCredential(selectedCredential)"><span class="fa fa-recycle"></span> Recover</button> <button class="button" ng-if="selectedCredential.delete_time > 0" ng-click="destroyCredential(selectedCredential)"><span class="fa fa-bomb"></span> Destroy</button></div></div></div>');
|
||||
'<div id="passman-controls"><div class="breadcrumb"><div class="breadcrumb"><div class="crumb svg ui-droppable" data-dir="/"><a><i class="fa fa-home"></i></a></div><div class="crumb svg last"><a>{{active_vault.name}}</a></div></div></div><span class="title" ng-if="delete_time">Showing deleted since: <span ng-if="delete_time == 1">All time</span> <span ng-if="delete_time > 1">{{delete_time | date:\'dd-MM-yyyy @ HH:mm:ss\'}}</span></span><div class="actions creatable"><span ng-click="menuOpen = !menuOpen" class="button new" ng-init="menuOpen = false" off-click="menuOpen = false;"><span>+</span></span><div class="actionList popovermenu bubble menu" ng-show="menuOpen"><ul><li><span ng-click="addCredential()" class="menuitem action"><span class="icon icon-rename"></span> <span>New credential</span></span></li><li><span href="#" class="menuitem action"><span class="icon icon-shared"></span> <span>New shared credential</span></span>w</li></ul></div></div><div class="searchboxContainer"><input type="text" ng-model="filterOptions.filterText" class="searchbox" placeholder="Search credential..." select-on-click></div></div><div off-click="closeSelected()"><div class="loaderContainer" ng-show="show_spinner"><div class="loader" use-theme type="\'border-bottom-color\'"></div></div><table class="credential-table" ng-init="menuOpen = false;"><tr ng-repeat="credential in credentials | credentialSearch:filterOptions | tagFilter:selectedtags | orderBy:\'label\'| as:this:\'filtered_credentials\'" ng-if="credential.hidden == 0 && showCredentialRow(credential)" ng-click="selectCredential(credential)" ng-class="{\'selected\': selectedCredential.credential_id == credential.credential_id}"><td><span class="icon"><i class="fa fa-lock"></i></span> <span class="label">{{credential.label}}</span> <span class="tags"><span class="tag" ng-repeat="tag in credential.tags_raw">{{tag.text}}</span></span></td></tr></table><div id="app-sidebar" class="detailsView scroll-container app_sidebar" ng-show="selectedCredential"><span class="close icon-close" ng-click="closeSelected()" alt="Close"></span><table><tr ng-show="selectedCredential.label"><td>Label</td><td>{{selectedCredential.label}}</td></tr><tr ng-show="selectedCredential.username"><td>Account</td><td><span credential-field value="selectedCredential.username"></span></td></tr><tr ng-show="selectedCredential.password"><td>Password</td><td><span credential-field value="selectedCredential.password" secret="\'true\'"></span></td></tr><tr ng-show="selectedCredential.otp.secret"><td>OTP</td><td><span otp-generator secret="selectedCredential.otp.secret"></span></td></tr><tr ng-show="selectedCredential.email"><td>E-mail</td><td><span credential-field value="selectedCredential.email"></span></td></tr><tr ng-show="selectedCredential.url"><td>URL</td><td><span credential-field value="selectedCredential.url"></span></td></tr><tr ng-show="selectedCredential.files.length > 0"><td>Files</td><td><div ng-repeat="file in selectedCredential.files" class="link" ng-click="downloadFile(file)">{{file.filename}} ({{file.size | bytes}})</div></td></tr><tr ng-repeat="field in selectedCredential.custom_fields"><td>{{field.label}}</td><td><span credential-field value="field.value" secret="field.secret"></span></td></tr><tr ng-show="selectedCredential.expire_time > 0"><td>Expire time</td><td>{{selectedCredential.expire_time * 1000 | date:\'dd-MM-yyyy @ HH:mm:ss\'}}</td></tr><tr ng-show="selectedCredential.changed"><td>Changed</td><td>{{selectedCredential.changed * 1000 | date:\'dd-MM-yyyy @ HH:mm:ss\'}}</td></tr><tr ng-show="selectedCredential.created"><td>Created</td><td>{{selectedCredential.created * 1000 | date:\'dd-MM-yyyy @ HH:mm:ss\'}}</td></tr></table><div class="tags"><span class="tag" ng-repeat="tag in selectedCredential.tags">{{tag.text}}</span></div><div ng-show="selectedCredential"><button class="button" ng-click="editCredential(selectedCredential)" ng-if="selectedCredential.delete_time == 0"><span class="fa fa-edit"></span> Edit</button> <button class="button" ng-click="deleteCredential(selectedCredential)" ng-if="selectedCredential.delete_time == 0"><span class="fa fa-trash"></span> Delete</button> <button class="button" ng-click="shareCredential(selectedCredential)" ng-if="selectedCredential.delete_time == 0"><span class="fa fa-share"></span> Share</button> <button class="button" ng-click="getRevisions(selectedCredential)" ng-if="selectedCredential.delete_time == 0"><span class="fa fa-undo"></span> Revisions</button> <button class="button" ng-if="selectedCredential.delete_time > 0" ng-click="recoverCredential(selectedCredential)"><span class="fa fa-recycle"></span> Recover</button> <button class="button" ng-if="selectedCredential.delete_time > 0" ng-click="destroyCredential(selectedCredential)"><span class="fa fa-bomb"></span> Destroy</button></div></div></div>');
|
||||
}]);
|
||||
|
||||
angular.module('views/vaults.html', []).run(['$templateCache', function($templateCache) {
|
||||
|
|
|
|||
|
|
@ -2,9 +2,16 @@
|
|||
overflow-x: hidden;
|
||||
#app-content-wrapper {
|
||||
min-height: 95%;
|
||||
#controls{
|
||||
#passman-controls{
|
||||
border-bottom: 1px solid #c9c9c9
|
||||
}
|
||||
.title{
|
||||
width: calc( 100% - 325px);
|
||||
text-align: center;
|
||||
display: inline-block;
|
||||
font-weight: bold;
|
||||
margin-top: 10px;
|
||||
}
|
||||
.actions.creatable {
|
||||
float: left;
|
||||
overflow: hidden;
|
||||
|
|
@ -28,12 +35,7 @@
|
|||
left: 10px;
|
||||
top: -19px;
|
||||
}
|
||||
.title{
|
||||
width: calc( 100% - 325px);
|
||||
text-align: center;
|
||||
display: inline-block;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
|
@ -270,4 +272,37 @@
|
|||
background-image: none;
|
||||
background-color: #0082c9;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.loaderContainer{
|
||||
height: 140px;
|
||||
width: 120px;
|
||||
margin-top: 30px;
|
||||
margin-left: -60px;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
position: absolute;
|
||||
}
|
||||
.loaderContainer .text{
|
||||
width: 120px;
|
||||
text-align: center;
|
||||
}
|
||||
.loader{
|
||||
border-bottom: 10px solid #1d2d44;
|
||||
border-left: 10px solid #c9c9c9;
|
||||
border-right: 10px solid #c9c9c9;
|
||||
border-top: 10px solid #c9c9c9;
|
||||
height: 120px;
|
||||
width: 120px;
|
||||
border-radius: 120px;
|
||||
animation: 1.1s linear 0s normal none infinite running load8;
|
||||
}
|
||||
@keyframes load8 {
|
||||
0% {
|
||||
transform: rotate(0deg);
|
||||
}
|
||||
100% {
|
||||
transform: rotate(360deg);
|
||||
}
|
||||
}
|
||||
|
|
@ -9,6 +9,12 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<span class="title" ng-if="delete_time">
|
||||
Showing deleted since:
|
||||
<span ng-if="delete_time == 1">All time</span>
|
||||
<span ng-if="delete_time > 1">{{delete_time | date:'dd-MM-yyyy @ HH:mm:ss'}}</span>
|
||||
|
||||
</span>
|
||||
<div class="actions creatable">
|
||||
<span ng-click="menuOpen = !menuOpen" class="button new"
|
||||
ng-init="menuOpen = false" off-click="menuOpen = false;">
|
||||
|
|
@ -33,12 +39,7 @@
|
|||
</ul>
|
||||
</div>
|
||||
|
||||
<span class="title" ng-if="delete_time">
|
||||
Showing deleted since:
|
||||
<span ng-if="delete_time == 1">All time</span>
|
||||
<span ng-if="delete_time > 1">{{delete_time | date:'dd-MM-yyyy @ HH:mm:ss'}}</span>
|
||||
|
||||
</span>
|
||||
</div>
|
||||
<div class="searchboxContainer">
|
||||
<input type="text" ng-model="filterOptions.filterText" class="searchbox"
|
||||
|
|
@ -46,6 +47,11 @@
|
|||
</div>
|
||||
</div>
|
||||
<div off-click="closeSelected()">
|
||||
|
||||
<div class="loaderContainer" ng-show="show_spinner">
|
||||
<div class="loader" use-theme type="'border-bottom-color'"></div>
|
||||
</div>
|
||||
|
||||
<table class="credential-table" ng-init="menuOpen = false;">
|
||||
<tr ng-repeat="credential in credentials | credentialSearch:filterOptions | tagFilter:selectedtags | orderBy:'label'| as:this:'filtered_credentials'"
|
||||
ng-if="credential.hidden == 0 && showCredentialRow(credential)"
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue