1
0
mirror of https://github.com/bitwarden/browser.git synced 2024-11-22 11:45:59 +01:00

vault tuneups

This commit is contained in:
Kyle Spearrin 2016-09-09 23:00:11 -04:00
parent 59f72d6e09
commit 32b2eed66c
5 changed files with 98 additions and 139 deletions

View File

@ -1,12 +1,12 @@
angular
.module('bit.vault')
.controller('vaultAddSiteController', function ($scope, siteService, cipherService) {
.controller('vaultAddSiteController', function ($scope, $state, siteService, cipherService) {
$scope.site = {
folderId: null
};
$scope.createSite = function (model) {
$scope.save = function (model) {
cipherService.encryptSite(model, function (siteModel) {
var site = new Site(siteModel, true);
siteService.saveWithServer(site, function () {
@ -16,6 +16,6 @@
};
$scope.close = function () {
$scope.parentScope.closeAddSite();
$state.go('tabs.vault', { animation: 'out-slide-down' });
};
});

View File

@ -1,14 +1,26 @@
angular
.module('bit.vault')
.controller('vaultController', function ($scope, siteService, folderService, $q, cipherService) {
$scope.sites = [];
$scope.folders = [];
$scope.focusedSiteId = null;
.controller('vaultController', function ($scope, $rootScope, siteService, folderService, $q, cipherService) {
var delayLoad = true;
if (!$rootScope.vaultSites) {
$rootScope.vaultSites =[];
delayLoad = false;
}
if (!$rootScope.vaultFolders) {
$rootScope.vaultFolders = [];
delayLoad = false;
}
loadVault();
if (delayLoad) {
setTimeout(loadVault, 1000);
}
else {
loadVault();
}
function loadVault() {
var promises = [];
var decSites = [];
var decFolders = [{
id: null,
@ -17,8 +29,6 @@
folderService.getAll(function (folders) {
siteService.getAll(function (sites) {
var promises = [];
for (var i = 1; i < folders.length; i++) {
decFolders.push({
id: folders[i].id
@ -52,8 +62,8 @@
}
$q.all(promises).then(function () {
$scope.sites = decSites;
$scope.folders = decFolders;
$rootScope.vaultSites = decSites;
$rootScope.vaultFolders = decFolders;
});
});
});
@ -66,46 +76,4 @@
return item.name.toLowerCase();
};
/*
$scope.editSite = function (site) {
$scope.focusedSiteId = site.id;
$ionicModal.fromTemplateUrl('app/vault/views/vaultEditSite.html', {
scope: $scope,
animation: 'slide-in-up'
}).then(function (modal) {
$scope.editSiteModal = modal;
modal.show();
});
};
$scope.addSite = function () {
$ionicModal.fromTemplateUrl('app/vault/views/vaultAddSite.html', {
scope: $scope,
animation: 'slide-in-up'
}).then(function (modal) {
$scope.addSiteModal = modal;
modal.show();
});
};
*/
$scope.closeAddSite = function () {
$scope.addSiteModal.hide();
};
$scope.closeViewSite = function () {
$scope.viewSiteModal.hide();
$scope.focusedSiteId = null;
};
$scope.closeEditSite = function () {
$scope.editSiteModal.hide();
$scope.focusedSiteId = null;
};
$scope.$on('closeViewSite.hidden', function () {
console.log('modal hidden');
loadVault();
});
});

View File

@ -4,15 +4,15 @@
</div>
<div class="content content-tabs">
<div class="list">
<ng-repeat ng-repeat="folder in folders | orderBy: folderSort" ng-show="folders.length">
<div class="list-item-header">
<div class="list-grouped" ng-repeat="folder in vaultFolders | orderBy: folderSort" ng-show="vaultFolders.length">
<div class="list-grouped-header">
<i class="fa fa-folder-open"></i> {{folder.name}}
</div>
<a ui-sref="viewSite({siteId: site.id, animation: 'in-slide-up'})" class="list-item list-item-condensed" ng-repeat="site in folderSites = (sites | filter: { folderId: folder.id } | orderBy: ['name', 'username'])">
<a ui-sref="viewSite({siteId: site.id, animation: 'in-slide-up'})" class="list-grouped-item condensed" ng-repeat="site in folderSites = (vaultSites | filter: { folderId: folder.id } | orderBy: ['name', 'username'])">
<span class="text">{{site.name}}</span>
<span class="detail">{{site.username}}</span>
<!--<span class="btn btn-link pull-right"><i class="fa fa-ellipsis-h"></i></span>-->
</a>
</ng-repeat>
</div>
</div>
</div>

View File

@ -1,62 +1,64 @@
<div class="header">
<a ui-sref="tabs.vault({animation: 'out-slide-down'})" class="left">Close</a>
<a href="#" class="right">Save</a>
<div class="title">Add Site</div>
</div>
<div class="content">
<div class="list">
<div class="list-section">
<div class="list-section-header">
Site Information
</div>
<div class="list-section-items">
<div class="list-section-item">
<label for="name">Name</label>
<input id="name" type="text" ng-model="site.name">
<form name="theForm" ng-submit="theForm.$valid && save(site)">
<div class="header">
<a ng-click="close()" href class="left">Close</a>
<button type="submit" class="right btn btn-link">Save</button>
<div class="title">Add Site</div>
</div>
<div class="content">
<div class="list">
<div class="list-section">
<div class="list-section-header">
Site Information
</div>
<div class="list-section-item">
<label for="uri">URI</label>
<input id="uri" type="text" ng-model="site.uri">
</div>
<div class="list-section-item">
<label for="username">Username</label>
<input id="username" type="text" ng-model="site.username">
</div>
<div class="list-section-item">
<label for="password">Password</label>
<input id="password" type="password" ng-model="site.password">
</div>
<a class="list-section-item" href="#">
Generate Password
<i class="fa fa-chevron-right pull-right"></i>
</a>
</div>
</div>
<div class="list-section">
<div class="list-section-items">
<div class="list-section-item">
<label for="folder">Folder</label>
<select id="folder">
<option>Blue</option>
<option selected>Green</option>
<option>Red</option>
</select>
</div>
<div class="list-section-item list-section-item-checkbox">
<label for="favorite">Favorite</label>
<input id="favorite" type="checkbox" ng-model="site.favorite">
<div class="list-section-items">
<div class="list-section-item">
<label for="name">Name</label>
<input id="name" type="text" ng-model="site.name">
</div>
<div class="list-section-item">
<label for="uri">URI</label>
<input id="uri" type="text" ng-model="site.uri">
</div>
<div class="list-section-item">
<label for="username">Username</label>
<input id="username" type="text" ng-model="site.username">
</div>
<div class="list-section-item">
<label for="password">Password</label>
<input id="password" type="password" ng-model="site.password">
</div>
<a class="list-section-item" href="#">
Generate Password
<i class="fa fa-chevron-right pull-right"></i>
</a>
</div>
</div>
</div>
<div class="list-section">
<div class="list-section-header">
<label for="notes">Notes</label>
<div class="list-section">
<div class="list-section-items">
<div class="list-section-item">
<label for="folder">Folder</label>
<select id="folder">
<option>Blue</option>
<option selected>Green</option>
<option>Red</option>
</select>
</div>
<div class="list-section-item list-section-item-checkbox">
<label for="favorite">Favorite</label>
<input id="favorite" type="checkbox" ng-model="site.favorite">
</div>
</div>
</div>
<div class="list-section-items">
<div class="list-section-item">
<textarea id="notes" rows="5" ng-model="site.notes"></textarea>
<div class="list-section">
<div class="list-section-header">
<label for="notes">Notes</label>
</div>
<div class="list-section-items">
<div class="list-section-item">
<textarea id="notes" rows="5" ng-model="site.notes"></textarea>
</div>
</div>
</div>
</div>
</div>
</div>
</form>

View File

@ -14,12 +14,14 @@
right: 0;
overflow: hidden;
a {
a, button {
color: white !important;
text-decoration: none;
background: none;
&:hover {
background-color: rgba(255, 255, 255, 0.1);
text-decoration: none;
}
}
@ -100,21 +102,11 @@
}
.list {
.list-item {
border-top: 1px solid @border-color;
&:first-child {
border: none;
}
}
.list-item-header {
background-color: transparent;
padding: 10px 10px;
color: @gray-light;
+ .list-item {
border: none;
.list-grouped {
.list-grouped-header {
background-color: transparent;
padding: 10px 10px;
color: @gray-light;
}
}
@ -139,14 +131,6 @@
.list-section-items {
border-top: 1px solid @border-color-dark;
border-bottom: 1px solid @border-color-dark;
.list-section-item {
border-bottom: 1px solid @border-color;
&:last-child {
border: none;
}
}
}
.list-section-footer {
@ -156,7 +140,7 @@
}
}
.list-item, .list-section-item {
.list-grouped-item, .list-section-item {
display: block;
padding: 10px 10px;
background-color: white;
@ -165,12 +149,17 @@
overflow: hidden;
text-overflow: ellipsis;
color: @text-color;
border-bottom: 1px solid @border-color;
&:last-child {
border: none;
}
&:hover {
background-color: @list-item-hover;
}
&.list-item-condensed {
&.condensed {
padding: 3px 10px;
}
@ -219,7 +208,7 @@
}
&.list-no-selection {
.list-item, .list-section-item {
.list-grouped-item, .list-section-item {
&:hover {
background-color: white;
}