@pie-element/extended-text-entry 6.8.1 → 6.8.4-annotations.0

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.
@@ -0,0 +1,265 @@
1
+ "use strict";
2
+
3
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
4
+
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports["default"] = void 0;
9
+
10
+ var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
11
+
12
+ var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
13
+
14
+ var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
15
+
16
+ var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
17
+
18
+ var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
19
+
20
+ var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
21
+
22
+ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
23
+
24
+ var _react = _interopRequireDefault(require("react"));
25
+
26
+ var _classnames = _interopRequireDefault(require("classnames"));
27
+
28
+ var _propTypes = _interopRequireDefault(require("prop-types"));
29
+
30
+ var _core = require("@material-ui/core");
31
+
32
+ var _styles = require("@material-ui/core/styles");
33
+
34
+ function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
35
+
36
+ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
37
+
38
+ var styles = {
39
+ wrapper: {
40
+ width: '200px',
41
+ overflow: 'hidden',
42
+ borderRadius: '4px',
43
+ backgroundColor: '#ffffff',
44
+ border: '4px solid #d3d3d3',
45
+ '&.negative': {
46
+ borderColor: 'rgb(255, 204, 238) !important'
47
+ },
48
+ '&.positive': {
49
+ borderColor: 'rgb(153, 255, 153) !important'
50
+ }
51
+ },
52
+ holder: {
53
+ display: 'flex',
54
+ flexWrap: 'wrap',
55
+ borderTop: '2px solid #d3d3d3'
56
+ },
57
+ positive: {
58
+ backgroundColor: 'rgb(153, 255, 153) !important',
59
+ '&:hover': {
60
+ filter: 'brightness(85%)'
61
+ }
62
+ },
63
+ negative: {
64
+ backgroundColor: 'rgb(255, 204, 238) !important',
65
+ '&:hover': {
66
+ filter: 'brightness(85%)'
67
+ }
68
+ },
69
+ button: {
70
+ flexGrow: 1,
71
+ width: '28%',
72
+ textAlign: 'center',
73
+ padding: '4px',
74
+ cursor: 'pointer',
75
+ '&:not(:nth-child(3n))': {
76
+ borderRight: '1px solid #d3d3d3'
77
+ },
78
+ '&:hover': {
79
+ backgroundColor: '#d3d3d3'
80
+ },
81
+ '&.negative:hover': {
82
+ backgroundColor: 'rgb(153, 255, 153) !important'
83
+ },
84
+ '&.positive:hover': {
85
+ backgroundColor: 'rgb(255, 204, 238) !important'
86
+ }
87
+ },
88
+ arrow: {
89
+ overflowX: 'unset',
90
+ overflowY: 'unset',
91
+ marginLeft: '16px',
92
+ '&::before': {
93
+ position: 'absolute',
94
+ right: '100%',
95
+ top: '13px',
96
+ border: 'solid transparent',
97
+ content: '""',
98
+ height: 0,
99
+ width: 0,
100
+ pointerEvents: 'none',
101
+ borderWidth: '7px',
102
+ borderRightColor: '#d3d3d3'
103
+ },
104
+ '&.negative::before': {
105
+ borderRightColor: 'rgb(255, 204, 238) !important'
106
+ },
107
+ '&.positive::before': {
108
+ borderRightColor: 'rgb(153, 255, 153) !important'
109
+ }
110
+ }
111
+ };
112
+
113
+ var FreeformEditor = /*#__PURE__*/function (_React$Component) {
114
+ (0, _inherits2["default"])(FreeformEditor, _React$Component);
115
+
116
+ var _super = _createSuper(FreeformEditor);
117
+
118
+ function FreeformEditor(props) {
119
+ var _this;
120
+
121
+ (0, _classCallCheck2["default"])(this, FreeformEditor);
122
+ _this = _super.call(this, props);
123
+ (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "onValueChange", function (event) {
124
+ return _this.setState({
125
+ value: event.target.value
126
+ });
127
+ });
128
+ (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleSave", function () {
129
+ var _this$props = _this.props,
130
+ oldValue = _this$props.value,
131
+ onSave = _this$props.onSave,
132
+ onClose = _this$props.onClose,
133
+ onDelete = _this$props.onDelete;
134
+ var value = _this.state.value;
135
+
136
+ if (value === '') {
137
+ onDelete();
138
+ }
139
+
140
+ if (oldValue !== value) {
141
+ onSave(oldValue, value);
142
+ }
143
+
144
+ _this.setState({
145
+ value: ''
146
+ });
147
+
148
+ onClose();
149
+ });
150
+ (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleTypeChange", function () {
151
+ var _this$props2 = _this.props,
152
+ onTypeChange = _this$props2.onTypeChange,
153
+ onDelete = _this$props2.onDelete;
154
+ var value = _this.state.value;
155
+
156
+ if (value === '') {
157
+ onDelete();
158
+ } else {
159
+ onTypeChange(value);
160
+ }
161
+
162
+ _this.setState({
163
+ value: ''
164
+ });
165
+ });
166
+ _this.state = {
167
+ value: props.value
168
+ };
169
+ return _this;
170
+ }
171
+
172
+ (0, _createClass2["default"])(FreeformEditor, [{
173
+ key: "UNSAFE_componentWillReceiveProps",
174
+ value: function UNSAFE_componentWillReceiveProps(nextProps) {
175
+ var value = nextProps.value;
176
+ var propsValue = this.props.value;
177
+
178
+ if (value !== propsValue) {
179
+ this.setState({
180
+ value: value
181
+ });
182
+ }
183
+ }
184
+ }, {
185
+ key: "render",
186
+ value: function render() {
187
+ var _this$props3 = this.props,
188
+ anchorEl = _this$props3.anchorEl,
189
+ classes = _this$props3.classes,
190
+ offset = _this$props3.offset,
191
+ onDelete = _this$props3.onDelete,
192
+ open = _this$props3.open,
193
+ type = _this$props3.type;
194
+ var value = this.state.value;
195
+ return /*#__PURE__*/_react["default"].createElement(_core.Popover, {
196
+ anchorEl: anchorEl,
197
+ elevation: 2,
198
+ open: open,
199
+ onClose: this.handleSave,
200
+ classes: {
201
+ paper: (0, _classnames["default"])(classes.arrow, type)
202
+ },
203
+ style: {
204
+ marginTop: "".concat(offset, "px"),
205
+ transition: 'margin-top 2s ease-out'
206
+ },
207
+ anchorOrigin: {
208
+ vertical: 'top',
209
+ horizontal: 'right'
210
+ },
211
+ transformOrigin: {
212
+ vertical: 'top',
213
+ horizontal: 'left'
214
+ }
215
+ }, /*#__PURE__*/_react["default"].createElement("div", {
216
+ className: (0, _classnames["default"])(classes.wrapper, type)
217
+ }, /*#__PURE__*/_react["default"].createElement(_core.TextField, {
218
+ id: "annotation-editor",
219
+ style: {
220
+ padding: '2px 5px',
221
+ width: '95%'
222
+ },
223
+ autoFocus: true,
224
+ multiline: true,
225
+ rows: 1,
226
+ rowsMax: 4,
227
+ value: value,
228
+ onChange: this.onValueChange,
229
+ InputProps: {
230
+ disableUnderline: true
231
+ }
232
+ }), /*#__PURE__*/_react["default"].createElement("div", {
233
+ className: classes.holder
234
+ }, /*#__PURE__*/_react["default"].createElement("div", {
235
+ className: classes.button,
236
+ onClick: onDelete
237
+ }, "Delete"), /*#__PURE__*/_react["default"].createElement("div", {
238
+ className: (0, _classnames["default"])(classes.button, type),
239
+ onClick: this.handleTypeChange
240
+ }, type === 'negative' ? 'Green' : 'Pink'), /*#__PURE__*/_react["default"].createElement("div", {
241
+ className: classes.button,
242
+ onClick: this.handleSave
243
+ }, "Save"))));
244
+ }
245
+ }]);
246
+ return FreeformEditor;
247
+ }(_react["default"].Component);
248
+
249
+ (0, _defineProperty2["default"])(FreeformEditor, "propTypes", {
250
+ anchorEl: _propTypes["default"].object,
251
+ open: _propTypes["default"].bool,
252
+ offset: _propTypes["default"].number,
253
+ value: _propTypes["default"].string,
254
+ type: _propTypes["default"].string,
255
+ onClose: _propTypes["default"].func,
256
+ onDelete: _propTypes["default"].func,
257
+ onSave: _propTypes["default"].func,
258
+ onTypeChange: _propTypes["default"].func
259
+ });
260
+ ;
261
+
262
+ var _default = (0, _styles.withStyles)(styles)(FreeformEditor);
263
+
264
+ exports["default"] = _default;
265
+ //# sourceMappingURL=freeform-editor.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../src/annotation/freeform-editor.jsx"],"names":["styles","wrapper","width","overflow","borderRadius","backgroundColor","border","borderColor","holder","display","flexWrap","borderTop","positive","filter","negative","button","flexGrow","textAlign","padding","cursor","borderRight","arrow","overflowX","overflowY","marginLeft","position","right","top","content","height","pointerEvents","borderWidth","borderRightColor","FreeformEditor","props","event","setState","value","target","oldValue","onSave","onClose","onDelete","state","onTypeChange","nextProps","propsValue","anchorEl","classes","offset","open","type","handleSave","paper","marginTop","transition","vertical","horizontal","onValueChange","disableUnderline","handleTypeChange","React","Component","PropTypes","object","bool","number","string","func"],"mappings":"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","sourcesContent":["import React from 'react';\nimport classNames from 'classnames';\nimport PropTypes from 'prop-types';\nimport { Popover, TextField } from '@material-ui/core';\nimport { withStyles } from '@material-ui/core/styles';\n\nconst styles = {\n wrapper: {\n width: '200px',\n overflow: 'hidden',\n borderRadius: '4px',\n backgroundColor: '#ffffff',\n border: '4px solid #d3d3d3',\n '&.negative': {\n borderColor: 'rgb(255, 204, 238) !important'\n },\n '&.positive': {\n borderColor: 'rgb(153, 255, 153) !important'\n }\n },\n holder: {\n display: 'flex',\n flexWrap: 'wrap',\n borderTop: '2px solid #d3d3d3'\n },\n positive: {\n backgroundColor: 'rgb(153, 255, 153) !important',\n '&:hover': {\n filter: 'brightness(85%)'\n }\n },\n negative: {\n backgroundColor: 'rgb(255, 204, 238) !important',\n '&:hover': {\n filter: 'brightness(85%)'\n }\n },\n button: {\n flexGrow: 1,\n width: '28%',\n textAlign: 'center',\n padding: '4px',\n cursor: 'pointer',\n '&:not(:nth-child(3n))': {\n borderRight: '1px solid #d3d3d3',\n },\n '&:hover': {\n backgroundColor: '#d3d3d3'\n },\n '&.negative:hover': {\n backgroundColor: 'rgb(153, 255, 153) !important',\n },\n '&.positive:hover': {\n backgroundColor: 'rgb(255, 204, 238) !important',\n }\n },\n arrow: {\n overflowX: 'unset',\n overflowY: 'unset',\n marginLeft: '16px',\n '&::before': {\n position: 'absolute',\n right: '100%',\n top: '13px',\n border: 'solid transparent',\n content: '\"\"',\n height: 0,\n width: 0,\n pointerEvents: 'none',\n borderWidth: '7px',\n borderRightColor: '#d3d3d3'\n },\n '&.negative::before': {\n borderRightColor: 'rgb(255, 204, 238) !important'\n },\n '&.positive::before': {\n borderRightColor: 'rgb(153, 255, 153) !important'\n }\n }\n};\n\nclass FreeformEditor extends React.Component {\n static propTypes = {\n anchorEl: PropTypes.object,\n open: PropTypes.bool,\n offset: PropTypes.number,\n value: PropTypes.string,\n type: PropTypes.string,\n onClose: PropTypes.func,\n onDelete: PropTypes.func,\n onSave: PropTypes.func,\n onTypeChange: PropTypes.func,\n };\n\n constructor(props) {\n super(props);\n this.state = { value: props.value };\n };\n\n UNSAFE_componentWillReceiveProps(nextProps) {\n const { value } = nextProps;\n const { value: propsValue } = this.props;\n\n if (value !== propsValue) {\n this.setState({ value });\n }\n };\n\n onValueChange = event => this.setState({ value: event.target.value });\n\n handleSave = () => {\n const { value: oldValue, onSave, onClose, onDelete } = this.props;\n const { value } = this.state;\n\n if (value === '') {\n onDelete();\n }\n\n if (oldValue !== value) {\n onSave(oldValue, value);\n }\n\n this.setState({ value: '' });\n onClose();\n };\n\n handleTypeChange = () => {\n const { onTypeChange, onDelete } = this.props;\n const { value } = this.state;\n\n if (value === '') {\n onDelete();\n } else {\n onTypeChange(value);\n }\n\n this.setState({ value: '' });\n };\n\n render() {\n const { anchorEl, classes, offset, onDelete, open, type } = this.props;\n const { value } = this.state;\n\n return (\n <Popover\n anchorEl={anchorEl}\n elevation={2}\n open={open}\n onClose={this.handleSave}\n classes={{ paper: classNames(classes.arrow, type) }}\n style={{ marginTop: `${offset}px`, transition: 'margin-top 2s ease-out' }}\n anchorOrigin={{\n vertical: 'top',\n horizontal: 'right',\n }}\n transformOrigin={{\n vertical: 'top',\n horizontal: 'left',\n }}\n >\n <div className={classNames(classes.wrapper, type)}>\n <TextField\n id=\"annotation-editor\"\n style={{\n padding: '2px 5px',\n width: '95%'\n }}\n autoFocus\n multiline\n rows={1}\n rowsMax={4}\n value={value}\n onChange={this.onValueChange}\n InputProps={{ disableUnderline: true }}\n />\n <div className={classes.holder}>\n <div className={classes.button} onClick={onDelete}>\n Delete\n </div>\n <div className={classNames(classes.button, type)} onClick={this.handleTypeChange} >\n { type === 'negative' ? 'Green' : 'Pink' }\n </div>\n <div className={classes.button} onClick={this.handleSave} >\n Save\n </div>\n </div>\n </div>\n </Popover>\n );\n }\n};\n\nexport default withStyles(styles)(FreeformEditor);\n"],"file":"freeform-editor.js"}
package/lib/index.js CHANGED
@@ -31,6 +31,8 @@ var _reactDom = _interopRequireDefault(require("react-dom"));
31
31
 
