Merge pull request #86 from alexnoox/fixes-app-provisionning

Fixes app provisionning

src/app/components/dashboard-company-selectbox/dashboard-company-selectbox.less

@@ -14,6 +14,10 @@ dashboard-company-selectbox {
     border-bottom: 1px solid @dashboard-cpy-select-border-color;
     z-index: 999;
 
+    @media (max-width: @screen-sm) {
+      border-radius: 0;
+    }
+
     // Change company button
     .btn.switch-company {
       color: @dashboard-cpy-select-header-text-color;

src/app/components/mnoe-api/organizations.svc.coffee

@@ -1,6 +1,6 @@
 # Service for managing the users.
 angular.module 'mnoEnterpriseAngular'
-  .service 'MnoeOrganizations', ($state, $cookies, $log, $q, MnoeApiSvc, MnoeCurrentUser, toastr) ->
+  .service 'MnoeOrganizations', ($state, $cookies, $log, $q, MnoeApiSvc, MnoeCurrentUser) ->
     _self = @
 
     organizationsApi = MnoeApiSvc.all('organizations')
@@ -89,13 +89,9 @@ angular.module 'mnoEnterpriseAngular'
     @purchaseApp = (app, orgId = _self.selectedId) ->
       MnoeApiSvc.one('organizations', orgId).all('/app_instances').post({nid: app.nid}).then(
         (response) ->
-          toastr.success(app.name + " has been successfully added.")
-
           # Change current organization if another one has been selected
-          organizationPromise = null
           _self.get(orgId)
-        (error) ->
-          toastr.error(app.name + " has not been added, please try again.")
+          response
       )
 
     # Accept an array of invites

src/app/components/theme-editor/theme-editor.html

@@ -7,7 +7,7 @@
         <button ng-click="editor.reset({published:true})" class="btn btn-default">Reset to published style</button>
         <button ng-click="editor.save({publish:true})" class="btn btn-danger">Publish</button>
       </div>
-      <div ng-show="editor.busy"><i class="fa fa-spinner fa-spin fa-2x"></i></div>
+      <div ng-show="editor.busy"><i class="fa fa-spinner fa-pulse fa-2x"></i></div>
     </div>
 
     <uib-tabset>
@@ -49,7 +49,7 @@
             <button ng-click="editor.import()" class="btn btn-danger">Import</button>
             <button ng-click="editor.export()" class="btn btn-danger">Export</button>
           </div>
-          <div ng-show="editor.busy"><i class="fa fa-spinner fa-spin fa-2x"></i></div>
+          <div ng-show="editor.busy"><i class="fa fa-spinner fa-pulse fa-2x"></i></div>
         </div>
         <div class="row top-buffer-1">
           <textarea class="form-control" ng-model="editor.output" rows="15" style="font-family: monospace"></textarea>

src/app/stylesheets/variables.less

@@ -152,7 +152,7 @@
 @dashboard-account-tabs-text-color:                  @text-strong-color;
 @dashboard-account-panel-bg-color:                   @bg-inverse-color;
 @dashboard-account-panel-text-color:                 @text-strong-color;
-@dashboard-account-inline-text-color-checked:        @bg-inverse-color;
+@dashboard-account-inline-text-color-checked:        #33d375;
 @dashboard-account-inline-text-color-unchecked:      @elem-cozy-color;
 
 /*-----------------------------------------------------------------------*/

src/app/views/apps/modals/app-deletion-modal.html

@@ -22,7 +22,7 @@ <h4 class="modal-title">{{ 'mno_enterprise.templates.dashboard.app_deletion.titl
     {{ 'mno_enterprise.templates.dashboard.app_deletion.cancel' | translate }}
   </button>
   <button type="button" class="btn btn-danger" ng-disabled="(modal.sentence != sentenceCheck) || modal.loading" ng-click="modal.deleteApp()">
-    <span ng-show="modal.loading"><i class="fa fa-spinner fa-spin"></i>&nbsp;</span>
+    <span ng-show="modal.loading"><i class="fa fa-spinner fa-pulse"></i>&nbsp;</span>
     {{ 'mno_enterprise.templates.dashboard.app_deletion.delete' | translate }}
   </button>
 </div>

src/app/views/apps/modals/app-settings-modal.html

@@ -86,8 +86,8 @@ <h4>{{ 'mno_enterprise.templates.impac.dock.settings.confirm_app_deletion' | tra
           </div>
           <div class="buttons">
             <button class="btn btn-default" ng-click="app.showDelete=false" >{{ 'mno_enterprise.templates.impac.dock.settings.cancel' | translate}}</button>
-            <button class="btn btn-danger" ng-click="deleteApp()" ng-disabled="sentence != sentenceCheck">
-              <span ng-show="modal.loading"><i class="fa fa-spinner fa-spin"></i>&nbsp;</span>
+            <button class="btn btn-danger" ng-click="deleteApp()" ng-disabled="sentence != sentenceCheck || modal.loading">
+              <span ng-show="modal.loading"><i class="fa fa-spinner fa-pulse"></i>&nbsp;</span>
               {{ 'mno_enterprise.templates.impac.dock.settings.delete' | translate }} </button>
           </div>
         </div>

src/app/views/company/settings/organization-settings.html

@@ -33,7 +33,7 @@
 
     <button ng-click="save()" href="" class="btn btn-warning" ng-disabled="!isSaveEnabled() || isLoading">
       <span ng-show="isLoading">
-        <i class="fa fa-spinner fa-spin"></i>
+        <i class="fa fa-spinner fa-pulse"></i>
       </span>
       {{ 'mno_enterprise.templates.dashboard.organization.settings.save' | translate }}
     </button>

src/app/views/marketplace/marketplace-app.controller.coffee

@@ -2,8 +2,8 @@
 #
 #============================================
 angular.module 'mnoEnterpriseAngular'
-  .controller('DashboardMarketplaceAppCtrl',
-    ($q, $scope, $stateParams, $state, $sce, $window, MnoeMarketplace, $uibModal, MnoeOrganizations, MnoeCurrentUser, MnoeAppInstances, PRICING_CONFIG) ->
+  .controller('DashboardMarketplaceAppCtrl',($q, $scope, $stateParams, $state, $sce, $window, toastr,
+    MnoeMarketplace, $uibModal, MnoeOrganizations, MnoeCurrentUser, MnoeAppInstances, PRICING_CONFIG) ->
 
       vm = this
 
@@ -17,6 +17,9 @@ angular.module 'mnoEnterpriseAngular'
       # An already installed app, conflicting with the app because it contains a common subcategory
       # that is not multi instantiable, if any
       vm.conflictingApp = null
+      # Enabling pricing
+      vm.isPriceShown = PRICING_CONFIG && PRICING_CONFIG.enabled
+
       #====================================
       # Scope Management
       #====================================
@@ -25,19 +28,15 @@ angular.module 'mnoEnterpriseAngular'
         vm.appInstance = appInstance
         vm.conflictingApp = conflictingApp
         vm.app.description = $sce.trustAsHtml(app.description)
-        vm.isLoading = false
+
         plans = vm.app.pricing_plans
         currency = (PRICING_CONFIG && PRICING_CONFIG.currency) || 'AUD'
         vm.pricing_plans = plans[currency] || plans.AUD || plans.default
 
         # Get the user role in this organization
-        MnoeCurrentUser.get().then(
-          (response) ->
-            vm.user_role = _.find(response.organizations, {id: parseInt(MnoeOrganizations.selectedId)}).current_user_role
-        )
+        MnoeOrganizations.get().then((response) -> vm.user_role = response.current_user.role)
 
-      vm.addApplication = ->
-        MnoeOrganizations.purchaseApp(vm.app, MnoeOrganizations.selectedId).then(-> $state.go('home.impac'))
+        vm.isLoading = false
 
       # Check that the testimonial is not empty
       vm.isTestimonialShown = (testimonial) ->
@@ -62,18 +61,37 @@ angular.module 'mnoEnterpriseAngular'
           else
             "INSTALLABLE"
 
-      vm.provisionLink = () ->
+      vm.provisionApp = () ->
+        vm.isLoadingButton = true
         MnoeAppInstances.clearCache()
 
         # Get the authorization status for the current organization
         if MnoeOrganizations.role.atLeastPowerUser(vm.user_role)
-          vm.addApplication()
+          purchasePromise = MnoeOrganizations.purchaseApp(vm.app, MnoeOrganizations.selectedId)
         else  # Open a modal to change the organization
-          vm.openChooseOrgaModal()
+          purchasePromise = openChooseOrgaModal().result
+
+        purchasePromise.then(
+          ->
+            $state.go('home.impac')
+            toastr.success(vm.app.name + " has been successfully added.")
+          (error) ->
+            toastr.error(vm.app.name + " has not been added, please try again.")
+            MnoErrorsHandler.processServerError(error)
+        ).finally(-> vm.isLoadingButton = false)
 
       vm.launchAppInstance = ->
         $window.open("/mnoe/launch/#{vm.appInstance.uid}", '_blank')
 
+      openChooseOrgaModal = ->
+        $uibModal.open(
+          backdrop: 'static'
+          templateUrl: 'app/views/marketplace/modals/choose-orga-modal.html'
+          controller: 'MarketplaceChooseOrgaModalCtrl'
+          resolve:
+            app: vm.app
+        )
+
       #====================================
       # App Connect modal
       #====================================
@@ -93,24 +111,9 @@ angular.module 'mnoEnterpriseAngular'
           templateUrl: modalInfo.template
           controller: modalInfo.controller
           resolve:
-            app: ->
-              vm.appInstance
-        )
-
-      #====================================
-      # Choose App Modal
-      #====================================
-      vm.openChooseOrgaModal = ->
-        $uibModal.open(
-          backdrop: 'static'
-          windowClass: 'inverse'
-          size: 'lg'
-          templateUrl: 'app/views/marketplace/modals/choose-orga-modal.html'
-          controller: 'MarketplaceChooseOrgaModalCtrl'
+            app: vm.appInstance
         )
 
-      vm.isPriceShown = PRICING_CONFIG && PRICING_CONFIG.enabled
-
       #====================================
       # Cart Management
       #====================================

src/app/views/marketplace/marketplace-app.html

@@ -43,7 +43,8 @@ <h2 class="media-heading">{{vm.app.name}}</h2>
                       {{ 'mno_enterprise.templates.dashboard.marketplace.show.conflicting_app' | translate }}
                       <a ui-sref="home.marketplace.app({appId: vm.conflictingApp.id})">{{vm.conflictingApp.name}}</a>
                     </div>
-                    <a href="" ng-switch-when="INSTALLABLE" ng-click="vm.provisionLink()" class="btn btn-warning btn-promo">
+                    <a href="" ng-switch-when="INSTALLABLE" ng-click="vm.provisionApp()" ng-disabled="vm.isLoadingButton" class="btn btn-warning btn-promo">
+                      <span ng-show="vm.isLoadingButton"><i class="fa fa-spinner fa-pulse"></i>&nbsp;</span>
                       {{ 'mno_enterprise.templates.dashboard.marketplace.show.start_app' | translate }}
                     </a>
                     <a href="" ng-switch-when="INSTALLED_LAUNCH" ng-click="vm.launchAppInstance()" class="btn btn-warning btn-promo btn-lg">

src/app/views/marketplace/modals/choose-orga-modal.coffee

@@ -1,33 +1,26 @@
 angular.module 'mnoEnterpriseAngular'
-.controller('MarketplaceChooseOrgaModalCtrl', ($scope, $uibModalInstance, MnoeOrganizations, MnoeCurrentUser) ->
+.controller('MarketplaceChooseOrgaModalCtrl', ($scope, $uibModalInstance, MnoeOrganizations, MnoeCurrentUser, app) ->
+
+  #====================================
+  # Pre-Initialization
+  #====================================
 
   # Initialize the main variables
   $scope.organizations = {}
   $scope.current_organization = {}
   $scope.authorized_organizations = {}  # The organizations where the user can add apps
   $scope.hasAuthorizedOrganizations = false
   $scope.isLoading = true
+  $scope.app = app
 
   # Get the current organization id
   $scope.current_organization = {
     id: MnoeOrganizations.selectedId
   }
 
-  #  Get the list of all the user organizations
-  MnoeCurrentUser.get().then(
-    (response) ->  # Hash of organizations id -> {organization obj}
-      $scope.filterAuthorizedOrga(response.organizations)
-      $scope.hasAuthorizedOrganizations = !_.isEmpty($scope.authorized_organizations)
-      $scope.isLoading = false
-  )
-
-  # Filter the authorized organizations for this user
-  $scope.filterAuthorizedOrga = (organizations) ->
-    organizations.map(
-      (org) ->
-        $scope.organizations[org.id] = org
-        $scope.authorized_organizations[org.id] = org if MnoeOrganizations.role.atLeastPowerUser(org.current_user_role)
-    )
+  #====================================
+  # Scope Management
+  #====================================
 
   # Check if the user is allowed to add apps to the given organization
   $scope.isUserAuthorized = (orgId) ->
@@ -40,11 +33,38 @@ angular.module 'mnoEnterpriseAngular'
 
   # Add a new app instance to the current user organization
   $scope.addApplication = ->
-    MnoeOrganizations.purchaseApp($scope.app, $scope.current_organization.id).then(-> $state.go('home.impac'))
+    $scope.isLoading = true
+    MnoeOrganizations.purchaseApp($scope.app, $scope.current_organization.id).then(
+      (response) ->
+        $uibModalInstance.close(response)
+    ).finally(-> $scope.isLoading = false)
 
   # Close the current modal
   $scope.closeChooseOrgaModal = ->
-    $uibModalInstance.close()
+    $uibModalInstance.dismiss()
+
+  #====================================
+  # Private methods
+  #====================================
+
+  # Filter the authorized organizations for this user
+  filterAuthorizedOrga = (organizations) ->
+    _.forEach(organizations, (org) ->
+      $scope.organizations[org.id] = org
+      $scope.authorized_organizations[org.id] = org if MnoeOrganizations.role.atLeastPowerUser(org.current_user_role)
+    )
+
+  #====================================
+  # Post-Initialization
+  #====================================
+
+  # Get the list of all the user organizations
+  MnoeCurrentUser.get().then(
+    (response) ->  # Hash of organizations id -> {organization obj}
+      filterAuthorizedOrga(response.organizations)
+      $scope.hasAuthorizedOrganizations = !_.isEmpty($scope.authorized_organizations)
+      $scope.isLoading = false
+  )
 
   return
 )

src/app/views/marketplace/modals/choose-orga-modal.html

@@ -2,54 +2,48 @@
 <!-- Modal Header -->
 <div class="modal-header">
   <div class="close" type="button" ng-click="closeChooseOrgaModal()" >×</div>
+  <h3 ng-if="hasAuthorizedOrganizations">{{'mno_enterprise.templates.dashboard.marketplace.app_selection.select_orga' | translate}}</h3>
+  <h3 ng-if="!hasAuthorizedOrganizations">{{'mno_enterprise.templates.dashboard.marketplace.app_selection.no_orga_authorized' | translate}}</h3>
 </div>
+
 <!-- Modal Body -->
 <div class="modal-body">
-
   <div class="row" ng-hide="isLoading" >
     <div class="main-area">
       <div ng-if="!hasAuthorizedOrganizations">
         <div class="text-center">
-          <h3>{{ 'mno_enterprise.templates.dashboard.marketplace.app_selection.no_orga_authorized' | translate }}</h3>
-          <p>{{ 'mno_enterprise.templates.dashboard.marketplace.app_selection.unauthorized_to_add_app' | translate }}</p>
+          <p>{{'mno_enterprise.templates.dashboard.marketplace.app_selection.unauthorized_to_add_app' | translate}}</p>
         </div>
       </div>
       <div ng-if="hasAuthorizedOrganizations">
         <div class="col-md-12">
-          <div class="text-center">
-            <h3>{{ 'mno_enterprise.templates.dashboard.marketplace.app_selection.select_orga' | translate }}</h3>
-          </div>
+          <p class="text-center" ng-hide="current_organization.isUserAuthorized">
+            {{ 'mno_enterprise.templates.dashboard.marketplace.app_selection.unauthorized_to_add_app' | translate }}
+          </p>
         </div>
-
         <div class="col-md-12">
           <form name="selectOrgaForm" novalidate class="form form-horizontal align-center">
             <div class="col-md-6 col-md-offset-3">
               <div class="form-group">
-                <select
-                  ng-model="current_organization.id"
-                  ng-click="updateUserAuthorization()"
+                <select ng-model="current_organization.id"
+                  ng-change="updateUserAuthorization()"
                   ng-options="org.id as org.name for (key, org) in authorized_organizations track by org.id"
                   class="form-control" style="min-width:176px;"></select>
               </div>
             </div>
-
           </form>
         </div>
-
-        <div class="col-md-12">
-          <p class="text-center" ng-hide="current_organization.isUserAuthorized">
-            {{ 'mno_enterprise.templates.dashboard.marketplace.app_selection.unauthorized_to_add_app' | translate }}
-          </p>
-        </div>
       </div>
     </div>
   </div>
 </div>
+
 <!-- Modal Footer -->
 <div class="modal-footer">
   <div class="row">
     <div class="col-md-12">
-      <button ng-if="hasAuthorizedOrganizations" ng-click="addApplication()" class="btn btn-warning arrow" ng-disabled="!current_organization.isUserAuthorized">
+      <button ng-if="hasAuthorizedOrganizations" ng-click="addApplication()" class="btn btn-warning arrow" ng-disabled="!current_organization.isUserAuthorized || isLoading">
+        <span ng-show="isLoading"><i class="fa fa-spinner fa-pulse"></i>&nbsp;</span>
         {{ 'mno_enterprise.templates.dashboard.marketplace.app_selection.next' | translate}}
       </button>
       <button ng-click="closeChooseOrgaModal()" class="btn btn-default">

src/locales/en.locale.json

@@ -429,7 +429,7 @@
   "mno_enterprise.templates.dashboard.marketplace.app_selection.cancel": "Cancel",
   "mno_enterprise.templates.dashboard.marketplace.app_selection.select_orga": "Select an organization",
   "mno_enterprise.templates.dashboard.marketplace.app_selection.no_orga_authorized": "Invalid purchase",
-  "mno_enterprise.templates.dashboard.marketplace.app_selection.unauthorized_to_add_app": "Unfortunately you do not have permission to purchase products for this organization.",
+  "mno_enterprise.templates.dashboard.marketplace.app_selection.unauthorized_to_add_app": "Unfortunately you do not have permission to purchase products for this organization. Please select another organization.",
   "mno_enterprise.templates.dashboard.organization.arrears.title": "Sorry we couldn't process this payment",
   "mno_enterprise.templates.dashboard.organization.arrears.explanation": "Your account is currently in arrears as we were unable to charge your designated credit card.",
   "mno_enterprise.templates.dashboard.organization.arrears.recommendation": "Please make sure your credit card details are up to date, then click the button below.",