@pie-lib/editable-html 11.2.0-beta.1 → 11.2.0-beta.2

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 (100) hide show
  1. package/CHANGELOG.md +16 -0
  2. package/package.json +9 -9
  3. package/lib/block-tags.js +0 -25
  4. package/lib/block-tags.js.map +0 -1
  5. package/lib/constants.js +0 -16
  6. package/lib/constants.js.map +0 -1
  7. package/lib/editor.js +0 -1355
  8. package/lib/editor.js.map +0 -1
  9. package/lib/index.js +0 -269
  10. package/lib/index.js.map +0 -1
  11. package/lib/parse-html.js +0 -16
  12. package/lib/parse-html.js.map +0 -1
  13. package/lib/plugins/characters/custom-popper.js +0 -73
  14. package/lib/plugins/characters/custom-popper.js.map +0 -1
  15. package/lib/plugins/characters/index.js +0 -305
  16. package/lib/plugins/characters/index.js.map +0 -1
  17. package/lib/plugins/characters/utils.js +0 -381
  18. package/lib/plugins/characters/utils.js.map +0 -1
  19. package/lib/plugins/css/icons/index.js +0 -37
  20. package/lib/plugins/css/icons/index.js.map +0 -1
  21. package/lib/plugins/css/index.js +0 -397
  22. package/lib/plugins/css/index.js.map +0 -1
  23. package/lib/plugins/customPlugin/index.js +0 -114
  24. package/lib/plugins/customPlugin/index.js.map +0 -1
  25. package/lib/plugins/html/icons/index.js +0 -38
  26. package/lib/plugins/html/icons/index.js.map +0 -1
  27. package/lib/plugins/html/index.js +0 -80
  28. package/lib/plugins/html/index.js.map +0 -1
  29. package/lib/plugins/image/alt-dialog.js +0 -129
  30. package/lib/plugins/image/alt-dialog.js.map +0 -1
  31. package/lib/plugins/image/component.js +0 -419
  32. package/lib/plugins/image/component.js.map +0 -1
  33. package/lib/plugins/image/image-toolbar.js +0 -177
  34. package/lib/plugins/image/image-toolbar.js.map +0 -1
  35. package/lib/plugins/image/index.js +0 -263
  36. package/lib/plugins/image/index.js.map +0 -1
  37. package/lib/plugins/image/insert-image-handler.js +0 -161
  38. package/lib/plugins/image/insert-image-handler.js.map +0 -1
  39. package/lib/plugins/index.js +0 -402
  40. package/lib/plugins/index.js.map +0 -1
  41. package/lib/plugins/list/index.js +0 -334
  42. package/lib/plugins/list/index.js.map +0 -1
  43. package/lib/plugins/math/index.js +0 -454
  44. package/lib/plugins/math/index.js.map +0 -1
  45. package/lib/plugins/media/index.js +0 -387
  46. package/lib/plugins/media/index.js.map +0 -1
  47. package/lib/plugins/media/media-dialog.js +0 -709
  48. package/lib/plugins/media/media-dialog.js.map +0 -1
  49. package/lib/plugins/media/media-toolbar.js +0 -101
  50. package/lib/plugins/media/media-toolbar.js.map +0 -1
  51. package/lib/plugins/media/media-wrapper.js +0 -93
  52. package/lib/plugins/media/media-wrapper.js.map +0 -1
  53. package/lib/plugins/rendering/index.js +0 -46
  54. package/lib/plugins/rendering/index.js.map +0 -1
  55. package/lib/plugins/respArea/drag-in-the-blank/choice.js +0 -254
  56. package/lib/plugins/respArea/drag-in-the-blank/choice.js.map +0 -1
  57. package/lib/plugins/respArea/drag-in-the-blank/index.js +0 -97
  58. package/lib/plugins/respArea/drag-in-the-blank/index.js.map +0 -1
  59. package/lib/plugins/respArea/explicit-constructed-response/index.js +0 -57
  60. package/lib/plugins/respArea/explicit-constructed-response/index.js.map +0 -1
  61. package/lib/plugins/respArea/icons/index.js +0 -95
  62. package/lib/plugins/respArea/icons/index.js.map +0 -1
  63. package/lib/plugins/respArea/index.js +0 -341
  64. package/lib/plugins/respArea/index.js.map +0 -1
  65. package/lib/plugins/respArea/inline-dropdown/index.js +0 -75
  66. package/lib/plugins/respArea/inline-dropdown/index.js.map +0 -1
  67. package/lib/plugins/respArea/math-templated/index.js +0 -130
  68. package/lib/plugins/respArea/math-templated/index.js.map +0 -1
  69. package/lib/plugins/respArea/utils.js +0 -125
  70. package/lib/plugins/respArea/utils.js.map +0 -1
  71. package/lib/plugins/table/CustomTablePlugin.js +0 -133
  72. package/lib/plugins/table/CustomTablePlugin.js.map +0 -1
  73. package/lib/plugins/table/icons/index.js +0 -69
  74. package/lib/plugins/table/icons/index.js.map +0 -1
  75. package/lib/plugins/table/index.js +0 -483
  76. package/lib/plugins/table/index.js.map +0 -1
  77. package/lib/plugins/table/table-toolbar.js +0 -187
  78. package/lib/plugins/table/table-toolbar.js.map +0 -1
  79. package/lib/plugins/textAlign/icons/index.js +0 -226
  80. package/lib/plugins/textAlign/icons/index.js.map +0 -1
  81. package/lib/plugins/textAlign/index.js +0 -34
  82. package/lib/plugins/textAlign/index.js.map +0 -1
  83. package/lib/plugins/toolbar/default-toolbar.js +0 -229
  84. package/lib/plugins/toolbar/default-toolbar.js.map +0 -1
  85. package/lib/plugins/toolbar/done-button.js +0 -53
  86. package/lib/plugins/toolbar/done-button.js.map +0 -1
  87. package/lib/plugins/toolbar/editor-and-toolbar.js +0 -286
  88. package/lib/plugins/toolbar/editor-and-toolbar.js.map +0 -1
  89. package/lib/plugins/toolbar/index.js +0 -34
  90. package/lib/plugins/toolbar/index.js.map +0 -1
  91. package/lib/plugins/toolbar/toolbar-buttons.js +0 -194
  92. package/lib/plugins/toolbar/toolbar-buttons.js.map +0 -1
  93. package/lib/plugins/toolbar/toolbar.js +0 -376
  94. package/lib/plugins/toolbar/toolbar.js.map +0 -1
  95. package/lib/plugins/utils.js +0 -62
  96. package/lib/plugins/utils.js.map +0 -1
  97. package/lib/serialization.js +0 -677
  98. package/lib/serialization.js.map +0 -1
  99. package/lib/theme.js +0 -9
  100. 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 _renderUi = require("@pie-lib/render-ui");
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: _renderUi.color.primary(),
691
- borderBottom: "2px solid ".concat(_renderUi.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