32
32
  var _piePlayerEvents = require("@pie-framework/pie-player-events");
33
33
 
34
+ var _mathRendering = require("@pie-lib/math-rendering");
35
+
34
36
  var _debug = _interopRequireDefault(require("debug"));
35
37
 
36
38
  function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
@@ -94,10 +96,25 @@ var RootExtendedTextEntry = /*#__PURE__*/function (_HTMLElement) {
94
96
  this.render();
95
97
  }
96
98
  }, {
97
- key: "handleChange",
98
- value: function handleChange(value) {
99
+ key: "valueChange",
100
+ value: function valueChange(value) {
99
101
  this._session.value = value;
100
102
  this.dispatchEvent(new _piePlayerEvents.SessionChangedEvent(this.tagName.toLowerCase(), isComplete(value)));
103
+ this.render();
104
+ }
105
+ }, {
106
+ key: "annotationsChange",
107
+ value: function annotationsChange(annotations) {
108
+ this._session.annotations = annotations;
109
+ this.dispatchEvent(new _piePlayerEvents.SessionChangedEvent(this.tagName.toLowerCase(), true));
110
+ this.render();
111
+ }
112
+ }, {
113
+ key: "commentChange",
114
+ value: function commentChange(comment) {
115
+ this._session.comment = comment;
116
+ this.dispatchEvent(new _piePlayerEvents.SessionChangedEvent(this.tagName.toLowerCase(), isComplete(comment)));
117
+ this.render();
101
118
  }
102
119
  }, {
103
120
  key: "connectedCallback",
@@ -107,14 +124,20 @@ var RootExtendedTextEntry = /*#__PURE__*/function (_HTMLElement) {
107
124
  }, {
108
125
  key: "render",
109
126
  value: function render() {
127
+ var _this2 = this;
128
+
110
129
  if (this._model && this._session) {
111
130
  var elem = /*#__PURE__*/_react["default"].createElement(_main["default"], {
112
131
  model: this._model,
113
132
  session: this._session,
114
- onChange: this.handleChange.bind(this)
133
+ onValueChange: this.valueChange.bind(this),
134
+ onAnnotationsChange: this.annotationsChange.bind(this),
135
+ onCommentChange: this.commentChange.bind(this)
115
136
  });
116
137
 
117
- _reactDom["default"].render(elem, this);
138
+ _reactDom["default"].render(elem, this, function () {
139
+ (0, _mathRendering.renderMath)(_this2);
140
+ });
118
141
  }
119
142
  }
120
143
  }]);
