change plan modal and adjust seat callouts

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

@@ -29,6 +29,23 @@
             });
         };
 
+        $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,

src/app/organization/views/organizationBillingAdjustSeats.html

@@ -7,6 +7,20 @@
 </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>

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/index.html

@@ -142,6 +142,7 @@
     <script src="app/organization/organizationBillingChangePaymentController.js"></script>
     <script src="app/organization/organizationBillingAdjustSeatsController.js"></script>
     <script src="app/organization/organizationDeleteController.js"></script>
+    <script src="app/organization/organizationBillingChangePlanController.js"></script>
 
     <script src="app/settings/settingsModule.js"></script>
     <script src="app/settings/settingsController.js"></script>