"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;

var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));

var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));

var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));

var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));

var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));

var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));

var _react = _interopRequireWildcard(require("react"));

var _reactImmutableProptypes = _interopRequireDefault(require("react-immutable-proptypes"));

var _AccessibleContent = _interopRequireDefault(require("@instructure/ui-a11y/lib/components/AccessibleContent"));

var _Alert = _interopRequireDefault(require("@instructure/ui-alerts/lib/components/Alert"));

var _Heading = _interopRequireDefault(require("@instructure/ui-elements/lib/components/Heading"));

var _Progress = _interopRequireDefault(require("@instructure/ui-elements/lib/components/Progress"));

var _ScreenReaderContent = _interopRequireDefault(require("@instructure/ui-a11y/lib/components/ScreenReaderContent"));

var _Text = _interopRequireDefault(require("@instructure/ui-elements/lib/components/Text"));

var _lib = _interopRequireDefault(require("@instructure/ui-themeable/lib"));

var _formatMessage = _interopRequireDefault(require("@instructure/quiz-i18n/lib/format-message"));

var _withI18nSupport2 = _interopRequireDefault(require("@instructure/quiz-common/lib/with-i18n-support"));

var _FormattedDuration = _interopRequireDefault(require("../../../shared/FormattedDuration"));

var _formatTimespan = require("../../../../util/formatTimespan");

var _theme = _interopRequireDefault(require("./theme"));

var _dec,
    _class,
    _class2,
    _temp,
    _default_enAUXUnimelb_number = Intl.NumberFormat("en-AU-x-unimelb", { style: "decimal" }).format;

