@pie-element/multiple-choice 9.11.1-next.3 → 9.11.1-next.31
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/index.js +19 -4
- package/lib/index.js.map +1 -1
- package/lib/multiple-choice.js +2 -5
- package/lib/multiple-choice.js.map +1 -1
- package/lib/session-updater.js +14 -2
- package/lib/session-updater.js.map +1 -1
- package/module/element.js +41 -21
- package/module/print.js +15 -17
- package/package.json +2 -2
package/lib/index.js
CHANGED
|
@@ -92,6 +92,8 @@ var MultipleChoice = /*#__PURE__*/function (_HTMLElement) {
|
|
|
92
92
|
_this._model = null;
|
|
93
93
|
_this._session = null;
|
|
94
94
|
_this.audioComplete = false;
|
|
95
|
+
_this._boundHandleKeyDown = _this.handleKeyDown.bind((0, _assertThisInitialized2["default"])(_this));
|
|
96
|
+
_this._keyboardEventsEnabled = false;
|
|
95
97
|
_this._rerender = (0, _debounce["default"])(function () {
|
|
96
98
|
if (_this._model && _this._session) {
|
|
97
99
|
var element = /*#__PURE__*/_react["default"].createElement(_main["default"], {
|
|
@@ -113,7 +115,7 @@ var MultipleChoice = /*#__PURE__*/function (_HTMLElement) {
|
|
|
113
115
|
(0, _mathRendering.renderMath)((0, _assertThisInitialized2["default"])(_this));
|
|
114
116
|
});
|
|
115
117
|
|
|
116
|
-
if (_this._model.keyboardEventsEnabled === true) {
|
|
118
|
+
if (_this._model.keyboardEventsEnabled === true && !_this._keyboardEventsEnabled) {
|
|
117
119
|
_this.enableKeyboardEvents();
|
|
118
120
|
}
|
|
119
121
|
} else {
|
|
@@ -232,6 +234,9 @@ var MultipleChoice = /*#__PURE__*/function (_HTMLElement) {
|
|
|
232
234
|
var enableAudio = function enableAudio() {
|
|
233
235
|
if (_this2.querySelector('#play-audio-info')) {
|
|
234
236
|
audio.play();
|
|
237
|
+
(0, _sessionUpdater.updateSessionMetadata)(_this2._session, {
|
|
238
|
+
audioStartTime: new Date().getTime()
|
|
239
|
+
});
|
|
235
240
|
container.removeChild(info);
|
|
236
241
|
}
|
|
237
242
|
|
|
@@ -263,6 +268,9 @@ var MultipleChoice = /*#__PURE__*/function (_HTMLElement) {
|
|
|
263
268
|
audio.addEventListener('playing', handlePlaying); // we need to listen for the ended event to update the isComplete state
|
|
264
269
|
|
|
265
270
|
var handleEnded = function handleEnded() {
|
|
271
|
+
(0, _sessionUpdater.updateSessionMetadata)(_this2._session, {
|
|
272
|
+
audioEndTime: new Date().getTime()
|
|
273
|
+
});
|
|
266
274
|
_this2.audioComplete = true;
|
|
267
275
|
|
|
268
276
|
_this2._dispatchResponseChanged();
|
|
@@ -283,12 +291,18 @@ var MultipleChoice = /*#__PURE__*/function (_HTMLElement) {
|
|
|
283
291
|
}, {
|
|
284
292
|
key: "enableKeyboardEvents",
|
|
285
293
|
value: function enableKeyboardEvents() {
|
|
286
|
-
|
|
294
|
+
if (!this._keyboardEventsEnabled) {
|
|
295
|
+
window.addEventListener('keydown', this._boundHandleKeyDown);
|
|
296
|
+
this._keyboardEventsEnabled = true;
|
|
297
|
+
}
|
|
287
298
|
}
|
|
288
299
|
}, {
|
|
289
300
|
key: "disconnectedCallback",
|
|
290
301
|
value: function disconnectedCallback() {
|
|
291
|
-
|
|
302
|
+
if (this._keyboardEventsEnabled) {
|
|
303
|
+
window.removeEventListener('keydown', this._boundHandleKeyDown);
|
|
304
|
+
this._keyboardEventsEnabled = false;
|
|
305
|
+
}
|
|
292
306
|
}
|
|
293
307
|
/**
|
|
294
308
|
* Handles global keyboard events for selecting or toggling multiple-choice answers.
|
|
@@ -319,7 +333,8 @@ var MultipleChoice = /*#__PURE__*/function (_HTMLElement) {
|
|
|
319
333
|
var choiceId = this._model.choices[choiceIndex].value;
|
|
320
334
|
var newValue = {
|
|
321
335
|
value: choiceId,
|
|
322
|
-
selected: !currentValue.includes(choiceId)
|
|
336
|
+
selected: !currentValue.includes(choiceId),
|
|
337
|
+
selector: 'Keyboard'
|
|
323
338
|
};
|
|
324
339
|
|
|
325
340
|
this._onChange(newValue);
|
package/lib/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.js"],"names":["log","isComplete","session","model","audioComplete","autoplayAudioEnabled","completeAudioEnabled","value","choiceMode","minSelections","maxSelections","selections","length","MultipleChoice","_model","_session","_rerender","element","React","createElement","Main","onChoiceChanged","_onChange","bind","onShowCorrectToggle","setAttribute","setLangAttribute","ReactDOM","render","keyboardEventsEnabled","enableKeyboardEvents","leading","trailing","_dispatchResponseChanged","dispatchEvent","SessionChangedEvent","tagName","toLowerCase","_dispatchModelSet","ModelSetEvent","undefined","language","lang","slice","s","data","info","document","id","Object","assign","style","position","top","width","height","display","justifyContent","alignItems","background","zIndex","img","src","alt","appendChild","observer","MutationObserver","mutationsList","forEach","mutation","type","audio","querySelector","isInsidePrompt","closest","_createAudioInfoToast","container","enableAudio","play","removeChild","removeEventListener","setTimeout","paused","addEventListener","handlePlaying","handleEnded","disconnect","observe","childList","subtree","window","handleKeyDown","event","keyToIndex","key","numOffset","letterOffset","test","charCodeAt","choiceIndex","choices","currentValue","choiceId","newValue","selected","includes","HTMLElement"],"mappings":"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","sourcesContent":["import Main from './main';\nimport React from 'react';\nimport ReactDOM from 'react-dom';\nimport debounce from 'lodash/debounce';\nimport debug from 'debug';\nimport { ModelSetEvent, SessionChangedEvent } from '@pie-framework/pie-player-events';\nimport { renderMath } from '@pie-lib/pie-toolbox/math-rendering';\nimport { updateSessionValue } from './session-updater';\n\nconst log = debug('pie-ui:multiple-choice');\n\nexport const isComplete = (session, model, audioComplete) => {\n const { autoplayAudioEnabled, completeAudioEnabled } = model || {};\n\n if (autoplayAudioEnabled && completeAudioEnabled && !audioComplete) {\n return false;\n }\n\n if (!session || !session.value) {\n return false;\n }\n\n const { choiceMode, minSelections = 1, maxSelections } = model || {};\n const selections = session.value.length || 0;\n\n if (choiceMode === 'radio') {\n return !!selections;\n }\n\n if (selections < minSelections || selections > maxSelections) {\n return false;\n }\n\n return true;\n};\n\nexport default class MultipleChoice extends HTMLElement {\n constructor() {\n super();\n this._model = null;\n this._session = null;\n this.audioComplete = false;\n\n this._rerender = debounce(\n () => {\n if (this._model && this._session) {\n var element = React.createElement(Main, {\n model: this._model,\n session: this._session,\n onChoiceChanged: this._onChange.bind(this),\n onShowCorrectToggle: this.onShowCorrectToggle.bind(this),\n });\n\n //TODO: aria-label is set in the _rerender because we need to change it when the model.choiceMode is updated. Consider revisiting the placement of the aria-label setting in the _rerender\n this.setAttribute(\n 'aria-label',\n this._model.choiceMode === 'radio' ? 'Multiple Choice Question' : 'Multiple Correct Answer Question',\n );\n this.setAttribute('role', 'region');\n this.setLangAttribute();\n\n ReactDOM.render(element, this, () => {\n log('render complete - render math');\n renderMath(this);\n });\n\n if (this._model.keyboardEventsEnabled === true) {\n this.enableKeyboardEvents();\n }\n } else {\n log('skip');\n }\n },\n 50,\n { leading: false, trailing: true },\n );\n\n this._dispatchResponseChanged = debounce(() => {\n this.dispatchEvent(\n new SessionChangedEvent(this.tagName.toLowerCase(), isComplete(this._session, this._model, this.audioComplete)),\n );\n });\n\n this._dispatchModelSet = debounce(\n () => {\n this.dispatchEvent(\n new ModelSetEvent(\n this.tagName.toLowerCase(),\n isComplete(this._session, this._model),\n this._model !== undefined,\n ),\n );\n },\n 50,\n { leading: false, trailing: true },\n );\n }\n\n onShowCorrectToggle() {\n renderMath(this);\n }\n\n setLangAttribute() {\n const language = this._model && typeof this._model.language ? this._model.language : '';\n const lang = language ? language.slice(0, 2) : 'en';\n this.setAttribute('lang', lang);\n }\n\n set model(s) {\n this._model = s;\n this._rerender();\n this._dispatchModelSet();\n }\n\n get session() {\n return this._session;\n }\n\n set session(s) {\n this._session = s;\n this._rerender();\n //TODO: remove this session-changed should only be emit on user change\n this._dispatchResponseChanged();\n }\n\n _onChange(data) {\n updateSessionValue(this._session, this._model.choiceMode, data);\n this._dispatchResponseChanged();\n this._rerender();\n }\n\n _createAudioInfoToast() {\n const info = document.createElement('div');\n info.id = 'play-audio-info';\n\n Object.assign(info.style, {\n position: 'absolute',\n top: 0,\n width:'100%',\n height: '100%',\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n background: 'white',\n zIndex: '1000'\n });\n\n const img = document.createElement('img');\n img.src = 'https://student.assessment.renaissance.com/ce/quizenginecap/assets/img/playAppsSel.gif';\n img.alt = 'Click anywhere to enable audio autoplay';\n img.width = 500;\n img.height = 300;\n\n info.appendChild(img);\n return info;\n }\n\n connectedCallback() {\n this._rerender();\n\n if (this._model && !this._model.autoplayAudioEnabled) {\n return;\n }\n\n // Observation: audio in Chrome will have the autoplay attribute,\n // while other browsers will not have the autoplay attribute and will need a user interaction to play the audio\n // This workaround fixes the issue of audio being cached and played on any user interaction in Safari and Firefox\n const observer = new MutationObserver((mutationsList, observer) => {\n mutationsList.forEach((mutation) => {\n if (mutation.type === 'childList') {\n const audio = this.querySelector('audio');\n const isInsidePrompt = audio && audio.closest('#preview-prompt');\n\n if (audio && !isInsidePrompt) return;\n if (!audio) return;\n\n const info = this._createAudioInfoToast();\n const container = this.querySelector('[class*=\"main\"]');\n const enableAudio = () => {\n if (this.querySelector('#play-audio-info')) {\n audio.play();\n container.removeChild(info);\n }\n\n document.removeEventListener('click', enableAudio);\n };\n\n // if the audio is paused, it means the user has not interacted with the page yet and the audio will not play\n // FIX FOR SAFARI: play with a slight delay to check if autoplay was blocked\n setTimeout(() => {\n if (audio.paused && !this.querySelector('#play-audio-info')) {\n // add info message as a toast to enable audio playback\n container.appendChild(info);\n document.addEventListener('click', enableAudio);\n } else {\n document.removeEventListener('click', enableAudio);\n }\n }, 500);\n\n // we need to listen for the playing event to remove the toast in case the audio plays because of re-rendering\n const handlePlaying = () => {\n const info = this.querySelector('#play-audio-info');\n\n if (info) {\n this.removeChild(info);\n }\n\n audio.removeEventListener('playing', handlePlaying);\n };\n\n audio.addEventListener('playing', handlePlaying);\n\n // we need to listen for the ended event to update the isComplete state\n const handleEnded = () => {\n this.audioComplete = true;\n this._dispatchResponseChanged();\n audio.removeEventListener('ended', handleEnded);\n };\n\n audio.addEventListener('ended', handleEnded);\n\n observer.disconnect();\n }\n });\n });\n\n observer.observe(this, { childList: true, subtree: true });\n }\n\n enableKeyboardEvents() {\n window.addEventListener('keydown', this.handleKeyDown.bind(this));\n }\n\n disconnectedCallback() {\n window.removeEventListener('keydown', this.handleKeyDown.bind(this));\n }\n\n /**\n * Handles global keyboard events for selecting or toggling multiple-choice answers.\n * Maps keys (1-9, 0, a-j, A-J) to choices and updates the session state accordingly.\n * Ensures valid key presses toggle or select the appropriate choice based on the model.\n */\n handleKeyDown(event) {\n if (!this._model || !this._session) {\n return;\n }\n\n const keyToIndex = (key) => {\n const numOffset = key >= '1' && key <= '9' ? key - '1' : key === '0' ? 9 : -1;\n const letterOffset = /^[a-jA-J]$/.test(key) ? key.toLowerCase().charCodeAt(0) - 'a'.charCodeAt(0) : -1;\n return numOffset >= 0 ? numOffset : letterOffset;\n };\n\n const choiceIndex = keyToIndex(event.key);\n\n if (choiceIndex === undefined || choiceIndex >= this._model.choices.length) {\n return;\n }\n\n const currentValue = this._session.value || [];\n const choiceId = this._model.choices[choiceIndex].value;\n\n const newValue = {\n value: choiceId,\n selected: !currentValue.includes(choiceId),\n };\n\n this._onChange(newValue);\n }\n}\n"],"file":"index.js"}
|
|
1
|
+
{"version":3,"sources":["../src/index.js"],"names":["log","isComplete","session","model","audioComplete","autoplayAudioEnabled","completeAudioEnabled","value","choiceMode","minSelections","maxSelections","selections","length","MultipleChoice","_model","_session","_boundHandleKeyDown","handleKeyDown","bind","_keyboardEventsEnabled","_rerender","element","React","createElement","Main","onChoiceChanged","_onChange","onShowCorrectToggle","setAttribute","setLangAttribute","ReactDOM","render","keyboardEventsEnabled","enableKeyboardEvents","leading","trailing","_dispatchResponseChanged","dispatchEvent","SessionChangedEvent","tagName","toLowerCase","_dispatchModelSet","ModelSetEvent","undefined","language","lang","slice","s","data","info","document","id","Object","assign","style","position","top","width","height","display","justifyContent","alignItems","background","zIndex","img","src","alt","appendChild","observer","MutationObserver","mutationsList","forEach","mutation","type","audio","querySelector","isInsidePrompt","closest","_createAudioInfoToast","container","enableAudio","play","audioStartTime","Date","getTime","removeChild","removeEventListener","setTimeout","paused","addEventListener","handlePlaying","handleEnded","audioEndTime","disconnect","observe","childList","subtree","window","event","keyToIndex","key","numOffset","letterOffset","test","charCodeAt","choiceIndex","choices","currentValue","choiceId","newValue","selected","includes","selector","HTMLElement"],"mappings":"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","sourcesContent":["import Main from './main';\nimport React from 'react';\nimport ReactDOM from 'react-dom';\nimport debounce from 'lodash/debounce';\nimport debug from 'debug';\nimport { ModelSetEvent, SessionChangedEvent } from '@pie-framework/pie-player-events';\nimport { renderMath } from '@pie-lib/pie-toolbox/math-rendering';\nimport { updateSessionValue, updateSessionMetadata } from './session-updater';\n\nconst log = debug('pie-ui:multiple-choice');\n\nexport const isComplete = (session, model, audioComplete) => {\n const { autoplayAudioEnabled, completeAudioEnabled } = model || {};\n\n if (autoplayAudioEnabled && completeAudioEnabled && !audioComplete) {\n return false;\n }\n\n if (!session || !session.value) {\n return false;\n }\n\n const { choiceMode, minSelections = 1, maxSelections } = model || {};\n const selections = session.value.length || 0;\n\n if (choiceMode === 'radio') {\n return !!selections;\n }\n\n if (selections < minSelections || selections > maxSelections) {\n return false;\n }\n\n return true;\n};\n\nexport default class MultipleChoice extends HTMLElement {\n constructor() {\n super();\n this._model = null;\n this._session = null;\n this.audioComplete = false;\n this._boundHandleKeyDown = this.handleKeyDown.bind(this);\n this._keyboardEventsEnabled = false;\n\n this._rerender = debounce(\n () => {\n if (this._model && this._session) {\n var element = React.createElement(Main, {\n model: this._model,\n session: this._session,\n onChoiceChanged: this._onChange.bind(this),\n onShowCorrectToggle: this.onShowCorrectToggle.bind(this),\n });\n\n //TODO: aria-label is set in the _rerender because we need to change it when the model.choiceMode is updated. Consider revisiting the placement of the aria-label setting in the _rerender\n this.setAttribute(\n 'aria-label',\n this._model.choiceMode === 'radio' ? 'Multiple Choice Question' : 'Multiple Correct Answer Question',\n );\n this.setAttribute('role', 'region');\n this.setLangAttribute();\n\n ReactDOM.render(element, this, () => {\n log('render complete - render math');\n renderMath(this);\n });\n\n if (this._model.keyboardEventsEnabled === true && !this._keyboardEventsEnabled) {\n this.enableKeyboardEvents();\n }\n } else {\n log('skip');\n }\n },\n 50,\n { leading: false, trailing: true },\n );\n\n this._dispatchResponseChanged = debounce(() => {\n this.dispatchEvent(\n new SessionChangedEvent(this.tagName.toLowerCase(), isComplete(this._session, this._model, this.audioComplete)),\n );\n });\n\n this._dispatchModelSet = debounce(\n () => {\n this.dispatchEvent(\n new ModelSetEvent(\n this.tagName.toLowerCase(),\n isComplete(this._session, this._model),\n this._model !== undefined,\n ),\n );\n },\n 50,\n { leading: false, trailing: true },\n );\n }\n\n onShowCorrectToggle() {\n renderMath(this);\n }\n\n setLangAttribute() {\n const language = this._model && typeof this._model.language ? this._model.language : '';\n const lang = language ? language.slice(0, 2) : 'en';\n this.setAttribute('lang', lang);\n }\n\n set model(s) {\n this._model = s;\n this._rerender();\n this._dispatchModelSet();\n }\n\n get session() {\n return this._session;\n }\n\n set session(s) {\n this._session = s;\n this._rerender();\n //TODO: remove this session-changed should only be emit on user change\n this._dispatchResponseChanged();\n }\n\n _onChange(data) {\n updateSessionValue(this._session, this._model.choiceMode, data);\n this._dispatchResponseChanged();\n this._rerender();\n }\n\n _createAudioInfoToast() {\n const info = document.createElement('div');\n info.id = 'play-audio-info';\n\n Object.assign(info.style, {\n position: 'absolute',\n top: 0,\n width:'100%',\n height: '100%',\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n background: 'white',\n zIndex: '1000'\n });\n\n const img = document.createElement('img');\n img.src = 'https://student.assessment.renaissance.com/ce/quizenginecap/assets/img/playAppsSel.gif';\n img.alt = 'Click anywhere to enable audio autoplay';\n img.width = 500;\n img.height = 300;\n\n info.appendChild(img);\n return info;\n }\n\n connectedCallback() {\n this._rerender();\n\n if (this._model && !this._model.autoplayAudioEnabled) {\n return;\n }\n\n // Observation: audio in Chrome will have the autoplay attribute,\n // while other browsers will not have the autoplay attribute and will need a user interaction to play the audio\n // This workaround fixes the issue of audio being cached and played on any user interaction in Safari and Firefox\n const observer = new MutationObserver((mutationsList, observer) => {\n mutationsList.forEach((mutation) => {\n if (mutation.type === 'childList') {\n const audio = this.querySelector('audio');\n const isInsidePrompt = audio && audio.closest('#preview-prompt');\n\n if (audio && !isInsidePrompt) return;\n if (!audio) return;\n\n const info = this._createAudioInfoToast();\n const container = this.querySelector('[class*=\"main\"]');\n const enableAudio = () => {\n if (this.querySelector('#play-audio-info')) {\n audio.play();\n updateSessionMetadata(this._session, { audioStartTime: new Date().getTime() });\n container.removeChild(info);\n\n }\n\n document.removeEventListener('click', enableAudio);\n };\n\n // if the audio is paused, it means the user has not interacted with the page yet and the audio will not play\n // FIX FOR SAFARI: play with a slight delay to check if autoplay was blocked\n setTimeout(() => {\n if (audio.paused && !this.querySelector('#play-audio-info')) {\n // add info message as a toast to enable audio playback\n container.appendChild(info);\n document.addEventListener('click', enableAudio);\n } else {\n document.removeEventListener('click', enableAudio);\n }\n }, 500);\n\n // we need to listen for the playing event to remove the toast in case the audio plays because of re-rendering\n const handlePlaying = () => {\n const info = this.querySelector('#play-audio-info');\n\n if (info) {\n this.removeChild(info);\n }\n\n audio.removeEventListener('playing', handlePlaying);\n };\n\n audio.addEventListener('playing', handlePlaying);\n\n // we need to listen for the ended event to update the isComplete state\n const handleEnded = () => {\n updateSessionMetadata(this._session, { audioEndTime: new Date().getTime() });\n this.audioComplete = true;\n this._dispatchResponseChanged();\n audio.removeEventListener('ended', handleEnded);\n };\n\n audio.addEventListener('ended', handleEnded);\n\n observer.disconnect();\n }\n });\n });\n\n observer.observe(this, { childList: true, subtree: true });\n }\n\n enableKeyboardEvents() {\n if (!this._keyboardEventsEnabled) {\n window.addEventListener('keydown', this._boundHandleKeyDown);\n this._keyboardEventsEnabled = true;\n }\n }\n\n disconnectedCallback() {\n if (this._keyboardEventsEnabled) {\n window.removeEventListener('keydown', this._boundHandleKeyDown);\n this._keyboardEventsEnabled = false;\n }\n }\n\n /**\n * Handles global keyboard events for selecting or toggling multiple-choice answers.\n * Maps keys (1-9, 0, a-j, A-J) to choices and updates the session state accordingly.\n * Ensures valid key presses toggle or select the appropriate choice based on the model.\n */\n handleKeyDown(event) {\n if (!this._model || !this._session) {\n return;\n }\n\n const keyToIndex = (key) => {\n const numOffset = key >= '1' && key <= '9' ? key - '1' : key === '0' ? 9 : -1;\n const letterOffset = /^[a-jA-J]$/.test(key) ? key.toLowerCase().charCodeAt(0) - 'a'.charCodeAt(0) : -1;\n return numOffset >= 0 ? numOffset : letterOffset;\n };\n\n const choiceIndex = keyToIndex(event.key);\n\n if (choiceIndex === undefined || choiceIndex >= this._model.choices.length) {\n return;\n }\n\n const currentValue = this._session.value || [];\n const choiceId = this._model.choices[choiceIndex].value;\n\n const newValue = {\n value: choiceId,\n selected: !currentValue.includes(choiceId),\n selector: 'Keyboard',\n };\n\n this._onChange(newValue);\n }\n}\n"],"file":"index.js"}
|
package/lib/multiple-choice.js
CHANGED
|
@@ -110,10 +110,7 @@ var MultipleChoice = /*#__PURE__*/function (_React$Component) {
|
|
|
110
110
|
var _this$props = _this.props,
|
|
111
111
|
maxSelections = _this$props.maxSelections,
|
|
112
112
|
onChoiceChanged = _this$props.onChoiceChanged,
|
|
113
|
-
session = _this$props.session;
|
|
114
|
-
|
|
115
|
-
var detail = event.nativeEvent.detail;
|
|
116
|
-
var selector = detail ? 'Mouse' : 'Keyboard';
|
|
113
|
+
session = _this$props.session;
|
|
117
114
|
|
|
118
115
|
if (session.value && session.value.length >= maxSelections) {
|
|
119
116
|
// show/hide max selections error when user select/deselect an answer
|
|
@@ -130,7 +127,7 @@ var MultipleChoice = /*#__PURE__*/function (_React$Component) {
|
|
|
130
127
|
onChoiceChanged({
|
|
131
128
|
value: value,
|
|
132
129
|
selected: checked,
|
|
133
|
-
selector:
|
|
130
|
+
selector: 'Mouse'
|
|
134
131
|
});
|
|
135
132
|
});
|
|
136
133
|
(0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onToggle", function () {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/multiple-choice.jsx"],"names":["translator","Translator","styles","theme","main","color","text","backgroundColor","background","partLabel","display","fontSize","margin","fontWeight","paddingBottom","spacing","unit","teacherInstructions","marginBottom","horizontalLayout","flexDirection","flexWrap","gridLayout","fieldset","border","padding","minWidth","srOnly","position","left","top","width","height","overflow","errorText","typography","palette","error","paddingTop","MultipleChoice","props","event","target","value","checked","maxSelections","onChoiceChanged","session","detail","nativeEvent","selector","length","setState","maxSelectionsErrorState","selected","mode","showCorrect","state","onShowCorrectToggle","choice","isCorrect","correct","isChecked","isSelected","undefined","alwaysShowCorrect","onToggle","bind","sessionValue","indexOf","nextProps","correctResponse","index","keyMode","String","fromCharCode","toUpperCase","choiceMode","classes","disabled","className","choices","gridColumns","prompt","responseCorrect","animationsDisabled","language","isSelectionButtonBelow","minSelections","autoplayAudioEnabled","isEvaluateMode","showCorrectAnswerToggle","columnsStyle","gridTemplateColumns","selections","addAutoplayAudio","test","navigator","userAgent","teacherInstructionsDiv","getMultipleChoiceMinSelectionErrorMessage","t","lng","renderHeading","hidden","visible","choicesLayout","map","selectedAnswerBackgroundColor","handleChange","hideTick","getChecked","getCorrectness","indexToSymbol","React","Component","PropTypes","string","oneOf","array","object","bool","func","isRequired","number","defaultProps"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { CorrectAnswerToggle } from '@pie-lib/pie-toolbox/correct-answer-toggle';\nimport classNames from 'classnames';\nimport { withStyles } from '@material-ui/core/styles';\nimport { color, Collapsible, PreviewPrompt } from '@pie-lib/pie-toolbox/render-ui';\nimport Translator from '@pie-lib/pie-toolbox/translator';\n\nimport StyledChoice from './choice';\n\n// MultipleChoice\n\nconst { translator } = Translator;\n\nconst styles = (theme) => ({\n main: {\n color: color.text(),\n backgroundColor: color.background(),\n '& *': {\n '-webkit-font-smoothing': 'antialiased',\n },\n },\n partLabel: {\n display: 'block',\n fontSize: 'inherit',\n margin: '0',\n fontWeight: 'normal',\n paddingBottom: theme.spacing.unit * 2,\n },\n teacherInstructions: {\n marginBottom: theme.spacing.unit * 2,\n },\n horizontalLayout: {\n display: 'flex',\n flexDirection: 'row',\n flexWrap: 'wrap',\n },\n gridLayout: {\n display: 'grid',\n },\n fieldset: {\n border: '0px',\n padding: '0.01em 0 0 0',\n margin: '0px',\n minWidth: '0px',\n },\n srOnly: {\n position: 'absolute',\n left: '-10000px',\n top: 'auto',\n width: '1px',\n height: '1px',\n overflow: 'hidden',\n },\n errorText: {\n fontSize: theme.typography.fontSize - 2,\n color: theme.palette.error.main,\n paddingTop: theme.spacing.unit,\n },\n});\n\nexport class MultipleChoice extends React.Component {\n static propTypes = {\n className: PropTypes.string,\n mode: PropTypes.oneOf(['gather', 'view', 'evaluate']),\n choiceMode: PropTypes.oneOf(['radio', 'checkbox']),\n keyMode: PropTypes.oneOf(['numbers', 'letters', 'none']),\n choices: PropTypes.array,\n partLabel: PropTypes.string,\n prompt: PropTypes.string,\n teacherInstructions: PropTypes.string,\n session: PropTypes.object,\n disabled: PropTypes.bool,\n onChoiceChanged: PropTypes.func,\n responseCorrect: PropTypes.bool,\n classes: PropTypes.object.isRequired,\n correctResponse: PropTypes.array,\n choicesLayout: PropTypes.oneOf(['vertical', 'grid', 'horizontal']),\n gridColumns: PropTypes.string,\n alwaysShowCorrect: PropTypes.bool,\n animationsDisabled: PropTypes.bool,\n language: PropTypes.string,\n selectedAnswerBackgroundColor: PropTypes.string,\n onShowCorrectToggle: PropTypes.func,\n isSelectionButtonBelow: PropTypes.bool,\n minSelections: PropTypes.number,\n maxSelections: PropTypes.number,\n autoplayAudioEnabled: PropTypes.bool,\n };\n\n constructor(props) {\n super(props);\n\n this.state = {\n showCorrect: this.props.alwaysShowCorrect || false,\n maxSelectionsErrorState: false,\n };\n\n this.onToggle = this.onToggle.bind(this);\n }\n\n isSelected(value) {\n const sessionValue = this.props.session && this.props.session.value;\n\n return sessionValue && sessionValue.indexOf && sessionValue.indexOf(value) >= 0;\n }\n\n // handleChange was added for accessibility. Please see comments and videos from PD-2441.\n handleChange = (event) => {\n const { value, checked } = event.target;\n const { maxSelections, onChoiceChanged, session } = this.props;\n \n // get input method used for selection\n const { detail } = event.nativeEvent;\n let selector = detail ? 'Mouse' : 'Keyboard';\n \n if (session.value && session.value.length >= maxSelections) {\n // show/hide max selections error when user select/deselect an answer\n this.setState({ maxSelectionsErrorState: checked });\n\n if (checked) {\n // prevent selecting more answers\n return;\n }\n }\n\n onChoiceChanged({ value, selected: checked, selector });\n };\n\n onToggle = () => {\n if (this.props.mode === 'evaluate') {\n this.setState({ showCorrect: !this.state.showCorrect }, () => {\n if (this.props.onShowCorrectToggle) {\n this.props.onShowCorrectToggle();\n }\n });\n }\n };\n\n UNSAFE_componentWillReceiveProps(nextProps) {\n if (!nextProps.correctResponse && this.state.showCorrect !== false) {\n this.setState({ showCorrect: false }, () => {\n if (this.props.onShowCorrectToggle) {\n this.props.onShowCorrectToggle();\n }\n });\n }\n\n if (nextProps.alwaysShowCorrect && this.state.showCorrect !== true) {\n this.setState({ showCorrect: true }, () => {\n if (this.props.onShowCorrectToggle) {\n this.props.onShowCorrectToggle();\n }\n });\n }\n }\n\n indexToSymbol(index) {\n if (this.props.keyMode === 'numbers') {\n return `${index + 1}`;\n }\n\n if (this.props.keyMode === 'letters') {\n return String.fromCharCode(97 + index).toUpperCase();\n }\n\n return '';\n }\n\n getCorrectness = (choice = {}) => {\n const isCorrect = choice.correct;\n const isChecked = this.isSelected(choice.value);\n\n if (this.state.showCorrect) {\n return isCorrect ? 'correct' : undefined;\n }\n\n if (isCorrect) {\n if (isChecked) {\n // A correct answer is selected: marked with a green checkmark\n return 'correct';\n } else {\n // A correct answer is NOT selected: marked with an orange X\n return 'incorrect';\n }\n } else {\n if (isChecked) {\n // An incorrect answer is selected: marked with an orange X\n return 'incorrect';\n } else {\n // An incorrect answer is NOT selected: not marked\n return undefined;\n }\n }\n };\n\n getChecked(choice) {\n if (this.state.showCorrect) {\n return choice.correct || false;\n }\n\n return this.isSelected(choice.value);\n }\n\n // renderHeading function was added for accessibility.\n renderHeading() {\n const { mode, choiceMode, classes } = this.props;\n\n if (mode !== 'gather') {\n return null;\n }\n\n return choiceMode === 'radio' ? (\n <h2 className={classes.srOnly}>Multiple Choice Question</h2>\n ) : (\n <h2 className={classes.srOnly}>Multiple Select Question</h2>\n );\n }\n\n render() {\n const {\n mode,\n disabled,\n className,\n choices = [],\n choiceMode,\n gridColumns,\n partLabel,\n prompt,\n responseCorrect,\n teacherInstructions,\n classes,\n alwaysShowCorrect,\n animationsDisabled,\n language,\n isSelectionButtonBelow,\n minSelections,\n maxSelections,\n autoplayAudioEnabled,\n session,\n } = this.props;\n const { showCorrect, maxSelectionsErrorState } = this.state;\n const isEvaluateMode = mode === 'evaluate';\n const showCorrectAnswerToggle = isEvaluateMode && !responseCorrect;\n const columnsStyle = gridColumns > 1 ? { gridTemplateColumns: `repeat(${gridColumns}, 1fr)` } : undefined;\n const selections = (session.value && session.value.length) || 0;\n // Safari, Firefox, and Edge do not support autoplay audio smoothly in our use case\n const addAutoplayAudio = autoplayAudioEnabled && !(/Safari|Firefox|Edg/.test(navigator.userAgent) && !/Chrome/.test(navigator.userAgent));\n\n const teacherInstructionsDiv = (\n <PreviewPrompt\n tagName=\"div\"\n className=\"prompt\"\n defaultClassName=\"teacher-instructions\"\n prompt={teacherInstructions}\n />\n );\n\n const getMultipleChoiceMinSelectionErrorMessage = () => {\n if (minSelections && maxSelections) {\n return minSelections === maxSelections\n ? translator.t('translation:multipleChoice:minmaxSelections_equal', { lng: language, minSelections })\n : translator.t('translation:multipleChoice:minmaxSelections_range', { lng: language, minSelections, maxSelections });\n }\n\n if (minSelections) {\n return translator.t('translation:multipleChoice:minSelections', { lng: language, minSelections });\n }\n\n return '';\n };\n\n return (\n <div className={classNames(classes.main, className, 'multiple-choice')}>\n {partLabel && <h3 className={classes.partLabel}>{partLabel}</h3>}\n\n {this.renderHeading()}\n\n {teacherInstructions && (\n <div className={classes.teacherInstructions}>\n {!animationsDisabled ? (\n <Collapsible\n labels={{\n hidden: 'Show Teacher Instructions',\n visible: 'Hide Teacher Instructions',\n }}\n >\n {teacherInstructionsDiv}\n </Collapsible>\n ) : (\n teacherInstructionsDiv\n )}\n </div>\n )}\n\n <fieldset className={classes.fieldset}>\n <PreviewPrompt\n className=\"prompt\"\n defaultClassName=\"prompt\"\n prompt={prompt}\n tagName={'legend'}\n autoplayAudioEnabled={addAutoplayAudio}\n />\n\n {!alwaysShowCorrect && (\n <CorrectAnswerToggle\n show={showCorrectAnswerToggle}\n toggled={showCorrect}\n onToggle={this.onToggle.bind(this)}\n language={language}\n />\n )}\n\n <div\n className={classNames({\n [classes.gridLayout]: this.props.choicesLayout === 'grid',\n [classes.horizontalLayout]: this.props.choicesLayout === 'horizontal',\n })}\n style={columnsStyle}\n >\n {choices.map((choice, index) => (\n <StyledChoice\n choicesLayout={this.props.choicesLayout}\n selectedAnswerBackgroundColor={this.props.selectedAnswerBackgroundColor}\n gridColumns={gridColumns}\n key={`choice-${index}`}\n choice={choice}\n index={index}\n choicesLength={choices.length}\n showCorrect={showCorrect}\n isEvaluateMode={isEvaluateMode}\n choiceMode={choiceMode}\n disabled={disabled}\n onChoiceChanged={this.handleChange}\n hideTick={choice.hideTick}\n checked={this.getChecked(choice)}\n correctness={isEvaluateMode ? this.getCorrectness(choice) : undefined}\n displayKey={this.indexToSymbol(index)}\n isSelectionButtonBelow={isSelectionButtonBelow}\n />\n ))}\n </div>\n </fieldset>\n\n {choiceMode === 'checkbox' && (selections < minSelections) && (\n <div className={classes.errorText}>\n {getMultipleChoiceMinSelectionErrorMessage()}\n </div>\n )}\n {choiceMode === 'checkbox' && maxSelectionsErrorState && (\n <div className={classes.errorText}>\n {translator.t(`translation:multipleChoice:maxSelections_${maxSelections === 1 ? 'one' : 'other'}`, {\n lng: language,\n maxSelections,\n })}\n </div>\n )}\n </div>\n );\n }\n}\n\nMultipleChoice.defaultProps = {\n session: {\n value: [],\n },\n};\n\nexport default withStyles(styles)(MultipleChoice);\n"],"file":"multiple-choice.js"}
|
|
1
|
+
{"version":3,"sources":["../src/multiple-choice.jsx"],"names":["translator","Translator","styles","theme","main","color","text","backgroundColor","background","partLabel","display","fontSize","margin","fontWeight","paddingBottom","spacing","unit","teacherInstructions","marginBottom","horizontalLayout","flexDirection","flexWrap","gridLayout","fieldset","border","padding","minWidth","srOnly","position","left","top","width","height","overflow","errorText","typography","palette","error","paddingTop","MultipleChoice","props","event","target","value","checked","maxSelections","onChoiceChanged","session","length","setState","maxSelectionsErrorState","selected","selector","mode","showCorrect","state","onShowCorrectToggle","choice","isCorrect","correct","isChecked","isSelected","undefined","alwaysShowCorrect","onToggle","bind","sessionValue","indexOf","nextProps","correctResponse","index","keyMode","String","fromCharCode","toUpperCase","choiceMode","classes","disabled","className","choices","gridColumns","prompt","responseCorrect","animationsDisabled","language","isSelectionButtonBelow","minSelections","autoplayAudioEnabled","isEvaluateMode","showCorrectAnswerToggle","columnsStyle","gridTemplateColumns","selections","addAutoplayAudio","test","navigator","userAgent","teacherInstructionsDiv","getMultipleChoiceMinSelectionErrorMessage","t","lng","renderHeading","hidden","visible","choicesLayout","map","selectedAnswerBackgroundColor","handleChange","hideTick","getChecked","getCorrectness","indexToSymbol","React","Component","PropTypes","string","oneOf","array","object","bool","func","isRequired","number","defaultProps"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { CorrectAnswerToggle } from '@pie-lib/pie-toolbox/correct-answer-toggle';\nimport classNames from 'classnames';\nimport { withStyles } from '@material-ui/core/styles';\nimport { color, Collapsible, PreviewPrompt } from '@pie-lib/pie-toolbox/render-ui';\nimport Translator from '@pie-lib/pie-toolbox/translator';\n\nimport StyledChoice from './choice';\n\n// MultipleChoice\n\nconst { translator } = Translator;\n\nconst styles = (theme) => ({\n main: {\n color: color.text(),\n backgroundColor: color.background(),\n '& *': {\n '-webkit-font-smoothing': 'antialiased',\n },\n },\n partLabel: {\n display: 'block',\n fontSize: 'inherit',\n margin: '0',\n fontWeight: 'normal',\n paddingBottom: theme.spacing.unit * 2,\n },\n teacherInstructions: {\n marginBottom: theme.spacing.unit * 2,\n },\n horizontalLayout: {\n display: 'flex',\n flexDirection: 'row',\n flexWrap: 'wrap',\n },\n gridLayout: {\n display: 'grid',\n },\n fieldset: {\n border: '0px',\n padding: '0.01em 0 0 0',\n margin: '0px',\n minWidth: '0px',\n },\n srOnly: {\n position: 'absolute',\n left: '-10000px',\n top: 'auto',\n width: '1px',\n height: '1px',\n overflow: 'hidden',\n },\n errorText: {\n fontSize: theme.typography.fontSize - 2,\n color: theme.palette.error.main,\n paddingTop: theme.spacing.unit,\n },\n});\n\nexport class MultipleChoice extends React.Component {\n static propTypes = {\n className: PropTypes.string,\n mode: PropTypes.oneOf(['gather', 'view', 'evaluate']),\n choiceMode: PropTypes.oneOf(['radio', 'checkbox']),\n keyMode: PropTypes.oneOf(['numbers', 'letters', 'none']),\n choices: PropTypes.array,\n partLabel: PropTypes.string,\n prompt: PropTypes.string,\n teacherInstructions: PropTypes.string,\n session: PropTypes.object,\n disabled: PropTypes.bool,\n onChoiceChanged: PropTypes.func,\n responseCorrect: PropTypes.bool,\n classes: PropTypes.object.isRequired,\n correctResponse: PropTypes.array,\n choicesLayout: PropTypes.oneOf(['vertical', 'grid', 'horizontal']),\n gridColumns: PropTypes.string,\n alwaysShowCorrect: PropTypes.bool,\n animationsDisabled: PropTypes.bool,\n language: PropTypes.string,\n selectedAnswerBackgroundColor: PropTypes.string,\n onShowCorrectToggle: PropTypes.func,\n isSelectionButtonBelow: PropTypes.bool,\n minSelections: PropTypes.number,\n maxSelections: PropTypes.number,\n autoplayAudioEnabled: PropTypes.bool,\n };\n\n constructor(props) {\n super(props);\n\n this.state = {\n showCorrect: this.props.alwaysShowCorrect || false,\n maxSelectionsErrorState: false,\n };\n\n this.onToggle = this.onToggle.bind(this);\n }\n\n isSelected(value) {\n const sessionValue = this.props.session && this.props.session.value;\n\n return sessionValue && sessionValue.indexOf && sessionValue.indexOf(value) >= 0;\n }\n\n // handleChange was added for accessibility. Please see comments and videos from PD-2441.\n handleChange = (event) => {\n const { value, checked } = event.target;\n const { maxSelections, onChoiceChanged, session } = this.props;\n \n if (session.value && session.value.length >= maxSelections) {\n // show/hide max selections error when user select/deselect an answer\n this.setState({ maxSelectionsErrorState: checked });\n\n if (checked) {\n // prevent selecting more answers\n return;\n }\n }\n\n onChoiceChanged({ value, selected: checked, selector: 'Mouse' });\n };\n\n onToggle = () => {\n if (this.props.mode === 'evaluate') {\n this.setState({ showCorrect: !this.state.showCorrect }, () => {\n if (this.props.onShowCorrectToggle) {\n this.props.onShowCorrectToggle();\n }\n });\n }\n };\n\n UNSAFE_componentWillReceiveProps(nextProps) {\n if (!nextProps.correctResponse && this.state.showCorrect !== false) {\n this.setState({ showCorrect: false }, () => {\n if (this.props.onShowCorrectToggle) {\n this.props.onShowCorrectToggle();\n }\n });\n }\n\n if (nextProps.alwaysShowCorrect && this.state.showCorrect !== true) {\n this.setState({ showCorrect: true }, () => {\n if (this.props.onShowCorrectToggle) {\n this.props.onShowCorrectToggle();\n }\n });\n }\n }\n\n indexToSymbol(index) {\n if (this.props.keyMode === 'numbers') {\n return `${index + 1}`;\n }\n\n if (this.props.keyMode === 'letters') {\n return String.fromCharCode(97 + index).toUpperCase();\n }\n\n return '';\n }\n\n getCorrectness = (choice = {}) => {\n const isCorrect = choice.correct;\n const isChecked = this.isSelected(choice.value);\n\n if (this.state.showCorrect) {\n return isCorrect ? 'correct' : undefined;\n }\n\n if (isCorrect) {\n if (isChecked) {\n // A correct answer is selected: marked with a green checkmark\n return 'correct';\n } else {\n // A correct answer is NOT selected: marked with an orange X\n return 'incorrect';\n }\n } else {\n if (isChecked) {\n // An incorrect answer is selected: marked with an orange X\n return 'incorrect';\n } else {\n // An incorrect answer is NOT selected: not marked\n return undefined;\n }\n }\n };\n\n getChecked(choice) {\n if (this.state.showCorrect) {\n return choice.correct || false;\n }\n\n return this.isSelected(choice.value);\n }\n\n // renderHeading function was added for accessibility.\n renderHeading() {\n const { mode, choiceMode, classes } = this.props;\n\n if (mode !== 'gather') {\n return null;\n }\n\n return choiceMode === 'radio' ? (\n <h2 className={classes.srOnly}>Multiple Choice Question</h2>\n ) : (\n <h2 className={classes.srOnly}>Multiple Select Question</h2>\n );\n }\n\n render() {\n const {\n mode,\n disabled,\n className,\n choices = [],\n choiceMode,\n gridColumns,\n partLabel,\n prompt,\n responseCorrect,\n teacherInstructions,\n classes,\n alwaysShowCorrect,\n animationsDisabled,\n language,\n isSelectionButtonBelow,\n minSelections,\n maxSelections,\n autoplayAudioEnabled,\n session,\n } = this.props;\n const { showCorrect, maxSelectionsErrorState } = this.state;\n const isEvaluateMode = mode === 'evaluate';\n const showCorrectAnswerToggle = isEvaluateMode && !responseCorrect;\n const columnsStyle = gridColumns > 1 ? { gridTemplateColumns: `repeat(${gridColumns}, 1fr)` } : undefined;\n const selections = (session.value && session.value.length) || 0;\n // Safari, Firefox, and Edge do not support autoplay audio smoothly in our use case\n const addAutoplayAudio = autoplayAudioEnabled && !(/Safari|Firefox|Edg/.test(navigator.userAgent) && !/Chrome/.test(navigator.userAgent));\n\n const teacherInstructionsDiv = (\n <PreviewPrompt\n tagName=\"div\"\n className=\"prompt\"\n defaultClassName=\"teacher-instructions\"\n prompt={teacherInstructions}\n />\n );\n\n const getMultipleChoiceMinSelectionErrorMessage = () => {\n if (minSelections && maxSelections) {\n return minSelections === maxSelections\n ? translator.t('translation:multipleChoice:minmaxSelections_equal', { lng: language, minSelections })\n : translator.t('translation:multipleChoice:minmaxSelections_range', { lng: language, minSelections, maxSelections });\n }\n\n if (minSelections) {\n return translator.t('translation:multipleChoice:minSelections', { lng: language, minSelections });\n }\n\n return '';\n };\n\n return (\n <div className={classNames(classes.main, className, 'multiple-choice')}>\n {partLabel && <h3 className={classes.partLabel}>{partLabel}</h3>}\n\n {this.renderHeading()}\n\n {teacherInstructions && (\n <div className={classes.teacherInstructions}>\n {!animationsDisabled ? (\n <Collapsible\n labels={{\n hidden: 'Show Teacher Instructions',\n visible: 'Hide Teacher Instructions',\n }}\n >\n {teacherInstructionsDiv}\n </Collapsible>\n ) : (\n teacherInstructionsDiv\n )}\n </div>\n )}\n\n <fieldset className={classes.fieldset}>\n <PreviewPrompt\n className=\"prompt\"\n defaultClassName=\"prompt\"\n prompt={prompt}\n tagName={'legend'}\n autoplayAudioEnabled={addAutoplayAudio}\n />\n\n {!alwaysShowCorrect && (\n <CorrectAnswerToggle\n show={showCorrectAnswerToggle}\n toggled={showCorrect}\n onToggle={this.onToggle.bind(this)}\n language={language}\n />\n )}\n\n <div\n className={classNames({\n [classes.gridLayout]: this.props.choicesLayout === 'grid',\n [classes.horizontalLayout]: this.props.choicesLayout === 'horizontal',\n })}\n style={columnsStyle}\n >\n {choices.map((choice, index) => (\n <StyledChoice\n choicesLayout={this.props.choicesLayout}\n selectedAnswerBackgroundColor={this.props.selectedAnswerBackgroundColor}\n gridColumns={gridColumns}\n key={`choice-${index}`}\n choice={choice}\n index={index}\n choicesLength={choices.length}\n showCorrect={showCorrect}\n isEvaluateMode={isEvaluateMode}\n choiceMode={choiceMode}\n disabled={disabled}\n onChoiceChanged={this.handleChange}\n hideTick={choice.hideTick}\n checked={this.getChecked(choice)}\n correctness={isEvaluateMode ? this.getCorrectness(choice) : undefined}\n displayKey={this.indexToSymbol(index)}\n isSelectionButtonBelow={isSelectionButtonBelow}\n />\n ))}\n </div>\n </fieldset>\n\n {choiceMode === 'checkbox' && (selections < minSelections) && (\n <div className={classes.errorText}>\n {getMultipleChoiceMinSelectionErrorMessage()}\n </div>\n )}\n {choiceMode === 'checkbox' && maxSelectionsErrorState && (\n <div className={classes.errorText}>\n {translator.t(`translation:multipleChoice:maxSelections_${maxSelections === 1 ? 'one' : 'other'}`, {\n lng: language,\n maxSelections,\n })}\n </div>\n )}\n </div>\n );\n }\n}\n\nMultipleChoice.defaultProps = {\n session: {\n value: [],\n },\n};\n\nexport default withStyles(styles)(MultipleChoice);\n"],"file":"multiple-choice.js"}
|
package/lib/session-updater.js
CHANGED
|
@@ -5,6 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
|
|
|
5
5
|
Object.defineProperty(exports, "__esModule", {
|
|
6
6
|
value: true
|
|
7
7
|
});
|
|
8
|
+
exports.updateSessionMetadata = updateSessionMetadata;
|
|
8
9
|
exports.updateSessionValue = updateSessionValue;
|
|
9
10
|
|
|
10
11
|
var _concat = _interopRequireDefault(require("lodash/concat"));
|
|
@@ -30,9 +31,20 @@ function updateSessionValue(session, choiceMode, data) {
|
|
|
30
31
|
} else {
|
|
31
32
|
session.value = [];
|
|
32
33
|
}
|
|
33
|
-
} //update session metadata
|
|
34
|
+
} //update session value metadata
|
|
34
35
|
|
|
35
36
|
|
|
36
|
-
session.selector = data.selector;
|
|
37
|
+
session.selector = data.selector; //the input method used to select the choice (e.g. mouse, keyboard)
|
|
38
|
+
}
|
|
39
|
+
|
|
40
|
+
function updateSessionMetadata(session, metadata) {
|
|
41
|
+
session.audioStartTime = metadata.audioStartTime || session.audioStartTime; //timestamp when auto-played audio started playing
|
|
42
|
+
|
|
43
|
+
session.audioEndTime = metadata.audioEndTime || session.audioEndTime; //timestamp when auto-played audio completed playing
|
|
44
|
+
|
|
45
|
+
if (!session.waitTime && session.audioStartTime && session.audioEndTime) {
|
|
46
|
+
// waitTime is elapsed time (in seconds) the user waited for auto-played audio to finish
|
|
47
|
+
session.waitTime = (session.audioEndTime - session.audioStartTime) / 1000;
|
|
48
|
+
}
|
|
37
49
|
}
|
|
38
50
|
//# sourceMappingURL=session-updater.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/session-updater.js"],"names":["updateSessionValue","session","choiceMode","data","value","selected","selector"],"mappings":"
|
|
1
|
+
{"version":3,"sources":["../src/session-updater.js"],"names":["updateSessionValue","session","choiceMode","data","value","selected","selector","updateSessionMetadata","metadata","audioStartTime","audioEndTime","waitTime"],"mappings":";;;;;;;;;;AAAA;;AACA;;AACA;;AAEO,SAASA,kBAAT,CAA4BC,OAA5B,EAAqCC,UAArC,EAAiDC,IAAjD,EAAuD;AAC5DF,EAAAA,OAAO,CAACG,KAAR,GAAgBH,OAAO,CAACG,KAAR,IAAiB,EAAjC;;AACA,MAAIF,UAAU,KAAK,UAAnB,EAA+B;AAC7B,QAAIC,IAAI,CAACE,QAAT,EAAmB;AACjBJ,MAAAA,OAAO,CAACG,KAAR,GAAgB,sBAAK,wBAAOH,OAAO,CAACG,KAAf,EAAsB,CAACD,IAAI,CAACC,KAAN,CAAtB,CAAL,CAAhB;AACD,KAFD,MAEO;AACLH,MAAAA,OAAO,CAACG,KAAR,GAAgB,yBAAQH,OAAO,CAACG,KAAhB,EAAuBD,IAAI,CAACC,KAA5B,CAAhB;AACD;AACF;;AAED,MAAIF,UAAU,KAAK,OAAnB,EAA4B;AAC1B,QAAIC,IAAI,CAACE,QAAT,EAAmB;AACjBJ,MAAAA,OAAO,CAACG,KAAR,GAAgB,CAACD,IAAI,CAACC,KAAN,CAAhB;AACD,KAFD,MAEO;AACLH,MAAAA,OAAO,CAACG,KAAR,GAAgB,EAAhB;AACD;AACF,GAhB2D,CAkB5D;;;AACAH,EAAAA,OAAO,CAACK,QAAR,GAAmBH,IAAI,CAACG,QAAxB,CAnB4D,CAmB1B;AACnC;;AAEM,SAASC,qBAAT,CAA+BN,OAA/B,EAAwCO,QAAxC,EAAkD;AACvDP,EAAAA,OAAO,CAACQ,cAAR,GAAyBD,QAAQ,CAACC,cAAT,IAA2BR,OAAO,CAACQ,cAA5D,CADuD,CACqB;;AAC5ER,EAAAA,OAAO,CAACS,YAAR,GAAuBF,QAAQ,CAACE,YAAT,IAAyBT,OAAO,CAACS,YAAxD,CAFuD,CAEe;;AAEtE,MAAG,CAACT,OAAO,CAACU,QAAT,IAAqBV,OAAO,CAACQ,cAA7B,IAA+CR,OAAO,CAACS,YAA1D,EAAwE;AACtE;AACAT,IAAAA,OAAO,CAACU,QAAR,GAAmB,CAACV,OAAO,CAACS,YAAR,GAAuBT,OAAO,CAACQ,cAAhC,IAAkD,IAArE;AACD;AACF","sourcesContent":["import concat from 'lodash/concat';\nimport uniq from 'lodash/uniq';\nimport without from 'lodash/without';\n\nexport function updateSessionValue(session, choiceMode, data) {\n session.value = session.value || [];\n if (choiceMode === 'checkbox') {\n if (data.selected) {\n session.value = uniq(concat(session.value, [data.value]));\n } else {\n session.value = without(session.value, data.value);\n }\n }\n\n if (choiceMode === 'radio') {\n if (data.selected) {\n session.value = [data.value];\n } else {\n session.value = [];\n }\n }\n \n //update session value metadata\n session.selector = data.selector; //the input method used to select the choice (e.g. mouse, keyboard)\n}\n\nexport function updateSessionMetadata(session, metadata) {\n session.audioStartTime = metadata.audioStartTime || session.audioStartTime; //timestamp when auto-played audio started playing\n session.audioEndTime = metadata.audioEndTime || session.audioEndTime; //timestamp when auto-played audio completed playing\n \n if(!session.waitTime && session.audioStartTime && session.audioEndTime) {\n // waitTime is elapsed time (in seconds) the user waited for auto-played audio to finish\n session.waitTime = (session.audioEndTime - session.audioStartTime) / 1000;\n }\n}\n"],"file":"session-updater.js"}
|
package/module/element.js
CHANGED
|
@@ -12682,8 +12682,6 @@ class MultipleChoice$1 extends React$2.Component {
|
|
|
12682
12682
|
this.handleChange = event => {
|
|
12683
12683
|
const {value, checked} = event.target;
|
|
12684
12684
|
const {maxSelections, onChoiceChanged, session} = this.props;
|
|
12685
|
-
const {detail} = event.nativeEvent;
|
|
12686
|
-
let selector = detail ? 'Mouse' : 'Keyboard';
|
|
12687
12685
|
if (session.value && session.value.length >= maxSelections) {
|
|
12688
12686
|
this.setState({
|
|
12689
12687
|
maxSelectionsErrorState: checked
|
|
@@ -12695,7 +12693,7 @@ class MultipleChoice$1 extends React$2.Component {
|
|
|
12695
12693
|
onChoiceChanged({
|
|
12696
12694
|
value,
|
|
12697
12695
|
selected: checked,
|
|
12698
|
-
selector
|
|
12696
|
+
selector: 'Mouse'
|
|
12699
12697
|
});
|
|
12700
12698
|
};
|
|
12701
12699
|
}
|
|
@@ -12779,14 +12777,14 @@ class MultipleChoice$1 extends React$2.Component {
|
|
|
12779
12777
|
__self: this,
|
|
12780
12778
|
__source: {
|
|
12781
12779
|
fileName: _jsxFileName$1,
|
|
12782
|
-
lineNumber:
|
|
12780
|
+
lineNumber: 210
|
|
12783
12781
|
}
|
|
12784
12782
|
}, "Multiple Choice Question") : React$2.createElement('h2', {
|
|
12785
12783
|
className: classes.srOnly,
|
|
12786
12784
|
__self: this,
|
|
12787
12785
|
__source: {
|
|
12788
12786
|
fileName: _jsxFileName$1,
|
|
12789
|
-
lineNumber:
|
|
12787
|
+
lineNumber: 212
|
|
12790
12788
|
}
|
|
12791
12789
|
}, "Multiple Select Question");
|
|
12792
12790
|
}
|
|
@@ -12808,7 +12806,7 @@ class MultipleChoice$1 extends React$2.Component {
|
|
|
12808
12806
|
__self: this,
|
|
12809
12807
|
__source: {
|
|
12810
12808
|
fileName: _jsxFileName$1,
|
|
12811
|
-
lineNumber:
|
|
12809
|
+
lineNumber: 247
|
|
12812
12810
|
}
|
|
12813
12811
|
});
|
|
12814
12812
|
const getMultipleChoiceMinSelectionErrorMessage = () => {
|
|
@@ -12835,21 +12833,21 @@ class MultipleChoice$1 extends React$2.Component {
|
|
|
12835
12833
|
__self: this,
|
|
12836
12834
|
__source: {
|
|
12837
12835
|
fileName: _jsxFileName$1,
|
|
12838
|
-
lineNumber:
|
|
12836
|
+
lineNumber: 270
|
|
12839
12837
|
}
|
|
12840
12838
|
}, partLabel && React$2.createElement('h3', {
|
|
12841
12839
|
className: classes.partLabel,
|
|
12842
12840
|
__self: this,
|
|
12843
12841
|
__source: {
|
|
12844
12842
|
fileName: _jsxFileName$1,
|
|
12845
|
-
lineNumber:
|
|
12843
|
+
lineNumber: 271
|
|
12846
12844
|
}
|
|
12847
12845
|
}, partLabel), this.renderHeading(), teacherInstructions && React$2.createElement('div', {
|
|
12848
12846
|
className: classes.teacherInstructions,
|
|
12849
12847
|
__self: this,
|
|
12850
12848
|
__source: {
|
|
12851
12849
|
fileName: _jsxFileName$1,
|
|
12852
|
-
lineNumber:
|
|
12850
|
+
lineNumber: 276
|
|
12853
12851
|
}
|
|
12854
12852
|
}, !animationsDisabled ? React$2.createElement(Collapsible, {
|
|
12855
12853
|
labels: {
|
|
@@ -12859,14 +12857,14 @@ class MultipleChoice$1 extends React$2.Component {
|
|
|
12859
12857
|
__self: this,
|
|
12860
12858
|
__source: {
|
|
12861
12859
|
fileName: _jsxFileName$1,
|
|
12862
|
-
lineNumber:
|
|
12860
|
+
lineNumber: 278
|
|
12863
12861
|
}
|
|
12864
12862
|
}, teacherInstructionsDiv) : teacherInstructionsDiv), React$2.createElement('fieldset', {
|
|
12865
12863
|
className: classes.fieldset,
|
|
12866
12864
|
__self: this,
|
|
12867
12865
|
__source: {
|
|
12868
12866
|
fileName: _jsxFileName$1,
|
|
12869
|
-
lineNumber:
|
|
12867
|
+
lineNumber: 292
|
|
12870
12868
|
}
|
|
12871
12869
|
}, React$2.createElement(PreviewPrompt, {
|
|
12872
12870
|
className: "prompt",
|
|
@@ -12877,7 +12875,7 @@ class MultipleChoice$1 extends React$2.Component {
|
|
|
12877
12875
|
__self: this,
|
|
12878
12876
|
__source: {
|
|
12879
12877
|
fileName: _jsxFileName$1,
|
|
12880
|
-
lineNumber:
|
|
12878
|
+
lineNumber: 293
|
|
12881
12879
|
}
|
|
12882
12880
|
}), !alwaysShowCorrect && React$2.createElement(CorrectAnswerToggle, {
|
|
12883
12881
|
show: showCorrectAnswerToggle,
|
|
@@ -12887,7 +12885,7 @@ class MultipleChoice$1 extends React$2.Component {
|
|
|
12887
12885
|
__self: this,
|
|
12888
12886
|
__source: {
|
|
12889
12887
|
fileName: _jsxFileName$1,
|
|
12890
|
-
lineNumber:
|
|
12888
|
+
lineNumber: 302
|
|
12891
12889
|
}
|
|
12892
12890
|
}), React$2.createElement('div', {
|
|
12893
12891
|
className: classNames({
|
|
@@ -12898,7 +12896,7 @@ class MultipleChoice$1 extends React$2.Component {
|
|
|
12898
12896
|
__self: this,
|
|
12899
12897
|
__source: {
|
|
12900
12898
|
fileName: _jsxFileName$1,
|
|
12901
|
-
lineNumber:
|
|
12899
|
+
lineNumber: 310
|
|
12902
12900
|
}
|
|
12903
12901
|
}, choices.map((choice, index) => React$2.createElement(StyledChoice, {
|
|
12904
12902
|
choicesLayout: this.props.choicesLayout,
|
|
@@ -12921,21 +12919,21 @@ class MultipleChoice$1 extends React$2.Component {
|
|
|
12921
12919
|
__self: this,
|
|
12922
12920
|
__source: {
|
|
12923
12921
|
fileName: _jsxFileName$1,
|
|
12924
|
-
lineNumber:
|
|
12922
|
+
lineNumber: 318
|
|
12925
12923
|
}
|
|
12926
12924
|
})))), choiceMode === 'checkbox' && selections < minSelections && React$2.createElement('div', {
|
|
12927
12925
|
className: classes.errorText,
|
|
12928
12926
|
__self: this,
|
|
12929
12927
|
__source: {
|
|
12930
12928
|
fileName: _jsxFileName$1,
|
|
12931
|
-
lineNumber:
|
|
12929
|
+
lineNumber: 342
|
|
12932
12930
|
}
|
|
12933
12931
|
}, getMultipleChoiceMinSelectionErrorMessage()), choiceMode === 'checkbox' && maxSelectionsErrorState && React$2.createElement('div', {
|
|
12934
12932
|
className: classes.errorText,
|
|
12935
12933
|
__self: this,
|
|
12936
12934
|
__source: {
|
|
12937
12935
|
fileName: _jsxFileName$1,
|
|
12938
|
-
lineNumber:
|
|
12936
|
+
lineNumber: 347
|
|
12939
12937
|
}
|
|
12940
12938
|
}, translator.t(`translation:multipleChoice:maxSelections_${maxSelections === 1 ? 'one' : 'other'}`, {
|
|
12941
12939
|
lng: language,
|
|
@@ -13085,6 +13083,13 @@ function updateSessionValue(session, choiceMode, data) {
|
|
|
13085
13083
|
}
|
|
13086
13084
|
session.selector = data.selector;
|
|
13087
13085
|
}
|
|
13086
|
+
function updateSessionMetadata(session, metadata) {
|
|
13087
|
+
session.audioStartTime = metadata.audioStartTime || session.audioStartTime;
|
|
13088
|
+
session.audioEndTime = metadata.audioEndTime || session.audioEndTime;
|
|
13089
|
+
if (!session.waitTime && session.audioStartTime && session.audioEndTime) {
|
|
13090
|
+
session.waitTime = (session.audioEndTime - session.audioStartTime) / 1000;
|
|
13091
|
+
}
|
|
13092
|
+
}
|
|
13088
13093
|
const React = _dll_react;
|
|
13089
13094
|
const ReactDOM = _dll_react_dom;
|
|
13090
13095
|
const {debounce: debounce} = _dll_lodash;
|
|
@@ -13115,6 +13120,8 @@ class MultipleChoice extends HTMLElement {
|
|
|
13115
13120
|
this._model = null;
|
|
13116
13121
|
this._session = null;
|
|
13117
13122
|
this.audioComplete = false;
|
|
13123
|
+
this._boundHandleKeyDown = this.handleKeyDown.bind(this);
|
|
13124
|
+
this._keyboardEventsEnabled = false;
|
|
13118
13125
|
this._rerender = debounce(() => {
|
|
13119
13126
|
if (this._model && this._session) {
|
|
13120
13127
|
var element = React.createElement(Root, {
|
|
@@ -13130,7 +13137,7 @@ class MultipleChoice extends HTMLElement {
|
|
|
13130
13137
|
log('render complete - render math');
|
|
13131
13138
|
renderMath(this);
|
|
13132
13139
|
});
|
|
13133
|
-
if (this._model.keyboardEventsEnabled === true) {
|
|
13140
|
+
if (this._model.keyboardEventsEnabled === true && !this._keyboardEventsEnabled) {
|
|
13134
13141
|
this.enableKeyboardEvents();
|
|
13135
13142
|
}
|
|
13136
13143
|
} else {
|
|
@@ -13215,6 +13222,9 @@ class MultipleChoice extends HTMLElement {
|
|
|
13215
13222
|
const enableAudio = () => {
|
|
13216
13223
|
if (this.querySelector('#play-audio-info')) {
|
|
13217
13224
|
audio.play();
|
|
13225
|
+
updateSessionMetadata(this._session, {
|
|
13226
|
+
audioStartTime: new Date().getTime()
|
|
13227
|
+
});
|
|
13218
13228
|
container.removeChild(info);
|
|
13219
13229
|
}
|
|
13220
13230
|
document.removeEventListener('click', enableAudio);
|
|
@@ -13236,6 +13246,9 @@ class MultipleChoice extends HTMLElement {
|
|
|
13236
13246
|
};
|
|
13237
13247
|
audio.addEventListener('playing', handlePlaying);
|
|
13238
13248
|
const handleEnded = () => {
|
|
13249
|
+
updateSessionMetadata(this._session, {
|
|
13250
|
+
audioEndTime: new Date().getTime()
|
|
13251
|
+
});
|
|
13239
13252
|
this.audioComplete = true;
|
|
13240
13253
|
this._dispatchResponseChanged();
|
|
13241
13254
|
audio.removeEventListener('ended', handleEnded);
|
|
@@ -13251,10 +13264,16 @@ class MultipleChoice extends HTMLElement {
|
|
|
13251
13264
|
});
|
|
13252
13265
|
}
|
|
13253
13266
|
enableKeyboardEvents() {
|
|
13254
|
-
|
|
13267
|
+
if (!this._keyboardEventsEnabled) {
|
|
13268
|
+
window.addEventListener('keydown', this._boundHandleKeyDown);
|
|
13269
|
+
this._keyboardEventsEnabled = true;
|
|
13270
|
+
}
|
|
13255
13271
|
}
|
|
13256
13272
|
disconnectedCallback() {
|
|
13257
|
-
|
|
13273
|
+
if (this._keyboardEventsEnabled) {
|
|
13274
|
+
window.removeEventListener('keydown', this._boundHandleKeyDown);
|
|
13275
|
+
this._keyboardEventsEnabled = false;
|
|
13276
|
+
}
|
|
13258
13277
|
}
|
|
13259
13278
|
handleKeyDown(event) {
|
|
13260
13279
|
if (!this._model || !this._session) {
|
|
@@ -13273,7 +13292,8 @@ class MultipleChoice extends HTMLElement {
|
|
|
13273
13292
|
const choiceId = this._model.choices[choiceIndex].value;
|
|
13274
13293
|
const newValue = {
|
|
13275
13294
|
value: choiceId,
|
|
13276
|
-
selected: !currentValue.includes(choiceId)
|
|
13295
|
+
selected: !currentValue.includes(choiceId),
|
|
13296
|
+
selector: 'Keyboard'
|
|
13277
13297
|
};
|
|
13278
13298
|
this._onChange(newValue);
|
|
13279
13299
|
}
|
package/module/print.js
CHANGED
|
@@ -12682,8 +12682,6 @@ class MultipleChoice extends React$2.Component {
|
|
|
12682
12682
|
this.handleChange = event => {
|
|
12683
12683
|
const {value, checked} = event.target;
|
|
12684
12684
|
const {maxSelections, onChoiceChanged, session} = this.props;
|
|
12685
|
-
const {detail} = event.nativeEvent;
|
|
12686
|
-
let selector = detail ? 'Mouse' : 'Keyboard';
|
|
12687
12685
|
if (session.value && session.value.length >= maxSelections) {
|
|
12688
12686
|
this.setState({
|
|
12689
12687
|
maxSelectionsErrorState: checked
|
|
@@ -12695,7 +12693,7 @@ class MultipleChoice extends React$2.Component {
|
|
|
12695
12693
|
onChoiceChanged({
|
|
12696
12694
|
value,
|
|
12697
12695
|
selected: checked,
|
|
12698
|
-
selector
|
|
12696
|
+
selector: 'Mouse'
|
|
12699
12697
|
});
|
|
12700
12698
|
};
|
|
12701
12699
|
}
|
|
@@ -12779,14 +12777,14 @@ class MultipleChoice extends React$2.Component {
|
|
|
12779
12777
|
__self: this,
|
|
12780
12778
|
__source: {
|
|
12781
12779
|
fileName: _jsxFileName$1,
|
|
12782
|
-
lineNumber:
|
|
12780
|
+
lineNumber: 210
|
|
12783
12781
|
}
|
|
12784
12782
|
}, "Multiple Choice Question") : React$2.createElement('h2', {
|
|
12785
12783
|
className: classes.srOnly,
|
|
12786
12784
|
__self: this,
|
|
12787
12785
|
__source: {
|
|
12788
12786
|
fileName: _jsxFileName$1,
|
|
12789
|
-
lineNumber:
|
|
12787
|
+
lineNumber: 212
|
|
12790
12788
|
}
|
|
12791
12789
|
}, "Multiple Select Question");
|
|
12792
12790
|
}
|
|
@@ -12808,7 +12806,7 @@ class MultipleChoice extends React$2.Component {
|
|
|
12808
12806
|
__self: this,
|
|
12809
12807
|
__source: {
|
|
12810
12808
|
fileName: _jsxFileName$1,
|
|
12811
|
-
lineNumber:
|
|
12809
|
+
lineNumber: 247
|
|
12812
12810
|
}
|
|
12813
12811
|
});
|
|
12814
12812
|
const getMultipleChoiceMinSelectionErrorMessage = () => {
|
|
@@ -12835,21 +12833,21 @@ class MultipleChoice extends React$2.Component {
|
|
|
12835
12833
|
__self: this,
|
|
12836
12834
|
__source: {
|
|
12837
12835
|
fileName: _jsxFileName$1,
|
|
12838
|
-
lineNumber:
|
|
12836
|
+
lineNumber: 270
|
|
12839
12837
|
}
|
|
12840
12838
|
}, partLabel && React$2.createElement('h3', {
|
|
12841
12839
|
className: classes.partLabel,
|
|
12842
12840
|
__self: this,
|
|
12843
12841
|
__source: {
|
|
12844
12842
|
fileName: _jsxFileName$1,
|
|
12845
|
-
lineNumber:
|
|
12843
|
+
lineNumber: 271
|
|
12846
12844
|
}
|
|
12847
12845
|
}, partLabel), this.renderHeading(), teacherInstructions && React$2.createElement('div', {
|
|
12848
12846
|
className: classes.teacherInstructions,
|
|
12849
12847
|
__self: this,
|
|
12850
12848
|
__source: {
|
|
12851
12849
|
fileName: _jsxFileName$1,
|
|
12852
|
-
lineNumber:
|
|
12850
|
+
lineNumber: 276
|
|
12853
12851
|
}
|
|
12854
12852
|
}, !animationsDisabled ? React$2.createElement(Collapsible, {
|
|
12855
12853
|
labels: {
|
|
@@ -12859,14 +12857,14 @@ class MultipleChoice extends React$2.Component {
|
|
|
12859
12857
|
__self: this,
|
|
12860
12858
|
__source: {
|
|
12861
12859
|
fileName: _jsxFileName$1,
|
|
12862
|
-
lineNumber:
|
|
12860
|
+
lineNumber: 278
|
|
12863
12861
|
}
|
|
12864
12862
|
}, teacherInstructionsDiv) : teacherInstructionsDiv), React$2.createElement('fieldset', {
|
|
12865
12863
|
className: classes.fieldset,
|
|
12866
12864
|
__self: this,
|
|
12867
12865
|
__source: {
|
|
12868
12866
|
fileName: _jsxFileName$1,
|
|
12869
|
-
lineNumber:
|
|
12867
|
+
lineNumber: 292
|
|
12870
12868
|
}
|
|
12871
12869
|
}, React$2.createElement(PreviewPrompt, {
|
|
12872
12870
|
className: "prompt",
|
|
@@ -12877,7 +12875,7 @@ class MultipleChoice extends React$2.Component {
|
|
|
12877
12875
|
__self: this,
|
|
12878
12876
|
__source: {
|
|
12879
12877
|
fileName: _jsxFileName$1,
|
|
12880
|
-
lineNumber:
|
|
12878
|
+
lineNumber: 293
|
|
12881
12879
|
}
|
|
12882
12880
|
}), !alwaysShowCorrect && React$2.createElement(CorrectAnswerToggle, {
|
|
12883
12881
|
show: showCorrectAnswerToggle,
|
|
@@ -12887,7 +12885,7 @@ class MultipleChoice extends React$2.Component {
|
|
|
12887
12885
|
__self: this,
|
|
12888
12886
|
__source: {
|
|
12889
12887
|
fileName: _jsxFileName$1,
|
|
12890
|
-
lineNumber:
|
|
12888
|
+
lineNumber: 302
|
|
12891
12889
|
}
|
|
12892
12890
|
}), React$2.createElement('div', {
|
|
12893
12891
|
className: classNames({
|
|
@@ -12898,7 +12896,7 @@ class MultipleChoice extends React$2.Component {
|
|
|
12898
12896
|
__self: this,
|
|
12899
12897
|
__source: {
|
|
12900
12898
|
fileName: _jsxFileName$1,
|
|
12901
|
-
lineNumber:
|
|
12899
|
+
lineNumber: 310
|
|
12902
12900
|
}
|
|
12903
12901
|
}, choices.map((choice, index) => React$2.createElement(StyledChoice, {
|
|
12904
12902
|
choicesLayout: this.props.choicesLayout,
|
|
@@ -12921,21 +12919,21 @@ class MultipleChoice extends React$2.Component {
|
|
|
12921
12919
|
__self: this,
|
|
12922
12920
|
__source: {
|
|
12923
12921
|
fileName: _jsxFileName$1,
|
|
12924
|
-
lineNumber:
|
|
12922
|
+
lineNumber: 318
|
|
12925
12923
|
}
|
|
12926
12924
|
})))), choiceMode === 'checkbox' && selections < minSelections && React$2.createElement('div', {
|
|
12927
12925
|
className: classes.errorText,
|
|
12928
12926
|
__self: this,
|
|
12929
12927
|
__source: {
|
|
12930
12928
|
fileName: _jsxFileName$1,
|
|
12931
|
-
lineNumber:
|
|
12929
|
+
lineNumber: 342
|
|
12932
12930
|
}
|
|
12933
12931
|
}, getMultipleChoiceMinSelectionErrorMessage()), choiceMode === 'checkbox' && maxSelectionsErrorState && React$2.createElement('div', {
|
|
12934
12932
|
className: classes.errorText,
|
|
12935
12933
|
__self: this,
|
|
12936
12934
|
__source: {
|
|
12937
12935
|
fileName: _jsxFileName$1,
|
|
12938
|
-
lineNumber:
|
|
12936
|
+
lineNumber: 347
|
|
12939
12937
|
}
|
|
12940
12938
|
}, translator.t(`translation:multipleChoice:maxSelections_${maxSelections === 1 ? 'one' : 'other'}`, {
|
|
12941
12939
|
lng: language,
|
package/package.json
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pie-element/multiple-choice",
|
|
3
3
|
"repository": "pie-framework/pie-elements",
|
|
4
|
-
"version": "9.11.1-next.
|
|
4
|
+
"version": "9.11.1-next.31+2f65ae297",
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"access": "public"
|
|
7
7
|
},
|
|
@@ -19,7 +19,7 @@
|
|
|
19
19
|
"react-test-renderer": "^16.3.2",
|
|
20
20
|
"react-transition-group": "^2.3.1"
|
|
21
21
|
},
|
|
22
|
-
"gitHead": "
|
|
22
|
+
"gitHead": "2f65ae297508c13626535290da64c2722e0af67a",
|
|
23
23
|
"scripts": {
|
|
24
24
|
"postpublish": "../../scripts/postpublish"
|
|
25
25
|
},
|