UNPKG

@instructure/quiz-interactions

Version:

A React UI component Library for quiz interaction types.

111 lines (110 loc) 4.37 kB
import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck"; import _createClass from "@babel/runtime/helpers/esm/createClass"; import _possibleConstructorReturn from "@babel/runtime/helpers/esm/possibleConstructorReturn"; import _getPrototypeOf from "@babel/runtime/helpers/esm/getPrototypeOf"; import _inherits from "@babel/runtime/helpers/esm/inherits"; import _defineProperty from "@babel/runtime/helpers/esm/defineProperty"; function _callSuper(_this, derived, args) { function isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { return !Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); } catch (e) { return false; } } derived = _getPrototypeOf(derived); return _possibleConstructorReturn(_this, isNativeReflectConstruct() ? Reflect.construct(derived, args || [], _getPrototypeOf(_this).constructor) : derived.apply(_this, args)); } import React, { Component } from 'react'; import PropTypes from 'prop-types'; import pickBy from 'lodash/fp/pickBy'; import forEach from 'lodash/fp/forEach'; import Alert from '../Alert'; var dummyImg = 'https://i.ytimg.com/vi/LgkAebhJ7iE/maxresdefault.jpg'; function clone(children, props) { return React.cloneElement(children, pickBy(function (prop) { return prop !== void 0; }, props)); } var TakeStateProvider = /*#__PURE__*/function (_Component) { function TakeStateProvider() { var _this2; _classCallCheck(this, TakeStateProvider); for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) { args[_key] = arguments[_key]; } _this2 = _callSuper(this, TakeStateProvider, [].concat(args)); _defineProperty(_this2, "state", { userResponse: void 0 }); // storage for the currently ongoing requests _defineProperty(_this2, "uploadRequests", null); // generates the callback used when an upload has finished _defineProperty(_this2, "makeUploadHandler", function (id, callback) { return function () { delete _this2.uploadRequests[id]; callback(dummyImg); }; }); _defineProperty(_this2, "cancelMediaUpload", function (id) { clearTimeout(_this2.uploadRequests[id]); delete _this2.uploadRequests[id]; }); _defineProperty(_this2, "handleResponseUpdate", function (value, properties) { _this2.setState({ userResponse: { value: value, properties: properties } }); }); _defineProperty(_this2, "notifyScreenreader", function (content) { return _this2.alert.setAlert(content); }); _defineProperty(_this2, "mediaUpload", function (id, file, callback) { // Simulates the upload of file // calls callback when the upload has finished if (_this2.uploadRequests[id] !== void 0) { _this2.cancelMediaUpload(id); } _this2.uploadRequests[id] = setTimeout(_this2.makeUploadHandler(id, callback), 2000 + Math.random() * 2000); }); _defineProperty(_this2, "handleAlertRef", function (node) { _this2.alert = node; }); return _this2; } _inherits(TakeStateProvider, _Component); return _createClass(TakeStateProvider, [{ key: "UNSAFE_componentWillMount", value: function UNSAFE_componentWillMount() { this.uploadRequests = {}; } }, { key: "componentWillUnmount", value: function componentWillUnmount() { forEach(clearTimeout, this.uploadRequests); } }, { key: "render", value: function render() { console.log('Current Response:', this.state.userResponse); // eslint-disable-line no-console return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(Alert, { ref: this.handleAlertRef }), clone(this.props.children, { notifyScreenreader: this.notifyScreenreader, userResponse: this.state.userResponse, handleResponseUpdate: this.handleResponseUpdate, cancelMediaUpload: this.cancelMediaUpload, mediaUpload: this.mediaUpload })); } }]); }(Component); _defineProperty(TakeStateProvider, "propTypes", { children: PropTypes.node.isRequired }); export { TakeStateProvider as default };