environment settings

src/_locales/en/messages.json

@@ -705,5 +705,29 @@
   },
   "emailDesc": {
     "message": "Verification codes will be emailed to you."
+  },
+  "selfHostedEnvironment": {
+    "message": "Self-hosted Environment"
+  },
+  "selfHostedEnvironmentFooter": {
+    "message": "Specify the base URL of your on-premise hosted bitwarden installation."
+  },
+  "customEnvironment": {
+    "message": "Custom Environment"
+  },
+  "customEnvironmentFooter": {
+    "message": "For advanced users. You can specify the base URL of each service independently."
+  },
+  "baseUrl": {
+    "message": "Server URL"
+  },
+  "apiUrl": {
+    "message": "API Server URL"
+  },
+  "identityUrl": {
+    "message": "Identity Server URL"
+  },
+  "environmentSaved": {
+    "message": "The environment URLs have been saved."
   }
 }

src/background.js

@@ -6,7 +6,7 @@ var bg_utilsService = new UtilsService();
 var bg_cryptoService = new CryptoService(bg_constantsService);
 var bg_tokenService = new TokenService();
 var bg_appIdService = new AppIdService();
-var bg_apiService = new ApiService(bg_tokenService, bg_appIdService, bg_utilsService, logout);
+var bg_apiService = new ApiService(bg_tokenService, bg_appIdService, bg_utilsService, bg_constantsService, logout);
 var bg_userService = new UserService(bg_tokenService, bg_apiService, bg_cryptoService);
 var bg_settingsService = new SettingsService(bg_userService);
 var bg_loginService = new LoginService(bg_cryptoService, bg_userService, bg_apiService, bg_settingsService);

src/popup/app/config.js

@@ -227,6 +227,13 @@
                 data: { authorize: true },
                 params: { animation: null }
             })
