@pie-lib/editable-html 11.4.0 → 11.6.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.
Files changed (106) hide show
  1. package/CHANGELOG.md +24 -52
  2. package/package.json +8 -7
  3. package/src/editor.jsx +2 -2
  4. package/src/plugins/media/media-dialog.js +1 -1
  5. package/src/plugins/respArea/drag-in-the-blank/choice.jsx +1 -1
  6. package/src/plugins/toolbar/editor-and-toolbar.jsx +1 -1
  7. package/lib/block-tags.js +0 -25
  8. package/lib/block-tags.js.map +0 -1
  9. package/lib/constants.js +0 -16
  10. package/lib/constants.js.map +0 -1
  11. package/lib/editor.js +0 -1355
  12. package/lib/editor.js.map +0 -1
  13. package/lib/index.js +0 -269
  14. package/lib/index.js.map +0 -1
  15. package/lib/parse-html.js +0 -16
  16. package/lib/parse-html.js.map +0 -1
  17. package/lib/plugins/characters/custom-popper.js +0 -73
  18. package/lib/plugins/characters/custom-popper.js.map +0 -1
  19. package/lib/plugins/characters/index.js +0 -305
  20. package/lib/plugins/characters/index.js.map +0 -1
  21. package/lib/plugins/characters/utils.js +0 -381
  22. package/lib/plugins/characters/utils.js.map +0 -1
  23. package/lib/plugins/css/icons/index.js +0 -37
  24. package/lib/plugins/css/icons/index.js.map +0 -1
  25. package/lib/plugins/css/index.js +0 -397
  26. package/lib/plugins/css/index.js.map +0 -1
  27. package/lib/plugins/customPlugin/index.js +0 -114
  28. package/lib/plugins/customPlugin/index.js.map +0 -1
  29. package/lib/plugins/html/icons/index.js +0 -38
  30. package/lib/plugins/html/icons/index.js.map +0 -1
  31. package/lib/plugins/html/index.js +0 -80
  32. package/lib/plugins/html/index.js.map +0 -1
  33. package/lib/plugins/image/alt-dialog.js +0 -129
  34. package/lib/plugins/image/alt-dialog.js.map +0 -1
  35. package/lib/plugins/image/component.js +0 -419
  36. package/lib/plugins/image/component.js.map +0 -1
  37. package/lib/plugins/image/image-toolbar.js +0 -177
  38. package/lib/plugins/image/image-toolbar.js.map +0 -1
  39. package/lib/plugins/image/index.js +0 -263
  40. package/lib/plugins/image/index.js.map +0 -1
  41. package/lib/plugins/image/insert-image-handler.js +0 -161
  42. package/lib/plugins/image/insert-image-handler.js.map +0 -1
  43. package/lib/plugins/index.js +0 -402
  44. package/lib/plugins/index.js.map +0 -1
  45. package/lib/plugins/list/index.js +0 -334
  46. package/lib/plugins/list/index.js.map +0 -1
  47. package/lib/plugins/math/index.js +0 -454
  48. package/lib/plugins/math/index.js.map +0 -1
  49. package/lib/plugins/media/index.js +0 -387
  50. package/lib/plugins/media/index.js.map +0 -1
  51. package/lib/plugins/media/media-dialog.js +0 -709
  52. package/lib/plugins/media/media-dialog.js.map +0 -1
  53. package/lib/plugins/media/media-toolbar.js +0 -101
  54. package/lib/plugins/media/media-toolbar.js.map +0 -1
  55. package/lib/plugins/media/media-wrapper.js +0 -93
  56. package/lib/plugins/media/media-wrapper.js.map +0 -1
  57. package/lib/plugins/rendering/index.js +0 -46
  58. package/lib/plugins/rendering/index.js.map +0 -1
  59. package/lib/plugins/respArea/drag-in-the-blank/choice.js +0 -254
  60. package/lib/plugins/respArea/drag-in-the-blank/choice.js.map +0 -1
  61. package/lib/plugins/respArea/drag-in-the-blank/index.js +0 -97
  62. package/lib/plugins/respArea/drag-in-the-blank/index.js.map +0 -1
  63. package/lib/plugins/respArea/explicit-constructed-response/index.js +0 -57
  64. package/lib/plugins/respArea/explicit-constructed-response/index.js.map +0 -1
  65. package/lib/plugins/respArea/icons/index.js +0 -95
  66. package/lib/plugins/respArea/icons/index.js.map +0 -1
  67. package/lib/plugins/respArea/index.js +0 -341
  68. package/lib/plugins/respArea/index.js.map +0 -1
  69. package/lib/plugins/respArea/inline-dropdown/index.js +0 -75
  70. package/lib/plugins/respArea/inline-dropdown/index.js.map +0 -1
  71. package/lib/plugins/respArea/math-templated/index.js +0 -130
  72. package/lib/plugins/respArea/math-templated/index.js.map +0 -1
  73. package/lib/plugins/respArea/utils.js +0 -125
  74. package/lib/plugins/respArea/utils.js.map +0 -1
  75. package/lib/plugins/table/CustomTablePlugin.js +0 -133
  76. package/lib/plugins/table/CustomTablePlugin.js.map +0 -1
  77. package/lib/plugins/table/icons/index.js +0 -69
  78. package/lib/plugins/table/icons/index.js.map +0 -1
  79. package/lib/plugins/table/index.js +0 -483
  80. package/lib/plugins/table/index.js.map +0 -1
  81. package/lib/plugins/table/table-toolbar.js +0 -187
  82. package/lib/plugins/table/table-toolbar.js.map +0 -1
  83. package/lib/plugins/textAlign/icons/index.js +0 -226
  84. package/lib/plugins/textAlign/icons/index.js.map +0 -1
  85. package/lib/plugins/textAlign/index.js +0 -34
  86. package/lib/plugins/textAlign/index.js.map +0 -1
  87. package/lib/plugins/toolbar/default-toolbar.js +0 -229
  88. package/lib/plugins/toolbar/default-toolbar.js.map +0 -1
  89. package/lib/plugins/toolbar/done-button.js +0 -53
  90. package/lib/plugins/toolbar/done-button.js.map +0 -1
  91. package/lib/plugins/toolbar/editor-and-toolbar.js +0 -286
  92. package/lib/plugins/toolbar/editor-and-toolbar.js.map +0 -1
  93. package/lib/plugins/toolbar/index.js +0 -34
  94. package/lib/plugins/toolbar/index.js.map +0 -1
  95. package/lib/plugins/toolbar/toolbar-buttons.js +0 -194
  96. package/lib/plugins/toolbar/toolbar-buttons.js.map +0 -1
  97. package/lib/plugins/toolbar/toolbar.js +0 -376
  98. package/lib/plugins/toolbar/toolbar.js.map +0 -1
  99. package/lib/plugins/utils.js +0 -62
  100. package/lib/plugins/utils.js.map +0 -1
  101. package/lib/serialization.js +0 -677
  102. package/lib/serialization.js.map +0 -1
  103. package/lib/shared/alert-dialog.js +0 -75
  104. package/lib/shared/index.js +0 -136
  105. package/lib/theme.js +0 -9
  106. package/lib/theme.js.map +0 -1