package/lib/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.js"],"names":["log","domParser","window","undefined","DOMParser","parseFromString","v","textContent","value","document","body","err","isComplete","tc","out","length","RootExtendedTextEntry","_model","_session","m","dispatchEvent","ModelSetEvent","tagName","toLowerCase","render","s","SessionChangedEvent","elem","React","createElement","Main","model","session","onChange","handleChange","bind","ReactDOM","HTMLElement"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AAIA;;;;;;AAEA,IAAMA,GAAG,GAAG,uBAAM,6BAAN,CAAZ;AAEA,IAAMC,SAAS,GACb,QAAOC,MAAP,0DAAOA,MAAP,OAAkBC,SAAlB,GAA8B,IAAIC,SAAJ,EAA9B,GAAgD;AAAEC,EAAAA,eAAe,EAAE,yBAAAC,CAAC;AAAA,WAAIA,CAAJ;AAAA;AAApB,CADlD;;AAGO,SAASC,WAAT,CAAqBC,KAArB,EAA4B;AACjC,MAAI,OAAOA,KAAP,KAAiB,QAArB,EAA+B;AAC7B,WAAOL,SAAP;AACD;;AACD,MAAI;AACF,QAAMM,QAAQ,GAAGR,SAAS,CAACI,eAAV,CAA0BG,KAA1B,EAAiC,WAAjC,CAAjB;AACA,QAAMD,YAAW,GAAGE,QAAQ,CAACC,IAAT,CAAcH,WAAlC;AACA,WAAOA,YAAP;AACD,GAJD,CAIE,OAAOI,GAAP,EAAY;AACZX,IAAAA,GAAG,CAAC,kCAAD,EAAqCQ,KAArC,CAAH;AACA,WAAOA,KAAP;AACD;AACF;;AAEM,SAASI,UAAT,CAAoBJ,KAApB,EAA2B;AAChC,MAAMK,EAAE,GAAGN,WAAW,CAACC,KAAD,CAAtB;AACA,MAAMM,GAAG,GAAGD,EAAE,KAAKV,SAAP,IAAoBU,EAAE,CAACE,MAAH,GAAY,CAA5C;AACA,SAAOD,GAAP;AACD;;IAEoBE,qB;;;;;AACnB,mCAAc;AAAA;;AAAA;AACZ;AACA,UAAKC,MAAL,GAAc,IAAd;AACA,UAAKC,QAAL,GAAgB,IAAhB;AAHY;AAIb;;;;SAED,aAAUC,CAAV,EAAa;AACX,WAAKF,MAAL,GAAcE,CAAd;AACA,WAAKC,aAAL,CACE,IAAIC,8BAAJ,CAAkB,KAAKC,OAAL,CAAaC,WAAb,EAAlB,EAA8C,KAA9C,EAAqD,CAAC,CAAC,KAAKN,MAA5D,CADF;AAIA,WAAKO,MAAL;AACD;;;SAED,aAAYC,CAAZ,EAAe;AACb,WAAKP,QAAL,GAAgBO,CAAhB;AACA,WAAKD,MAAL;AACD;;;WAED,sBAAahB,KAAb,EAAoB;AAClB,WAAKU,QAAL,CAAcV,KAAd,GAAsBA,KAAtB;AAEA,WAAKY,aAAL,CACE,IAAIM,oCAAJ,CAAwB,KAAKJ,OAAL,CAAaC,WAAb,EAAxB,EAAoDX,UAAU,CAACJ,KAAD,CAA9D,CADF;AAGD;;;WAED,6BAAoB;AAClB,WAAKgB,MAAL;AACD;;;WAED,kBAAS;AACP,UAAI,KAAKP,MAAL,IAAe,KAAKC,QAAxB,EAAkC;AAChC,YAAIS,IAAI,gBAAGC,kBAAMC,aAAN,CAAoBC,gBAApB,EAA0B;AACnCC,UAAAA,KAAK,EAAE,KAAKd,MADuB;AAEnCe,UAAAA,OAAO,EAAE,KAAKd,QAFqB;AAGnCe,UAAAA,QAAQ,EAAE,KAAKC,YAAL,CAAkBC,IAAlB,CAAuB,IAAvB;AAHyB,SAA1B,CAAX;;AAKAC,6BAASZ,MAAT,CAAgBG,IAAhB,EAAsB,IAAtB;AACD;AACF;;;kDA1CgDU,W","sourcesContent":["import Main from './main';\nimport React from 'react';\nimport ReactDOM from 'react-dom';\nimport {\n ModelSetEvent,\n SessionChangedEvent\n} from '@pie-framework/pie-player-events';\nimport debug from 'debug';\n\nconst log = debug('@pie-ui:extended-text-entry');\n\nconst domParser =\n typeof window !== undefined ? new DOMParser() : { parseFromString: v => v };\n\nexport function textContent(value) {\n if (typeof value !== 'string') {\n return undefined;\n }\n try {\n const document = domParser.parseFromString(value, 'text/html');\n const textContent = document.body.textContent;\n return textContent;\n } catch (err) {\n log('tried to parse as dom and failed', value);\n return value;\n }\n}\n\nexport function isComplete(value) {\n const tc = textContent(value);\n const out = tc !== undefined && tc.length > 0;\n return out;\n}\n\nexport default class RootExtendedTextEntry extends HTMLElement {\n constructor() {\n super();\n this._model = null;\n this._session = null;\n }\n\n set model(m) {\n this._model = m;\n this.dispatchEvent(\n new ModelSetEvent(this.tagName.toLowerCase(), false, !!this._model)\n );\n\n this.render();\n }\n\n set session(s) {\n this._session = s;\n this.render();\n }\n\n handleChange(value) {\n this._session.value = value;\n\n this.dispatchEvent(\n new SessionChangedEvent(this.tagName.toLowerCase(), isComplete(value))\n );\n }\n\n connectedCallback() {\n this.render();\n }\n\n render() {\n if (this._model && this._session) {\n let elem = React.createElement(Main, {\n model: this._model,\n session: this._session,\n onChange: this.handleChange.bind(this)\n });\n ReactDOM.render(elem, this);\n }\n }\n}\n"],"file":"index.js"}
1
+ {"version":3,"sources":["../src/index.js"],"names":["log","domParser","window","undefined","DOMParser","parseFromString","v","textContent","value","document","body","err","isComplete","tc","out","length","RootExtendedTextEntry","_model","_session","m","dispatchEvent","ModelSetEvent","tagName","toLowerCase","render","s","SessionChangedEvent","annotations","comment","elem","React","createElement","Main","model","session","onValueChange","valueChange","bind","onAnnotationsChange","annotationsChange","onCommentChange","commentChange","ReactDOM","HTMLElement"],"mappings":"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","sourcesContent":["import Main from './main';\nimport React from 'react';\nimport ReactDOM from 'react-dom';\nimport {\n ModelSetEvent,\n SessionChangedEvent\n} from '@pie-framework/pie-player-events';\nimport { renderMath } from '@pie-lib/math-rendering';\nimport debug from 'debug';\n\nconst log = debug('@pie-ui:extended-text-entry');\n\nconst domParser =\n typeof window !== undefined ? new DOMParser() : { parseFromString: v => v };\n\nexport function textContent(value) {\n if (typeof value !== 'string') {\n return undefined;\n }\n\n try {\n const document = domParser.parseFromString(value, 'text/html');\n const textContent = document.body.textContent;\n\n return textContent;\n } catch (err) {\n log('tried to parse as dom and failed', value);\n return value;\n }\n}\n\nexport function isComplete(value) {\n const tc = textContent(value);\n const out = tc !== undefined && tc.length > 0;\n\n return out;\n}\n\nexport default class RootExtendedTextEntry extends HTMLElement {\n constructor() {\n super();\n this._model = null;\n this._session = null;\n }\n\n set model(m) {\n this._model = m;\n this.dispatchEvent(\n new ModelSetEvent(this.tagName.toLowerCase(), false, !!this._model)\n );\n\n this.render();\n }\n\n set session(s) {\n this._session = s;\n this.render();\n }\n\n valueChange(value) {\n this._session.value = value;\n this.dispatchEvent(\n new SessionChangedEvent(this.tagName.toLowerCase(), isComplete(value))\n );\n\n this.render();\n }\n\n annotationsChange(annotations) {\n this._session.annotations = annotations;\n this.dispatchEvent(\n new SessionChangedEvent(this.tagName.toLowerCase(), true)\n );\n\n this.render();\n }\n\n commentChange(comment) {\n this._session.comment = comment;\n this.dispatchEvent(\n new SessionChangedEvent(this.tagName.toLowerCase(), isComplete(comment))\n );\n\n this.render();\n }\n\n connectedCallback() {\n this.render();\n }\n\n render() {\n if (this._model && this._session) {\n let elem = React.createElement(Main, {\n model: this._model,\n session: this._session,\n onValueChange: this.valueChange.bind(this),\n onAnnotationsChange: this.annotationsChange.bind(this),\n onCommentChange: this.commentChange.bind(this),\n });\n\n ReactDOM.render(elem, this, () => {\n renderMath(this);\n });\n }\n }\n}\n"],"file":"index.js"}
package/lib/main.js CHANGED
@@ -39,6 +39,8 @@ var _renderUi = require("@pie-lib/render-ui");
39
39
 
