npm - @pie-element/multiple-choice - Versions diffs - 9.11.1-next.15 → 9.11.1-next.17 - Mend

@pie-element/multiple-choice 9.11.1-next.15 → 9.11.1-next.17

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.

Files changed (4) hide show

package/lib/index.js CHANGED Viewed

@@ -92,6 +92,8 @@ var MultipleChoice = /*#__PURE__*/function (_HTMLElement) {
     _this._model = null;
     _this._session = null;
     _this.audioComplete = false;
+    _this._boundHandleKeyDown = _this.handleKeyDown.bind((0, _assertThisInitialized2["default"])(_this));
+    _this._keyboardEventsEnabled = false;
     _this._rerender = (0, _debounce["default"])(function () {
       if (_this._model && _this._session) {
         var element = /*#__PURE__*/_react["default"].createElement(_main["default"], {
@@ -113,7 +115,7 @@ var MultipleChoice = /*#__PURE__*/function (_HTMLElement) {
           (0, _mathRendering.renderMath)((0, _assertThisInitialized2["default"])(_this));
         });
-        if (_this._model.keyboardEventsEnabled === true) {
+        if (_this._model.keyboardEventsEnabled === true && !_this._keyboardEventsEnabled) {
           _this.enableKeyboardEvents();
         }
       } else {
@@ -289,12 +291,18 @@ var MultipleChoice = /*#__PURE__*/function (_HTMLElement) {
   }, {
     key: "enableKeyboardEvents",
     value: function enableKeyboardEvents() {
-      window.addEventListener('keydown', this.handleKeyDown.bind(this));
+      if (!this._keyboardEventsEnabled) {
+        window.addEventListener('keydown', this._boundHandleKeyDown);
+        this._keyboardEventsEnabled = true;
+      }
     }
   }, {
     key: "disconnectedCallback",
     value: function disconnectedCallback() {
-      window.removeEventListener('keydown', this.handleKeyDown.bind(this));
+      if (this._keyboardEventsEnabled) {
+        window.removeEventListener('keydown', this._boundHandleKeyDown);
+        this._keyboardEventsEnabled = false;
+      }
     }
     /**
      * Handles global keyboard events for selecting or toggling multiple-choice answers.

package/lib/index.js.map CHANGED Viewed

	@@ -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","audioStartTime","Date","getTime","removeChild","removeEventListener","setTimeout","paused","addEventListener","handlePlaying","handleEnded","audioEndTime","disconnect","observe","childList","subtree","window","handleKeyDown","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\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 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 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 selector: 'Keyboard',\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":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;AAEA,IAAMA,GAAG,GAAG,uBAAM,wBAAN,CAAZ;;AAEO,IAAMC,UAAU,GAAG,SAAbA,UAAa,CAACC,OAAD,EAAUC,KAAV,EAAiBC,aAAjB,EAAmC;AAC3D,aAAuDD,KAAK,IAAI,EAAhE;AAAA,MAAQE,oBAAR,QAAQA,oBAAR;AAAA,MAA8BC,oBAA9B,QAA8BA,oBAA9B;;AAEA,MAAID,oBAAoB,IAAIC,oBAAxB,IAAgD,CAACF,aAArD,EAAoE;AAClE,WAAO,KAAP;AACD;;AAED,MAAI,CAACF,OAAD,IAAY,CAACA,OAAO,CAACK,KAAzB,EAAgC;AAC9B,WAAO,KAAP;AACD;;AAED,cAAyDJ,KAAK,IAAI,EAAlE;AAAA,MAAQK,UAAR,SAAQA,UAAR;AAAA,kCAAoBC,aAApB;AAAA,MAAoBA,aAApB,oCAAoC,CAApC;AAAA,MAAuCC,aAAvC,SAAuCA,aAAvC;;AACA,MAAMC,UAAU,GAAGT,OAAO,CAACK,KAAR,CAAcK,MAAd,IAAwB,CAA3C;;AAEA,MAAIJ,UAAU,KAAK,OAAnB,EAA4B;AAC1B,WAAO,CAAC,CAACG,UAAT;AACD;;AAED,MAAIA,UAAU,GAAGF,aAAb,IAA8BE,UAAU,GAAGD,aAA/C,EAA8D;AAC5D,WAAO,KAAP;AACD;;AAED,SAAO,IAAP;AACD,CAvBM;;;;IAyBcG,c;;;;;AACnB,4BAAc;AAAA;;AAAA;AACZ;AACA,UAAKC,MAAL,GAAc,IAAd;AACA,UAAKC,QAAL,GAAgB,IAAhB;AACA,UAAKX,aAAL,GAAqB,KAArB;AACA,UAAKY,mBAAL,GAA2B,MAAKC,aAAL,CAAmBC,IAAnB,gDAA3B;AACA,UAAKC,sBAAL,GAA8B,KAA9B;AAEA,UAAKC,SAAL,GAAiB,0BACf,YAAM;AACJ,UAAI,MAAKN,MAAL,IAAe,MAAKC,QAAxB,EAAkC;AAChC,YAAIM,OAAO,gBAAGC,kBAAMC,aAAN,CAAoBC,gBAApB,EAA0B;AACtCrB,UAAAA,KAAK,EAAE,MAAKW,MAD0B;AAEtCZ,UAAAA,OAAO,EAAE,MAAKa,QAFwB;AAGtCU,UAAAA,eAAe,EAAE,MAAKC,SAAL,CAAeR,IAAf,gDAHqB;AAItCS,UAAAA,mBAAmB,EAAE,MAAKA,mBAAL,CAAyBT,IAAzB;AAJiB,SAA1B,CAAd,CADgC,CAQhC;;;AACA,cAAKU,YAAL,CACE,YADF,EAEE,MAAKd,MAAL,CAAYN,UAAZ,KAA2B,OAA3B,GAAqC,0BAArC,GAAkE,kCAFpE;;AAIA,cAAKoB,YAAL,CAAkB,MAAlB,EAA0B,QAA1B;;AACA,cAAKC,gBAAL;;AAEAC,6BAASC,MAAT,CAAgBV,OAAhB,kDAA+B,YAAM;AACnCrB,UAAAA,GAAG,CAAC,+BAAD,CAAH;AACA;AACD,SAHD;;AAKA,YAAI,MAAKc,MAAL,CAAYkB,qBAAZ,KAAsC,IAAtC,IAA8C,CAAC,MAAKb,sBAAxD,EAAgF;AAC9E,gBAAKc,oBAAL;AACD;AACF,OAxBD,MAwBO;AACLjC,QAAAA,GAAG,CAAC,MAAD,CAAH;AACD;AACF,KA7Bc,EA8Bf,EA9Be,EA+Bf;AAAEkC,MAAAA,OAAO,EAAE,KAAX;AAAkBC,MAAAA,QAAQ,EAAE;AAA5B,KA/Be,CAAjB;AAkCA,UAAKC,wBAAL,GAAgC,0BAAS,YAAM;AAC7C,YAAKC,aAAL,CACE,IAAIC,oCAAJ,CAAwB,MAAKC,OAAL,CAAaC,WAAb,EAAxB,EAAoDvC,UAAU,CAAC,MAAKc,QAAN,EAAgB,MAAKD,MAArB,EAA6B,MAAKV,aAAlC,CAA9D,CADF;AAGD,KAJ+B,CAAhC;AAMA,UAAKqC,iBAAL,GAAyB,0BACvB,YAAM;AACJ,YAAKJ,aAAL,CACE,IAAIK,8BAAJ,CACE,MAAKH,OAAL,CAAaC,WAAb,EADF,EAEEvC,UAAU,CAAC,MAAKc,QAAN,EAAgB,MAAKD,MAArB,CAFZ,EAGE,MAAKA,MAAL,KAAgB6B,SAHlB,CADF;AAOD,KATsB,EAUvB,EAVuB,EAWvB;AAAET,MAAAA,OAAO,EAAE,KAAX;AAAkBC,MAAAA,QAAQ,EAAE;AAA5B,KAXuB,CAAzB;AAhDY;AA6Db;;;;WAED,+BAAsB;AACpB,qCAAW,IAAX;AACD;;;WAED,4BAAmB;AACjB,UAAMS,QAAQ,GAAG,KAAK9B,MAAL,6BAAsB,KAAKA,MAAL,CAAY8B,QAAlC,IAA6C,KAAK9B,MAAL,CAAY8B,QAAzD,GAAoE,EAArF;AACA,UAAMC,IAAI,GAAGD,QAAQ,GAAGA,QAAQ,CAACE,KAAT,CAAe,CAAf,EAAkB,CAAlB,CAAH,GAA0B,IAA/C;AACA,WAAKlB,YAAL,CAAkB,MAAlB,EAA0BiB,IAA1B;AACD;;;SAED,aAAUE,CAAV,EAAa;AACX,WAAKjC,MAAL,GAAciC,CAAd;;AACA,WAAK3B,SAAL;;AACA,WAAKqB,iBAAL;AACD;;;SAED,eAAc;AACZ,aAAO,KAAK1B,QAAZ;AACD,K;SAED,aAAYgC,CAAZ,EAAe;AACb,WAAKhC,QAAL,GAAgBgC,CAAhB;;AACA,WAAK3B,SAAL,GAFa,CAGb;;;AACA,WAAKgB,wBAAL;AACD;;;WAED,mBAAUY,IAAV,EAAgB;AACd,8CAAmB,KAAKjC,QAAxB,EAAkC,KAAKD,MAAL,CAAYN,UAA9C,EAA0DwC,IAA1D;;AACA,WAAKZ,wBAAL;;AACA,WAAKhB,SAAL;AACD;;;WAED,iCAAwB;AACtB,UAAM6B,IAAI,GAAGC,QAAQ,CAAC3B,aAAT,CAAuB,KAAvB,CAAb;AACA0B,MAAAA,IAAI,CAACE,EAAL,GAAU,iBAAV;AAEAC,MAAAA,MAAM,CAACC,MAAP,CAAcJ,IAAI,CAACK,KAAnB,EAA0B;AACxBC,QAAAA,QAAQ,EAAE,UADc;AAExBC,QAAAA,GAAG,EAAE,CAFmB;AAGxBC,QAAAA,KAAK,EAAC,MAHkB;AAIxBC,QAAAA,MAAM,EAAE,MAJgB;AAKxBC,QAAAA,OAAO,EAAE,MALe;AAMxBC,QAAAA,cAAc,EAAE,QANQ;AAOxBC,QAAAA,UAAU,EAAE,QAPY;AAQxBC,QAAAA,UAAU,EAAE,OARY;AASxBC,QAAAA,MAAM,EAAE;AATgB,OAA1B;AAYA,UAAMC,GAAG,GAAGd,QAAQ,CAAC3B,aAAT,CAAuB,KAAvB,CAAZ;AACAyC,MAAAA,GAAG,CAACC,GAAJ,GAAU,wFAAV;AACAD,MAAAA,GAAG,CAACE,GAAJ,GAAU,yCAAV;AACAF,MAAAA,GAAG,CAACP,KAAJ,GAAY,GAAZ;AACAO,MAAAA,GAAG,CAACN,MAAJ,GAAa,GAAb;AAEAT,MAAAA,IAAI,CAACkB,WAAL,CAAiBH,GAAjB;AACA,aAAOf,IAAP;AACD;;;WAED,6BAAoB;AAAA;;AAClB,WAAK7B,SAAL;;AAEA,UAAI,KAAKN,MAAL,IAAe,CAAC,KAAKA,MAAL,CAAYT,oBAAhC,EAAsD;AACpD;AACD,OALiB,CAOlB;AACA;AACA;;;AACA,UAAM+D,QAAQ,GAAG,IAAIC,gBAAJ,CAAqB,UAACC,aAAD,EAAgBF,QAAhB,EAA6B;AACjEE,QAAAA,aAAa,CAACC,OAAd,CAAsB,UAACC,QAAD,EAAc;AAClC,cAAIA,QAAQ,CAACC,IAAT,KAAkB,WAAtB,EAAmC;AACjC,gBAAMC,KAAK,GAAG,MAAI,CAACC,aAAL,CAAmB,OAAnB,CAAd;;AACA,gBAAMC,cAAc,GAAGF,KAAK,IAAIA,KAAK,CAACG,OAAN,CAAc,iBAAd,CAAhC;AAEA,gBAAIH,KAAK,IAAI,CAACE,cAAd,EAA8B;AAC9B,gBAAI,CAACF,KAAL,EAAY;;AAEZ,gBAAMzB,IAAI,GAAG,MAAI,CAAC6B,qBAAL,EAAb;;AACA,gBAAMC,SAAS,GAAG,MAAI,CAACJ,aAAL,CAAmB,iBAAnB,CAAlB;;AACA,gBAAMK,WAAW,GAAG,SAAdA,WAAc,GAAM;AACxB,kBAAI,MAAI,CAACL,aAAL,CAAmB,kBAAnB,CAAJ,EAA4C;AAC1CD,gBAAAA,KAAK,CAACO,IAAN;AACA,2DAAsB,MAAI,CAAClE,QAA3B,EAAqC;AAAEmE,kBAAAA,cAAc,EAAE,IAAIC,IAAJ,GAAWC,OAAX;AAAlB,iBAArC;AACAL,gBAAAA,SAAS,CAACM,WAAV,CAAsBpC,IAAtB;AAED;;AAEDC,cAAAA,QAAQ,CAACoC,mBAAT,CAA6B,OAA7B,EAAsCN,WAAtC;AACD,aATD,CATiC,CAoBjC;AACA;;;AACAO,YAAAA,UAAU,CAAC,YAAM;AACf,kBAAIb,KAAK,CAACc,MAAN,IAAgB,CAAC,MAAI,CAACb,aAAL,CAAmB,kBAAnB,CAArB,EAA6D;AAC3D;AACAI,gBAAAA,SAAS,CAACZ,WAAV,CAAsBlB,IAAtB;AACAC,gBAAAA,QAAQ,CAACuC,gBAAT,CAA0B,OAA1B,EAAmCT,WAAnC;AACD,eAJD,MAIO;AACL9B,gBAAAA,QAAQ,CAACoC,mBAAT,CAA6B,OAA7B,EAAsCN,WAAtC;AACD;AACF,aARS,EAQP,GARO,CAAV,CAtBiC,CAgCjC;;AACA,gBAAMU,aAAa,GAAG,SAAhBA,aAAgB,GAAM;AAC1B,kBAAMzC,IAAI,GAAG,MAAI,CAAC0B,aAAL,CAAmB,kBAAnB,CAAb;;AAEA,kBAAI1B,IAAJ,EAAU;AACR,gBAAA,MAAI,CAACoC,WAAL,CAAiBpC,IAAjB;AACD;;AAEDyB,cAAAA,KAAK,CAACY,mBAAN,CAA0B,SAA1B,EAAqCI,aAArC;AACD,aARD;;AAUAhB,YAAAA,KAAK,CAACe,gBAAN,CAAuB,SAAvB,EAAkCC,aAAlC,EA3CiC,CA6CjC;;AACA,gBAAMC,WAAW,GAAG,SAAdA,WAAc,GAAM;AACxB,yDAAsB,MAAI,CAAC5E,QAA3B,EAAqC;AAAE6E,gBAAAA,YAAY,EAAE,IAAIT,IAAJ,GAAWC,OAAX;AAAhB,eAArC;AACA,cAAA,MAAI,CAAChF,aAAL,GAAqB,IAArB;;AACA,cAAA,MAAI,CAACgC,wBAAL;;AACAsC,cAAAA,KAAK,CAACY,mBAAN,CAA0B,OAA1B,EAAmCK,WAAnC;AACD,aALD;;AAOAjB,YAAAA,KAAK,CAACe,gBAAN,CAAuB,OAAvB,EAAgCE,WAAhC;AAEAvB,YAAAA,QAAQ,CAACyB,UAAT;AACD;AACF,SA1DD;AA2DD,OA5DgB,CAAjB;AA8DAzB,MAAAA,QAAQ,CAAC0B,OAAT,CAAiB,IAAjB,EAAuB;AAAEC,QAAAA,SAAS,EAAE,IAAb;AAAmBC,QAAAA,OAAO,EAAE;AAA5B,OAAvB;AACD;;;WAED,gCAAuB;AACrB,UAAI,CAAC,KAAK7E,sBAAV,EAAkC;AAChC8E,QAAAA,MAAM,CAACR,gBAAP,CAAwB,SAAxB,EAAmC,KAAKzE,mBAAxC;AACA,aAAKG,sBAAL,GAA8B,IAA9B;AACD;AACF;;;WAED,gCAAuB;AACrB,UAAI,KAAKA,sBAAT,EAAiC;AAC/B8E,QAAAA,MAAM,CAACX,mBAAP,CAA2B,SAA3B,EAAsC,KAAKtE,mBAA3C;AACA,aAAKG,sBAAL,GAA8B,KAA9B;AACD;AACF;AAED;AACF;AACA;AACA;AACA;;;;WACE,uBAAc+E,KAAd,EAAqB;AACnB,UAAI,CAAC,KAAKpF,MAAN,IAAgB,CAAC,KAAKC,QAA1B,EAAoC;AAClC;AACD;;AAED,UAAMoF,UAAU,GAAG,SAAbA,UAAa,CAACC,GAAD,EAAS;AAC1B,YAAMC,SAAS,GAAGD,GAAG,IAAI,GAAP,IAAcA,GAAG,IAAI,GAArB,GAA2BA,GAAG,GAAG,GAAjC,GAAuCA,GAAG,KAAK,GAAR,GAAc,CAAd,GAAkB,CAAC,CAA5E;AACA,YAAME,YAAY,GAAG,aAAaC,IAAb,CAAkBH,GAAlB,IAAyBA,GAAG,CAAC5D,WAAJ,GAAkBgE,UAAlB,CAA6B,CAA7B,IAAkC,IAAIA,UAAJ,CAAe,CAAf,CAA3D,GAA+E,CAAC,CAArG;AACA,eAAOH,SAAS,IAAI,CAAb,GAAiBA,SAAjB,GAA6BC,YAApC;AACD,OAJD;;AAMA,UAAMG,WAAW,GAAGN,UAAU,CAACD,KAAK,CAACE,GAAP,CAA9B;;AAEA,UAAIK,WAAW,KAAK9D,SAAhB,IAA6B8D,WAAW,IAAI,KAAK3F,MAAL,CAAY4F,OAAZ,CAAoB9F,MAApE,EAA4E;AAC1E;AACD;;AAED,UAAM+F,YAAY,GAAG,KAAK5F,QAAL,CAAcR,KAAd,IAAuB,EAA5C;AACA,UAAMqG,QAAQ,GAAG,KAAK9F,MAAL,CAAY4F,OAAZ,CAAoBD,WAApB,EAAiClG,KAAlD;AAEA,UAAMsG,QAAQ,GAAG;AACftG,QAAAA,KAAK,EAAEqG,QADQ;AAEfE,QAAAA,QAAQ,EAAE,CAACH,YAAY,CAACI,QAAb,CAAsBH,QAAtB,CAFI;AAGfI,QAAAA,QAAQ,EAAE;AAHK,OAAjB;;AAMA,WAAKtF,SAAL,CAAemF,QAAf;AACD;;;kDApPyCI,W","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/module/element.js CHANGED Viewed

@@ -13120,6 +13120,8 @@ class MultipleChoice extends HTMLElement {
     this._model = null;
     this._session = null;
     this.audioComplete = false;
+    this._boundHandleKeyDown = this.handleKeyDown.bind(this);
+    this._keyboardEventsEnabled = false;
     this._rerender = debounce(() => {
       if (this._model && this._session) {
         var element = React.createElement(Root, {
@@ -13135,7 +13137,7 @@ class MultipleChoice extends HTMLElement {
           log('render complete - render math');
           renderMath(this);
         });
-        if (this._model.keyboardEventsEnabled === true) {
+        if (this._model.keyboardEventsEnabled === true && !this._keyboardEventsEnabled) {
           this.enableKeyboardEvents();
         }
       } else {
@@ -13262,10 +13264,16 @@ class MultipleChoice extends HTMLElement {
     });
   }
   enableKeyboardEvents() {
-    window.addEventListener('keydown', this.handleKeyDown.bind(this));
+    if (!this._keyboardEventsEnabled) {
+      window.addEventListener('keydown', this._boundHandleKeyDown);
+      this._keyboardEventsEnabled = true;
+    }
   }
   disconnectedCallback() {
-    window.removeEventListener('keydown', this.handleKeyDown.bind(this));
+    if (this._keyboardEventsEnabled) {
+      window.removeEventListener('keydown', this._boundHandleKeyDown);
+      this._keyboardEventsEnabled = false;
+    }
   }
   handleKeyDown(event) {
     if (!this._model || !this._session) {

package/package.json CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "name": "@pie-element/multiple-choice",
   "repository": "pie-framework/pie-elements",
-  "version": "9.11.1-next.15+96093f50c",
+  "version": "9.11.1-next.17+71a6ee7c9",
   "publishConfig": {
     "access": "public"
   },
@@ -19,7 +19,7 @@
     "react-test-renderer": "^16.3.2",
     "react-transition-group": "^2.3.1"
   },
-  "gitHead": "96093f50c5b6a903bd67b0a84c8033fb99304d83",
+  "gitHead": "71a6ee7c9eb3cff657582a9ddf2156150dc35009",
   "scripts": {
     "postpublish": "../../scripts/postpublish"
   },