New: Added _canShowCorrectness and .can-show-correctness for questions (

fixes #582)

* New: Added _canShowCorrectness and .can-show-correctness for questions

* Ensure only one style is applied at a time

js/models/questionModel.js

@@ -16,6 +16,7 @@ class QuestionModel extends ComponentModel {
       _isQuestionType: true,
       _shouldDisplayAttempts: false,
       _shouldShowMarking: false,
+      _canShowCorrectness: false,
       _canShowModelAnswer: true,
       _canShowFeedback: true,
       _canShowMarking: true,
@@ -213,10 +214,11 @@ class QuestionModel extends ComponentModel {
     const isEnabled = this.get('_isEnabled');
     const buttonState = this.get('_buttonState');
     const canShowModelAnswer = this.get('_canShowModelAnswer');
+    const canShowCorrectness = this.get('_canShowCorrectness');
 
     if (isInteractionComplete) {
 
-      if (isCorrect || !canShowModelAnswer) {
+      if (isCorrect || (!canShowModelAnswer || canShowCorrectness)) {
         // Use correct instead of complete to signify button state
         this.set('_buttonState', BUTTON_STATE.CORRECT);
 
@@ -381,7 +383,11 @@ class QuestionModel extends ComponentModel {
     }
 
     if (this.get('_attemptsLeft') === 0) {
-      return this.get('_canShowModelAnswer') ? BUTTON_STATE.SHOW_CORRECT_ANSWER : BUTTON_STATE.INCORRECT;
+      const canShowModelAnswer = this.get('_canShowModelAnswer');
+      const canShowCorrectness = this.get('_canShowCorrectness');
+      return canShowModelAnswer && !canShowCorrectness
+        ? BUTTON_STATE.SHOW_CORRECT_ANSWER
+        : BUTTON_STATE.INCORRECT;
     }
 
     return this.get('_isSubmitted') ? BUTTON_STATE.RESET : BUTTON_STATE.SUBMIT;

js/views/questionView.js

@@ -11,6 +11,8 @@ import 'core/js/models/questionModel';
 class QuestionView extends ComponentView {
 
   className() {
+    const canShowCorrectness = this.model.get('_canShowCorrectness');
+    const canShowModelAnswer = this.model.get('_canShowModelAnswer');
     return [
       'component',
       'is-question',
@@ -21,7 +23,8 @@ class QuestionView extends ComponentView {
       'is-' + this.model.get('_layout'),
       (this.model.get('_isComplete') ? 'is-complete' : ''),
       (this.model.get('_isOptional') ? 'is-optional' : ''),
-      (this.model.get('_canShowModelAnswer') ? 'can-show-model-answer' : ''),
+      (canShowCorrectness ? 'can-show-correctness' : ''),
+      (canShowModelAnswer && !canShowCorrectness ? 'can-show-model-answer' : ''),
       (this.model.get('_canShowFeedback') ? 'can-show-feedback' : ''),
       (this.model.get('_canShowMarking') ? 'can-show-marking' : '')
     ].join(' ');