api.service.js

export default class ApiService {

  /*@ngInject*/

  constructor() {
    this.protocol = 'https://';

    /* dev api config */
    this.izBilling = this.protocol + '101cloudlicenses.azurewebsites.net';
    this.izInvoices = this.protocol + '101cloudbilling.azurewebsites.net';
    this.izTenantApi = this.protocol + '101cloudtenants.azurewebsites.net';
    this.izTemplateApi = this.protocol + '101cloudtemplates.azurewebsites.net';
    this.izClouds = this.protocol + '101cloudclouds.azurewebsites.net';

    /* prod api config */
    // this.izInvoices = 'https://portalbillings.azurewebsites.net';
    // this.izTenantApi = 'https://portaltenants.azurewebsites.net';
    // this.izClouds = 'https://portalclouds.azurewebsites.net';
    // this.izBilling =  'https://portallicenses.azurewebsites.net';
    // this.izTemplateApi = 'https://portaltemplates.azurewebsites.net';

    this.basePaths = {
      json: './app/assets/json/',
      icons: './app/assets/img/icons',
      tenantApi: 'https://microsoft-apiappa18d48147c544590807271e4a1ef3dd7.azurewebsites.net/101Cloud',
      api: this.izClouds + '/101Cloud',
      fullDataCenterEndPoint: this.izTenantApi + '/101cloud/FullFabrics',
      tenants: this.izTenantApi + '/101Cloud/Tenants',
      products: this.izBilling + '/101Cloud/Products',
      orders: this.izBilling + '/101Cloud/Order',
      makeOrder: this.izBilling + '/101Cloud/Order',
      location: this.protocol + 'dev.virtualearth.net/REST/v1/Locations',
      licenses: this.izBilling + '/101Cloud/Licenses',
      fullDatacenters: this.izTenantApi + '/101Cloud/FullFabrics',
      cloudDatacenters: this.izTenantApi + '/101Cloud/CloudDataCenters',
      hardwareTemplates: this.izTemplateApi + '/101Cloud/HardwareTemplate?tenantId=',
      billingInvoices: this.izInvoices + '/101Cloud/Invoices',
      priceFilters: this.izInvoices + '/101Cloud/PriceFilter',
      priceSettings: this.izInvoices + '/101Cloud/RateCard',
      servers: this.izTenantApi + '/101Cloud/Servers',
      actions: this.izTenantApi + '/101Cloud/Activities/Tenant',
      users: this.izTenantApi + '/101Cloud/AzureUsers',
      groups: this.izTenantApi + '/101Cloud/AzureGroups',
      invite: this.izTenantApi + '/101Cloud/Invite'
    };
    this.countryListEndPoint = this.izTenantApi + '/101Cloud/Countries';
    this.regionListEndPoint = this.izTenantApi + '/101Cloud/Regions';
    this.FullCloud = this.basePaths.api + '/FullClouds';
    this.serverIconsPath = this.basePaths.icons + '/servers/';
    this.Clouds = this.basePaths.api + '/Clouds';
    this.subnetRoles = this.basePaths.api + '/SubnetRoles';
    this.companyInfo = this.izTenantApi + '/101Cloud/Company/';
    this.tenantAccountRoles = this.izTenantApi + '/101Cloud/TenantAccountRoles/';
    this.singeSubscriptionItem = this.izTenantApi + '/101Cloud/AzureSubscriptions/';
    this.subscriptions = this.izTenantApi + '/101Cloud/Subscriptions/';
    this.spla = this.izBilling + '/101Cloud/Products';
  }
}

dataservice.js

class DataService {

  /*@ngInject*/

  constructor($http, apiService, loaderService) {
    this.$http = $http;
    this.apiService = apiService;
    this.loaderService = loaderService;
  }

  getItems($url, jsonUrl) {
    const apiUrl = jsonUrl || this.apiService.basePaths.json;
    return this.$http
      .get(apiUrl + $url)
      .then(result => result.data, error => {
        console.error(':::: ERROR IN DATASERVICE GETITEMS ::::', error);
        throw error;
      });
  }

  get($path, $params) {
    this.loaderService.setLoad(true, $path, $params);
    return this.$http
      .get($path, $params)
      .then(result => {
          this.loaderService.setLoad(false, $path, $params);
          return result.data;
        },
        error => {
          this.loaderService.setLoad(false, $path, $params);
          console.error(':::: ERROR IN DATASERVICE GET ::::', error);
          throw error;
        });
  }

  post($path, data, $params) {
    this.loaderService.setLoad(true, $path, data, $params);
    console.log('something');
    return this.$http
      .post($path, data, $params)
      .then(result => {
        this.loaderService.setLoad(false, $path, data, $params);
        return result.data;
      }, error => {
        this.loaderService.setLoad(false, $path, data, $params);
        console.error(':::: ERROR IN DATASERVICE POST ::::', error);
        throw error;
      });
  }

  put($path, data, $params) {
    this.loaderService.setLoad(true, $path, data, $params);
    return this.$http
      .put($path, data, $params)
      .then(result => {
        this.loaderService.setLoad(false, $path, data, $params);
        return result.data;
      }, error => {
        this.loaderService.setLoad(false, $path, data, $params);
        console.error(':::: ERROR IN DATASERVICE PUT ::::', error);
        throw error;
      });
  }

  CallBingRestService(request) {
    return this.$http
      .jsonp(request, {jsonpCallbackParam: 'jsonp'})
      .then(
        response => response.data,
        error => console.error(error)
      );
  }
}

export default DataService;

loader-service.js

class LoaderService {
  constructor() {
    this.isLoading = {
      value: false
    };
    this.sessions = [];
  }

  setLoad(value, ...sessionKey) {

    const currentSession = _.map(sessionKey, sessionObj => {
      let sessionStringValue;
      if (typeof sessionObj === 'object') {
        sessionStringValue = JSON.stringify(sessionObj);
      } else {
        sessionStringValue = sessionObj;
      }
      return sessionStringValue;
    }).join(';');

    const $body = $('body');
    if (value) {
      this.sessions.push(currentSession);
      this.isLoading.value = true;
      $body.css({'overflow': 'hidden'});
    } else {
      const sessionIndex = _.findIndex(this.sessions, session => session === session);
      this.sessions.splice(sessionIndex, 1);
      if (this.sessions.length === 0) {
        $body.css({'overflow': 'scroll'});
        this.isLoading.value = false;
      }
    }
  }
}

export default LoaderService;

loader.component.js

import controller from './loader.controller';
import template from './loader.tpl.html';

const LoaderComponent = {
  controller,
  template
};

export default LoaderComponent;

loader.tpl.html

<div ng-if="$ctrl.isLoading.value" class="iz-preloader iz-preloader-wrapper">
  <div class="iz-preloader-loader">
    <span class="sr-only">Loading...</span>
  </div>
</div>