cloudhubui
Version:
Various components to use in react projects
1,128 lines (956 loc) • 43.3 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _react = _interopRequireDefault(require("react"));
var _qs = _interopRequireDefault(require("qs"));
var _uid = _interopRequireDefault(require("uid"));
var _List = _interopRequireDefault(require("@material-ui/core/List"));
var _ListItem = _interopRequireDefault(require("@material-ui/core/ListItem"));
var _ListItemSecondaryAction = _interopRequireDefault(require("@material-ui/core/ListItemSecondaryAction"));
var _VideoLibrarySharp = _interopRequireDefault(require("@material-ui/icons/VideoLibrarySharp"));
var _Delete = _interopRequireDefault(require("@material-ui/icons/Delete"));
var _AddPhotoAlternate = _interopRequireDefault(require("@material-ui/icons/AddPhotoAlternate"));
var _Close = _interopRequireDefault(require("@material-ui/icons/Close"));
var _InfoOutlined = _interopRequireDefault(require("@material-ui/icons/InfoOutlined"));
var _isEqual = _interopRequireDefault(require("lodash/isEqual"));
var _ = require("..");
var _dialog = require("../dialog");
var _ThemeContext = _interopRequireDefault(require("../theme/ThemeContext"));
var _AntProgress = _interopRequireDefault(require("../ant/AntProgress"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _createForOfIteratorHelper(o, allowArrayLike) { var it; if (typeof Symbol === "undefined" || o[Symbol.iterator] == null) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e2) { throw _e2; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = o[Symbol.iterator](); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e3) { didErr = true; err = _e3; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && Symbol.iterator in Object(iter)) return Array.from(iter); }
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
var S3Uploader = function S3Uploader(_ref) {
var dirname = _ref.dirname,
ACL = _ref.ACL,
signaxiosinstance = _ref.signaxiosinstance,
uploadaxiosinstance = _ref.uploadaxiosinstance,
input = _ref.input,
onChange = _ref.onChange,
value = _ref.value,
signurl = _ref.signurl,
deleteurl = _ref.deleteurl,
limit = _ref.limit,
maxSize = _ref.maxSize,
thumbMaxSize = _ref.thumbMaxSize,
thumbdirname = _ref.thumbdirname,
accept = _ref.accept,
acceptThumb = _ref.acceptThumb,
maxWidth = _ref.maxWidth,
minWidth = _ref.minWidth,
aspectratio = _ref.aspectratio,
tolerance = _ref.tolerance,
maxDuration = _ref.maxDuration,
minDuration = _ref.minDuration,
setuploading = _ref.setuploading,
uploading = _ref.uploading,
disabled = _ref.disabled,
readOnly = _ref.readOnly;
var incominginput = input.value || value || [];
var _React$useContext = _react.default.useContext(_ThemeContext.default),
sizes = _React$useContext.sizes,
colors = _React$useContext.colors;
var _React$useState = _react.default.useState(incominginput || []),
_React$useState2 = _slicedToArray(_React$useState, 2),
fileList = _React$useState2[0],
setfileList = _React$useState2[1];
var _React$useState3 = _react.default.useState(null),
_React$useState4 = _slicedToArray(_React$useState3, 2),
addingThumbnail = _React$useState4[0],
setaddingThumbnail = _React$useState4[1];
var _React$useState5 = _react.default.useState(false),
_React$useState6 = _slicedToArray(_React$useState5, 2),
confirmdelete = _React$useState6[0],
setconfirmdelete = _React$useState6[1];
var _React$useState7 = _react.default.useState(null),
_React$useState8 = _slicedToArray(_React$useState7, 2),
deleting = _React$useState8[0],
setdeleting = _React$useState8[1];
var _React$useState9 = _react.default.useState(false),
_React$useState10 = _slicedToArray(_React$useState9, 2),
uploaderror = _React$useState10[0],
setuploaderror = _React$useState10[1];
var _React$useState11 = _react.default.useState(null),
_React$useState12 = _slicedToArray(_React$useState11, 2),
addinginfo = _React$useState12[0],
setaddinginfo = _React$useState12[1];
var _React$useState13 = _react.default.useState(false),
_React$useState14 = _slicedToArray(_React$useState13, 2),
thumberror = _React$useState14[0],
setthumberror = _React$useState14[1];
var elemId = (0, _uid.default)(5);
_react.default.useEffect(function () {
if (Array.isArray(incominginput) && !(0, _isEqual.default)(incominginput, fileList)) {
setfileList(incominginput);
}
}, [incominginput]);
_react.default.useEffect(function () {
if (uploaderror) {
setTimeout(function () {
setuploaderror(false);
}, 500);
}
}, [uploaderror]);
_react.default.useEffect(function () {
if (thumberror) {
setTimeout(function () {
setthumberror(false);
}, 500);
}
}, [thumberror]);
var logChange = function logChange(fileUpdate) {
if (typeof input.onChange === 'function') {
input.onChange(fileUpdate || []);
}
if (typeof onChange === 'function') {
onChange(fileUpdate || []);
}
};
_react.default.useEffect(function () {
if (Array.isArray(fileList)) {
var isuploading = fileList.filter(Boolean).map(function (_ref2) {
var status = _ref2.status;
if (status === 'done') return 'done';
return 'uploading';
});
if (isuploading.indexOf('uploading') !== -1 || addingThumbnail && addingThumbnail.video && addingThumbnail.status !== 'done') {
if (!uploading) {
setuploading(true);
}
logChange(fileList);
} else {
setuploading(false);
logChange(fileList);
}
}
}, [fileList, addingThumbnail]);
_react.default.useEffect(function () {
if (deleting && confirmdelete && Array.isArray(fileList)) {
var fileArr = fileList.filter(Boolean).map(function (_ref3) {
var Location = _ref3.Location,
fd = _ref3.fd,
thumbfd = _ref3.thumbfd;
if (Location === deleting) {
if (thumbfd) {
return [fd, thumbfd];
}
return fd;
}
return null;
}).flat().filter(Boolean);
signaxiosinstance().post(deleteurl, {
files: fileArr
}).then(function (_ref4) {
var data = _ref4.data;
_.toastr.success(data.message);
setfileList(function (files) {
if (files.length > 0) {
var progressArray = files.map(function (obj) {
if (obj && obj.Location === deleting) {
return null;
}
return obj;
}).filter(Boolean);
return progressArray;
}
});
setconfirmdelete(false);
setdeleting(null);
}).catch(function (error) {
var response = error.response || {};
var data = response.data || {};
_.toastr.error(data.message || data);
});
}
}, [confirmdelete, deleting]);
var onprogress = function onprogress(progressEvent, url) {
if (progressEvent && url) {
setfileList(function (urls) {
if (urls.length > 0) {
var progressArray = urls.map(function (obj) {
if (obj && obj.signedUrl === url) {
var progress = Math.round(progressEvent.loaded * 100 / progressEvent.total);
return _objectSpread(_objectSpread({}, obj), {}, {
progress: progress
});
}
return obj;
});
return progressArray;
}
return urls;
});
}
};
var onUploadFinish = function onUploadFinish(url) {
if (url) {
setfileList(function (urls) {
if (urls.length > 0) {
var progressArray = urls.map(function (obj) {
if (obj && url === obj.signedUrl) {
var newobj = _objectSpread(_objectSpread({}, obj), {}, {
status: 'done'
});
delete newobj.signedUrl;
delete newobj.progress;
return _objectSpread({}, newobj);
}
return obj;
});
return progressArray;
}
return urls;
});
}
};
var onUploadError = function onUploadError(url) {
if (url) {
setfileList(function (urls) {
if (urls.length > 0) {
var progressArray = urls.map(function (obj) {
if (obj && url === obj.signedUrl) {
_.toastr.error("File ".concat(obj.filename || obj.name, " upload failed. please try again later"));
return null;
}
return obj;
});
return progressArray;
}
return urls;
});
}
};
var onthumbprogress = function onthumbprogress(progressEvent, url) {
setaddingThumbnail(function (thumb) {
if (thumb.signedUrl === url) {
return _objectSpread(_objectSpread({}, thumb), {}, {
progress: progressEvent.loaded * 100 / progressEvent.total
});
}
return thumb;
});
};
var onThumbFinish = function onThumbFinish() {
setaddingThumbnail(function (current) {
if (current) {
setfileList(function (urls) {
if (urls.length > 0) {
var progressArray = urls.map(function (obj) {
if (obj && obj.uid === current.video) {
var newobj = _objectSpread(_objectSpread({}, obj), {}, {
status: 'done',
thumbnail: current.Location,
thumbfd: current.fd
});
return _objectSpread({}, newobj);
}
return obj;
});
return progressArray;
}
return urls;
});
}
return null;
});
};
var onThumbError = function onThumbError() {
setaddingThumbnail(null);
};
var handleFiles = /*#__PURE__*/function () {
var _ref5 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee2(event) {
var files, sizelimit, inds, fileObjArray, Allfiles, fileArray, filesArray, signedUrls, uploads, _iterator, _step, _loop;
return regeneratorRuntime.wrap(function _callee2$(_context3) {
while (1) {
switch (_context3.prev = _context3.next) {
case 0:
_context3.prev = 0;
setuploaderror(false);
files = event.target.files;
if (!(limit && Array.isArray(fileList) && Array.isArray(files) && files.length + fileList.length > limit)) {
_context3.next = 5;
break;
}
return _context3.abrupt("return", _.toastr.error("Only a maximum of ".concat(limit, " files allowed")));
case 5:
if (!(maxSize && maxSize > 0)) {
_context3.next = 10;
break;
}
sizelimit = Number(maxSize * 1024 * 1024);
inds = _toConsumableArray(files || []).map(function (file, index) {
return file && file.size > sizelimit ? index + 1 : null;
}).filter(Boolean);
if (!(inds.length > 0)) {
_context3.next = 10;
break;
}
return _context3.abrupt("return", _.toastr.error("File \"".concat(files[inds[0] - 1].name, "\" exceeds ").concat(maxSize, "MB. Please try again with a smaller file")));
case 10:
_context3.next = 12;
return _toConsumableArray(files || []).filter(Boolean).map( /*#__PURE__*/function () {
var _ref6 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(file) {
return regeneratorRuntime.wrap(function _callee$(_context) {
while (1) {
switch (_context.prev = _context.next) {
case 0:
return _context.abrupt("return", new Promise(function (resolve, reject) {
var video = document.createElement('video');
video.src = URL.createObjectURL(file);
video.preload = 'metadata';
video.onloadedmetadata = function () {
if (maxWidth && video.videoWidth > maxWidth) {
_.toastr.error("Video ".concat(file.name, " is wider than the maximum allowed ").concat(maxWidth, "px"));
setuploaderror(true);
reject(new Error('Invalid Width'));
}
if (minWidth && video.videoWidth < minWidth) {
_.toastr.error("Video ".concat(file.name, " is narrower than the minimum allowed ").concat(minWidth, "px"));
setuploaderror(true);
reject(new Error('Invalid Width'));
}
if (aspectratio && !tolerance && (video.videoWidth / video.videoHeight).toFixed(2) !== aspectratio.toFixed(2)) {
_.toastr.error("Video ".concat(file.name, " aspect ratio doesn't match the required ").concat(aspectratio));
setuploaderror(true);
reject(new Error('Invalid aspect ratio'));
}
if (aspectratio && tolerance && Math.abs(video.videoWidth / video.videoHeight - aspectratio) > tolerance) {
_.toastr.error("Video ".concat(file.name, " aspect ratio doesn't match the required ").concat(aspectratio));
setuploaderror(true);
reject(new Error('Invalid aspect ratio'));
}
if (minDuration && video.duration < minDuration) {
_.toastr.error("Video ".concat(file.name, " is shorter than the minimum required ").concat(minDuration, " seconds"));
setuploaderror(true);
reject(new Error('Invalid video duration'));
}
if (maxDuration && video.duration > maxDuration) {
_.toastr.error("Video ".concat(file.name, " is longer than the maximum allowed ").concat(maxDuration, " seconds"));
setuploaderror(true);
reject(new Error('Invalid video duration'));
}
if (!uploaderror) {
var fileprops = {
name: file.name.replace(/[^\w\d_\-.]+/gi, ''),
type: file.type,
size: file.size,
length: video.duration,
videoWidth: video.videoWidth,
videoHeight: video.videoHeight
};
resolve({
file: file,
fileprops: fileprops
});
}
};
}));
case 1:
case "end":
return _context.stop();
}
}
}, _callee);
}));
return function (_x2) {
return _ref6.apply(this, arguments);
};
}());
case 12:
fileObjArray = _context3.sent;
Allfiles = [];
_context3.next = 16;
return Promise.all(fileObjArray).then(function (Files) {
Allfiles = Files;
});
case 16:
fileArray = Allfiles.filter(Boolean).map(function (_ref7) {
var fileprops = _ref7.fileprops;
return fileprops;
});
filesArray = Allfiles.filter(Boolean).map(function (_ref8) {
var file = _ref8.file;
return file;
});
_context3.next = 20;
return getSignedUrl(fileArray, true);
case 20:
signedUrls = _context3.sent;
signedUrls.filter(Boolean);
uploads = _toConsumableArray(filesArray || []).map(function (file) {
return signedUrls.filter(Boolean).map(function (_ref9) {
var signedUrl = _ref9.signedUrl,
filename = _ref9.filename;
if (file && filename === file.name.replace(/[^\w\d_\-.]+/gi, '')) {
return {
signedUrl: signedUrl,
file: file,
options: {
headers: {
'Content-Type': _qs.default.parse(signedUrl)['Content-Type'],
Expires: _qs.default.parse(signedUrl).Expires,
'x-amz-acl': _qs.default.parse(signedUrl)['x-amz-acl'] || 'public-read'
},
onUploadProgress: function onUploadProgress(progressEvent) {
onprogress(progressEvent, signedUrl);
}
}
};
}
return null;
}).filter(Boolean)[0];
});
_iterator = _createForOfIteratorHelper(uploads);
_context3.prev = 24;
_loop = /*#__PURE__*/regeneratorRuntime.mark(function _loop() {
var upload;
return regeneratorRuntime.wrap(function _loop$(_context2) {
while (1) {
switch (_context2.prev = _context2.next) {
case 0:
upload = _step.value;
_context2.next = 3;
return uploadaxiosinstance.put(upload.signedUrl, upload.file, upload.options).then(function () {
onUploadFinish(upload.signedUrl);
_.toastr.success('Video uploaded successfully');
}).catch(function (error) {
onUploadError(upload.signedUrl);
_.toastr.error("".concat(error.response ? error.response.data : 'Video upload failed, try again later'));
});
case 3:
case "end":
return _context2.stop();
}
}
}, _loop);
});
_iterator.s();
case 27:
if ((_step = _iterator.n()).done) {
_context3.next = 31;
break;
}
return _context3.delegateYield(_loop(), "t0", 29);
case 29:
_context3.next = 27;
break;
case 31:
_context3.next = 36;
break;
case 33:
_context3.prev = 33;
_context3.t1 = _context3["catch"](24);
_iterator.e(_context3.t1);
case 36:
_context3.prev = 36;
_iterator.f();
return _context3.finish(36);
case 39:
_context3.next = 44;
break;
case 41:
_context3.prev = 41;
_context3.t2 = _context3["catch"](0);
_.toastr.error('Some files could not be uploaded');
case 44:
case "end":
return _context3.stop();
}
}
}, _callee2, null, [[0, 41], [24, 33, 36, 39]]);
}));
return function handleFiles(_x) {
return _ref5.apply(this, arguments);
};
}();
var addThumb = /*#__PURE__*/function () {
var _ref10 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee4(event) {
var thumb, files, sizelimit, inds, fileObjArray, Allfiles, fileArray, filesArray, signedUrls, uploads, _iterator2, _step2, _loop2;
return regeneratorRuntime.wrap(function _callee4$(_context6) {
while (1) {
switch (_context6.prev = _context6.next) {
case 0:
setaddingThumbnail(function (current) {
thumb = current;
return current;
});
setthumberror(false);
files = event.target.files;
if (!(thumbMaxSize && thumbMaxSize > 0)) {
_context6.next = 8;
break;
}
sizelimit = Number(thumbMaxSize * 1024);
inds = _toConsumableArray(files || []).map(function (file, index) {
return file && file.size > sizelimit ? index + 1 : null;
}).filter(Boolean);
if (!(inds.length > 0)) {
_context6.next = 8;
break;
}
return _context6.abrupt("return", _.toastr.error("File \"".concat(files[inds[0] - 1].name, "\" exceeds ").concat(thumbMaxSize, "MB. Please try again with a smaller file")));
case 8:
_context6.next = 10;
return _toConsumableArray(files || []).filter(Boolean).map( /*#__PURE__*/function () {
var _ref11 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee3(file) {
return regeneratorRuntime.wrap(function _callee3$(_context4) {
while (1) {
switch (_context4.prev = _context4.next) {
case 0:
return _context4.abrupt("return", new Promise(function (resolve, reject) {
var img = new Image();
img.src = URL.createObjectURL(file);
img.onload = function () {
var tol = tolerance || 0.3;
if (thumb && thumb.videoHeight && thumb.videoWidth && Math.abs(img.width / img.height - thumb.videoWidth / thumb.videoHeight) > tol) {
setthumberror(true);
reject(new Error('Thumbnail aspect ratio does not match video'));
} else if (!thumberror) {
var fileprops = {
name: file.name.replace(/[^\w\d_\-.]+/gi, ''),
type: file.type,
size: file.size
};
resolve({
file: file,
fileprops: fileprops
});
}
};
}));
case 1:
case "end":
return _context4.stop();
}
}
}, _callee3);
}));
return function (_x4) {
return _ref11.apply(this, arguments);
};
}());
case 10:
fileObjArray = _context6.sent;
Allfiles = [];
_context6.next = 14;
return Promise.all(fileObjArray).then(function (Files) {
Allfiles = Files;
});
case 14:
fileArray = Allfiles.map(function (_ref12) {
var fileprops = _ref12.fileprops;
return fileprops;
});
filesArray = Allfiles.map(function (_ref13) {
var file = _ref13.file;
return file;
});
_context6.next = 18;
return getSignedUrl(fileArray, false).then(function (urls) {
return urls;
});
case 18:
signedUrls = _context6.sent;
uploads = _toConsumableArray(filesArray || []).map(function (file) {
return signedUrls.filter(Boolean).map(function (_ref14) {
var signedUrl = _ref14.signedUrl,
filename = _ref14.filename;
if (file && filename === file.name.replace(/[^\w\d_\-.]+/gi, '')) {
return {
signedUrl: signedUrl,
file: file,
options: {
headers: {
'Content-Type': _qs.default.parse(signedUrl)['Content-Type'],
Expires: _qs.default.parse(signedUrl).Expires,
'x-amz-acl': _qs.default.parse(signedUrl)['x-amz-acl'] || 'public-read'
},
onUploadProgress: function onUploadProgress(progressEvent) {
onthumbprogress(progressEvent, signedUrl);
}
}
};
}
return null;
}).filter(Boolean)[0];
});
_iterator2 = _createForOfIteratorHelper(uploads);
_context6.prev = 21;
_loop2 = /*#__PURE__*/regeneratorRuntime.mark(function _loop2() {
var upload;
return regeneratorRuntime.wrap(function _loop2$(_context5) {
while (1) {
switch (_context5.prev = _context5.next) {
case 0:
upload = _step2.value;
_context5.next = 3;
return uploadaxiosinstance.put(upload.signedUrl, upload.file, upload.options).then(function () {
onThumbFinish(upload.signedUrl);
_.toastr.success('Thumbnail added successfully');
}).catch(function (error) {
onThumbError(upload.signedUrl);
_.toastr.error("".concat(error.response ? error.response.data : 'Image upload failed, try again later'));
});
case 3:
case "end":
return _context5.stop();
}
}
}, _loop2);
});
_iterator2.s();
case 24:
if ((_step2 = _iterator2.n()).done) {
_context6.next = 28;
break;
}
return _context6.delegateYield(_loop2(), "t0", 26);
case 26:
_context6.next = 24;
break;
case 28:
_context6.next = 33;
break;
case 30:
_context6.prev = 30;
_context6.t1 = _context6["catch"](21);
_iterator2.e(_context6.t1);
case 33:
_context6.prev = 33;
_iterator2.f();
return _context6.finish(33);
case 36:
case "end":
return _context6.stop();
}
}
}, _callee4, null, [[21, 30, 33, 36]]);
}));
return function addThumb(_x3) {
return _ref10.apply(this, arguments);
};
}();
var onDelete = function onDelete(Location) {
setdeleting(Location);
};
var getSignedUrl = /*#__PURE__*/function () {
var _ref15 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee5(files, video) {
var _yield$signaxiosinsta, data, signedUrls;
return regeneratorRuntime.wrap(function _callee5$(_context7) {
while (1) {
switch (_context7.prev = _context7.next) {
case 0:
_context7.prev = 0;
_context7.next = 3;
return signaxiosinstance().post(signurl, {
files: files,
ACL: ACL || 'public-read',
dirname: video ? dirname || 'video/' : thumbdirname || 'thumbnail/'
});
case 3:
_yield$signaxiosinsta = _context7.sent;
data = _yield$signaxiosinsta.data;
signedUrls = data.signedUrls.map(function (obj) {
return _objectSpread(_objectSpread({}, obj), {}, {
progress: 0
});
});
if (video) {
setfileList(function (files) {
return [].concat(_toConsumableArray(files), _toConsumableArray(signedUrls));
});
} else {
setaddingThumbnail(function (_ref16) {
var video = _ref16.video;
return _objectSpread(_objectSpread({}, signedUrls[0]), {}, {
video: video
});
});
}
return _context7.abrupt("return", signedUrls);
case 10:
_context7.prev = 10;
_context7.t0 = _context7["catch"](0);
_.toastr.error('There was an error uploading file. Please try again later');
case 13:
case "end":
return _context7.stop();
}
}
}, _callee5, null, [[0, 10]]);
}));
return function getSignedUrl(_x5, _x6) {
return _ref15.apply(this, arguments);
};
}();
var addVideoInfo = function addVideoInfo(vals) {
var fileobj = _objectSpread(_objectSpread({}, addinginfo), vals);
setfileList(function (files) {
if (files.length > 0) {
var progressArray = files.map(function (obj) {
if (obj && obj.fd === fileobj.fd) {
return fileobj;
}
return obj;
});
return progressArray;
}
});
setaddinginfo(null);
};
return /*#__PURE__*/_react.default.createElement(_.Block, {
paper: true,
padding: 20
}, !uploaderror && /*#__PURE__*/_react.default.createElement("input", {
type: "file",
id: "videoElem".concat(elemId),
multiple: limit && limit > 1,
accept: accept || 'video/*',
style: {
position: 'absolute',
width: 1,
height: 1,
overflow: 'hidden',
clip: 'rect(1px, 1px, 1px, 1px)'
},
onChange: handleFiles,
disabled: disabled || readOnly
}), /*#__PURE__*/_react.default.createElement("label", {
htmlFor: "videoElem".concat(elemId),
style: {
cursor: 'pointer'
}
}, /*#__PURE__*/_react.default.createElement(_.Block, {
middle: true,
center: true
}, /*#__PURE__*/_react.default.createElement(_VideoLibrarySharp.default, null), /*#__PURE__*/_react.default.createElement(_.Text, {
caption: true
}, "upload"))), /*#__PURE__*/_react.default.createElement(_List.default, null, Array.isArray(fileList) && fileList.filter(Boolean).map(function (file) {
return /*#__PURE__*/_react.default.createElement(_ListItem.default, {
dense: true,
key: file.fd
}, /*#__PURE__*/_react.default.createElement(_.Block, {
row: true,
paper: true
}, file.status === 'done' && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_.VideoThumbnail, {
small: true,
title: file.filename,
length: file.length,
list: true,
flex: false,
thumbnail: "/cloud".concat((file.thumbfd || '').substring(0, 1) === '/' ? '' : '/').concat(file.thumbfd)
}), !file.thumbnail && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, !thumberror && /*#__PURE__*/_react.default.createElement("input", {
type: "file",
id: "thumbElem".concat(elemId),
accept: acceptThumb || 'image/*',
style: {
position: 'absolute',
width: 1,
height: 1,
overflow: 'hidden',
clip: 'rect(1px, 1px, 1px, 1px)'
},
onChange: function onChange(e) {
setaddingThumbnail({
video: file.uid,
videoHeight: file.videoHeight,
videoWidth: file.videoWidth
});
addThumb(e);
},
disabled: disabled || readOnly
}), !addingThumbnail && /*#__PURE__*/_react.default.createElement("label", {
htmlFor: "thumbElem".concat(elemId),
style: {
cursor: 'pointer',
marginTop: 'auto',
marginBottom: 'auto'
}
}, /*#__PURE__*/_react.default.createElement(_.Block, {
flex: false,
margin: [0, sizes.doubleBaseMargin],
center: true,
middle: true,
style: {
cursor: 'pointer'
}
}, /*#__PURE__*/_react.default.createElement(_AddPhotoAlternate.default, null), /*#__PURE__*/_react.default.createElement(_.Text, {
small: true,
bold: true,
success: true
}, "Add Thumbnail"))), addingThumbnail && addingThumbnail.video === file.uid && /*#__PURE__*/_react.default.createElement(_AntProgress.default, {
type: "circle",
percent: addingThumbnail.progress,
width: 40,
strokeColor: colors.blue,
style: {
marginTop: 'auto',
marginBottom: 'auto',
marginLeft: sizes.doubleBaseMargin
}
})), /*#__PURE__*/_react.default.createElement(_.Block, {
flex: false,
margin: [0, sizes.doubleBaseMargin],
center: true,
middle: true,
style: {
cursor: 'pointer'
},
onClick: function onClick() {
if (!disabled && !readOnly) {
setaddinginfo(file);
}
}
}, /*#__PURE__*/_react.default.createElement(_InfoOutlined.default, {
style: {
color: colors.twitterColor
}
}), /*#__PURE__*/_react.default.createElement(_.Text, {
small: true,
bold: true,
twitterColor: true
}, "Add Caption"))), file.progress < 100 && /*#__PURE__*/_react.default.createElement(_.Block, {
row: true,
bottom: true,
space: "between"
}, /*#__PURE__*/_react.default.createElement(_AntProgress.default, {
type: "circle",
percent: file.progress,
width: 40,
strokeColor: colors.success
}), /*#__PURE__*/_react.default.createElement(_.Text, {
style: {
margin: sizes.baseMargin
}
}, "...uploading"))), /*#__PURE__*/_react.default.createElement(_ListItemSecondaryAction.default, null, file.status === 'done' ? /*#__PURE__*/_react.default.createElement(_Delete.default, {
style: {
color: colors.error,
cursor: 'pointer'
},
onClick: function onClick() {
if (!disabled && !readOnly) {
onDelete(file.Location);
}
}
}) : /*#__PURE__*/_react.default.createElement(_Close.default, {
style: {
color: colors.error,
cursor: 'pointer'
},
onClick: function onClick() {
if (!disabled && !readOnly) {
onDelete(file.Location);
}
}
})));
})), /*#__PURE__*/_react.default.createElement(_.Dialog, {
maxWidth: "sm",
open: deleting !== null,
onClose: function onClose() {
return setdeleting(null);
} // onConfirm={() => setconfirmdelete(true)}
,
minHeight: 200
}, /*#__PURE__*/_react.default.createElement(_dialog.DialogHeader, {
onClose: function onClose() {
return setdeleting(null);
}
}), /*#__PURE__*/_react.default.createElement(_dialog.DialogContent, null, /*#__PURE__*/_react.default.createElement(_.Text, null, "Sure you want to remove video?")), /*#__PURE__*/_react.default.createElement(_dialog.DialogActions, null, /*#__PURE__*/_react.default.createElement(_.Button, {
contained: true,
color: colors.error,
onClick: function onClick() {
setdeleting(null);
}
}, "Cancel"), /*#__PURE__*/_react.default.createElement(_.Button, {
contained: true,
color: colors.success,
onClick: function onClick() {
setconfirmdelete(true);
}
}, "Delete"))), /*#__PURE__*/_react.default.createElement(_.Dialog, {
maxWidth: "sm",
open: addinginfo !== null,
onClose: function onClose() {
return setaddinginfo(null);
},
minHeight: 400
}, /*#__PURE__*/_react.default.createElement(_dialog.DialogHeader, {
onClose: function onClose() {
return setaddinginfo(null);
}
}), /*#__PURE__*/_react.default.createElement(_.Form, {
onSubmit: addVideoInfo,
initialValues: addinginfo ? {
caption: addinginfo.caption,
author: addinginfo.author,
imagelocation: addinginfo.imagelocation,
externallink: addinginfo.externallink
} : {},
render: function render(_ref17) {
var handleSubmit = _ref17.handleSubmit,
pristine = _ref17.pristine;
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_dialog.DialogContent, null, /*#__PURE__*/_react.default.createElement(_.Block, null, /*#__PURE__*/_react.default.createElement(_.Field, {
type: "text",
name: "caption",
label: "Video caption",
component: _.Input,
flex: true
}), /*#__PURE__*/_react.default.createElement(_.Field, {
type: "text",
name: "author",
label: "Who shot/owns this video?",
component: _.Input,
flex: true
}), /*#__PURE__*/_react.default.createElement(_.Field, {
type: "text",
name: "videolocation",
label: "Where was video taken?",
component: _.Input,
flex: true
}), /*#__PURE__*/_react.default.createElement(_.Field, {
type: "text",
name: "externallink",
label: "Website of author or video collection",
component: _.Input,
flex: true
}))), /*#__PURE__*/_react.default.createElement(_dialog.DialogActions, null, /*#__PURE__*/_react.default.createElement(_.Button, {
contained: true,
color: colors.error,
onClick: function onClick() {
setaddinginfo(null);
}
}, "Cancel"), /*#__PURE__*/_react.default.createElement(_.Button, {
contained: true,
color: colors.success,
disabled: pristine,
onClick: handleSubmit
}, "Save Video Info")));
}
})));
};
S3Uploader.defaultProps = {
onChange: function onChange() {},
input: {
value: null,
onChange: function onChange() {}
},
setuploading: function setuploading() {}
};
var _default = S3Uploader;
exports.default = _default;