Пример #1
0
 attrs.pointDistribution.forEach(function(point) {
   if (participantCount <= 0) {
     point.ratio = 0;
   }
   else {
     point.ratio = round(point.count / participantCount * 100.0);
   }
 });
Пример #2
0
    ratioFor: function(score) {
      var quizPoints = parseFloat(this.props.pointsPossible);

      if (quizPoints > 0) {
        return round(score / quizPoints * 100.0, 0, 0);
      }
      else {
        return 0;
      }
    },
Пример #3
0
  decorateAnswer = function(participantCount, answer) {
    answer.ratio = participantCount > 0 ?
      round(answer.responses / participantCount * 100) :
      0;

    if (answer.id === 'none') {
      answer.text = I18n.t('no_answer', 'No Answer');
    } else if (answer.id === 'other') {
      answer.text = I18n.t('unknown_answer', 'Something Else');
    }
  };
Пример #4
0
    var decorateAnswer = function(answer) {
      if (answer.id === 'none') {
        answer.text = I18n.t('no_answer', 'No Answer');
      }
      else if (answer.id === 'other') {
        answer.text = I18n.t('unknown_answer', 'Something Else'); // This is where we need to handle the answer changed thing
      }

      if (participantCount > 0) {
        answer.ratio = round(answer.responses / participantCount * 100.0);
      }
      else {
        answer.ratio = 0;
      }
    };
    render: function() {
      var crr = calculateResponseRatio(this.getAnswerPool(), this.props.participantCount, {
        questionType: this.props.questionType
      });
      var answerPool = this.getAnswerPool();

      return(
        <Question>
          <div className="grid-row">
            <div className="col-sm-8 question-top-left">
              <QuestionHeader
                responseCount={this.props.responses}
                participantCount={this.props.participantCount}
                questionText={this.props.questionText}
                position={this.props.position} />

              <div
                className="question-text"
                aria-hidden
                dangerouslySetInnerHTML={{ __html: this.props.questionText }} />

              <nav className="row-fluid answer-set-tabs">
                {this.props.answerSets.map(this.renderAnswerSetTab)}
              </nav>
            </div>

            <div className="col-sm-4 question-top-right"></div>
          </div>

          <div className="grid-row">
            <div className="col-sm-8 question-bottom-left">
              <AnswerTable answers={answerPool} />
            </div>

            <div className="col-sm-4 question-bottom-right">
              <CorrectAnswerDonut
                correctResponseRatio={crr}
                label={I18n.t(
                  '%{ratio}% responded correctly', {
                    ratio: round(crr * 100.0, 0)
                  }
                )} />
            </div>
          </div>
        </Question>
      );
    },
Пример #6
0
 var getLabel = function(ratio) {
   return I18n.t('%{ratio}% answered correctly', {
     ratio: round(ratio * 100.0, 0)
   });
 };
Пример #7
0
    render: function() {
      var isLoading = this.props.loading;

      return(
        <div id="summary-statistics" className={isLoading ? 'loading' : undefined}>
          <header className="padded">
            <h2 className="section-title inline">
              {I18n.t('quiz_summary', 'Quiz Summary')}
            </h2>

            {isLoading && <Spinner />}

            <div className="pull-right inline">
              <SectionSelect />
              {this.props.quizReports.map(this.renderReport)}
            </div>
          </header>

          <table className="text-left">
            <ScreenReaderContent tagName="caption" forceSentenceDelimiter>
              {I18n.t('table_description',
                'Summary statistics for all turned in submissions')
              }
            </ScreenReaderContent>

            <thead>
              <tr>
                <Column
                  icon="icon-quiz-stats-avg"
                  label={I18n.t('mean', 'Average Score')} />
                <Column
                  icon="icon-quiz-stats-high"
                  label={I18n.t('high_score', 'High Score')} />
                <Column
                  icon="icon-quiz-stats-low"
                  label={I18n.t('low_score', 'Low Score')} />
                <Column
                  icon="icon-quiz-stats-deviation"
                  label={I18n.t('stdev', 'Standard Deviation')} />
                <Column
                  icon="icon-quiz-stats-time"
                  label={I18n.t('avg_time', 'Average Time')} />
              </tr>
            </thead>

            <tbody>
              <tr>
                <td className="emphasized">
                  {isLoading ? NA_LABEL : (this.ratioFor(this.props.scoreAverage) + '%')}
                </td>
                <td>{isLoading ? NA_LABEL : (this.ratioFor(this.props.scoreHigh) + '%')}</td>
                <td>{isLoading ? NA_LABEL : (this.ratioFor(this.props.scoreLow) + '%')}</td>
                <td>{isLoading ? NA_LABEL : formatNumber(round(this.props.scoreStdev, 2), 2)}</td>
                {isLoading ?
                  <td key="duration">{NA_LABEL}</td> :
                  <td key="duration">
                    <ScreenReaderContent forceSentenceDelimiter>
                      {secondsToTime.toReadableString(this.props.durationAverage)}
                    </ScreenReaderContent>
                    {/*
                      try to hide the [HH:]MM:SS timestamp from SR users because
                      it's not really useful, however this doesn't work in all
                      modes such as the Speak-All mode (at least on VoiceOver)
                    */}
                    <SightedUserContent>
                      {secondsToTime(this.props.durationAverage)}
                    </SightedUserContent>
                  </td>
                }
              </tr>
            </tbody>
          </table>

          <ScorePercentileChart
            key="chart"
            scores={this.props.scores}
            scoreAverage={this.props.scoreAverage}
            pointsPossible={this.props.pointsPossible} />
        </div>
      );
    },