40
40
  var _mathRendering = require("@pie-lib/math-rendering");
41
41
 
42
+ var _annotationEditor = _interopRequireDefault(require("./annotation/annotation-editor"));
43
+
42
44
  function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = (0, _getPrototypeOf2["default"])(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = (0, _getPrototypeOf2["default"])(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return (0, _possibleConstructorReturn2["default"])(this, result); }; }
43
45
 
44
46
  function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Reflect.construct) return false; if (Reflect.construct.sham) return false; if (typeof Proxy === "function") return true; try { Boolean.prototype.valueOf.call(Reflect.construct(Boolean, [], function () {})); return true; } catch (e) { return false; } }
@@ -75,7 +77,8 @@ var Main = /*#__PURE__*/function (_React$Component) {
75
77
  }
76
78
 
77
79
  _this = _super.call.apply(_super, [this].concat(args));
78
- (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "changeSession", (0, _debounce["default"])(_this.props.onChange, 1500));
80
+ (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "changeSessionValue", (0, _debounce["default"])(_this.props.onValueChange, 1500));
81
+ (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "changeSessionComment", (0, _debounce["default"])(_this.props.onCommentChange, 1500));
79
82
  return _this;
80
83
  }
81
84
 
@@ -94,15 +97,24 @@ var Main = /*#__PURE__*/function (_React$Component) {
94
97
  var _this$props = this.props,
95
98
  model = _this$props.model,
96
99
  classes = _this$props.classes,
97
- session = _this$props.session;
98
- var dimensions = model.dimensions,
100
+ session = _this$props.session,
101
+ onAnnotationsChange = _this$props.onAnnotationsChange;
102
+ var animationsDisabled = model.animationsDisabled,
103
+ annotatorMode = model.annotatorMode,
104
+ customKeys = model.customKeys,
105
+ dimensions = model.dimensions,
99
106
  disabled = model.disabled,
107
+ disabledAnnotator = model.disabledAnnotator,
108
+ equationEditor = model.equationEditor,
100
109
  feedback = model.feedback,
101
- teacherInstructions = model.teacherInstructions,
102
110
  mathInput = model.mathInput,
103
- animationsDisabled = model.animationsDisabled,
111
+ predefinedAnnotations = model.predefinedAnnotations,
112
+ prompt = model.prompt,
113
+ teacherInstructions = model.teacherInstructions,
104
114
  playersToolbarPosition = model.playersToolbarPosition;
105
- var value = session.value;
115
+ var annotations = session.annotations,
116
+ comment = session.comment,
117
+ value = session.value;
106
118
 
107
119
  var _ref = dimensions || {},
108
120
  width = _ref.width,
@@ -138,14 +150,28 @@ var Main = /*#__PURE__*/function (_React$Component) {
138
150
  visible: 'Hide Teacher Instructions'
139
151
  },
140
152
  className: classes.collapsible
141
- }, teacherInstructionsDiv) : teacherInstructionsDiv, /*#__PURE__*/_react["default"].createElement("br", null)), model.prompt && /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
153
+ }, teacherInstructionsDiv) : teacherInstructionsDiv, /*#__PURE__*/_react["default"].createElement("br", null)), prompt && /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
142
154
  className: classes.prompt
