importer fixes for ipif and safe in cloud

Note that iOS does not support any other OAEP format, such as SHA256.

README.md

@@ -1,4 +1,4 @@
-[![appveyor build](https://ci.appveyor.com/api/projects/status/github/bitwarden/web?branch=master&svg=true)] (https://ci.appveyor.com/project/bitwarden/web) [![Join the chat at https://gitter.im/bitwarden/Lobby](https://badges.gitter.im/bitwarden/Lobby.svg)](https://gitter.im/bitwarden/Lobby)
+[![appveyor build](https://ci.appveyor.com/api/projects/status/github/bitwarden/web?branch=master&svg=true)](https://ci.appveyor.com/project/bitwarden/web) [![Join the chat at https://gitter.im/bitwarden/Lobby](https://badges.gitter.im/bitwarden/Lobby.svg)](https://gitter.im/bitwarden/Lobby)
 
 # bitwarden Web
 

bitwarden-web.sln

@@ -1,7 +1,7 @@
 
 Microsoft Visual Studio Solution File, Format Version 12.00
-# Visual Studio 14
-VisualStudioVersion = 14.0.25420.1
+# Visual Studio 15
+VisualStudioVersion = 15.0.26228.9
 MinimumVisualStudioVersion = 10.0.40219.1
 Project("{E24C65DC-7377-472B-9ABA-BC803B73C61A}") = "bitwarden-web", ".", "{25BEDEF4-2CAF-445A-807D-63C17FF85694}"
 	ProjectSection(WebsiteProperties) = preProject

gulpfile.js

@@ -18,7 +18,10 @@ var gulp = require('gulp'),
     project = require('./package.json'),
     jshint = require('gulp-jshint'),
     _ = require('lodash'),
-    webpack = require('webpack-stream');
+    webpack = require('webpack-stream'),
+    browserify = require('browserify'),
+    derequire = require('gulp-derequire'),
+    source = require('vinyl-source-stream');
 
 var paths = {};
 paths.dist = './dist/';
@@ -43,7 +46,7 @@ gulp.task('lint', function () {
 gulp.task('build', function (cb) {
     return runSequence(
         'clean',
-        ['lib', 'webpack', 'less', 'settings', 'lint'],
+        ['browserify', 'lib', 'webpack', 'less', 'settings', 'lint'],
         cb);
 });
 
@@ -108,8 +111,8 @@ gulp.task('lib', ['clean:lib'], function () {
             dest: paths.libDir + 'angular'
         },
         {
-            src: paths.npmDir + 'angular-bootstrap-npm/dist/*tpls*.js',
-            dest: paths.libDir + 'angular-bootstrap'
+            src: paths.npmDir + 'angular-ui-bootstrap/dist/*tpls*.js',
+            dest: paths.libDir + 'angular-ui-bootstrap'
         },
         {
             src: paths.npmDir + 'angular-bootstrap-show-errors/src/*.js',
@@ -123,10 +126,6 @@ gulp.task('lib', ['clean:lib'], function () {
             src: paths.npmDir + 'angular-jwt/dist/*.js',
             dest: paths.libDir + 'angular-jwt'
         },
-        {
-            src: paths.npmDir + 'angular-md5/angular-md5*.js',
-            dest: paths.libDir + 'angular-md5'
-        },
         {
             src: paths.npmDir + 'angular-resource/*resource*.js',
             dest: paths.libDir + 'angular-resource'
@@ -183,6 +182,7 @@ gulp.task('webpack:forge', function () {
     return gulp.src([
         forgeDir + 'pbkdf2.js',
         forgeDir + 'aes.js',
+        forgeDir + 'rsa.js',
         forgeDir + 'hmac.js',
         forgeDir + 'sha256.js',
         forgeDir + 'random.js',
@@ -214,9 +214,9 @@ function config() {
             constants: _.merge({}, {
                 appSettings: {
                     version: project.version,
-                    environment: project.production ? 'Production' : 'Development'
+                    environment: project.env
                 }
-            }, require('./settings' + (project.production ? '.Production' : '') + '.json') || {})
+            }, require('./settings' + (project.env !== 'Development' ? ('.' + project.env) : '') + '.json') || {})
         }));
 }
 
@@ -231,6 +231,35 @@ gulp.task('watch', function () {
     gulp.watch('./settings*.json', ['settings']);
 });
 
+gulp.task('browserify', ['browserify:stripe', 'browserify:cc']);
+
+gulp.task('browserify:stripe', function () {
+    return browserify(paths.npmDir + 'angular-stripe/src/index.js',
+        {
+            entry: '.',
+            standalone: 'angularStripe',
+            global: true
+        })
+        .transform('exposify', { expose: { angular: 'angular' } })
+        .bundle()
+        .pipe(source('angular-stripe.js'))
+        .pipe(derequire())
+        .pipe(gulp.dest(paths.libDir + 'angular-stripe'));
+});
+
+gulp.task('browserify:cc', function () {
+    return browserify(paths.npmDir + 'angular-credit-cards/src/index.js',
+        {
+            entry: '.',
+            standalone: 'angularCreditCards'
+        })
+        .transform('exposify', { expose: { angular: 'angular' } })
+        .bundle()
+        .pipe(source('angular-credit-cards.js'))
+        .pipe(derequire())
+        .pipe(gulp.dest(paths.libDir + 'angular-credit-cards'));
+});
+
 gulp.task('dist:clean', function (cb) {
     return rimraf(paths.dist, cb);
 });
@@ -331,7 +360,7 @@ gulp.task('dist:preprocess', function () {
         .src([
             paths.dist + '/**/*.html'
         ], { base: '.' })
-        .pipe(preprocess({ context: { cacheTag: randomString }}))
+        .pipe(preprocess({ context: { cacheTag: randomString } }))
         .pipe(gulp.dest('.'));
 });
 
@@ -348,6 +377,14 @@ gulp.task('deploy', ['dist'], function () {
         .pipe(ghPages({ cacheDir: paths.dist + '.publish' }));
 });
 
+gulp.task('deploy-preview', ['dist'], function () {
+    return gulp.src(paths.dist + '**/*')
+        .pipe(ghPages({
+            cacheDir: paths.dist + '.publish',
+            remoteUrl: 'git@github.com:bitwarden/web-preview.git'
+        }));
+});
+
 gulp.task('serve', function () {
     connect.server({
         port: 4001,

package.json

@@ -1,48 +1,52 @@
 {
   "name": "bitwarden",
-  "version": "1.9.0",
-  "production": true,
+  "version": "1.10.0",
+  "env": "Production",
   "devDependencies": {
-    "connect": "3.4.1",
-    "lodash": "4.13.1",
+    "connect": "3.6.0",
+    "lodash": "4.17.4",
     "gulp": "3.9.1",
-    "gulp-concat": "2.6.0",
+    "gulp-concat": "2.6.1",
     "gulp-cssmin": "0.1.7",
-    "gulp-less": "3.1.0",
+    "gulp-less": "3.3.0",
     "gulp-rename": "1.2.2",
-    "gulp-uglify": "1.5.3",
+    "gulp-uglify": "2.1.2",
     "gulp-gh-pages": "0.5.4",
     "gulp-preprocess": "2.0.0",
     "gulp-ng-annotate": "2.0.0",
-    "gulp-ng-config": "1.3.1",
+    "gulp-ng-config": "1.4.0",
     "gulp-connect": "5.0.0",
-    "jshint": "2.9.2",
-    "gulp-jshint": "2.0.1",
-    "rimraf": "2.5.2",
-    "run-sequence": "1.2.1",
-    "merge-stream": "1.0.0",
+    "jshint": "2.9.4",
+    "gulp-jshint": "2.0.4",
+    "rimraf": "2.6.1",
+    "run-sequence": "1.2.2",
+    "merge-stream": "1.0.1",
     "jquery": "2.2.4",
-    "font-awesome": "4.6.3",
-    "bootstrap": "3.3.6",
-    "angular": "1.5.6",
-    "angular-resource": "1.5.6",
-    "angular-bootstrap-npm": "0.14.3",
-    "angular-ui-router": "0.3.1",
-    "angular-jwt": "0.0.9",
-    "angular-cookies": "1.5.6",
-    "admin-lte": "2.3.5",
-    "angular-md5": "0.1.10",
-    "angular-toastr": "1.7.0",
+    "font-awesome": "4.7.0",
+    "bootstrap": "3.3.7",
+    "angular": "1.6.3",
+    "angular-resource": "1.6.3",
+    "angular-ui-bootstrap": "2.5.0",
+    "angular-ui-router": "0.4.2",
+    "angular-jwt": "0.1.9",
+    "angular-cookies": "1.6.3",
+    "admin-lte": "2.3.11",
+    "angular-toastr": "2.1.1",
     "angular-bootstrap-show-errors": "2.3.0",
-    "angular-messages": "1.5.6",
-    "ngstorage": "0.3.10",
-    "papaparse": "4.1.2",
-    "toastr": "2.1.2",
-    "clipboard": "1.5.12",
+    "angular-messages": "1.6.3",
+    "ngstorage": "0.3.11",
+    "papaparse": "4.2.0",
+    "clipboard": "1.6.1",
     "ngclipboard": "1.1.1",
-    "angulartics": "1.1.2",
-    "angulartics-google-analytics": "0.2.1",
-    "node-forge": "0.7.0",
-    "webpack-stream": "3.2.0"
+    "angulartics": "1.4.0",
+    "angulartics-google-analytics": "0.4.0",
+    "node-forge": "0.7.1",
+    "webpack-stream": "3.2.0",
+    "angular-stripe": "4.2.12",
+    "angular-credit-cards": "3.1.6",
+    "browserify": "14.1.0",
+    "vinyl-source-stream": "1.1.0",
+    "gulp-derequire": "2.1.0",
+    "exposify": "0.5.0"
   }
 }

settings.Preview.json

@@ -0,0 +1,5 @@
+{
+  "appSettings": {
+    "apiUri": "https://preview-api.bitwarden.com"
+  }
+}

settings.json

@@ -1,6 +1,5 @@
 {
   "appSettings": {
-    "rememberedEmailCookieName": "bit.rememberedEmail",
     "apiUri": "http://localhost:4000"
   }
 }

src/app/accounts/accountsLoginController.js

@@ -2,12 +2,25 @@ angular
     .module('bit.accounts')
 
     .controller('accountsLoginController', function ($scope, $rootScope, $cookies, apiService, cryptoService, authService,
-        $state, appSettings, $analytics) {
-        var rememberedEmail = $cookies.get(appSettings.rememberedEmailCookieName);
-        if (rememberedEmail) {
+        $state, constants, $analytics) {
+        $scope.state = $state;
+
+        var returnState;
+        if (!$state.params.returnState && $state.params.org) {
+            returnState = {
+                name: 'backend.user.settingsCreateOrg',
+                params: { plan: $state.params.org }
+            };
+        }
+        else {
+            returnState = $state.params.returnState;
+        }
+
+        var rememberedEmail = $cookies.get(constants.rememberedEmailCookieName);
+        if (rememberedEmail || $state.params.email) {
             $scope.model = {
-                email: rememberedEmail,
-                rememberEmail: true
+                email: $state.params.email ? $state.params.email : rememberedEmail,
+                rememberEmail: rememberedEmail !== null
             };
         }
 
@@ -23,12 +36,12 @@ angular
                     cookieExpiration.setFullYear(cookieExpiration.getFullYear() + 10);
 
                     $cookies.put(
-                        appSettings.rememberedEmailCookieName,
+                        constants.rememberedEmailCookieName,
                         model.email,
                         { expires: cookieExpiration });
                 }
                 else {
-                    $cookies.remove(appSettings.rememberedEmailCookieName);
+                    $cookies.remove(constants.rememberedEmailCookieName);
                 }
 
                 if (twoFactorProviders && twoFactorProviders.length > 0) {
@@ -36,11 +49,11 @@ angular
                     masterPassword = model.masterPassword;
 
                     $analytics.eventTrack('Logged In To Two-step');
-                    $state.go('frontend.login.twoFactor');
+                    $state.go('frontend.login.twoFactor', { returnState: returnState });
                 }
                 else {
                     $analytics.eventTrack('Logged In');
-                    $state.go('backend.vault');
+                    loggedInGo();
                 }
             });
         };
@@ -51,7 +64,16 @@ angular
 
             $scope.twoFactorPromise.then(function () {
                 $analytics.eventTrack('Logged In From Two-step');
-                $state.go('backend.vault');
+                loggedInGo();
             });
         };
+
+        function loggedInGo() {
+            if (returnState) {
+                $state.go(returnState.name, returnState.params);
+            }
+            else {
+                $state.go('backend.user.vault');
+            }
+        }
     });

src/app/accounts/accountsOrganizationAcceptController.js

@@ -0,0 +1,49 @@
+angular
+    .module('bit.accounts')
+
+    .controller('accountsOrganizationAcceptController', function ($scope, $state, apiService, authService, toastr, $analytics) {
+        $scope.state = {
+            name: $state.current.name,
+            params: $state.params
+        };
+
+        if (!$state.params.organizationId || !$state.params.organizationUserId || !$state.params.token ||
+            !$state.params.email || !$state.params.organizationName) {
+            $state.go('frontend.login.info').then(function () {
+                toastr.error('Invalid parameters.');
+            });
+            return;
+        }
+
+        $scope.$on('$viewContentLoaded', function () {
+            if (authService.isAuthenticated()) {
+                $scope.accepting = true;
+                apiService.organizationUsers.accept(
+                    {
+                        orgId: $state.params.organizationId,
+                        id: $state.params.organizationUserId
+                    },
+                    {
+                        token: $state.params.token
+                    }, function () {
+                        $analytics.eventTrack('Accepted Invitation');
+                        $state.go('backend.user.vault', null, { location: 'replace' }).then(function () {
+                            toastr.success('You can access this organization once an administrator confirms your membership.' +
+                                ' We\'ll send an email when that happens.', 'Invite Accepted', { timeOut: 10000 });
+                        });
+                    }, function () {
+                        $analytics.eventTrack('Failed To Accept Invitation');
+                        $state.go('backend.user.vault', null, { location: 'replace' }).then(function () {
+                            toastr.error('Unable to accept invitation.', 'Error');
+                        });
+                    });
+            }
+            else {
+                $scope.loading = false;
+            }
+        });
+
+        $scope.submit = function (model) {
+
+        };
+    });

src/app/accounts/accountsPasswordHintController.js

@@ -1,11 +1,12 @@
 angular
     .module('bit.accounts')
 
-    .controller('accountsPasswordHintController', function ($scope, $rootScope, apiService) {
+    .controller('accountsPasswordHintController', function ($scope, $rootScope, apiService, $analytics) {
         $scope.success = false;
 
         $scope.submit = function (model) {
             $scope.submitPromise = apiService.accounts.postPasswordHint({ email: model.email }, function () {
+                $analytics.eventTrack('Requested Password Hint');
                 $scope.success = true;
             }).$promise;
         };

src/app/accounts/accountsRecoverController.js

@@ -1,7 +1,7 @@
 angular
     .module('bit.accounts')
 
-    .controller('accountsRecoverController', function ($scope, apiService, cryptoService) {
+    .controller('accountsRecoverController', function ($scope, apiService, cryptoService, $analytics) {
         $scope.success = false;
 
         $scope.submit = function (model) {
@@ -15,6 +15,7 @@ angular
             };
 
             $scope.submitPromise = apiService.accounts.postTwoFactorRecover(request, function () {
+                $analytics.eventTrack('Recovered 2FA');
                 $scope.success = true;
             }).$promise;
         };

src/app/accounts/accountsRegisterController.js

@@ -1,13 +1,27 @@
 angular
     .module('bit.accounts')
 
-    .controller('accountsRegisterController', function ($scope, $location, apiService, cryptoService, validationService, $analytics) {
+    .controller('accountsRegisterController', function ($scope, $location, apiService, cryptoService, validationService,
+        $analytics, $state) {
         var params = $location.search();
+        var stateParams = $state.params;
+        $scope.createOrg = stateParams.org;
+
+        if (!stateParams.returnState && stateParams.org) {
+            $scope.returnState = {
+                name: 'backend.user.settingsCreateOrg',
+                params: { plan: $state.params.org }
+            };
+        }
+        else {
+            $scope.returnState = stateParams.returnState;
+        }
 
         $scope.success = false;
         $scope.model = {
-            email: params.email
+            email: params.email ? params.email : stateParams.email
         };
+        $scope.readOnlyEmail = stateParams.email !== null;
 
         $scope.registerPromise = null;
         $scope.register = function (form) {
@@ -28,16 +42,30 @@ angular
 
             var email = $scope.model.email.toLowerCase();
             var key = cryptoService.makeKey($scope.model.masterPassword, email);
-            var request = {
-                name: $scope.model.name,
-                email: email,
-                masterPasswordHash: cryptoService.hashPassword($scope.model.masterPassword, key),
-                masterPasswordHint: $scope.model.masterPasswordHint
-            };
 
-            $scope.registerPromise = apiService.accounts.register(request, function () {
+            $scope.registerPromise = cryptoService.makeKeyPair(key).then(function (result) {
+                var request = {
+                    name: $scope.model.name,
+                    email: email,
+                    masterPasswordHash: cryptoService.hashPassword($scope.model.masterPassword, key),
+                    masterPasswordHint: $scope.model.masterPasswordHint,
+                    keys: {
+                        publicKey: result.publicKey,
+                        encryptedPrivateKey: result.privateKeyEnc
+                    }
+                };
+
+                return apiService.accounts.register(request).$promise;
+            }, function (errors) {
+                validationService.addError(form, null, 'Problem generating keys.', true);
+                return false;
+            }).then(function (result) {
+                if (result === false) {
+                    return;
+                }
+
                 $scope.success = true;
                 $analytics.eventTrack('Registered');
-            }).$promise;
+            });
         };
     });

src/app/accounts/views/accountsLoginInfo.html

@@ -35,7 +35,15 @@
     </div>
     <hr />
     <ul>
-        <li><a ui-sref="frontend.register">Create a new account</a></li>
-        <li><a ui-sref="frontend.passwordHint">Get master password hint</a></li>
+        <li>
+            <a ui-sref="frontend.register({returnState: state.params.returnState, email: state.params.email})">
+                Create a new account
+            </a>
+        </li>
+        <li>
+            <a ui-sref="frontend.passwordHint">
+                Get master password hint
+            </a>
+        </li>
     </ul>
 </form>

src/app/accounts/views/accountsOrganizationAccept.html

@@ -0,0 +1,32 @@
+<div class="login-box">
+    <div class="login-logo">
+        <i class="fa fa-shield"></i> <b>bit</b>warden
+    </div>
+    <div class="login-box-body">
+        <div ng-show="loading">
+            Loading...
+        </div>
+        <div ng-show="accepting">
+            Accepting invitation...
+        </div>
+        <div ng-show="!loading && !accepting">
+            <p class="login-box-msg">Join {{state.params.organizationName}}</p>
+            <p class="text-center"><strong>{{state.params.email}}</strong></p>
+            <p>
+                You've been invited to join the organization listed above.
+                To accept the invitation, you need to log in or create a new bitwarden account.
+            </p>
+            <hr />
+            <div class="row">
+                <div class="col-sm-6">
+                    <a ui-sref="frontend.login.info({returnState: state, email: state.params.email})"
+                       class="btn btn-primary btn-block btn-flat">Log In</a>
+                </div>
+                <div class="col-sm-6">
+                    <a ui-sref="frontend.register({returnState: state, email: state.params.email})"
+                       class="btn btn-primary btn-block btn-flat">Create Account</a>
+                </div>
+            </div>
+        </div>
+    </div>
+</div>

src/app/accounts/views/accountsRegister.html

@@ -9,10 +9,14 @@
                 <h4>Account Created!</h4>
                 <p>You may now log in to your new account.</p>
             </div>
-            <a ui-sref="frontend.login.info">Ready to log in?</a>
+            <a ui-sref="frontend.login.info({returnState: returnState, email: model.email})">Ready to log in?</a>
         </div>
         <form name="registerForm" ng-submit="registerForm.$valid && register(registerForm)" ng-show="!success"
               api-form="registerPromise">
+            <div class="callout callout-default" ng-show="createOrg">
+                <h4>Create Organization, Step 1</h4>
+                <p>Before creating your organization, you first need to create a free personal account.</p>
+            </div>
             <div class="callout callout-danger validation-errors" ng-show="registerForm.$errors">
                 <h4>Errors have occured</h4>
                 <ul>
@@ -22,7 +26,7 @@
             <div class="form-group has-feedback" show-errors>
                 <label for="email" class="sr-only">Email</label>
                 <input type="email" id="email" name="Email" class="form-control" placeholder="Email" ng-model="model.email"
-                       required api-field />
+                       ng-readonly="readOnlyEmail" required api-field />
                 <span class="fa fa-envelope form-control-feedback"></span>
                 <p class="help-block">You'll use your email address to log in.</p>
             </div>
@@ -60,7 +64,7 @@
             </div>
             <div class="row">
                 <div class="col-xs-7">
-                    <a ui-sref="frontend.login.info">Already have an account?</a>
+                    <a ui-sref="frontend.login.info({returnState: returnState})">Already have an account?</a>
                 </div>
                 <div class="col-xs-5">
                     <button type="submit" class="btn btn-primary btn-block btn-flat" ng-disabled="registerForm.$loading">

src/app/app.js

@@ -3,18 +3,21 @@
         'ui.router',
         'ngMessages',
         'angular-jwt',
-        'angular-md5',
         'ui.bootstrap.showErrors',
         'toastr',
         'angulartics',
         'angulartics.google.analytics',
+        'angular-stripe',
+        'credit-cards',
 
         'bit.directives',
+        'bit.filters',
         'bit.services',
 
         'bit.global',
         'bit.accounts',
         'bit.vault',
         'bit.settings',
-        'bit.tools'
+        'bit.tools',
+        'bit.organization'
     ]);

src/app/config.js

@@ -1,11 +1,17 @@
 angular
     .module('bit')
 
-    .config(function ($stateProvider, $urlRouterProvider, $httpProvider, jwtInterceptorProvider, $uibTooltipProvider, toastrConfig) {
-        jwtInterceptorProvider.urlParam = 'access_token2';
+    .config(function ($stateProvider, $urlRouterProvider, $httpProvider, jwtInterceptorProvider, jwtOptionsProvider,
+        $uibTooltipProvider, toastrConfig, $locationProvider, $qProvider, stripeProvider) {
+        $qProvider.errorOnUnhandledRejections(false);
+        $locationProvider.hashPrefix('');
+        jwtOptionsProvider.config({
+            urlParam: 'access_token2',
+            whiteListedDomains: ['api.bitwarden.com', 'preview-api.bitwarden.com', 'localhost', '192.168.1.8']
+        });
         var refreshPromise;
-        jwtInterceptorProvider.tokenGetter = /*@ngInject*/ function (config, appSettings, tokenService, apiService, jwtHelper, $q) {
-            if (config.url.indexOf(appSettings.apiUri) !== 0) {
+        jwtInterceptorProvider.tokenGetter = /*@ngInject*/ function (options, appSettings, tokenService, authService) {
+            if (options.url.indexOf(appSettings.apiUri) !== 0) {
                 return;
             }
 
@@ -22,26 +28,15 @@ angular
                 return token;
             }
 
-            var refreshToken = tokenService.getRefreshToken();
-            if (!refreshToken) {
-                return;
-            }
-
-            var deferred = $q.defer();
-            apiService.identity.token({
-                grant_type: 'refresh_token',
-                client_id: 'web',
-                refresh_token: refreshToken
-            }, function (response) {
-                tokenService.setToken(response.access_token);
-                tokenService.setRefreshToken(response.refresh_token);
+            refreshPromise = authService.refreshAccessToken().then(function (newToken) {
                 refreshPromise = null;
-                deferred.resolve(response.access_token);
+                return newToken || token;
             });
-            refreshPromise = deferred.promise;
             return refreshPromise;
         };
 
+        stripeProvider.setPublishableKey('pk_live_bpN0P37nMxrMQkcaHXtAybJk');
+
         angular.extend(toastrConfig, {
             closeButton: true,
             progressBar: true,
@@ -52,7 +47,6 @@ angular
         $uibTooltipProvider.options({
             popupDelay: 600,
             appendToBody: true
-
         });
 
         if ($httpProvider.defaults.headers.post) {
@@ -67,7 +61,7 @@ angular
         $urlRouterProvider.otherwise('/');
 
         $stateProvider
-        // Backend
+            // Backend
             .state('backend', {
                 templateUrl: 'app/views/backendLayout.html',
                 abstract: true,
@@ -75,32 +69,103 @@ angular
                     authorize: true
                 }
             })
-            .state('backend.vault', {
+            .state('backend.user', {
+                templateUrl: 'app/views/userLayout.html',
+                abstract: true
+            })
+            .state('backend.user.vault', {
                 url: '^/vault',
                 templateUrl: 'app/vault/views/vault.html',
                 controller: 'vaultController',
-                data: { pageTitle: 'My Vault' }
+                data: { pageTitle: 'My Vault' },
+                params: {
+                    refreshFromServer: false
+                }
             })
-            .state('backend.settings', {
+            .state('backend.user.shared', {
+                url: '^/shared',
+                templateUrl: 'app/vault/views/vaultShared.html',
+                controller: 'vaultSharedController',
+                data: { pageTitle: 'Shared' }
+            })
+            .state('backend.user.settings', {
                 url: '^/settings',
                 templateUrl: 'app/settings/views/settings.html',
                 controller: 'settingsController',
                 data: { pageTitle: 'Settings' }
             })
-            .state('backend.settingsDomains', {
+            .state('backend.user.settingsDomains', {
                 url: '^/settings/domains',
                 templateUrl: 'app/settings/views/settingsDomains.html',
                 controller: 'settingsDomainsController',
                 data: { pageTitle: 'Domain Settings' }
             })
-            .state('backend.tools', {
+            .state('backend.user.settingsCreateOrg', {
+                url: '^/settings/create-organization',
+                templateUrl: 'app/settings/views/settingsCreateOrganization.html',
+                controller: 'settingsCreateOrganizationController',
+                data: { pageTitle: 'Create Organization' }
+            })
+            .state('backend.user.tools', {
                 url: '^/tools',
                 templateUrl: 'app/tools/views/tools.html',
                 controller: 'toolsController',
                 data: { pageTitle: 'Tools' }
             })
+            .state('backend.user.apps', {
+                url: '^/apps',
+                templateUrl: 'app/views/apps.html',
+                controller: 'appsController',
+                data: { pageTitle: 'Get the Apps' }
+            })
+            .state('backend.org', {
+                templateUrl: 'app/views/organizationLayout.html',
+                abstract: true
+            })
+            .state('backend.org.dashboard', {
+                url: '^/organization/:orgId',
+                templateUrl: 'app/organization/views/organizationDashboard.html',
+                controller: 'organizationDashboardController',
+                data: { pageTitle: 'Organization Dashboard' }
+            })
+            .state('backend.org.people', {
+                url: '/organization/:orgId/people',
+                templateUrl: 'app/organization/views/organizationPeople.html',
+                controller: 'organizationPeopleController',
+                data: { pageTitle: 'Organization People' }
+            })
+            .state('backend.org.collections', {
+                url: '/organization/:orgId/collections',
+                templateUrl: 'app/organization/views/organizationCollections.html',
+                controller: 'organizationCollectionsController',
+                data: { pageTitle: 'Organization Collections' }
+            })
+            .state('backend.org.settings', {
+                url: '/organization/:orgId/settings',
+                templateUrl: 'app/organization/views/organizationSettings.html',
+                controller: 'organizationSettingsController',
+                data: { pageTitle: 'Organization Settings' }
+            })
+            .state('backend.org.billing', {
+                url: '/organization/:orgId/billing',
+                templateUrl: 'app/organization/views/organizationBilling.html',
+                controller: 'organizationBillingController',
+                data: { pageTitle: 'Organization Billing' }
+            })
+            .state('backend.org.vault', {
+                url: '/organization/:orgId/vault',
+                templateUrl: 'app/organization/views/organizationVault.html',
+                controller: 'organizationVaultController',
+                data: { pageTitle: 'Organization Vault' }
+            })
+            .state('backend.org.groups', {
+                url: '/organization/:orgId/groups',
+                templateUrl: 'app/organization/views/organizationGroups.html',
+                controller: 'organizationGroupsController',
+                data: { pageTitle: 'Organization Groups' }
+            })
 
-        // Frontend
+            // Frontend
             .state('frontend', {
                 templateUrl: 'app/views/frontendLayout.html',
                 abstract: true,
@@ -111,12 +176,16 @@ angular
             .state('frontend.login', {
                 templateUrl: 'app/accounts/views/accountsLogin.html',
                 controller: 'accountsLoginController',
+                params: {
+                    returnState: null,
+                    email: null
+                },
                 data: {
                     bodyClass: 'login-page'
                 }
             })
             .state('frontend.login.info', {
-                url: '^/',
+                url: '^/?org',
                 templateUrl: 'app/accounts/views/accountsLoginInfo.html',
                 data: {
                     pageTitle: 'Log In'
@@ -156,23 +225,46 @@ angular
                 }
             })
             .state('frontend.register', {
-                url: '^/register',
+                url: '^/register?org',
                 templateUrl: 'app/accounts/views/accountsRegister.html',
                 controller: 'accountsRegisterController',
+                params: {
+                    returnState: null,
+                    email: null
+                },
                 data: {
                     pageTitle: 'Register',
                     bodyClass: 'register-page'
                 }
+            })
+            .state('frontend.organizationAccept', {
+                url: '^/accept-organization?organizationId&organizationUserId&token&email&organizationName',
+                templateUrl: 'app/accounts/views/accountsOrganizationAccept.html',
+                controller: 'accountsOrganizationAcceptController',
+                data: {
+                    pageTitle: 'Accept Organization Invite',
+                    bodyClass: 'login-page',
+                    skipAuthorize: true
+                }
             });
     })
-    .run(function ($rootScope, authService, jwtHelper, tokenService, $state) {
+    .run(function ($rootScope, authService, $state) {
+        $rootScope.$on('$stateChangeSuccess', function () {
+            $('html, body').animate({ scrollTop: 0 }, 200);
+        });
+
         $rootScope.$on('$stateChangeStart', function (event, toState, toParams) {
             if (!toState.data || !toState.data.authorize) {
-                if (authService.isAuthenticated()) {
-                    event.preventDefault();
-                    $state.go('backend.vault');
+                if (toState.data && toState.data.skipAuthorize) {
+                    return;
                 }
 
+                if (!authService.isAuthenticated()) {
+                    return;
+                }
+
+                event.preventDefault();
+                $state.go('backend.user.vault');
                 return;
             }
 
@@ -180,6 +272,22 @@ angular
                 event.preventDefault();
                 authService.logOut();
                 $state.go('frontend.login.info');
+                return;
+            }
+
+            // user is guaranteed to be authenticated becuase of previous check
+            if (toState.name.indexOf('backend.org.') > -1 && toParams.orgId) {
+                // clear vault rootScope when visiting org admin section
+                $rootScope.vaultLogins = $rootScope.vaultFolders = null;
+
+                authService.getUserProfile().then(function (profile) {
+                    var orgs = profile.organizations;
+                    if (!orgs || !(toParams.orgId in orgs) || orgs[toParams.orgId].status !== 2 ||
+                        orgs[toParams.orgId].type === 2) {
+                        event.preventDefault();
+                        $state.go('backend.user.vault');
+                    }
+                });
             }
         });
     });

src/app/constants.js

@@ -0,0 +1,51 @@
+angular.module('bit')
+    .constant('constants', {
+        rememberedEmailCookieName: 'bit.rememberedEmail',
+        encType: {
+            AesCbc256_B64: 0,
+            AesCbc128_HmacSha256_B64: 1,
+            AesCbc256_HmacSha256_B64: 2,
+            Rsa2048_OaepSha256_B64: 3,
+            Rsa2048_OaepSha1_B64: 4
+        },
+        orgUserType: {
+            owner: 0,
+            admin: 1,
+            user: 2
+        },
+        orgUserStatus: {
+            invited: 0,
+            accepted: 1,
+            confirmed: 2
+        },
+        plans: {
+            free: {
+                basePrice: 0,
+                noAdditionalSeats: true,
+                noPayment: true,
+                upgradeSortOrder: -1
+            },
+            personal: {
+                basePrice: 1,
+                annualBasePrice: 12,
+                baseSeats: 5,
+                seatPrice: 1,
+                annualSeatPrice: 12,
+                maxAdditionalSeats: 5,
+                annualPlanType: 'personalAnnually',
+                upgradeSortOrder: 1
+            },
+            teams: {
+                basePrice: 5,
+                annualBasePrice: 60,
+                monthlyBasePrice: 8,
+                baseSeats: 5,
+                seatPrice: 2,
+                annualSeatPrice: 24,
+                monthlySeatPrice: 2.5,
+                monthPlanType: 'teamsMonthly',
+                annualPlanType: 'teamsAnnually',
+                upgradeSortOrder: 2
+            }
+        }
+    });

src/app/directives/apiFormDirective.js

@@ -30,6 +30,7 @@ angular
                 form.$loading = false;
                 validationService.addErrors(form, reason);
                 scope.$broadcast('show-errors-check-validity');
+                $('html, body').animate({ scrollTop: 0 }, 200);
             });
         }
     });

src/app/directives/letterAvatarDirective.js

@@ -0,0 +1,151 @@
+angular
+    .module('bit.directives')
+
+    // adaptation of https://github.com/uttesh/ngletteravatar
+    .directive('letterAvatar', function () {
+        // ref: http://stackoverflow.com/a/16348977/1090359
+        function stringToColor(str) {
+            var hash = 0,
+                i = 0;
+            for (i = 0; i < str.length; i++) {
+                hash = str.charCodeAt(i) + ((hash << 5) - hash);
+            }
+
+            var color = '#';
+            for (i = 0; i < 3; i++) {
+                var value = (hash >> (i * 8)) & 0xFF;
+                color += ('00' + value.toString(16)).substr(-2);
+            }
+
+            return color;
+        }
+
+        function getFirstLetters(data, count) {
+            var parts = data.split(' ');
+            if (parts && parts.length > 1) {
+                var text = '';
+                for (var i = 0; i < count; i++) {
+                    text += parts[i].substr(0, 1);
+                }
+                return text;
+            }
+
+            return null;
+        }
+
+        function getSvg(width, height, color) {
+            var svgTag = angular.element('<svg></svg>')
+                .attr({
+                    'xmlns': 'http://www.w3.org/2000/svg',
+                    'pointer-events': 'none',
+                    'width': width,
+                    'height': height
+                })
+                .css({
+                    'background-color': color,
+                    'width': width + 'px',
+                    'height': height + 'px'
+                });
+
+            return svgTag;
+        }
+
+        function getCharText(character, textColor, fontFamily, fontWeight, fontsize) {
+            var textTag = angular.element('<text text-anchor="middle"></text>')
+                .attr({
+                    'y': '50%',
+                    'x': '50%',
+                    'dy': '0.35em',
+                    'pointer-events': 'auto',
+                    'fill': textColor,
+                    'font-family': fontFamily
+                })
+                .text(character)
+                .css({
+                    'font-weight': fontWeight,
+                    'font-size': fontsize + 'px',
+                });
+
+            return textTag;
+        }
+
+        return {
+            restrict: 'AE',
+            replace: true,
+            scope: {
+                data: '@'
+            },
+            link: function (scope, element, attrs) {
+                var params = {
+                    charCount: attrs.charcount || 2,
+                    data: attrs.data,
+                    textColor: attrs.textcolor || '#ffffff',
+                    bgColor: attrs.bgcolor,
+                    height: attrs.avheight || 45,
+                    width: attrs.avwidth || 45,
+                    fontSize: attrs.fontsize || 20,
+                    fontWeight: attrs.fontweight || 300,
+                    fontFamily: attrs.fontfamily || 'Open Sans, HelveticaNeue-Light, Helvetica Neue Light, ' +
+                    'Helvetica Neue, Helvetica, Arial, Lucida Grande, sans-serif',
+                    round: attrs.round || 'true',
+                    dynamic: attrs.dynamic || 'true',
+                    class: attrs.avclass || '',
+                    border: attrs.avborder || 'false',
+                    borderStyle: attrs.borderstyle || '3px solid white'
+                };
+
+                if (params.dynamic === 'true') {
+                    scope.$watch('data', function () {
+                        generateLetterAvatar();
+                    });
+                }
+                else {
+                    generateLetterAvatar();
+                }
+
+                function generateLetterAvatar() {
+                    var c = null,
+                        upperData = scope.data.toUpperCase();
+
+                    if (params.charCount > 1) {
+                        c = getFirstLetters(upperData, params.charCount);
+                    }
+
+                    if (!c) {
+                        c = upperData.substr(0, params.charCount);
+                    }
+
+                    var cobj = getCharText(c, params.textColor, params.fontFamily, params.fontWeight, params.fontSize);
+                    var color = params.bgColor ? params.bgColor : stringToColor(upperData);
+                    var svg = getSvg(params.width, params.height, color);
+                    svg.append(cobj);
+                    var lvcomponent = angular.element('<div>').append(svg).html();
+
+                    var svgHtml = window.btoa(unescape(encodeURIComponent(lvcomponent)));
+                    var src = 'data:image/svg+xml;base64,' + svgHtml;
+
+                    var img = angular.element('<img>').attr({ src: src, title: scope.data });
+
+                    if (params.round === 'true') {
+                        img.css('border-radius', '50%');
+                    }
+
+                    if (params.border === 'true') {
+                        img.css('border', params.borderStyle);
+                    }
+
+                    if (params.class) {
+                        img.addClass(params.class);
+                    }
+
+                    if (params.dynamic === 'true') {
+                        element.empty();
+                        element.append(img);
+                    }
+                    else {
+                        element.replaceWith(img);
+                    }
+                }
+            }
+        };
+    });

src/app/directives/masterPasswordDirective.js

@@ -6,34 +6,31 @@ angular
             require: 'ngModel',
             restrict: 'A',
             link: function (scope, elem, attr, ngModel) {
-                var profile = authService.getUserProfile();
-                if (!profile) {
-                    return;
-                }
+                authService.getUserProfile().then(function (profile) {
+                    // For DOM -> model validation
+                    ngModel.$parsers.unshift(function (value) {
+                        if (!value) {
+                            return undefined;
+                        }
 
-                // For DOM -> model validation
-                ngModel.$parsers.unshift(function (value) {
-                    if (!value) {
-                        return undefined;
-                    }
+                        var key = cryptoService.makeKey(value, profile.email);
+                        var valid = key.keyB64 === cryptoService.getKey().keyB64;
+                        ngModel.$setValidity('masterPassword', valid);
+                        return valid ? value : undefined;
+                    });
 
-                    var key = cryptoService.makeKey(value, profile.email, true);
-                    var valid = key === cryptoService.getKey(true);
-                    ngModel.$setValidity('masterPassword', valid);
-                    return valid ? value : undefined;
-                });
+                    // For model -> DOM validation
+                    ngModel.$formatters.unshift(function (value) {
+                        if (!value) {
+                            return undefined;
+                        }
 
-                // For model -> DOM validation
-                ngModel.$formatters.unshift(function (value) {
-                    if (!value) {
-                        return undefined;
-                    }
+                        var key = cryptoService.makeKey(value, profile.email);
+                        var valid = key.keyB64 === cryptoService.getKey().keyB64;
 
-                    var key = cryptoService.makeKey(value, profile.email, true);
-                    var valid = key === cryptoService.getKey(true);
-
-                    ngModel.$setValidity('masterPassword', valid);
-                    return value;
+                        ngModel.$setValidity('masterPassword', valid);
+                        return value;
+                    });
                 });
             }
         };

src/app/filters/enumLabelClassFilter.js

@@ -0,0 +1,32 @@
+angular
+    .module('bit.filters')
+
+    .filter('enumLabelClass', function () {
+        return function (input, name) {
+            if (typeof input !== 'number') {
+                return input.toString();
+            }
+
+            var output;
+            switch (name) {
+                case 'OrgUserStatus':
+                    switch (input) {
+                        case 0:
+                            output = 'label-default';
+                            break;
+                        case 1:
+                            output = 'label-warning';
+                            break;
+                        case 2:
+                        /* falls through */
+                        default:
+                            output = 'label-success';
+                    }
+                    break;
+                default:
+                    output = 'label-default';
+            }
+
+            return output;
+        };
+    });

src/app/filters/enumNameFilter.js

@@ -0,0 +1,46 @@
+angular
+    .module('bit.filters')
+
+    .filter('enumName', function () {
+        return function (input, name) {
+            if (typeof input !== 'number') {
+                return input.toString();
+            }
+
+            var output;
+            switch (name) {
+                case 'OrgUserStatus':
+                    switch (input) {
+                        case 0:
+                            output = 'Invited';
+                            break;
+                        case 1:
+                            output = 'Accepted';
+                            break;
+                        case 2:
+                        /* falls through */
+                        default:
+                            output = 'Confirmed';
+                    }
+                    break;
+                case 'OrgUserType':
+                    switch (input) {
+                        case 0:
+                            output = 'Owner';
+                            break;
+                        case 1:
+                            output = 'Admin';
+                            break;
+                        case 2:
+                        /* falls through */
+                        default:
+                            output = 'User';
+                    }
+                    break;
+                default:
+                    output = input.toString();
+            }
+
+            return output;
+        };
+    });

src/app/filters/filtersModule.js

@@ -0,0 +1,2 @@
+angular
+    .module('bit.filters', []);

src/app/global/appsController.js

@@ -0,0 +1,6 @@
+angular
+    .module('bit.global')
+
+    .controller('appsController', function ($scope, $state) {
+
+    });

src/app/global/mainController.js

@@ -1,16 +1,19 @@
 angular
     .module('bit.global')
 
-    .controller('mainController', function ($scope, $state, authService, appSettings, toastr) {
+    .controller('mainController', function ($scope, $state, authService, appSettings, toastr, $window, $document) {
         var vm = this;
         vm.bodyClass = '';
-        vm.userProfile = null;
         vm.searchVaultText = null;
         vm.version = appSettings.version;
 
         $scope.currentYear = new Date().getFullYear();
 
         $scope.$on('$viewContentLoaded', function () {
+            authService.getUserProfile().then(function (profile) {
+                vm.userProfile = profile;
+            });
+
             if ($.AdminLTE) {
                 if ($.AdminLTE.layout) {
                     $.AdminLTE.layout.fix();
@@ -20,12 +23,13 @@ angular
                 if ($.AdminLTE.pushMenu) {
                     $.AdminLTE.pushMenu.expandOnHover();
                 }
+
+                $(document).off('click', '.sidebar li a');
             }
         });
 
         $scope.$on('$stateChangeSuccess', function (event, toState, toParams, fromState, fromParams) {
             vm.searchVaultText = null;
-            vm.userProfile = authService.getUserProfile();
 
             if (toState.data.bodyClass) {
                 vm.bodyClass = toState.data.bodyClass;
@@ -36,10 +40,6 @@ angular
             }
         });
 
-        $scope.searchVault = function () {
-            $state.go('backend.vault');
-        };
-
         $scope.addLogin = function () {
             $scope.$broadcast('vaultAddLogin');
         };
@@ -48,15 +48,99 @@ angular
             $scope.$broadcast('vaultAddFolder');
         };
 
-        $scope.import = function () {
-            $scope.$broadcast('toolsImport');
+        $scope.addOrganizationLogin = function () {
+            $scope.$broadcast('organizationVaultAddLogin');
         };
 
-        $scope.export = function () {
-            $scope.$broadcast('toolsExport');
+        $scope.addOrganizationCollection = function () {
+            $scope.$broadcast('organizationCollectionsAdd');
         };
 
-        $scope.audits = function () {
-            $scope.$broadcast('toolsAudits');
+        $scope.inviteOrganizationUser = function () {
+            $scope.$broadcast('organizationPeopleInvite');
         };
+
+        // Append dropdown menu somewhere else
+        var bodyScrollbarWidth,
+            appendedDropdownMenu,
+            appendedDropdownMenuParent;
+
+        var dropdownHelpers = {
+            scrollbarWidth: function () {
+                if (!bodyScrollbarWidth) {
+                    var bodyElem = $('body');
+                    bodyElem.addClass('bit-position-body-scrollbar-measure');
+                    bodyScrollbarWidth = $window.innerWidth - bodyElem[0].clientWidth;
+                    bodyScrollbarWidth = isFinite(bodyScrollbarWidth) ? bodyScrollbarWidth : 0;
+                    bodyElem.removeClass('bit-position-body-scrollbar-measure');
+                }
+
+                return bodyScrollbarWidth;
+            },
+            scrollbarInfo: function () {
+                return {
+                    width: dropdownHelpers.scrollbarWidth(),
+                    visible: $document.height() > $($window).height()
+                };
+            }
+        };
+
+        $(window).on('show.bs.dropdown', function (e) {
+            /*jshint -W120 */
+            var target = appendedDropdownMenuParent = $(e.target);
+
+            var appendTo = target.data('appendTo');
+            if (!appendTo) {
+                return true;
+            }
+
+            appendedDropdownMenu = target.find('.dropdown-menu');
+            var appendToEl = $(appendTo);
+            appendToEl.append(appendedDropdownMenu.detach());
+
+            var offset = target.offset();
+            var css = {
+                display: 'block',
+                top: offset.top + target.outerHeight()
+            };
+
+            if (appendedDropdownMenu.hasClass('dropdown-menu-right')) {
+                var scrollbarInfo = dropdownHelpers.scrollbarInfo();
+                var scrollbarWidth = 0;
+                if (scrollbarInfo.visible && scrollbarInfo.width) {
+                    scrollbarWidth = scrollbarInfo.width;
+                }
+
+                css.right = $window.innerWidth - scrollbarWidth - (offset.left + target.prop('offsetWidth')) + 'px';
+                css.left = 'auto';
+            }
+            else {
+                css.left = offset.left + 'px';
+                css.right = 'auto';
+            }
+
+            appendedDropdownMenu.css(css);
+        });
+
+        $(window).on('hide.bs.dropdown', function (e) {
+            if (!appendedDropdownMenu) {
+                return true;
+            }
+
+            $(e.target).append(appendedDropdownMenu.detach());
+            appendedDropdownMenu.hide();
+            appendedDropdownMenu = null;
+            appendedDropdownMenuParent = null;
+        });
+
+        $scope.$on('removeAppendedDropdownMenu', function (event, args) {
+            if (!appendedDropdownMenu && !appendedDropdownMenuParent) {
+                return true;
+            }
+
+            appendedDropdownMenuParent.append(appendedDropdownMenu.detach());
+            appendedDropdownMenu.hide();
+            appendedDropdownMenu = null;
+            appendedDropdownMenuParent = null;
+        });
     });

src/app/global/sideNavController.js

@@ -1,6 +1,54 @@
 angular
     .module('bit.global')
 
-    .controller('sideNavController', function ($scope, $state) {
+    .controller('sideNavController', function ($scope, $state, authService, toastr, $analytics) {
         $scope.$state = $state;
+        $scope.params = $state.params;
+        $scope.orgs = [];
+        $scope.name = '';
+
+        authService.getUserProfile().then(function (userProfile) {
+            $scope.name = userProfile.extended && userProfile.extended.name ?
+                userProfile.extended.name : userProfile.email;
+
+            if (!userProfile.organizations) {
+                return;
+            }
+
+            if ($state.includes('backend.org') && ($state.params.orgId in userProfile.organizations)) {
+                $scope.orgProfile = userProfile.organizations[$state.params.orgId];
+            }
+            else {
+                var orgs = [];
+                for (var orgId in userProfile.organizations) {
+                    if (userProfile.organizations.hasOwnProperty(orgId) &&
+                        (userProfile.organizations[orgId].enabled || userProfile.organizations[orgId].type < 2)) { // 2 = User
+                        orgs.push(userProfile.organizations[orgId]);
+                    }
+                }
+                $scope.orgs = orgs;
+            }
+        });
+
+        $scope.viewOrganization = function (org) {
+            if (org.type === 2) { // 2 = User
+                toastr.error('You cannot manage this organization.');
+                return;
+            }
+
+            $analytics.eventTrack('View Organization From Side Nav');
+            $state.go('backend.org.dashboard', { orgId: org.id });
+        };
+
+        $scope.searchVault = function () {
+            $state.go('backend.user.vault');
+        };
+
+        $scope.searchOrganizationVault = function () {
+            $state.go('backend.org.vault', { orgId: $state.params.orgId });
+        };
+
+        $scope.isOrgOwner = function (org) {
+            return org && org.type === 0;
+        };
     });

src/app/organization/organizationBillingAdjustSeatsController.js

@@ -0,0 +1,37 @@
+angular
+    .module('bit.organization')
+
+    .controller('organizationBillingAdjustSeatsController', function ($scope, $state, $uibModalInstance, apiService,
+        $analytics, toastr, add) {
+        $analytics.eventTrack('organizationBillingAdjustSeatsController', { category: 'Modal' });
+        $scope.add = add;
+        $scope.seatAdjustment = 0;
+
+        $scope.submit = function () {
+            var request = {
+                seatAdjustment: $scope.seatAdjustment
+            };
+
+            if (!add) {
+                request.seatAdjustment *= -1;
+            }
+
+            $scope.submitPromise = apiService.organizations.putSeat({ id: $state.params.orgId }, request)
+                .$promise.then(function (response) {
+                    if (add) {
+                        $analytics.eventTrack('Added Seats');
+                        toastr.success('You have added ' + $scope.seatAdjustment + ' seats.');
+                    }
+                    else {
+                        $analytics.eventTrack('Removed Seats');
+                        toastr.success('You have removed ' + $scope.seatAdjustment + ' seats.');
+                    }
+
+                    $uibModalInstance.close();
+                });
+        };
+
+        $scope.close = function () {
+            $uibModalInstance.dismiss('cancel');
+        };
+    });

src/app/organization/organizationBillingChangePaymentController.js

@@ -0,0 +1,34 @@
+angular
+    .module('bit.organization')
+
+    .controller('organizationBillingChangePaymentController', function ($scope, $state, $uibModalInstance, apiService, stripe,
+        $analytics, toastr, existingPaymentMethod) {
+        $analytics.eventTrack('organizationBillingChangePaymentController', { category: 'Modal' });
+        $scope.existingPaymentMethod = existingPaymentMethod;
+
+        $scope.submit = function () {
+            $scope.submitPromise = stripe.card.createToken($scope.card).then(function (response) {
+                var request = {
+                    paymentToken: response.id
+                };
+
+                return apiService.organizations.putPayment({ id: $state.params.orgId }, request).$promise;
+            }).then(function (response) {
+                $scope.card = null;
+                if (existingPaymentMethod) {
+                    $analytics.eventTrack('Changed Payment Method');
+                    toastr.success('You have changed your payment method.');
+                }
+                else {
+                    $analytics.eventTrack('Added Payment Method');
+                    toastr.success('You have added a payment method.');
+                }
+
+                $uibModalInstance.close();
+            });
+        };
+
+        $scope.close = function () {
+            $uibModalInstance.dismiss('cancel');
+        };
+    });

src/app/organization/organizationBillingChangePlanController.js

@@ -0,0 +1,14 @@
+angular
+    .module('bit.organization')
+
+    .controller('organizationBillingChangePlanController', function ($scope, $state, apiService, $uibModalInstance,
+        toastr, $analytics) {
+        $analytics.eventTrack('organizationBillingChangePlanController', { category: 'Modal' });
+        $scope.submit = function () {
+
+        };
+
+        $scope.close = function () {
+            $uibModalInstance.dismiss('cancel');
+        };
+    });

src/app/organization/organizationBillingController.js

@@ -0,0 +1,163 @@
+angular
+    .module('bit.organization')
+
+    .controller('organizationBillingController', function ($scope, apiService, $state, $uibModal, toastr, $analytics) {
+        $scope.charges = [];
+        $scope.paymentSource = null;
+        $scope.plan = null;
+        $scope.subscription = null;
+        $scope.loading = true;
+
+        $scope.$on('$viewContentLoaded', function () {
+            load();
+        });
+
+        $scope.changePayment = function () {
+            var modal = $uibModal.open({
+                animation: true,
+                templateUrl: 'app/organization/views/organizationBillingChangePayment.html',
+                controller: 'organizationBillingChangePaymentController',
+                resolve: {
+                    existingPaymentMethod: function () {
+                        return $scope.paymentSource ? $scope.paymentSource.description : null;
+                    }
+                }
+            });
+
+            modal.result.then(function () {
+                load();
+            });
+        };
+
+        $scope.changePlan = function () {
+            var modal = $uibModal.open({
+                animation: true,
+                templateUrl: 'app/organization/views/organizationBillingChangePlan.html',
+                controller: 'organizationBillingChangePlanController',
+                resolve: {
+                    plan: function () {
+                        return $scope.plan;
+                    }
+                }
+            });
+
+            modal.result.then(function () {
+                load();
+            });
+        };
+
+        $scope.adjustSeats = function (add) {
+            var modal = $uibModal.open({
+                animation: true,
+                templateUrl: 'app/organization/views/organizationBillingAdjustSeats.html',
+                controller: 'organizationBillingAdjustSeatsController',
+                resolve: {
+                    add: function () {
+                        return add;
+                    }
+                }
+            });
+
+            modal.result.then(function () {
+                load();
+            });
+        };
+
+        $scope.cancel = function () {
+            if (!confirm('Are you sure you want to cancel? All users will lose access to the organization ' +
+                'at the end of this billing cycle.')) {
+                return;
+            }
+
+            apiService.organizations.putCancel({ id: $state.params.orgId }, {})
+                .$promise.then(function (response) {
+                    $analytics.eventTrack('Canceled Plan');
+                    toastr.success('Organization subscription has been canceled.');
+                    load();
+                });
+        };
+
+        $scope.reinstate = function () {
+            if (!confirm('Are you sure you want to remove the cancellation request and reinstate this organization?')) {
+                return;
+            }
+
+            apiService.organizations.putReinstate({ id: $state.params.orgId }, {})
+                .$promise.then(function (response) {
+                    $analytics.eventTrack('Reinstated Plan');
+                    toastr.success('Organization cancellation request has been removed.');
+                    load();
+                });
+        };
+
+        function load() {
+            apiService.organizations.getBilling({ id: $state.params.orgId }, function (org) {
+                $scope.loading = false;
+                $scope.noSubscription = org.PlanType === 0;
+
+                var i = 0;
+
+                $scope.plan = {
+                    name: org.Plan,
+                    type: org.PlanType,
+                    seats: org.Seats
+                };
+
+                $scope.subscription = null;
+                if (org.Subscription) {
+                    $scope.subscription = {
+                        trialEndDate: org.Subscription.TrialEndDate,
+                        cancelledDate: org.Subscription.CancelledDate,
+                        status: org.Subscription.Status,
+                        cancelled: org.Subscription.Status === 'cancelled',
+                        markedForCancel: org.Subscription.Status === 'active' && org.Subscription.CancelledDate
+                    };
+                }
+
+                $scope.nextInvoice = null;
+                if (org.UpcomingInvoice) {
+                    $scope.nextInvoice = {
+                        date: org.UpcomingInvoice.Date,
+                        amount: org.UpcomingInvoice.Amount
+                    };
+                }
+
+                if (org.Subscription && org.Subscription.Items) {
+                    $scope.subscription.items = [];
+                    for (i = 0; i < org.Subscription.Items.length; i++) {
+                        $scope.subscription.items.push({
+                            amount: org.Subscription.Items[i].Amount,
+                            name: org.Subscription.Items[i].Name,
+                            interval: org.Subscription.Items[i].Interval,
+                            qty: org.Subscription.Items[i].Quantity
+                        });
+                    }
+                }
+
+                $scope.paymentSource = null;
+                if (org.PaymentSource) {
+                    $scope.paymentSource = {
+                        type: org.PaymentSource.Type,
+                        description: org.PaymentSource.Description,
+                        cardBrand: org.PaymentSource.CardBrand
+                    };
+                }
+
+                var charges = [];
+                for (i = 0; i < org.Charges.length; i++) {
+                    charges.push({
+                        date: org.Charges[i].CreatedDate,
+                        paymentSource: org.Charges[i].PaymentSource ? org.Charges[i].PaymentSource.Description : '-',
+                        amount: org.Charges[i].Amount,
+                        status: org.Charges[i].Status,
+                        failureMessage: org.Charges[i].FailureMessage,
+                        refunded: org.Charges[i].Refunded,
+                        partiallyRefunded: org.Charges[i].PartiallyRefunded,
+                        refundedAmount: org.Charges[i].RefundedAmount,
+                        invoiceId: org.Charges[i].InvoiceId
+                    });
+                }
+                $scope.charges = charges;
+            });
+        }
+    });

src/app/organization/organizationCollectionsAddController.js

@@ -0,0 +1,20 @@
+angular
+    .module('bit.organization')
+
+    .controller('organizationCollectionsAddController', function ($scope, $state, $uibModalInstance, apiService, cipherService,
+        $analytics) {
+        $analytics.eventTrack('organizationCollectionsAddController', { category: 'Modal' });
+
+        $scope.submit = function (model) {
+            var collection = cipherService.encryptCollection(model, $state.params.orgId);
+            $scope.submitPromise = apiService.collections.post({ orgId: $state.params.orgId }, collection, function (response) {
+                $analytics.eventTrack('Created Collection');
+                var decCollection = cipherService.decryptCollection(response, $state.params.orgId, true);
+                $uibModalInstance.close(decCollection);
+            }).$promise;
+        };
+
+        $scope.close = function () {
+            $uibModalInstance.dismiss('cancel');
+        };
+    });

src/app/organization/organizationCollectionsController.js

@@ -0,0 +1,101 @@
+angular
+    .module('bit.organization')
+
+    .controller('organizationCollectionsController', function ($scope, $state, apiService, $uibModal, cipherService, $filter,
+        toastr, $analytics) {
+        $scope.collections = [];
+        $scope.loading = true;
+        $scope.$on('$viewContentLoaded', function () {
+            loadList();
+        });
+
+        $scope.$on('organizationCollectionsAdd', function (event, args) {
+            $scope.add();
+        });
+
+        $scope.add = function () {
+            var modal = $uibModal.open({
+                animation: true,
+                templateUrl: 'app/organization/views/organizationCollectionsAdd.html',
+                controller: 'organizationCollectionsAddController'
+            });
+
+            modal.result.then(function (collection) {
+                $scope.collections.push(collection);
+            });
+        };
+
+        $scope.edit = function (collection) {
+            var modal = $uibModal.open({
+                animation: true,
+                templateUrl: 'app/organization/views/organizationCollectionsEdit.html',
+                controller: 'organizationCollectionsEditController',
+                resolve: {
+                    id: function () { return collection.id; }
+                }
+            });
+
+            modal.result.then(function (editedCollection) {
+                var existingCollections = $filter('filter')($scope.collections, { id: editedCollection.id }, true);
+                if (existingCollections && existingCollections.length > 0) {
+                    existingCollections[0].name = editedCollection.name;
+                }
+            });
+        };
+
+        $scope.users = function (collection) {
+            var modal = $uibModal.open({
+                animation: true,
+                templateUrl: 'app/organization/views/organizationCollectionsUsers.html',
+                controller: 'organizationCollectionsUsersController',
+                size: 'lg',
+                resolve: {
+                    collection: function () { return collection; }
+                }
+            });
+
+            modal.result.then(function () {
+                // nothing to do
+            });
+        };
+
+        $scope.groups = function (collection) {
+            var modal = $uibModal.open({
+                animation: true,
+                templateUrl: 'app/organization/views/organizationCollectionsGroups.html',
+                controller: 'organizationCollectionsGroupsController',
+                resolve: {
+                    collection: function () { return collection; }
+                }
+            });
+
+            modal.result.then(function () {
+                // nothing to do
+            });
+        };
+
+        $scope.delete = function (collection) {
+            if (!confirm('Are you sure you want to delete this collection (' + collection.name + ')?')) {
+                return;
+            }
+
+            apiService.collections.del({ orgId: $state.params.orgId, id: collection.id }, function () {
+                var index = $scope.collections.indexOf(collection);
+                if (index > -1) {
+                    $scope.collections.splice(index, 1);
+                }
+
+                $analytics.eventTrack('Deleted Collection');
+                toastr.success(collection.name + ' has been deleted.', 'Collection Deleted');
+            }, function () {
+                toastr.error(collection.name + ' was not able to be deleted.', 'Error');
+            });
+        };
+
+        function loadList() {
+            apiService.collections.listOrganization({ orgId: $state.params.orgId }, function (list) {
+                $scope.collections = cipherService.decryptCollections(list.Data, $state.params.orgId, true);
+                $scope.loading = false;
+            });
+        }
+    });

src/app/organization/organizationCollectionsEditController.js

@@ -0,0 +1,27 @@
+angular
+    .module('bit.organization')
+
+    .controller('organizationCollectionsEditController', function ($scope, $state, $uibModalInstance, apiService, cipherService,
+        $analytics, id) {
+        $analytics.eventTrack('organizationCollectionsEditController', { category: 'Modal' });
+        $scope.collection = {};
+
+        $uibModalInstance.opened.then(function () {
+            apiService.collections.get({ orgId: $state.params.orgId, id: id }, function (collection) {
+                $scope.collection = cipherService.decryptCollection(collection);
+            });
+        });
+
+        $scope.submit = function (model) {
+            var collection = cipherService.encryptCollection(model, $state.params.orgId);
+            $scope.submitPromise = apiService.collections.put({ orgId: $state.params.orgId }, collection, function (response) {
+                $analytics.eventTrack('Edited Collection');
+                var decCollection = cipherService.decryptCollection(response, $state.params.orgId, true);
+                $uibModalInstance.close(decCollection);
+            }).$promise;
+        };
+
+        $scope.close = function () {
+            $uibModalInstance.dismiss('cancel');
+        };
+    });

src/app/organization/organizationCollectionsGroupsController.js

@@ -0,0 +1,11 @@
+angular
+    .module('bit.organization')
+
+    .controller('organizationCollectionsGroupsController', function ($scope, $state, $uibModalInstance, collection, $analytics) {
+        $analytics.eventTrack('organizationCollectionsGroupsController', { category: 'Modal' });
+        $scope.collection = collection;
+
+        $scope.close = function () {
+            $uibModalInstance.dismiss('cancel');
+        };
+    });

src/app/organization/organizationCollectionsUsersController.js

@@ -0,0 +1,59 @@
+angular
+    .module('bit.organization')
+
+    .controller('organizationCollectionsUsersController', function ($scope, $state, $uibModalInstance, apiService, cipherService,
+        $analytics, collection, toastr) {
+        $analytics.eventTrack('organizationCollectionsUsersController', { category: 'Modal' });
+        $scope.loading = true;
+        $scope.collection = collection;
+        $scope.users = [];
+
+        $uibModalInstance.opened.then(function () {
+            $scope.loading = false;
+            apiService.collectionUsers.listCollection(
+                {
+                    orgId: $state.params.orgId,
+                    collectionId: collection.id
+                },
+                function (userList) {
+                    if (userList && userList.Data.length) {
+                        var users = [];
+                        for (var i = 0; i < userList.Data.length; i++) {
+                            users.push({
+                                id: userList.Data[i].Id,
+                                userId: userList.Data[i].UserId,
+                                name: userList.Data[i].Name,
+                                email: userList.Data[i].Email,
+                                type: userList.Data[i].Type,
+                                status: userList.Data[i].Status,
+                                readOnly: userList.Data[i].ReadOnly,
+                                accessAll: userList.Data[i].AccessAll
+                            });
+                        }
+                        $scope.users = users;
+                    }
+                });
+        });
+
+        $scope.remove = function (user) {
+            if (!confirm('Are you sure you want to remove this user (' + user.email + ') from this ' +
+                'collection (' + collection.name + ')?')) {
+                return;
+            }
+
+            apiService.collectionUsers.del({ orgId: $state.params.orgId, id: user.id }, null, function () {
+                toastr.success(user.email + ' has been removed.', 'User Removed');
+                $analytics.eventTrack('Removed User From Collection');
+                var index = $scope.users.indexOf(user);
+                if (index > -1) {
+                    $scope.users.splice(index, 1);
+                }
+            }, function () {
+                toastr.error('Unable to remove user.', 'Error');
+            });
+        };
+
+        $scope.close = function () {
+            $uibModalInstance.dismiss('cancel');
+        };
+    });

src/app/organization/organizationDashboardController.js

@@ -0,0 +1,13 @@
+angular
+    .module('bit.organization')
+
+    .controller('organizationDashboardController', function ($scope, authService, $state) {
+        $scope.$on('$viewContentLoaded', function () {
+            authService.getUserProfile().then(function (userProfile) {
+                if (!userProfile.organizations) {
+                    return;
+                }
+                $scope.orgProfile = userProfile.organizations[$state.params.orgId];
+            });
+        });
+    });

src/app/organization/organizationDeleteController.js

@@ -0,0 +1,26 @@
+angular
+    .module('bit.organization')
+
+    .controller('organizationDeleteController', function ($scope, $state, apiService, $uibModalInstance, cryptoService,
+        authService, toastr, $analytics) {
+        $analytics.eventTrack('organizationDeleteController', { category: 'Modal' });
+        $scope.submit = function () {
+            var request = {
+                masterPasswordHash: cryptoService.hashPassword($scope.masterPassword)
+            };
+
+            $scope.submitPromise = apiService.organizations.del({ id: $state.params.orgId }, request, function () {
+                $uibModalInstance.dismiss('cancel');
+                authService.removeProfileOrganization($state.params.orgId);
+                $analytics.eventTrack('Deleted Organization');
+                $state.go('backend.user.vault').then(function () {
+                    toastr.success('This organization and all associated data has been deleted.',
+                        'Organization Deleted');
+                });
+            }).$promise;
+        };
+
+        $scope.close = function () {
+            $uibModalInstance.dismiss('cancel');
+        };
+    });

src/app/organization/organizationGroupsController.js

@@ -0,0 +1,6 @@
+angular
+    .module('bit.organization')
+
+    .controller('organizationGroupsController', function ($scope, $state) {
+        
+    });

src/app/organization/organizationModule.js

@@ -0,0 +1,2 @@
+angular
+    .module('bit.organization', ['ui.bootstrap']);

src/app/organization/organizationPeopleController.js

@@ -0,0 +1,110 @@
+angular
+    .module('bit.organization')
+
+    .controller('organizationPeopleController', function ($scope, $state, $uibModal, cryptoService, apiService,
+        toastr, $analytics) {
+        $scope.users = [];
+        $scope.$on('$viewContentLoaded', function () {
+            loadList();
+        });
+
+        $scope.reinvite = function (user) {
+            apiService.organizationUsers.reinvite({ orgId: $state.params.orgId, id: user.id }, null, function () {
+                $analytics.eventTrack('Reinvited User');
+                toastr.success(user.email + ' has been invited again.', 'User Invited');
+            }, function () {
+                toastr.error('Unable to invite user.', 'Error');
+            });
+        };
+
+        $scope.delete = function (user) {
+            if (!confirm('Are you sure you want to remove this user (' + user.email + ')?')) {
+                return;
+            }
+
+            apiService.organizationUsers.del({ orgId: $state.params.orgId, id: user.id }, null, function () {
+                $analytics.eventTrack('Deleted User');
+                toastr.success(user.email + ' has been removed.', 'User Removed');
+                var index = $scope.users.indexOf(user);
+                if (index > -1) {
+                    $scope.users.splice(index, 1);
+                }
+            }, function () {
+                toastr.error('Unable to remove user.', 'Error');
+            });
+        };
+
+        $scope.confirm = function (user) {
+            apiService.users.getPublicKey({ id: user.userId }, function (userKey) {
+                var orgKey = cryptoService.getOrgKey($state.params.orgId);
+                if (!orgKey) {
+                    toastr.error('Unable to confirm user.', 'Error');
+                    return;
+                }
+
+                var key = cryptoService.rsaEncrypt(orgKey.key, userKey.PublicKey);
+                apiService.organizationUsers.confirm({ orgId: $state.params.orgId, id: user.id }, { key: key }, function () {
+                    user.status = 2;
+                    $analytics.eventTrack('Confirmed User');
+                    toastr.success(user.email + ' has been confirmed.', 'User Confirmed');
+                }, function () {
+                    toastr.error('Unable to confirm user.', 'Error');
+                });
+            }, function () {
+                toastr.error('Unable to confirm user.', 'Error');
+            });
+        };
+
+        $scope.$on('organizationPeopleInvite', function (event, args) {
+            $scope.invite();
+        });
+
+        $scope.invite = function () {
+            var modal = $uibModal.open({
+                animation: true,
+                templateUrl: 'app/organization/views/organizationPeopleInvite.html',
+                controller: 'organizationPeopleInviteController'
+            });
+
+            modal.result.then(function () {
+                loadList();
+            });
+        };
+
+        $scope.edit = function (id) {
+            var modal = $uibModal.open({
+                animation: true,
+                templateUrl: 'app/organization/views/organizationPeopleEdit.html',
+                controller: 'organizationPeopleEditController',
+                resolve: {
+                    id: function () { return id; }
+                }
+            });
+
+            modal.result.then(function () {
+                loadList();
+            });
+        };
+
+        function loadList() {
+            apiService.organizationUsers.list({ orgId: $state.params.orgId }, function (list) {
+                var users = [];
+
+                for (var i = 0; i < list.Data.length; i++) {
+                    var user = {
+                        id: list.Data[i].Id,
+                        userId: list.Data[i].UserId,
+                        name: list.Data[i].Name,
+                        email: list.Data[i].Email,
+                        status: list.Data[i].Status,
+                        type: list.Data[i].Type,
+                        accessAll: list.Data[i].AccessAll
+                    };
+
+                    users.push(user);
+                }
+
+                $scope.users = users;
+            });
+        }
+    });

src/app/organization/organizationPeopleEditController.js

@@ -0,0 +1,100 @@
+angular
+    .module('bit.organization')
+
+    .controller('organizationPeopleEditController', function ($scope, $state, $uibModalInstance, apiService, cipherService, id,
+        $analytics) {
+        $analytics.eventTrack('organizationPeopleEditController', { category: 'Modal' });
+
+        $scope.loading = true;
+        $scope.collections = [];
+        $scope.selectedCollections = {};
+
+        $uibModalInstance.opened.then(function () {
+            apiService.collections.listOrganization({ orgId: $state.params.orgId }, function (list) {
+                $scope.collections = cipherService.decryptCollections(list.Data, $state.params.orgId, true);
+                $scope.loading = false;
+            });
+
+            apiService.organizationUsers.get({ orgId: $state.params.orgId, id: id }, function (user) {
+                var collections = {};
+                if (user && user.Collections) {
+                    for (var i = 0; i < user.Collections.Data.length; i++) {
+                        collections[user.Collections.Data[i].CollectionId] = {
+                            collectionId: user.Collections.Data[i].CollectionId,
+                            readOnly: user.Collections.Data[i].ReadOnly
+                        };
+                    }
+                }
+                $scope.email = user.Email;
+                $scope.type = user.Type;
+                $scope.accessAll = user.AccessAll;
+                $scope.selectedCollections = collections;
+            });
+        });
+
+        $scope.toggleCollectionSelectionAll = function ($event) {
+            var collections = {};
+            if ($event.target.checked) {
+                for (var i = 0; i < $scope.collections.length; i++) {
+                    collections[$scope.collections[i].id] = {
+                        collectionId: $scope.collections[i].id,
+                        readOnly: ($scope.collections[i].id in $scope.selectedCollections) ?
+                            $scope.selectedCollections[$scope.collections[i].id].readOnly : false
+                    };
+                }
+            }
+
+            $scope.selectedCollections = collections;
+        };
+
+        $scope.toggleCollectionSelection = function (id) {
+            if (id in $scope.selectedCollections) {
+                delete $scope.selectedCollections[id];
+            }
+            else {
+                $scope.selectedCollections[id] = {
+                    collectionId: id,
+                    readOnly: false
+                };
+            }
+        };
+
+        $scope.toggleCollectionReadOnlySelection = function (id) {
+            if (id in $scope.selectedCollections) {
+                $scope.selectedCollections[id].readOnly = !!!$scope.selectedCollections[id].readOnly;
+            }
+        };
+
+        $scope.collectionSelected = function (collection) {
+            return collection.id in $scope.selectedCollections;
+        };
+
+        $scope.allSelected = function () {
+            return Object.keys($scope.selectedCollections).length === $scope.collections.length;
+        };
+
+        $scope.submitPromise = null;
+        $scope.submit = function (model) {
+            var collections = [];
+            if (!$scope.accessAll) {
+                for (var collectionId in $scope.selectedCollections) {
+                    if ($scope.selectedCollections.hasOwnProperty(collectionId)) {
+                        collections.push($scope.selectedCollections[collectionId]);
+                    }
+                }
+            }
+
+            $scope.submitPromise = apiService.organizationUsers.put({ orgId: $state.params.orgId, id: id }, {
+                type: $scope.type,
+                collections: collections,
+                accessAll: $scope.accessAll
+            }, function () {
+                $analytics.eventTrack('Edited User');
+                $uibModalInstance.close();
+            }).$promise;
+        };
+
+        $scope.close = function () {
+            $uibModalInstance.dismiss('cancel');
+        };
+    });

src/app/organization/organizationPeopleInviteController.js

@@ -0,0 +1,89 @@
+angular
+    .module('bit.organization')
+
+    .controller('organizationPeopleInviteController', function ($scope, $state, $uibModalInstance, apiService, cipherService,
+        $analytics) {
+        $analytics.eventTrack('organizationPeopleInviteController', { category: 'Modal' });
+
+        $scope.loading = true;
+        $scope.collections = [];
+        $scope.selectedCollections = {};
+        $scope.model = {
+            type: 'User'
+        };
+
+        $uibModalInstance.opened.then(function () {
+            apiService.collections.listOrganization({ orgId: $state.params.orgId }, function (list) {
+                $scope.collections = cipherService.decryptCollections(list.Data, $state.params.orgId, true);
+                $scope.loading = false;
+            });
+        });
+
+        $scope.toggleCollectionSelectionAll = function ($event) {
+            var collections = {};
+            if ($event.target.checked) {
+                for (var i = 0; i < $scope.collections.length; i++) {
+                    collections[$scope.collections[i].id] = {
+                        collectionId: $scope.collections[i].id,
+                        readOnly: ($scope.collections[i].id in $scope.selectedCollections) ?
+                            $scope.selectedCollections[$scope.collections[i].id].readOnly : false
+                    };
+                }
+            }
+
+            $scope.selectedCollections = collections;
+        };
+
+        $scope.toggleCollectionSelection = function (id) {
+            if (id in $scope.selectedCollections) {
+                delete $scope.selectedCollections[id];
+            }
+            else {
+                $scope.selectedCollections[id] = {
+                    collectionId: id,
+                    readOnly: false
+                };
+            }
+        };
+
+        $scope.toggleCollectionReadOnlySelection = function (id) {
+            if (id in $scope.selectedCollections) {
+                $scope.selectedCollections[id].readOnly = !!!$scope.selectedCollections[id].readOnly;
+            }
+        };
+
+        $scope.collectionSelected = function (collection) {
+            return collection.id in $scope.selectedCollections;
+        };
+
+        $scope.allSelected = function () {
+            return Object.keys($scope.selectedCollections).length === $scope.collections.length;
+        };
+
+        $scope.submitPromise = null;
+        $scope.submit = function (model) {
+            var collections = [];
+
+            if (!model.accessAll) {
+                for (var collectionId in $scope.selectedCollections) {
+                    if ($scope.selectedCollections.hasOwnProperty(collectionId)) {
+                        collections.push($scope.selectedCollections[collectionId]);
+                    }
+                }
+            }
+
+            $scope.submitPromise = apiService.organizationUsers.invite({ orgId: $state.params.orgId }, {
+                email: model.email,
+                type: model.type,
+                collections: collections,
+                accessAll: model.accessAll
+            }, function () {
+                $analytics.eventTrack('Invited User');
+                $uibModalInstance.close();
+            }).$promise;
+        };
+
+        $scope.close = function () {
+            $uibModalInstance.dismiss('cancel');
+        };
+    });

src/app/organization/organizationSettingsController.js

@@ -0,0 +1,33 @@
+angular
+    .module('bit.organization')
+
+    .controller('organizationSettingsController', function ($scope, $state, apiService, toastr, authService, $uibModal,
+        $analytics) {
+        $scope.model = {};
+        $scope.$on('$viewContentLoaded', function () {
+            apiService.organizations.get({ id: $state.params.orgId }, function (org) {
+                $scope.model = {
+                    name: org.Name,
+                    billingEmail: org.BillingEmail,
+                    businessName: org.BusinessName
+                };
+            });
+        });
+
+        $scope.generalSave = function () {
+            $scope.generalPromise = apiService.organizations.put({ id: $state.params.orgId }, $scope.model, function (org) {
+                authService.updateProfileOrganization(org).then(function (updatedOrg) {
+                    $analytics.eventTrack('Updated Organization Settings');
+                    toastr.success('Organization has been updated.', 'Success!');
+                });
+            }).$promise;
+        };
+
+        $scope.delete = function () {
+            $uibModal.open({
+                animation: true,
+                templateUrl: 'app/organization/views/organizationDelete.html',
+                controller: 'organizationDeleteController'
+            });
+        };
+    });

src/app/organization/organizationVaultAddLoginController.js

@@ -0,0 +1,50 @@
+angular
+    .module('bit.vault')
+
+    .controller('organizationVaultAddLoginController', function ($scope, apiService, $uibModalInstance, cryptoService,
+        cipherService, passwordService, $analytics, orgId) {
+        $analytics.eventTrack('organizationVaultAddLoginController', { category: 'Modal' });
+        $scope.login = {};
+        $scope.hideFolders = $scope.hideFavorite = true;
+
+        $scope.savePromise = null;
+        $scope.save = function (model) {
+            model.organizationId = orgId;
+            var login = cipherService.encryptLogin(model);
+            $scope.savePromise = apiService.logins.postAdmin(login, function (loginResponse) {
+                $analytics.eventTrack('Created Organization Login');
+                var decLogin = cipherService.decryptLogin(loginResponse);
+                $uibModalInstance.close(decLogin);
+            }).$promise;
+        };
+
+        $scope.generatePassword = function () {
+            if (!$scope.login.password || confirm('Are you sure you want to overwrite the current password?')) {
+                $analytics.eventTrack('Generated Password From Add');
+                $scope.login.password = passwordService.generatePassword({ length: 12, special: true });
+            }
+        };
+
+        $scope.clipboardSuccess = function (e) {
+            e.clearSelection();
+            selectPassword(e);
+        };
+
+        $scope.clipboardError = function (e, password) {
+            if (password) {
+                selectPassword(e);
+            }
+            alert('Your web browser does not support easy clipboard copying. Copy it manually instead.');
+        };
+
+        function selectPassword(e) {
+            var target = $(e.trigger).parent().prev();
+            if (target.attr('type') === 'text') {
+                target.select();
+            }
+        }
+
+        $scope.close = function () {
+            $uibModalInstance.dismiss('close');
+        };
+    });

src/app/organization/organizationVaultController.js

@@ -0,0 +1,176 @@
+angular
+    .module('bit.organization')
+
+    .controller('organizationVaultController', function ($scope, apiService, cipherService, $analytics, $q, $state,
+        $localStorage, $uibModal, $filter) {
+        $scope.logins = [];
+        $scope.collections = [];
+        $scope.loading = true;
+
+        $scope.$on('$viewContentLoaded', function () {
+            var collectionPromise = apiService.collections.listOrganization({ orgId: $state.params.orgId }, function (collections) {
+                var decCollections = [{
+                    id: null,
+                    name: 'Unassigned',
+                    collapsed: $localStorage.collapsedOrgCollections && 'unassigned' in $localStorage.collapsedOrgCollections
+                }];
+
+                for (var i = 0; i < collections.Data.length; i++) {
+                    var decCollection = cipherService.decryptCollection(collections.Data[i], null, true);
+                    decCollection.collapsed = $localStorage.collapsedOrgCollections &&
+                        decCollection.id in $localStorage.collapsedOrgCollections;
+                    decCollections.push(decCollection);
+                }
+
+                $scope.collections = decCollections;
+            }).$promise;
+
+            var cipherPromise = apiService.ciphers.listOrganizationDetails({ organizationId: $state.params.orgId },
+                function (ciphers) {
+                    var decLogins = [];
+
+                    for (var i = 0; i < ciphers.Data.length; i++) {
+                        if (ciphers.Data[i].Type === 1) {
+                            var decLogin = cipherService.decryptLoginPreview(ciphers.Data[i]);
+                            decLogins.push(decLogin);
+                        }
+                    }
+
+                    $scope.logins = decLogins;
+                }).$promise;
+
+            $q.all([collectionPromise, cipherPromise]).then(function () {
+                $scope.loading = false;
+            });
+        });
+
+        $scope.filterByCollection = function (collection) {
+            return function (cipher) {
+                if (!cipher.collectionIds || !cipher.collectionIds.length) {
+                    return collection.id === null;
+                }
+
+                return cipher.collectionIds.indexOf(collection.id) > -1;
+            };
+        };
+
+        $scope.collectionSort = function (item) {
+            if (!item.id) {
+                return '';
+            }
+
+            return item.name.toLowerCase();
+        };
+
+        $scope.collapseExpand = function (collection) {
+            if (!$localStorage.collapsedOrgCollections) {
+                $localStorage.collapsedOrgCollections = {};
+            }
+
+            var id = collection.id || 'unassigned';
+
+            if (id in $localStorage.collapsedOrgCollections) {
+                delete $localStorage.collapsedOrgCollections[id];
+            }
+            else {
+                $localStorage.collapsedOrgCollections[id] = true;
+            }
+        };
+
+        $scope.editLogin = function (login) {
+            var editModel = $uibModal.open({
+                animation: true,
+                templateUrl: 'app/vault/views/vaultEditLogin.html',
+                controller: 'organizationVaultEditLoginController',
+                resolve: {
+                    loginId: function () { return login.id; }
+                }
+            });
+
+            editModel.result.then(function (returnVal) {
+                if (returnVal.action === 'edit') {
+                    login.name = returnVal.data.name;
+                    login.username = returnVal.data.username;
+                }
+                else if (returnVal.action === 'delete') {
+                    var index = $scope.logins.indexOf(login);
+                    if (index > -1) {
+                        $scope.logins.splice(index, 1);
+                    }
+                }
+            });
+        };
+
+        $scope.$on('organizationVaultAddLogin', function (event, args) {
+            $scope.addLogin();
+        });
+
+        $scope.addLogin = function () {
+            var addModel = $uibModal.open({
+                animation: true,
+                templateUrl: 'app/vault/views/vaultAddLogin.html',
+                controller: 'organizationVaultAddLoginController',
+                resolve: {
+                    orgId: function () { return $state.params.orgId; }
+                }
+            });
+
+            addModel.result.then(function (addedLogin) {
+                $scope.logins.push(addedLogin);
+            });
+        };
+
+        $scope.editCollections = function (cipher) {
+            var modal = $uibModal.open({
+                animation: true,
+                templateUrl: 'app/organization/views/organizationVaultLoginCollections.html',
+                controller: 'organizationVaultLoginCollectionsController',
+                resolve: {
+                    cipher: function () { return cipher; },
+                    collections: function () { return $scope.collections; }
+                }
+            });
+
+            modal.result.then(function (response) {
+                if (response.collectionIds) {
+                    cipher.collectionIds = response.collectionIds;
+                }
+            });
+        };
+
+        $scope.removeLogin = function (login, collection) {
+            if (!confirm('Are you sure you want to remove this login (' + login.name + ') from the ' +
+                'collection (' + collection.name + ') ?')) {
+                return;
+            }
+
+            var request = {
+                collectionIds: []
+            };
+
+            for (var i = 0; i < login.collectionIds.length; i++) {
+                if (login.collectionIds[i] !== collection.id) {
+                    request.collectionIds.push(login.collectionIds[i]);
+                }
+            }
+
+            apiService.ciphers.putCollections({ id: login.id }, request).$promise.then(function (response) {
+                $analytics.eventTrack('Removed Login From Collection');
+                login.collectionIds = request.collectionIds;
+            });
+        };
+
+        $scope.deleteLogin = function (login) {
+            if (!confirm('Are you sure you want to delete this login (' + login.name + ')?')) {
+                return;
+            }
+
+            apiService.ciphers.delAdmin({ id: login.id }, function () {
+                $analytics.eventTrack('Deleted Login');
+                var index = $scope.logins.indexOf(login);
+                if (index > -1) {
+                    $scope.logins.splice(index, 1);
+                }
+            });
+        };
+    });

src/app/organization/organizationVaultEditLoginController.js

@@ -0,0 +1,69 @@
+angular
+    .module('bit.vault')
+
+    .controller('organizationVaultEditLoginController', function ($scope, apiService, $uibModalInstance, cryptoService,
+        cipherService, passwordService, loginId, $analytics) {
+        $analytics.eventTrack('organizationVaultEditLoginController', { category: 'Modal' });
+        $scope.login = {};
+        $scope.hideFolders = $scope.hideFavorite = true;
+
+        apiService.logins.getAdmin({ id: loginId }, function (login) {
+            $scope.login = cipherService.decryptLogin(login);
+        });
+
+        $scope.save = function (model) {
+            var login = cipherService.encryptLogin(model);
+            $scope.savePromise = apiService.logins.putAdmin({ id: loginId }, login, function (loginResponse) {
+                $analytics.eventTrack('Edited Organization Login');
+                var decLogin = cipherService.decryptLogin(loginResponse);
+                $uibModalInstance.close({
+                    action: 'edit',
+                    data: decLogin
+                });
+            }).$promise;
+        };
+
+        $scope.generatePassword = function () {
+            if (!$scope.login.password || confirm('Are you sure you want to overwrite the current password?')) {
+                $analytics.eventTrack('Generated Password From Edit');
+                $scope.login.password = passwordService.generatePassword({ length: 12, special: true });
+            }
+        };
+
+        $scope.clipboardSuccess = function (e) {
+            e.clearSelection();
+            selectPassword(e);
+        };
+
+        $scope.clipboardError = function (e, password) {
+            if (password) {
+                selectPassword(e);
+            }
+            alert('Your web browser does not support easy clipboard copying. Copy it manually instead.');
+        };
+
+        function selectPassword(e) {
+            var target = $(e.trigger).parent().prev();
+            if (target.attr('type') === 'text') {
+                target.select();
+            }
+        }
+
+        $scope.delete = function () {
+            if (!confirm('Are you sure you want to delete this login (' + $scope.login.name + ')?')) {
+                return;
+            }
+
+            apiService.ciphers.delAdmin({ id: $scope.login.id }, function () {
+                $analytics.eventTrack('Deleted Organization Login From Edit');
+                $uibModalInstance.close({
+                    action: 'delete',
+                    data: $scope.login.id
+                });
+            });
+        };
+
+        $scope.close = function () {
+            $uibModalInstance.dismiss('cancel');
+        };
+    });

src/app/organization/organizationVaultLoginCollectionsController.js

@@ -0,0 +1,83 @@
+angular
+    .module('bit.organization')
+
+    .controller('organizationVaultLoginCollectionsController', function ($scope, apiService, $uibModalInstance, cipherService,
+        cipher, $analytics, collections) {
+        $analytics.eventTrack('organizationVaultLoginCollectionsController', { category: 'Modal' });
+        $scope.cipher = {};
+        $scope.collections = [];
+        $scope.selectedCollections = {};
+
+        $uibModalInstance.opened.then(function () {
+            var collectionUsed = [];
+            for (var i = 0; i < collections.length; i++) {
+                if (collections[i].id) {
+                    collectionUsed.push(collections[i]);
+                }
+            }
+            $scope.collections = collectionUsed;
+
+            $scope.cipher = cipher;
+
+            var selectedCollections = {};
+            if ($scope.cipher.collectionIds) {
+                for (i = 0; i < $scope.cipher.collectionIds.length; i++) {
+                    selectedCollections[$scope.cipher.collectionIds[i]] = true;
+                }
+            }
+            $scope.selectedCollections = selectedCollections;
+        });
+
+        $scope.toggleCollectionSelectionAll = function ($event) {
+            var collections = {};
+            if ($event.target.checked) {
+                for (var i = 0; i < $scope.collections.length; i++) {
+                    collections[$scope.collections[i].id] = true;
+                }
+            }
+
+            $scope.selectedCollections = collections;
+        };
+
+        $scope.toggleCollectionSelection = function (id) {
+            if (id in $scope.selectedCollections) {
+                delete $scope.selectedCollections[id];
+            }
+            else {
+                $scope.selectedCollections[id] = true;
+            }
+        };
+
+        $scope.collectionSelected = function (collection) {
+            return collection.id in $scope.selectedCollections;
+        };
+
+        $scope.allSelected = function () {
+            return Object.keys($scope.selectedCollections).length === $scope.collections.length;
+        };
+
+        $scope.submit = function () {
+            var request = {
+                collectionIds: []
+            };
+
+            for (var id in $scope.selectedCollections) {
+                if ($scope.selectedCollections.hasOwnProperty(id)) {
+                    request.collectionIds.push(id);
+                }
+            }
+
+            $scope.submitPromise = apiService.ciphers.putCollectionsAdmin({ id: cipher.id }, request)
+                .$promise.then(function (response) {
+                    $analytics.eventTrack('Edited Login Collections');
+                    $uibModalInstance.close({
+                        action: 'collectionsEdit',
+                        collectionIds: request.collectionIds
+                    });
+                });
+        };
+
+        $scope.close = function () {
+            $uibModalInstance.dismiss('cancel');
+        };
+    });

src/app/organization/views/organizationBilling.html

@@ -0,0 +1,161 @@
+<section class="content-header">
+    <h1>
+        Billing
+        <small>manage your payments</small>
+    </h1>
+</section>
+<section class="content">
+    <div class="callout callout-warning" ng-if="subscription && subscription.cancelled">
+        <h4><i class="fa fa-warning"></i> Cancelled</h4>
+        The subscription to this organization has been canceled.
+    </div>
+    <div class="callout callout-warning" ng-if="subscription && subscription.markedForCancel">
+        <h4><i class="fa fa-warning"></i> Pending Cancellation</h4>
+        <p>
+            The subscription to this organization has been marked for cancellation at the end of the
+            current billing period.
+        </p>
+        <button type="button" class="btn btn-default btn-flat" ng-click="reinstate()">
+            Reinstate Plan
+        </button>
+    </div>
+    <div class="box">
+        <div class="box-header with-border">
+            <h3 class="box-title">Plan</h3>
+        </div>
+        <div class="box-body">
+            <div class="row">
+                <div class="col-sm-6">
+                    <dl>
+                        <dt>Name</dt>
+                        <dd>{{plan.name || '-'}}</dd>
+                        <dt>Total Seats</dt>
+                        <dd>{{plan.seats || '-'}}</dd>
+                    </dl>
+                </div>
+                <div class="col-sm-6">
+                    <dl>
+                        <dt>Status</dt>
+                        <dd style="text-transform: capitalize;">{{(subscription && subscription.status) || '-'}}</dd>
+                        <dt>Next Charge</dt>
+                        <dd>{{nextInvoice ? ((nextInvoice.date | date: format: mediumDate) + ', ' + (nextInvoice.amount | currency:'$')) : '-'}}</dd>
+                    </dl>
+                </div>
+            </div>
+            <div class="row" ng-if="!noSubscription">
+                <div class="col-md-6">
+                    <strong>Details</strong>
+                    <div ng-show="loading">
+                        Loading...
+                    </div>
+                    <div class="table-responsive" style="margin: 0;" ng-show="!loading">
+                        <table class="table" style="margin: 0;">
+                            <tbody>
+                                <tr ng-repeat="item in subscription.items">
+                                    <td>
+                                        {{item.name}} {{item.qty > 1 ? '&times;' + item.qty : ''}}
+                                        @ {{item.amount | currency:'$'}} /{{item.interval}}
+                                    </td>
+                                    <td class="text-right">{{(item.qty * item.amount) | currency:'$'}} /{{item.interval}}</td>
+                                </tr>
+                            </tbody>
+                        </table>
+                    </div>
+                </div>
+            </div>
+        </div>
+        <div class="box-footer">
+            <button type="button" class="btn btn-default btn-flat" ng-click="changePlan()">
+                Change Plan
+            </button>
+            <button type="button" class="btn btn-default btn-flat" ng-click="cancel()"
+                    ng-if="!noSubscription && !subscription.cancelled && !subscription.markedForCancel">
+                Cancel Plan
+            </button>
+            <button type="button" class="btn btn-default btn-flat" ng-click="reinstate()"
+                    ng-if="!noSubscription && subscription.markedForCancel">
+                Reinstate Plan
+            </button>
+        </div>
+    </div>
+    <div class="box">
+        <div class="box-header with-border">
+            <h3 class="box-title">User Seats</h3>
+        </div>
+        <div class="box-body">
+            <div ng-show="loading">
+                Loading...
+            </div>
+            <div ng-show="!loading">
+                You plan currently has a total of <b>{{plan.seats}}</b> seats.
+            </div>
+        </div>
+        <div class="box-footer" ng-if="!noSubscription">
+            <button type="button" class="btn btn-default btn-flat" ng-click="adjustSeats(true)">
+                Add Seats
+            </button>
+            <button type="button" class="btn btn-default btn-flat" ng-click="adjustSeats(false)">
+                Remove Seats
+            </button>
+        </div>
+    </div>
+    <div class="box">
+        <div class="box-header with-border">
+            <h3 class="box-title">Payment Method</h3>
+        </div>
+        <div class="box-body">
+            <div ng-show="loading">
+                Loading...
+            </div>
+            <div ng-show="!loading && !paymentSource">
+                <i class="fa fa-credit-card"></i> No payment method on file.
+            </div>
+            <div ng-show="!loading && paymentSource">
+                <i class="fa" ng-class="{'fa-credit-card': paymentSource.type === 0,
+                   'fa-university': paymentSource.type === 1}"></i>
+                {{paymentSource.description}}
+            </div>
+        </div>
+        <div class="box-footer">
+            <button type="button" class="btn btn-default btn-flat" ng-click="changePayment()">
+                {{ paymentSource ? 'Change Payment Method' : 'Add Payment Method' }}
+            </button>
+        </div>
+    </div>
+    <div class="box">
+        <div class="box-header with-border">
+            <h3 class="box-title">Charges</h3>
+        </div>
+        <div class="box-body">
+            <div ng-show="loading">
+                Loading...
+            </div>
+            <div ng-show="!loading && !charges.length">
+                No charges.
+            </div>
+            <div class="table-responsive" ng-show="charges.length">
+                <table class="table">
+                    <tbody>
+                        <tr ng-repeat="charge in charges">
+                            <td style="width: 200px">
+                                {{charge.date | date: format: mediumDate}}
+                            </td>
+                            <td>
+                                {{charge.paymentSource}}
+                            </td>
+                            <td style="width: 150px; text-transform: capitalize;">
+                                {{charge.status}}
+                            </td>
+                            <td class="text-right" style="width: 150px;">
+                                {{charge.amount | currency:'$'}}
+                            </td>
+                        </tr>
+                    </tbody>
+                </table>
+            </div>
+        </div>
+        <div class="box-footer">
+            Note: Any charges will appears on your credit card statement as <b>BITWARDEN</b>.
+        </div>
+    </div>
+</section>

src/app/organization/views/organizationBillingAdjustSeats.html

@@ -0,0 +1,46 @@
+<div class="modal-header">
+    <button type="button" class="close" ng-click="close()" aria-label="Close"><span aria-hidden="true">&times;</span></button>
+    <h4 class="modal-title">
+        <i class="fa fa-users"></i>
+        {{add ? 'Add Seats' : 'Remove Seats'}}
+    </h4>
+</div>
+<form name="form" ng-submit="form.$valid && submit()" api-form="submitPromise">
+    <div class="modal-body">
+        <div class="callout callout-default" ng-show="add">
+            <h4><i class="fa fa-dollar"></i> Note About Charges</h4>
+            <p>
+                Adding seats to your plan will result in adjustments to your billing totals and immediately charge your
+                payment method on file. The first charge will be prorated for the remainder of the current billing cycle.
+            </p>
+        </div>
+        <div class="callout callout-default" ng-show="!add">
+            <h4><i class="fa fa-dollar"></i> Note About Charges</h4>
+            <p>
+                Removing seats will result in adjustments to your billing totals that will be prorated as credits
+                to your next billing charge.
+            </p>
+        </div>
+        <div class="callout callout-danger validation-errors" ng-show="form.$errors">
+            <h4>Errors have occured</h4>
+            <ul>
+                <li ng-repeat="e in form.$errors">{{e}}</li>
+            </ul>
+        </div>
+        <div class="row">
+            <div class="col-md-6">
+                <div class="form-group">
+                    <label for="seats">{{add ? 'Seats To Add' : 'Seats To Remove'}}</label>
+                    <input type="number" id="seats" name="SeatAdjustment" ng-model="seatAdjustment" class="form-control"
+                           required min="0" />
+                </div>
+            </div>
+        </div>
+    </div>
+    <div class="modal-footer">
+        <button type="submit" class="btn btn-primary btn-flat" ng-disabled="form.$loading">
+            <i class="fa fa-refresh fa-spin loading-icon" ng-show="form.$loading"></i>Submit
+        </button>
+        <button type="button" class="btn btn-default btn-flat" ng-click="close()">Close</button>
+    </div>
+</form>

src/app/organization/views/organizationBillingChangePayment.html

@@ -0,0 +1,364 @@
+<div class="modal-header">
+    <button type="button" class="close" ng-click="close()" aria-label="Close"><span aria-hidden="true">&times;</span></button>
+    <h4 class="modal-title">
+        <i class="fa fa-credit-card"></i>
+        {{existingPaymentMethod ? 'Change Payment Method' : 'Add Payment Method'}}
+    </h4>
+</div>
+<form name="form" ng-submit="form.$valid && submit()" api-form="submitPromise">
+    <div class="modal-body">
+        <div class="callout callout-danger validation-errors" ng-show="form.$errors">
+            <h4>Errors have occured</h4>
+            <ul>
+                <li ng-repeat="e in form.$errors">{{e}}</li>
+            </ul>
+        </div>
+        <div class="row">
+            <div class="col-md-6">
+                <div class="form-group" show-errors>
+                    <label for="card_number">Card Number</label>
+                    <input type="text" id="card_number" name="card_number" ng-model="card.number"
+                           class="form-control" cc-number required api-field />
+                </div>
+            </div>
+        </div>
+        <ul class="list-inline">
+            <li><div class="cc visa"></div></li>
+            <li><div class="cc mastercard"></div></li>
+            <li><div class="cc amex"></div></li>
+            <li><div class="cc discover"></div></li>
+            <li><div class="cc diners"></div></li>
+            <li><div class="cc jcb"></div></li>
+        </ul>
+        <div class="row">
+            <div class="col-sm-4">
+                <div class="form-group" show-errors>
+                    <label for="exp_month">Expiration Month</label>
+                    <select id="exp_month" class="form-control" ng-model="card.exp_month" required cc-exp-month
+                            name="exp_month" api-field>
+                        <option value="">-- Select --</option>
+                        <option value="01">01 - January</option>
+                        <option value="02">02 - February</option>
+                        <option value="03">03 - March</option>
+                        <option value="04">04 - April</option>
+                        <option value="05">05 - May</option>
+                        <option value="06">06 - June</option>
+                        <option value="07">07 - July</option>
+                        <option value="08">08 - August</option>
+                        <option value="09">09 - September</option>
+                        <option value="10">10 - October</option>
+                        <option value="11">11 - November</option>
+                        <option value="12">12 - December</option>
+                    </select>
+                </div>
+            </div>
+            <div class="col-sm-4">
+                <div class="form-group" show-errors>
+                    <label for="exp_year">Expiration Year</label>
+                    <select id="exp_year" class="form-control" ng-model="card.exp_year" required cc-exp-year
+                            name="exp_year" api-field>
+                        <option value="">-- Select --</option>
+                        <option value="17">2017</option>
+                        <option value="18">2018</option>
+                        <option value="19">2019</option>
+                        <option value="20">2020</option>
+                        <option value="21">2021</option>
+                        <option value="22">2022</option>
+                        <option value="23">2023</option>
+                        <option value="24">2024</option>
+                        <option value="25">2025</option>
+                        <option value="26">2026</option>
+                    </select>
+                </div>
+            </div>
+            <div class="col-sm-4">
+                <div class="form-group" show-errors>
+                    <label for="cvc">
+                        CVC
+                        <a href="https://www.cvvnumber.com/cvv.html" target="_blank" title="What is this?"
+                           rel="noopener noreferrer">
+                            <i class="fa fa-question-circle"></i>
+                        </a>
+                    </label>
+                    <input type="text" id="cvc" ng-model="card.cvc" class="form-control" name="cvc"
+                           cc-type="number.$ccType" cc-cvc required api-field />
+                </div>
+            </div>
+        </div>
+        <div class="row">
+            <div class="col-sm-6">
+                <div class="form-group" show-errors>
+                    <label for="address_country">Country</label>
+                    <select id="address_country" class="form-control" ng-model="card.address_country"
+                            required name="address_country" api-field>
+                        <option value="">-- Select --</option>
+                        <option value="US">United States</option>
+                        <option value="CN">China</option>
+                        <option value="FR">France</option>
+                        <option value="DE">Germany</option>
+                        <option value="CA">Canada</option>
+                        <option value="GB">United Kingdom</option>
+                        <option value="AU">Australia</option>
+                        <option value="IN">India</option>
+                        <option value="-" disabled></option>
+                        <option value="AF">Afghanistan</option>
+                        <option value="AX">Åland Islands</option>
+                        <option value="AL">Albania</option>
+                        <option value="DZ">Algeria</option>
+                        <option value="AS">American Samoa</option>
+                        <option value="AD">Andorra</option>
+                        <option value="AO">Angola</option>
+                        <option value="AI">Anguilla</option>
+                        <option value="AQ">Antarctica</option>
+                        <option value="AG">Antigua and Barbuda</option>
+                        <option value="AR">Argentina</option>
+                        <option value="AM">Armenia</option>
+                        <option value="AW">Aruba</option>
+                        <option value="AT">Austria</option>
+                        <option value="AZ">Azerbaijan</option>
+                        <option value="BS">Bahamas</option>
+                        <option value="BH">Bahrain</option>
+                        <option value="BD">Bangladesh</option>
+                        <option value="BB">Barbados</option>
+                        <option value="BY">Belarus</option>
+                        <option value="BE">Belgium</option>
+                        <option value="BZ">Belize</option>
+                        <option value="BJ">Benin</option>
+                        <option value="BM">Bermuda</option>
+                        <option value="BT">Bhutan</option>
+                        <option value="BO">Bolivia, Plurinational State of</option>
+                        <option value="BQ">Bonaire, Sint Eustatius and Saba</option>
+                        <option value="BA">Bosnia and Herzegovina</option>
+                        <option value="BW">Botswana</option>
+                        <option value="BV">Bouvet Island</option>
+                        <option value="BR">Brazil</option>
+                        <option value="IO">British Indian Ocean Territory</option>
+                        <option value="BN">Brunei Darussalam</option>
+                        <option value="BG">Bulgaria</option>
+                        <option value="BF">Burkina Faso</option>
+                        <option value="BI">Burundi</option>
+                        <option value="KH">Cambodia</option>
+                        <option value="CM">Cameroon</option>
+                        <option value="CV">Cape Verde</option>
+                        <option value="KY">Cayman Islands</option>
+                        <option value="CF">Central African Republic</option>
+                        <option value="TD">Chad</option>
+                        <option value="CL">Chile</option>
+                        <option value="CX">Christmas Island</option>
+                        <option value="CC">Cocos (Keeling) Islands</option>
+                        <option value="CO">Colombia</option>
+                        <option value="KM">Comoros</option>
+                        <option value="CG">Congo</option>
+                        <option value="CD">Congo, the Democratic Republic of the</option>
+                        <option value="CK">Cook Islands</option>
+                        <option value="CR">Costa Rica</option>
+                        <option value="CI">Côte d'Ivoire</option>
+                        <option value="HR">Croatia</option>
+                        <option value="CU">Cuba</option>
+                        <option value="CW">Curaçao</option>
+                        <option value="CY">Cyprus</option>
+                        <option value="CZ">Czech Republic</option>
+                        <option value="DK">Denmark</option>
+                        <option value="DJ">Djibouti</option>
+                        <option value="DM">Dominica</option>
+                        <option value="DO">Dominican Republic</option>
+                        <option value="EC">Ecuador</option>
+                        <option value="EG">Egypt</option>
+                        <option value="SV">El Salvador</option>
+                        <option value="GQ">Equatorial Guinea</option>
+                        <option value="ER">Eritrea</option>
+                        <option value="EE">Estonia</option>
+                        <option value="ET">Ethiopia</option>
+                        <option value="FK">Falkland Islands (Malvinas)</option>
+                        <option value="FO">Faroe Islands</option>
+                        <option value="FJ">Fiji</option>
+                        <option value="FI">Finland</option>
+                        <option value="GF">French Guiana</option>
+                        <option value="PF">French Polynesia</option>
+                        <option value="TF">French Southern Territories</option>
+                        <option value="GA">Gabon</option>
+                        <option value="GM">Gambia</option>
+                        <option value="GE">Georgia</option>
+                        <option value="GH">Ghana</option>
+                        <option value="GI">Gibraltar</option>
+                        <option value="GR">Greece</option>
+                        <option value="GL">Greenland</option>
+                        <option value="GD">Grenada</option>
+                        <option value="GP">Guadeloupe</option>
+                        <option value="GU">Guam</option>
+                        <option value="GT">Guatemala</option>
+                        <option value="GG">Guernsey</option>
+                        <option value="GN">Guinea</option>
+                        <option value="GW">Guinea-Bissau</option>
+                        <option value="GY">Guyana</option>
+                        <option value="HT">Haiti</option>
+                        <option value="HM">Heard Island and McDonald Islands</option>
+                        <option value="VA">Holy See (Vatican City State)</option>
+                        <option value="HN">Honduras</option>
+                        <option value="HK">Hong Kong</option>
+                        <option value="HU">Hungary</option>
+                        <option value="IS">Iceland</option>
+                        <option value="ID">Indonesia</option>
+                        <option value="IR">Iran, Islamic Republic of</option>
+                        <option value="IQ">Iraq</option>
+                        <option value="IE">Ireland</option>
+                        <option value="IM">Isle of Man</option>
+                        <option value="IL">Israel</option>
+                        <option value="IT">Italy</option>
+                        <option value="JM">Jamaica</option>
+                        <option value="JP">Japan</option>
+                        <option value="JE">Jersey</option>
+                        <option value="JO">Jordan</option>
+                        <option value="KZ">Kazakhstan</option>
+                        <option value="KE">Kenya</option>
+                        <option value="KI">Kiribati</option>
+                        <option value="KP">Korea, Democratic People's Republic of</option>
+                        <option value="KR">Korea, Republic of</option>
+                        <option value="KW">Kuwait</option>
+                        <option value="KG">Kyrgyzstan</option>
+                        <option value="LA">Lao People's Democratic Republic</option>
+                        <option value="LV">Latvia</option>
+                        <option value="LB">Lebanon</option>
+                        <option value="LS">Lesotho</option>
+                        <option value="LR">Liberia</option>
+                        <option value="LY">Libya</option>
+                        <option value="LI">Liechtenstein</option>
+                        <option value="LT">Lithuania</option>
+                        <option value="LU">Luxembourg</option>
+                        <option value="MO">Macao</option>
+                        <option value="MK">Macedonia, the former Yugoslav Republic of</option>
+                        <option value="MG">Madagascar</option>
+                        <option value="MW">Malawi</option>
+                        <option value="MY">Malaysia</option>
+                        <option value="MV">Maldives</option>
+                        <option value="ML">Mali</option>
+                        <option value="MT">Malta</option>
+                        <option value="MH">Marshall Islands</option>
+                        <option value="MQ">Martinique</option>
+                        <option value="MR">Mauritania</option>
+                        <option value="MU">Mauritius</option>
+                        <option value="YT">Mayotte</option>
+                        <option value="MX">Mexico</option>
+                        <option value="FM">Micronesia, Federated States of</option>
+                        <option value="MD">Moldova, Republic of</option>
+                        <option value="MC">Monaco</option>
+                        <option value="MN">Mongolia</option>
+                        <option value="ME">Montenegro</option>
+                        <option value="MS">Montserrat</option>
+                        <option value="MA">Morocco</option>
+                        <option value="MZ">Mozambique</option>
+                        <option value="MM">Myanmar</option>
+                        <option value="NA">Namibia</option>
+                        <option value="NR">Nauru</option>
+                        <option value="NP">Nepal</option>
+                        <option value="NL">Netherlands</option>
+                        <option value="NC">New Caledonia</option>
+                        <option value="NZ">New Zealand</option>
+                        <option value="NI">Nicaragua</option>
+                        <option value="NE">Niger</option>
+                        <option value="NG">Nigeria</option>
+                        <option value="NU">Niue</option>
+                        <option value="NF">Norfolk Island</option>
+                        <option value="MP">Northern Mariana Islands</option>
+                        <option value="NO">Norway</option>
+                        <option value="OM">Oman</option>
+                        <option value="PK">Pakistan</option>
+                        <option value="PW">Palau</option>
+                        <option value="PS">Palestinian Territory, Occupied</option>
+                        <option value="PA">Panama</option>
+                        <option value="PG">Papua New Guinea</option>
+                        <option value="PY">Paraguay</option>
+                        <option value="PE">Peru</option>
+                        <option value="PH">Philippines</option>
+                        <option value="PN">Pitcairn</option>
+                        <option value="PL">Poland</option>
+                        <option value="PT">Portugal</option>
+                        <option value="PR">Puerto Rico</option>
+                        <option value="QA">Qatar</option>
+                        <option value="RE">Réunion</option>
+                        <option value="RO">Romania</option>
+                        <option value="RU">Russian Federation</option>
+                        <option value="RW">Rwanda</option>
+                        <option value="BL">Saint Barthélemy</option>
+                        <option value="SH">Saint Helena, Ascension and Tristan da Cunha</option>
+                        <option value="KN">Saint Kitts and Nevis</option>
+                        <option value="LC">Saint Lucia</option>
+                        <option value="MF">Saint Martin (French part)</option>
+                        <option value="PM">Saint Pierre and Miquelon</option>
+                        <option value="VC">Saint Vincent and the Grenadines</option>
+                        <option value="WS">Samoa</option>
+                        <option value="SM">San Marino</option>
+                        <option value="ST">Sao Tome and Principe</option>
+                        <option value="SA">Saudi Arabia</option>
+                        <option value="SN">Senegal</option>
+                        <option value="RS">Serbia</option>
+                        <option value="SC">Seychelles</option>
+                        <option value="SL">Sierra Leone</option>
+                        <option value="SG">Singapore</option>
+                        <option value="SX">Sint Maarten (Dutch part)</option>
+                        <option value="SK">Slovakia</option>
+                        <option value="SI">Slovenia</option>
+                        <option value="SB">Solomon Islands</option>
+                        <option value="SO">Somalia</option>
+                        <option value="ZA">South Africa</option>
+                        <option value="GS">South Georgia and the South Sandwich Islands</option>
+                        <option value="SS">South Sudan</option>
+                        <option value="ES">Spain</option>
+                        <option value="LK">Sri Lanka</option>
+                        <option value="SD">Sudan</option>
+                        <option value="SR">Suriname</option>
+                        <option value="SJ">Svalbard and Jan Mayen</option>
+                        <option value="SZ">Swaziland</option>
+                        <option value="SE">Sweden</option>
+                        <option value="CH">Switzerland</option>
+                        <option value="SY">Syrian Arab Republic</option>
+                        <option value="TW">Taiwan, Province of China</option>
+                        <option value="TJ">Tajikistan</option>
+                        <option value="TZ">Tanzania, United Republic of</option>
+                        <option value="TH">Thailand</option>
+                        <option value="TL">Timor-Leste</option>
+                        <option value="TG">Togo</option>
+                        <option value="TK">Tokelau</option>
+                        <option value="TO">Tonga</option>
+                        <option value="TT">Trinidad and Tobago</option>
+                        <option value="TN">Tunisia</option>
+                        <option value="TR">Turkey</option>
+                        <option value="TM">Turkmenistan</option>
+                        <option value="TC">Turks and Caicos Islands</option>
+                        <option value="TV">Tuvalu</option>
+                        <option value="UG">Uganda</option>
+                        <option value="UA">Ukraine</option>
+                        <option value="AE">United Arab Emirates</option>
+                        <option value="UM">United States Minor Outlying Islands</option>
+                        <option value="UY">Uruguay</option>
+                        <option value="UZ">Uzbekistan</option>
+                        <option value="VU">Vanuatu</option>
+                        <option value="VE">Venezuela, Bolivarian Republic of</option>
+                        <option value="VN">Viet Nam</option>
+                        <option value="VG">Virgin Islands, British</option>
+                        <option value="VI">Virgin Islands, U.S.</option>
+                        <option value="WF">Wallis and Futuna</option>
+                        <option value="EH">Western Sahara</option>
+                        <option value="YE">Yemen</option>
+                        <option value="ZM">Zambia</option>
+                        <option value="ZW">Zimbabwe</option>
+                    </select>
+                </div>
+            </div>
+            <div class="col-sm-6">
+                <div class="form-group" show-errors>
+                    <label for="address_zip"
+                           ng-bind="card.address_country === 'US' ? 'Zip Code' : 'Postal Code'"></label>
+                    <input type="text" id="address_zip" ng-model="card.address_zip"
+                           class="form-control" required name="address_zip" api-field />
+                </div>
+            </div>
+        </div>
+    </div>
+    <div class="modal-footer">
+        <button type="submit" class="btn btn-primary btn-flat" ng-disabled="form.$loading">
+            <i class="fa fa-refresh fa-spin loading-icon" ng-show="form.$loading"></i>Submit
+        </button>
+        <button type="button" class="btn btn-default btn-flat" ng-click="close()">Close</button>
+    </div>
+</form>

src/app/organization/views/organizationBillingChangePlan.html

@@ -0,0 +1,13 @@
+<div class="modal-header">
+    <button type="button" class="close" ng-click="close()" aria-label="Close"><span aria-hidden="true">&times;</span></button>
+    <h4 class="modal-title"><i class="fa fa-file-text-o"></i> Change Plan</h4>
+</div>
+<form name="form" ng-submit="form.$valid && submit()" api-form="submitPromise">
+    <div class="modal-body">
+        Coming soon. In the meantime, please <a href="https://bitwarden.com/contact/" target="_blank">contact us</a>
+        if you would like to change your plan.
+    </div>
+    <div class="modal-footer">
+        <button type="button" class="btn btn-default btn-flat" ng-click="close()">Close</button>
+    </div>
+</form>

src/app/organization/views/organizationCollections.html

@@ -0,0 +1,75 @@
+<section class="content-header">
+    <h1>
+        Collections
+        <small>control what you share</small>
+    </h1>
+</section>
+<section class="content">
+    <div class="box">
+        <div class="box-header with-border">
+            &nbsp;
+            <div class="box-filters hidden-xs">
+                <div class="form-group form-group-sm has-feedback has-feedback-left">
+                    <input type="text" id="search" class="form-control" placeholder="Search collections..."
+                           style="width: 200px;" ng-model="filterSearch">
+                    <span class="fa fa-search form-control-feedback text-muted" aria-hidden="true"></span>
+                </div>
+            </div>
+            <div class="box-tools">
+                <button type="button" class="btn btn-primary btn-sm btn-flat" ng-click="add()">
+                    <i class="fa fa-fw fa-plus-circle"></i> New Collection
+                </button>
+            </div>
+        </div>
+        <div class="box-body" ng-class="{'no-padding': filteredCollections.length}">
+            <div ng-show="loading && !collections.length">
+                Loading...
+            </div>
+            <div ng-show="!filteredCollections.length && filterSearch">
+                No collections to list.
+            </div>
+            <div ng-show="!loading && !collections.length">
+                <p>There are no collections yet for your organization.</p>
+                <button type="button" ng-click="add()" class="btn btn-default btn-flat">Add a Collection</button>
+            </div>
+            <div class="table-responsive" ng-show="collections.length">
+                <table class="table table-striped table-hover table-vmiddle">
+                    <tbody>
+                        <tr ng-repeat="collection in filteredCollections = (collections | filter: (filterSearch || '') |
+                            orderBy: ['name']) track by collection.id">
+                            <td style="width: 70px;">
+                                <div class="btn-group" data-append-to="body">
+                                    <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
+                                        <i class="fa fa-cog"></i> <span class="caret"></span>
+                                    </button>
+                                    <ul class="dropdown-menu">
+                                        <li>
+                                            <a href="javascript:void(0)" ng-click="users(collection)">
+                                                <i class="fa fa-fw fa-users"></i> Users
+                                            </a>
+                                        </li>
+                                        <li>
+                                            <a href="javascript:void(0)" ng-click="groups(collection)">
+                                                <i class="fa fa-fw fa-sitemap"></i> Groups
+                                            </a>
+                                        </li>
+                                        <li>
+                                            <a href="javascript:void(0)" ng-click="delete(collection)" class="text-red">
+                                                <i class="fa fa-fw fa-trash"></i> Delete
+                                            </a>
+                                        </li>
+                                    </ul>
+                                </div>
+                            </td>
+                            <td valign="middle">
+                                <a href="javascript:void(0)" ng-click="edit(collection)">
+                                    {{collection.name}}
+                                </a>
+                            </td>
+                        </tr>
+                    </tbody>
+                </table>
+            </div>
+        </div>
+    </div>
+</section>

src/app/organization/views/organizationCollectionsAdd.html

@@ -0,0 +1,34 @@
+<div class="modal-header">
+    <button type="button" class="close" ng-click="close()" aria-label="Close"><span aria-hidden="true">&times;</span></button>
+    <h4 class="modal-title"><i class="fa fa-cubes"></i> Add New Collection</h4>
+</div>
+<form name="form" ng-submit="form.$valid && submit(model)" api-form="submitPromise">
+    <div class="modal-body">
+        <div class="callout callout-danger validation-errors" ng-show="form.$errors">
+            <h4>Errors have occured</h4>
+            <ul>
+                <li ng-repeat="e in form.$errors">{{e}}</li>
+            </ul>
+        </div>
+        <div class="form-group" show-errors>
+            <label for="email">Name</label>
+            <input type="text" id="name" name="Name" ng-model="model.name" class="form-control" required api-field />
+        </div>
+        <div class="callout callout-default">
+            <h4><i class="fa fa-info-circle"></i> Note</h4>
+            <p>
+                After creating the collection, you can associate a user to it by selecting a specific user on the "People" page.
+            </p>
+            <p>
+                You can associate new logins to the collection from your organization's "Vault" or by sharing an existing
+                login from "My vault".
+            </p>
+        </div>
+    </div>
+    <div class="modal-footer">
+        <button type="submit" class="btn btn-primary btn-flat" ng-disabled="form.$loading">
+            <i class="fa fa-refresh fa-spin loading-icon" ng-show="form.$loading"></i>Submit
+        </button>
+        <button type="button" class="btn btn-default btn-flat" ng-click="close()">Close</button>
+    </div>
+</form>

src/app/organization/views/organizationCollectionsEdit.html

@@ -0,0 +1,35 @@
+<div class="modal-header">
+    <button type="button" class="close" ng-click="close()" aria-label="Close"><span aria-hidden="true">&times;</span></button>
+    <h4 class="modal-title"><i class="fa fa-cubes"></i> Edit Collection</h4>
+</div>
+<form name="form" ng-submit="form.$valid && submit(collection)" api-form="submitPromise">
+    <div class="modal-body">
+        <div class="callout callout-danger validation-errors" ng-show="form.$errors">
+            <h4>Errors have occured</h4>
+            <ul>
+                <li ng-repeat="e in form.$errors">{{e}}</li>
+            </ul>
+        </div>
+        <div class="form-group" show-errors>
+            <label for="email">Name</label>
+            <input type="text" id="name" name="Name" ng-model="collection.name" class="form-control" required api-field />
+        </div>
+        <div class="callout callout-default">
+            <h4><i class="fa fa-info-circle"></i> Note</h4>
+            <p>
+                Select "Users" from the listing options to manage existing users for this collection. Associate new users by
+                editing the user's access on the "People" page.
+            </p>
+            <p>
+                You can associate new logins to the collection from your organization's "Vault" or by sharing an existing
+                login from "My vault".
+            </p>
+        </div>
+    </div>
+    <div class="modal-footer">
+        <button type="submit" class="btn btn-primary btn-flat" ng-disabled="form.$loading">
+            <i class="fa fa-refresh fa-spin loading-icon" ng-show="form.$loading"></i>Submit
+        </button>
+        <button type="button" class="btn btn-default btn-flat" ng-click="close()">Close</button>
+    </div>
+</form>

src/app/organization/views/organizationCollectionsGroups.html

@@ -1,9 +1,9 @@
 <div class="modal-header">
     <button type="button" class="close" ng-click="close()" aria-label="Close"><span aria-hidden="true">&times;</span></button>
-    <h4 class="modal-title" id="auditsModelLabel"><i class="fa fa-search"></i> Audits</h4>
+    <h4 class="modal-title"><i class="fa fa-sitemap"></i> Groups <small>{{collection.name}}</small></h4>
 </div>
 <div class="modal-body">
-    Coming soon...
+    Groups are coming soon to bitwarden Enterprise organizations.
 </div>
 <div class="modal-footer">
     <button type="button" class="btn btn-default btn-flat" ng-click="close()">Close</button>

src/app/organization/views/organizationCollectionsUsers.html

@@ -0,0 +1,64 @@
+<div class="modal-header">
+    <button type="button" class="close" ng-click="close()" aria-label="Close"><span aria-hidden="true">&times;</span></button>
+    <h4 class="modal-title"><i class="fa fa-users"></i> User Access <small>{{collection.name}}</small></h4>
+</div>
+<div class="modal-body">
+    <div ng-show="loading && !users.length">
+        Loading...
+    </div>
+    <div ng-show="!loading && !users.length">
+        <p>
+            No users for this collection. You can associate a new user to this collection by
+            selecting a specific user on the "People" page.
+        </p>
+    </div>
+    <div class="table-responsive" ng-show="users.length" style="margin: 0;">
+        <table class="table table-striped table-hover table-vmiddle" style="margin: 0;">
+            <tbody>
+                <tr ng-repeat="user in users | orderBy: ['email']">
+                    <td style="width: 70px;">
+                        <div class="btn-group" data-append-to=".modal">
+                            <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
+                                <i class="fa fa-cog"></i> <span class="caret"></span>
+                            </button>
+                            <ul class="dropdown-menu">
+                                <li ng-show="user.id">
+                                    <a href="javascript:void(0)" ng-click="remove(user)" class="text-red">
+                                        <i class="fa fa-fw fa-remove"></i> Remove
+                                    </a>
+                                </li>
+                                <li ng-show="!user.id">
+                                    <a href="javascript:void(0)">
+                                        No options...
+                                    </a>
+                                </li>
+                            </ul>
+                        </div>
+                    </td>
+                    <td style="width: 45px;">
+                        <letter-avatar data="{{user.name || user.email}}"></letter-avatar>
+                    </td>
+                    <td>
+                        {{user.email}}
+                        <div ng-if="user.name"><small class="text-muted">{{user.name}}</small></div>
+                    </td>
+                    <td style="width: 60px;" class="text-right">
+                        <i class="fa fa-unlock" ng-show="user.accessAll" title="Can Access All Items"></i>
+                        <i class="fa fa-pencil-square-o" ng-show="!user.readOnly" title="Can Edit"></i>
+                    </td>
+                    <td style="width: 100px;">
+                        {{user.type | enumName: 'OrgUserType'}}
+                    </td>
+                    <td style="width: 120px;">
+                        <span class="label {{user.status | enumLabelClass: 'OrgUserStatus'}}">
+                            {{user.status | enumName: 'OrgUserStatus'}}
+                        </span>
+                    </td>
+                </tr>
+            </tbody>
+        </table>
+    </div>
+</div>
+<div class="modal-footer">
+    <button type="button" class="btn btn-default btn-flat" ng-click="close()">Close</button>
+</div>

src/app/organization/views/organizationDashboard.html

@@ -0,0 +1,32 @@
+<section class="content-header">
+    <h1>
+        Dashboard
+        <small>{{orgProfile.name}}</small>
+    </h1>
+</section>
+<section class="content">
+    <div class="callout callout-warning" ng-if="!orgProfile.enabled">
+        <h4><i class="fa fa-warning"></i> Organization Disabled</h4>
+        <p>
+            This organization is currently disabled. Users will not see your shared logins or collections.
+            Contact us if you would like to reinstate this organization.
+        </p>
+        <a class="btn btn-default btn-flat" href="https://bitwarden.com/contact/" target="_blank">
+            Contact Us
+        </a>
+    </div>
+    <div class="box">
+        <div class="box-header with-border">
+            <h3 class="box-title">Let's Get Started!</h3>
+        </div>
+        <div class="box-body">
+            <p>Dashboard features are coming soon. Get started by inviting users and creating your collections.</p>
+            <a class="btn btn-default btn-flat" ui-sref="backend.org.people({orgId: orgProfile.id})">
+                Invite Users
+            </a>
+            <a class="btn btn-default btn-flat" ui-sref="backend.org.collections({orgId: orgProfile.id})">
+                Manage Collections
+            </a>
+        </div>
+    </div>
+</section>

src/app/organization/views/organizationDelete.html

@@ -0,0 +1,34 @@
+<div class="modal-header">
+    <button type="button" class="close" ng-click="close()" aria-label="Close"><span aria-hidden="true">&times;</span></button>
+    <h4 class="modal-title"><i class="fa fa-trash"></i> Delete Organization</h4>
+</div>
+<form name="form" ng-submit="form.$valid && submit()" api-form="submitPromise">
+    <div class="modal-body">
+        <p>
+            Continue below to delete this organization and all associated data. This data includes any collections and
+            their associated logins. Individual user accounts will remain, though they will not be associated to this
+            organization anymore.
+        </p>
+        <div class="callout callout-warning">
+            <h4><i class="fa fa-warning"></i> Warning</h4>
+            Deleting this organization is permanent. It cannot be undone.
+        </div>
+        <div class="callout callout-danger validation-errors" ng-show="form.$errors">
+            <h4>Errors have occured</h4>
+            <ul>
+                <li ng-repeat="e in form.$errors">{{e}}</li>
+            </ul>
+        </div>
+        <div class="form-group" show-errors>
+            <label for="masterPassword">Master Password</label>
+            <input type="password" id="masterPassword" name="MasterPasswordHash" ng-model="masterPassword" class="form-control"
+                   required api-field />
+        </div>
+    </div>
+    <div class="modal-footer">
+        <button type="submit" class="btn btn-primary btn-flat" ng-disabled="form.$loading">
+            <i class="fa fa-refresh fa-spin loading-icon" ng-show="form.$loading"></i>Delete
+        </button>
+        <button type="button" class="btn btn-default btn-flat" ng-click="close()">Close</button>
+    </div>
+</form>

src/app/organization/views/organizationGroups.html

@@ -0,0 +1,16 @@
+<section class="content-header">
+    <h1>
+        Groups
+        <small>organize your users</small>
+    </h1>
+</section>
+<section class="content">
+    <div class="box">
+        <div class="box-header with-border">
+            <h3 class="box-title">Coming soon...</h3>
+        </div>
+        <div class="box-body">
+            <p>Groups are coming soon to bitwarden Enterprise organizations.</p>
+        </div>
+    </div>
+</section>

src/app/organization/views/organizationPeople.html

@@ -0,0 +1,85 @@
+<section class="content-header">
+    <h1>
+        People
+        <small>users for your organization</small>
+    </h1>
+</section>
+<section class="content">
+    <div class="box">
+        <div class="box-header with-border">
+            &nbsp;
+            <div class="box-filters hidden-xs">
+                <div class="form-group form-group-sm has-feedback has-feedback-left">
+                    <input type="text" id="search" class="form-control" placeholder="Search people..."
+                           style="width: 200px;" ng-model="filterSearch">
+                    <span class="fa fa-search form-control-feedback text-muted" aria-hidden="true"></span>
+                </div>
+            </div>
+            <div class="box-tools">
+                <button type="button" class="btn btn-primary btn-sm btn-flat" ng-click="invite()">
+                    <i class="fa fa-fw fa-plus-circle"></i> Invite User
+                </button>
+            </div>
+        </div>
+        <div class="box-body" ng-class="{'no-padding': filteredUsers.length}">
+            <div ng-show="!filteredUsers.length && !filterSearch">
+                Loading...
+            </div>
+            <div class="table-responsive" ng-show="filteredUsers.length">
+                <table class="table table-striped table-hover table-vmiddle">
+                    <tbody>
+                        <tr ng-repeat="user in filteredUsers = (users | filter: (filterSearch || '') |
+                            orderBy: ['type', 'name', 'email']) track by user.id">
+                            <td style="width: 70px;">
+                                <div class="btn-group" data-append-to="body">
+                                    <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
+                                        <i class="fa fa-cog"></i> <span class="caret"></span>
+                                    </button>
+                                    <ul class="dropdown-menu">
+                                        <li>
+                                            <a href="javascript:void(0)" ng-click="edit(user.id)">
+                                                <i class="fa fa-fw fa-pencil"></i> Edit
+                                            </a>
+                                        </li>
+                                        <li ng-show="user.status === 1">
+                                            <a href="javascript:void(0)" ng-click="confirm(user)">
+                                                <i class="fa fa-fw fa-check"></i> Confirm
+                                            </a>
+                                        </li>
+                                        <li ng-show="user.status === 0">
+                                            <a href="javascript:void(0)" ng-click="reinvite(user)">
+                                                <i class="fa fa-fw fa-envelope-o"></i> Re-send Invitation
+                                            </a>
+                                        </li>
+                                        <li>
+                                            <a href="javascript:void(0)" ng-click="delete(user)" class="text-red">
+                                                <i class="fa fa-fw fa-remove"></i> Remove
+                                            </a>
+                                        </li>
+                                    </ul>
+                                </div>
+                            </td>
+                            <td style="width: 45px;">
+                                <letter-avatar data="{{user.name || user.email}}"></letter-avatar>
+                            </td>
+                            <td>
+                                <a href="javascript:void(0)" ng-click="edit(user.id)">{{user.email}}</a>
+                                <i class="fa fa-unlock text-muted" ng-show="user.accessAll"
+                                   title="Can Access All Items"></i>
+                                <div ng-if="user.name"><small class="text-muted">{{user.name}}</small></div>
+                            </td>
+                            <td style="width: 100px;">
+                                {{user.type | enumName: 'OrgUserType'}}
+                            </td>
+                            <td style="width: 120px;">
+                                <span class="label {{user.status | enumLabelClass: 'OrgUserStatus'}}">
+                                    {{user.status | enumName: 'OrgUserStatus'}}
+                                </span>
+                            </td>
+                        </tr>
+                    </tbody>
+                </table>
+            </div>
+        </div>
+    </div>
+</section>

src/app/organization/views/organizationPeopleEdit.html

@@ -0,0 +1,101 @@
+<div class="modal-header">
+    <button type="button" class="close" ng-click="close()" aria-label="Close"><span aria-hidden="true">&times;</span></button>
+    <h4 class="modal-title"><i class="fa fa-user"></i> Edit User <small>{{email}}</small></h4>
+</div>
+<form name="form" ng-submit="form.$valid && submit()" api-form="submitPromise">
+    <div class="modal-body">
+        <div class="callout callout-danger validation-errors" ng-show="form.$errors">
+            <h4>Errors have occured</h4>
+            <ul>
+                <li ng-repeat="e in form.$errors">{{e}}</li>
+            </ul>
+        </div>
+        <h4>User Type</h4>
+        <div class="form-group">
+            <div class="radio">
+                <label>
+                    <input type="radio" id="user-type" ng-model="type" name="Type" value="2" ng-checked="type === 2">
+                    <strong>User</strong> - A regular user with access to your organization's collections.
+                </label>
+            </div>
+            <div class="radio">
+                <label>
+                    <input type="radio" ng-model="type" name="Type" value="1" ng-checked="type === 1">
+                    <strong>Admin</strong> - Admins can manage collections and users for your organization.
+                </label>
+            </div>
+            <div class="radio">
+                <label>
+                    <input type="radio" ng-model="type" name="Type" value="0" ng-checked="type === 0">
+                    <strong>Owner</strong> - The highest access user that can manage all aspects of your organization.
+                </label>
+            </div>
+        </div>
+        <h4>Access</h4>
+        <div class="radio">
+            <label>
+                <input type="radio" ng-model="accessAll" name="AccessAll"
+                       ng-value="true" ng-checked="accessAll">
+                This user can access and modify <u>all items</u>.
+            </label>
+        </div>
+        <div class="radio">
+            <label>
+                <input type="radio" ng-model="accessAll" name="AccessAll"
+                       ng-value="false" ng-checked="!accessAll">
+                This user can access only the selected collections.
+            </label>
+        </div>
+        <div ng-show="!accessAll">
+            <div ng-show="loading && !collections.length">
+                Loading collections...
+            </div>
+            <div ng-show="!loading && !collections.length">
+                <p>No collections for your organization.</p>
+            </div>
+            <div class="table-responsive" ng-show="collections.length" style="margin: 0;">
+                <table class="table table-striped table-hover" style="margin: 0;">
+                    <thead>
+                        <tr>
+                            <th style="width: 40px;">
+                                <input type="checkbox"
+                                       ng-checked="allSelected()"
+                                       ng-click="toggleCollectionSelectionAll($event)">
+                            </th>
+                            <th>Name</th>
+                            <th style="width: 100px; text-align: center;">Read Only</th>
+                        </tr>
+                    </thead>
+                    <tbody>
+                        <tr ng-repeat="collection in collections | orderBy: ['name']">
+                            <td valign="middle">
+                                <input type="checkbox"
+                                       name="selectedCollections[]"
+                                       value="{{collection.id}}"
+                                       ng-checked="collectionSelected(collection)"
+                                       ng-click="toggleCollectionSelection(collection.id)">
+                            </td>
+                            <td valign="middle">
+                                {{collection.name}}
+                            </td>
+                            <td style="text-align: center;" valign="middle">
+                                <input type="checkbox"
+                                       name="selectedCollectionsReadonly[]"
+                                       value="{{collection.id}}"
+                                       ng-disabled="!collectionSelected(collection)"
+                                       ng-checked="collectionSelected(collection) && selectedCollections[collection.id].readOnly"
+                                       ng-click="toggleCollectionReadOnlySelection(collection.id)">
+                            </td>
+                        </tr>
+                    </tbody>
+                </table>
+            </div>
+        </div>
+    </div>
+    <div class="modal-footer">
+        <button type="submit" class="btn btn-primary btn-flat" ng-disabled="form.$loading">
+            <i class="fa fa-refresh fa-spin loading-icon" ng-show="form.$loading"></i>Submit
+        </button>
+        <button type="button" class="btn btn-default btn-flat" ng-click="close()">Close</button>
+    </div>
+</form>

src/app/organization/views/organizationPeopleInvite.html

@@ -0,0 +1,109 @@
+<div class="modal-header">
+    <button type="button" class="close" ng-click="close()" aria-label="Close"><span aria-hidden="true">&times;</span></button>
+    <h4 class="modal-title"><i class="fa fa-user"></i> Invite User</h4>
+</div>
+<form name="inviteForm" ng-submit="inviteForm.$valid && submit(model)" api-form="submitPromise">
+    <div class="modal-body">
+        <p>
+            Invite a new user to your organization by entering their bitwarden account email address below. If they do not have
+            a bitwarden account already, they will be prompted to create a new account.
+        </p>
+        <div class="callout callout-danger validation-errors" ng-show="inviteForm.$errors">
+            <h4>Errors have occured</h4>
+            <ul>
+                <li ng-repeat="e in inviteForm.$errors">{{e}}</li>
+            </ul>
+        </div>
+        <div class="form-group" show-errors>
+            <label for="email">Email</label>
+            <input type="email" id="email" name="Email" ng-model="model.email" class="form-control" required api-field />
+        </div>
+        <h4>User Type</h4>
+        <div class="form-group">
+            <div class="radio">
+                <label>
+                    <input type="radio" id="user-type" ng-model="model.type" name="Type" value="User">
+                    <strong>User</strong> - A regular user with access to your organization's collections.
+                </label>
+            </div>
+            <div class="radio">
+                <label>
+                    <input type="radio" ng-model="model.type" name="Type" value="Admin">
+                    <strong>Admin</strong> - Admins can manage collections and users for your organization.
+                </label>
+            </div>
+            <div class="radio">
+                <label>
+                    <input type="radio" ng-model="model.type" name="Type" value="Owner">
+                    <strong>Owner</strong> - The highest access user that can manage all aspects of your organization.
+                </label>
+            </div>
+        </div>
+        <h4>Access</h4>
+        <div class="radio">
+            <label>
+                <input type="radio" ng-model="model.accessAll" name="AccessAll"
+                       ng-value="true" ng-checked="model.accessAll">
+                This user can access and modify <u>all items</u>.
+            </label>
+        </div>
+        <div class="radio">
+            <label>
+                <input type="radio" ng-model="model.accessAll" name="AccessAll"
+                       ng-value="false" ng-checked="!model.accessAll">
+                This user can access only the selected collections.
+            </label>
+        </div>
+        <div ng-show="!model.accessAll">
+            <div ng-show="loading && !collections.length">
+                Loading collections...
+            </div>
+            <div ng-show="!loading && !collections.length">
+                <p>No collections for your organization.</p>
+            </div>
+            <div class="table-responsive" ng-show="collections.length" style="margin: 0;">
+                <table class="table table-striped table-hover" style="margin: 0;">
+                    <thead>
+                        <tr>
+                            <th style="width: 40px;">
+                                <input type="checkbox"
+                                       ng-checked="allSelected()"
+                                       ng-click="toggleCollectionSelectionAll($event)">
+                            </th>
+                            <th>Name</th>
+                            <th style="width: 100px; text-align: center;">Read Only</th>
+                        </tr>
+                    </thead>
+                    <tbody>
+                        <tr ng-repeat="collection in collections | orderBy: ['name'] track by collection.id">
+                            <td style="width: 40px;" valign="middle">
+                                <input type="checkbox"
+                                       name="selectedCollections[]"
+                                       value="{{collection.id}}"
+                                       ng-checked="collectionSelected(collection)"
+                                       ng-click="toggleCollectionSelection(collection.id)">
+                            </td>
+                            <td valign="middle">
+                                {{collection.name}}
+                            </td>
+                            <td style="width: 100px; text-align: center;" valign="middle">
+                                <input type="checkbox"
+                                       name="selectedCollectionsReadonly[]"
+                                       value="{{collection.id}}"
+                                       ng-disabled="!collectionSelected(collection)"
+                                       ng-checked="collectionSelected(collection) && selectedCollections[collection.id].readOnly"
+                                       ng-click="toggleCollectionReadOnlySelection(collection.id)">
+                            </td>
+                        </tr>
+                    </tbody>
+                </table>
+            </div>
+        </div>
+    </div>
+    <div class="modal-footer">
+        <button type="submit" class="btn btn-primary btn-flat" ng-disabled="inviteForm.$loading">
+            <i class="fa fa-refresh fa-spin loading-icon" ng-show="inviteForm.$loading"></i>Send Invite
+        </button>
+        <button type="button" class="btn btn-default btn-flat" ng-click="close()">Close</button>
+    </div>
+</form>

src/app/organization/views/organizationSettings.html

@@ -0,0 +1,65 @@
+<section class="content-header">
+    <h1>
+        Settings
+        <small>manage your organization</small>
+    </h1>
+</section>
+<section class="content">
+    <div class="box box-default">
+        <div class="box-header with-border">
+            <h3 class="box-title">General</h3>
+        </div>
+        <form role="form" name="generalForm" ng-submit="generalForm.$valid && generalSave()" api-form="generalPromise">
+            <div class="box-body">
+                <div class="row">
+                    <div class="col-sm-9">
+                        <div class="callout callout-danger validation-errors" ng-show="generalForm.$errors">
+                            <h4>Errors have occured</h4>
+                            <ul>
+                                <li ng-repeat="e in generalForm.$errors">{{e}}</li>
+                            </ul>
+                        </div>
+                        <div class="form-group" show-errors>
+                            <label for="name">Organization Name</label>
+                            <input type="text" id="name" name="Name" ng-model="model.name" class="form-control"
+                                   required api-field />
+                        </div>
+                        <div class="form-group" show-errors>
+                            <label for="name">Business Name</label>
+                            <input type="text" id="businessName" name="BusinessName" ng-model="model.businessName"
+                                   class="form-control" api-field />
+                        </div>
+                        <div class="form-group" show-errors>
+                            <label for="name">Billing Email</label>
+                            <input type="email" id="billingEmail" name="BillingEmail" ng-model="model.billingEmail"
+                                   class="form-control" required api-field />
+                        </div>
+                    </div>
+                    <div class="col-sm-3 settings-photo">
+                        <letter-avatar data="{{model.name}}" round="false"
+                                       avclass="img-responsive img-rounded" avwidth="200" avheight="200"
+                                       fontsize="90"></letter-avatar>
+                    </div>
+                </div>
+            </div>
+            <div class="box-footer">
+                <button type="submit" class="btn btn-primary btn-flat" ng-disabled="generalForm.$loading">
+                    <i class="fa fa-refresh fa-spin loading-icon" ng-show="generalForm.$loading"></i>Save
+                </button>
+            </div>
+        </form>
+    </div>
+    <div class="box box-danger">
+        <div class="box-header with-border">
+            <h3 class="box-title">Danger Zone</h3>
+        </div>
+        <div class="box-body">
+            Careful, these actions are not reversible!
+        </div>
+        <div class="box-footer">
+            <button type="submit" class="btn btn-default btn-flat" ng-click="delete()">
+                Delete Organization
+            </button>
+        </div>
+    </div>
+</section>

src/app/organization/views/organizationVault.html

@@ -0,0 +1,78 @@
+<section class="content-header">
+    <h1>
+        Org<span class="hidden-xs">anization</span> Vault
+        <small>
+            <span ng-pluralize
+                  count="collections.length > 0 ? collections.length - 1 : 0"
+                  when="{'1': '{} collection', 'other': '{} collections'}"></span>,
+            <span ng-pluralize count="logins.length" when="{'1': '{} login', 'other': '{} logins'}"></span>
+        </small>
+    </h1>
+</section>
+<section class="content">
+    <p ng-show="loading && !collections.length">Loading...</p>
+    <div class="box" ng-class="{'collapsed-box': collection.collapsed}" ng-repeat="collection in collections |
+         orderBy: collectionSort track by collection.id"
+         ng-show="collections.length && (!main.searchVaultText || collectionLogins.length)">
+        <div class="box-header with-border">
+            <h3 class="box-title">
+                <i class="fa" ng-class="{'fa-cubes': collection.id, 'fa-sitemap': !collection.id}"></i>
+                {{collection.name}}
+                <small ng-pluralize count="collectionLogins.length" when="{'1': '{} login', 'other': '{} logins'}"></small>
+            </h3>
+            <div class="box-tools">
+                <button type="button" class="btn btn-box-tool" data-widget="collapse" title="Collapse/Expand"
+                        ng-click="collapseExpand(collection)">
+                    <i class="fa" ng-class="{'fa-minus': !collection.collapsed, 'fa-plus': collection.collapsed}"></i>
+                </button>
+            </div>
+        </div>
+        <div class="box-body" ng-class="{'no-padding': collectionLogins.length}">
+            <div ng-show="!collectionLogins.length && collection.id">No logins in this collection.</div>
+            <div ng-show="!collectionLogins.length && !collection.id">No unassigned logins.</div>
+            <div class="table-responsive" ng-show="collectionLogins.length">
+                <table class="table table-striped table-hover table-vmiddle">
+                    <tbody>
+                        <tr ng-repeat="login in collectionLogins = (logins | filter: filterByCollection(collection) |
+                            filter: (main.searchVaultText || '') | orderBy: ['name', 'username']) track by login.id">
+                            <td style="width: 70px;">
+                                <div class="btn-group" data-append-to="body">
+                                    <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
+                                        <i class="fa fa-cog"></i> <span class="caret"></span>
+                                    </button>
+                                    <ul class="dropdown-menu">
+                                        <li>
+                                            <a href="javascript:void(0)" ng-click="editLogin(login)">
+                                                <i class="fa fa-fw fa-pencil"></i> Edit
+                                            </a>
+                                        </li>
+                                        <li>
+                                            <a href="javascript:void(0)" ng-click="editCollections(login)">
+                                                <i class="fa fa-fw fa-cubes"></i> Collections
+                                            </a>
+                                        </li>
+                                        <li>
+                                            <a href="javascript:void(0)" ng-click="removeLogin(login, collection)" class="text-red"
+                                               ng-if="collection.id">
+                                                <i class="fa fa-fw fa-remove"></i> Remove
+                                            </a>
+                                        </li>
+                                        <li>
+                                            <a href="javascript:void(0)" ng-click="deleteLogin(login)" class="text-red">
+                                                <i class="fa fa-fw fa-trash"></i> Delete
+                                            </a>
+                                        </li>
+                                    </ul>
+                                </div>
+                            </td>
+                            <td>
+                                <a href="javascript:void(0)" ng-click="editLogin(login)">{{login.name}}</a>
+                                <div class="text-sm text-muted">{{login.username}}</div>
+                            </td>
+                        </tr>
+                    </tbody>
+                </table>
+            </div>
+        </div>
+    </div>
+</section>

src/app/organization/views/organizationVaultLoginCollections.html

@@ -0,0 +1,52 @@
+<div class="modal-header">
+    <button type="button" class="close" ng-click="close()" aria-label="Close"><span aria-hidden="true">&times;</span></button>
+    <h4 class="modal-title"><i class="fa fa-cubes"></i> Collections <small>{{cipher.name}}</small></h4>
+</div>
+<form name="form" ng-submit="form.$valid && submit()" api-form="submitPromise">
+    <div class="modal-body">
+        <p>Edit the collections that this login is being shared with.</p>
+        <div class="callout callout-danger validation-errors" ng-show="form.$errors">
+            <h4>Errors have occured</h4>
+            <ul>
+                <li ng-repeat="e in form.$errors">{{e}}</li>
+            </ul>
+        </div>
+        <div ng-show="!collections.length" class="callout callout-default">
+            <p>There are no collections yet for your organization.</p>
+        </div>
+        <div class="table-responsive" ng-show="collections.length" style="margin: 0;">
+            <table class="table table-striped table-hover" style="margin: 0;">
+                <thead>
+                    <tr>
+                        <th style="width: 40px;">
+                            <input type="checkbox"
+                                   ng-checked="allSelected()"
+                                   ng-click="toggleCollectionSelectionAll($event)">
+                        </th>
+                        <th>Name</th>
+                    </tr>
+                </thead>
+                <tbody>
+                    <tr ng-repeat="collection in collections | orderBy: ['name'] track by collection.id">
+                        <td valign="middle">
+                            <input type="checkbox"
+                                   name="selectedCollections[]"
+                                   value="{{collection.id}}"
+                                   ng-checked="collectionSelected(collection)"
+                                   ng-click="toggleCollectionSelection(collection.id)">
+                        </td>
+                        <td valign="middle" ng-click="toggleCollectionSelection(collection.id)">
+                            {{collection.name}}
+                        </td>
+                    </tr>
+                </tbody>
+            </table>
+        </div>
+    </div>
+    <div class="modal-footer">
+        <button type="submit" class="btn btn-primary btn-flat" ng-disabled="form.$loading" ng-show="collections.length">
+            <i class="fa fa-refresh fa-spin loading-icon" ng-show="form.$loading"></i>Save
+        </button>
+        <button type="button" class="btn btn-default btn-flat" ng-click="close()">Close</button>
+    </div>
+</form>

src/app/services/apiService.js

@@ -5,12 +5,15 @@
         var _service = {},
             _apiUri = appSettings.apiUri;
 
-        _service.logins = $resource(_apiUri + '/sites/:id', {}, {
+        _service.logins = $resource(_apiUri + '/logins/:id', {}, {
             get: { method: 'GET', params: { id: '@id' } },
+            getAdmin: { url: _apiUri + '/logins/:id/admin', method: 'GET', params: { id: '@id' } },
             list: { method: 'GET', params: {} },
             post: { method: 'POST', params: {} },
+            postAdmin: { url: _apiUri + '/logins/admin', method: 'POST', params: {} },
             put: { method: 'POST', params: { id: '@id' } },
-            del: { url: _apiUri + '/sites/:id/delete', method: 'POST', params: { id: '@id' } }
+            putAdmin: { url: _apiUri + '/logins/:id/admin', method: 'POST', params: { id: '@id' } },
+            del: { url: _apiUri + '/logins/:id/delete', method: 'POST', params: { id: '@id' } }
         });
 
         _service.folders = $resource(_apiUri + '/folders/:id', {}, {
@@ -23,10 +26,58 @@
 
         _service.ciphers = $resource(_apiUri + '/ciphers/:id', {}, {
             get: { method: 'GET', params: { id: '@id' } },
-            list: { method: 'GET', params: {} },
+            getFullDetails: { url: _apiUri + '/ciphers/:id/full-details', method: 'GET', params: { id: '@id' } },
+            list: { method: 'GET', params: { includeFolders: false, includeShared: true } },
+            listDetails: { url: _apiUri + '/ciphers/details', method: 'GET', params: {} },
+            listOrganizationDetails: { url: _apiUri + '/ciphers/organization-details', method: 'GET', params: {} },
             'import': { url: _apiUri + '/ciphers/import', method: 'POST', params: {} },
             favorite: { url: _apiUri + '/ciphers/:id/favorite', method: 'POST', params: { id: '@id' } },
-            del: { url: _apiUri + '/ciphers/:id/delete', method: 'POST', params: { id: '@id' } }
+            putPartial: { url: _apiUri + '/ciphers/:id/partial', method: 'POST', params: { id: '@id' } },
+            putShare: { url: _apiUri + '/ciphers/:id/share', method: 'POST', params: { id: '@id' } },
+            putCollections: { url: _apiUri + '/ciphers/:id/collections', method: 'POST', params: { id: '@id' } },
+            putCollectionsAdmin: { url: _apiUri + '/ciphers/:id/collections-admin', method: 'POST', params: { id: '@id' } },
+            del: { url: _apiUri + '/ciphers/:id/delete', method: 'POST', params: { id: '@id' } },
+            delAdmin: { url: _apiUri + '/ciphers/:id/delete-admin', method: 'POST', params: { id: '@id' } }
+        });
+
+        _service.organizations = $resource(_apiUri + '/organizations/:id', {}, {
+            get: { method: 'GET', params: { id: '@id' } },
+            getBilling: { url: _apiUri + '/organizations/:id/billing', method: 'GET', params: { id: '@id' } },
+            list: { method: 'GET', params: {} },
+            post: { method: 'POST', params: {} },
+            put: { method: 'POST', params: { id: '@id' } },
+            putPayment: { url: _apiUri + '/organizations/:id/payment', method: 'POST', params: { id: '@id' } },
+            putSeat: { url: _apiUri + '/organizations/:id/seat', method: 'POST', params: { id: '@id' } },
+            putUpgrade: { url: _apiUri + '/organizations/:id/upgrade', method: 'POST', params: { id: '@id' } },
+            putCancel: { url: _apiUri + '/organizations/:id/cancel', method: 'POST', params: { id: '@id' } },
+            putReinstate: { url: _apiUri + '/organizations/:id/reinstate', method: 'POST', params: { id: '@id' } },
+            postLeave: { url: _apiUri + '/organizations/:id/leave', method: 'POST', params: { id: '@id' } },
+            del: { url: _apiUri + '/organizations/:id/delete', method: 'POST', params: { id: '@id' } }
+        });
+
+        _service.organizationUsers = $resource(_apiUri + '/organizations/:orgId/users/:id', {}, {
+            get: { method: 'GET', params: { id: '@id', orgId: '@orgId' } },
+            list: { method: 'GET', params: { orgId: '@orgId' } },
+            invite: { url: _apiUri + '/organizations/:orgId/users/invite', method: 'POST', params: { orgId: '@orgId' } },
+            reinvite: { url: _apiUri + '/organizations/:orgId/users/:id/reinvite', method: 'POST', params: { id: '@id', orgId: '@orgId' } },
+            accept: { url: _apiUri + '/organizations/:orgId/users/:id/accept', method: 'POST', params: { id: '@id', orgId: '@orgId' } },
+            confirm: { url: _apiUri + '/organizations/:orgId/users/:id/confirm', method: 'POST', params: { id: '@id', orgId: '@orgId' } },
+            put: { method: 'POST', params: { id: '@id', orgId: '@orgId' } },
+            del: { url: _apiUri + '/organizations/:orgId/users/:id/delete', method: 'POST', params: { id: '@id', orgId: '@orgId' } }
+        });
+
+        _service.collections = $resource(_apiUri + '/organizations/:orgId/collections/:id', {}, {
+            get: { method: 'GET', params: { id: '@id', orgId: '@orgId' } },
+            listMe: { url: _apiUri + '/collections', method: 'GET', params: {} },
+            listOrganization: { method: 'GET', params: { orgId: '@orgId' } },
+            post: { method: 'POST', params: { orgId: '@orgId' } },
+            put: { method: 'POST', params: { id: '@id', orgId: '@orgId' } },
+            del: { url: _apiUri + '/organizations/:orgId/collections/:id/delete', method: 'POST', params: { id: '@id', orgId: '@orgId' } }
+        });
+
+        _service.collectionUsers = $resource(_apiUri + '/organizations/:orgId/collectionUsers/:id', {}, {
+            listCollection: { url: _apiUri + '/organizations/:orgId/collectionUsers/:collectionId', method: 'GET', params: { collectionId: '@collectionId', orgId: '@orgId' } },
+            del: { url: _apiUri + '/organizations/:orgId/collectionUsers/:id/delete', method: 'POST', params: { id: '@id', orgId: '@orgId' } }
         });
 
         _service.accounts = $resource(_apiUri + '/accounts', {}, {
@@ -43,6 +94,7 @@
             postTwoFactorRecover: { url: _apiUri + '/accounts/two-factor-recover', method: 'POST', params: {} },
             postPasswordHint: { url: _apiUri + '/accounts/password-hint', method: 'POST', params: {} },
             putSecurityStamp: { url: _apiUri + '/accounts/security-stamp', method: 'POST', params: {} },
+            putKeys: { url: _apiUri + '/accounts/keys', method: 'POST', params: {} },
             'import': { url: _apiUri + '/accounts/import', method: 'POST', params: {} },
             postDelete: { url: _apiUri + '/accounts/delete', method: 'POST', params: {} }
         });
@@ -52,6 +104,10 @@
             putDomains: { url: _apiUri + '/settings/domains', method: 'POST', params: {} },
         });
 
+        _service.users = $resource(_apiUri + '/users/:id', {}, {
+            getPublicKey: { url: _apiUri + '/users/:id/public-key', method: 'GET', params: { id: '@id' } }
+        });
+
         _service.identity = $resource(_apiUri + '/connect', {}, {
             token: {
                 url: _apiUri + '/connect/token',

src/app/services/authService.js

@@ -1,7 +1,7 @@
 angular
     .module('bit.services')
 
-    .factory('authService', function (cryptoService, apiService, tokenService, $q, jwtHelper) {
+    .factory('authService', function (cryptoService, apiService, tokenService, $q, jwtHelper, $rootScope) {
         var _service = {},
             _userProfile = null;
 
@@ -25,7 +25,8 @@ angular
             // TODO: device information one day?
 
             var deferred = $q.defer();
-            apiService.identity.token(request, function (response) {
+
+            apiService.identity.token(request).$promise.then(function (response) {
                 if (!response || !response.access_token) {
                     return;
                 }
@@ -33,8 +34,31 @@ angular
                 tokenService.setToken(response.access_token);
                 tokenService.setRefreshToken(response.refresh_token);
                 cryptoService.setKey(key);
+
+                if (response.PrivateKey) {
+                    cryptoService.setPrivateKey(response.PrivateKey, key);
+                    return true;
+                }
+                else {
+                    return cryptoService.makeKeyPair(key);
+                }
+            }).then(function (keyResults) {
+                if (keyResults === true) {
+                    return;
+                }
+
+                cryptoService.setPrivateKey(keyResults.privateKeyEnc, key);
+                return apiService.accounts.putKeys({
+                    publicKey: keyResults.publicKey,
+                    encryptedPrivateKey: keyResults.privateKeyEnc
+                }).$promise;
+            }).then(function () {
+                return _service.setUserProfile();
+            }).then(function () {
                 deferred.resolve();
             }, function (error) {
+                _service.logOut();
+
                 if (error.status === 400 && error.data.TwoFactorProviders && error.data.TwoFactorProviders.length) {
                     deferred.resolve(error.data.TwoFactorProviders);
                 }
@@ -49,45 +73,138 @@ angular
         _service.logOut = function () {
             tokenService.clearToken();
             tokenService.clearRefreshToken();
-            cryptoService.clearKey();
+            cryptoService.clearKeys();
+            $rootScope.vaultFolders = $rootScope.vaultLogins = null;
             _userProfile = null;
         };
 
         _service.getUserProfile = function () {
             if (!_userProfile) {
-                _service.setUserProfile();
+                return _service.setUserProfile();
             }
 
-            return _userProfile;
+            var deferred = $q.defer();
+            deferred.resolve(_userProfile);
+            return deferred.promise;
         };
 
+        var _setDeferred = null;
         _service.setUserProfile = function () {
+            if (_setDeferred && _setDeferred.promise.$$state.status === 0) {
+                return _setDeferred.promise;
+            }
+
+            _setDeferred = $q.defer();
+
             var token = tokenService.getToken();
             if (!token) {
-                return;
+                _setDeferred.reject();
+                return _setDeferred.promise;
             }
 
             var decodedToken = jwtHelper.decodeToken(token);
+            apiService.accounts.getProfile({}, function (profile) {
+                _userProfile = {
+                    id: decodedToken.name,
+                    email: decodedToken.email,
+                    extended: {
+                        name: profile.Name,
+                        twoFactorEnabled: profile.TwoFactorEnabled,
+                        culture: profile.Culture
+                    }
+                };
 
-            _userProfile = {
-                id: decodedToken.name,
-                email: decodedToken.email
-            };
+                if (profile.Organizations) {
+                    var orgs = {};
+                    for (var i = 0; i < profile.Organizations.length; i++) {
+                        orgs[profile.Organizations[i].Id] = {
+                            id: profile.Organizations[i].Id,
+                            name: profile.Organizations[i].Name,
+                            key: profile.Organizations[i].Key,
+                            status: profile.Organizations[i].Status,
+                            type: profile.Organizations[i].Type,
+                            enabled: profile.Organizations[i].Enabled
+                        };
+                    }
 
-            apiService.accounts.getProfile({}, loadProfile);
+                    _userProfile.organizations = orgs;
+                    cryptoService.setOrgKeys(orgs);
+                    _setDeferred.resolve(_userProfile);
+                }
+            }, function () {
+                _setDeferred.reject();
+            });
+
+            return _setDeferred.promise;
         };
 
-        function loadProfile(profile) {
-            _userProfile.extended = {
-                name: profile.Name,
-                twoFactorEnabled: profile.TwoFactorEnabled,
-                culture: profile.Culture
-            };
-        }
+        _service.addProfileOrganizationOwner = function (org, keyCt) {
+            return _service.getUserProfile().then(function (profile) {
+                if (profile) {
+                    if (!profile.organizations) {
+                        profile.organizations = {};
+                    }
+
+                    var o = {
+                        id: org.Id,
+                        name: org.Name,
+                        key: keyCt,
+                        status: 2, // 2 = Confirmed
+                        type: 0, // 0 = Owner
+                        enabled: true
+                    };
+                    profile.organizations[o.id] = o;
+
+                    _userProfile = profile;
+                    cryptoService.addOrgKey(o.id, o.key);
+                }
+            });
+        };
+
+        _service.removeProfileOrganization = function (orgId) {
+            return _service.getUserProfile().then(function (profile) {
+                if (profile) {
+                    if (profile.organizations && profile.organizations.hasOwnProperty(orgId)) {
+                        delete profile.organizations[orgId];
+                        _userProfile = profile;
+                    }
+
+                    cryptoService.clearOrgKey(orgId);
+                }
+            });
+        };
+
+        _service.updateProfileOrganization = function (org) {
+            return _service.getUserProfile().then(function (profile) {
+                if (profile) {
+                    if (profile.organizations && org.Id in profile.organizations) {
+                        profile.organizations[org.Id].name = org.Name;
+                        _userProfile = profile;
+                    }
+                }
+            });
+        };
 
         _service.isAuthenticated = function () {
             return tokenService.getToken() !== null;
         };
 
+        _service.refreshAccessToken = function () {
+            var refreshToken = tokenService.getRefreshToken();
+            if (!refreshToken) {
+                return null;
+            }
+
+            return apiService.identity.token({
+                grant_type: 'refresh_token',
+                client_id: 'web',
+                refresh_token: refreshToken
+            }).$promise.then(function (response) {
+                tokenService.setToken(response.access_token);
+                tokenService.setRefreshToken(response.refresh_token);
+                return response.access_token;
+            });
+        };
+
         return _service;
     });

src/app/services/cipherService.js

@@ -18,24 +18,46 @@ angular
         _service.decryptLogin = function (encryptedLogin) {
             if (!encryptedLogin) throw "encryptedLogin is undefined or null";
 
+            var key = null;
+            if (encryptedLogin.OrganizationId) {
+                key = cryptoService.getOrgKey(encryptedLogin.OrganizationId);
+            }
+
             var login = {
                 id: encryptedLogin.Id,
+                organizationId: encryptedLogin.OrganizationId,
+                collectionIds: encryptedLogin.CollectionIds || [],
                 'type': 1,
                 folderId: encryptedLogin.FolderId,
                 favorite: encryptedLogin.Favorite,
-                name: cryptoService.decrypt(encryptedLogin.Name),
-                uri: encryptedLogin.Uri && encryptedLogin.Uri !== '' ? cryptoService.decrypt(encryptedLogin.Uri) : null,
-                username: encryptedLogin.Username && encryptedLogin.Username !== '' ? cryptoService.decrypt(encryptedLogin.Username) : null,
-                password: encryptedLogin.Password && encryptedLogin.Password !== '' ? cryptoService.decrypt(encryptedLogin.Password) : null,
-                notes: encryptedLogin.Notes && encryptedLogin.Notes !== '' ? cryptoService.decrypt(encryptedLogin.Notes) : null
+                name: cryptoService.decrypt(encryptedLogin.Name, key),
+                uri: encryptedLogin.Uri && encryptedLogin.Uri !== '' ? cryptoService.decrypt(encryptedLogin.Uri, key) : null,
+                username: encryptedLogin.Username && encryptedLogin.Username !== '' ? cryptoService.decrypt(encryptedLogin.Username, key) : null,
+                password: encryptedLogin.Password && encryptedLogin.Password !== '' ? cryptoService.decrypt(encryptedLogin.Password, key) : null,
+                notes: encryptedLogin.Notes && encryptedLogin.Notes !== '' ? cryptoService.decrypt(encryptedLogin.Notes, key) : null
             };
 
-            if (encryptedLogin.Folder) {
-                login.folder = {
-                    name: cryptoService.decrypt(encryptedLogin.Folder.Name)
-                };
+            return login;
+        };
+
+        _service.decryptLoginPreview = function (encryptedCipher) {
+            if (!encryptedCipher) throw "encryptedCipher is undefined or null";
+
+            var key = null;
+            if (encryptedCipher.OrganizationId) {
+                key = cryptoService.getOrgKey(encryptedCipher.OrganizationId);
             }
 
+            var login = {
+                id: encryptedCipher.Id,
+                organizationId: encryptedCipher.OrganizationId,
+                collectionIds: encryptedCipher.CollectionIds || [],
+                folderId: encryptedCipher.FolderId,
+                favorite: encryptedCipher.Favorite,
+                name: _service.decryptProperty(encryptedCipher.Data.Name, key, false),
+                username: _service.decryptProperty(encryptedCipher.Data.Username, key, true)
+            };
+
             return login;
         };
 
@@ -55,11 +77,59 @@ angular
 
             return {
                 id: encryptedFolder.Id,
-                'type': 0,
                 name: cryptoService.decrypt(encryptedFolder.Name)
             };
         };
 
+        _service.decryptFolderPreview = function (encryptedFolder) {
+            if (!encryptedFolder) throw "encryptedFolder is undefined or null";
+
+            return {
+                id: encryptedFolder.Id,
+                name: _service.decryptProperty(encryptedFolder.Name, null, false)
+            };
+        };
+
+        _service.decryptCollections = function (encryptedCollections, orgId, catchError) {
+            if (!encryptedCollections) throw "encryptedCollections is undefined or null";
+
+            var unencryptedCollections = [];
+            for (var i = 0; i < encryptedCollections.length; i++) {
+                unencryptedCollections.push(_service.decryptCollection(encryptedCollections[i], orgId, catchError));
+            }
+
+            return unencryptedCollections;
+        };
+
+        _service.decryptCollection = function (encryptedCollection, orgId, catchError) {
+            if (!encryptedCollection) throw "encryptedCollection is undefined or null";
+
+            catchError = catchError === true ? true : false;
+            orgId = orgId || encryptedCollection.OrganizationId;
+            var key = cryptoService.getOrgKey(orgId);
+
+            return {
+                id: encryptedCollection.Id,
+                name: catchError ? _service.decryptProperty(encryptedCollection.Name, key, false) :
+                    cryptoService.decrypt(encryptedCollection.Name, key)
+            };
+        };
+
+        _service.decryptProperty = function (property, key, checkEmpty) {
+            if (checkEmpty && (!property || property === '')) {
+                return null;
+            }
+
+            try {
+                property = cryptoService.decrypt(property, key);
+            }
+            catch (err) {
+                property = null;
+            }
+
+            return property || '[error: cannot decrypt]';
+        };
+
         _service.encryptLogins = function (unencryptedLogins, key) {
             if (!unencryptedLogins) throw "unencryptedLogins is undefined or null";
 
@@ -74,9 +144,14 @@ angular
         _service.encryptLogin = function (unencryptedLogin, key) {
             if (!unencryptedLogin) throw "unencryptedLogin is undefined or null";
 
+            if (unencryptedLogin.organizationId) {
+                key = key || cryptoService.getOrgKey(unencryptedLogin.organizationId);
+            }
+
             return {
                 id: unencryptedLogin.id,
                 'type': 1,
+                organizationId: unencryptedLogin.organizationId || null,
                 folderId: unencryptedLogin.folderId === '' ? null : unencryptedLogin.folderId,
                 favorite: unencryptedLogin.favorite !== null ? unencryptedLogin.favorite : false,
                 uri: !unencryptedLogin.uri || unencryptedLogin.uri === '' ? null : cryptoService.encrypt(unencryptedLogin.uri, key),
@@ -103,10 +178,29 @@ angular
 
             return {
                 id: unencryptedFolder.id,
-                'type': 0,
                 name: cryptoService.encrypt(unencryptedFolder.name, key)
             };
         };
 
+        _service.encryptCollections = function (unencryptedCollections, orgId) {
+            if (!unencryptedCollections) throw "unencryptedCollections is undefined or null";
+
+            var encryptedCollections = [];
+            for (var i = 0; i < unencryptedCollections.length; i++) {
+                encryptedCollections.push(_service.encryptCollection(unencryptedCollections[i], orgId));
+            }
+
+            return encryptedCollections;
+        };
+
+        _service.encryptCollection = function (unencryptedCollection, orgId) {
+            if (!unencryptedCollection) throw "unencryptedCollection is undefined or null";
+
+            return {
+                id: unencryptedCollection.id,
+                name: cryptoService.encrypt(unencryptedCollection.name, cryptoService.getOrgKey(orgId))
+            };
+        };
+
         return _service;
     });

src/app/services/cryptoService.js

@@ -1,64 +1,239 @@
 angular
     .module('bit.services')
 
-    .factory('cryptoService', function ($sessionStorage) {
+    .factory('cryptoService', function ($sessionStorage, constants, $q) {
         var _service = {},
             _key,
-            _b64Key;
+            _legacyEtmKey,
+            _orgKeys,
+            _privateKey,
+            _publicKey;
 
         _service.setKey = function (key) {
             _key = key;
-            $sessionStorage.key = forge.util.encode64(key);
+            $sessionStorage.key = _key.keyB64;
         };
 
-        _service.getKey = function (b64) {
-            if (b64 && b64 === true && _b64Key) {
-                return _b64Key;
+        _service.setPrivateKey = function (privateKeyCt, key) {
+            try {
+                var privateKeyBytes = _service.decrypt(privateKeyCt, key, 'raw');
+                $sessionStorage.privateKey = forge.util.encode64(privateKeyBytes);
+                _privateKey = forge.pki.privateKeyFromAsn1(forge.asn1.fromDer(privateKeyBytes));
             }
-            else if (!b64 && _key) {
-                return _key;
+            catch (e) {
+                console.log('Cannot set private key. Decryption failed.');
+            }
+        };
+
+        _service.setOrgKeys = function (orgKeysCt, privateKey) {
+            if (!orgKeysCt || Object.keys(orgKeysCt).length === 0) {
+                return;
             }
 
-            if ($sessionStorage.key) {
-                _key = forge.util.decode64($sessionStorage.key);
+            _service.clearOrgKeys();
+            var orgKeysb64 = {},
+                _orgKeys = {},
+                setKey = false;
+
+            for (var orgId in orgKeysCt) {
+                if (orgKeysCt.hasOwnProperty(orgId)) {
+                    try {
+                        var decBytes = _service.rsaDecrypt(orgKeysCt[orgId].key, privateKey);
+                        var decKey = new SymmetricCryptoKey(decBytes);
+                        _orgKeys[orgId] = decKey;
+                        orgKeysb64[orgId] = decKey.keyB64;
+                        setKey = true;
+                    }
+                    catch (e) {
+                        console.log('Cannot set org key ' + i + '. Decryption failed.');
+                    }
+                }
             }
 
-            if (b64 && b64 === true) {
-                _b64Key = forge.util.encode64(_key);
-                return _b64Key;
+            if (setKey) {
+                $sessionStorage.orgKeys = orgKeysb64;
+            }
+            else {
+                _orgKeys = null;
+            }
+        };
+
+        _service.addOrgKey = function (orgId, encOrgKey, privateKey) {
+            _orgKeys = _service.getOrgKeys();
+            if (!_orgKeys) {
+                _orgKeys = {};
+            }
+
+            var orgKeysb64 = $sessionStorage.orgKeys;
+            if (!orgKeysb64) {
+                orgKeysb64 = {};
+            }
+
+            try {
+                var decBytes = _service.rsaDecrypt(encOrgKey, privateKey);
+                var decKey = new SymmetricCryptoKey(decBytes);
+                _orgKeys[orgId] = decKey;
+                orgKeysb64[orgId] = decKey.keyB64;
+            }
+            catch (e) {
+                _orgKeys = null;
+                console.log('Cannot set org key. Decryption failed.');
+            }
+
+            $sessionStorage.orgKeys = orgKeysb64;
+        };
+
+        _service.getKey = function () {
+            if (!_key && $sessionStorage.key) {
+                _key = new SymmetricCryptoKey($sessionStorage.key, true);
+            }
+
+            if (!_key) {
+                throw 'key unavailable';
             }
 
             return _key;
         };
 
-        _service.getEncKey = function (key) {
-            key = key || _service.getKey();
+        _service.getPrivateKey = function (outputEncoding) {
+            outputEncoding = outputEncoding || 'native';
 
-            var buffer = forge.util.createBuffer(key);
-            return buffer.getBytes(16);
+            if (_privateKey) {
+                if (outputEncoding === 'raw') {
+                    var privateKeyAsn1 = forge.pki.privateKeyToAsn1(_privateKey);
+                    var privateKeyPkcs8 = forge.pki.wrapRsaPrivateKey(privateKeyAsn1);
+                    return forge.asn1.toDer(privateKeyPkcs8).getBytes();
+                }
+
+                return _privateKey;
+            }
+
+            if ($sessionStorage.privateKey) {
+                var privateKeyBytes = forge.util.decode64($sessionStorage.privateKey);
+                _privateKey = forge.pki.privateKeyFromAsn1(forge.asn1.fromDer(privateKeyBytes));
+
+                if (outputEncoding === 'raw') {
+                    return privateKeyBytes;
+                }
+            }
+
+            return _privateKey;
         };
 
-        _service.getMacKey = function (key) {
-            key = key || _service.getKey();
+        _service.getPublicKey = function () {
+            if (_publicKey) {
+                return _publicKey;
+            }
 
-            var buffer = forge.util.createBuffer(key);
-            buffer.getBytes(16); // skip first half
-            return buffer.getBytes(16);
+            var privateKey = _service.getPrivateKey();
+            if (!privateKey) {
+                return null;
+            }
+
+            _publicKey = forge.pki.setRsaPublicKey(privateKey.n, privateKey.e);
+            return _publicKey;
+        };
+
+        _service.getOrgKeys = function () {
+            if (_orgKeys) {
+                return _orgKeys;
+            }
+
+            if ($sessionStorage.orgKeys) {
+                var orgKeys = {},
+                    setKey = false;
+
+                for (var orgId in $sessionStorage.orgKeys) {
+                    if ($sessionStorage.orgKeys.hasOwnProperty(orgId)) {
+                        orgKeys[orgId] = new SymmetricCryptoKey($sessionStorage.orgKeys[orgId], true);
+                        setKey = true;
+                    }
+                }
+
+                if (setKey) {
+                    _orgKeys = orgKeys;
+                }
+            }
+
+            return _orgKeys;
+        };
+
+        _service.getOrgKey = function (orgId) {
+            var orgKeys = _service.getOrgKeys();
+            if (!orgKeys || !(orgId in orgKeys)) {
+                return null;
+            }
+
+            return orgKeys[orgId];
         };
 
         _service.clearKey = function () {
-            _key = _b64Key = null;
+            _key = null;
+            _legacyEtmKey = null;
             delete $sessionStorage.key;
         };
 
-        _service.makeKey = function (password, salt, b64) {
-            var key = forge.pbkdf2(password, salt, 5000, 256 / 8, 'sha256');
+        _service.clearKeyPair = function () {
+            _privateKey = null;
+            _publicKey = null;
+            delete $sessionStorage.privateKey;
+        };
 
-            if (b64 && b64 === true) {
-                return forge.util.encode64(key);
+        _service.clearOrgKeys = function () {
+            _orgKeys = null;
+            delete $sessionStorage.orgKeys;
+        };
+
+        _service.clearOrgKey = function (orgId) {
+            if (_orgKeys.hasOwnProperty(orgId)) {
+                delete _orgKeys[orgId];
             }
 
-            return key;
+            if ($sessionStorage.orgKeys.hasOwnProperty(orgId)) {
+                delete $sessionStorage.orgKeys[orgId];
+            }
+        };
+
+        _service.clearKeys = function () {
+            _service.clearKey();
+            _service.clearKeyPair();
+            _service.clearOrgKeys();
+        };
+
+        _service.makeKey = function (password, salt) {
+            var keyBytes = forge.pbkdf2(forge.util.encodeUtf8(password), forge.util.encodeUtf8(salt),
+                5000, 256 / 8, 'sha256');
+            return new SymmetricCryptoKey(keyBytes);
+        };
+
+        _service.makeKeyPair = function (key) {
+            var deferred = $q.defer();
+
+            forge.pki.rsa.generateKeyPair({ bits: 2048, workers: 2 }, function (error, keypair) {
+                if (error) {
+                    deferred.reject(error);
+                    return;
+                }
+
+                var privateKeyAsn1 = forge.pki.privateKeyToAsn1(keypair.privateKey);
+                var privateKeyPkcs8 = forge.pki.wrapRsaPrivateKey(privateKeyAsn1);
+                var privateKeyBytes = forge.asn1.toDer(privateKeyPkcs8).getBytes();
+                var privateKeyEncCt = _service.encrypt(privateKeyBytes, key, 'raw');
+
+                var publicKeyAsn1 = forge.pki.publicKeyToAsn1(keypair.publicKey);
+                var publicKeyBytes = forge.asn1.toDer(publicKeyAsn1).getBytes();
+
+                deferred.resolve({
+                    publicKey: forge.util.encode64(publicKeyBytes),
+                    privateKeyEnc: privateKeyEncCt
+                });
+            });
+
+            return deferred.promise;
+        };
+
+        _service.makeShareKeyCt = function () {
+            return _service.rsaEncrypt(forge.random.getBytesSync(512 / 8));
         };
 
         _service.hashPassword = function (password, key) {
@@ -70,27 +245,21 @@ angular
                 throw 'Invalid parameters.';
             }
 
-            var hashBits = forge.pbkdf2(key, password, 1, 256 / 8, 'sha256');
+            var hashBits = forge.pbkdf2(key.key, forge.util.encodeUtf8(password), 1, 256 / 8, 'sha256');
             return forge.util.encode64(hashBits);
         };
 
-        _service.encrypt = function (plaintextValue, key) {
-            if (!_service.getKey() && !key) {
+        _service.encrypt = function (plainValue, key, plainValueEncoding) {
+            key = key || _service.getKey();
+
+            if (!key) {
                 throw 'Encryption key unavailable.';
             }
 
-            // TODO: Turn on whenever ready to support encrypt-then-mac
-            var encKey = null;
-            if (false) {
-                encKey = _service.getEncKey(key);
-            }
-            else {
-                encKey = key || _service.getKey();
-            }
-
-            var buffer = forge.util.createBuffer(plaintextValue, 'utf8');
+            plainValueEncoding = plainValueEncoding || 'utf8';
+            var buffer = forge.util.createBuffer(plainValue, plainValueEncoding);
             var ivBytes = forge.random.getBytesSync(16);
-            var cipher = forge.cipher.createCipher('AES-CBC', encKey);
+            var cipher = forge.cipher.createCipher('AES-CBC', key.encKey);
             cipher.start({ iv: ivBytes });
             cipher.update(buffer);
             cipher.finish();
@@ -100,53 +269,231 @@ angular
             var ct = forge.util.encode64(ctBytes);
             var cipherString = iv + '|' + ct;
 
-            // TODO: Turn on whenever ready to support encrypt-then-mac
-            if (false) {
-                var mac = computeMac(ctBytes, ivBytes);
+            if (key.macKey) {
+                var mac = computeMac(ctBytes, ivBytes, key.macKey, true);
                 cipherString = cipherString + '|' + mac;
             }
 
-            return cipherString;
-        };
-
-        _service.decrypt = function (encValue) {
-            if (!_service.getKey()) {
-                throw 'AES encryption unavailable.';
+            if (key.encType === constants.encType.AesCbc256_B64) {
+                return cipherString;
             }
 
-            var encPieces = encValue.split('|');
-            if (encPieces.length !== 2 && encPieces.length !== 3) {
-                return '';
+            return key.encType + '.' + cipherString;
+        };
+
+        _service.rsaEncrypt = function (plainValue, publicKey) {
+            publicKey = publicKey || _service.getPublicKey();
+            if (!publicKey) {
+                throw 'Public key unavailable.';
+            }
+
+            if (typeof publicKey === 'string') {
+                var publicKeyBytes = forge.util.decode64(publicKey);
+                publicKey = forge.pki.publicKeyFromAsn1(forge.asn1.fromDer(publicKeyBytes));
+            }
+
+            var encryptedBytes = publicKey.encrypt(plainValue, 'RSA-OAEP', {
+                md: forge.md.sha1.create()
+            });
+
+            return constants.encType.Rsa2048_OaepSha1_B64 + '.' + forge.util.encode64(encryptedBytes);
+        };
+
+        _service.decrypt = function (encValue, key, outputEncoding) {
+            key = key || _service.getKey();
+
+            var headerPieces = encValue.split('.'),
+                encType,
+                encPieces;
+
+            if (headerPieces.length === 2) {
+                try {
+                    encType = parseInt(headerPieces[0]);
+                    encPieces = headerPieces[1].split('|');
+                }
+                catch (e) {
+                    return null;
+                }
+            }
+            else {
+                encPieces = encValue.split('|');
+                encType = encPieces.length === 3 ? constants.encType.AesCbc128_HmacSha256_B64 :
+                    constants.encType.AesCbc256_B64;
+            }
+
+            if (encType === constants.encType.AesCbc128_HmacSha256_B64 && key.encType === constants.encType.AesCbc256_B64) {
+                // Old encrypt-then-mac scheme, swap out the key
+                _legacyEtmKey = _legacyEtmKey ||
+                    new SymmetricCryptoKey(key.key, false, constants.encType.AesCbc128_HmacSha256_B64);
+                key = _legacyEtmKey;
+            }
+
+            if (encType !== key.encType) {
+                throw 'encType unavailable.';
+            }
+
+            switch (encType) {
+                case constants.encType.AesCbc128_HmacSha256_B64:
+                    if (encPieces.length !== 3) {
+                        return null;
+                    }
+                    break;
+                case constants.encType.AesCbc256_HmacSha256_B64:
+                    if (encPieces.length !== 3) {
+                        return null;
+                    }
+                    break;
+                case constants.encType.AesCbc256_B64:
+                    if (encPieces.length !== 2) {
+                        return null;
+                    }
+                    break;
+                default:
+                    return null;
             }
 
             var ivBytes = forge.util.decode64(encPieces[0]);
             var ctBytes = forge.util.decode64(encPieces[1]);
 
-            var computedMac = null;
-            if (encPieces.length === 3) {
-                computedMac = computeMac(ctBytes, ivBytes);
-                if (computedMac !== encPieces[2]) {
+            if (key.macKey && encPieces.length > 2) {
+                var macBytes = forge.util.decode64(encPieces[2]);
+                var computedMacBytes = computeMac(ctBytes, ivBytes, key.macKey, false);
+                if (!macsEqual(key.macKey, macBytes, computedMacBytes)) {
                     console.error('MAC failed.');
-                    return '';
+                    return null;
                 }
             }
 
             var ctBuffer = forge.util.createBuffer(ctBytes);
-            var decipher = forge.cipher.createDecipher('AES-CBC', computedMac ? _service.getEncKey() : _service.getKey());
+            var decipher = forge.cipher.createDecipher('AES-CBC', key.encKey);
             decipher.start({ iv: ivBytes });
             decipher.update(ctBuffer);
             decipher.finish();
 
-            return decipher.output.toString('utf8');
+            outputEncoding = outputEncoding || 'utf8';
+            if (outputEncoding === 'utf8') {
+                return decipher.output.toString('utf8');
+            }
+            else {
+                return decipher.output.getBytes();
+            }
         };
 
-        function computeMac(ct, iv, macKey) {
+        _service.rsaDecrypt = function (encValue, privateKey) {
+            privateKey = privateKey || _service.getPrivateKey();
+            if (!privateKey) {
+                throw 'Private key unavailable.';
+            }
+
+            var headerPieces = encValue.split('.'),
+                encType,
+                encPiece;
+
+            if (headerPieces.length === 1) {
+                encType = constants.encType.Rsa2048_OaepSha256_B64;
+                encPiece = headerPieces[0];
+            }
+            else if (headerPieces.length === 2) {
+                try {
+                    encType = parseInt(headerPieces[0]);
+                    encPiece = headerPieces[1];
+                }
+                catch (e) {
+                    return null;
+                }
+            }
+
+            var ctBytes = forge.util.decode64(encPiece);
+            var md;
+
+            if (encType === constants.encType.Rsa2048_OaepSha256_B64) {
+                md = forge.md.sha256.create();
+            }
+            else if (encType === constants.encType.Rsa2048_OaepSha1_B64) {
+                md = forge.md.sha1.create();
+            }
+            else {
+                throw 'encType unavailable.';
+            }
+
+            var decBytes = privateKey.decrypt(ctBytes, 'RSA-OAEP', {
+                md: md
+            });
+
+            return decBytes;
+        };
+
+        function computeMac(ct, iv, macKey, b64Output) {
             var hmac = forge.hmac.create();
-            hmac.start('sha256', macKey || _service.getMacKey());
+            hmac.start('sha256', macKey);
             hmac.update(iv + ct);
             var mac = hmac.digest();
-            return forge.util.encode64(mac.getBytes());
+            return b64Output ? forge.util.encode64(mac.getBytes()) : mac.getBytes();
+        }
+
+        // Safely compare two MACs in a way that protects against timing attacks (Double HMAC Verification).
+        // ref: https://www.nccgroup.trust/us/about-us/newsroom-and-events/blog/2011/february/double-hmac-verification/
+        function macsEqual(macKey, mac1, mac2) {
+            var hmac = forge.hmac.create();
+
+            hmac.start('sha256', macKey);
+            hmac.update(mac1);
+            mac1 = hmac.digest().getBytes();
+
+            hmac.start(null, null);
+            hmac.update(mac2);
+            mac2 = hmac.digest().getBytes();
+
+            return mac1 === mac2;
+        }
+
+        function SymmetricCryptoKey(keyBytes, b64KeyBytes, encType) {
+            if (b64KeyBytes) {
+                keyBytes = forge.util.decode64(keyBytes);
+            }
+
+            if (!keyBytes) {
+                throw 'Must provide keyBytes';
+            }
+
+            var buffer = forge.util.createBuffer(keyBytes);
+            if (!buffer || buffer.length() === 0) {
+                throw 'Couldn\'t make buffer';
+            }
+            var bufferLength = buffer.length();
+
+            if (encType === null || encType === undefined) {
+                if (bufferLength === 32) {
+                    encType = constants.encType.AesCbc256_B64;
+                }
+                else if (bufferLength === 64) {
+                    encType = constants.encType.AesCbc256_HmacSha256_B64;
+                }
+                else {
+                    throw 'Unable to determine encType.';
+                }
+            }
+
+            this.key = keyBytes;
+            this.keyB64 = forge.util.encode64(keyBytes);
+            this.encType = encType;
+
+            if (encType === constants.encType.AesCbc256_B64 && bufferLength === 32) {
+                this.encKey = keyBytes;
+                this.macKey = null;
+            }
+            else if (encType === constants.encType.AesCbc128_HmacSha256_B64 && bufferLength === 32) {
+                this.encKey = buffer.getBytes(16); // first half
+                this.macKey = buffer.getBytes(16); // second half
+            }
+            else if (encType === constants.encType.AesCbc256_HmacSha256_B64 && bufferLength === 64) {
+                this.encKey = buffer.getBytes(32); // first half
+                this.macKey = buffer.getBytes(32); // second half
+            }
+            else {
+                throw 'Unsupported encType/key length.';
+            }
         }
 
         return _service;
-    });
+    });

src/app/services/importService.js

@@ -182,6 +182,28 @@
             }
         }
 
+        function getFileContents(file, contentsCallback, errorCallback) {
+            if (typeof file === 'string') {
+                contentsCallback(file);
+            }
+            else {
+                var reader = new FileReader();
+                reader.readAsText(file, 'utf-8');
+                reader.onload = function (evt) {
+                    contentsCallback(evt.target.result);
+                };
+                reader.onerror = function (evt) {
+                    errorCallback();
+                };
+            }
+        }
+
+        function getXmlFileContents(file, xmlCallback, errorCallback) {
+            getFileContents(file, function (fileContents) {
+                xmlCallback($.parseXML(fileContents));
+            }, errorCallback);
+        }
+
         function importBitwardenCsv(file, success, error) {
             Papa.parse(file, {
                 header: true,
@@ -210,7 +232,7 @@
                         }
 
                         logins.push({
-                            favorite: value.favorite !== null ? value.favorite : false,
+                            favorite: value.favorite && value.favorite !== '' && value.favorite !== '0' ? true : false,
                             uri: value.uri && value.uri !== '' ? trimUri(value.uri) : null,
                             username: value.username && value.username !== '' ? value.username : null,
                             password: value.password && value.password !== '' ? value.password : null,
@@ -239,7 +261,7 @@
         }
 
         function importLastPass(file, success, error) {
-            if (file.type === 'text/html') {
+            if (typeof file !== 'string' && file.type && file.type === 'text/html') {
                 var reader = new FileReader();
                 reader.readAsText(file, 'utf-8');
                 reader.onload = function (evt) {
@@ -287,6 +309,9 @@
                     complete: function (results) {
                         parseCsvErrors(results);
                         parseData(results.data);
+                    },
+                    beforeFirstChunk: function (chunk) {
+                        return chunk.replace(/^\s+/, '');
                     }
                 });
             }
@@ -344,16 +369,14 @@
             var folders = [],
                 logins = [],
                 loginRelationships = [],
-                foldersIndex = [];
-
-            var i = 0,
+                foldersIndex = [],
+                i = 0,
                 j = 0;
 
-            var reader = new FileReader();
-            reader.readAsText(file, 'utf-8');
-            reader.onload = function (evt) {
-                var xmlDoc = $.parseXML(evt.target.result),
-                    xml = $(xmlDoc);
+            getXmlFileContents(file, parse, error);
+
+            function parse(xmlDoc) {
+                var xml = $(xmlDoc);
 
                 var db = xml.find('database');
                 if (db.length) {
@@ -381,7 +404,7 @@
                                 uri: null,
                                 username: null,
                                 password: null,
-                                notes: null,
+                                notes: '',
                                 name: card.attr('title'),
                             };
 
@@ -391,6 +414,7 @@
 
                                 var text = field.text();
                                 var type = field.attr('type');
+                                var name = field.attr('name');
 
                                 if (text && text !== '') {
                                     if (type === 'login') {
@@ -400,14 +424,26 @@
                                         login.password = text;
                                     }
                                     else if (type === 'notes') {
-                                        login.notes = text;
+                                        login.notes += (text + '\n');
                                     }
-                                    else if (type === 'weblogin') {
+                                    else if (type === 'weblogin' || type === 'website') {
                                         login.uri = trimUri(text);
                                     }
+                                    else {
+                                        login.notes += (name + ': ' + text + '\n');
+                                    }
                                 }
                             }
 
+                            var notes = card.find('> notes');
+                            for (j = 0; j < notes.length; j++) {
+                                login.notes += ($(notes[j]).text() + '\n');
+                            }
+
+                            if (login.notes === '') {
+                                login.notes = null;
+                            }
+
                             logins.push(login);
 
                             labels = card.find('> label_id');
@@ -429,11 +465,7 @@
                 else {
                     error();
                 }
-            };
-
-            reader.onerror = function (evt) {
-                error();
-            };
+            }
         }
 
         function importPadlockCsv(file, success, error) {
@@ -535,11 +567,10 @@
                 logins = [],
                 loginRelationships = [];
 
-            var reader = new FileReader();
-            reader.readAsText(file, 'utf-8');
-            reader.onload = function (evt) {
-                var xmlDoc = $.parseXML(evt.target.result),
-                    xml = $(xmlDoc);
+            getXmlFileContents(file, parse, error);
+
+            function parse(xmlDoc) {
+                var xml = $(xmlDoc);
 
                 var root = xml.find('Root');
                 if (root.length) {
@@ -552,11 +583,7 @@
                 else {
                     error();
                 }
-            };
-
-            reader.onerror = function (evt) {
-                error();
-            };
+            }
 
             function traverse(node, isRootNode, groupNamePrefix) {
                 var nodeEntries = [];
@@ -745,10 +772,9 @@
                 }
             }
 
-            var reader = new FileReader();
-            reader.readAsText(file, 'utf-8');
-            reader.onload = function (evt) {
-                var fileContent = evt.target.result;
+            getFileContents(file, parse, error);
+
+            function parse(fileContent) {
                 var fileLines = fileContent.split(/(?:\r\n|\r|\n)/);
 
                 for (i = 0; i < fileLines.length; i++) {
@@ -790,11 +816,7 @@
                 }
 
                 success(folders, logins, loginRelationships);
-            };
-
-            reader.onerror = function (evt) {
-                error();
-            };
+            }
         }
 
         function import1Password6WinCsv(file, success, error) {
@@ -922,40 +944,35 @@
                 return name;
             }
 
-            if (file.type === 'text/xml') {
-                var reader = new FileReader();
-                reader.readAsText(file, 'utf-8');
-                reader.onload = function (evt) {
-                    var xmlDoc = $.parseXML(evt.target.result),
-                        xml = $(xmlDoc);
+            function parseXml(xmlDoc) {
+                var xml = $(xmlDoc);
 
-                    var entries = xml.find('entry');
-                    for (var i = 0; i < entries.length; i++) {
-                        var entry = $(entries[i]);
-                        if (!entry) {
-                            continue;
-                        }
-
-                        var host = entry.attr('host'),
-                            user = entry.attr('user'),
-                            password = entry.attr('password');
-
-                        logins.push({
-                            favorite: false,
-                            uri: host && host !== '' ? trimUri(host) : null,
-                            username: user && user !== '' ? user : null,
-                            password: password && password !== '' ? password : null,
-                            notes: null,
-                            name: getNameFromHost(host),
-                        });
+                var entries = xml.find('entry');
+                for (var i = 0; i < entries.length; i++) {
+                    var entry = $(entries[i]);
+                    if (!entry) {
+                        continue;
                     }
 
-                    success(folders, logins, loginRelationships);
-                };
+                    var host = entry.attr('host'),
+                        user = entry.attr('user'),
+                        password = entry.attr('password');
 
-                reader.onerror = function (evt) {
-                    error();
-                };
+                    logins.push({
+                        favorite: false,
+                        uri: host && host !== '' ? trimUri(host) : null,
+                        username: user && user !== '' ? user : null,
+                        password: password && password !== '' ? password : null,
+                        notes: null,
+                        name: getNameFromHost(host),
+                    });
+                }
+
+                success(folders, logins, loginRelationships);
+            }
+
+            if (file.type && file.type === 'text/xml') {
+                getXmlFileContents(file, parseXml, error);
             }
             else {
                 // currently bugged due to the comment
@@ -1100,11 +1117,10 @@
                 foldersIndex = [],
                 j = 0;
 
-            var reader = new FileReader();
-            reader.readAsText(file, 'utf-8');
-            reader.onload = function (evt) {
-                var xmlDoc = $.parseXML(evt.target.result),
-                    xml = $(xmlDoc);
+            getXmlFileContents(file, parseXml, error);
+
+            function parseXml(xmlDoc) {
+                var xml = $(xmlDoc);
 
                 var pwManager = xml.find('PasswordManager');
                 if (pwManager.length) {
@@ -1205,11 +1221,7 @@
                 else {
                     error();
                 }
-            };
-
-            reader.onerror = function (evt) {
-                error();
-            };
+            }
         }
 
         function importEnpassCsv(file, success, error) {
@@ -1283,11 +1295,10 @@
                 foldersIndex = [],
                 j = 0;
 
-            var reader = new FileReader();
-            reader.readAsText(file, 'utf-8');
-            reader.onload = function (evt) {
-                var xmlDoc = $.parseXML(evt.target.result),
-                    xml = $(xmlDoc);
+            getXmlFileContents(file, parseXml, error);
+
+            function parseXml(xmlDoc) {
+                var xml = $(xmlDoc);
 
                 var pwsafe = xml.find('passwordsafe');
                 if (pwsafe.length) {
@@ -1371,11 +1382,7 @@
                 else {
                     error();
                 }
-            };
-
-            reader.onerror = function (evt) {
-                error();
-            };
+            }
         }
 
         function importDashlaneCsv(file, success, error) {
@@ -1509,11 +1516,10 @@
                 return groupText;
             }
 
-            var reader = new FileReader();
-            reader.readAsText(file, 'utf-8');
-            reader.onload = function (evt) {
-                var xmlDoc = $.parseXML(evt.target.result),
-                    xml = $(xmlDoc);
+            getXmlFileContents(file, parseXml, error);
+
+            function parseXml(xmlDoc) {
+                var xml = $(xmlDoc);
 
                 var database = xml.find('root > Database');
                 if (database.length) {
@@ -1599,11 +1605,7 @@
                 else {
                     error();
                 }
-            };
-
-            reader.onerror = function (evt) {
-                error();
-            };
+            }
         }
 
         function importmSecureCsv(file, success, error) {
@@ -1764,10 +1766,10 @@
                 logins = [],
                 loginRelationships = [];
 
-            var reader = new FileReader();
-            reader.readAsText(file, 'utf-8');
-            reader.onload = function (evt) {
-                var doc = $(evt.target.result);
+            getFileContents(file, parse, error);
+
+            function parse(fileContents) {
+                var doc = $(fileContents);
                 var textarea = doc.find('textarea');
                 var json = textarea && textarea.length ? textarea.val() : null;
                 var entries = json ? JSON.parse(json) : null;
@@ -1836,11 +1838,7 @@
                 }
 
                 success(folders, logins, loginRelationships);
-            };
-
-            reader.onerror = function (evt) {
-                error();
-            };
+            }
         }
 
         function importAviraJson(file, success, error) {
@@ -1849,10 +1847,9 @@
                 loginRelationships = [],
                 i = 0;
 
-            var reader = new FileReader();
-            reader.readAsText(file, 'utf-8');
-            reader.onload = function (evt) {
-                var fileContent = evt.target.result;
+            getFileContents(file, parseJson, error);
+
+            function parseJson(fileContent) {
                 var fileJson = JSON.parse(fileContent);
                 if (fileJson) {
                     if (fileJson.accounts) {
@@ -1886,11 +1883,7 @@
                 }
 
                 success(folders, logins, loginRelationships);
-            };
-
-            reader.onerror = function (evt) {
-                error();
-            };
+            }
         }
 
         function importRoboFormHtml(file, success, error) {
@@ -1898,10 +1891,10 @@
                 logins = [],
                 loginRelationships = [];
 
-            var reader = new FileReader();
-            reader.readAsText(file, 'utf-8');
-            reader.onload = function (evt) {
-                var doc = $(evt.target.result.split('&shy;').join('').split('<WBR>').join(''));
+            getFileContents(file, parse, error);
+
+            function parse(fileContents) {
+                var doc = $(fileContents.split('&shy;').join('').split('<WBR>').join(''));
                 var outterTables = doc.find('table.nobr');
                 if (outterTables.length) {
                     for (var i = 0; i < outterTables.length; i++) {
@@ -1962,11 +1955,7 @@
                 }
 
                 success(folders, logins, loginRelationships);
-            };
-
-            reader.onerror = function (evt) {
-                error();
-            };
+            }
         }
 
         function importSaferPassCsv(file, success, error) {
@@ -2075,10 +2064,9 @@
                 loginRelationships = [],
                 i = 0;
 
-            var reader = new FileReader();
-            reader.readAsText(file, 'utf-8');
-            reader.onload = function (evt) {
-                var fileContent = evt.target.result;
+            getFileContents(file, parseJson, error);
+
+            function parseJson(fileContent) {
                 var fileJson = JSON.parse(fileContent);
                 if (fileJson && fileJson.length) {
                     for (i = 0; i < fileJson.length; i++) {
@@ -2133,11 +2121,7 @@
                 }
 
                 success(folders, logins, loginRelationships);
-            };
-
-            reader.onerror = function (evt) {
-                error();
-            };
+            }
         }
 
         function importZohoVaultCsv(file, success, error) {

src/app/settings.js

@@ -1,2 +1,2 @@
 angular.module("bit")
-.constant("appSettings", {"rememberedEmailCookieName":"bit.rememberedEmail","apiUri":"https://api.bitwarden.com","version":"1.9.0","environment":"Production"});
+.constant("appSettings", {"apiUri":"https://api.bitwarden.com","version":"1.10.0","environment":"Production"});

src/app/settings/settingsAddEditEquivalentDomainController.js

@@ -1,7 +1,8 @@
 angular
     .module('bit.vault')
 
-    .controller('settingsAddEditEquivalentDomainController', function ($scope, $uibModalInstance, $analytics, domainIndex, domains) {
+    .controller('settingsAddEditEquivalentDomainController', function ($scope, $uibModalInstance, $analytics,
+        domainIndex, domains) {
         $analytics.eventTrack('settingsAddEditEquivalentDomainController', { category: 'Modal' });
 
         $scope.domains = domains;

src/app/settings/settingsChangeEmailController.js

@@ -1,7 +1,8 @@
 angular
     .module('bit.settings')
 
-    .controller('settingsChangeEmailController', function ($scope, $state, apiService, $uibModalInstance, cryptoService, cipherService, authService, $q, toastr, $analytics) {
+    .controller('settingsChangeEmailController', function ($scope, $state, apiService, $uibModalInstance, cryptoService,
+        cipherService, authService, $q, toastr, $analytics) {
         $analytics.eventTrack('settingsChangeEmailController', { category: 'Modal' });
         var _masterPasswordHash,
             _newMasterPasswordHash,
@@ -28,24 +29,43 @@
             $scope.processing = true;
 
             var reencryptedLogins = [];
-            var loginsPromise = apiService.logins.list({ dirty: false }, function (encryptedLogins) {
-                var unencryptedLogins = cipherService.decryptLogins(encryptedLogins.Data);
+            var loginsPromise = apiService.logins.list({}, function (encryptedLogins) {
+                var filteredEncryptedLogins = [];
+                for (var i = 0; i < encryptedLogins.Data.length; i++) {
+                    if (encryptedLogins.Data[i].OrganizationId) {
+                        continue;
+                    }
+
+                    filteredEncryptedLogins.push(encryptedLogins.Data[i]);
+                }
+
+                var unencryptedLogins = cipherService.decryptLogins(filteredEncryptedLogins);
                 reencryptedLogins = cipherService.encryptLogins(unencryptedLogins, _newKey);
             }).$promise;
 
             var reencryptedFolders = [];
-            var foldersPromise = apiService.folders.list({ dirty: false }, function (encryptedFolders) {
+            var foldersPromise = apiService.folders.list({}, function (encryptedFolders) {
                 var unencryptedFolders = cipherService.decryptFolders(encryptedFolders.Data);
                 reencryptedFolders = cipherService.encryptFolders(unencryptedFolders, _newKey);
             }).$promise;
 
+            var privateKey = cryptoService.getPrivateKey('raw'),
+                reencryptedPrivateKey = null;
+            if (privateKey) {
+                reencryptedPrivateKey = cryptoService.encrypt(privateKey, _newKey, 'raw');
+            }
+
             $q.all([loginsPromise, foldersPromise]).then(function () {
                 var request = {
                     token: model.token,
                     newEmail: model.newEmail.toLowerCase(),
                     masterPasswordHash: _masterPasswordHash,
                     newMasterPasswordHash: _newMasterPasswordHash,
-                    ciphers: reencryptedLogins.concat(reencryptedFolders)
+                    data: {
+                        ciphers: reencryptedLogins,
+                        folders: reencryptedFolders,
+                        privateKey: reencryptedPrivateKey
+                    }
                 };
 
                 $scope.confirmPromise = apiService.accounts.email(request, function () {
@@ -56,7 +76,6 @@
                         toastr.success('Please log back in.', 'Email Changed');
                     });
                 }, function () {
-                    // TODO: recovery mode
                     $uibModalInstance.dismiss('cancel');
                     toastr.error('Something went wrong.', 'Oh No!');
                 }).$promise;

src/app/settings/settingsChangePasswordController.js

@@ -24,40 +24,60 @@
 
             $scope.processing = true;
 
-            var profile = authService.getUserProfile();
-            var newKey = cryptoService.makeKey(model.newMasterPassword, profile.email.toLowerCase());
+            authService.getUserProfile().then(function (profile) {
+                return cryptoService.makeKey(model.newMasterPassword, profile.email.toLowerCase());
+            }).then(function (newKey) {
+                var reencryptedLogins = [];
+                var loginsPromise = apiService.logins.list({}, function (encryptedLogins) {
+                    var filteredEncryptedLogins = [];
+                    for (var i = 0; i < encryptedLogins.Data.length; i++) {
+                        if (encryptedLogins.Data[i].OrganizationId) {
+                            continue;
+                        }
 
-            var reencryptedLogins = [];
-            var loginsPromise = apiService.logins.list({ dirty: false }, function (encryptedLogins) {
-                var unencryptedLogins = cipherService.decryptLogins(encryptedLogins.Data);
-                reencryptedLogins = cipherService.encryptLogins(unencryptedLogins, newKey);
-            }).$promise;
+                        filteredEncryptedLogins.push(encryptedLogins.Data[i]);
+                    }
 
-            var reencryptedFolders = [];
-            var foldersPromise = apiService.folders.list({ dirty: false }, function (encryptedFolders) {
-                var unencryptedFolders = cipherService.decryptFolders(encryptedFolders.Data);
-                reencryptedFolders = cipherService.encryptFolders(unencryptedFolders, newKey);
-            }).$promise;
-
-            $q.all([loginsPromise, foldersPromise]).then(function () {
-                var request = {
-                    masterPasswordHash: cryptoService.hashPassword(model.masterPassword),
-                    newMasterPasswordHash: cryptoService.hashPassword(model.newMasterPassword, newKey),
-                    ciphers: reencryptedLogins.concat(reencryptedFolders)
-                };
-
-                $scope.savePromise = apiService.accounts.putPassword(request, function () {
-                    $uibModalInstance.dismiss('cancel');
-                    authService.logOut();
-                    $analytics.eventTrack('Changed Password');
-                    $state.go('frontend.login.info').then(function () {
-                        toastr.success('Please log back in.', 'Master Password Changed');
-                    });
-                }, function () {
-                    // TODO: recovery mode
-                    $uibModalInstance.dismiss('cancel');
-                    toastr.error('Something went wrong.', 'Oh No!');
+                    var unencryptedLogins = cipherService.decryptLogins(filteredEncryptedLogins);
+                    reencryptedLogins = cipherService.encryptLogins(unencryptedLogins, newKey);
                 }).$promise;
+
+                var reencryptedFolders = [];
+                var foldersPromise = apiService.folders.list({}, function (encryptedFolders) {
+                    var unencryptedFolders = cipherService.decryptFolders(encryptedFolders.Data);
+                    reencryptedFolders = cipherService.encryptFolders(unencryptedFolders, newKey);
+                }).$promise;
+
+                var privateKey = cryptoService.getPrivateKey('raw'),
+                    reencryptedPrivateKey = null;
+                if (privateKey) {
+                    reencryptedPrivateKey = cryptoService.encrypt(privateKey, newKey, 'raw');
+                }
+
+                $q.all([loginsPromise, foldersPromise]).then(function () {
+                    var request = {
+                        masterPasswordHash: cryptoService.hashPassword(model.masterPassword),
+                        newMasterPasswordHash: cryptoService.hashPassword(model.newMasterPassword, newKey),
+                        data: {
+                            ciphers: reencryptedLogins,
+                            folders: reencryptedFolders,
+                            privateKey: reencryptedPrivateKey
+                        }
+                    };
+
+                    $scope.savePromise = apiService.accounts.putPassword(request, function () {
+                        $uibModalInstance.dismiss('cancel');
+                        authService.logOut();
+                        $analytics.eventTrack('Changed Password');
+                        $state.go('frontend.login.info').then(function () {
+                            toastr.success('Please log back in.', 'Master Password Changed');
+                        });
+                    }, function () {
+                        $uibModalInstance.dismiss('cancel');
+                        toastr.error('Something went wrong.', 'Oh No!');
+                    }).$promise;
+                });
+
             });
         };
 

src/app/settings/settingsController.js

@@ -1,36 +1,60 @@
 angular
     .module('bit.settings')
 
-    .controller('settingsController', function ($scope, $uibModal, apiService, toastr, authService) {
+    .controller('settingsController', function ($scope, $state, $uibModal, apiService, toastr, authService) {
         $scope.model = {
             profile: {},
             twoFactorEnabled: false,
             email: null
         };
 
-        apiService.accounts.getProfile({}, function (user) {
-            $scope.model = {
-                profile: {
-                    name: user.Name,
-                    masterPasswordHint: user.MasterPasswordHint,
-                    culture: user.Culture
-                },
-                email: user.Email,
-                twoFactorEnabled: user.TwoFactorEnabled
-            };
+        $scope.$on('$viewContentLoaded', function () {
+            apiService.accounts.getProfile({}, function (user) {
+                $scope.model = {
+                    profile: {
+                        name: user.Name,
+                        masterPasswordHint: user.MasterPasswordHint,
+                        culture: user.Culture
+                    },
+                    email: user.Email,
+                    twoFactorEnabled: user.TwoFactorEnabled
+                };
+
+                if (user.Organizations) {
+                    var orgs = [];
+                    for (var i = 0; i < user.Organizations.length; i++) {
+                        // Only confirmed
+                        if (user.Organizations[i].Status !== 2) {
+                            continue;
+                        }
+
+                        orgs.push({
+                            id: user.Organizations[i].Id,
+                            name: user.Organizations[i].Name,
+                            status: user.Organizations[i].Status,
+                            type: user.Organizations[i].Type,
+                            enabled: user.Organizations[i].Enabled
+                        });
+                    }
+
+                    $scope.model.organizations = orgs;
+                }
+            });
         });
 
         $scope.generalSave = function () {
             $scope.generalPromise = apiService.accounts.putProfile({}, $scope.model.profile, function (profile) {
-                authService.setUserProfile(profile);
-                toastr.success('Account has been updated.', 'Success!');
+                authService.setUserProfile(profile).then(function (updatedProfile) {
+                    toastr.success('Account has been updated.', 'Success!');
+                });
             }).$promise;
         };
 
         $scope.passwordHintSave = function () {
             $scope.passwordHintPromise = apiService.accounts.putProfile({}, $scope.model.profile, function (profile) {
-                authService.setUserProfile(profile);
-                toastr.success('Account has been updated.', 'Success!');
+                authService.setUserProfile(profile).then(function (updatedProfile) {
+                    toastr.success('Account has been updated.', 'Success!');
+                });
             }).$promise;
         };
 
@@ -46,8 +70,38 @@
             $uibModal.open({
                 animation: true,
                 templateUrl: 'app/settings/views/settingsChangeEmail.html',
-                controller: 'settingsChangeEmailController',
-                size: 'sm'
+                controller: 'settingsChangeEmailController'
+            });
+        };
+
+        $scope.viewOrganization = function (org) {
+            if (org.type === 2) { // 2 = User
+                scrollToTop();
+                toastr.error('You cannot manage this organization.');
+                return;
+            }
+
+            $state.go('backend.org.dashboard', { orgId: org.id });
+        };
+
+        $scope.leaveOrganization = function (org) {
+            if (!confirm('Are you sure you want to leave this organization (' + org.name + ')?')) {
+                return;
+            }
+
+            apiService.organizations.postLeave({ id: org.id }, {}, function (response) {
+                authService.refreshAccessToken().then(function () {
+                    var index = $scope.model.organizations.indexOf(org);
+                    if (index > -1) {
+                        $scope.model.organizations.splice(index, 1);
+                    }
+
+                    toastr.success('You have left the organization.');
+                    scrollToTop();
+                });
+            }, function (error) {
+                toastr.error('Unable to leave this organization.');
+                scrollToTop();
             });
         };
 
@@ -79,8 +133,11 @@
             $uibModal.open({
                 animation: true,
                 templateUrl: 'app/settings/views/settingsDelete.html',
-                controller: 'settingsDeleteController',
-                size: 'sm'
+                controller: 'settingsDeleteController'
             });
         };
+
+        function scrollToTop() {
+            $('html, body').animate({ scrollTop: 0 }, 200);
+        }
     });

src/app/settings/settingsCreateOrganizationController.js

@@ -0,0 +1,86 @@
+angular
+    .module('bit.settings')
+
+    .controller('settingsCreateOrganizationController', function ($scope, $state, apiService, cryptoService,
+        toastr, $analytics, authService, stripe, constants) {
+        $scope.plans = constants.plans;
+
+        $scope.model = {
+            plan: 'free',
+            additionalSeats: 0,
+            interval: 'year',
+            ownedBusiness: false
+        };
+
+        $scope.totalPrice = function () {
+            if ($scope.model.interval === 'month') {
+                return ($scope.model.additionalSeats || 0) * $scope.plans[$scope.model.plan].monthlySeatPrice +
+                    $scope.plans[$scope.model.plan].monthlyBasePrice;
+            }
+            else {
+                return ($scope.model.additionalSeats || 0) * $scope.plans[$scope.model.plan].annualSeatPrice +
+                    $scope.plans[$scope.model.plan].annualBasePrice;
+            }
+        };
+
+        $scope.changedPlan = function () {
+            if ($scope.plans[$scope.model.plan].hasOwnProperty('monthPlanType')) {
+                $scope.model.interval = 'year';
+            }
+        };
+
+        $scope.changedBusiness = function () {
+            if ($scope.model.ownedBusiness) {
+                $scope.model.plan = 'teams';
+            }
+        };
+
+        $scope.submit = function (model) {
+            var shareKeyCt = cryptoService.makeShareKeyCt();
+
+            if (model.plan === 'free') {
+                var freeRequest = {
+                    name: model.name,
+                    planType: model.plan,
+                    key: shareKeyCt,
+                    billingEmail: model.billingEmail
+                };
+
+                $scope.submitPromise = apiService.organizations.post(freeRequest).$promise.then(finalizeCreate);
+            }
+            else {
+                $scope.submitPromise = stripe.card.createToken(model.card).then(function (response) {
+                    var paidRequest = {
+                        name: model.name,
+                        planType: model.interval === 'month' ? $scope.plans[model.plan].monthPlanType :
+                            $scope.plans[model.plan].annualPlanType,
+                        key: shareKeyCt,
+                        paymentToken: response.id,
+                        additionalSeats: model.additionalSeats,
+                        billingEmail: model.billingEmail,
+                        businessName: model.ownedBusiness ? model.businessName : null
+                    };
+
+                    return apiService.organizations.post(paidRequest).$promise;
+                }).then(finalizeCreate);
+            }
+
+            function finalizeCreate(result) {
+                $scope.model.card = null;
+
+                $analytics.eventTrack('Created Organization');
+                authService.addProfileOrganizationOwner(result, shareKeyCt);
+                authService.refreshAccessToken().then(function () {
+                    goToOrg(result.Id);
+                }, function () {
+                    goToOrg(result.Id);
+                });
+            }
+
+            function goToOrg(id) {
+                $state.go('backend.org.dashboard', { orgId: id }).then(function () {
+                    toastr.success('Your new organization is ready to go!', 'Organization Created');
+                });
+            }
+        };
+    });

src/app/settings/settingsDeleteController.js

@@ -1,7 +1,8 @@
 angular
     .module('bit.settings')
 
-    .controller('settingsDeleteController', function ($scope, $state, apiService, $uibModalInstance, cryptoService, authService, toastr, $analytics) {
+    .controller('settingsDeleteController', function ($scope, $state, apiService, $uibModalInstance, cryptoService,
+        authService, toastr, $analytics) {
         $analytics.eventTrack('settingsDeleteController', { category: 'Modal' });
         $scope.submit = function (model) {
             var request = {

src/app/settings/settingsDomainsController.js

@@ -35,6 +35,7 @@
 
         $scope.delete = function (i) {
             $scope.equivalentDomains.splice(i, 1);
+            $scope.$emit('removeAppendedDropdownMenu');
         };
 
         $scope.addEdit = function (i) {
@@ -95,6 +96,7 @@
             }
 
             return apiService.settings.putDomains(request, function (domains) {
+                $analytics.eventTrack('Saved Equivalent Domains');
                 toastr.success('Domains have been updated.', 'Success!');
             }).$promise;
         };

src/app/settings/settingsSessionsController.js

@@ -1,7 +1,8 @@
 angular
     .module('bit.settings')
 
-    .controller('settingsSessionsController', function ($scope, $state, apiService, $uibModalInstance, cryptoService, authService, toastr, $analytics) {
+    .controller('settingsSessionsController', function ($scope, $state, apiService, $uibModalInstance, cryptoService,
+        authService, toastr, $analytics) {
         $analytics.eventTrack('settingsSessionsController', { category: 'Modal' });
         $scope.submit = function (model) {
             var request = {

src/app/settings/settingsTwoFactorController.js

@@ -1,16 +1,20 @@
 angular
     .module('bit.settings')
 
-    .controller('settingsTwoFactorController', function ($scope, apiService, $uibModalInstance, cryptoService, authService, $q, toastr, $analytics) {
+    .controller('settingsTwoFactorController', function ($scope, apiService, $uibModalInstance, cryptoService, authService,
+        $q, toastr, $analytics) {
         $analytics.eventTrack('settingsTwoFactorController', { category: 'Modal' });
         var _issuer = 'bitwarden',
-            _profile = authService.getUserProfile(),
+            _profile = null,
             _masterPasswordHash;
 
-        $scope.account = _profile.email;
-        $scope.enabled = function () {
-            return _profile.extended && _profile.extended.twoFactorEnabled;
-        };
+        authService.getUserProfile().then(function (profile) {
+            _profile = profile;
+            $scope.account = _profile.email;
+            $scope.enabled = function () {
+                return _profile.extended && _profile.extended.twoFactorEnabled;
+            };
+        });
 
         $scope.auth = function (model) {
             _masterPasswordHash = cryptoService.hashPassword(model.masterPassword);
@@ -38,9 +42,9 @@
                 key: formatString(key),
                 recovery: formatString(response.TwoFactorRecoveryCode),
                 qr: 'https://chart.googleapis.com/chart?chs=120x120&chld=L|0&cht=qr&chl=otpauth://totp/' +
-                    _issuer + ':' + encodeURIComponent(_profile.email) +
-                    '%3Fsecret=' + encodeURIComponent(key) +
-                    '%26issuer=' + _issuer
+                _issuer + ':' + encodeURIComponent(_profile.email) +
+                '%3Fsecret=' + encodeURIComponent(key) +
+                '%26issuer=' + _issuer
             };
         }
 
@@ -75,6 +79,7 @@
         };
 
         $scope.print = function (printContent) {
+            $analytics.eventTrack('Print Recovery Code');
             var w = window.open();
             w.document.write('<div style="font-size: 18px; text-align: center;"><p>bitwarden two-step login recovery code:</p>' +
                 '<pre>' + printContent + '</pre>');

src/app/settings/views/settings.html

@@ -36,12 +36,9 @@
                         </div>
                     </div>
                     <div class="col-sm-3 settings-photo">
-                        <a href="http://www.gravatar.com/" target="_blank">
-                            <img src="//www.gravatar.com/avatar/{{ main.userProfile.email | gravatar }}.jpg?s=150&d=mm"
-                                 class="img-rounded img-responsive" alt="User Image">
-                        </a>
-                        <a href="http://www.gravatar.com/" target="_blank" class="btn btn-link"
-                           analytics-on="click" analytics-event="Clicked Update Photo">Update Photo</a>
+                        <letter-avatar data="{{model.profile.name || model.email}}" round="false"
+                                       avclass="img-responsive img-rounded" avwidth="200" avheight="200"
+                                       fontsize="90"></letter-avatar>
                     </div>
                 </div>
             </div>
@@ -109,6 +106,41 @@
             </button>
         </div>
     </div>
+    <div class="box box-default">
+        <div class="box-header with-border">
+            <h3 class="box-title">Organizations</h3>
+        </div>
+        <div class="box-body" ng-if="!model.organizations || !model.organizations.length">
+            No organizations yet for your account.
+        </div>
+        <div class="list-group" ng-if="model.organizations && model.organizations.length">
+            <div class="list-group-item" ng-repeat="org in model.organizations | orderBy: ['name']">
+                <div class="btn-group" data-append-to="body">
+                    <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
+                        <i class="fa fa-cog"></i> <span class="caret"></span>
+                    </button>
+                    <ul class="dropdown-menu">
+                        <li>
+                            <a href="javascript:void(0)" ng-click="leaveOrganization(org)" class="text-red">
+                                <i class="fa fa-fw fa-sign-out"></i> Leave
+                            </a>
+                        </li>
+                    </ul>
+                </div>
+                <a href="javascript:void(0)" ng-click="viewOrganization(org)">
+                    <letter-avatar data="{{org.name}}" round="false" avwidth="25" avheight="25"
+                                   avclass="img-rounded" fontsize="10"></letter-avatar>
+                    {{org.name}}
+                    <span class="label bg-gray" ng-if="!org.enabled">DISABLED</span>
+                </a>
+            </div>
+        </div>
+        <div class="box-footer">
+            <a ui-sref="backend.user.settingsCreateOrg" class="btn btn-default btn-flat">
+                Create an Organization
+            </a>
+        </div>
+    </div>
     <div class="box box-danger">
         <div class="box-header with-border">
             <h3 class="box-title">Danger Zone</h3>

src/app/settings/views/settingsCreateOrganization.html

@@ -0,0 +1,535 @@
+<section class="content-header">
+    <h1>Create Organization</h1>
+</section>
+<section class="content">
+    <p>
+        Organizations allow you to share parts of your vault with others as well as manage related users
+        for a specific entity (such as a family, small team, or large company).
+    </p>
+    <form name="createOrgForm" ng-submit="createOrgForm.$valid && submit(model)" api-form="submitPromise">
+        <div class="box box-default">
+            <div class="box-header with-border">
+                <h3 class="box-title">General Information</h3>
+            </div>
+            <div class="box-body">
+                <div class="callout callout-danger validation-errors" ng-show="createOrgForm.$errors">
+                    <h4>Errors have occured</h4>
+                    <ul>
+                        <li ng-repeat="e in createOrgForm.$errors">{{e}}</li>
+                    </ul>
+                </div>
+                <div class="row">
+                    <div class="col-md-6">
+                        <div class="form-group" show-errors>
+                            <label for="name">Organization Name</label>
+                            <input type="text" id="name" name="Name" ng-model="model.name" class="form-control"
+                                   required api-field />
+                        </div>
+                    </div>
+                    <div class="col-md-6">
+                        <div class="form-group" show-errors>
+                            <label for="billingEmail">Billing Email</label>
+                            <input type="email" id="billingEmail" name="BillingEmail" ng-model="model.billingEmail"
+                                   class="form-control" required api-field />
+                        </div>
+                    </div>
+                </div>
+                <div class="checkbox">
+                    <label>
+                        <input type="checkbox" ng-model="model.ownedBusiness" ng-click="changedBusiness()">
+                        This account is owned by a business.
+                    </label>
+                </div>
+                <div class="row" ng-show="model.ownedBusiness">
+                    <div class="col-md-6">
+                        <div class="form-group" show-errors>
+                            <label for="businessName">Business Name</label>
+                            <input type="text" id="businessName" name="BusinessName" ng-model="model.businessName"
+                                   class="form-control" api-field />
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+        <div class="box box-default">
+            <div class="box-header with-border">
+                <h3 class="box-title">Choose Your Plan</h3>
+            </div>
+            <div class="box-body">
+                <div class="radio radio-block" ng-if="!model.ownedBusiness" ng-click="changedPlan()">
+                    <label>
+                        <input type="radio" ng-model="model.plan" name="PlanType" value="free">
+                        Free
+                        <span>For personal users to share with 1 other user.</span>
+                        <span>- Limit 2 users (including you)</span>
+                        <span>- Limit 2 collections</span>
+                        <span class="bottom-line">
+                            Free forever
+                        </span>
+                    </label>
+                </div>
+                <div class="radio radio-block" ng-if="!model.ownedBusiness" ng-click="changedPlan()">
+                    <label>
+                        <input type="radio" ng-model="model.plan" name="PlanType" value="personal">
+                        Personal
+                        <span>For personal users such as families &amp; friends.</span>
+                        <span>- Add and share with up to 10 users (5 included with base price)</span>
+                        <span>- Create unlimited collections</span>
+                        <span>- Priority customer support</span>
+                        <span>- 7 day free trial, cancel anytime</span>
+                        <span class="bottom-line">
+                            {{plans.personal.basePrice | currency:'$'}} /month for {{plans.personal.baseSeats}} users,
+                            additional users {{plans.personal.seatPrice | currency:'$'}} /month
+                        </span>
+                    </label>
+                </div>
+                <div class="radio radio-block" ng-click="changedPlan()">
+                    <label>
+                        <input type="radio" ng-model="model.plan" name="PlanType" value="teams">
+                        Teams
+                        <span>For businesses and other team organizations.</span>
+                        <span>- Add and share with unlimited users</span>
+                        <span>- Create unlimited collections</span>
+                        <span>- Priority customer support</span>
+                        <span>- 7 day free trial, cancel anytime</span>
+                        <span class="bottom-line">
+                            {{plans.teams.basePrice | currency:'$'}} /month for {{plans.teams.baseSeats}} users,
+                            additional users {{plans.teams.seatPrice | currency:'$'}} /month
+                        </span>
+                    </label>
+                </div>
+            </div>
+            <div class="box-footer" ng-show="plans[model.plan].noPayment">
+                <button type="submit" class="btn btn-primary btn-flat" ng-disabled="createOrgForm.$loading">
+                    <i class="fa fa-refresh fa-spin loading-icon" ng-show="createOrgForm.$loading"></i>Submit
+                </button>
+            </div>
+        </div>
+        <div class="box box-default" ng-if="!plans[model.plan].noAdditionalSeats">
+            <div class="box-header with-border">
+                <h3 class="box-title">Additional Users (Seats)</h3>
+            </div>
+            <div class="box-body">
+                <p>
+                    Your plan comes with <b>{{plans[model.plan].baseSeats}}</b> users (seats). You can add additional users
+                    <span ng-if="plans[model.plan].maxAdditionalSeats">
+                        (up to {{plans[model.plan].maxAdditionalSeats}} more)
+                    </span>
+                    for {{plans[model.plan].seatPrice | currency:'$'}} per user /month.
+                </p>
+                <div class="row">
+                    <div class="col-md-4">
+                        <div class="form-group" show-errors style="margin: 0;">
+                            <label for="additionalSeats" class="sr-only">Additional Users</label>
+                            <input type="number" id="additionalSeats" name="AdditionalSeats" ng-model="model.additionalSeats"
+                                   min="0" class="form-control" placeholder="# of users" api-field
+                                   ng-attr-max="{{plans[model.plan].maxAdditionalSeats || 1000000}}" />
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </div>
+        <div class="box box-default" ng-if="!plans[model.plan].noPayment">
+            <div class="box-header with-border">
+                <h3 class="box-title">Billing Summary</h3>
+            </div>
+            <div class="box-body">
+                <div class="radio radio-block">
+                    <label>
+                        <input type="radio" ng-model="model.interval" name="BillingInterval" value="year">
+                        Annually
+                        <span>
+                            Base price:
+                            {{plans[model.plan].basePrice | currency:"$":2}} &times;12 mo. =
+                            {{plans[model.plan].annualBasePrice | currency:"$":2}} /year
+                        </span>
+                        <span>
+                            Additional users:
+                            {{model.additionalSeats || 0}} &times;{{plans[model.plan].seatPrice | currency:"$":2}}
+                            &times;12 mo. = {{(model.additionalSeats * plans[model.plan].annualSeatPrice) | currency:"$":2}} /year
+                        </span>
+                    </label>
+                </div>
+                <div class="radio radio-block" ng-if="model.plan !== 'personal'">
+                    <label>
+                        <input type="radio" ng-model="model.interval" name="BillingInterval" value="month">
+                        Monthly
+                        <span>
+                            Base price:
+                            {{plans[model.plan].monthlyBasePrice | currency:"$":2}} /month
+                        </span>
+                        <span>
+                            Additional users:
+                            {{model.additionalSeats || 0}} &times;{{plans[model.plan].monthlySeatPrice | currency:"$":2}} =
+                            {{(model.additionalSeats * plans[model.plan].monthlySeatPrice) | currency:"$":2}} /month
+                        </span>
+                    </label>
+                </div>
+            </div>
+            <div class="box-footer">
+                <h4>
+                    <b>Total:</b>
+                    {{totalPrice() | currency:"USD $":2}} /{{model.interval}}
+                </h4>
+                Your plan comes with a free 7 day trial. Your card will not be charged until the trial has ended.
+                You may cancel at any time.
+            </div>
+        </div>
+        <div class="box box-default" ng-if="!plans[model.plan].noPayment">
+            <div class="box-header with-border">
+                <h3 class="box-title">Payment Information</h3>
+            </div>
+            <div class="box-body">
+                <div class="row">
+                    <div class="col-md-5">
+                        <div class="form-group" show-errors>
+                            <label for="card_number">Card Number</label>
+                            <input type="text" id="card_number" name="card_number" ng-model="model.card.number"
+                                   class="form-control" cc-number required api-field />
+                        </div>
+                    </div>
+                    <div class="col-md-7">
+                        <br class="hidden-sm hidden-xs" />
+                        <ul class="list-inline" style="margin: 0;">
+                            <li><div class="cc visa"></div></li>
+                            <li><div class="cc mastercard"></div></li>
+                            <li><div class="cc amex"></div></li>
+                            <li><div class="cc discover"></div></li>
+                            <li><div class="cc diners"></div></li>
+                            <li><div class="cc jcb"></div></li>
+                        </ul>
+                    </div>
+                </div>
+                <div class="row">
+                    <div class="col-sm-4">
+                        <div class="form-group" show-errors>
+                            <label for="exp_month">Expiration Month</label>
+                            <select id="exp_month" class="form-control" ng-model="model.card.exp_month" required cc-exp-month
+                                    name="exp_month" api-field>
+                                <option value="">-- Select --</option>
+                                <option value="01">01 - January</option>
+                                <option value="02">02 - February</option>
+                                <option value="03">03 - March</option>
+                                <option value="04">04 - April</option>
+                                <option value="05">05 - May</option>
+                                <option value="06">06 - June</option>
+                                <option value="07">07 - July</option>
+                                <option value="08">08 - August</option>
+                                <option value="09">09 - September</option>
+                                <option value="10">10 - October</option>
+                                <option value="11">11 - November</option>
+                                <option value="12">12 - December</option>
+                            </select>
+                        </div>
+                    </div>
+                    <div class="col-sm-4">
+                        <div class="form-group" show-errors>
+                            <label for="exp_year">Expiration Year</label>
+                            <select id="exp_year" class="form-control" ng-model="model.card.exp_year" required cc-exp-year
+                                    name="exp_year" api-field>
+                                <option value="">-- Select --</option>
+                                <option value="17">2017</option>
+                                <option value="18">2018</option>
+                                <option value="19">2019</option>
+                                <option value="20">2020</option>
+                                <option value="21">2021</option>
+                                <option value="22">2022</option>
+                                <option value="23">2023</option>
+                                <option value="24">2024</option>
+                                <option value="25">2025</option>
+                                <option value="26">2026</option>
+                            </select>
+                        </div>
+                    </div>
+                    <div class="col-sm-4">
+                        <div class="form-group" show-errors>
+                            <label for="cvc">
+                                CVC
+                                <a href="https://www.cvvnumber.com/cvv.html" target="_blank" title="What is this?"
+                                   rel="noopener noreferrer">
+                                    <i class="fa fa-question-circle"></i>
+                                </a>
+                            </label>
+                            <input type="text" id="cvc" ng-model="model.card.cvc" class="form-control" name="cvc"
+                                   cc-type="number.$ccType" cc-cvc required api-field />
+                        </div>
+                    </div>
+                </div>
+                <div class="row">
+                    <div class="col-sm-6">
+                        <div class="form-group" show-errors>
+                            <label for="address_country">Country</label>
+                            <select id="address_country" class="form-control" ng-model="model.card.address_country"
+                                    required name="address_country" api-field>
+                                <option value="">-- Select --</option>
+                                <option value="US">United States</option>
+                                <option value="CN">China</option>
+                                <option value="FR">France</option>
+                                <option value="DE">Germany</option>
+                                <option value="CA">Canada</option>
+                                <option value="GB">United Kingdom</option>
+                                <option value="AU">Australia</option>
+                                <option value="IN">India</option>
+                                <option value="-" disabled></option>
+                                <option value="AF">Afghanistan</option>
+                                <option value="AX">Åland Islands</option>
+                                <option value="AL">Albania</option>
+                                <option value="DZ">Algeria</option>
+                                <option value="AS">American Samoa</option>
+                                <option value="AD">Andorra</option>
+                                <option value="AO">Angola</option>
+                                <option value="AI">Anguilla</option>
+                                <option value="AQ">Antarctica</option>
+                                <option value="AG">Antigua and Barbuda</option>
+                                <option value="AR">Argentina</option>
+                                <option value="AM">Armenia</option>
+                                <option value="AW">Aruba</option>
+                                <option value="AT">Austria</option>
+                                <option value="AZ">Azerbaijan</option>
+                                <option value="BS">Bahamas</option>
+                                <option value="BH">Bahrain</option>
+                                <option value="BD">Bangladesh</option>
+                                <option value="BB">Barbados</option>
+                                <option value="BY">Belarus</option>
+                                <option value="BE">Belgium</option>
+                                <option value="BZ">Belize</option>
+                                <option value="BJ">Benin</option>
+                                <option value="BM">Bermuda</option>
+                                <option value="BT">Bhutan</option>
+                                <option value="BO">Bolivia, Plurinational State of</option>
+                                <option value="BQ">Bonaire, Sint Eustatius and Saba</option>
+                                <option value="BA">Bosnia and Herzegovina</option>
+                                <option value="BW">Botswana</option>
+                                <option value="BV">Bouvet Island</option>
+                                <option value="BR">Brazil</option>
+                                <option value="IO">British Indian Ocean Territory</option>
+                                <option value="BN">Brunei Darussalam</option>
+                                <option value="BG">Bulgaria</option>
+                                <option value="BF">Burkina Faso</option>
+                                <option value="BI">Burundi</option>
+                                <option value="KH">Cambodia</option>
+                                <option value="CM">Cameroon</option>
+                                <option value="CV">Cape Verde</option>
+                                <option value="KY">Cayman Islands</option>
+                                <option value="CF">Central African Republic</option>
+                                <option value="TD">Chad</option>
+                                <option value="CL">Chile</option>
+                                <option value="CX">Christmas Island</option>
+                                <option value="CC">Cocos (Keeling) Islands</option>
+                                <option value="CO">Colombia</option>
+                                <option value="KM">Comoros</option>
+                                <option value="CG">Congo</option>
+                                <option value="CD">Congo, the Democratic Republic of the</option>
+                                <option value="CK">Cook Islands</option>
+                                <option value="CR">Costa Rica</option>
+                                <option value="CI">Côte d'Ivoire</option>
+                                <option value="HR">Croatia</option>
+                                <option value="CU">Cuba</option>
+                                <option value="CW">Curaçao</option>
+                                <option value="CY">Cyprus</option>
+                                <option value="CZ">Czech Republic</option>
+                                <option value="DK">Denmark</option>
+                                <option value="DJ">Djibouti</option>
+                                <option value="DM">Dominica</option>
+                                <option value="DO">Dominican Republic</option>
+                                <option value="EC">Ecuador</option>
+                                <option value="EG">Egypt</option>
+                                <option value="SV">El Salvador</option>
+                                <option value="GQ">Equatorial Guinea</option>
+                                <option value="ER">Eritrea</option>
+                                <option value="EE">Estonia</option>
+                                <option value="ET">Ethiopia</option>
+                                <option value="FK">Falkland Islands (Malvinas)</option>
+                                <option value="FO">Faroe Islands</option>
+                                <option value="FJ">Fiji</option>
+                                <option value="FI">Finland</option>
+                                <option value="GF">French Guiana</option>
+                                <option value="PF">French Polynesia</option>
+                                <option value="TF">French Southern Territories</option>
+                                <option value="GA">Gabon</option>
+                                <option value="GM">Gambia</option>
+                                <option value="GE">Georgia</option>
+                                <option value="GH">Ghana</option>
+                                <option value="GI">Gibraltar</option>
+                                <option value="GR">Greece</option>
+                                <option value="GL">Greenland</option>
+                                <option value="GD">Grenada</option>
+                                <option value="GP">Guadeloupe</option>
+                                <option value="GU">Guam</option>
+                                <option value="GT">Guatemala</option>
+                                <option value="GG">Guernsey</option>
+                                <option value="GN">Guinea</option>
+                                <option value="GW">Guinea-Bissau</option>
+                                <option value="GY">Guyana</option>
+                                <option value="HT">Haiti</option>
+                                <option value="HM">Heard Island and McDonald Islands</option>
+                                <option value="VA">Holy See (Vatican City State)</option>
+                                <option value="HN">Honduras</option>
+                                <option value="HK">Hong Kong</option>
+                                <option value="HU">Hungary</option>
+                                <option value="IS">Iceland</option>
+                                <option value="ID">Indonesia</option>
+                                <option value="IR">Iran, Islamic Republic of</option>
+                                <option value="IQ">Iraq</option>
+                                <option value="IE">Ireland</option>
+                                <option value="IM">Isle of Man</option>
+                                <option value="IL">Israel</option>
+                                <option value="IT">Italy</option>
+                                <option value="JM">Jamaica</option>
+                                <option value="JP">Japan</option>
+                                <option value="JE">Jersey</option>
+                                <option value="JO">Jordan</option>
+                                <option value="KZ">Kazakhstan</option>
+                                <option value="KE">Kenya</option>
+                                <option value="KI">Kiribati</option>
+                                <option value="KP">Korea, Democratic People's Republic of</option>
+                                <option value="KR">Korea, Republic of</option>
+                                <option value="KW">Kuwait</option>
+                                <option value="KG">Kyrgyzstan</option>
+                                <option value="LA">Lao People's Democratic Republic</option>
+                                <option value="LV">Latvia</option>
+                                <option value="LB">Lebanon</option>
+                                <option value="LS">Lesotho</option>
+                                <option value="LR">Liberia</option>
+                                <option value="LY">Libya</option>
+                                <option value="LI">Liechtenstein</option>
+                                <option value="LT">Lithuania</option>
+                                <option value="LU">Luxembourg</option>
+                                <option value="MO">Macao</option>
+                                <option value="MK">Macedonia, the former Yugoslav Republic of</option>
+                                <option value="MG">Madagascar</option>
+                                <option value="MW">Malawi</option>
+                                <option value="MY">Malaysia</option>
+                                <option value="MV">Maldives</option>
+                                <option value="ML">Mali</option>
+                                <option value="MT">Malta</option>
+                                <option value="MH">Marshall Islands</option>
+                                <option value="MQ">Martinique</option>
+                                <option value="MR">Mauritania</option>
+                                <option value="MU">Mauritius</option>
+                                <option value="YT">Mayotte</option>
+                                <option value="MX">Mexico</option>
+                                <option value="FM">Micronesia, Federated States of</option>
+                                <option value="MD">Moldova, Republic of</option>
+                                <option value="MC">Monaco</option>
+                                <option value="MN">Mongolia</option>
+                                <option value="ME">Montenegro</option>
+                                <option value="MS">Montserrat</option>
+                                <option value="MA">Morocco</option>
+                                <option value="MZ">Mozambique</option>
+                                <option value="MM">Myanmar</option>
+                                <option value="NA">Namibia</option>
+                                <option value="NR">Nauru</option>
+                                <option value="NP">Nepal</option>
+                                <option value="NL">Netherlands</option>
+                                <option value="NC">New Caledonia</option>
+                                <option value="NZ">New Zealand</option>
+                                <option value="NI">Nicaragua</option>
+                                <option value="NE">Niger</option>
+                                <option value="NG">Nigeria</option>
+                                <option value="NU">Niue</option>
+                                <option value="NF">Norfolk Island</option>
+                                <option value="MP">Northern Mariana Islands</option>
+                                <option value="NO">Norway</option>
+                                <option value="OM">Oman</option>
+                                <option value="PK">Pakistan</option>
+                                <option value="PW">Palau</option>
+                                <option value="PS">Palestinian Territory, Occupied</option>
+                                <option value="PA">Panama</option>
+                                <option value="PG">Papua New Guinea</option>
+                                <option value="PY">Paraguay</option>
+                                <option value="PE">Peru</option>
+                                <option value="PH">Philippines</option>
+                                <option value="PN">Pitcairn</option>
+                                <option value="PL">Poland</option>
+                                <option value="PT">Portugal</option>
+                                <option value="PR">Puerto Rico</option>
+                                <option value="QA">Qatar</option>
+                                <option value="RE">Réunion</option>
+                                <option value="RO">Romania</option>
+                                <option value="RU">Russian Federation</option>
+                                <option value="RW">Rwanda</option>
+                                <option value="BL">Saint Barthélemy</option>
+                                <option value="SH">Saint Helena, Ascension and Tristan da Cunha</option>
+                                <option value="KN">Saint Kitts and Nevis</option>
+                                <option value="LC">Saint Lucia</option>
+                                <option value="MF">Saint Martin (French part)</option>
+                                <option value="PM">Saint Pierre and Miquelon</option>
+                                <option value="VC">Saint Vincent and the Grenadines</option>
+                                <option value="WS">Samoa</option>
+                                <option value="SM">San Marino</option>
+                                <option value="ST">Sao Tome and Principe</option>
+                                <option value="SA">Saudi Arabia</option>
+                                <option value="SN">Senegal</option>
+                                <option value="RS">Serbia</option>
+                                <option value="SC">Seychelles</option>
+                                <option value="SL">Sierra Leone</option>
+                                <option value="SG">Singapore</option>
+                                <option value="SX">Sint Maarten (Dutch part)</option>
+                                <option value="SK">Slovakia</option>
+                                <option value="SI">Slovenia</option>
+                                <option value="SB">Solomon Islands</option>
+                                <option value="SO">Somalia</option>
+                                <option value="ZA">South Africa</option>
+                                <option value="GS">South Georgia and the South Sandwich Islands</option>
+                                <option value="SS">South Sudan</option>
+                                <option value="ES">Spain</option>
+                                <option value="LK">Sri Lanka</option>
+                                <option value="SD">Sudan</option>
+                                <option value="SR">Suriname</option>
+                                <option value="SJ">Svalbard and Jan Mayen</option>
+                                <option value="SZ">Swaziland</option>
+                                <option value="SE">Sweden</option>
+                                <option value="CH">Switzerland</option>
+                                <option value="SY">Syrian Arab Republic</option>
+                                <option value="TW">Taiwan, Province of China</option>
+                                <option value="TJ">Tajikistan</option>
+                                <option value="TZ">Tanzania, United Republic of</option>
+                                <option value="TH">Thailand</option>
+                                <option value="TL">Timor-Leste</option>
+                                <option value="TG">Togo</option>
+                                <option value="TK">Tokelau</option>
+                                <option value="TO">Tonga</option>
+                                <option value="TT">Trinidad and Tobago</option>
+                                <option value="TN">Tunisia</option>
+                                <option value="TR">Turkey</option>
+                                <option value="TM">Turkmenistan</option>
+                                <option value="TC">Turks and Caicos Islands</option>
+                                <option value="TV">Tuvalu</option>
+                                <option value="UG">Uganda</option>
+                                <option value="UA">Ukraine</option>
+                                <option value="AE">United Arab Emirates</option>
+                                <option value="UM">United States Minor Outlying Islands</option>
+                                <option value="UY">Uruguay</option>
+                                <option value="UZ">Uzbekistan</option>
+                                <option value="VU">Vanuatu</option>
+                                <option value="VE">Venezuela, Bolivarian Republic of</option>
+                                <option value="VN">Viet Nam</option>
+                                <option value="VG">Virgin Islands, British</option>
+                                <option value="VI">Virgin Islands, U.S.</option>
+                                <option value="WF">Wallis and Futuna</option>
+                                <option value="EH">Western Sahara</option>
+                                <option value="YE">Yemen</option>
+                                <option value="ZM">Zambia</option>
+                                <option value="ZW">Zimbabwe</option>
+                            </select>
+                        </div>
+                    </div>
+                    <div class="col-sm-4">
+                        <div class="form-group" show-errors>
+                            <label for="address_zip"
+                                   ng-bind="model.card.address_country === 'US' ? 'Zip Code' : 'Postal Code'"></label>
+                            <input type="text" id="address_zip" ng-model="model.card.address_zip"
+                                   class="form-control" required name="address_zip" api-field />
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="box-footer">
+                <button type="submit" class="btn btn-primary btn-flat" ng-disabled="createOrgForm.$loading">
+                    <i class="fa fa-refresh fa-spin loading-icon" ng-show="createOrgForm.$loading"></i>Submit
+                </button>
+            </div>
+        </div>
+    </form>
+</section>

src/app/settings/views/settingsDomains.html

@@ -9,25 +9,36 @@
     <form name="customForm" ng-submit="customForm.$valid && saveCustom()" api-form="customPromise">
         <div class="box box-default">
             <div class="box-header with-border">
-                <h3 class="box-title">Custom Equivalent Domains</h3>
-                <div class="box-tools pull-right">
-                    <button type="button" class="btn btn-box-tool" ng-click="addEdit(null)">
-                        <i class="fa fa-plus"></i> Add New
+                <h3 class="box-title">Custom <span class="hidden-xs">Equivalent Domains</span></h3>
+                <div class="box-tools">
+                    <button type="button" class="btn btn-primary btn-sm btn-flat" ng-click="addEdit(null)">
+                        <i class="fa fa-fw fa-plus-circle"></i> New Domain
                     </button>
                 </div>
             </div>
             <div class="box-body no-padding">
                 <div class="table-responsive">
-                    <table class="table table-striped table-hover">
+                    <table class="table table-striped table-hover table-vmiddle">
                         <tbody ng-if="equivalentDomains.length">
                             <tr ng-repeat="customDomain in equivalentDomains track by $index">
-                                <td style="width: 80px; min-width: 80px;">
-                                    <button type="button" class="btn btn-link btn-table" uib-tooltip="Edit" ng-click="addEdit($index)">
-                                        <i class="fa fa-lg fa-pencil"></i>
-                                    </button>
-                                    <button type="button" class="btn btn-link btn-table" uib-tooltip="Delete" ng-click="delete($index)">
-                                        <i class="fa fa-lg fa-trash"></i>
-                                    </button>
+                                <td style="width: 70px;">
+                                    <div class="btn-group" data-append-to="body">
+                                        <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
+                                            <i class="fa fa-cog"></i> <span class="caret"></span>
+                                        </button>
+                                        <ul class="dropdown-menu">
+                                            <li>
+                                                <a href="javascript:void(0)" ng-click="addEdit($index)">
+                                                    <i class="fa fa-fw fa-pencil"></i> Edit
+                                                </a>
+                                            </li>
+                                            <li>
+                                                <a href="javascript:void(0)" ng-click="delete($index)" class="text-red">
+                                                    <i class="fa fa-fw fa-trash"></i> Delete
+                                                </a>
+                                            </li>
+                                        </ul>
+                                    </div>
                                 </td>
                                 <td>{{customDomain}}</td>
                             </tr>
@@ -51,28 +62,40 @@
     <form name="globalForm" ng-submit="globalForm.$valid && saveGlobal()" api-form="globalPromise">
         <div class="box box-default">
             <div class="box-header with-border">
-                <h3 class="box-title">Global Equivalent Domains</h3>
+                <h3 class="box-title">Global <span class="hidden-xs">Equivalent Domains</span></h3>
             </div>
             <div class="box-body no-padding">
                 <div class="table-responsive">
-                    <table class="table table-striped table-hover">
+                    <table class="table table-striped table-hover table-vmiddle">
                         <tbody ng-if="globalEquivalentDomains.length">
                             <tr ng-repeat="globalDomain in globalEquivalentDomains">
-                                <td style="width: 80px; min-width: 80px;">
-                                    <button type="button" class="btn btn-link btn-table" uib-tooltip="Exclude"
-                                            ng-if="!globalDomain.excluded" ng-click="toggleExclude(globalDomain)">
-                                        <i class="fa fa-lg fa-ban"></i>
-                                    </button>
-                                    <button type="button" class="btn btn-link btn-table" uib-tooltip="Include"
-                                            ng-if="globalDomain.excluded" ng-click="toggleExclude(globalDomain)">
-                                        <i class="fa fa-lg fa-plus"></i>
-                                    </button>
-                                    <button type="button" class="btn btn-link btn-table" uib-tooltip="Customize"
-                                            ng-click="customize(globalDomain)">
-                                        <i class="fa fa-lg fa-cut"></i>
-                                    </button>
+                                <td style="width: 70px;">
+                                    <div class="btn-group" data-append-to="body">
+                                        <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
+                                            <i class="fa fa-cog"></i> <span class="caret"></span>
+                                        </button>
+                                        <ul class="dropdown-menu">
+                                            <li>
+                                                <a href="javascript:void(0)" ng-if="!globalDomain.excluded" 
+                                                   ng-click="toggleExclude(globalDomain)">
+                                                    <i class="fa fa-fw fa-remove"></i> Exclude
+                                                </a>
+                                            </li>
+                                            <li>
+                                                <a href="javascript:void(0)" ng-if="globalDomain.excluded"
+                                                   ng-click="toggleExclude(globalDomain)">
+                                                    <i class="fa fa-fw fa-plus"></i> Include
+                                                </a>
+                                            </li>
+                                            <li>
+                                                <a href="javascript:void(0)" ng-click="customize(globalDomain)">
+                                                    <i class="fa fa-fw fa-cut"></i> Customize
+                                                </a>
+                                            </li>
+                                        </ul>
+                                    </div>
                                 </td>
-                                <td ng-class="{strike: globalDomain.excluded}">{{globalDomain.domains}}</td>
+                                <td ng-class="{strike: globalDomain.excluded}">{{::globalDomain.domains}}</td>
                             </tr>
                         </tbody>
                         <tbody ng-if="!globalEquivalentDomains.length">

src/app/settings/views/settingsTwoFactor.html

@@ -2,9 +2,13 @@
     <button type="button" class="close" ng-click="close()" aria-label="Close"><span aria-hidden="true">&times;</span></button>
     <h4 class="modal-title" id="twoFactorModelLabel"><i class="fa fa-key"></i> Two-step Log In</h4>
 </div>
-<form name="authTwoStepForm" ng-submit="authTwoStepForm.$valid && auth(authModel)" api-form="authPromise" ng-if="!twoFactorModel">
+<form name="authTwoStepForm" ng-submit="authTwoStepForm.$valid && auth(authModel)" api-form="authPromise"
+      ng-if="!twoFactorModel">
     <div class="modal-body">
-        <p ng-show="enabled()">Two-step log in is already enabled on your account. To access your two-step settings enter your master password below.</p>
+        <p ng-show="enabled()">
+            Two-step log in is already enabled on your account. To access your two-step
+            settings enter your master password below.
+        </p>
         <p ng-show="!enabled()">To get started with two-step log in enter your master password below.</p>
         <div class="callout callout-danger validation-errors" ng-show="authTwoStepForm.$errors">
             <h4>Errors have occured</h4>
@@ -14,7 +18,8 @@
         </div>
         <div class="form-group" show-errors>
             <label for="masterPassword">Master Password</label>
-            <input type="password" id="masterPassword" name="MasterPasswordHash" ng-model="authModel.masterPassword" class="form-control" required api-field />
+            <input type="password" id="masterPassword" name="MasterPasswordHash" ng-model="authModel.masterPassword"
+                   class="form-control" required api-field />
         </div>
     </div>
     <div class="modal-footer">
@@ -24,10 +29,17 @@
         <button type="button" class="btn btn-default btn-flat" ng-click="close()">Close</button>
     </div>
 </form>
-<form name="updateTwoStepForm" ng-submit="updateTwoStepForm.$valid && update(updateModel)" api-form="updatePromise" ng-if="twoFactorModel">
+<form name="updateTwoStepForm" ng-submit="updateTwoStepForm.$valid && update(updateModel)" api-form="updatePromise"
+      ng-if="twoFactorModel">
     <div class="modal-body">
         <div ng-show="enabled()">
-            <p>Two-step log in is <strong class="text-green">enabled</strong> on your account. Below is the code required by your verification app.</p>
+            <div class="callout callout-success">
+                <h4><i class="fa fa-check-circle"></i> Enabled</h4>
+                <p>
+                    Two-step log in is enabled on your account. Incase you need to add it to another device, below is the QR
+                    code (or key) required by your verification app.
+                </p>
+            </div>
             <p>Need a two-step verification app? Download one of the following:</p>
         </div>
         <div ng-show="!enabled()">
@@ -35,10 +47,29 @@
             <h4>1. Download a two-step verification app</h4>
         </div>
         <ul class="fa-ul">
-            <li><i class="fa-li fa fa-apple"></i> iOS devices: <a href="https://itunes.apple.com/us/app/authy/id494168017?mt=8" target="_blank">Authy for iOS</a></li>
-            <li><i class="fa-li fa fa-android"></i> Android devices: <a href="https://play.google.com/store/apps/details?id=com.authy.authy" target="_blank">Authy for Android</a></li>
-            <li><i class="fa-li fa fa-windows"></i> Windows devices: <a href="https://www.microsoft.com/en-us/store/apps/authenticator/9wzdncrfj3rj" target="_blank">Microsoft Authenticator </a></li>
+            <li>
+                <i class="fa-li fa fa-apple fa-lg"></i>
+                iOS devices:
+                <a href="https://itunes.apple.com/us/app/authy/id494168017?mt=8" target="_blank">
+                    Authy for iOS
+                </a>
+            </li>
+            <li>
+                <i class="fa-li fa fa-android fa-lg"></i>
+                Android devices:
+                <a href="https://play.google.com/store/apps/details?id=com.authy.authy" target="_blank">
+                    Authy for Android
+                </a>
+            </li>
+            <li>
+                <i class="fa-li fa fa-windows fa-lg"></i>
+                Windows devices:
+                <a href="https://www.microsoft.com/en-us/store/apps/authenticator/9wzdncrfj3rj" target="_blank">
+                    Microsoft Authenticator
+                </a>
+            </li>
         </ul>
+        <p>These apps are recommended, however, other authenticator apps will also work.</p>
         <hr ng-show="enabled()" />
         <h4 ng-show="!enabled()" style="margin-top: 30px;">2. Scan this QR code with your verification app</h4>
         <div class="row">
@@ -46,7 +77,10 @@
                 <p><img ng-src="{{twoFactorModel.qr}}" alt="QR" class="img-thumbnail" /></p>
             </div>
             <div class="col-md-8">
-                <p><strong>Can't scan the code?</strong> You can add the code to your application manually using the following details:</p>
+                <p>
+                    <strong>Can't scan the code?</strong> You can add the code to your application manually using the
+                    following details:
+                </p>
                 <ul class="list-unstyled">
                     <li><strong>Key:</strong> <code>{{twoFactorModel.key}}</code></li>
                     <li><strong>Account:</strong> {{account}}</li>
@@ -56,12 +90,12 @@
         </div>
         <div ng-show="enabled()">
             <hr />
-            <div class="callout callout-danger">
+            <div class="callout callout-warning">
                 <h4><i class="fa fa-warning"></i> Recovery Code <i class="fa fa-warning"></i></h4>
                 <p>
                     The recovery code allows you to access your account in the event that you lose your authenticator app.
-                    bitwarden support won't be able to assist you if you lose access to your account. We recommend you write down or
-                    print the recovery code below and keep it in a safe place.
+                    bitwarden support won't be able to assist you if you lose access to your account. We recommend
+                    you write down or print the recovery code below and keep it in a safe place.
                 </p>
                 <p><strong>Recovery Code:</strong> <code>{{twoFactorModel.recovery}}</code></p>
                 <button type="button" class="btn btn-default" ng-click="print(twoFactorModel.recovery)">
@@ -69,19 +103,26 @@
                 </button>
             </div>
         </div>
+        <hr ng-show="enabled()" />
         <div class="callout callout-danger validation-errors" ng-show="updateTwoStepForm.$errors">
             <h4>Errors have occured</h4>
             <ul>
                 <li ng-repeat="e in updateTwoStepForm.$errors">{{e}}</li>
             </ul>
         </div>
-        <hr ng-show="enabled()" />
-        <h4 style="margin-top: 30px;"><span ng-show="enabled()">Want to disable? </span><span ng-show="!enabled()">3. </span>Enter the resulting verification code from the app</h4>
+        <h4 style="margin-top: 30px;">
+            <span ng-show="enabled()">Want to disable? </span><span ng-show="!enabled()">3. </span>
+            Enter the resulting verification code from the app
+        </h4>
         <div class="form-group" show-errors>
             <label for="token" class="sr-only">Verification Code</label>
-            <input type="text" id="token" name="Token" placeholder="Verification Code" ng-model="updateModel.token" class="form-control" required api-field />
+            <input type="text" id="token" name="Token" placeholder="Verification Code" ng-model="updateModel.token"
+                   class="form-control" required api-field />
         </div>
-        <p ng-show="!enabled()">NOTE: After enabling two-step log in, you will be required to enter the current code generated by your verification app each time you log in.</p>
+        <p ng-show="!enabled()">
+            NOTE: After enabling two-step log in, you will be required to enter the current code
+            generated by your verification app each time you log in.
+        </p>
     </div>
     <div class="modal-footer">
         <button type="submit" class="btn btn-primary btn-flat" ng-disabled="updateTwoStepForm.$loading">

src/app/tools/toolsAuditsController.js

@@ -1,9 +0,0 @@
-angular
-    .module('bit.tools')
-
-    .controller('toolsAuditsController', function ($scope, apiService, $uibModalInstance, toastr, $analytics) {
-        $analytics.eventTrack('toolsAuditsController', { category: 'Modal' });
-        $scope.close = function () {
-            $uibModalInstance.dismiss('cancel');
-        };
-    });

src/app/tools/toolsController.js

@@ -10,32 +10,11 @@
             });
         };
 
-        $scope.$on('toolsImport', function (event, args) {
-            $scope.import();
-        });
-
         $scope.export = function () {
             $uibModal.open({
                 animation: true,
                 templateUrl: 'app/tools/views/toolsExport.html',
-                controller: 'toolsExportController',
-                size: 'sm'
+                controller: 'toolsExportController'
             });
         };
-
-        $scope.$on('toolsExport', function (event, args) {
-            $scope.export();
-        });
-
-        $scope.audits = function () {
-            $uibModal.open({
-                animation: true,
-                templateUrl: 'app/tools/views/toolsAudits.html',
-                controller: 'toolsAuditsController'
-            });
-        };
-
-        $scope.$on('toolsAudits', function (event, args) {
-            $scope.audits();
-        });
     });

src/app/tools/toolsExportController.js

@@ -1,23 +1,46 @@
 angular
     .module('bit.tools')
 
-    .controller('toolsExportController', function ($scope, apiService, authService, $uibModalInstance, cryptoService, cipherService, $q, toastr, $analytics) {
+    .controller('toolsExportController', function ($scope, apiService, authService, $uibModalInstance, cryptoService,
+        cipherService, $q, toastr, $analytics) {
         $analytics.eventTrack('toolsExportController', { category: 'Modal' });
         $scope.export = function (model) {
             $scope.startedExport = true;
-            apiService.logins.list({ expand: ['folder'] }, function (logins) {
-                try {
-                    var decLogins = cipherService.decryptLogins(logins.Data);
+            var decLogins = [],
+                decFolders = [];
 
+            var folderPromise = apiService.folders.list({}, function (folders) {
+                decFolders = cipherService.decryptFolders(folders.Data);
+            }).$promise;
+
+            var loginsPromise = apiService.logins.list({}, function (logins) {
+                decLogins = cipherService.decryptLogins(logins.Data);
+            }).$promise;
+
+            $q.all([folderPromise, loginsPromise]).then(function () {
+                if (!decLogins.length) {
+                    toastr.error('Nothing to export.', 'Error!');
+                    $scope.close();
+                    return;
+                }
+
+                var foldersDict = {};
+                for (var i = 0; i < decFolders.length; i++) {
+                    foldersDict[decFolders[i].id] = decFolders[i];
+                }
+
+                try {
                     var exportLogins = [];
-                    for (var i = 0; i < decLogins.length; i++) {
+                    for (i = 0; i < decLogins.length; i++) {
                         var login = {
                             name: decLogins[i].name,
                             uri: decLogins[i].uri,
                             username: decLogins[i].username,
                             password: decLogins[i].password,
                             notes: decLogins[i].notes,
-                            folder: decLogins[i].folder ? decLogins[i].folder.name : null
+                            folder: decLogins[i].folderId && (decLogins[i].folderId in foldersDict) ?
+                                foldersDict[decLogins[i].folderId].name : null,
+                            favorite: decLogins[i].favorite ? 1 : null
                         };
 
                         exportLogins.push(login);
@@ -25,7 +48,9 @@
 
                     var csvString = Papa.unparse(exportLogins);
                     var csvBlob = new Blob([csvString]);
-                    if (window.navigator.msSaveOrOpenBlob) { // IE hack. ref http://msdn.microsoft.com/en-us/library/ie/hh779016.aspx
+
+                    // IE hack. ref http://msdn.microsoft.com/en-us/library/ie/hh779016.aspx
+                    if (window.navigator.msSaveOrOpenBlob) {
                         window.navigator.msSaveBlob(csvBlob, makeFileName());
                     }
                     else {
@@ -33,7 +58,9 @@
                         a.href = window.URL.createObjectURL(csvBlob, { type: 'text/plain' });
                         a.download = makeFileName();
                         document.body.appendChild(a);
-                        a.click(); // IE: "Access is denied". ref: https://connect.microsoft.com/IE/feedback/details/797361/ie-10-treats-blob-url-as-cross-origin-and-denies-access
+                        // IE: "Access is denied". 
+                        // ref: https://connect.microsoft.com/IE/feedback/details/797361/ie-10-treats-blob-url-as-cross-origin-and-denies-access
+                        a.click();
                         document.body.removeChild(a);
                     }
 

src/app/tools/toolsImportController.js

@@ -1,9 +1,10 @@
 angular
     .module('bit.tools')
 
-    .controller('toolsImportController', function ($scope, $state, apiService, $uibModalInstance, cryptoService, cipherService, toastr, importService, $analytics, $sce) {
+    .controller('toolsImportController', function ($scope, $state, apiService, $uibModalInstance, cryptoService, cipherService,
+        toastr, importService, $analytics, $sce, validationService) {
         $analytics.eventTrack('toolsImportController', { category: 'Modal' });
-        $scope.model = { source: 'bitwardencsv' };
+        $scope.model = { source: '' };
         $scope.source = {};
 
         $scope.options = [
@@ -202,10 +203,20 @@
         };
         $scope.setSource();
 
-        $scope.import = function (model) {
-            $scope.processing = true;
+        $scope.import = function (model, form) {
+            if (!model.source || model.source === '') {
+                validationService.addError(form, 'source', 'Select the format of the import file.', true);
+                return;
+            }
+
             var file = document.getElementById('file').files[0];
-            importService.import(model.source, file, importSuccess, importError);
+            if (!file && (!model.fileContents || model.fileContents === '')) {
+                validationService.addError(form, 'file', 'Select the import file or copy/paste the import file contents.', true);
+                return;
+            }
+
+            $scope.processing = true;
+            importService.import(model.source, file || model.fileContents, importSuccess, importError);
         };
 
         function importSuccess(folders, logins, folderRelationships) {
@@ -223,12 +234,12 @@
             }
 
             apiService.ciphers.import({
-                folders: cipherService.encryptFolders(folders, cryptoService.getKey()),
-                logins: cipherService.encryptLogins(logins, cryptoService.getKey()),
+                folders: cipherService.encryptFolders(folders),
+                logins: cipherService.encryptLogins(logins),
                 folderRelationships: folderRelationships
             }, function () {
                 $uibModalInstance.dismiss('cancel');
-                $state.go('backend.vault').then(function () {
+                $state.go('backend.user.vault', { refreshFromServer: true }).then(function () {
                     $analytics.eventTrack('Imported Data', { label: $scope.model.source });
                     toastr.success('Data has been successfully imported into your vault.', 'Import Success');
                 });

src/app/tools/views/tools.html

@@ -5,5 +5,28 @@
     </h1>
 </section>
 <section class="content">
-    Several tools are available in the menu to the left. More tools coming soon...
+    <div class="box box-default">
+        <div class="box-header with-border">
+            <h3 class="box-title">Import/Export</h3>
+        </div>
+        <div class="box-body">
+            <p>
+                Quickly import your logins and other data from a previous export or from another
+                password management application.
+            </p>
+            <p>You can also export all of your vault data in <code>.csv</code> format.</p>
+        </div>
+        <div class="box-footer">
+            <button class="btn btn-default btn-flat" type="button" ng-click="import()">Import Data</button>
+            <button class="btn btn-default btn-flat" type="button" ng-click="export()">Export Data</button>
+        </div>
+    </div>
+    <div class="box box-default">
+        <div class="box-header with-border">
+            <h3 class="box-title">Password Generator</h3>
+        </div>
+        <div class="box-body">
+            Password generator is currently available in all other client applications. Coming soon to the web vault!
+        </div>
+    </div>
 </section>

src/app/tools/views/toolsExport.html

@@ -4,7 +4,12 @@
 </div>
 <form name="exportForm" ng-submit="exportForm.$valid && export(model)" api-form="exportPromise" ng-show="!startedExport">
     <div class="modal-body">
-        <p>Export all of your vault data in <code>.csv</code> format. Enter your master password to continue.</p>
+        <p>Enter your master password to continue.</p>
+        <div class="callout callout-warning">
+            <h4><i class="fa fa-warning"></i> Warning</h4>
+            This export contains your <u>unencrypted</u> data in <code>.csv</code> format. You should not store or send the file
+            over unsecure channels (such as email). Delete it immediately after you are done using it.
+        </div>
         <div class="callout callout-danger validation-errors" ng-show="exportForm.$errors">
             <h4>Errors have occured</h4>
             <ul>

src/app/tools/views/toolsImport.html

@@ -2,21 +2,33 @@
     <button type="button" class="close" ng-click="close()" aria-label="Close"><span aria-hidden="true">&times;</span></button>
     <h4 class="modal-title" id="importModelLabel"><i class="fa fa-cloud-upload"></i> Import</h4>
 </div>
-<form name="importForm" ng-submit="importForm.$valid && import(model)" ng-show="!processing">
+<form name="importForm" ng-submit="importForm.$valid && import(model, importForm)" ng-show="!processing">
     <div class="modal-body">
+        <div class="callout callout-danger validation-errors" ng-show="importForm.$errors">
+            <h4>Errors have occured</h4>
+            <ul>
+                <li ng-repeat="e in importForm.$errors">{{e}}</li>
+            </ul>
+        </div>
         <div class="form-group">
-            <label for="source">Source</label>
-            <select id="source" name="source" class="form-control" ng-model="model.source" ng-change="setSource()">
+            <label for="source">1. Select the format of the import file</label>
+            <select id="source" name="source" class="form-control" ng-model="model.source" ng-change="setSource()" required>
+                <option value="">-- Select --</option>
                 <option ng-repeat="option in options" value="{{option.id}}">{{option.name}}</option>
             </select>
         </div>
-        <div class="callout callout-default">
+        <div class="callout callout-default" ng-show="model.source">
             <h4><i class="fa fa-info-circle"></i> {{source.name}} Instructions</h4>
             <div ng-bind-html="source.instructions"></div>
         </div>
         <div class="form-group">
-            <label for="file">File</label>
-            <input type="file" id="file" name="file" required />
+            <label for="file">2. Select the import file</label>
+            <input type="file" id="file" name="file" />
+        </div>
+        <div class="form-group">
+            <label for="fileContents">or copy/paste the import file contents</label>
+            <textarea id="fileContents" class="form-control" name="fileContents" ng-model="model.fileContents"
+                      style="height: 150px;"></textarea>
         </div>
     </div>
     <div class="modal-footer">

src/app/vault/vaultAddLoginController.js

@@ -1,11 +1,13 @@
 angular
     .module('bit.vault')
 
-    .controller('vaultAddLoginController', function ($scope, apiService, $uibModalInstance, cryptoService, cipherService, passwordService, folders, selectedFolder, $analytics) {
+    .controller('vaultAddLoginController', function ($scope, apiService, $uibModalInstance, cryptoService, cipherService,
+        passwordService, selectedFolder, $analytics, checkedFavorite, $rootScope) {
         $analytics.eventTrack('vaultAddLoginController', { category: 'Modal' });
-        $scope.folders = folders;
+        $scope.folders = $rootScope.vaultFolders;
         $scope.login = {
-            folderId: selectedFolder ? selectedFolder.id : null
+            folderId: selectedFolder ? selectedFolder.id : null,
+            favorite: checkedFavorite === true
         };
 
         $scope.savePromise = null;

src/app/vault/vaultController.js

@@ -1,69 +1,134 @@
 angular
     .module('bit.vault')
 
-    .controller('vaultController', function ($scope, $uibModal, apiService, $filter, cryptoService, authService, toastr, cipherService) {
+    .controller('vaultController', function ($scope, $uibModal, apiService, $filter, cryptoService, authService, toastr,
+        cipherService, $q, $localStorage, $timeout, $rootScope, $state, $analytics) {
+        $scope.loading = true;
         $scope.logins = [];
-        $scope.folders = [];
+        $scope.favoriteCollapsed = $localStorage.collapsedFolders && 'favorite' in $localStorage.collapsedFolders;
 
-        $scope.loadingLogins = true;
-        apiService.logins.list({}, function (logins) {
-            $scope.loadingLogins = false;
+        if ($state.params.refreshFromServer) {
+            $rootScope.vaultFolders = $rootScope.vaultLogins = null;
+        }
 
-            var decLogins = [];
-            for (var i = 0; i < logins.Data.length; i++) {
-                var decLogin = {
-                    id: logins.Data[i].Id,
-                    folderId: logins.Data[i].FolderId,
-                    favorite: logins.Data[i].Favorite
-                };
+        $scope.$on('$viewContentLoaded', function () {
+            if ($rootScope.vaultFolders && $rootScope.vaultLogins) {
+                $scope.loading = false;
+                loadFolderData($rootScope.vaultFolders);
+                loadLoginData($rootScope.vaultLogins);
+                return;
+            }
 
-                try { decLogin.name = cryptoService.decrypt(logins.Data[i].Name); }
-                catch (err) { decLogin.name = '[error: cannot decrypt]'; }
+            loadDataFromServer();
+        });
 
-                if (logins.Data[i].Username) {
-                    try { decLogin.username = cryptoService.decrypt(logins.Data[i].Username); }
-                    catch (err) { decLogin.username = '[error: cannot decrypt]'; }
+        function loadDataFromServer() {
+            var folderPromise = apiService.folders.list({}, function (folders) {
+                var decFolders = [{
+                    id: null,
+                    name: 'No Folder'
+                }];
+
+                for (var i = 0; i < folders.Data.length; i++) {
+                    var decFolder = cipherService.decryptFolderPreview(folders.Data[i]);
+                    decFolders.push(decFolder);
                 }
 
-                decLogins.push(decLogin);
+                loadFolderData(decFolders);
+            }).$promise;
+
+            var cipherPromise = apiService.ciphers.list({}, function (ciphers) {
+                var decLogins = [];
+
+                for (var i = 0; i < ciphers.Data.length; i++) {
+                    if (ciphers.Data[i].Type === 1) {
+                        var decLogin = cipherService.decryptLoginPreview(ciphers.Data[i]);
+                        decLogins.push(decLogin);
+                    }
+                }
+
+                $q.when(folderPromise).then(function () {
+                    loadLoginData(decLogins);
+                });
+            }).$promise;
+
+            $q.all([cipherPromise, folderPromise]).then(function () {
+                $scope.loading = false;
+            });
+        }
+
+        function loadFolderData(decFolders) {
+            $rootScope.vaultFolders = $filter('orderBy')(decFolders, folderSort);
+        }
+
+        function loadLoginData(decLogins) {
+            angular.forEach($rootScope.vaultFolders, function (folderValue, folderIndex) {
+                folderValue.collapsed = $localStorage.collapsedFolders &&
+                    (folderValue.id || 'none') in $localStorage.collapsedFolders;
+
+                angular.forEach(decLogins, function (loginValue) {
+                    if (loginValue.favorite) {
+                        loginValue.sort = -1;
+                    }
+                    else if (loginValue.folderId == folderValue.id) {
+                        loginValue.sort = folderIndex;
+                    }
+                });
+            });
+
+            $rootScope.vaultLogins = $scope.logins = $filter('orderBy')(decLogins, ['sort', 'name', 'username']);
+
+            var chunks = chunk($rootScope.vaultLogins, 400);
+            if (chunks.length > 0) {
+                $scope.logins = chunks[0];
+                var delay = 200;
+                angular.forEach(chunks, function (value, index) {
+                    delay += 200;
+
+                    // skip the first chuck
+                    if (index > 0) {
+                        $timeout(function () {
+                            Array.prototype.push.apply($scope.logins, value);
+                        }, delay);
+                    }
+                });
             }
+        }
 
-            $scope.logins = decLogins;
-        }, function () {
-            $scope.loadingLogins = false;
-        });
+        function sortScopedLoginData() {
+            $rootScope.vaultLogins = $scope.logins = $filter('orderBy')($rootScope.vaultLogins, ['name', 'username']);
+        }
 
-        $scope.loadingFolders = true;
-        apiService.folders.list({}, function (folders) {
-            $scope.loadingFolders = false;
-
-            var decFolders = [{
-                id: null,
-                name: '(none)'
-            }];
-
-            for (var i = 0; i < folders.Data.length; i++) {
-                var decFolder = {
-                    id: folders.Data[i].Id
-                };
-
-                try { decFolder.name = cryptoService.decrypt(folders.Data[i].Name); }
-                catch (err) { decFolder.name = '[error: cannot decrypt]'; }
-
-                decFolders.push(decFolder);
+        function chunk(arr, len) {
+            var chunks = [],
+                i = 0,
+                n = arr.length;
+            while (i < n) {
+                chunks.push(arr.slice(i, i += len));
             }
+            return chunks;
+        }
 
-            $scope.folders = decFolders;
-        }, function () {
-            $scope.loadingFolders = false;
-        });
-
-        $scope.folderSort = function (item) {
+        function folderSort(item) {
             if (!item.id) {
                 return '';
             }
 
             return item.name.toLowerCase();
+        }
+
+        $scope.collapseExpand = function (folder, favorite) {
+            if (!$localStorage.collapsedFolders) {
+                $localStorage.collapsedFolders = {};
+            }
+
+            var id = favorite ? 'favorite' : (folder.id || 'none');
+            if (id in $localStorage.collapsedFolders) {
+                delete $localStorage.collapsedFolders[id];
+            }
+            else {
+                $localStorage.collapsedFolders[id] = true;
+            }
         };
 
         $scope.editLogin = function (login) {
@@ -72,30 +137,25 @@
                 templateUrl: 'app/vault/views/vaultEditLogin.html',
                 controller: 'vaultEditLoginController',
                 resolve: {
-                    loginId: function () { return login.id; },
-                    folders: function () { return $scope.folders; }
+                    loginId: function () { return login.id; }
                 }
             });
 
             editModel.result.then(function (returnVal) {
                 if (returnVal.action === 'edit') {
-                    var loginToUpdate = $filter('filter')($scope.logins, { id: returnVal.data.id }, true);
+                    login.folderId = returnVal.data.folderId;
+                    login.name = returnVal.data.name;
+                    login.username = returnVal.data.username;
+                    login.favorite = returnVal.data.favorite;
 
-                    if (loginToUpdate && loginToUpdate.length > 0) {
-                        loginToUpdate[0].folderId = returnVal.data.folderId;
-                        loginToUpdate[0].name = returnVal.data.name;
-                        loginToUpdate[0].username = returnVal.data.username;
-                        loginToUpdate[0].favorite = returnVal.data.favorite;
-                    }
+                    sortScopedLoginData();
+                }
+                else if (returnVal.action === 'partialEdit') {
+                    login.folderId = returnVal.data.folderId;
+                    login.favorite = returnVal.data.favorite;
                 }
                 else if (returnVal.action === 'delete') {
-                    var loginToDelete = $filter('filter')($scope.logins, { id: returnVal.data }, true);
-                    if (loginToDelete && loginToDelete.length > 0) {
-                        var index = $scope.logins.indexOf(loginToDelete[0]);
-                        if (index > -1) {
-                            $scope.logins.splice(index, 1);
-                        }
-                    }
+                    removeLoginFromScopes(login);
                 }
             });
         };
@@ -104,19 +164,20 @@
             $scope.addLogin();
         });
 
-        $scope.addLogin = function (folder) {
+        $scope.addLogin = function (folder, favorite) {
             var addModel = $uibModal.open({
                 animation: true,
                 templateUrl: 'app/vault/views/vaultAddLogin.html',
                 controller: 'vaultAddLoginController',
                 resolve: {
-                    folders: function () { return $scope.folders; },
-                    selectedFolder: function () { return folder; }
+                    selectedFolder: function () { return folder; },
+                    checkedFavorite: function () { return favorite; }
                 }
             });
 
             addModel.result.then(function (addedLogin) {
-                $scope.logins.push(addedLogin);
+                $rootScope.vaultLogins.push(addedLogin);
+                sortScopedLoginData();
             });
         };
 
@@ -126,10 +187,8 @@
             }
 
             apiService.logins.del({ id: login.id }, function () {
-                var index = $scope.logins.indexOf(login);
-                if (index > -1) {
-                    $scope.logins.splice(index, 1);
-                }
+                $analytics.eventTrack('Deleted Login');
+                removeLoginFromScopes(login);
             });
         };
 
@@ -145,10 +204,7 @@
             });
 
             editModel.result.then(function (editedFolder) {
-                var folder = $filter('filter')($scope.folders, { id: editedFolder.id }, true);
-                if (folder && folder.length > 0) {
-                    folder[0].name = editedFolder.name;
-                }
+                folder.name = editedFolder.name;
             });
         };
 
@@ -165,7 +221,8 @@
             });
 
             addModel.result.then(function (addedFolder) {
-                $scope.folders.push(addedFolder);
+                $rootScope.vaultFolders.push(addedFolder);
+                loadFolderData($rootScope.vaultFolders);
             });
         };
 
@@ -175,19 +232,64 @@
             }
 
             apiService.folders.del({ id: folder.id }, function () {
-                var index = $scope.folders.indexOf(folder);
+                $analytics.eventTrack('Deleted Folder');
+                var index = $rootScope.vaultFolders.indexOf(folder);
                 if (index > -1) {
-                    $scope.folders.splice(index, 1);
+                    $rootScope.vaultFolders.splice(index, 1);
                 }
             });
         };
 
         $scope.canDeleteFolder = function (folder) {
-            if (!folder || !folder.id) {
+            if (!folder || !folder.id || !$rootScope.vaultLogins) {
                 return false;
             }
 
-            var logins = $filter('filter')($scope.logins, { folderId: folder.id });
-            return logins.length === 0;
+            var logins = $filter('filter')($rootScope.vaultLogins, { folderId: folder.id });
+            return logins && logins.length === 0;
         };
+
+        $scope.share = function (login) {
+            var modal = $uibModal.open({
+                animation: true,
+                templateUrl: 'app/vault/views/vaultShareLogin.html',
+                controller: 'vaultShareLoginController',
+                resolve: {
+                    loginId: function () { return login.id; }
+                }
+            });
+
+            modal.result.then(function (orgId) {
+                login.organizationId = orgId;
+            });
+        };
+
+        $scope.collections = function (login) {
+            var modal = $uibModal.open({
+                animation: true,
+                templateUrl: 'app/vault/views/vaultLoginCollections.html',
+                controller: 'vaultLoginCollectionsController',
+                resolve: {
+                    loginId: function () { return login.id; }
+                }
+            });
+
+            modal.result.then(function (response) {
+                if (response.collectionIds && !response.collectionIds.length) {
+                    removeLoginFromScopes(login);
+                }
+            });
+        };
+
+        function removeLoginFromScopes(login) {
+            var index = $rootScope.vaultLogins.indexOf(login);
+            if (index > -1) {
+                $rootScope.vaultLogins.splice(index, 1);
+            }
+
+            index = $scope.logins.indexOf(login);
+            if (index > -1) {
+                $scope.logins.splice(index, 1);
+            }
+        }
     });

src/app/vault/vaultEditLoginController.js

@@ -1,25 +1,46 @@
 angular
     .module('bit.vault')
 
-    .controller('vaultEditLoginController', function ($scope, apiService, $uibModalInstance, cryptoService, cipherService, passwordService, loginId, folders, $analytics) {
+    .controller('vaultEditLoginController', function ($scope, apiService, $uibModalInstance, cryptoService, cipherService,
+        passwordService, loginId, $analytics, $rootScope) {
         $analytics.eventTrack('vaultEditLoginController', { category: 'Modal' });
-        $scope.folders = folders;
+        $scope.folders = $rootScope.vaultFolders;
         $scope.login = {};
+        $scope.readOnly = false;
 
         apiService.logins.get({ id: loginId }, function (login) {
             $scope.login = cipherService.decryptLogin(login);
+            $scope.readOnly = !login.Edit;
         });
 
         $scope.save = function (model) {
-            var login = cipherService.encryptLogin(model);
-            $scope.savePromise = apiService.logins.put({ id: loginId }, login, function (loginResponse) {
-                $analytics.eventTrack('Edited Login');
-                var decLogin = cipherService.decryptLogin(loginResponse);
-                $uibModalInstance.close({
-                    action: 'edit',
-                    data: decLogin
-                });
-            }).$promise;
+            if ($scope.readOnly) {
+                $scope.savePromise = apiService.ciphers.putPartial({ id: loginId }, {
+                    folderId: model.folderId,
+                    favorite: model.favorite
+                }, function (response) {
+                    $analytics.eventTrack('Partially Edited Login');
+                    $uibModalInstance.close({
+                        action: 'partialEdit',
+                        data: {
+                            id: loginId,
+                            favorite: model.favorite,
+                            folderId: model.folderId && model.folderId !== '' ? model.folderId : null
+                        }
+                    });
+                }).$promise;
+            }
+            else {
+                var login = cipherService.encryptLogin(model);
+                $scope.savePromise = apiService.logins.put({ id: loginId }, login, function (loginResponse) {
+                    $analytics.eventTrack('Edited Login');
+                    var decLogin = cipherService.decryptLogin(loginResponse);
+                    $uibModalInstance.close({
+                        action: 'edit',
+                        data: decLogin
+                    });
+                }).$promise;
+            }
         };
 
         $scope.generatePassword = function () {
@@ -58,6 +79,7 @@
             }
 
             apiService.logins.del({ id: $scope.login.id }, function () {
+                $analytics.eventTrack('Deleted Login From Edit');
                 $uibModalInstance.close({
                     action: 'delete',
                     data: $scope.login.id

src/app/vault/vaultLoginCollectionsController.js

@@ -0,0 +1,111 @@
+angular
+    .module('bit.vault')
+
+    .controller('vaultLoginCollectionsController', function ($scope, apiService, $uibModalInstance, cipherService,
+        loginId, $analytics) {
+        $analytics.eventTrack('vaultLoginCollectionsController', { category: 'Modal' });
+        $scope.login = {};
+        $scope.readOnly = false;
+        $scope.loadingLogin = true;
+        $scope.loadingCollections = true;
+        $scope.selectedCollections = {};
+        $scope.collections = [];
+
+        $uibModalInstance.opened.then(function () {
+            apiService.ciphers.getFullDetails({ id: loginId }).$promise.then(function (cipher) {
+                $scope.loadingLogin = false;
+
+                $scope.readOnly = !cipher.Edit;
+                if (cipher.Edit && cipher.OrganizationId) {
+                    if (cipher.Type === 1) {
+                        $scope.login = cipherService.decryptLoginPreview(cipher);
+                    }
+
+                    var collections = {};
+                    if (cipher.CollectionIds) {
+                        for (var i = 0; i < cipher.CollectionIds.length; i++) {
+                            collections[cipher.CollectionIds[i]] = true;
+                        }
+                    }
+                    $scope.selectedCollections = collections;
+
+                    return cipher;
+                }
+
+                return null;
+            }).then(function (cipher) {
+                if (!cipher) {
+                    $scope.loadingCollections = false;
+                    return;
+                }
+
+                apiService.collections.listMe(function (response) {
+                    var collections = [];
+                    for (var i = 0; i < response.Data.length; i++) {
+                        if (response.Data[i].OrganizationId !== cipher.OrganizationId) {
+                            continue;
+                        }
+
+                        var decCollection = cipherService.decryptCollection(response.Data[i]);
+                        collections.push(decCollection);
+                    }
+
+                    $scope.loadingCollections = false;
+                    $scope.collections = collections;
+                });
+            });
+        });
+
+        $scope.toggleCollectionSelectionAll = function ($event) {
+            var collections = {};
+            if ($event.target.checked) {
+                for (var i = 0; i < $scope.collections.length; i++) {
+                    collections[$scope.collections[i].id] = true;
+                }
+            }
+
+            $scope.selectedCollections = collections;
+        };
+
+        $scope.toggleCollectionSelection = function (id) {
+            if (id in $scope.selectedCollections) {
+                delete $scope.selectedCollections[id];
+            }
+            else {
+                $scope.selectedCollections[id] = true;
+            }
+        };
+
+        $scope.collectionSelected = function (collection) {
+            return collection.id in $scope.selectedCollections;
+        };
+
+        $scope.allSelected = function () {
+            return Object.keys($scope.selectedCollections).length === $scope.collections.length;
+        };
+
+        $scope.submit = function () {
+            var request = {
+                collectionIds: []
+            };
+
+            for (var id in $scope.selectedCollections) {
+                if ($scope.selectedCollections.hasOwnProperty(id)) {
+                    request.collectionIds.push(id);
+                }
+            }
+
+            $scope.submitPromise = apiService.ciphers.putCollections({ id: loginId }, request)
+                .$promise.then(function (response) {
+                    $analytics.eventTrack('Edited Login Collections');
+                    $uibModalInstance.close({
+                        action: 'collectionsEdit',
+                        collectionIds: request.collectionIds
+                    });
+                });
+        };
+
+        $scope.close = function () {
+            $uibModalInstance.dismiss('cancel');
+        };
+    });

src/app/vault/vaultShareLoginController.js

@@ -0,0 +1,137 @@
+angular
+    .module('bit.vault')
+
+    .controller('vaultShareLoginController', function ($scope, apiService, $uibModalInstance, authService, cipherService,
+        loginId, $analytics, $state) {
+        $analytics.eventTrack('vaultShareLoginController', { category: 'Modal' });
+        $scope.model = {};
+        $scope.login = {};
+        $scope.collections = [];
+        $scope.selectedCollections = {};
+        $scope.organizations = [];
+        var organizationCollectionCounts = {};
+        $scope.loadingCollections = true;
+        $scope.loading = true;
+        $scope.readOnly = false;
+
+        apiService.logins.get({ id: loginId }).$promise.then(function (login) {
+            $scope.readOnly = !login.Edit;
+            if (login.Edit) {
+                $scope.login = cipherService.decryptLogin(login);
+            }
+
+            return login.Edit;
+        }).then(function (canEdit) {
+            $scope.loading = false;
+            if (!canEdit) {
+                return;
+            }
+
+            return authService.getUserProfile();
+        }).then(function (profile) {
+            if (profile && profile.organizations) {
+                var orgs = [],
+                    setFirstOrg = false;
+
+                for (var i in profile.organizations) {
+                    if (profile.organizations.hasOwnProperty(i) && profile.organizations[i].enabled) {
+                        orgs.push({
+                            id: profile.organizations[i].id,
+                            name: profile.organizations[i].name
+                        });
+
+                        organizationCollectionCounts[profile.organizations[i].id] = 0;
+
+                        if (!setFirstOrg) {
+                            setFirstOrg = true;
+                            $scope.model.organizationId = profile.organizations[i].id;
+                        }
+                    }
+                }
+
+                $scope.organizations = orgs;
+
+                apiService.collections.listMe(function (response) {
+                    var collections = [];
+                    for (var i = 0; i < response.Data.length; i++) {
+                        var decCollection = cipherService.decryptCollection(response.Data[i]);
+                        decCollection.organizationId = response.Data[i].OrganizationId;
+                        collections.push(decCollection);
+                        organizationCollectionCounts[decCollection.organizationId]++;
+                    }
+
+                    $scope.collections = collections;
+                    $scope.loadingCollections = false;
+                });
+            }
+        });
+
+        $scope.toggleCollectionSelectionAll = function ($event) {
+            var collections = {};
+            if ($event.target.checked) {
+                for (var i = 0; i < $scope.collections.length; i++) {
+                    if ($scope.model.organizationId && $scope.collections[i].organizationId === $scope.model.organizationId) {
+                        collections[$scope.collections[i].id] = true;
+                    }
+                }
+            }
+
+            $scope.selectedCollections = collections;
+        };
+
+        $scope.toggleCollectionSelection = function (id) {
+            if (id in $scope.selectedCollections) {
+                delete $scope.selectedCollections[id];
+            }
+            else {
+                $scope.selectedCollections[id] = true;
+            }
+        };
+
+        $scope.collectionSelected = function (collection) {
+            return collection.id in $scope.selectedCollections;
+        };
+
+        $scope.allSelected = function () {
+            if (!$scope.model.organizationId) {
+                return false;
+            }
+
+            return Object.keys($scope.selectedCollections).length === organizationCollectionCounts[$scope.model.organizationId];
+        };
+
+        $scope.orgChanged = function () {
+            $scope.selectedCollections = {};
+        };
+
+        $scope.submitPromise = null;
+        $scope.submit = function (model) {
+            $scope.login.organizationId = model.organizationId;
+
+            var request = {
+                collectionIds: [],
+                cipher: cipherService.encryptLogin($scope.login)
+            };
+
+            for (var id in $scope.selectedCollections) {
+                if ($scope.selectedCollections.hasOwnProperty(id)) {
+                    request.collectionIds.push(id);
+                }
+            }
+
+            $scope.submitPromise = apiService.ciphers.putShare({ id: loginId }, request, function (response) {
+                $analytics.eventTrack('Shared Login');
+                $uibModalInstance.close(model.organizationId);
+            }).$promise;
+        };
+
+        $scope.close = function () {
+            $uibModalInstance.dismiss('cancel');
+        };
+
+        $scope.createOrg = function () {
+            $state.go('backend.user.settingsCreateOrg').then(function () {
+                $uibModalInstance.dismiss('cancel');
+            });
+        };
+    });

src/app/vault/vaultSharedController.js

@@ -0,0 +1,179 @@
+angular
+    .module('bit.vault')
+
+    .controller('vaultSharedController', function ($scope, apiService, cipherService, $analytics, $q, $localStorage,
+        $uibModal, $filter, $rootScope) {
+        $scope.logins = [];
+        $scope.collections = [];
+        $scope.loading = true;
+
+        $scope.$on('$viewContentLoaded', function () {
+            var collectionPromise = apiService.collections.listMe({}, function (collections) {
+                var decCollections = [];
+
+                for (var i = 0; i < collections.Data.length; i++) {
+                    var decCollection = cipherService.decryptCollection(collections.Data[i], null, true);
+                    decCollection.collapsed = $localStorage.collapsedCollections &&
+                        decCollection.id in $localStorage.collapsedCollections;
+                    decCollections.push(decCollection);
+                }
+
+                $scope.collections = decCollections;
+            }).$promise;
+
+            var cipherPromise = apiService.ciphers.listDetails({}, function (ciphers) {
+                var decLogins = [];
+
+                for (var i = 0; i < ciphers.Data.length; i++) {
+                    if (ciphers.Data[i].Type === 1) {
+                        var decLogin = cipherService.decryptLoginPreview(ciphers.Data[i]);
+                        decLogins.push(decLogin);
+                    }
+                }
+
+                if (decLogins.length) {
+                    $scope.collections.push({
+                        id: null,
+                        name: 'Unassigned',
+                        collapsed: $localStorage.collapsedCollections && 'unassigned' in $localStorage.collapsedCollections
+                    });
+                }
+
+                $scope.logins = decLogins;
+            }).$promise;
+
+            $q.all([collectionPromise, cipherPromise]).then(function () {
+                $scope.loading = false;
+            });
+        });
+
+        $scope.filterByCollection = function (collection) {
+            return function (cipher) {
+                if (!cipher.collectionIds || !cipher.collectionIds.length) {
+                    return collection.id === null;
+                }
+
+                return cipher.collectionIds.indexOf(collection.id) > -1;
+            };
+        };
+
+        $scope.collectionSort = function (item) {
+            if (!item.id) {
+                return '';
+            }
+
+            return item.name.toLowerCase();
+        };
+
+        $scope.collapseExpand = function (collection) {
+            if (!$localStorage.collapsedCollections) {
+                $localStorage.collapsedCollections = {};
+            }
+
+            var id = collection.id || 'unassigned';
+
+            if (id in $localStorage.collapsedCollections) {
+                delete $localStorage.collapsedCollections[id];
+            }
+            else {
+                $localStorage.collapsedCollections[id] = true;
+            }
+        };
+
+        $scope.editLogin = function (login) {
+            var editModel = $uibModal.open({
+                animation: true,
+                templateUrl: 'app/vault/views/vaultEditLogin.html',
+                controller: 'vaultEditLoginController',
+                resolve: {
+                    loginId: function () { return login.id; }
+                }
+            });
+
+            editModel.result.then(function (returnVal) {
+                var rootLogin = findRootLogin(login) || {};
+
+                if (returnVal.action === 'edit') {
+                    login.folderId = rootLogin.folderId = returnVal.data.folderId;
+                    login.name = rootLogin.name = returnVal.data.name;
+                    login.username = rootLogin.username = returnVal.data.username;
+                    login.favorite = rootLogin.favorite = returnVal.data.favorite;
+                }
+                else if (returnVal.action === 'partialEdit') {
+                    login.folderId = rootLogin.folderId = returnVal.data.folderId;
+                    login.favorite = rootLogin.favorite = returnVal.data.favorite;
+                }
+                else if (returnVal.action === 'delete') {
+                    var index = $scope.logins.indexOf(login);
+                    if (index > -1) {
+                        $scope.logins.splice(index, 1);
+                    }
+
+                    removeRootLogin(rootLogin);
+                }
+            });
+        };
+
+        $scope.editCollections = function (login) {
+            var modal = $uibModal.open({
+                animation: true,
+                templateUrl: 'app/vault/views/vaultLoginCollections.html',
+                controller: 'vaultLoginCollectionsController',
+                resolve: {
+                    loginId: function () { return login.id; }
+                }
+            });
+
+            modal.result.then(function (response) {
+                if (response.collectionIds) {
+                    login.collectionIds = response.collectionIds;
+                    // TODO: if there are no collectionIds now, it is possible that the user no longer has access to this login
+                    // which means it should be removed by calling removeRootLogin(findRootLogin(login))
+                }
+            });
+        };
+
+        $scope.removeLogin = function (login, collection) {
+            if (!confirm('Are you sure you want to remove this login (' + login.name + ') from the ' +
+                'collection (' + collection.name + ') ?')) {
+                return;
+            }
+
+            var request = {
+                collectionIds: []
+            };
+
+            for (var i = 0; i < login.collectionIds.length; i++) {
+                if (login.collectionIds[i] !== collection.id) {
+                    request.collectionIds.push(login.collectionIds[i]);
+                }
+            }
+
+            apiService.ciphers.putCollections({ id: login.id }, request).$promise.then(function (response) {
+                $analytics.eventTrack('Removed From Collection');
+                login.collectionIds = request.collectionIds;
+                // TODO: if there are no collectionIds now, it is possible that the user no longer has access to this login
+                // which means it should be removed by calling removeRootLogin(findRootLogin(login))
+            });
+        };
+
+        function findRootLogin(login) {
+            if ($rootScope.vaultLogins) {
+                var rootLogins = $filter('filter')($rootScope.vaultLogins, { id: login.id });
+                if (rootLogins && rootLogins.length) {
+                    return rootLogins[0];
+                }
+            }
+
+            return null;
+        }
+
+        function removeRootLogin(rootLogin) {
+            if (rootLogin && rootLogin.id) {
+                var index = $rootScope.vaultLogins.indexOf(rootLogin);
+                if (index > -1) {
+                    $rootScope.vaultLogins.splice(index, 1);
+                }
+            }
+        }
+    });

src/app/vault/views/vault.html

@@ -1,56 +1,177 @@
 <section class="content-header">
     <h1>
         My Vault
-        <small>{{folders.length > 0 ? folders.length - 1 : 0}} folders, {{logins.length}} logins</small>
+        <small>
+            <span ng-pluralize
+                  count="vaultFolders.length > 0 ? vaultFolders.length - 1 : 0"
+                  when="{'1': '{} folder', 'other': '{} folders'}"></span>,
+            <span ng-pluralize count="logins.length" when="{'1': '{} login', 'other': '{} logins'}"></span>
+        </small>
     </h1>
 </section>
 <section class="content">
-    <div ng-show="loadingFolders && !folders.length">
+    <div ng-show="loading && !vaultFolders.length">
         <p>Loading...</p>
     </div>
-    <div class="box" ng-repeat="folder in folders | orderBy: folderSort" ng-show="folders.length && (!main.searchVaultText || folderLogins.length)">
+    <div class="box box-primary" ng-class="{'collapsed-box': favoriteCollapsed}" style="margin-bottom: 40px;"
+         ng-show="vaultFolders.length && (!main.searchVaultText || favoriteLogins.length)">
         <div class="box-header with-border">
-            <h3 class="box-title"><i class="fa fa-folder-open"></i> {{folder.name}} <small>{{folderLogins.length}} logins</small></h3>
-            <div class="box-tools pull-right">
-                <button type="button" class="btn btn-box-tool" ng-click="addLogin(folder)" uib-tooltip="Add Login">
-                    <i class="fa fa-plus"></i>
+            <h3 class="box-title">
+                <i class="fa fa-star"></i>
+                Favorites
+                <small ng-pluralize count="favoriteLogins.length" when="{'1': '{} login', 'other': '{} logins'}"></small>
+            </h3>
+            <div class="box-tools">
+                <div class="btn-group">
+                    <button type="button" class="btn btn-box-tool dropdown-toggle" data-toggle="dropdown">
+                        <i class="fa fa-cog"></i> <span class="caret"></span>
+                    </button>
+                    <ul class="dropdown-menu dropdown-menu-right">
+                        <li>
+                            <a href="#" ng-click="addLogin(null, true)">
+                                <i class="fa fa-fw fa-plus-circle"></i> Add Login
+                            </a>
+                        </li>
+                    </ul>
+                </div>
+                <button type="button" class="btn btn-box-tool" data-widget="collapse" title="Collapse/Expand"
+                        ng-click="collapseExpand(null, true)">
+                    <i class="fa" ng-class="{'fa-minus': !favoriteCollapsed, 'fa-plus': favoriteCollapsed}"></i>
                 </button>
-                <button type="button" class="btn btn-box-tool" ng-click="deleteFolder(folder)" ng-show="canDeleteFolder(folder)" uib-tooltip="Delete">
-                    <i class="fa fa-trash"></i>
-                </button>
-                <button type="button" class="btn btn-box-tool" ng-click="editFolder(folder)" ng-show="folder.id" uib-tooltip="Edit">
-                    <i class="fa fa-pencil"></i>
-                </button>
-                <button type="button" class="btn btn-box-tool" data-widget="collapse" uib-tooltip="Collapse/Expand">
-                    <i class="fa fa-minus"></i>
+            </div>
+        </div>
+        <div class="box-body" ng-class="{'no-padding': favoriteLogins.length}">
+            <div ng-show="!favoriteLogins.length">
+                <p>No favorite logins.</p>
+                <button type="button" ng-click="addLogin(null, true)" class="btn btn-default btn-flat">Add a Login</button>
+            </div>
+            <div class="table-responsive" ng-show="favoriteLogins.length">
+                <table class="table table-striped table-hover table-vmiddle">
+                    <tbody>
+                        <tr ng-repeat="login in favoriteLogins = (logins | filter: { favorite: true } |
+                            filter: (main.searchVaultText || '')) track by login.id">
+                            <td style="width: 70px;">
+                                <div class="btn-group" data-append-to="body">
+                                    <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
+                                        <i class="fa fa-cog"></i> <span class="caret"></span>
+                                    </button>
+                                    <ul class="dropdown-menu">
+                                        <li>
+                                            <a href="javascript:void(0)" ng-click="editLogin(login)">
+                                                <i class="fa fa-fw fa-pencil"></i> Edit
+                                            </a>
+                                        </li>
+                                        <li ng-show="!login.organizationId">
+                                            <a href="javascript:void(0)" ng-click="share(login)">
+                                                <i class="fa fa-fw fa-share-alt"></i> Share
+                                            </a>
+                                        </li>
+                                        <li ng-show="login.organizationId">
+                                            <a href="javascript:void(0)" ng-click="collections(login)">
+                                                <i class="fa fa-fw fa-cubes"></i> Collections
+                                            </a>
+                                        </li>
+                                        <li>
+                                            <a href="javascript:void(0)" ng-click="deleteLogin(login)" class="text-red">
+                                                <i class="fa fa-fw fa-trash"></i> Delete
+                                            </a>
+                                        </li>
+                                    </ul>
+                                </div>
+                            </td>
+                            <td>
+                                <a href="javascript:void(0)" ng-click="editLogin(login)">{{login.name}}</a>
+                                <i class="fa fa-share-alt text-muted" title="Shared" ng-show="login.organizationId"></i>
+                                <div class="text-sm text-muted">{{login.username}}</div>
+                            </td>
+                        </tr>
+                    </tbody>
+                </table>
+            </div>
+        </div>
+    </div>
+    <div class="box" ng-class="{'collapsed-box': folder.collapsed}" ng-repeat="folder in vaultFolders track by folder.id"
+         ng-show="vaultFolders.length && (!main.searchVaultText || folderLogins.length)">
+        <div class="box-header with-border">
+            <h3 class="box-title">
+                <i class="fa" ng-class="{'fa-folder-open': folder.id !== null, 'fa-folder-open-o': folder.id === null}"></i>
+                {{folder.name}}
+                <small ng-pluralize count="folderLogins.length" when="{'1': '{} login', 'other': '{} logins'}"></small>
+            </h3>
+            <div class="box-tools">
+                <div class="btn-group">
+                    <button type="button" class="btn btn-box-tool dropdown-toggle" data-toggle="dropdown">
+                        <i class="fa fa-cog"></i> <span class="caret"></span>
+                    </button>
+                    <ul class="dropdown-menu dropdown-menu-right">
+                        <li>
+                            <a href="#" ng-click="addLogin(folder)">
+                                <i class="fa fa-fw fa-plus-circle"></i> Add Login
+                            </a>
+                        </li>
+                        <li ng-show="folder.id">
+                            <a href="#" ng-click="editFolder(folder)">
+                                <i class="fa fa-fw fa-pencil"></i> Edit Folder
+                            </a>
+                        </li>
+                        <li ng-show="canDeleteFolder(folder)">
+                            <a href="#" ng-click="deleteFolder(folder)" class="text-red">
+                                <i class="fa fa-fw fa-trash"></i> Delete Folder
+                            </a>
+                        </li>
+                    </ul>
+                </div>
+                <button type="button" class="btn btn-box-tool" data-widget="collapse" title="Collapse/Expand"
+                        ng-click="collapseExpand(folder)">
+                    <i class="fa" ng-class="{'fa-minus': !folder.collapsed, 'fa-plus': folder.collapsed}"></i>
                 </button>
             </div>
         </div>
         <div class="box-body" ng-class="{'no-padding': folderLogins.length}">
-            <div ng-show="loadingLogins && !folderLogins.length">
-                <p>Loading logins...</p>
-            </div>
-            <div ng-show="!loadingLogins && !folderLogins.length">
+            <div ng-show="!folderLogins.length">
                 <p>No logins in this folder.</p>
                 <button type="button" ng-click="addLogin(folder)" class="btn btn-default btn-flat">Add a Login</button>
             </div>
             <div class="table-responsive" ng-show="folderLogins.length">
-                <table class="table table-striped table-hover">
-                    <thead>
-                        <tr>
-                            <th style="width: 75px; min-width: 75px;"></th>
-                            <th>Name</th>
-                            <th style="width: 300px;">Username</th>
-                        </tr>
-                    </thead>
+                <table class="table table-striped table-hover table-vmiddle">
                     <tbody>
-                        <tr ng-repeat="login in folderLogins = (logins | filter: { folderId: folder.id } | filter: (main.searchVaultText || '') | orderBy: ['name', 'username'])">
-                            <td>
-                                <button type="button" ng-click="deleteLogin(login)" class="btn btn-link btn-table" uib-tooltip="Delete"><i class="fa fa-lg fa-trash"></i></button>
-                                <button type="button" ng-click="editLogin(login)" class="btn btn-link btn-table" uib-tooltip="View/Edit"><i class="fa fa-lg fa-pencil"></i></button>
+                        <tr ng-repeat="login in folderLogins = (logins | filter: { folderId: folder.id } |
+                            filter: (main.searchVaultText || '')) track by login.id">
+                            <td style="width: 70px;">
+                                <div class="btn-group" data-append-to="body">
+                                    <button type="button" class="btn btn-default dropdown-toggle" data-toggle="dropdown">
+                                        <i class="fa fa-cog"></i> <span class="caret"></span>
+                                    </button>
+                                    <ul class="dropdown-menu">
+                                        <li>
+                                            <a href="javascript:void(0)" ng-click="editLogin(login)">
+                                                <i class="fa fa-fw fa-pencil"></i> Edit
+                                            </a>
+                                        </li>
+                                        <li ng-show="!login.organizationId">
+                                            <a href="javascript:void(0)" ng-click="share(login)">
+                                                <i class="fa fa-fw fa-share-alt"></i> Share
+                                            </a>
+                                        </li>
+                                        <li ng-show="login.organizationId">
+                                            <a href="javascript:void(0)" ng-click="collections(login)">
+                                                <i class="fa fa-fw fa-cubes"></i> Collections
+                                            </a>
+                                        </li>
+                                        <li>
+                                            <a href="javascript:void(0)" ng-click="deleteLogin(login)" class="text-red">
+                                                <i class="fa fa-fw fa-trash"></i> Delete
+                                            </a>
+                                        </li>
+                                    </ul>
+                                </div>
+                            </td>
+                            <td>
+                                <a href="javascript:void(0)" ng-click="editLogin(login)">{{login.name}}</a>
+                                <i class="fa fa-star text-muted" title="Favorite" ng-show="login.favorite"></i>
+                                <i class="fa fa-share-alt text-muted" title="Shared" ng-show="login.organizationId"></i>
+                                <div class="text-sm text-muted">{{login.username}}</div>
                             </td>
-                            <td>{{login.name}} <i class="fa fa-star text-muted" uib-tooltip="Favorite" ng-show="login.favorite"></i></td>
-                            <td>{{login.username}}</td>
                         </tr>
                     </tbody>
                 </table>

src/app/vault/views/vaultAddLogin.html

@@ -17,7 +17,7 @@
                     <input type="text" id="name" name="Name" ng-model="login.name" class="form-control" required api-field />
                 </div>
             </div>
-            <div class="col-md-6">
+            <div class="col-md-6" ng-if="!hideFolders">
                 <div class="form-group" show-errors>
                     <label for="folder">Folder</label>
                     <select id="folder" name="FolderId" ng-model="login.folderId" class="form-control" api-field>
@@ -82,7 +82,7 @@
             <label for="notes">Notes</label>
             <textarea id="notes" name="Notes" class="form-control" ng-model="login.notes" api-field></textarea>
         </div>
-        <div class="checkbox">
+        <div class="checkbox" ng-if="!hideFavorite">
             <label>
                 <input type="checkbox" ng-model="login.favorite" name="Favorite" />
                 Favorite

src/app/vault/views/vaultEditLogin.html

@@ -1,6 +1,8 @@
 <div class="modal-header">
     <button type="button" class="close" ng-click="close()" aria-label="Close"><span aria-hidden="true">&times;</span></button>
-    <h4 class="modal-title" id="editLoginModelLabel"><i class="fa fa-globe"></i> Login Information <small>{{login.name}}</small></h4>
+    <h4 class="modal-title" id="editLoginModelLabel">
+        <i class="fa fa-globe"></i> Login Information <small>{{login.name}}</small>
+    </h4>
 </div>
 <form name="editLoginForm" ng-submit="editLoginForm.$valid && save(login)" api-form="savePromise">
     <div class="modal-body">
@@ -14,14 +16,17 @@
             <div class="col-md-6">
                 <div class="form-group" show-errors>
                     <label for="name">Name</label> <span>*</span>
-                    <input type="text" id="name" name="Name" ng-model="login.name" class="form-control" required api-field />
+                    <input type="text" id="name" name="Name" ng-model="login.name" class="form-control"
+                           ng-readonly="readOnly" required api-field />
                 </div>
             </div>
-            <div class="col-md-6">
+            <div class="col-md-6" ng-if="!hideFolders">
                 <div class="form-group" show-errors>
                     <label for="folder">Folder</label>
                     <select id="folder" name="FolderId" ng-model="login.folderId" class="form-control" api-field>
-                        <option ng-repeat="folder in folders | orderBy: folderSort" value="{{folder.id}}">{{folder.name}}</option>
+                        <option ng-repeat="folder in folders | orderBy: folderSort" value="{{folder.id}}">
+                            {{folder.name}}
+                        </option>
                     </select>
                 </div>
             </div>
@@ -29,14 +34,16 @@
         <div class="form-group" show-errors>
             <label for="uri">URI</label>
             <div class="input-group">
-                <input type="text" id="uri" name="Uri" ng-model="login.uri" class="form-control" placeholder="http://..." api-field />
+                <input type="text" id="uri" name="Uri" ng-model="login.uri" class="form-control" placeholder="http://..."
+                       ng-readonly="readOnly" api-field />
                 <span class="input-group-btn">
-                    <button tabindex="-1" class="btn btn-default btn-flat" type="button" uib-tooltip="Copy URI" tooltip-placement="left" ngclipboard
-                            ngclipboard-error="clipboardError(e)"
+                    <button class="btn btn-default btn-flat" type="button" uib-tooltip="Copy URI"
+                            tooltip-placement="left" ngclipboard ngclipboard-error="clipboardError(e)"
                             data-clipboard-target="#uri">
                         <i class="fa fa-clipboard"></i>
                     </button>
-                    <a href="{{login.uri}}" target="_blank" class="btn btn-default btn-flat" uib-tooltip="Go To Login" tooltip-placement="left">
+                    <a href="{{login.uri}}" target="_blank" class="btn btn-default btn-flat" uib-tooltip="Go To Login"
+                       tooltip-placement="left">
                         <i class="fa fa-share"></i>
                     </a>
                 </span>
@@ -47,9 +54,10 @@
                 <div class="form-group" show-errors>
                     <label for="username">Username</label>
                     <div class="input-group">
-                        <input type="text" id="username" name="Username" ng-model="login.username" class="form-control" api-field />
+                        <input type="text" id="username" name="Username" ng-model="login.username" class="form-control"
+                               ng-readonly="readOnly" api-field />
                         <span class="input-group-btn" uib-tooltip="Copy Username" tooltip-placement="left">
-                            <button tabindex="-1" class="btn btn-default btn-flat" type="button" ngclipboard
+                            <button class="btn btn-default btn-flat" type="button" ngclipboard
                                     ngclipboard-error="clipboardError(e)"
                                     data-clipboard-target="#username">
                                 <i class="fa fa-clipboard"></i>
@@ -61,31 +69,34 @@
             <div class="col-md-6">
                 <div class="form-group" show-errors>
                     <div class="pull-right password-options">
-                        <i class="fa fa-lg fa-refresh" uib-tooltip="Generate Password" tooltip-placement="left" ng-click="generatePassword()"></i>
-                        <i class="fa fa-lg fa-eye" uib-tooltip="Toggle Password" tooltip-placement="left" password-viewer="#password"></i>
+                        <i class="fa fa-lg fa-refresh" uib-tooltip="Generate Password" tooltip-placement="left"
+                           ng-click="generatePassword()" ng-show="!readOnly"></i>
+                        <i class="fa fa-lg fa-eye" uib-tooltip="Toggle Password" tooltip-placement="left"
+                           password-viewer="#password"></i>
                     </div>
                     <label for="password">Password</label>
                     <div class="input-group">
-                        <input type="text" id="password-text" value="{{login.password}}" style="margin-left: -9999px;" />
-                        <input type="password" id="password" name="Password" ng-model="login.password" class="form-control" api-field />
+                        <input type="password" id="password" name="Password" ng-model="login.password" class="form-control"
+                               ng-readonly="readOnly" api-field />
                         <span class="input-group-btn" uib-tooltip="Copy Password" tooltip-placement="left">
-                            <button tabindex="-1" class="btn btn-default btn-flat" type="button" ngclipboard
-                                    ngclipboard-success="clipboardSuccess(e)"
-                                    ngclipboard-error="clipboardError(e, true)"
-                                    data-clipboard-target="#password-text">
+                            <button class="btn btn-default btn-flat" type="button" ngclipboard
+                                    ngclipboard-success="clipboardSuccess(e)" ngclipboard-error="clipboardError(e, true)"
+                                    data-clipboard-text="{{login.password}}">
                                 <i class="fa fa-clipboard"></i>
                             </button>
                         </span>
                     </div>
                 </div>
-                <div style="margin: -10px 0 15px 0;" password-meter="login.password" password-meter-username="login.username" outer-class="xs"></div>
+                <div style="margin: -10px 0 15px 0;" password-meter="login.password" password-meter-username="login.username"
+                     outer-class="xs"></div>
             </div>
         </div>
         <div class="form-group" show-errors>
             <label for="notes">Notes</label>
-            <textarea id="notes" name="Notes" class="form-control" ng-model="login.notes" api-field></textarea>
+            <textarea id="notes" name="Notes" class="form-control" ng-model="login.notes"
+                      ng-readonly="readOnly" api-field></textarea>
         </div>
-        <div class="checkbox">
+        <div class="checkbox" ng-if="!hideFavorite">
             <label>
                 <input type="checkbox" ng-model="login.favorite" name="Favorite" />
                 Favorite
@@ -97,7 +108,7 @@
             <i class="fa fa-refresh fa-spin loading-icon" ng-show="editLoginForm.$loading"></i>Save
         </button>
         <button type="button" class="btn btn-default btn-flat" ng-click="close()">Close</button>
-        <button type="button" class="btn btn-link pull-right" ng-click="delete()" uib-tooltip="Delete">
+        <button type="button" class="btn btn-link pull-right" ng-click="delete()" uib-tooltip="Delete" ng-disabled="readOnly">
             <i class="fa fa-trash fa-lg"></i>
         </button>
     </div>