@pie-element/drag-in-the-blank 6.7.0 → 6.7.1-next.3
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 +1 -1
- package/lib/index.js.map +1 -1
- package/lib/main.js +1 -0
- package/lib/main.js.map +1 -1
- package/package.json +2 -2
package/lib/index.js
CHANGED
|
@@ -164,7 +164,7 @@ var DragInTheBlank = /*#__PURE__*/function (_HTMLElement) {
|
|
|
164
164
|
|
|
165
165
|
var info = _this2._createAudioInfoToast();
|
|
166
166
|
|
|
167
|
-
var container = _this2.querySelector('
|
|
167
|
+
var container = _this2.querySelector('#main-container');
|
|
168
168
|
|
|
169
169
|
var enableAudio = function enableAudio() {
|
|
170
170
|
if (_this2.querySelector('#play-audio-info')) {
|
package/lib/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.js"],"names":["isComplete","session","model","audioComplete","autoplayAudioEnabled","completeAudioEnabled","value","Object","values","some","DragInTheBlank","_model","_session","elem","React","createElement","Main","onChange","changeSession","ReactDOM","render","dispatchEvent","SessionChangedEvent","tagName","toLowerCase","selector","dispatchChangedEvent","_render","m","ModelSetEvent","s","info","document","id","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","HTMLElement"],"mappings":"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","sourcesContent":["import React from 'react';\nimport ReactDOM from 'react-dom';\nimport { renderMath } from '@pie-lib/pie-toolbox/math-rendering';\nimport { ModelSetEvent, SessionChangedEvent } from '@pie-framework/pie-player-events';\nimport Main from './main';\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 return Object.values(session.value || {}).some((value) => !!value);\n};\n\nexport default class DragInTheBlank extends HTMLElement {\n constructor() {\n super();\n this._model = null;\n this._session = null;\n this.audioComplete = false;\n }\n\n set model(m) {\n this._model = m;\n this.dispatchEvent(new ModelSetEvent(this.tagName.toLowerCase(), isComplete(this._session, this._model, this.audioComplete), !!this._model));\n\n this._render();\n }\n\n set session(s) {\n this._session = s;\n this._render();\n }\n\n get session() {\n return this._session;\n }\n\n _render = () => {\n if (this._model && this._session) {\n let elem = React.createElement(Main, {\n model: this._model,\n value: this._session.value,\n onChange: this.changeSession,\n });\n\n ReactDOM.render(elem, this, () => {\n renderMath(this);\n });\n }\n };\n\n dispatchChangedEvent = () => {\n this.dispatchEvent(new SessionChangedEvent(this.tagName.toLowerCase(), isComplete(this._session, this._model, this.audioComplete)));\n };\n\n changeSession = (value) => {\n this.session.value = value;\n this.session.selector = 'Mouse';\n \n this.dispatchChangedEvent();\n this._render();\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._render();\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.dispatchChangedEvent();\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"],"file":"index.js"}
|
|
1
|
+
{"version":3,"sources":["../src/index.js"],"names":["isComplete","session","model","audioComplete","autoplayAudioEnabled","completeAudioEnabled","value","Object","values","some","DragInTheBlank","_model","_session","elem","React","createElement","Main","onChange","changeSession","ReactDOM","render","dispatchEvent","SessionChangedEvent","tagName","toLowerCase","selector","dispatchChangedEvent","_render","m","ModelSetEvent","s","info","document","id","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","HTMLElement"],"mappings":"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","sourcesContent":["import React from 'react';\nimport ReactDOM from 'react-dom';\nimport { renderMath } from '@pie-lib/pie-toolbox/math-rendering';\nimport { ModelSetEvent, SessionChangedEvent } from '@pie-framework/pie-player-events';\nimport Main from './main';\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 return Object.values(session.value || {}).some((value) => !!value);\n};\n\nexport default class DragInTheBlank extends HTMLElement {\n constructor() {\n super();\n this._model = null;\n this._session = null;\n this.audioComplete = false;\n }\n\n set model(m) {\n this._model = m;\n this.dispatchEvent(new ModelSetEvent(this.tagName.toLowerCase(), isComplete(this._session, this._model, this.audioComplete), !!this._model));\n\n this._render();\n }\n\n set session(s) {\n this._session = s;\n this._render();\n }\n\n get session() {\n return this._session;\n }\n\n _render = () => {\n if (this._model && this._session) {\n let elem = React.createElement(Main, {\n model: this._model,\n value: this._session.value,\n onChange: this.changeSession,\n });\n\n ReactDOM.render(elem, this, () => {\n renderMath(this);\n });\n }\n };\n\n dispatchChangedEvent = () => {\n this.dispatchEvent(new SessionChangedEvent(this.tagName.toLowerCase(), isComplete(this._session, this._model, this.audioComplete)));\n };\n\n changeSession = (value) => {\n this.session.value = value;\n this.session.selector = 'Mouse';\n \n this.dispatchChangedEvent();\n this._render();\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._render();\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('#main-container');\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.dispatchChangedEvent();\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"],"file":"index.js"}
|
package/lib/main.js
CHANGED
|
@@ -98,6 +98,7 @@ var Main = /*#__PURE__*/function (_React$Component) {
|
|
|
98
98
|
var addAutoplayAudio = autoplayAudioEnabled && !(/Safari|Firefox|Edg/.test(navigator.userAgent) && !/Chrome/.test(navigator.userAgent));
|
|
99
99
|
return /*#__PURE__*/_react["default"].createElement(_renderUi.UiLayout, {
|
|
100
100
|
extraCSSRules: extraCSSRules,
|
|
101
|
+
id: 'main-container',
|
|
101
102
|
className: classes.mainContainer,
|
|
102
103
|
fontSizeFactor: fontSizeFactor
|
|
103
104
|
}, model.teacherInstructions && (0, _renderUi.hasText)(model.teacherInstructions) && /*#__PURE__*/_react["default"].createElement(_renderUi.Collapsible, {
|
package/lib/main.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/main.js"],"names":["DraggableDragInTheBlank","DragInTheBlank","Main","showCorrectAnswer","setState","state","props","model","onChange","value","classes","extraCSSRules","prompt","mode","language","fontSizeFactor","autoplayAudioEnabled","modelWithValue","showCorrectAnswerToggle","addAutoplayAudio","test","navigator","userAgent","mainContainer","teacherInstructions","collapsible","hidden","visible","toggleShowCorrect","rationale","React","Component","PropTypes","object","feedback","func","styles","theme","color","text","backgroundColor","background","position","marginBottom","spacing","unit","marginTop"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;;AAEA,IAAMA,uBAAuB,GAAG,2BAAgBC,0BAAhB,CAAhC;;IAEaC,I;;;;;;;;;;;;;;;8FAaH;AACNC,MAAAA,iBAAiB,EAAE;AADb,K;0GAIY,YAAM;AACxB,YAAKC,QAAL,CAAc;AAAED,QAAAA,iBAAiB,EAAE,CAAC,MAAKE,KAAL,CAAWF;AAAjC,OAAd;AACD,K;;;;;;WAED,kBAAS;AACP,UAAQA,iBAAR,GAA8B,KAAKE,KAAnC,CAAQF,iBAAR;AACA,wBAA4C,KAAKG,KAAjD;AAAA,UAAQC,KAAR,eAAQA,KAAR;AAAA,UAAeC,QAAf,eAAeA,QAAf;AAAA,UAAyBC,KAAzB,eAAyBA,KAAzB;AAAA,UAAgCC,OAAhC,eAAgCA,OAAhC;AACA,UAAQC,aAAR,GAAwFJ,KAAxF,CAAQI,aAAR;AAAA,UAAuBC,MAAvB,GAAwFL,KAAxF,CAAuBK,MAAvB;AAAA,UAA+BC,IAA/B,GAAwFN,KAAxF,CAA+BM,IAA/B;AAAA,UAAqCC,QAArC,GAAwFP,KAAxF,CAAqCO,QAArC;AAAA,UAA+CC,cAA/C,GAAwFR,KAAxF,CAA+CQ,cAA/C;AAAA,UAA+DC,oBAA/D,GAAwFT,KAAxF,CAA+DS,oBAA/D;;AACA,UAAMC,cAAc,mCAAQV,KAAR;AAAeE,QAAAA,KAAK,EAALA;AAAf,QAApB;;AACA,UAAMS,uBAAuB,GAAGL,IAAI,KAAK,UAAzC,CALO,CAMP;;AACA,UAAMM,gBAAgB,GAAGH,oBAAoB,IAAI,EAAE,qBAAqBI,IAArB,CAA0BC,SAAS,CAACC,SAApC,KAAkD,CAAC,SAASF,IAAT,CAAcC,SAAS,CAACC,SAAxB,CAArD,CAAjD;AAEA,0BACE,gCAAC,kBAAD;AAAU,QAAA,aAAa,EAAEX,aAAzB;AAAwC,QAAA,SAAS,EAAED,OAAO,CAACa,
|
|
1
|
+
{"version":3,"sources":["../src/main.js"],"names":["DraggableDragInTheBlank","DragInTheBlank","Main","showCorrectAnswer","setState","state","props","model","onChange","value","classes","extraCSSRules","prompt","mode","language","fontSizeFactor","autoplayAudioEnabled","modelWithValue","showCorrectAnswerToggle","addAutoplayAudio","test","navigator","userAgent","mainContainer","teacherInstructions","collapsible","hidden","visible","toggleShowCorrect","rationale","React","Component","PropTypes","object","feedback","func","styles","theme","color","text","backgroundColor","background","position","marginBottom","spacing","unit","marginTop"],"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 { DragInTheBlank } from '@pie-lib/pie-toolbox/mask-markup';\nimport { withDragContext } from '@pie-lib/pie-toolbox/drag';\nimport { color, Collapsible, hasText, PreviewPrompt, UiLayout } from '@pie-lib/pie-toolbox/render-ui';\nimport { withStyles } from '@material-ui/core/styles';\n\nconst DraggableDragInTheBlank = withDragContext(DragInTheBlank);\n\nexport class Main extends React.Component {\n static propTypes = {\n classes: PropTypes.object,\n model: PropTypes.object,\n value: PropTypes.object,\n feedback: PropTypes.object,\n onChange: PropTypes.func,\n };\n\n static defaultProps = {\n value: {},\n };\n\n state = {\n showCorrectAnswer: false,\n };\n\n toggleShowCorrect = () => {\n this.setState({ showCorrectAnswer: !this.state.showCorrectAnswer });\n };\n\n render() {\n const { showCorrectAnswer } = this.state;\n const { model, onChange, value, classes } = this.props;\n const { extraCSSRules, prompt, mode, language, fontSizeFactor, autoplayAudioEnabled } = model;\n const modelWithValue = { ...model, value };\n const showCorrectAnswerToggle = mode === 'evaluate';\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 return (\n <UiLayout extraCSSRules={extraCSSRules} id={'main-container'} className={classes.mainContainer} fontSizeFactor={fontSizeFactor}>\n {model.teacherInstructions && hasText(model.teacherInstructions) && (\n <Collapsible\n className={classes.collapsible}\n labels={{ hidden: 'Show Teacher Instructions', visible: 'Hide Teacher Instructions' }}\n >\n <PreviewPrompt prompt={model.teacherInstructions} />\n </Collapsible>\n )}\n\n {prompt && <PreviewPrompt className=\"prompt\" prompt={prompt} autoplayAudioEnabled={addAutoplayAudio} />}\n\n <CorrectAnswerToggle\n show={showCorrectAnswerToggle}\n toggled={showCorrectAnswer}\n onToggle={this.toggleShowCorrect}\n language={language}\n />\n\n <DraggableDragInTheBlank {...modelWithValue} onChange={onChange} showCorrectAnswer={showCorrectAnswer} />\n\n {model.rationale && hasText(model.rationale) && (\n <Collapsible className={classes.rationale} labels={{ hidden: 'Show Rationale', visible: 'Hide Rationale' }}>\n <PreviewPrompt prompt={model.rationale} />\n </Collapsible>\n )}\n </UiLayout>\n );\n }\n}\n\nconst styles = (theme) => ({\n mainContainer: {\n color: color.text(),\n backgroundColor: color.background(),\n '& tr > td': {\n color: color.text(),\n },\n position: 'relative'\n },\n collapsible: {\n marginBottom: theme.spacing.unit * 2,\n },\n rationale: {\n marginTop: theme.spacing.unit * 2,\n },\n});\n\nexport default withStyles(styles)(Main);\n"],"file":"main.js"}
|
package/package.json
CHANGED
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
"access": "public"
|
|
5
5
|
},
|
|
6
6
|
"repository": "pie-framework/pie-elements",
|
|
7
|
-
"version": "6.7.
|
|
7
|
+
"version": "6.7.1-next.3+da6ef2782",
|
|
8
8
|
"description": "",
|
|
9
9
|
"scripts": {
|
|
10
10
|
"postpublish": "../../scripts/postpublish"
|
|
@@ -21,7 +21,7 @@
|
|
|
21
21
|
},
|
|
22
22
|
"author": "",
|
|
23
23
|
"license": "ISC",
|
|
24
|
-
"gitHead": "
|
|
24
|
+
"gitHead": "da6ef2782bf676c671fed5c47b1faf86bd47ea54",
|
|
25
25
|
"main": "lib/index.js",
|
|
26
26
|
"module": "src/index.js"
|
|
27
27
|
}
|