+            .state('environment', {
+                url: '/environment',
+                templateUrl: 'app/settings/views/settingsEnvironment.html',
+                controller: 'settingsEnvironmentController',
+                data: { authorize: false },
+                params: { animation: null }
+            })
             .state('lock', {
                 url: '/lock',
                 templateUrl: 'app/lock/views/lock.html',

src/popup/app/global/home.html

@@ -1,6 +1,8 @@
-<div class="content">
+<div class="home-page">
-    <div class="home-page">
+    <a ui-sref="environment({animation: 'in-slide-up'})" class="settings-icon">
-        <img src="../../../../images/logo@3x.png" alt="bitwarden" />
+        <i class="fa fa-cog fa-lg"></i><span> Settings</span>
+    </a>
+    <img src="../../../../images/logo@2x.png" alt="bitwarden" />
     <p>{{i18n.loginOrCreateNewAccount}}</p>
     <div class="bottom-buttons">
         <a class="btn btn-lg btn-primary btn-block" ui-sref="register({animation: 'in-slide-up'})"
@@ -13,4 +15,3 @@
         </a>
     </div>
 </div>
-</div>

src/popup/app/settings/settingsEnvironmentController.js

@@ -0,0 +1,51 @@
+angular
+    .module('bit.settings')
+
+    .controller('settingsEnvironmentController', function ($scope, i18nService, $analytics, constantsService, utilsService,
+        $window, apiService, toastr) {
+        $scope.i18n = i18nService;
+
+        utilsService.initListSectionItemListeners($(document), angular);
+
+        $scope.baseUrl = $window.localStorage.getItem(constantsService.baseUrlKey) || '';
+        $scope.apiUrl = $window.localStorage.getItem(constantsService.apiUrlKey) || '';
+        $scope.identityUrl = $window.localStorage.getItem(constantsService.identityUrlKey) || '';
+
+        $scope.save = function () {
+            if ($scope.baseUrl && $scope.baseUrl !== '') {
+                $scope.baseUrl = formatUrl($scope.baseUrl);
+                $window.localStorage.setItem(constantsService.baseUrlKey, $scope.baseUrl);
+            }
+            else {
+                $window.localStorage.removeItem(constantsService.baseUrlKey);
+            }
+
+            if ($scope.apiUrl && $scope.apiUrl !== '') {
+                $scope.apiUrl = formatUrl($scope.apiUrl);
+                $window.localStorage.setItem(constantsService.apiUrlKey, $scope.apiUrl);
+            }
+            else {
+                $window.localStorage.removeItem(constantsService.apiUrlKey);
+            }
+
+            if ($scope.identityUrl && $scope.identityUrl !== '') {
+                $scope.identityUrl = formatUrl($scope.identityUrl);
+                $window.localStorage.setItem(constantsService.identityUrlKey, $scope.identityUrl);
+            }
+            else {
+                $window.localStorage.removeItem(constantsService.identityUrlKey);
+            }
+
+            apiService.setUrls();
+            $analytics.eventTrack('Set Environment URLs');
+            toastr.success(i18nService.environmentSaved);
+        };
+
+        function formatUrl(url) {
+            url = url.replace(/\/+$/g, '');
+            if (!url.startsWith("http://") && !url.startsWith('https://')) {
+                url = 'https://' + url;
+            }
+            return url;
+        }
+    });

src/popup/app/settings/views/settingsEnvironment.html

@@ -0,0 +1,48 @@
+<form name="theForm" ng-submit="save()">
+    <div class="header">
+        <div class="left">
+            <a ui-sref="home({animation: 'out-slide-down'})">{{i18n.close}}</a>
+        </div>
+        <div class="right">
+            <button type="submit" class="btn btn-link">{{i18n.save}}</button>
+        </div>
+        <div class="title">{{i18n.settings}}</div>
+    </div>
+    <div class="content">
+        <div class="list">
+            <div class="list-section">
+                <div class="list-section-header">
+                    {{i18n.selfHostedEnvironment}}
+                </div>
+                <div class="list-section-items">
+                    <div class="list-section-item">
+                        <label for="baseUrl" class="item-label">{{i18n.baseUrl}}</label>
+                        <input id="baseUrl" type="text" name="BaseUrl" ng-model="baseUrl"
+                               placeholder="ex. https://bitwarden.company.com">
+                    </div>
+                </div>
+                <div class="list-section-footer">
+                    {{i18n.selfHostedEnvironmentFooter}}
+                </div>
+            </div>
+            <div class="list-section">
+                <div class="list-section-header">
+                    {{i18n.customEnvironment}}
+                </div>
+                <div class="list-section-items">
+                    <div class="list-section-item">
+                        <label for="apiUrl" class="item-label">{{i18n.apiUrl}}</label>
+                        <input id="apiUrl" type="text" name="ApiUrl" ng-model="apiUrl">
+                    </div>
+                    <div class="list-section-item">
+                        <label for="identityUrl" class="item-label">{{i18n.identityUrl}}</label>
+                        <input id="identityUrl" type="text" name="IdentityUrl" ng-model="identityUrl">
+                    </div>
+                </div>
+                <div class="list-section-footer">
+                    {{i18n.customEnvironmentFooter}}
+                </div>
+            </div>
+        </div>
+    </div>
+</form>

src/popup/index.html

@@ -85,6 +85,7 @@
     <script src="app/settings/settingsAddFolderController.js"></script>
     <script src="app/settings/settingsEditFolderController.js"></script>
     <script src="app/settings/settingsPremiumController.js"></script>
+    <script src="app/settings/settingsEnvironmentController.js"></script>
 
     <script src="app/tools/toolsModule.js"></script>
     <script src="app/tools/toolsController.js"></script>

src/popup/less/components.less

@@ -375,6 +375,7 @@
             border: none;
             width: 100%;
             background-color: transparent;
+            .placeholder-color(#bbbbbb);
 
             &:focus {
                 outline: none;

src/popup/less/pages.less

@@ -17,13 +17,13 @@
 
     img {
         margin: 0 auto 20px;
-        width: 220px;
+        width: 270px;
         display: block;
     }
 }
 
 .home-page {
-    padding: 100px 20px 20px;
+    padding: 150px 20px 20px;
     text-align: center;
     position: relative;
     height: 100%;
@@ -37,6 +37,26 @@
     p {
         font-size: 18px;
     }
+
+    a.settings-icon {
+        color: #bbbbbb;
+        position: absolute;
+        top: 10px;
+        left: 10px;
+
+        span {
+            visibility: hidden;
+        }
+
+        &:hover {
+            color: @link-hover-color;
+            text-decoration: none;
+
+            span {
+                visibility: visible;
+            }
+        }
+    }
 }
 
 .splash-page {

src/services/apiService.js

@@ -1,4 +1,32 @@
-function ApiService(tokenService, appIdService, utilsService, logoutCallback) {
+function ApiService(tokenService, appIdService, utilsService, constantsService, logoutCallback) {
+    this.tokenService = tokenService;
+    this.logoutCallback = logoutCallback;
+    this.appIdService = appIdService;
+    this.utilsService = utilsService;
+    this.constantsService = constantsService;
+
+    initApiService();
+    this.setUrls();
+}
+
+function initApiService() {
+    ApiService.prototype.setUrls = function () {
+        var storedBaseUrl = window.localStorage.getItem(this.constantsService.baseUrlKey);
+
+        if (storedBaseUrl) {
+            this.baseUrl = storedBaseUrl + '/api';
+            this.identityBaseUrl = storedBaseUrl + '/identity';
+            return;
+        }
+
+        var storedApiUrl = window.localStorage.getItem(this.constantsService.apiUrlKey);
+        var storedIdentityUrl = window.localStorage.getItem(this.constantsService.identityUrlKey);
+        if (storedApiUrl && storedIdentityUrl) {
+            this.baseUrl = storedApiUrl;
+            this.identityBaseUrl = storedIdentityUrl;
+            return;
+        }
+
         // Desktop
         //this.baseUrl = 'http://localhost:4000';
         //this.identityBaseUrl = 'http://localhost:33656';
@@ -18,16 +46,8 @@ function ApiService(tokenService, appIdService, utilsService, logoutCallback) {
         // Production
         this.baseUrl = 'https://api.bitwarden.com';
         this.identityBaseUrl = 'https://identity.bitwarden.com';
+    };
 
-    this.tokenService = tokenService;
-    this.logoutCallback = logoutCallback;
-    this.appIdService = appIdService;
-    this.utilsService = utilsService;
-
-    initApiService();
-}
-
-function initApiService() {
     // Auth APIs
 
     ApiService.prototype.postIdentityToken = function (tokenRequest, success, successWithTwoFactor, error) {

src/services/constantsService.js

@@ -1,5 +1,8 @@
 function ConstantsService(i18nService) {
     return {
+        baseUrlKey: 'baseUrl',
+        apiUrlKey: 'apiUrl',
+        identityUrlKey: 'identityUrl',
         disableGaKey: 'disableGa',
         disableAddLoginNotificationKey: 'disableAddLoginNotification',
         disableContextMenuItemKey: 'disableContextMenuItem',