@@ -1,709 +0,0 @@
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"] = exports.MediaDialog = void 0;
9
-
10
- var _regenerator = _interopRequireDefault(require("@babel/runtime/regenerator"));
11
-
12
- var _asyncToGenerator2 = _interopRequireDefault(require("@babel/runtime/helpers/asyncToGenerator"));
13
-
14
- var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
15
-
16
- var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
17
-
18
- var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
19
-
20
- var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
21
-
22
- var _possibleConstructorReturn2 = _interopRequireDefault(require("@babel/runtime/helpers/possibleConstructorReturn"));
23
-
24
- var _getPrototypeOf2 = _interopRequireDefault(require("@babel/runtime/helpers/getPrototypeOf"));
25
-
26
- var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
27
-
28
- var _react = _interopRequireDefault(require("react"));
29
-
30
- var _propTypes = _interopRequireDefault(require("prop-types"));
31
-
32
- var _debug = _interopRequireDefault(require("debug"));
33
-
34
- var _index = require("./../../shared/index");
35
-
36
- var _styles = require("@material-ui/core/styles");
37
-
38
- var _Button = _interopRequireDefault(require("@material-ui/core/Button"));
39
-
40
- var _Dialog = _interopRequireDefault(require("@material-ui/core/Dialog"));
41
-
42
- var _Tabs = _interopRequireDefault(require("@material-ui/core/Tabs"));
43
-
44
- var _Tab = _interopRequireDefault(require("@material-ui/core/Tab"));
45
-
46
- var _DialogTitle = _interopRequireDefault(require("@material-ui/core/DialogTitle"));
47
-
48
- var _DialogContent = _interopRequireDefault(require("@material-ui/core/DialogContent"));
49
-
50
- var _DialogContentText = _interopRequireDefault(require("@material-ui/core/DialogContentText"));
51
-
52
- var _DialogActions = _interopRequireDefault(require("@material-ui/core/DialogActions"));
53
-
54
- var _TextField = _interopRequireDefault(require("@material-ui/core/TextField"));
55
-
56
- var _Typography = _interopRequireDefault(require("@material-ui/core/Typography"));
57
-
58
- var _IconButton = _interopRequireDefault(require("@material-ui/core/IconButton"));
59
-
60
- var _Delete = _interopRequireDefault(require("@material-ui/icons/Delete"));
61
-
62
- function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
63
-
64
- function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { (0, _defineProperty2["default"])(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
65
-
66
- 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); }; }
67
-
68
- 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; } }
69
-
70
- var log = (0, _debug["default"])('@pie-lib:editable-html:plugins:media:dialog');
71
-
72
- var matchYoutubeUrl = function matchYoutubeUrl(url) {
73
- if (!url) {
74
- return false;
75
- }
76
-
77
- var p = /^(?:https?:\/\/)?(?:m\.|www\.)?(?:youtu\.be\/|youtube\.com\/(?:embed\/|v\/|watch\?v=|watch\?.+&v=))((\w|-){11})(?:\S+)?$/;
78
-
79
- if (url.match(p)) {
80
- return url.match(p)[1];
81
- }
82
-
83
- return false;
84
- };
85
-
86
- var matchVimeoUrl = function matchVimeoUrl(url) {
87
- return url && /(http|https)?:\/\/(www\.)?(player\.)?vimeo.com\/(?:channels\/(?:\w+\/)?|groups\/([^/]*)\/videos\/|)(video\/)?(\d+)(?:|\/\?)/.test(url);
88
- };
89
-
90
- var matchDriveUrl = function matchDriveUrl(url) {
91
- return url && /^https:\/\/drive\.google\.com\/(?:file\/d\/|drive\/(?:u\/\d+\/)?folders\/|uc\?id=)([a-zA-Z0-9_-]+)/.test(url);
92
- };
93
-
94
- var matchSoundCloudUrl = function matchSoundCloudUrl(url) {
95
- if (!url) {
96
- return false;
97
- }
98
-
99
- var regexp = /^https?:\/\/(soundcloud\.com|snd\.sc)\/(.*)$/;
100
- return url.match(regexp) && url.match(regexp)[2];
101
- };
102
-
103
- var makeApiRequest = function makeApiRequest(url) {
104
- return new Promise(function (resolve) {
105
- try {
106
- fetch("https://soundcloud.com/oembed?format=json&url=".concat(url)).then(function (response) {
107
- return response.json();
108
- }).then(function (json) {
109
- var d = document.createElement('div');
110
- d.innerHTML = json.html;
111
- var iframe = d.querySelector('iframe');
112
- resolve(iframe.src);
113
- })["catch"](function (err) {
114
- resolve('');
115
- log(err);
116
- });
117
- } catch (err) {
118
- resolve('');
119
- }
120
- });
121
- };
122
-
123
- var typeMap = {
124
- video: 'Video',
125
- audio: 'Audio'
126
- };
127
- var tabsTypeMap = {
128
- uploadFile: 'upload-file',
129
- insertUrl: 'insert-url'
130
- };
131
-
132
- var MediaDialog = /*#__PURE__*/function (_React$Component) {
133
- (0, _inherits2["default"])(MediaDialog, _React$Component);
134
-
135
- var _super = _createSuper(MediaDialog);
136
-
137
- function MediaDialog(props) {
138
- var _this;
139
-
140
- (0, _classCallCheck2["default"])(this, MediaDialog);
141
- _this = _super.call(this, props);
142
- (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "formatUrl", function () {
143
- var _this$state = _this.state,
144
- url = _this$state.url,
145
- urlToUse = _this$state.urlToUse,
146
- starts = _this$state.starts,
147
- ends = _this$state.ends;
148
- var isYoutube = matchYoutubeUrl(url);
149
- var isVimeo = matchVimeoUrl(url);
150
- var formattedUrl = urlToUse;
151
-
152
- if ((isYoutube || isVimeo) && urlToUse) {
153
- var params = [];
154
- var paramName;
155
- var paramStart;
156
-
157
- switch (true) {
158
- case isVimeo:
159
- paramName = 't';
160
- paramStart = '#';
161
- break;
162
-
163
- case isYoutube:
164
- paramName = 'start';
165
- paramStart = '?';
166
- break;
167
-
168
- default:
169
- paramName = 'start';
170
- paramStart = '?';
171
- }
172
-
173
- if (starts) {
174
- params.push("".concat(paramName, "=").concat(starts));
175
- }
176
-
177
- if (ends) {
178
- params.push("end=".concat(ends));
179
- }
180
-
181
- formattedUrl = "".concat(urlToUse).concat(params.length ? paramStart : '').concat(params.join('&'));
182
- }
183
-
184
- var callback = function callback() {
185
- return _this.setState({
186
- formattedUrl: formattedUrl,
187
- updating: false
188
- });
189
- };
190
-
191
- _this.setState({
192
- formattedUrl: null,
193
- updating: true
194
- }, callback);
195
- });
196
- (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleStateChange", function (newState) {
197
- return _this.setState(newState, _this.formatUrl);
198
- });
199
- (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "checkAudio", function (value) {
200
- if (matchSoundCloudUrl(value)) {
201
- makeApiRequest(value).then(function (urlToUse) {
202
- _this.handleStateChange({
203
- urlToUse: urlToUse,
204
- invalid: !urlToUse,
205
- url: value
206
- });
207
- })["catch"](log);
208
- }
209
- });
210
- (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "checkVideo", function (value) {
211
- if (matchYoutubeUrl(value)) {
212
- var regExp = /^.*(youtu\.be\/|v\/|u\/\w\/|embed\/|watch\?v=|&v=)([^#&?]*).*/;
213
- var match = value.match(regExp);
214
- var id = match[2];
215
- var urlToUse = "https://youtube.com/embed/".concat(id);
216
- log('is youtube');
217
-
218
- _this.handleStateChange({
219
- urlToUse: urlToUse,
220
- url: value,
221
- invalid: false
222
- });
223
- }
224
-
225
- if (matchVimeoUrl(value)) {
226
- var _id = value.replace(/.*vimeo.com\/(.*)/g, '$1');
227
-
228
- var _urlToUse2 = "https://player.vimeo.com/video/".concat(_id);
229
-
230
- log('is vimeo');
231
-
232
- _this.handleStateChange({
233
- urlToUse: _urlToUse2,
234
- url: value,
235
- ends: null,
236
- invalid: false
237
- });
238
- }
239
-
240
- if (matchDriveUrl(value)) {
241
- // https://drive.google.com/file/d/11QkK_gUO068amNvZBm9cxZpKX74WYb8q/view
242
- var _id2 = value.replace(/^https:\/\/drive\.google\.com\/(?:file\/d\/|drive\/(?:u\/\d+\/)?folders\/|uc\?id=)([a-zA-Z0-9_-]+)\/.*/, '$1');
243
-
244
- var _urlToUse3 = "https://drive.google.com/file/d/".concat(_id2, "/preview");
245
-
246
- log('is google drive');
247
-
248
- _this.handleStateChange({
249
- urlToUse: _urlToUse3,
250
- url: value,
251
- ends: null,
252
- invalid: false
253
- });
254
- }
255
- });
256
- (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "urlChange", function (e) {
257
- var _ref = e.target || {},
258
- value = _ref.value;
259
-
260
- var type = _this.props.type;
261
-
262
- if (type && type === 'audio') {
263
- _this.checkAudio();
264
-
265
- return;
266
- } else if (type && type === 'video') {
267
- _this.checkVideo(value);
268
-
269
- return;
270
- }
271
-
272
- _this.handleStateChange({
273
- urlToUse: null,
274
- url: null,
275
- invalid: true
276
- });
277
- });
278
- (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "changeHandler", function (type) {
279
- return function (e) {
280
- return _this.handleStateChange((0, _defineProperty2["default"])({}, type, e.target.value));
281
- };
282
- });
283
- (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleDone", function (val) {
284
- var handleClose = _this.props.handleClose;
285
- var _this$state2 = _this.state,
286
- tabValue = _this$state2.tabValue,
287
- fileUpload = _this$state2.fileUpload;
288
- var isInsertURL = tabValue === tabsTypeMap.insertUrl;
289
-
290
- if (!val) {
291
- if (fileUpload.url) {
292
- _this.handleRemoveFile();
293
- }
294
-
295
- handleClose(val);
296
- return;
297
- }
298
-
299
- if (isInsertURL) {
300
- var _this$state3 = _this.state,
301
- ends = _this$state3.ends,
302
- height = _this$state3.height,
303
- url = _this$state3.url,
304
- urlToUse = _this$state3.urlToUse,
305
- formattedUrl = _this$state3.formattedUrl,
306
- starts = _this$state3.starts,
307
- width = _this$state3.width;
308
- handleClose(val, {
309
- tag: 'iframe',
310
- ends: ends,
311
- height: height,
312
- starts: starts,
313
- width: width,
314
- url: url,
315
- urlToUse: urlToUse,
316
- src: formattedUrl
317
- });
318
- return;
319
- }
320
-
321
- if (!fileUpload.loading) {
322
- handleClose(val, {
323
- tag: 'audio',
324
- src: fileUpload.url
325
- });
326
- return;
327
- }
328
-
329
- _this.setState({
330
- fileUpload: _objectSpread(_objectSpread({}, fileUpload), {}, {
331
- scheduled: true
332
- })
333
- });
334
- });
335
- (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleUploadFile", /*#__PURE__*/function () {
336
- var _ref2 = (0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee(e) {
337
- var fileChosen, reader;
338
- return _regenerator["default"].wrap(function _callee$(_context) {
339
- while (1) {
340
- switch (_context.prev = _context.next) {
341
- case 0:
342
- e.preventDefault();
343
-
344
- _this.setState({
345
- fileUpload: _objectSpread(_objectSpread({}, _this.state.fileUpload), {}, {
346
- error: null,
347
- loading: true
348
- })
349
- });
350
-
351
- fileChosen = e.target.files[0];
352
- reader = new FileReader();
353
-
354
- reader.onload = function () {
355
- var dataURL = reader.result;
356
-
357
- _this.setState({
358
- fileUpload: _objectSpread(_objectSpread({}, _this.state.fileUpload), {}, {
359
- url: dataURL,
360
- mimeType: fileChosen.type
361
- })
362
- });
363
- };
364
-
365
- reader.readAsDataURL(fileChosen);
366
-
367
- _this.props.uploadSoundSupport.add({
368
- fileChosen: fileChosen,
369
- done: function done(err, src) {
370
- log('done: err:', err);
371
-
372
- if (err) {
373
- //eslint-disable-next-line
374
- console.log(err);
375
-
376
- _this.setState({
377
- fileUpload: _objectSpread(_objectSpread({}, _this.state.fileUpload), {}, {
378
- scheduled: false,
379
- loading: false,
380
- error: err
381
- })
382
- });
383
-
384
- return;
385
- }
386
-
387
- var fileUpload = _this.state.fileUpload;
388
- var callback = fileUpload && fileUpload.scheduled ? _this.handleDone.bind((0, _assertThisInitialized2["default"])(_this), true) : undefined;
389
-
390
- _this.setState({
391
- fileUpload: _objectSpread(_objectSpread({}, fileUpload), {}, {
392
- scheduled: false,
393
- loading: false,
394
- url: src
395
- })
396
- }, callback);
397
- }
398
- });
399
-
400
- case 7:
401
- case "end":
402
- return _context.stop();
403
- }
404
- }
405
- }, _callee);
406
- }));
407
-
408
- return function (_x) {
409
- return _ref2.apply(this, arguments);
410
- };
411
- }());
412
- (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "handleRemoveFile", /*#__PURE__*/(0, _asyncToGenerator2["default"])( /*#__PURE__*/_regenerator["default"].mark(function _callee2() {
413
- return _regenerator["default"].wrap(function _callee2$(_context2) {
414
- while (1) {
415
- switch (_context2.prev = _context2.next) {
416
- case 0:
417
- _this.props.uploadSoundSupport["delete"](_this.state.fileUpload.url, function (err) {
418
- if (err) {
419
- //eslint-disable-next-line
420
- console.log(err);
421
-
422
- _this.setState({
423
- fileUpload: _objectSpread(_objectSpread({}, _this.state.fileUpload), {}, {
424
- error: err
425
- })
426
- });
427
- }
428
- }); // we should put it inside uploadSoundSupport.delete but we can leave it here for testing purposes
429
-
430
-
431
- _this.setState({
432
- fileUpload: _objectSpread(_objectSpread({}, _this.state.fileUpload), {}, {
433
- loading: false,
434
- url: '',
435
- mimeType: ''
436
- })
437
- });
438
-
439
- case 2:
440
- case "end":
441
- return _context2.stop();
442
- }
443
- }
444
- }, _callee2);
445
- })));
446
- var _ends = props.ends,
447
- _height = props.height,
448
- _src = props.src,
449
- _starts = props.starts,
450
- _type = props.type,
451
- uploadSoundSupport = props.uploadSoundSupport,
452
- _url = props.url,
453
- _urlToUse = props.urlToUse,
454
- _width = props.width;
455
- var showUploadFile = (uploadSoundSupport === null || uploadSoundSupport === void 0 ? void 0 : uploadSoundSupport.add) && (uploadSoundSupport === null || uploadSoundSupport === void 0 ? void 0 : uploadSoundSupport["delete"]) && _type !== 'video';
456
- _this.state = {
457
- ends: _ends || 0,
458
- url: _url,
459
- urlToUse: _urlToUse,
460
- formattedUrl: _src,
461
- height: _height || 315,
462
- invalid: false,
463
- starts: _starts || 0,
464
- width: _width || 560,
465
- // default selected tab should be upload file if available
466
- tabValue: showUploadFile ? tabsTypeMap.uploadFile : tabsTypeMap.insertUrl,
467
- fileUpload: {
468
- error: null,
469
- loading: false,
470
- scheduled: false,
471
- url: '',
472
- mimeType: ''
473
- }
474
- };
475
- return _this;
476
- }
477
-
478
- (0, _createClass2["default"])(MediaDialog, [{
479
- key: "componentDidMount",
480
- value: function componentDidMount() {
481
- if (this.props.url) {
482
- this.urlChange({
483
- target: {
484
- value: this.props.url
485
- }
486
- });
487
- }
488
- }
489
- }, {
490
- key: "render",
491
- value: function render() {
492
- var _this2 = this;
493
-
494
- var _this$props = this.props,
495
- classes = _this$props.classes,
496
- open = _this$props.open,
497
- disablePortal = _this$props.disablePortal,
498
- type = _this$props.type,
499
- edit = _this$props.edit,
500
- uploadSoundSupport = _this$props.uploadSoundSupport;
501
- var _this$state4 = this.state,
502
- ends = _this$state4.ends,
503
- height = _this$state4.height,
504
- invalid = _this$state4.invalid,
505
- starts = _this$state4.starts,
506
- width = _this$state4.width,
507
- url = _this$state4.url,
508
- mimeType = _this$state4.mimeType,
509
- formattedUrl = _this$state4.formattedUrl,
510
- updating = _this$state4.updating,
511
- tabValue = _this$state4.tabValue,
512
- fileUpload = _this$state4.fileUpload;
513
- var isYoutube = matchYoutubeUrl(url);
514
- var isInsertURL = tabValue === tabsTypeMap.insertUrl;
515
- var isUploadMedia = tabValue === tabsTypeMap.uploadFile;
516
- var submitIsDisabled = isInsertURL ? invalid || url === null || url === undefined : !fileUpload.url || fileUpload.scheduled;
517
- var showUploadFile = (uploadSoundSupport === null || uploadSoundSupport === void 0 ? void 0 : uploadSoundSupport.add) && (uploadSoundSupport === null || uploadSoundSupport === void 0 ? void 0 : uploadSoundSupport["delete"]) && type !== 'video';
518
- return /*#__PURE__*/_react["default"].createElement(_Dialog["default"], {
519
- classes: {
520
- paper: classes.paper
521
- },
522
- disablePortal: disablePortal,
523
- open: open,
524
- onClose: function onClose() {
525
- return _this2.handleDone(false);
526
- },
527
- "aria-labelledby": "form-dialog-title"
528
- }, /*#__PURE__*/_react["default"].createElement(_DialogTitle["default"], {
529
- id: "form-dialog-title"
530
- }, "Insert ", typeMap[type]), /*#__PURE__*/_react["default"].createElement(_DialogContent["default"], null, /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement("div", {
531
- className: classes.row
532
- }, /*#__PURE__*/_react["default"].createElement(_Tabs["default"], {
533
- indicatorColor: "primary",
534
- value: tabValue,
535
- onChange: function onChange(event, value) {
536
- _this2.setState({
537
- tabValue: value
538
- });
539
- }
540
- }, showUploadFile ? /*#__PURE__*/_react["default"].createElement(_Tab["default"], {
541
- value: tabsTypeMap.uploadFile,
542
- label: "Upload file"
543
- }) : null, /*#__PURE__*/_react["default"].createElement(_Tab["default"], {
544
- value: tabsTypeMap.insertUrl,
545
- label: type === 'video' ? 'Insert YouTube, Vimeo, or Google Drive URL' : 'Insert SoundCloud URL'
546
- }))), isInsertURL && /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_TextField["default"], {
547
- autoFocus: true,
548
- error: invalid,
549
- helperText: invalid ? 'Invalid URL' : '',
550
- margin: "dense",
551
- id: "name",
552
- label: "URL",
553
- placeholder: "Paste URL of ".concat(type, "..."),
554
- type: "text",
555
- onChange: this.urlChange,
556
- value: url,
557
- fullWidth: true
558
- }), type === 'video' && /*#__PURE__*/_react["default"].createElement(_DialogContent["default"], {
559
- classes: {
560
- root: classes.properties
561
- }
562
- }, /*#__PURE__*/_react["default"].createElement(_DialogContentText["default"], null, "Video Properties"), /*#__PURE__*/_react["default"].createElement(_TextField["default"], {
563
- autoFocus: true,
564
- margin: "dense",
565
- id: "width",
566
- label: "Width",
567
- type: "number",
568
- placeholder: "Width",
569
- value: width,
570
- onChange: this.changeHandler('width')
571
- }), /*#__PURE__*/_react["default"].createElement(_TextField["default"], {
572
- autoFocus: true,
573
- margin: "dense",
574
- id: "height",
575
- label: "Height",
576
- type: "number",
577
- placeholder: "Height",
578
- value: height,
579
- onChange: this.changeHandler('height')
580
- })), formattedUrl && /*#__PURE__*/_react["default"].createElement("iframe", {
581
- width: width,
582
- height: height,
583
- src: formattedUrl,
584
- frameBorder: "0",
585
- allow: "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture",
586
- allowFullScreen: true
587
- }), type === 'video' && (formattedUrl || updating) && !invalid && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_DialogContent["default"], {
588
- classes: {
589
- root: classes.properties
590
- }
591
- }, /*#__PURE__*/_react["default"].createElement(_TextField["default"], {
592
- autoFocus: true,
593
- margin: "dense",
594
- id: "starts",
595
- label: "Starts",
596
- type: "number",
597
- placeholder: "Starts",
598
- value: starts,
599
- onChange: this.changeHandler('starts')
600
- }), isYoutube && /*#__PURE__*/_react["default"].createElement(_TextField["default"], {
601
- autoFocus: true,
602
- margin: "dense",
603
- id: "ends",
604
- label: "Ends",
605
- type: "number",
606
- placeholder: "Ends",
607
- value: ends,
608
- onChange: this.changeHandler('ends')
609
- })))), isUploadMedia && /*#__PURE__*/_react["default"].createElement("div", {
610
- className: classes.uploadInput
611
- }, /*#__PURE__*/_react["default"].createElement("div", null, fileUpload.url ? /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("div", {
612
- className: classes.row
613
- }, /*#__PURE__*/_react["default"].createElement("audio", {
614
- controls: "controls",
615
- controlsList: "nodownload"
616
- }, /*#__PURE__*/_react["default"].createElement("source", {
617
- type: mimeType,
618
- src: fileUpload.url
619
- })), /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
620
- "aria-label": "delete",
621
- className: classes.deleteIcon,
622
- onClick: this.handleRemoveFile
623
- }, /*#__PURE__*/_react["default"].createElement(_Delete["default"], null))), !fileUpload.scheduled && fileUpload.loading ? /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
624
- variant: "subheading"
625
- }, "Loading...") : null, fileUpload.scheduled ? /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
626
- variant: "subheading"
627
- }, "Waiting for Upload to finish, then inserting item...") : null) : !fileUpload.loading ? /*#__PURE__*/_react["default"].createElement("input", {
628
- accept: "audio/*",
629
- className: classes.input,
630
- onChange: this.handleUploadFile,
631
- type: "file"
632
- }) : null, !!fileUpload.error && /*#__PURE__*/_react["default"].createElement(_Typography["default"], {
633
- className: classes.error,
634
- variant: "caption"
635
- }, fileUpload.error))))), /*#__PURE__*/_react["default"].createElement(_DialogActions["default"], null, /*#__PURE__*/_react["default"].createElement(_Button["default"], {
636
- onClick: function onClick() {
637
- return _this2.handleDone(false);
638
- },
639
- color: "primary"
640
- }, "Cancel"), /*#__PURE__*/_react["default"].createElement(_Button["default"], {
641
- disabled: submitIsDisabled,
642
- onClick: function onClick() {
643
- return _this2.handleDone(true);
644
- },
645
- color: "primary"
646
- }, edit ? 'Update' : 'Insert')));
647
- }
648
- }]);
649
- return MediaDialog;
650
- }(_react["default"].Component);
651
-
652
- exports.MediaDialog = MediaDialog;
653
- (0, _defineProperty2["default"])(MediaDialog, "propTypes", {
654
- classes: _propTypes["default"].object.isRequired,
655
- open: _propTypes["default"].bool,
656
- edit: _propTypes["default"].bool,
657
- disablePortal: _propTypes["default"].bool,
658
- handleClose: _propTypes["default"].func,
659
- uploadSoundSupport: _propTypes["default"].shape({
660
- add: _propTypes["default"].func,
661
- "delete": _propTypes["default"].func
662
- }),
663
- type: _propTypes["default"].string,
664
- src: _propTypes["default"].string,
665
- url: _propTypes["default"].string,
666
- urlToUse: _propTypes["default"].string,
667
- starts: _propTypes["default"].number,
668
- ends: _propTypes["default"].number,
669
- height: _propTypes["default"].number,
670
- width: _propTypes["default"].number
671
- });
672
-
673
- var styles = function styles(theme) {
674
- return {
675
- paper: {
676
- minWidth: '500px'
677
- },
678
- properties: {
679
- padding: 0
680
- },
681
- row: {
682
- display: 'flex',
683
- flexDirection: 'space-between'
684
- },
685
- rowItem: {
686
- marginRight: theme.spacing.unit * 1.5,
687
- cursor: 'pointer'
688
- },
689
- active: {
690
- color: _index.color.primary(),
691
- borderBottom: "2px solid ".concat(_index.color.primary())
692
- },
693
- uploadInput: {
694
- marginTop: theme.spacing.unit * 1.5
695
- },
696
- error: {
697
- marginTop: theme.spacing.unit * 1.5,
698
- color: theme.palette.error.main
699
- },
700
- deleteIcon: {
701
- marginLeft: theme.spacing.unit * 1.5
702
- }
703
- };
704
- };
705
-
706
- var _default = (0, _styles.withStyles)(styles)(MediaDialog);
707
-
708
- exports["default"] = _default;
709
- //# sourceMappingURL=media-dialog.js.map