143
155
  }, /*#__PURE__*/_react["default"].createElement(_renderUi.PreviewPrompt, {
144
156
  defaultClassName: "prompt",
145
- prompt: model.prompt
146
- })), /*#__PURE__*/_react["default"].createElement(_editableHtml["default"], {
157
+ prompt: prompt
158
+ })), annotatorMode ? /*#__PURE__*/_react["default"].createElement(_annotationEditor["default"], {
159
+ text: value || '',
160
+ annotations: annotations || [],
161
+ comment: comment || '',
162
+ predefinedAnnotations: predefinedAnnotations || [],
163
+ onChange: onAnnotationsChange,
164
+ onCommentChange: this.changeSessionComment,
165
+ width: width,
166
+ height: height,
167
+ maxHeight: maxHeight,
168
+ disabled: disabledAnnotator,
169
+ disabledMath: !mathInput,
170
+ customKeys: customKeys,
171
+ keypadMode: equationEditor
172
+ }) : /*#__PURE__*/_react["default"].createElement(_editableHtml["default"], {
147
173
  className: "response-area-editor",
148
- onChange: this.changeSession,
174
+ onChange: this.changeSessionValue,
149
175
  markup: value || '',
150
176
  width: width && width.toString(),
151
177
  minHeight: height && height.toString(),
@@ -156,8 +182,8 @@ var Main = /*#__PURE__*/function (_React$Component) {
156
182
  pluginProps: {
157
183
  math: {
158
184
  disabled: !mathInput,
159
- customKeys: this.props.model.customKeys,
160
- keypadMode: this.props.model.equationEditor,
185
+ customKeys: customKeys,
186
+ keypadMode: equationEditor,
161
187
  controlledKeypadMode: false
162
188
  },
163
189
  video: {
@@ -178,11 +204,15 @@ var Main = /*#__PURE__*/function (_React$Component) {
178
204
 
179
205
  exports.Main = Main;
180
206
  (0, _defineProperty2["default"])(Main, "propTypes", {
181
- onChange: _propTypes["default"].func.isRequired,
207
+ onValueChange: _propTypes["default"].func.isRequired,
208
+ onAnnotationsChange: _propTypes["default"].func.isRequired,
209
+ onCommentChange: _propTypes["default"].func.isRequired,
182
210
  model: _propTypes["default"].object,
183
211
  classes: _propTypes["default"].object.isRequired,
184
212
  session: _propTypes["default"].shape({
185
- value: _propTypes["default"].string
213
+ value: _propTypes["default"].string,
214
+ annotations: _propTypes["default"].array,
215
+ comment: _propTypes["default"].string
186
216
  }).isRequired
187
217
  });
188
218
 
package/lib/main.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/main.jsx"],"names":["log","style","theme","main","backgroundColor","color","background","text","prompt","width","marginBottom","spacing","unit","fontSize","Main","props","onChange","containerRef","model","classes","session","dimensions","disabled","feedback","teacherInstructions","mathInput","animationsDisabled","playersToolbarPosition","value","height","maxHeight","toolbarOpts","teacherInstructionsDiv","position","ref","hidden","visible","collapsible","changeSession","toString","math","customKeys","keypadMode","equationEditor","controlledKeypadMode","video","audio","React","Component","PropTypes","func","isRequired","object","shape","string"],"mappings":"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","sourcesContent":["import React from 'react';\nimport EditableHTML from '@pie-lib/editable-html';\nimport PropTypes from 'prop-types';\nimport Typography from '@material-ui/core/Typography';\nimport { withStyles } from '@material-ui/core/styles';\nimport debug from 'debug';\nimport debounce from 'lodash/debounce';\nimport {color, Feedback, Collapsible, PreviewPrompt} from '@pie-lib/render-ui';\nimport { renderMath } from '@pie-lib/math-rendering';\n\nconst log = debug('@pie-ui:extended-text-entry');\n\nconst style = theme => ({\n main: {\n backgroundColor: color.background(),\n color: color.text()\n },\n prompt: {\n width: '100%',\n color: color.text(),\n marginBottom: theme.spacing.unit * 2,\n fontSize: 'inherit'\n }\n});\n\nexport class Main extends React.Component {\n static propTypes = {\n onChange: PropTypes.func.isRequired,\n model: PropTypes.object,\n classes: PropTypes.object.isRequired,\n session: PropTypes.shape({\n value: PropTypes.string\n }).isRequired\n };\n\n componentDidUpdate() {\n if (this.containerRef) {\n renderMath(this.containerRef);\n }\n }\n\n changeSession = debounce(this.props.onChange, 1500);\n\n render() {\n const { model, classes, session } = this.props;\n const { dimensions, disabled, feedback, teacherInstructions, mathInput, animationsDisabled, playersToolbarPosition } = model;\n const { value } = session;\n const { width, height } = dimensions || {};\n const maxHeight = '40vh';\n const toolbarOpts = {};\n\n log('[render] disabled? ', disabled);\n\n const teacherInstructionsDiv = <PreviewPrompt defaultClassName=\"teacher-instructions\" prompt={teacherInstructions} />;\n\n switch (playersToolbarPosition) {\n case 'top':\n toolbarOpts.position = 'top';\n break;\n default:\n toolbarOpts.position = 'bottom';\n break;\n }\n\n return (\n <div\n className={classes.main}\n ref={ref => {\n this.containerRef = ref;\n }}\n >\n {\n teacherInstructions && (\n <div>\n {!animationsDisabled ? (\n <Collapsible\n labels={{hidden: 'Show Teacher Instructions', visible: 'Hide Teacher Instructions'}}\n className={classes.collapsible}\n >\n {teacherInstructionsDiv}\n </Collapsible>\n ) : teacherInstructionsDiv }\n <br/>\n </div>\n )\n }\n {model.prompt && (\n <Typography\n className={classes.prompt}\n >\n <PreviewPrompt defaultClassName=\"prompt\" prompt={model.prompt} />\n </Typography>\n )}\n <EditableHTML\n className=\"response-area-editor\"\n onChange={this.changeSession}\n markup={value || ''}\n width={width && width.toString()}\n minHeight={height && height.toString()}\n maxHeight={maxHeight}\n disabled={disabled}\n highlightShape={true}\n toolbarOpts={toolbarOpts}\n pluginProps={{\n math: {\n disabled: !mathInput,\n customKeys: this.props.model.customKeys,\n keypadMode: this.props.model.equationEditor,\n controlledKeypadMode: false\n },\n video: {\n disabled: true\n },\n audio: {\n disabled: true\n }\n }}\n />\n {feedback && (\n <div>\n <br />\n <Feedback correctness=\"correct\" feedback={feedback}/>\n </div>\n )}\n </div>\n );\n }\n}\n\nexport default withStyles(style)(Main);\n"],"file":"main.js"}
1
+ {"version":3,"sources":["../src/main.jsx"],"names":["log","style","theme","main","backgroundColor","color","background","text","prompt","width","marginBottom","spacing","unit","fontSize","Main","props","onValueChange","onCommentChange","containerRef","model","classes","session","onAnnotationsChange","animationsDisabled","annotatorMode","customKeys","dimensions","disabled","disabledAnnotator","equationEditor","feedback","mathInput","predefinedAnnotations","teacherInstructions","playersToolbarPosition","annotations","comment","value","height","maxHeight","toolbarOpts","teacherInstructionsDiv","position","ref","hidden","visible","collapsible","changeSessionComment","changeSessionValue","toString","math","keypadMode","controlledKeypadMode","video","audio","React","Component","PropTypes","func","isRequired","object","shape","string","array"],"mappings":"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","sourcesContent":["import React from 'react';\nimport EditableHTML from '@pie-lib/editable-html';\nimport PropTypes from 'prop-types';\nimport Typography from '@material-ui/core/Typography';\nimport { withStyles } from '@material-ui/core/styles';\nimport debug from 'debug';\nimport debounce from 'lodash/debounce';\nimport { color, Feedback, Collapsible, PreviewPrompt } from '@pie-lib/render-ui';\nimport { renderMath } from '@pie-lib/math-rendering';\nimport AnnotationEditor from './annotation/annotation-editor';\n\nconst log = debug('@pie-ui:extended-text-entry');\n\nconst style = theme => ({\n main: {\n backgroundColor: color.background(),\n color: color.text()\n },\n prompt: {\n width: '100%',\n color: color.text(),\n marginBottom: theme.spacing.unit * 2,\n fontSize: 'inherit'\n }\n});\n\nexport class Main extends React.Component {\n static propTypes = {\n onValueChange: PropTypes.func.isRequired,\n onAnnotationsChange: PropTypes.func.isRequired,\n onCommentChange: PropTypes.func.isRequired,\n model: PropTypes.object,\n classes: PropTypes.object.isRequired,\n session: PropTypes.shape({\n value: PropTypes.string,\n annotations: PropTypes.array,\n comment: PropTypes.string\n }).isRequired\n };\n\n componentDidUpdate() {\n if (this.containerRef) {\n renderMath(this.containerRef);\n }\n }\n\n changeSessionValue = debounce(this.props.onValueChange, 1500);\n\n changeSessionComment = debounce(this.props.onCommentChange, 1500);\n\n render() {\n const { model, classes, session, onAnnotationsChange } = this.props;\n const {\n animationsDisabled,\n annotatorMode,\n customKeys,\n dimensions,\n disabled,\n disabledAnnotator,\n equationEditor,\n feedback,\n mathInput,\n predefinedAnnotations,\n prompt,\n teacherInstructions,\n playersToolbarPosition\n } = model;\n const { annotations, comment, value } = session;\n const { width, height } = dimensions || {};\n const maxHeight = '40vh';\n const toolbarOpts = {};\n\n log('[render] disabled? ', disabled);\n\n const teacherInstructionsDiv = <PreviewPrompt defaultClassName=\"teacher-instructions\" prompt={teacherInstructions} />;\n\n switch (playersToolbarPosition) {\n case 'top':\n toolbarOpts.position = 'top';\n break;\n default:\n toolbarOpts.position = 'bottom';\n break;\n }\n\n return (\n <div\n className={classes.main}\n ref={ref => {\n this.containerRef = ref;\n }}\n >\n {\n teacherInstructions && (\n <div>\n {!animationsDisabled ? (\n <Collapsible\n labels={{ hidden: 'Show Teacher Instructions', visible: 'Hide Teacher Instructions' }}\n className={classes.collapsible}\n >\n {teacherInstructionsDiv}\n </Collapsible>\n ) : teacherInstructionsDiv }\n <br/>\n </div>\n )\n }\n {prompt && (\n <Typography className={classes.prompt} >\n <PreviewPrompt defaultClassName=\"prompt\" prompt={prompt} />\n </Typography>\n )}\n {annotatorMode ? (\n <AnnotationEditor\n text={value || ''}\n annotations={annotations || []}\n comment={comment || ''}\n predefinedAnnotations={predefinedAnnotations || []}\n onChange={onAnnotationsChange}\n onCommentChange={this.changeSessionComment}\n width={width}\n height={height}\n maxHeight={maxHeight}\n disabled={disabledAnnotator}\n disabledMath={!mathInput}\n customKeys={customKeys}\n keypadMode={equationEditor}\n />\n ) : (\n <EditableHTML\n className=\"response-area-editor\"\n onChange={this.changeSessionValue}\n markup={value || ''}\n width={width && width.toString()}\n minHeight={height && height.toString()}\n maxHeight={maxHeight}\n disabled={disabled}\n highlightShape={true}\n toolbarOpts={toolbarOpts}\n pluginProps={{\n math: {\n disabled: !mathInput,\n customKeys: customKeys,\n keypadMode: equationEditor,\n controlledKeypadMode: false\n },\n video: {\n disabled: true\n },\n audio: {\n disabled: true\n }\n }}\n />\n )}\n {feedback && (\n <div>\n <br />\n <Feedback correctness=\"correct\" feedback={feedback} />\n </div>\n )}\n </div>\n );\n }\n}\n\nexport default withStyles(style)(Main);\n"],"file":"main.js"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@pie-element/extended-text-entry",
3
- "version": "6.8.1",
3
+ "version": "6.8.4-annotations.0",
4
4
  "description": "",
5
5
  "repository": "pie-framework/pie-elements",
6
6
  "publishConfig": {
@@ -12,7 +12,7 @@
12
12
  "@material-ui/core": "^3.9.2",
13
13
  "@material-ui/icons": "^3.0.2",
14
14
  "@pie-framework/pie-player-events": "^0.1.0",
15
- "@pie-lib/editable-html": "^7.17.18",
15
+ "@pie-lib/editable-html": "^7.19.1",
16
16
  "@pie-lib/math-rendering": "^2.3.12",
17
17
  "@pie-lib/render-ui": "^4.12.4",
18
18
  "classnames": "^2.2.5",
@@ -22,7 +22,7 @@
22
22
  "react": "^16.8.1",
23
23
  "react-dom": "^16.8.1"
24
24
  },
25
- "gitHead": "820dc9994e5f621018ca2c262f9a999996fd2079",
25
+ "gitHead": "0e14ff981bcdc8a89a0e58484026496701bfdbc3",
26
26
  "scripts": {
27
27
  "postpublish": "../../scripts/postpublish"
28
28
  },
package/LICENSE.md DELETED
@@ -1,5 +0,0 @@
1
- Copyright 2019 CoreSpring Inc
2
-
3
- Permission to use, copy, modify, and/or distribute this software for any purpose with or without fee is hereby granted, provided that the above copyright notice and this permission notice appear in all copies.
4
-
5
- THE SOFTWARE IS PROVIDED "AS IS" AND THE AUTHOR DISCLAIMS ALL WARRANTIES WITH REGARD TO THIS SOFTWARE INCLUDING ALL IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS. IN NO EVENT SHALL THE AUTHOR BE LIABLE FOR ANY SPECIAL, DIRECT, INDIRECT, OR CONSEQUENTIAL DAMAGES OR ANY DAMAGES WHATSOEVER RESULTING FROM LOSS OF USE, DATA OR PROFITS, WHETHER IN AN ACTION OF CONTRACT, NEGLIGENCE OR OTHER TORTIOUS ACTION, ARISING OUT OF OR IN CONNECTION WITH THE USE OR PERFORMANCE OF THIS SOFTWARE.