var styles = {
  componentId: 'dZbOF',
  template: function template(theme) {
    return "\n\n.dZbOF_ekHz{align-items:center;display:flex;flex-direction:row;justify-content:center;margin-top:".concat(theme.alertWrapperMargin || 'inherit', "}\n\n.dZbOF_bANW{width:300px}\n\n.dZbOF_gasz{margin:none;padding:none}\n\n.dZbOF_pypk,.dZbOF_gasz{align-items:center;display:flex;justify-content:center}\n\n.dZbOF_pypk{align-self:center;flex-wrap:wrap}\n\n.dZbOF_bCqi{flex-wrap:wrap;justify-content:flex-start}\n\n.dZbOF_frHB,.dZbOF_bCqi{align-items:center;display:flex;flex:1 1 auto}\n\n.dZbOF_frHB{height:150px;margin:").concat(theme.scoreMargin || 'inherit', ";width:150px;z-index:").concat(theme.scoreZIndex || 'inherit', "}\n\n.dZbOF_fkZg{font-size:").concat(theme.scorePercentageFontSize || 'inherit', ";font-weight:").concat(theme.scorePercentageFontWeight || 'inherit', "}\n\n.dZbOF_vsBM{flex:1 1 auto;margin:").concat(theme.infoWrapperMargin || 'inherit', ";padding-left:").concat(theme.inforWrapperPadding || 'inherit', "}");
  },
  'alertWrapper': 'dZbOF_ekHz',
  'alertWidth': 'dZbOF_bANW',
  'wrapper': 'dZbOF_gasz',
  'info': 'dZbOF_pypk',
  'scoreStats': 'dZbOF_bCqi',
  'score': 'dZbOF_frHB',
  'scorePercentage': 'dZbOF_fkZg',
  'infoWrapper': 'dZbOF_vsBM'
};
var unknownPercentageValue = 'UNKNOWN_PERCENTAGE';
var Info = (_dec = (0, _lib.default)(_theme.default, styles), _dec(_class = (_temp = _class2 =
/*#__PURE__*/
function (_withI18nSupport) {
  (0, _inherits2.default)(Info, _withI18nSupport);

  function Info(props) {
    var _this;

    (0, _classCallCheck2.default)(this, Info);
    _this = (0, _possibleConstructorReturn2.default)(this, (0, _getPrototypeOf2.default)(Info).call(this, props));
    _this.progressTextFormatter = _this.progressTextFormatter.bind((0, _assertThisInitialized2.default)(_this));
    _this.progressDisplayFormatter = _this.progressDisplayFormatter.bind((0, _assertThisInitialized2.default)(_this));
    return _this;
  }

  (0, _createClass2.default)(Info, [{
    key: "progressTextFormatter",
    // needed for inst-ui Progress
    value: function progressTextFormatter(valueNow, valueMax) {
      var percentageUnknown = valueNow === unknownPercentageValue;
      return percentageUnknown ? "Unknown Score" : "Your score was " + this.formatPercentMax2FractionDigits(valueNow) + ".";
    } // needed for inst-ui Progress

  }, {
    key: "progressDisplayFormatter",
    value: function progressDisplayFormatter(valueNow, valueMax) {
      var valueToShow = valueNow === unknownPercentageValue ? "?" : this.formatPercentMax2FractionDigits(valueNow);
      return _react.default.createElement("div", {
        className: styles.scorePercentage,
        "data-automation": "sdk-quiz-score-percentage"
      }, valueToShow);
    }
  }, {
    key: "renderAlert",
    value: function renderAlert() {
      var _this$props = this.props,
          quizSessionResult = _this$props.quizSessionResult,
          sessionItemResults = _this$props.sessionItemResults;
      var ungradedCount = sessionItemResults.reduce(function (count, sessionItemResult) {
        return sessionItemResult.getIn(['scoredData', 'gradeStatus']) === 'waiting' ? count + 1 : count;
      }, 0);
      var hasUngradedQuesitons = ungradedCount > 0;

      if (hasUngradedQuesitons && quizSessionResult.isLoaded()) {
        var _s, _n, _i, _v;

        var ungradedText = (_s = ungradedCount, _n = +_s, (_i = Math.floor(Math.abs(+_s)), _v = (_s + '.').split('.')[1].length, _i === 1 && _v === 0 ? _default_enAUXUnimelb_number(ungradedCount) + " question requires grading" : _default_enAUXUnimelb_number(ungradedCount) + " questions require grading"));
        return _react.default.createElement("div", {
          className: styles.alertWrapper
        }, _react.default.createElement("div", {
          className: styles.alertWidth,
          "data-automation": "sdk-results-requires-grading"
        }, _react.default.createElement(_Alert.default, {
          variant: "info"
        }, ungradedText)));
      }
    }
  }, {
    key: "renderScoreStats",
    value: function renderScoreStats() {
      return _react.default.createElement("div", {
        className: styles.scoreStats
      }, this.renderProgress(), this.renderPointsDisplay());
    }
  }, {
    key: "renderProgress",
    value: function renderProgress() {
      if (this.pointsMissing || this.pointsPossibleMissing) {
        return null;
      }

      return _react.default.createElement("div", {
        className: styles.score,
        "data-automation": "sdk-info-score"
      }, _react.default.createElement(_Progress.default, {
        animateOnMount: true,
        size: "large",
        variant: "circle",
        label: "Your Score",
        formatValueText: this.progressTextFormatter,
        formatDisplayedValue: this.progressDisplayFormatter,
        valueNow: this.percentageVal,
        valueMax: 1
      }));
    }
  }, {
    key: "renderPointsDisplay",
    value: function renderPointsDisplay() {
      return _react.default.createElement("div", {
        className: styles.infoWrapper
      }, _react.default.createElement(_AccessibleContent.default, {
        alt: this.pointsText
      }, _react.default.createElement(_Text.default, {
        as: "div",
        color: "primary",
        size: "xx-large",
        weight: "bold"
      }, this.mainPointsText), _react.default.createElement(_Text.default, {
        color: "secondary"
      }, this.subPointsText)));
    }
  }, {
    key: "renderTime",
    value: function renderTime() {
      var attemptText = "Time for this attempt";
      var alt = "Time for this attempt: " + (0, _formatTimespan.formatTime)(this.props.quizSession.elapsedTime);
      return _react.default.createElement(_AccessibleContent.default, {
        alt: alt
      }, _react.default.createElement(_Text.default, {
        as: "div",
        color: "primary",
        size: "xx-large",
        weight: "bold"
      }, _react.default.createElement(_FormattedDuration.default, {
        seconds: this.props.quizSession.elapsedTime
      })), _react.default.createElement(_Text.default, {
        color: "secondary"
      }, attemptText));
    }
  }, {
    key: "render",
    value: function render() {
      return _react.default.createElement("div", null, this.renderAlert(), _react.default.createElement("div", {
        className: styles.wrapper
      }, _react.default.createElement("div", {
        className: styles.info
      }, _react.default.createElement(_ScreenReaderContent.default, null, _react.default.createElement(_Heading.default, {
        level: "h2"
      }, "Assessment Statistics")), this.renderScoreStats(), _react.default.createElement("div", {
        className: styles.infoWrapper
      }, this.renderTime()))));
    }
  }, {
    key: "points",
    get: function get() {
      return this.props.quizSessionResult.score;
    }
  }, {
    key: "pointsPresent",
    get: function get() {
      return typeof this.points === 'number';
    }
  }, {
    key: "pointsMissing",
    get: function get() {
      return !this.pointsPresent;
    }
  }, {
    key: "pointsPossible",
    get: function get() {
      return this.props.quizSessionResult.pointsPossible;
    }
  }, {
    key: "pointsPossiblePresent",
    get: function get() {
      return typeof this.pointsPossible === 'number';
    }
  }, {
    key: "pointsPossibleMissing",
    get: function get() {
      return !this.pointsPossiblePresent;
    }
  }, {
    key: "percentageVal",
    get: function get() {
      var ratio = this.props.quizSessionResult.percentage;
      return isNaN(ratio) ? unknownPercentageValue : ratio;
    }
  }, {
    key: "mainPointsText",
    get: function get() {
      if (this.pointsMissing && this.pointsPossibleMissing) {
        return '--';
      }

      var valueToUse = this.pointsPresent ? this.points : this.pointsPossible;
      return _formatMessage.default.number(valueToUse);
    }
  }, {
    key: "subPointsText",
    get: function get() {
      var _s4, _n4, _i4, _v4;

      if (this.pointsPresent && this.pointsPossiblePresent) {
        var _s2, _n2, _i2, _v2;

        return "Out of " + (_s2 = this.pointsPossible, _n2 = +_s2, (_i2 = Math.floor(Math.abs(+_s2)), _v2 = (_s2 + '.').split('.')[1].length, _i2 === 1 && _v2 === 0 ? _default_enAUXUnimelb_number(this.pointsPossible) + " point" : _default_enAUXUnimelb_number(this.pointsPossible) + " points"));
      }

      if (this.pointsPresent) {
        var _s3, _n3, _i3, _v3;

        return "Earned " + (_s3 = this.points, _n3 = +_s3, (_i3 = Math.floor(Math.abs(+_s3)), _v3 = (_s3 + '.').split('.')[1].length, _i3 === 1 && _v3 === 0 ? "point" : "points"));
      } // We use "Points Possible" when only points is present or when nothing is present


      return (_s4 = this.pointsPossible, _n4 = +_s4, (_i4 = Math.floor(Math.abs(+_s4)), _v4 = (_s4 + '.').split('.')[1].length, _i4 === 1 && _v4 === 0 ? "Point" : "Points")) + " possible";
    }
  }, {
    key: "pointsText",
    get: function get() {
      if (this.pointsPresent && this.pointsPossiblePresent) {
        var _s5, _n5, _i5, _v5;

        return _default_enAUXUnimelb_number(this.points) + " out of " + (_s5 = this.pointsPossible, _n5 = +_s5, (_i5 = Math.floor(Math.abs(+_s5)), _v5 = (_s5 + '.').split('.')[1].length, _i5 === 1 && _v5 === 0 ? _default_enAUXUnimelb_number(this.pointsPossible) + " point" : _default_enAUXUnimelb_number(this.pointsPossible) + " points"));
      }

      if (this.pointsPresent) {
        var _s6, _n6, _i6, _v6;

        return "Earned " + (_s6 = this.points, _n6 = +_s6, (_i6 = Math.floor(Math.abs(+_s6)), _v6 = (_s6 + '.').split('.')[1].length, _i6 === 1 && _v6 === 0 ? _default_enAUXUnimelb_number(this.points) + " point" : _default_enAUXUnimelb_number(this.points) + " points"));
      } // We use "Points Possible" when only points is present or when nothing is present


      if (this.pointsPossiblePresent) {
        var _s7, _n7, _i7, _v7;

        return (_s7 = this.pointsPossible, _n7 = +_s7, (_i7 = Math.floor(Math.abs(+_s7)), _v7 = (_s7 + '.').split('.')[1].length, _i7 === 1 && _v7 === 0 ? _default_enAUXUnimelb_number(this.pointsPossible) + " point" : _default_enAUXUnimelb_number(this.pointsPossible) + " points")) + " possible";
      }

      return "Unknown Score";
    }
  }]);
  Info.displayName = "Info";
  return Info;
}((0, _withI18nSupport2.default)(_react.Component)), _class2.propTypes = {
  quizSession: _reactImmutableProptypes.default.record.isRequired,
  quizSessionResult: _reactImmutableProptypes.default.record.isRequired,
  sessionItemResults: _reactImmutableProptypes.default.list.isRequired
}, _temp)) || _class);
exports.default = Info;