@pie-element/categorize 9.13.4-next.0 → 9.13.4-next.13
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/configure/package.json
CHANGED
|
@@ -12,7 +12,7 @@
|
|
|
12
12
|
"@material-ui/core": "^3.9.2",
|
|
13
13
|
"@material-ui/icons": "^3.0.1",
|
|
14
14
|
"@pie-framework/pie-configure-events": "^1.3.0",
|
|
15
|
-
"@pie-lib/pie-toolbox": "2.14.
|
|
15
|
+
"@pie-lib/pie-toolbox": "2.14.4",
|
|
16
16
|
"classnames": "^2.2.5",
|
|
17
17
|
"debug": "^3.1.0",
|
|
18
18
|
"lodash": "^4.17.15",
|
package/controller/package.json
CHANGED
package/lib/categorize/choice.js
CHANGED
|
@@ -31,8 +31,6 @@ var _classnames = _interopRequireDefault(require("classnames"));
|
|
|
31
31
|
|
|
32
32
|
var _reactDnd = require("react-dnd");
|
|
33
33
|
|
|
34
|
-
var _reactDndHtml5Backend = _interopRequireDefault(require("react-dnd-html5-backend"));
|
|
35
|
-
|
|
36
34
|
var _drag = require("@pie-lib/pie-toolbox/drag");
|
|
37
35
|
|
|
38
36
|
var _Card = _interopRequireDefault(require("@material-ui/core/Card"));
|
|
@@ -261,13 +259,7 @@ var DraggableChoice = (0, _reactDnd.DragSource)(function (_ref2) {
|
|
|
261
259
|
};
|
|
262
260
|
})(Choice);
|
|
263
261
|
|
|
264
|
-
var
|
|
265
|
-
return /*#__PURE__*/_react["default"].createElement(_reactDnd.DndProvider, {
|
|
266
|
-
backend: _reactDndHtml5Backend["default"]
|
|
267
|
-
}, /*#__PURE__*/_react["default"].createElement(DraggableChoice, props));
|
|
268
|
-
};
|
|
269
|
-
|
|
270
|
-
var _default = _drag.uid.withUid(DraggableChoiceWithProvider);
|
|
262
|
+
var _default = _drag.uid.withUid(DraggableChoice);
|
|
271
263
|
|
|
272
264
|
exports["default"] = _default;
|
|
273
265
|
//# sourceMappingURL=choice.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/categorize/choice.jsx"],"names":["log","ChoiceType","content","PropTypes","string","isRequired","id","Layout","props","classes","className","isDragging","disabled","correct","rootNames","choice","dragging","cardNames","card","root","cardRoot","__html","React","Component","object","bool","styles","theme","direction","cursor","width","border","color","incorrect","borderRadius","text","backgroundColor","white","paddingBottom","spacing","unit","opacity","background","pointerEvents","Styled","Choice","e","preventDefault","ref","addEventListener","handleTouchStart","passive","removeEventListener","connectDragSource","extraStyle","margin","func","spec","canDrag","beginDrag","out","categoryId","choiceIndex","value","itemType","endDrag","monitor","didDrop","item","getItem","onRemoveChoice","DraggableChoice","uid","connect","dragSource","
|
|
1
|
+
{"version":3,"sources":["../../src/categorize/choice.jsx"],"names":["log","ChoiceType","content","PropTypes","string","isRequired","id","Layout","props","classes","className","isDragging","disabled","correct","rootNames","choice","dragging","cardNames","card","root","cardRoot","__html","React","Component","object","bool","styles","theme","direction","cursor","width","border","color","incorrect","borderRadius","text","backgroundColor","white","paddingBottom","spacing","unit","opacity","background","pointerEvents","Styled","Choice","e","preventDefault","ref","addEventListener","handleTouchStart","passive","removeEventListener","connectDragSource","extraStyle","margin","func","spec","canDrag","beginDrag","out","categoryId","choiceIndex","value","itemType","endDrag","monitor","didDrop","item","getItem","onRemoveChoice","DraggableChoice","uid","connect","dragSource","withUid"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport { withStyles } from '@material-ui/core/styles';\nimport classNames from 'classnames';\nimport { DragSource } from 'react-dnd';\nimport { uid } from '@pie-lib/pie-toolbox/drag';\nimport Card from '@material-ui/core/Card';\nimport CardContent from '@material-ui/core/CardContent';\nimport { color } from '@pie-lib/pie-toolbox/render-ui';\nimport debug from 'debug';\n\nconst log = debug('@pie-ui:categorize:choice');\n\nexport const ChoiceType = {\n content: PropTypes.string.isRequired,\n id: PropTypes.string,\n};\n\nexport class Layout extends React.Component {\n static propTypes = {\n ...ChoiceType,\n classes: PropTypes.object.isRequired,\n className: PropTypes.string,\n disabled: PropTypes.bool,\n correct: PropTypes.bool,\n };\n static defaultProps = {};\n render() {\n const { classes, className, content, isDragging, disabled, correct } = this.props;\n\n const rootNames = classNames(\n correct === true && 'correct',\n correct === false && 'incorrect',\n classes.choice,\n isDragging && classes.dragging,\n disabled && classes.disabled,\n className,\n );\n const cardNames = classNames(classes.card);\n return (\n <div className={rootNames}>\n <Card className={cardNames}>\n <CardContent classes={{ root: classes.cardRoot }} dangerouslySetInnerHTML={{ __html: content }} />\n </Card>\n </div>\n );\n }\n}\n\nconst styles = (theme) => ({\n choice: {\n direction: 'initial',\n cursor: 'pointer',\n width: '100%',\n '&.correct': {\n border: `solid 2px ${color.correct()}`,\n },\n '&.incorrect': {\n border: `solid 2px ${color.incorrect()}`,\n },\n borderRadius: '6px',\n },\n cardRoot: {\n color: color.text(),\n backgroundColor: color.white(),\n '&:last-child': {\n paddingBottom: theme.spacing.unit * 2,\n },\n borderRadius: '4px',\n border: '1px solid',\n },\n disabled: {\n cursor: 'not-allowed',\n opacity: '0.6',\n },\n dragging: {\n cursor: 'move',\n },\n card: {\n color: color.text(),\n backgroundColor: color.background(),\n width: '100%',\n // Added for touch devices, for image content.\n // This will prevent the context menu from appearing and not allowing other interactions with the image.\n pointerEvents: 'none',\n },\n});\n\nconst Styled = withStyles(styles)(Layout);\n\nexport class Choice extends React.Component {\n static propTypes = {\n ...ChoiceType,\n extraStyle: PropTypes.object,\n connectDragSource: PropTypes.func.isRequired,\n };\n\n componentDidMount() {\n if (this.ref) {\n this.ref.addEventListener('touchstart', this.handleTouchStart, { passive: false });\n }\n }\n\n componentWillUnmount() {\n if (this.ref) {\n this.ref.removeEventListener('touchstart', this.handleTouchStart);\n }\n }\n\n handleTouchStart = (e) => {\n e.preventDefault();\n };\n\n render() {\n const { connectDragSource, id, content, disabled, isDragging, correct, extraStyle } = this.props;\n\n return connectDragSource(\n <div\n style={{ margin: '4px', ...extraStyle }}\n ref={(ref) => (this.ref = ref)}\n draggable={!disabled}\n >\n <Styled id={id} content={content} disabled={disabled} correct={correct} isDragging={isDragging} />\n </div>,\n );\n }\n}\n\nexport const spec = {\n canDrag: (props) => !props.disabled,\n beginDrag: (props) => {\n const out = {\n id: props.id,\n categoryId: props.categoryId,\n choiceIndex: props.choiceIndex,\n value: props.content,\n itemType: 'categorize'\n };\n log('[beginDrag] out:', out);\n return out;\n },\n endDrag: (props, monitor) => {\n if (!monitor.didDrop()) {\n const item = monitor.getItem();\n if (item.categoryId) {\n log('wasnt droppped - what to do?');\n props.onRemoveChoice(item);\n }\n }\n }\n};\n\nconst DraggableChoice = DragSource(\n ({ uid }) => uid,\n spec,\n (connect, monitor) => ({\n connectDragSource: connect.dragSource(),\n isDragging: monitor.isDragging(),\n }),\n)(Choice);\n\nexport default uid.withUid(DraggableChoice);\n"],"file":"choice.js"}
|
package/lib/index.js
CHANGED
|
@@ -50,7 +50,9 @@ var Categorize = /*#__PURE__*/function (_HTMLElement) {
|
|
|
50
50
|
set: function set(m) {
|
|
51
51
|
this._model = m;
|
|
52
52
|
this.eliminateBlindAnswersFromSession();
|
|
53
|
-
this.dispatchEvent(new _piePlayerEvents.ModelSetEvent(this.tagName.toLowerCase(), this.isComplete(), !!this._model));
|
|
53
|
+
this.dispatchEvent(new _piePlayerEvents.ModelSetEvent(this.tagName.toLowerCase(), this.isComplete(), !!this._model)); // reset the audioInitialized to false since the model changed, and we might need to reinitialize the audio
|
|
54
|
+
|
|
55
|
+
this._audioInitialized = false;
|
|
54
56
|
this.render();
|
|
55
57
|
}
|
|
56
58
|
}, {
|
|
@@ -164,6 +166,8 @@ var Categorize = /*#__PURE__*/function (_HTMLElement) {
|
|
|
164
166
|
var observer = new MutationObserver(function (mutationsList, observer) {
|
|
165
167
|
mutationsList.forEach(function (mutation) {
|
|
166
168
|
if (mutation.type === 'childList') {
|
|
169
|
+
if (_this._audioInitialized) return;
|
|
170
|
+
|
|
167
171
|
var audio = _this.querySelector('audio');
|
|
168
172
|
|
|
169
173
|
var isInsidePrompt = audio && audio.closest('#preview-prompt');
|
|
@@ -237,7 +241,9 @@ var Categorize = /*#__PURE__*/function (_HTMLElement) {
|
|
|
237
241
|
_this._audio = audio;
|
|
238
242
|
_this._handlePlaying = handlePlaying;
|
|
239
243
|
_this._handleEnded = handleEnded;
|
|
240
|
-
_this._enableAudio = enableAudio;
|
|
244
|
+
_this._enableAudio = enableAudio; // set to true to prevent multiple initializations
|
|
245
|
+
|
|
246
|
+
_this._audioInitialized = true;
|
|
241
247
|
observer.disconnect();
|
|
242
248
|
}
|
|
243
249
|
});
|
package/lib/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/index.js"],"names":["Categorize","m","_model","eliminateBlindAnswersFromSession","dispatchEvent","ModelSetEvent","tagName","toLowerCase","isComplete","render","autoplayAudioEnabled","completeAudioEnabled","audioComplete","_session","answers","Array","isArray","some","answer","choices","length","s","mappedChoices","map","c","id","filteredAnswers","answerChoices","filter","includes","changeAnswers","selector","SessionChangedEvent","info","document","createElement","Object","assign","style","position","top","width","height","display","justifyContent","alignItems","background","zIndex","cursor","img","src","EnableAudioAutoplayImage","alt","appendChild","observer","MutationObserver","mutationsList","forEach","mutation","type","audio","querySelector","isInsidePrompt","closest","_createAudioInfoToast","container","enableAudio","play","removeChild","removeEventListener","setTimeout","paused","addEventListener","handlePlaying","audioStartTime","Date","getTime","handleEnded","audioEndTime","waitTime","_audio","_handlePlaying","_handleEnded","_enableAudio","disconnect","observe","childList","subtree","el","React","CategorizeComponent","model","session","onAnswersChange","bind","onShowCorrectToggle","ReactDOM","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 { EnableAudioAutoplayImage } from '@pie-lib/pie-toolbox/render-ui';\nimport { SessionChangedEvent, ModelSetEvent } from '@pie-framework/pie-player-events';\nimport CategorizeComponent from './categorize';\n\nexport default class Categorize extends HTMLElement {\n set model(m) {\n this._model = m;\n\n this.eliminateBlindAnswersFromSession();\n this.dispatchEvent(new ModelSetEvent(this.tagName.toLowerCase(), this.isComplete(), !!this._model));\n this.render();\n }\n\n isComplete() {\n const { autoplayAudioEnabled, completeAudioEnabled } =this._model || {};\n\n if (autoplayAudioEnabled && completeAudioEnabled && !this.audioComplete) {\n return false;\n }\n\n if (!this._session || !this._session.answers) {\n return false;\n }\n\n if (!Array.isArray(this._session.answers)) {\n return false;\n }\n\n return this._session.answers.some((answer) => answer.choices && answer.choices.length > 0);\n }\n\n set session(s) {\n if (s && !s.answers) {\n s.answers = [];\n }\n\n this._session = s;\n this.render();\n }\n\n get session() {\n return this._session;\n }\n\n eliminateBlindAnswersFromSession() {\n const { answers = [] } = this._session || {};\n const { choices = [] } = this._model || {};\n\n const mappedChoices = choices.map((c) => c.id) || [];\n const filteredAnswers = answers.map((answer) => {\n const answerChoices = answer?.choices || [];\n answer.choices = answerChoices.filter((c) => mappedChoices.includes(c));\n\n return answer;\n });\n\n if (filteredAnswers.length > 0) {\n this.changeAnswers(filteredAnswers);\n }\n }\n\n changeAnswers(answers) {\n this._session.answers = answers;\n this._session.selector = 'Mouse';\n\n this.dispatchEvent(new SessionChangedEvent(this.tagName.toLowerCase(), this.isComplete()));\n\n this.render();\n }\n\n onShowCorrectToggle() {\n renderMath(this);\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 cursor: 'pointer'\n });\n\n const img = document.createElement('img');\n img.src = EnableAudioAutoplayImage;\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\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 (!this._model) return;\n if (!this._model.autoplayAudioEnabled) return;\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 //timestamp when auto-played audio started playing\n this._session.audioStartTime = this._session.audioStartTime || new Date().getTime();\n\n const info = this.querySelector('#play-audio-info');\n if (info) {\n container.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 //timestamp when auto-played audio completed playing\n this._session.audioEndTime = this._session.audioEndTime || new Date().getTime();\n\n let { audioStartTime, audioEndTime, waitTime } = this._session;\n if(!waitTime && audioStartTime && audioEndTime) {\n // waitTime is elapsed time the user waited for auto-played audio to finish\n this._session.waitTime = (audioEndTime - audioStartTime);\n }\n\n this.audioComplete = true;\n this.dispatchEvent(new SessionChangedEvent(this.tagName.toLowerCase(), this.isComplete()));\n\n audio.removeEventListener('ended', handleEnded);\n };\n\n audio.addEventListener('ended', handleEnded);\n\n // store references to remove later\n this._audio = audio;\n this._handlePlaying = handlePlaying;\n this._handleEnded = handleEnded;\n this._enableAudio = enableAudio;\n\n observer.disconnect();\n }\n });\n });\n\n observer.observe(this, { childList: true, subtree: true });\n }\n\n disconnectedCallback() {\n document.removeEventListener('click', this._enableAudio);\n\n if (this._audio) {\n this._audio.removeEventListener('playing', this._handlePlaying);\n this._audio.removeEventListener('ended', this._handleEnded);\n this._audio = null;\n }\n }\n\n render() {\n if (this._model && this._session) {\n const el = React.createElement(CategorizeComponent, {\n model: this._model,\n session: this._session,\n onAnswersChange: this.changeAnswers.bind(this),\n onShowCorrectToggle: this.onShowCorrectToggle.bind(this),\n });\n\n ReactDOM.render(el, this, () => {\n renderMath(this);\n });\n }\n }\n}\n"],"file":"index.js"}
|
|
1
|
+
{"version":3,"sources":["../src/index.js"],"names":["Categorize","m","_model","eliminateBlindAnswersFromSession","dispatchEvent","ModelSetEvent","tagName","toLowerCase","isComplete","_audioInitialized","render","autoplayAudioEnabled","completeAudioEnabled","audioComplete","_session","answers","Array","isArray","some","answer","choices","length","s","mappedChoices","map","c","id","filteredAnswers","answerChoices","filter","includes","changeAnswers","selector","SessionChangedEvent","info","document","createElement","Object","assign","style","position","top","width","height","display","justifyContent","alignItems","background","zIndex","cursor","img","src","EnableAudioAutoplayImage","alt","appendChild","observer","MutationObserver","mutationsList","forEach","mutation","type","audio","querySelector","isInsidePrompt","closest","_createAudioInfoToast","container","enableAudio","play","removeChild","removeEventListener","setTimeout","paused","addEventListener","handlePlaying","audioStartTime","Date","getTime","handleEnded","audioEndTime","waitTime","_audio","_handlePlaying","_handleEnded","_enableAudio","disconnect","observe","childList","subtree","el","React","CategorizeComponent","model","session","onAnswersChange","bind","onShowCorrectToggle","ReactDOM","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 { EnableAudioAutoplayImage } from '@pie-lib/pie-toolbox/render-ui';\nimport { SessionChangedEvent, ModelSetEvent } from '@pie-framework/pie-player-events';\nimport CategorizeComponent from './categorize';\n\nexport default class Categorize extends HTMLElement {\n set model(m) {\n this._model = m;\n\n this.eliminateBlindAnswersFromSession();\n this.dispatchEvent(new ModelSetEvent(this.tagName.toLowerCase(), this.isComplete(), !!this._model));\n // reset the audioInitialized to false since the model changed, and we might need to reinitialize the audio\n this._audioInitialized = false;\n\n this.render();\n }\n\n isComplete() {\n const { autoplayAudioEnabled, completeAudioEnabled } =this._model || {};\n\n if (autoplayAudioEnabled && completeAudioEnabled && !this.audioComplete) {\n return false;\n }\n\n if (!this._session || !this._session.answers) {\n return false;\n }\n\n if (!Array.isArray(this._session.answers)) {\n return false;\n }\n\n return this._session.answers.some((answer) => answer.choices && answer.choices.length > 0);\n }\n\n set session(s) {\n if (s && !s.answers) {\n s.answers = [];\n }\n\n this._session = s;\n this.render();\n }\n\n get session() {\n return this._session;\n }\n\n eliminateBlindAnswersFromSession() {\n const { answers = [] } = this._session || {};\n const { choices = [] } = this._model || {};\n\n const mappedChoices = choices.map((c) => c.id) || [];\n const filteredAnswers = answers.map((answer) => {\n const answerChoices = answer?.choices || [];\n answer.choices = answerChoices.filter((c) => mappedChoices.includes(c));\n\n return answer;\n });\n\n if (filteredAnswers.length > 0) {\n this.changeAnswers(filteredAnswers);\n }\n }\n\n changeAnswers(answers) {\n this._session.answers = answers;\n this._session.selector = 'Mouse';\n\n this.dispatchEvent(new SessionChangedEvent(this.tagName.toLowerCase(), this.isComplete()));\n\n this.render();\n }\n\n onShowCorrectToggle() {\n renderMath(this);\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 cursor: 'pointer'\n });\n\n const img = document.createElement('img');\n img.src = EnableAudioAutoplayImage;\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\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 if (this._audioInitialized) return;\n const audio = this.querySelector('audio');\n const isInsidePrompt = audio && audio.closest('#preview-prompt');\n\n if (!this._model) return;\n if (!this._model.autoplayAudioEnabled) return;\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 //timestamp when auto-played audio started playing\n this._session.audioStartTime = this._session.audioStartTime || new Date().getTime();\n\n const info = this.querySelector('#play-audio-info');\n if (info) {\n container.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 //timestamp when auto-played audio completed playing\n this._session.audioEndTime = this._session.audioEndTime || new Date().getTime();\n\n let { audioStartTime, audioEndTime, waitTime } = this._session;\n if(!waitTime && audioStartTime && audioEndTime) {\n // waitTime is elapsed time the user waited for auto-played audio to finish\n this._session.waitTime = (audioEndTime - audioStartTime);\n }\n\n this.audioComplete = true;\n this.dispatchEvent(new SessionChangedEvent(this.tagName.toLowerCase(), this.isComplete()));\n\n audio.removeEventListener('ended', handleEnded);\n };\n\n audio.addEventListener('ended', handleEnded);\n\n // store references to remove later\n this._audio = audio;\n this._handlePlaying = handlePlaying;\n this._handleEnded = handleEnded;\n this._enableAudio = enableAudio;\n // set to true to prevent multiple initializations\n this._audioInitialized = true;\n\n observer.disconnect();\n }\n });\n });\n\n observer.observe(this, { childList: true, subtree: true });\n }\n\n disconnectedCallback() {\n document.removeEventListener('click', this._enableAudio);\n\n if (this._audio) {\n this._audio.removeEventListener('playing', this._handlePlaying);\n this._audio.removeEventListener('ended', this._handleEnded);\n this._audio = null;\n }\n }\n\n render() {\n if (this._model && this._session) {\n const el = React.createElement(CategorizeComponent, {\n model: this._model,\n session: this._session,\n onAnswersChange: this.changeAnswers.bind(this),\n onShowCorrectToggle: this.onShowCorrectToggle.bind(this),\n });\n\n ReactDOM.render(el, this, () => {\n renderMath(this);\n });\n }\n }\n}\n"],"file":"index.js"}
|
package/package.json
CHANGED
|
@@ -4,14 +4,14 @@
|
|
|
4
4
|
"publishConfig": {
|
|
5
5
|
"access": "public"
|
|
6
6
|
},
|
|
7
|
-
"version": "9.13.4-next.
|
|
7
|
+
"version": "9.13.4-next.13+154742a17",
|
|
8
8
|
"description": "",
|
|
9
9
|
"author": "pie framework developers",
|
|
10
10
|
"license": "ISC",
|
|
11
11
|
"dependencies": {
|
|
12
12
|
"@material-ui/core": "^3.9.2",
|
|
13
13
|
"@pie-framework/pie-player-events": "^0.1.0",
|
|
14
|
-
"@pie-lib/pie-toolbox": "2.14.
|
|
14
|
+
"@pie-lib/pie-toolbox": "2.14.4",
|
|
15
15
|
"classnames": "^2.2.5",
|
|
16
16
|
"debug": "^4.1.1",
|
|
17
17
|
"lodash": "^4.17.15",
|
|
@@ -20,7 +20,7 @@
|
|
|
20
20
|
"react-dnd": "^14.0.5",
|
|
21
21
|
"react-dom": "^16.8.1"
|
|
22
22
|
},
|
|
23
|
-
"gitHead": "
|
|
23
|
+
"gitHead": "154742a17da4c55e18d90dd14ccbc36f23eb24d0",
|
|
24
24
|
"scripts": {
|
|
25
25
|
"postpublish": "../../scripts/postpublish"
|
|
26
26
|
},
|