analytics/webcontent/bi/js/glass/views/LoginView.js

/**
 * Licensed Materials - Property of IBM
 * IBM Cognos Products: BI Glass
 * (C) Copyright IBM Corp. 2015, 2021
 * US Government Users Restricted Rights - Use, duplication or disclosure restricted by GSA ADP Schedule Contract with IBM Corp.
 */
// jshint maxparams:12
define(['baglass/app/ContentView', 'jquery', 'doT', 'underscore', 'toastr', 'baglass/nls/StringResources', 'text!./templates/LoginView.html', 'baglass/core-client/js/core-client/utils/Utils', 'baglass/utils/ThemeUtils', 'baglass/utils/Utils', '../ajax/CASimpleAuthentication', '../loading-indicator/src/js/LoadingIndicatorView', 'caglass/icons/ba-login-icon-bundle'], function (ContentView, $, dot, _, toastr, StringResources, template, Utils, ThemeUtils, GlassUtils, CAAuthentication, LoadingIndicatorView) {
  /**
   * This Class is a utility class to provide RESTFul api for glass
   */
  var LoginView = ContentView.extend({
    anonymousAllowed: false,
    _options: function _options() {
      var currentYear = new Date().getFullYear();
      return {
        buttonText: StringResources.get('signInButtonText'),
        anonymousText: StringResources.get('connectAnonymously'),
        anonymousAllowed: this.anonymousAllowed,
        backgroundImage: 'images/login_background.jpg',
        loginPromptBackground: 'images/loginPrompt_background.jpg',
        brandingText: '',
        loginLegalText: StringResources.get('loginLegalText', {
          'fullYear': currentYear
        })
      };
    },

    /**
     * constructor
     * @options {object}
     */
    init: function init(options, appView) {
      LoginView.inherited('init', this, arguments);
      this.appView = appView;
      $.extend(this, options);
      this.canLogin = true;
    },
    remove: function remove() {
      this.$el.find('.signInBtn').off('primaryaction');
      this.$el.find('.userPromptInput').off('keyup');
    },
    _tryDirectLogin: function _tryDirectLogin() {
      return new Promise(function (resolve, reject) {
        if (GlassUtils.isUiPreview()) {
          reject(this._generatePreviewPromptInfo());
        } else {
          resolve(this._trySubmitCredentials());
        }
      }.bind(this));
    },
    _generatePreviewPromptInfo: function _generatePreviewPromptInfo() {
      return {
        displayObjects: [{
          'name': 'CAMUsername',
          'caption': StringResources.get('userPlaceholder') + ':',
          'type': 'text'
        }, {
          'name': 'CAMPassword',
          'caption': StringResources.get('passPlaceholder') + ':',
          'type': 'textnoecho'
        }]
      };
    },
    _trySubmitCredentials: function _trySubmitCredentials(loginPrompts) {
      if (!loginPrompts) {
        loginPrompts = {
          parameters: [{
            name: 'h_CAM_action',
            value: 'logonAs'
          }]
        };
        var queryString = '';

        if (this.origin) {
          queryString = this.origin.queryString;
        }

        loginPrompts.parameters = GlassUtils.getFilteredLoginParameters(this.glassContext, queryString, loginPrompts.parameters);
      }

      return this._getCAAuthentication().submitCredentials(this.glassContext, loginPrompts, this.origin);
    },
    render: function render() {
      if (this.appView && this.appView.content && this.appView.content.origin && this.appView.content.origin.authError && this.appView.content.origin.authError.displayObjects) {
        return this._renderPrompt(this.appView.content.origin.authError.displayObjects, this.appView.content.origin.authError);
      } else {
        return this._tryDirectLogin().then(function (response) {
          var authInfo = response.data;
          $(Utils.getCurrentWindow()).trigger('ca.loginSuccessful', authInfo);
        })["catch"](function (error) {
          return this._renderPrompt(error.displayObjects, error);
        }.bind(this));
      }
    },
    _renderPrompt: function _renderPrompt(displayObjects, error) {
      return ThemeUtils.getCurrentThemeValues(this.glassContext).then(function (response) {
        this._clearToasts();

        this.hiddenLoginPrompts = {
          'parameters': []
        };
        this.anonymousAllowed = this.glassContext.authInfo && this.glassContext.authInfo.isAnonymous === true;

        var renderOptions = this._options();

        renderOptions.brandingText = _.escape(response['brandText']);
        this._brandingText = renderOptions.brandingText;
        var html = dot.template(template || '')(renderOptions);
        this.$el.append(html);
        this._$signInBtn = this.$el.find('button');
        this._$anonymousSession = this.$el.find('.anonymous');

        if (this._$anonymousSession[0] !== undefined) {
          this._$anonymousSession.on('primaryaction', function () {
            $(Utils.getCurrentWindow()).trigger('ca.loginSuccessful', {
              stayAnonymous: true
            });
          }.bind(this));
        }

        this._$signInBtn.on('primaryaction', $.proxy(this.onClick, this));

        this._saveHiddenLoginPrompts(displayObjects);

        this._updatePage(displayObjects);

        Utils.closeDialog();

        if (error.message) {
          this._showError(error.message);
        }

        return Promise.resolve(this);
      }.bind(this));
    },
    _saveHiddenLoginPrompts: function _saveHiddenLoginPrompts(displayObjectsArray) {
      _.each(displayObjectsArray, function (prompt) {
        if (prompt.type === 'hidden') {
          this._addToHiddenLoginPrompts(prompt);
        }
      }.bind(this));
    },
    _addToHiddenLoginPrompts: function _addToHiddenLoginPrompts(prompt) {
      var addPrompt = true;

      for (var i = 0; i < this.hiddenLoginPrompts.parameters.length; i++) {
        if (this.hiddenLoginPrompts.parameters[i].name === prompt.name) {
          this.hiddenLoginPrompts.parameters[i].value = prompt.value;
          addPrompt = false;
        }
      }

      if (addPrompt) {
        var hiddenPrompt = {
          'name': prompt.name,
          'value': prompt.value
        };
        this.hiddenLoginPrompts.parameters.push(hiddenPrompt);
      }
    },
    _createAppropriateCAMPrompt: function _createAppropriateCAMPrompt(prompt, $parent) {
      switch (prompt.type) {
        case 'text':
        case 'textnoecho':
        case 'verifytextnoecho':
          this._addTextInputField(prompt, $parent);

          break;

        case 'singleselect':
          this._addSelectInputField(prompt, $parent);

          break;

        case 'display':
          this._addLabel(prompt, $parent);

          break;
      }
    },
    _updatePage: function _updatePage(displayObjectsArray) {
      if (_.isEmpty(displayObjectsArray)) {
        this.canLogin = false;
      }

      var $parent = this.$el.find('.formContent');
      $parent.find('.camPrompts').empty();

      _.each(displayObjectsArray, function (prompt) {
        if (prompt.type !== 'hidden') {
          this._createAppropriateCAMPrompt(prompt, $parent);
        }
      }.bind(this));

      this._updateButton($parent);
    },
    _doNewPasswordEntriesMatch: function _doNewPasswordEntriesMatch() {
      var inputFields = this.$el.find('.newPasswordInput');

      if (inputFields.length < 1) {
        return true;
      } else {
        var value = $(inputFields[0]).val();

        for (var i = 1; i < inputFields.length; i++) {
          if ($(inputFields[i]).val() !== value) {
            return false;
          }
        }

        return true;
      }
    },
    _showProgress: function _showProgress(message) {
      var loading = new LoadingIndicatorView();
      var container = this.$el.find('.incorrectLoginText');
      var size = '40px';
      return loading.render({
        css: {
          height: size,
          width: size
        }
      }).then(function ($el) {
        container.removeAttr('role').html($el[0]);

        if (message) {
          Utils.activateAriaAlert(message);
        }
      });
    },
    _showError: function _showError(message) {
      this.$el.find('.incorrectLoginText').text(message);
      this.$el.find('.incorrectLoginText').attr('role', 'alert');
    },
    _getCAAuthentication: function _getCAAuthentication() {
      return new CAAuthentication();
    },

    /*
     * event handler
     */
    onClick: function onClick(evt, selectNamespace) {
      if (this._doNewPasswordEntriesMatch()) {
        if (selectNamespace) {
          this._showProgress();
        } else {
          this._showProgress(StringResources.get('loginInProgress'));
        }

        var shouldAddCAMNamespace = true;
        var loginPrompts = {
          'parameters': []
        };
        loginPrompts.parameters = this.hiddenLoginPrompts.parameters.slice();
        var inputFields = this.$el.find('.userPromptInput');

        _.each(inputFields, function (inputField
        /*, key */
        ) {
          var $inputField = $(inputField);
          var prompt;

          if ($inputField.attr('name') === 'CAMNamespace') {
            for (var i = 0; i < loginPrompts.parameters.length; i++) {
              if (loginPrompts.parameters[i].name === 'CAMNamespace') {
                loginPrompts.parameters[i].value = $inputField.val();
                shouldAddCAMNamespace = false;
              }
            }

            if (shouldAddCAMNamespace) {
              prompt = {
                'name': $inputField.attr('name'),
                'value': $inputField.val()
              };
              loginPrompts.parameters.push(prompt);
            }
          } else {
            prompt = {
              'name': $inputField.attr('name'),
              'value': $inputField.val()
            };
            loginPrompts.parameters.push(prompt);
          }
        }.bind(this));

        return this._trySubmitCredentials(loginPrompts).then(function (authInfo) {
          Utils.activateAriaAlert(StringResources.get('loginSuccess'));
          $(Utils.getCurrentWindow()).trigger('ca.loginSuccessful', authInfo);
        }.bind(this))["catch"](function (error) {
          if (error.isExternalLogin) {
            var originInfo = this.origin ? this.origin : {};
            return this._getCAAuthentication().externalLogin(this.glassContext, error, originInfo).then(function (authInfo) {
              Utils.activateAriaAlert(StringResources.get('loginSuccess'));
              return this._getCAAuthentication()._processSuccessfulLogin(this.glassContext, authInfo, originInfo).then(function (authInfo) {
                $(Utils.getCurrentWindow()).trigger('ca.loginSuccessful', authInfo);
              });
            }.bind(this));
          } else {
            this.$el.find('.incorrectLoginText').html('');

            this._showError(error.message);

            this._saveHiddenLoginPrompts(error.displayObjects);

            this._updatePage(error.displayObjects);

            this.canLogin = true;
            return error;
          }
        }.bind(this));
      } else {
        this._showError(StringResources.get('newPasswordsDoNotMatch'));

        return Promise.reject(new Error());
      }
    },

    /*
     * event handler
     */
    onChange: function onChange(evt) {
      if (evt.keyCode === 13) {
        this.onClick();
      }
    },
    _addLabel: function _addLabel(prompt, $parent) {
      var $element = $('<div class="loginLabel">');

      if (prompt.name === 'CAMNamespaceDisplayName' || prompt.name === 'CAMUserNameForDisplay') {
        var nsList = $parent.find('select[name="CAMNamespace"]');

        if (nsList.length > 0 && prompt.name === 'CAMNamespaceDisplayName') {
          //For multiple namespaces, we'll just show the list
          return;
        } else {
          prompt.value = '<span>' + _.escape(prompt.value) + '</span>';
          $element.html(StringResources.get(prompt.name, {
            'promptValue': prompt.value
          }));
        }
      } else {
        $element.text(StringResources.get('genericPrompt', {
          'promptName': prompt.caption,
          'promptValue': prompt.value
        }));
      }

      $parent.find('.camPrompts').append($element);
    },
    _addTextInputField: function _addTextInputField(prompt, $parent) {
      this.confirmNewPassword = false;
      var template = '<div class="textContainer flexDisplay flexRow flexCenter"><label for="{{=it.labelFor}}"><div class="imageContainer"></div></label><input type="text" id="{{=it.labelFor}}" class="authInput userPromptInput"></input></div>';

      if (prompt.type === 'text') {
        template = '<div class="textContainer flexDisplay flexRow flexCenter"><label for="{{=it.labelFor}}"><div class="imageContainer"></div></label><input type="text" id="{{=it.labelFor}}" name="{{=it.name}}" autocorrect="off" autocapitalize="off" placeholder="{{=it.placeHolder}}" aria-label="{{=it.label}}" class="authInput userPromptInput"></input></div>';
      } else if (prompt.type === 'textnoecho') {
        template = '<div class="textContainer flexDisplay flexRow flexCenter"><label for="{{=it.labelFor}}"><div class="imageContainer"></div></label><input type="password" id="{{=it.labelFor}}" name="{{=it.name}}" placeholder="{{=it.placeHolder}}" aria-label="{{=it.label}}" class="authInput userPromptInput"></input></div>';
      } else if (prompt.type === 'verifytextnoecho') {
        template = '<div class="textContainer flexDisplay flexRow flexCenter"><label for="{{=it.labelFor}}"><div class="imageContainer"></div></label><input type="password" id="{{=it.labelFor}}" name="{{=it.name}}" placeholder="{{=it.placeHolder}}" aria-label="{{=it.label}}" class="authInput userPromptInput newPasswordInput"></input></div>';
        this.confirmNewPassword = true;
        this.buttonText = StringResources.get('changePassword');
      }

      var title = prompt.caption.substring(0, prompt.caption.length - 1);
      var html = dot.template(template)({
        name: prompt.name,
        placeHolder: title,
        label: title,
        labelFor: prompt.name
      });
      var $element = $(html);
      var $imageElement = $element.find('.imageContainer');
      var promptName = prompt.name;

      if (promptName.indexOf('Password') !== -1) {
        promptName = 'CAMPassword';
      }

      Utils.setIcon($imageElement, 'login-' + promptName, title);
      $parent.find('.camPrompts').append($element);
      $element.find('input').on('input keyup', $.proxy(this.onChange, this));
    },
    _addSelectInputField: function _addSelectInputField(prompt, $parent) {
      var template = '<div class="selectContainer"><div class="imageContainer"></div><select name="{{=it.name}}" aria-label="{{=it.label}}" class="authInput userPromptInput"></select></div>';
      var title = prompt.caption.substring(0, prompt.caption.length);
      var html = dot.template(template)({
        name: prompt.name,
        label: title
      });
      var $element = $(html);
      var $imageElement = $element.find('.imageContainer');
      Utils.setIcon($imageElement, 'login-' + prompt.name, title);
      var promptOptions = prompt.promptOptions;
      var attributes;

      for (var j = 0; j < promptOptions.length; j++) {
        var text = promptOptions[j].value;
        var value = promptOptions[j].id;
        var isDefault = promptOptions[j].isDefault;
        attributes = {
          value: value,
          text: text
        };

        if (isDefault === true && prompt.name !== 'CAMNamespace') {
          attributes.selected = 'selected';
        }

        $element.find('select').append($('<option>', attributes));
      }

      if (prompt.name === 'CAMNamespace') {
        attributes = {
          value: StringResources.get('selectNamespace'),
          text: StringResources.get('selectNamespace')
        };
        attributes.selected = 'selected';
        $element.find('select').append($('<option>', attributes));
        this.canLogin = false;
        $element.on('change', $.proxy(function (event) {
          //This hard coded prompt becomes necessary because we have no other way of saving this in the state, if we
          //reset all the hidden prompts. This makes sense as this prompt is ALWAYS required by CAM, when trying to sign in.
          var actionPrompt = {
            'name': 'h_CAM_action',
            'value': 'logonAs'
          };

          this._addToHiddenLoginPrompts(actionPrompt);

          this.buttonText = StringResources.get('signInButtonText');
          this.canLogin = true;
          $parent.find('.camPrompts').empty();
          $parent.find('.incorrectLoginText').html('');
          $parent.find('.incorrectLoginText').removeAttr('role');
          $('select[name="CAMNamespace"]').find('option[value="' + StringResources.get('selectNamespace') + '"]').remove();
          this.onClick(event, true);
        }, this));
        $parent.find('.nameSpacePrompt').append($element);
      } else {
        $parent.find('.camPrompts').append($element);
      }
    },
    _updateButton: function _updateButton($parent) {
      if (this.canLogin) {
        $parent.find('.buttonPane').find('button').html(this.buttonText);
        $parent.find('.buttonPane').find('button').removeClass('hidden');
      } else {
        $parent.find('.buttonPane').find('button').addClass('hidden');
      }
    },
    _clearToasts: function _clearToasts() {
      toastr.options.hideDuration = 1;
      toastr.clear();
    },
    getTitle: function getTitle() {
      return this._brandingText || '';
    }
  });
  return LoginView;
});
//# sourceMappingURL=LoginView.js.map