"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 _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));

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 _getPrototypeOf3 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));

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

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

var _propTypes = _interopRequireDefault(require("prop-types"));

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

var _classnames = _interopRequireDefault(require("classnames"));

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

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

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

var _View = _interopRequireDefault(require("@instructure/ui-layout/lib/components/View"));

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

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

var _RichContentRenderer = _interopRequireDefault(require("@instructure/quiz-rce/lib/components/RichContentRenderer"));

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

var _PositionBox = _interopRequireDefault(require("../../positionBox/PositionBox"));

var _constants = require("@instructure/quiz-common/lib/constants");

var _componentForItem = _interopRequireDefault(require("../../../../util/componentForItem"));

var _CustomPropTypes = _interopRequireDefault(require("../../../../util/CustomPropTypes"));

var _keyboardClickable = _interopRequireDefault(require("../../../../util/keyboardClickable"));

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

var _dec,
    _class,
    _class2,
    _temp,
    _default_pl_number = Intl.NumberFormat("pl", { style: "decimal" }).format;

var styles = {
  componentId: 'cQHeE',
  template: function template(theme) {
    return "\n\n.cQHeE_bvdE{padding:".concat(theme.sessionItemResultPadding || 'inherit', "}\n\n.cQHeE_ebwZ{border-top:solid ").concat(theme.topBorderWidth || 'inherit', " ").concat(theme.topBorderColor || 'inherit', "}\n\n.cQHeE_czRh{margin:").concat(theme.resultMargin || 'inherit', "}\n\n.cQHeE_cwte{color:").concat(theme.pointsColor || 'inherit', ";font-size:").concat(theme.pointFontSize || 'inherit', "}\n\n.cQHeE_cSuF{font-size:").concat(theme.questionFontSize || 'inherit', "}\n\n.cQHeE_fqsT{align-items:center;display:flex}\n\n.cQHeE_cgkp{border-color:").concat(theme.itemFeedbackWrapperBorderColor || 'inherit', ";border-radius:").concat(theme.itemFeedbackWrapperBorderRadius || 'inherit', ";border-style:").concat(theme.itemFeedbackWrapperStyle || 'inherit', ";border-width:").concat(theme.itemFeedbackWrapperBorderWidth || 'inherit', ";font-size:").concat(theme.itemFeedbackWrapperFontSize || 'inherit', ";margin-top:").concat(theme.itemFeedbackWrapperMargin || 'inherit', ";padding:").concat(theme.itemFeedbackWrapperPadding || 'inherit', ";white-space:pre-wrap}\n\n.cQHeE_dpDn{padding-bottom:").concat(theme.textPaddingBottom || 'inherit', ";padding-left:").concat(theme.textPaddingLeft || 'inherit', "}\n\n.cQHeE_couS{color:").concat(theme.itemFeedbackLabelColor || 'inherit', ";font-size:").concat(theme.itemFeedbackLabelFontSize || 'inherit', ";margin-bottom:").concat(theme.itemFeedbackMargin || 'inherit', "}\n\n.cQHeE_bcAI{font-size:").concat(theme.itemFeedbackTextSize || 'inherit', ";margin-top:").concat(theme.itemFeedbackTextMargin || 'inherit', "}");
  },
  'sessionItemResult': 'cQHeE_bvdE',
  'topBorder': 'cQHeE_ebwZ',
  'result': 'cQHeE_czRh',
  'points': 'cQHeE_cwte',
  'question': 'cQHeE_cSuF',
  'sessionItemResultHeader': 'cQHeE_fqsT',
  'itemFeedbackWrapper': 'cQHeE_cgkp',
  'textPadding': 'cQHeE_dpDn',
  'itemFeedbackLabel': 'cQHeE_couS',
  'itemFeedbackText': 'cQHeE_bcAI'
};
var SessionItemResult = (_dec = (0, _lib.default)(_theme.default, styles), _dec(_class = (_temp = _class2 =
/*#__PURE__*/
function (_Component) {
  (0, _inherits2.default)(SessionItemResult, _Component);

  function SessionItemResult() {
    var _getPrototypeOf2;

    var _this;

    (0, _classCallCheck2.default)(this, SessionItemResult);

    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
      args[_key] = arguments[_key];
    }

    _this = (0, _possibleConstructorReturn2.default)(this, (_getPrototypeOf2 = (0, _getPrototypeOf3.default)(SessionItemResult)).call.apply(_getPrototypeOf2, [this].concat(args)));

    _this.getWorkingInstance = function (sessionItemResult) {
      // Check for getWorkingInstance because it does not exist on results page object
      // and is only needed on the grading page
      if (sessionItemResult.getWorkingInstance) {
        return sessionItemResult.getWorkingInstance().toJS();
      }

      return sessionItemResult.toJS();
    };

    return _this;
  }

  (0, _createClass2.default)(SessionItemResult, [{
    key: "position",
    value: function position() {
      return this.props.sessionItem.position;
    }
  }, {
    key: "regraded",
    value: function regraded() {
      return this.props.sessionItemResult.regradeInfo && this.props.sessionItemResult.regradeInfo.get('regraded');
    }
  }, {
    key: "renderAlert",
    value: function renderAlert() {
      return _react.default.createElement(_Alert.default, {
        variant: "warning",
        margin: "medium"
      }, _react.default.createElement(_PresentationContent.default, null, "Pytanie zosta\u0142o ponownie ocenione."));
    }
  }, {
    key: "renderRegradePoints",
    value: function renderRegradePoints() {
      var _s, _n, _i, _v, _s2, _n2, _i2, _v2;

      return _react.default.createElement("div", null, _react.default.createElement(_View.default, {
        as: "span",
        size: "small",
        margin: "small"
      }, _react.default.createElement(_Text.default, {
        color: "secondary"
      }, "Poprzednia ocena " + (_s = this.props.sessionItemResult.regradeInfo.get('originalPointsPossible'), _n = +_s, (_i = Math.floor(Math.abs(+_s)), _v = (_s + '.').split('.')[1].length, _i === 1 && _v === 0 ? _default_pl_number(this.props.sessionItemResult.regradeInfo.get('originalScore') || 0) + " / " + _default_pl_number(this.props.sessionItemResult.regradeInfo.get('originalPointsPossible')) + " pkt" : _default_pl_number(this.props.sessionItemResult.regradeInfo.get('originalScore') || 0) + " / " + _default_pl_number(this.props.sessionItemResult.regradeInfo.get('originalPointsPossible')) + " pkt")))), _react.default.createElement(_View.default, {
        as: "span",
        size: "small",
        margin: "small"
      }, _react.default.createElement(_Text.default, {
        color: "warning"
      }, "Nowa ocena " + (_s2 = this.props.sessionItemResult.regradeInfo.get('newPointsPossible'), _n2 = +_s2, (_i2 = Math.floor(Math.abs(+_s2)), _v2 = (_s2 + '.').split('.')[1].length, _i2 === 1 && _v2 === 0 ? _default_pl_number(this.props.sessionItemResult.regradeInfo.get('newScore') || 0) + " / " + _default_pl_number(this.props.sessionItemResult.regradeInfo.get('newPointsPossible')) + " pkt" : _default_pl_number(this.props.sessionItemResult.regradeInfo.get('newScore') || 0) + " / " + _default_pl_number(this.props.sessionItemResult.regradeInfo.get('newPointsPossible')) + " pkt")))));
    }
  }, {
    key: "renderHeader",
    value: function renderHeader() {
      return _react.default.createElement("div", {
        className: styles.sessionItemResultHeader
      }, this.renderResultPosition(), this.regraded() ? this.renderRegradePoints() : this.renderPoints());
    }
  }, {
    key: "renderResultPosition",
    value: function renderResultPosition() {
      var position = this.position();
      var positionText;

      if (this.regraded()) {
        positionText = "Wyniki dla elementu " + _default_pl_number(position) + ". Pytanie zosta\u0142o ponownie ocenione.";
      } else {
        positionText = "Wyniki dla elementu " + _default_pl_number(position) + ".";
      }

      return _react.default.createElement(_PositionBox.default, {
        position: position,
        headingLevel: "h3",
        headingText: positionText
      });
    }
  }, {
    key: "renderPoints",
    value: function renderPoints() {
      return _react.default.createElement("div", {
        className: styles.points
      }, this.pointsDisplayText);
    }
  }, {
    key: "renderFeedbackBox",
    value: function renderFeedbackBox(feedbackContent, formattedFeedbackTitle) {
      if (feedbackContent) {
        return _react.default.createElement("div", null, _react.default.createElement(_Heading.default, {
          level: "h4",
          margin: "xx-small small"
        }, formattedFeedbackTitle), _react.default.createElement("div", {
          className: styles.textPadding
        }, _react.default.createElement(_RichContentRenderer.default, {
          customStyles: styles.itemFeedbackText,
          content: feedbackContent
        })));
      }
    }
  }, {
    key: "renderItemFeedback",
    value: function renderItemFeedback(simpleSessionItemResult) {
      var itemFeedback = simpleSessionItemResult.feedback && simpleSessionItemResult.feedback.itemFeedback || {};
      var correctFeedback = this.renderFeedbackBox(itemFeedback.correct, "Based on answering correctly");
      var incorrectFeedback = this.renderFeedbackBox(itemFeedback.incorrect, "Based on answering incorrectly");
      var neutralFeedback = this.renderFeedbackBox(itemFeedback.neutral, "Og\xF3lna opinia");
      var graderFeedback = this.renderGraderFeedback(simpleSessionItemResult);
      var answerFeedback = this.renderFeedbackBox(simpleSessionItemResult.answerFeedback, "Based on your answer");
      var showAnswerFeedback = this.props.shouldRenderAnswerFeedback && answerFeedback;
      var showFeedback = correctFeedback || incorrectFeedback || neutralFeedback || graderFeedback;

      if (showAnswerFeedback || showFeedback) {
        return _react.default.createElement("div", {
          className: styles.itemFeedbackWrapper
        }, _react.default.createElement(_Heading.default, {
          level: "h3",
          margin: "xx-small small medium"
        }, "Feedback"), this.props.shouldRenderAnswerFeedback && answerFeedback, correctFeedback, incorrectFeedback, neutralFeedback, graderFeedback);
      }
    }
  }, {
    key: "renderGraderFeedback",
    value: function renderGraderFeedback(simpleSessionItemResult) {
      var graderFeedback = simpleSessionItemResult.feedback && simpleSessionItemResult.feedback.graderFeedback || {};

      if (!this.props.hideGraderFeedback && graderFeedback.content) {
        if (this.props.editGraderFeedback) {
          return _react.default.createElement("div", {
            role: "button",
            onClick: this.props.editGraderFeedback,
            onKeyDown: _keyboardClickable.default,
            className: styles.itemFeedbackWrapper,
            tabIndex: "0"
          }, _react.default.createElement("div", {
            className: styles.itemFeedbackLabel
          }, "Feedback from grader"), _react.default.createElement(_RichContentRenderer.default, {
            customStyles: styles.itemFeedbackText,
            content: graderFeedback.content
          }));
        } else {
          return this.renderFeedbackBox(graderFeedback.content, "Feedback from grader");
        }
      }
    }
  }, {
    key: "renderSessionItemResult",
    value: function renderSessionItemResult() {
      var _this$props = this.props,
          appContainer = _this$props.appContainer,
          sessionItem = _this$props.sessionItem,
          sessionItemResult = _this$props.sessionItemResult,
          itemResultsModifications = _this$props.itemResultsModifications;

      if (!sessionItemResult.isLoaded()) {
        return null;
      }

      var item = sessionItem.getItem();
      var slug = item.getInteractionType && item.getInteractionType().slug;
      var ResultInteraction = (0, _componentForItem.default)(slug, _constants.COMPONENT_RESULT);
      var simpleItem = item.toJS();
      var simpleResultsModifications = itemResultsModifications && itemResultsModifications.toJS() || {};
      var simpleSessionItem = sessionItem.toJS();
      var simpleSessionItemResult = sessionItemResult.toJS();
      return _react.default.createElement("div", {
        className: styles.result
      }, _react.default.createElement("div", {
        className: styles.question
      }, _react.default.createElement(ResultInteraction, {
        appContainer: appContainer,
        itemBody: simpleItem.itemBody,
        itemId: simpleSessionItem.id // needed for input group name
        ,
        interactionData: simpleItem.interactionData,
        properties: simpleItem.properties || {},
        scoringData: simpleSessionItem.scoringData,
        scoredData: simpleSessionItemResult.scoredData,
        itemResultsModifications: simpleResultsModifications[simpleSessionItem.id]
      })), this.renderItemFeedback(simpleSessionItemResult));
    }
  }, {
    key: "render",
    value: function render() {
      var _classNames;

      var classes = (0, _classnames.default)((_classNames = {}, (0, _defineProperty2.default)(_classNames, styles.sessionItemResult, true), (0, _defineProperty2.default)(_classNames, styles.topBorder, this.props.shouldRenderTopBorder), _classNames));
      return _react.default.createElement("div", {
        className: classes
      }, this.regraded() ? this.renderAlert() : null, this.renderHeader(), this.renderSessionItemResult());
    }
  }, {
    key: "points",
    get: function get() {
      var sessionItemResult = this.props.sessionItemResult;
      var normalizedSessionItemResult = sessionItemResult && sessionItemResult.toJS() || {};
      return normalizedSessionItemResult.score;
    }
  }, {
    key: "pointsPresent",
    get: function get() {
      return typeof this.points === 'number';
    }
  }, {
    key: "pointsPossible",
    get: function get() {
      return this.props.sessionItem.pointsPossible;
    }
  }, {
    key: "pointsPossiblePresent",
    get: function get() {
      return typeof this.pointsPossible === 'number';
    }
  }, {
    key: "pointsDisplayText",
    get: function get() {
      var points = this.points;
      var possible = this.pointsPossible;

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

        return _s3 = possible, _n3 = +_s3, (_i3 = Math.floor(Math.abs(+_s3)), _v3 = (_s3 + '.').split('.')[1].length, _i3 === 1 && _v3 === 0 ? _default_pl_number(points) + " / " + _default_pl_number(possible) + " pkt" : _default_pl_number(points) + " / " + _default_pl_number(possible) + " pkt");
      }

      if (this.pointsPossiblePresent) {
        var _s4, _n4, _i4, _v4;

        return _s4 = possible, _n4 = +_s4, (_i4 = Math.floor(Math.abs(+_s4)), _v4 = (_s4 + '.').split('.')[1].length, _i4 === 1 && _v4 === 0 ? _default_pl_number(possible) + " mo\u017Cliwy" : _default_pl_number(possible) + " punkt");
      }

      if (this.pointsPresent) {
        var _s5, _n5, _i5, _v5;

        return "Zdobyto " + (_s5 = points, _n5 = +_s5, (_i5 = Math.floor(Math.abs(+_s5)), _v5 = (_s5 + '.').split('.')[1].length, _i5 === 1 && _v5 === 0 ? _default_pl_number(points) + " pkt" : _default_pl_number(points) + " pkt"));
      }

      return '';
    }
  }]);
  SessionItemResult.displayName = "SessionItemResult";
  return SessionItemResult;
}(_react.Component), _class2.propTypes = {
  appContainer: _CustomPropTypes.default.selectors.isRequired,
  editGraderFeedback: _propTypes.default.func,
  hideGraderFeedback: _propTypes.default.bool,
  itemResultsModifications: _reactImmutableProptypes.default.map,
  sessionItem: _reactImmutableProptypes.default.record.isRequired,
  sessionItemResult: _reactImmutableProptypes.default.record.isRequired,
  shouldRenderAnswerFeedback: _propTypes.default.bool,
  shouldRenderTopBorder: _propTypes.default.bool
}, _class2.defaultProps = {
  editGraderFeedback: null,
  hideGraderFeedback: false,
  itemResultsModifications: null,
  shouldRenderAnswerfeedback: false,
  shouldRenderTopBorder: true
}, _temp)) || _class);
exports.default = SessionItemResult;