sceyt-chat-react-uikit 1.6.8-beta.16 → 1.6.8-beta.17

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 (3) hide show
  1. package/index.js +138 -144
  2. package/index.modern.js +138 -144
  3. package/package.json +1 -1
package/index.js CHANGED
@@ -8291,9 +8291,6 @@ function checkChannelExistsOnMessagesMap(channelId) {
8291
8291
  return !!messagesMap[channelId];
8292
8292
  }
8293
8293
  var pendingVideoAttachmentsThumbs = {};
8294
- var setVideoThumb = function setVideoThumb(attachmentId, thumb) {
8295
- pendingVideoAttachmentsThumbs[attachmentId] = thumb;
8296
- };
8297
8294
  var getVideoThumb = function getVideoThumb(attachmentId) {
8298
8295
  return pendingVideoAttachmentsThumbs[attachmentId];
8299
8296
  };
@@ -15529,21 +15526,6 @@ var addData = function addData(db, storeName, keyPath, data) {
15529
15526
  }
15530
15527
  };
15531
15528
 
15532
- var getFrame3 = function getFrame3(video, time) {
15533
- try {
15534
- var canvas = document.createElement('canvas');
15535
- canvas.width = video.videoWidth;
15536
- canvas.height = video.videoHeight;
15537
- var ctx = canvas.getContext('2d');
15538
- if (time) {
15539
- video.currentTime = time;
15540
- }
15541
- ctx.drawImage(video, 0, 0);
15542
- return Promise.resolve(createImageThumbnail(null, canvas.toDataURL(), 10, 10));
15543
- } catch (e) {
15544
- return Promise.reject(e);
15545
- }
15546
- };
15547
15529
  var getFrame = function getFrame(videoSrc, time) {
15548
15530
  try {
15549
15531
  var video = document.createElement('video');
@@ -25450,55 +25432,42 @@ var VideoPreview = /*#__PURE__*/React.memo(function VideoPreview(_ref) {
25450
25432
  }
25451
25433
  }
25452
25434
  React.useEffect(function () {
25453
- var checkVideoInterval;
25454
- if (videoRef.current) {
25455
- var intervalCount = 0;
25456
- checkVideoInterval = setInterval(function () {
25457
- try {
25458
- var _temp4 = function _temp4() {
25459
- if (intervalCount >= 8) {
25460
- if (setVideoIsReadyToSend) {
25461
- setVideoIsReadyToSend(file.tid);
25462
- clearInterval(checkVideoInterval);
25463
- }
25464
- }
25465
- };
25466
- intervalCount++;
25467
- var _temp3 = function () {
25468
- if (videoRef.current && videoRef.current.readyState > 3) {
25469
- var _temp2 = function _temp2() {
25470
- clearInterval(checkVideoInterval);
25471
- };
25472
- setLoading(false);
25473
- setVideoDuration(videoRef.current.duration);
25474
- var minutes = Math.floor(videoRef.current.duration / 60);
25475
- var seconds = Math.floor(videoRef.current.duration % 60);
25476
- setVideoCurrentTime(minutes + ":" + (seconds < 10 ? "0" + seconds : seconds));
25477
- var _temp = function () {
25478
- if (isPreview) {
25479
- return Promise.resolve(getFrame3(videoRef.current, 0)).then(function (thumb) {
25480
- if (thumb) {
25481
- setVideoThumb(file.tid, _extends({}, thumb, {
25482
- duration: videoRef.current.duration
25483
- }));
25484
- if (setVideoIsReadyToSend) {
25485
- setVideoIsReadyToSend(file.tid);
25486
- }
25487
- }
25488
- });
25489
- }
25490
- }();
25491
- return _temp && _temp.then ? _temp.then(_temp2) : _temp2(_temp);
25492
- }
25493
- }();
25494
- return Promise.resolve(_temp3 && _temp3.then ? _temp3.then(_temp4) : _temp4(_temp3));
25495
- } catch (e) {
25496
- return Promise.reject(e);
25435
+ var video = videoRef.current;
25436
+ if (!video) return;
25437
+ var checkReadyState = function checkReadyState() {
25438
+ if (video.readyState > 3) {
25439
+ setLoading(false);
25440
+ setVideoDuration(video.duration);
25441
+ var minutes = Math.floor(video.duration / 60);
25442
+ var seconds = Math.floor(video.duration % 60);
25443
+ setVideoCurrentTime(minutes + ":" + (seconds < 10 ? "0" + seconds : seconds));
25444
+ console.log('videoCurrentTime **************', minutes + ":" + (seconds < 10 ? "0" + seconds : seconds));
25445
+ if (setVideoIsReadyToSend) {
25446
+ setVideoIsReadyToSend(file.tid);
25497
25447
  }
25498
- }, 1000);
25499
- }
25448
+ return true;
25449
+ }
25450
+ return false;
25451
+ };
25452
+ if (checkReadyState()) return;
25453
+ var handleCanPlay = function handleCanPlay() {
25454
+ return checkReadyState();
25455
+ };
25456
+ var handleLoadedMetadata = function handleLoadedMetadata() {
25457
+ return checkReadyState();
25458
+ };
25459
+ video.addEventListener('canplay', handleCanPlay);
25460
+ video.addEventListener('loadedmetadata', handleLoadedMetadata);
25461
+ var interval = setInterval(function () {
25462
+ console.log('checkReadyState **************');
25463
+ if (checkReadyState()) {
25464
+ clearInterval(interval);
25465
+ }
25466
+ }, 1000);
25500
25467
  return function () {
25501
- return clearInterval(checkVideoInterval);
25468
+ video.removeEventListener('canplay', handleCanPlay);
25469
+ video.removeEventListener('loadedmetadata', handleLoadedMetadata);
25470
+ clearInterval(interval);
25502
25471
  };
25503
25472
  }, []);
25504
25473
  React.useEffect(function () {
@@ -25543,7 +25512,7 @@ var VideoPreview = /*#__PURE__*/React.memo(function VideoPreview(_ref) {
25543
25512
  }, !isRepliedMessage && !isPreview && /*#__PURE__*/React__default.createElement(SvgVideoCall, null), videoCurrentTime))));
25544
25513
  });
25545
25514
  var VideoControls = styled__default.div(_templateObject$s || (_templateObject$s = _taggedTemplateLiteralLoose(["\n position: absolute;\n left: 0;\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n"])));
25546
- var VideoTime = styled__default.div(_templateObject2$o || (_templateObject2$o = _taggedTemplateLiteralLoose(["\n position: absolute;\n top: ", ";\n bottom: ", ";\n left: ", ";\n font-size: ", ";\n display: flex;\n align-items: center;\n border-radius: 16px;\n padding: ", ";\n background-color: ", ";\n line-height: 14px;\n color: ", ";\n\n & > svg {\n color: ", ";\n margin-right: 4px;\n }\n"])), function (props) {
25515
+ var VideoTime = styled__default.div(_templateObject2$o || (_templateObject2$o = _taggedTemplateLiteralLoose(["\n position: absolute;\n top: ", ";\n bottom: ", ";\n left: ", ";\n font-size: ", ";\n display: flex;\n align-items: center;\n border-radius: 16px;\n padding: ", ";\n background-color: ", ";\n line-height: 14px;\n color: ", ";\n z-index: 10;\n\n & > svg {\n color: ", ";\n margin-right: 4px;\n }\n"])), function (props) {
25547
25516
  return props.isRepliedMessage ? '3px' : props.isDetailsView ? undefined : '8px';
25548
25517
  }, function (props) {
25549
25518
  return props.isDetailsView ? '8px' : undefined;
@@ -29432,7 +29401,7 @@ var HiddenMessageTime = styled__default.span(_templateObject2$u || (_templateObj
29432
29401
  }, function (props) {
29433
29402
  return props.color;
29434
29403
  });
29435
- var MessageStatusAndTimeContainer = styled__default.span(_templateObject3$o || (_templateObject3$o = _taggedTemplateLiteralLoose(["\n visibility: ", ";\n display: ", ";\n align-items: flex-end;\n border-radius: 16px;\n padding: ", ";\n background-color: ", ";\n float: right;\n line-height: ", ";\n margin-right: ", ";\n margin-left: ", ";\n margin-bottom: ", ";\n direction: ", ";\n transform: translate(0px, 4px);\n white-space: nowrap;\n width: ", ";\n justify-content: ", ";\n\n & > svg {\n margin-left: 4px;\n height: 14px;\n width: 16px;\n }\n\n & > ", " {\n color: ", ";\n }\n\n ", "\n"])), function (props) {
29404
+ var MessageStatusAndTimeContainer = styled__default.span(_templateObject3$o || (_templateObject3$o = _taggedTemplateLiteralLoose(["\n visibility: ", ";\n display: ", ";\n align-items: flex-end;\n border-radius: 16px;\n padding: ", ";\n background-color: ", ";\n float: right;\n line-height: ", ";\n margin-right: ", ";\n margin-left: ", ";\n margin-bottom: ", ";\n direction: ", ";\n transform: translate(0px, 4px);\n white-space: nowrap;\n width: ", ";\n justify-content: ", ";\n z-index: 10;\n\n & > svg {\n margin-left: 4px;\n height: 14px;\n width: 16px;\n }\n\n & > ", " {\n color: ", ";\n }\n\n ", "\n"])), function (props) {
29436
29405
  return props.showOnlyOnHover && 'hidden';
29437
29406
  }, function (props) {
29438
29407
  return props.hide ? 'none' : 'flex';
@@ -29457,7 +29426,7 @@ var MessageStatusAndTimeContainer = styled__default.span(_templateObject3$o || (
29457
29426
  }, HiddenMessageTime, function (props) {
29458
29427
  return props.withAttachment ? props.messageTimeColorOnAttachment : '';
29459
29428
  }, function (props) {
29460
- return props.withAttachment && "\n position: absolute;\n z-index: 3;\n right: " + (props.fileAttachment ? '6px' : '10px') + ";\n bottom: " + (props.fileAttachment ? '9px' : '14px') + ";\n ";
29429
+ return props.withAttachment && "\n position: absolute;\n z-index: 10;\n right: " + (props.fileAttachment ? '6px' : '10px') + ";\n bottom: " + (props.fileAttachment ? '9px' : '14px') + ";\n ";
29461
29430
  });
29462
29431
  var MessageStatusUpdated = styled__default.span(_templateObject4$k || (_templateObject4$k = _taggedTemplateLiteralLoose(["\n margin-right: 4px;\n font-style: italic;\n font-weight: 400;\n font-size: ", ";\n color: ", ";\n"])), function (props) {
29463
29432
  return props.fontSize || '12px';
@@ -34877,7 +34846,7 @@ var SendMessageInput = function SendMessageInput(_ref3) {
34877
34846
  fileChecksum = "" + reader.result;
34878
34847
  }
34879
34848
  return Promise.resolve(hashString(fileChecksum || '')).then(function (checksumHash) {
34880
- function _temp10() {
34849
+ function _temp12() {
34881
34850
  if (dataFromDb) {
34882
34851
  cachedUrl = dataFromDb.url;
34883
34852
  setPendingAttachment(tid, {
@@ -34889,60 +34858,85 @@ var SendMessageInput = function SendMessageInput(_ref3) {
34889
34858
  checksum: checksumHash
34890
34859
  });
34891
34860
  }
34892
- var _temp0 = function () {
34861
+ var _temp10 = function () {
34893
34862
  if (customUploader) {
34894
- if (fileType === 'image') {
34895
- resizeImage(file).then(function (resizedFile) {
34896
- try {
34897
- setAttachments(function (prevState) {
34898
- return [].concat(prevState, [{
34899
- data: file,
34900
- cachedUrl: cachedUrl,
34901
- upload: false,
34902
- type: isMediaAttachment ? fileType : 'file',
34903
- attachmentUrl: URL.createObjectURL(resizedFile.blob),
34904
- tid: tid,
34905
- size: dataFromDb ? dataFromDb.size : file.size,
34906
- metadata: dataFromDb && dataFromDb.metadata
34907
- }]);
34908
- });
34909
- return Promise.resolve();
34910
- } catch (e) {
34911
- return Promise.reject(e);
34912
- }
34913
- });
34914
- } else if (fileType === 'video') {
34915
- setAttachments(function (prevState) {
34916
- return [].concat(prevState, [{
34917
- data: file,
34918
- cachedUrl: cachedUrl,
34919
- upload: false,
34920
- type: isMediaAttachment ? fileType : 'file',
34921
- attachmentUrl: URL.createObjectURL(file),
34922
- tid: tid,
34923
- size: dataFromDb ? dataFromDb.size : file.size,
34924
- metadata: dataFromDb && dataFromDb.metadata
34925
- }]);
34926
- });
34927
- } else {
34928
- setAttachments(function (prevState) {
34929
- return [].concat(prevState, [{
34930
- data: file,
34931
- cachedUrl: cachedUrl,
34932
- upload: false,
34933
- type: 'file',
34934
- tid: tid,
34935
- size: dataFromDb ? dataFromDb.size : file.size,
34936
- metadata: dataFromDb && dataFromDb.metadata
34937
- }]);
34938
- });
34939
- }
34863
+ var _temp2 = function () {
34864
+ if (fileType === 'image') {
34865
+ resizeImage(file).then(function (resizedFile) {
34866
+ try {
34867
+ return Promise.resolve(createImageThumbnail(file)).then(function (_ref4) {
34868
+ var thumbnail = _ref4.thumbnail,
34869
+ imageWidth = _ref4.imageWidth,
34870
+ imageHeight = _ref4.imageHeight;
34871
+ setAttachments(function (prevState) {
34872
+ return [].concat(prevState, [{
34873
+ data: file,
34874
+ cachedUrl: cachedUrl,
34875
+ upload: false,
34876
+ type: isMediaAttachment ? fileType : 'file',
34877
+ attachmentUrl: URL.createObjectURL(resizedFile.blob),
34878
+ tid: tid,
34879
+ size: dataFromDb ? dataFromDb.size : file.size,
34880
+ metadata: _extends({}, dataFromDb && dataFromDb.metadata, {
34881
+ szw: imageWidth,
34882
+ szh: imageHeight,
34883
+ tmb: thumbnail
34884
+ })
34885
+ }]);
34886
+ });
34887
+ });
34888
+ } catch (e) {
34889
+ return Promise.reject(e);
34890
+ }
34891
+ });
34892
+ } else {
34893
+ var _temp13 = function () {
34894
+ if (fileType === 'video') {
34895
+ return Promise.resolve(getFrame(URL.createObjectURL(file), 0)).then(function (_ref5) {
34896
+ var thumb = _ref5.thumb,
34897
+ width = _ref5.width,
34898
+ height = _ref5.height;
34899
+ setAttachments(function (prevState) {
34900
+ return [].concat(prevState, [{
34901
+ data: file,
34902
+ cachedUrl: cachedUrl,
34903
+ upload: false,
34904
+ type: isMediaAttachment ? fileType : 'file',
34905
+ attachmentUrl: URL.createObjectURL(file),
34906
+ tid: tid,
34907
+ size: dataFromDb ? dataFromDb.size : file.size,
34908
+ metadata: _extends({}, dataFromDb && dataFromDb.metadata, {
34909
+ szw: width,
34910
+ szh: height,
34911
+ tmb: thumb
34912
+ })
34913
+ }]);
34914
+ });
34915
+ });
34916
+ } else {
34917
+ setAttachments(function (prevState) {
34918
+ return [].concat(prevState, [{
34919
+ data: file,
34920
+ cachedUrl: cachedUrl,
34921
+ upload: false,
34922
+ type: 'file',
34923
+ tid: tid,
34924
+ size: dataFromDb ? dataFromDb.size : file.size,
34925
+ metadata: dataFromDb && dataFromDb.metadata
34926
+ }]);
34927
+ });
34928
+ }
34929
+ }();
34930
+ if (_temp13 && _temp13.then) return _temp13.then(function () {});
34931
+ }
34932
+ }();
34933
+ if (_temp2 && _temp2.then) return _temp2.then(function () {});
34940
34934
  } else {
34941
- var _temp9 = function () {
34935
+ var _temp1 = function () {
34942
34936
  if (fileType === 'image') {
34943
- var _temp5 = function () {
34937
+ var _temp7 = function () {
34944
34938
  if (isMediaAttachment) {
34945
- var _temp2 = function _temp2() {
34939
+ var _temp4 = function _temp4() {
34946
34940
  if (file.type === 'image/gif') {
34947
34941
  setAttachments(function (prevState) {
34948
34942
  return [].concat(prevState, [{
@@ -35002,23 +34996,23 @@ var SendMessageInput = function SendMessageInput(_ref3) {
35002
34996
  }
35003
34997
  };
35004
34998
  var metas = {};
35005
- var _temp = function () {
34999
+ var _temp3 = function () {
35006
35000
  if (dataFromDb) {
35007
35001
  metas = dataFromDb.metadata;
35008
35002
  } else {
35009
- return Promise.resolve(createImageThumbnail(file)).then(function (_ref4) {
35010
- var thumbnail = _ref4.thumbnail,
35011
- imageWidth = _ref4.imageWidth,
35012
- imageHeight = _ref4.imageHeight;
35003
+ return Promise.resolve(createImageThumbnail(file)).then(function (_ref6) {
35004
+ var thumbnail = _ref6.thumbnail,
35005
+ imageWidth = _ref6.imageWidth,
35006
+ imageHeight = _ref6.imageHeight;
35013
35007
  metas.imageHeight = imageHeight;
35014
35008
  metas.imageWidth = imageWidth;
35015
35009
  metas.thumbnail = thumbnail;
35016
35010
  });
35017
35011
  }
35018
35012
  }();
35019
- return _temp && _temp.then ? _temp.then(_temp2) : _temp2(_temp);
35013
+ return _temp3 && _temp3.then ? _temp3.then(_temp4) : _temp4(_temp3);
35020
35014
  } else {
35021
- var _temp4 = function _temp4() {
35015
+ var _temp6 = function _temp6() {
35022
35016
  setAttachments(function (prevState) {
35023
35017
  return [].concat(prevState, [{
35024
35018
  data: file,
@@ -35035,24 +35029,24 @@ var SendMessageInput = function SendMessageInput(_ref3) {
35035
35029
  });
35036
35030
  };
35037
35031
  var _metas = {};
35038
- var _temp3 = function () {
35032
+ var _temp5 = function () {
35039
35033
  if (dataFromDb) {
35040
35034
  _metas = dataFromDb.metadata;
35041
35035
  } else {
35042
- return Promise.resolve(createImageThumbnail(file, undefined, 50, 50)).then(function (_ref5) {
35043
- var thumbnail = _ref5.thumbnail;
35036
+ return Promise.resolve(createImageThumbnail(file, undefined, 50, 50)).then(function (_ref7) {
35037
+ var thumbnail = _ref7.thumbnail;
35044
35038
  _metas.thumbnail = thumbnail;
35045
35039
  });
35046
35040
  }
35047
35041
  }();
35048
- return _temp3 && _temp3.then ? _temp3.then(_temp4) : _temp4(_temp3);
35042
+ return _temp5 && _temp5.then ? _temp5.then(_temp6) : _temp6(_temp5);
35049
35043
  }
35050
35044
  }();
35051
- if (_temp5 && _temp5.then) return _temp5.then(function () {});
35045
+ if (_temp7 && _temp7.then) return _temp7.then(function () {});
35052
35046
  } else {
35053
- var _temp11 = function () {
35047
+ var _temp14 = function () {
35054
35048
  if (fileType === 'video') {
35055
- var _temp7 = function _temp7() {
35049
+ var _temp9 = function _temp9() {
35056
35050
  setAttachments(function (prevState) {
35057
35051
  return [].concat(prevState, [{
35058
35052
  data: file,
@@ -35067,14 +35061,14 @@ var SendMessageInput = function SendMessageInput(_ref3) {
35067
35061
  });
35068
35062
  };
35069
35063
  var metas = {};
35070
- var _temp6 = function () {
35064
+ var _temp8 = function () {
35071
35065
  if (dataFromDb) {
35072
35066
  metas = dataFromDb.metadata;
35073
35067
  } else {
35074
- return Promise.resolve(getFrame(URL.createObjectURL(file), 0)).then(function (_ref6) {
35075
- var thumb = _ref6.thumb,
35076
- width = _ref6.width,
35077
- height = _ref6.height;
35068
+ return Promise.resolve(getFrame(URL.createObjectURL(file), 0)).then(function (_ref8) {
35069
+ var thumb = _ref8.thumb,
35070
+ width = _ref8.width,
35071
+ height = _ref8.height;
35078
35072
  metas.tmb = thumb;
35079
35073
  metas.width = width;
35080
35074
  metas.height = height;
@@ -35082,7 +35076,7 @@ var SendMessageInput = function SendMessageInput(_ref3) {
35082
35076
  });
35083
35077
  }
35084
35078
  }();
35085
- return _temp6 && _temp6.then ? _temp6.then(_temp7) : _temp7(_temp6);
35079
+ return _temp8 && _temp8.then ? _temp8.then(_temp9) : _temp9(_temp8);
35086
35080
  } else {
35087
35081
  setAttachments(function (prevState) {
35088
35082
  return [].concat(prevState, [{
@@ -35097,23 +35091,23 @@ var SendMessageInput = function SendMessageInput(_ref3) {
35097
35091
  });
35098
35092
  }
35099
35093
  }();
35100
- if (_temp11 && _temp11.then) return _temp11.then(function () {});
35094
+ if (_temp14 && _temp14.then) return _temp14.then(function () {});
35101
35095
  }
35102
35096
  }();
35103
- if (_temp9 && _temp9.then) return _temp9.then(function () {});
35097
+ if (_temp1 && _temp1.then) return _temp1.then(function () {});
35104
35098
  }
35105
35099
  }();
35106
- if (_temp0 && _temp0.then) return _temp0.then(function () {});
35100
+ if (_temp10 && _temp10.then) return _temp10.then(function () {});
35107
35101
  }
35108
35102
  var dataFromDb;
35109
- var _temp1 = _catch(function () {
35103
+ var _temp11 = _catch(function () {
35110
35104
  return Promise.resolve(_getDataFromDB(DB_NAMES.FILES_STORAGE, DB_STORE_NAMES.ATTACHMENTS, checksumHash, 'checksum')).then(function (_getDataFromDB) {
35111
35105
  dataFromDb = _getDataFromDB;
35112
35106
  });
35113
35107
  }, function (e) {
35114
35108
  log.error('error in get data from db . . . . ', e);
35115
35109
  });
35116
- return _temp1 && _temp1.then ? _temp1.then(_temp10) : _temp10(_temp1);
35110
+ return _temp11 && _temp11.then ? _temp11.then(_temp12) : _temp12(_temp11);
35117
35111
  });
35118
35112
  } catch (e) {
35119
35113
  return Promise.reject(e);
package/index.modern.js CHANGED
@@ -8268,9 +8268,6 @@ function checkChannelExistsOnMessagesMap(channelId) {
8268
8268
  return !!messagesMap[channelId];
8269
8269
  }
8270
8270
  var pendingVideoAttachmentsThumbs = {};
8271
- var setVideoThumb = function setVideoThumb(attachmentId, thumb) {
8272
- pendingVideoAttachmentsThumbs[attachmentId] = thumb;
8273
- };
8274
8271
  var getVideoThumb = function getVideoThumb(attachmentId) {
8275
8272
  return pendingVideoAttachmentsThumbs[attachmentId];
8276
8273
  };
@@ -15506,21 +15503,6 @@ var addData = function addData(db, storeName, keyPath, data) {
15506
15503
  }
15507
15504
  };
15508
15505
 
15509
- var getFrame3 = function getFrame3(video, time) {
15510
- try {
15511
- var canvas = document.createElement('canvas');
15512
- canvas.width = video.videoWidth;
15513
- canvas.height = video.videoHeight;
15514
- var ctx = canvas.getContext('2d');
15515
- if (time) {
15516
- video.currentTime = time;
15517
- }
15518
- ctx.drawImage(video, 0, 0);
15519
- return Promise.resolve(createImageThumbnail(null, canvas.toDataURL(), 10, 10));
15520
- } catch (e) {
15521
- return Promise.reject(e);
15522
- }
15523
- };
15524
15506
  var getFrame = function getFrame(videoSrc, time) {
15525
15507
  try {
15526
15508
  var video = document.createElement('video');
@@ -25427,55 +25409,42 @@ var VideoPreview = /*#__PURE__*/memo(function VideoPreview(_ref) {
25427
25409
  }
25428
25410
  }
25429
25411
  useEffect(function () {
25430
- var checkVideoInterval;
25431
- if (videoRef.current) {
25432
- var intervalCount = 0;
25433
- checkVideoInterval = setInterval(function () {
25434
- try {
25435
- var _temp4 = function _temp4() {
25436
- if (intervalCount >= 8) {
25437
- if (setVideoIsReadyToSend) {
25438
- setVideoIsReadyToSend(file.tid);
25439
- clearInterval(checkVideoInterval);
25440
- }
25441
- }
25442
- };
25443
- intervalCount++;
25444
- var _temp3 = function () {
25445
- if (videoRef.current && videoRef.current.readyState > 3) {
25446
- var _temp2 = function _temp2() {
25447
- clearInterval(checkVideoInterval);
25448
- };
25449
- setLoading(false);
25450
- setVideoDuration(videoRef.current.duration);
25451
- var minutes = Math.floor(videoRef.current.duration / 60);
25452
- var seconds = Math.floor(videoRef.current.duration % 60);
25453
- setVideoCurrentTime(minutes + ":" + (seconds < 10 ? "0" + seconds : seconds));
25454
- var _temp = function () {
25455
- if (isPreview) {
25456
- return Promise.resolve(getFrame3(videoRef.current, 0)).then(function (thumb) {
25457
- if (thumb) {
25458
- setVideoThumb(file.tid, _extends({}, thumb, {
25459
- duration: videoRef.current.duration
25460
- }));
25461
- if (setVideoIsReadyToSend) {
25462
- setVideoIsReadyToSend(file.tid);
25463
- }
25464
- }
25465
- });
25466
- }
25467
- }();
25468
- return _temp && _temp.then ? _temp.then(_temp2) : _temp2(_temp);
25469
- }
25470
- }();
25471
- return Promise.resolve(_temp3 && _temp3.then ? _temp3.then(_temp4) : _temp4(_temp3));
25472
- } catch (e) {
25473
- return Promise.reject(e);
25412
+ var video = videoRef.current;
25413
+ if (!video) return;
25414
+ var checkReadyState = function checkReadyState() {
25415
+ if (video.readyState > 3) {
25416
+ setLoading(false);
25417
+ setVideoDuration(video.duration);
25418
+ var minutes = Math.floor(video.duration / 60);
25419
+ var seconds = Math.floor(video.duration % 60);
25420
+ setVideoCurrentTime(minutes + ":" + (seconds < 10 ? "0" + seconds : seconds));
25421
+ console.log('videoCurrentTime **************', minutes + ":" + (seconds < 10 ? "0" + seconds : seconds));
25422
+ if (setVideoIsReadyToSend) {
25423
+ setVideoIsReadyToSend(file.tid);
25474
25424
  }
25475
- }, 1000);
25476
- }
25425
+ return true;
25426
+ }
25427
+ return false;
25428
+ };
25429
+ if (checkReadyState()) return;
25430
+ var handleCanPlay = function handleCanPlay() {
25431
+ return checkReadyState();
25432
+ };
25433
+ var handleLoadedMetadata = function handleLoadedMetadata() {
25434
+ return checkReadyState();
25435
+ };
25436
+ video.addEventListener('canplay', handleCanPlay);
25437
+ video.addEventListener('loadedmetadata', handleLoadedMetadata);
25438
+ var interval = setInterval(function () {
25439
+ console.log('checkReadyState **************');
25440
+ if (checkReadyState()) {
25441
+ clearInterval(interval);
25442
+ }
25443
+ }, 1000);
25477
25444
  return function () {
25478
- return clearInterval(checkVideoInterval);
25445
+ video.removeEventListener('canplay', handleCanPlay);
25446
+ video.removeEventListener('loadedmetadata', handleLoadedMetadata);
25447
+ clearInterval(interval);
25479
25448
  };
25480
25449
  }, []);
25481
25450
  useEffect(function () {
@@ -25520,7 +25489,7 @@ var VideoPreview = /*#__PURE__*/memo(function VideoPreview(_ref) {
25520
25489
  }, !isRepliedMessage && !isPreview && /*#__PURE__*/React__default.createElement(SvgVideoCall, null), videoCurrentTime))));
25521
25490
  });
25522
25491
  var VideoControls = styled.div(_templateObject$s || (_templateObject$s = _taggedTemplateLiteralLoose(["\n position: absolute;\n left: 0;\n width: 100%;\n height: 100%;\n display: flex;\n align-items: center;\n justify-content: center;\n"])));
25523
- var VideoTime = styled.div(_templateObject2$o || (_templateObject2$o = _taggedTemplateLiteralLoose(["\n position: absolute;\n top: ", ";\n bottom: ", ";\n left: ", ";\n font-size: ", ";\n display: flex;\n align-items: center;\n border-radius: 16px;\n padding: ", ";\n background-color: ", ";\n line-height: 14px;\n color: ", ";\n\n & > svg {\n color: ", ";\n margin-right: 4px;\n }\n"])), function (props) {
25492
+ var VideoTime = styled.div(_templateObject2$o || (_templateObject2$o = _taggedTemplateLiteralLoose(["\n position: absolute;\n top: ", ";\n bottom: ", ";\n left: ", ";\n font-size: ", ";\n display: flex;\n align-items: center;\n border-radius: 16px;\n padding: ", ";\n background-color: ", ";\n line-height: 14px;\n color: ", ";\n z-index: 10;\n\n & > svg {\n color: ", ";\n margin-right: 4px;\n }\n"])), function (props) {
25524
25493
  return props.isRepliedMessage ? '3px' : props.isDetailsView ? undefined : '8px';
25525
25494
  }, function (props) {
25526
25495
  return props.isDetailsView ? '8px' : undefined;
@@ -29409,7 +29378,7 @@ var HiddenMessageTime = styled.span(_templateObject2$u || (_templateObject2$u =
29409
29378
  }, function (props) {
29410
29379
  return props.color;
29411
29380
  });
29412
- var MessageStatusAndTimeContainer = styled.span(_templateObject3$o || (_templateObject3$o = _taggedTemplateLiteralLoose(["\n visibility: ", ";\n display: ", ";\n align-items: flex-end;\n border-radius: 16px;\n padding: ", ";\n background-color: ", ";\n float: right;\n line-height: ", ";\n margin-right: ", ";\n margin-left: ", ";\n margin-bottom: ", ";\n direction: ", ";\n transform: translate(0px, 4px);\n white-space: nowrap;\n width: ", ";\n justify-content: ", ";\n\n & > svg {\n margin-left: 4px;\n height: 14px;\n width: 16px;\n }\n\n & > ", " {\n color: ", ";\n }\n\n ", "\n"])), function (props) {
29381
+ var MessageStatusAndTimeContainer = styled.span(_templateObject3$o || (_templateObject3$o = _taggedTemplateLiteralLoose(["\n visibility: ", ";\n display: ", ";\n align-items: flex-end;\n border-radius: 16px;\n padding: ", ";\n background-color: ", ";\n float: right;\n line-height: ", ";\n margin-right: ", ";\n margin-left: ", ";\n margin-bottom: ", ";\n direction: ", ";\n transform: translate(0px, 4px);\n white-space: nowrap;\n width: ", ";\n justify-content: ", ";\n z-index: 10;\n\n & > svg {\n margin-left: 4px;\n height: 14px;\n width: 16px;\n }\n\n & > ", " {\n color: ", ";\n }\n\n ", "\n"])), function (props) {
29413
29382
  return props.showOnlyOnHover && 'hidden';
29414
29383
  }, function (props) {
29415
29384
  return props.hide ? 'none' : 'flex';
@@ -29434,7 +29403,7 @@ var MessageStatusAndTimeContainer = styled.span(_templateObject3$o || (_template
29434
29403
  }, HiddenMessageTime, function (props) {
29435
29404
  return props.withAttachment ? props.messageTimeColorOnAttachment : '';
29436
29405
  }, function (props) {
29437
- return props.withAttachment && "\n position: absolute;\n z-index: 3;\n right: " + (props.fileAttachment ? '6px' : '10px') + ";\n bottom: " + (props.fileAttachment ? '9px' : '14px') + ";\n ";
29406
+ return props.withAttachment && "\n position: absolute;\n z-index: 10;\n right: " + (props.fileAttachment ? '6px' : '10px') + ";\n bottom: " + (props.fileAttachment ? '9px' : '14px') + ";\n ";
29438
29407
  });
29439
29408
  var MessageStatusUpdated = styled.span(_templateObject4$k || (_templateObject4$k = _taggedTemplateLiteralLoose(["\n margin-right: 4px;\n font-style: italic;\n font-weight: 400;\n font-size: ", ";\n color: ", ";\n"])), function (props) {
29440
29409
  return props.fontSize || '12px';
@@ -34854,7 +34823,7 @@ var SendMessageInput = function SendMessageInput(_ref3) {
34854
34823
  fileChecksum = "" + reader.result;
34855
34824
  }
34856
34825
  return Promise.resolve(hashString(fileChecksum || '')).then(function (checksumHash) {
34857
- function _temp10() {
34826
+ function _temp12() {
34858
34827
  if (dataFromDb) {
34859
34828
  cachedUrl = dataFromDb.url;
34860
34829
  setPendingAttachment(tid, {
@@ -34866,60 +34835,85 @@ var SendMessageInput = function SendMessageInput(_ref3) {
34866
34835
  checksum: checksumHash
34867
34836
  });
34868
34837
  }
34869
- var _temp0 = function () {
34838
+ var _temp10 = function () {
34870
34839
  if (customUploader) {
34871
- if (fileType === 'image') {
34872
- resizeImage(file).then(function (resizedFile) {
34873
- try {
34874
- setAttachments(function (prevState) {
34875
- return [].concat(prevState, [{
34876
- data: file,
34877
- cachedUrl: cachedUrl,
34878
- upload: false,
34879
- type: isMediaAttachment ? fileType : 'file',
34880
- attachmentUrl: URL.createObjectURL(resizedFile.blob),
34881
- tid: tid,
34882
- size: dataFromDb ? dataFromDb.size : file.size,
34883
- metadata: dataFromDb && dataFromDb.metadata
34884
- }]);
34885
- });
34886
- return Promise.resolve();
34887
- } catch (e) {
34888
- return Promise.reject(e);
34889
- }
34890
- });
34891
- } else if (fileType === 'video') {
34892
- setAttachments(function (prevState) {
34893
- return [].concat(prevState, [{
34894
- data: file,
34895
- cachedUrl: cachedUrl,
34896
- upload: false,
34897
- type: isMediaAttachment ? fileType : 'file',
34898
- attachmentUrl: URL.createObjectURL(file),
34899
- tid: tid,
34900
- size: dataFromDb ? dataFromDb.size : file.size,
34901
- metadata: dataFromDb && dataFromDb.metadata
34902
- }]);
34903
- });
34904
- } else {
34905
- setAttachments(function (prevState) {
34906
- return [].concat(prevState, [{
34907
- data: file,
34908
- cachedUrl: cachedUrl,
34909
- upload: false,
34910
- type: 'file',
34911
- tid: tid,
34912
- size: dataFromDb ? dataFromDb.size : file.size,
34913
- metadata: dataFromDb && dataFromDb.metadata
34914
- }]);
34915
- });
34916
- }
34840
+ var _temp2 = function () {
34841
+ if (fileType === 'image') {
34842
+ resizeImage(file).then(function (resizedFile) {
34843
+ try {
34844
+ return Promise.resolve(createImageThumbnail(file)).then(function (_ref4) {
34845
+ var thumbnail = _ref4.thumbnail,
34846
+ imageWidth = _ref4.imageWidth,
34847
+ imageHeight = _ref4.imageHeight;
34848
+ setAttachments(function (prevState) {
34849
+ return [].concat(prevState, [{
34850
+ data: file,
34851
+ cachedUrl: cachedUrl,
34852
+ upload: false,
34853
+ type: isMediaAttachment ? fileType : 'file',
34854
+ attachmentUrl: URL.createObjectURL(resizedFile.blob),
34855
+ tid: tid,
34856
+ size: dataFromDb ? dataFromDb.size : file.size,
34857
+ metadata: _extends({}, dataFromDb && dataFromDb.metadata, {
34858
+ szw: imageWidth,
34859
+ szh: imageHeight,
34860
+ tmb: thumbnail
34861
+ })
34862
+ }]);
34863
+ });
34864
+ });
34865
+ } catch (e) {
34866
+ return Promise.reject(e);
34867
+ }
34868
+ });
34869
+ } else {
34870
+ var _temp13 = function () {
34871
+ if (fileType === 'video') {
34872
+ return Promise.resolve(getFrame(URL.createObjectURL(file), 0)).then(function (_ref5) {
34873
+ var thumb = _ref5.thumb,
34874
+ width = _ref5.width,
34875
+ height = _ref5.height;
34876
+ setAttachments(function (prevState) {
34877
+ return [].concat(prevState, [{
34878
+ data: file,
34879
+ cachedUrl: cachedUrl,
34880
+ upload: false,
34881
+ type: isMediaAttachment ? fileType : 'file',
34882
+ attachmentUrl: URL.createObjectURL(file),
34883
+ tid: tid,
34884
+ size: dataFromDb ? dataFromDb.size : file.size,
34885
+ metadata: _extends({}, dataFromDb && dataFromDb.metadata, {
34886
+ szw: width,
34887
+ szh: height,
34888
+ tmb: thumb
34889
+ })
34890
+ }]);
34891
+ });
34892
+ });
34893
+ } else {
34894
+ setAttachments(function (prevState) {
34895
+ return [].concat(prevState, [{
34896
+ data: file,
34897
+ cachedUrl: cachedUrl,
34898
+ upload: false,
34899
+ type: 'file',
34900
+ tid: tid,
34901
+ size: dataFromDb ? dataFromDb.size : file.size,
34902
+ metadata: dataFromDb && dataFromDb.metadata
34903
+ }]);
34904
+ });
34905
+ }
34906
+ }();
34907
+ if (_temp13 && _temp13.then) return _temp13.then(function () {});
34908
+ }
34909
+ }();
34910
+ if (_temp2 && _temp2.then) return _temp2.then(function () {});
34917
34911
  } else {
34918
- var _temp9 = function () {
34912
+ var _temp1 = function () {
34919
34913
  if (fileType === 'image') {
34920
- var _temp5 = function () {
34914
+ var _temp7 = function () {
34921
34915
  if (isMediaAttachment) {
34922
- var _temp2 = function _temp2() {
34916
+ var _temp4 = function _temp4() {
34923
34917
  if (file.type === 'image/gif') {
34924
34918
  setAttachments(function (prevState) {
34925
34919
  return [].concat(prevState, [{
@@ -34979,23 +34973,23 @@ var SendMessageInput = function SendMessageInput(_ref3) {
34979
34973
  }
34980
34974
  };
34981
34975
  var metas = {};
34982
- var _temp = function () {
34976
+ var _temp3 = function () {
34983
34977
  if (dataFromDb) {
34984
34978
  metas = dataFromDb.metadata;
34985
34979
  } else {
34986
- return Promise.resolve(createImageThumbnail(file)).then(function (_ref4) {
34987
- var thumbnail = _ref4.thumbnail,
34988
- imageWidth = _ref4.imageWidth,
34989
- imageHeight = _ref4.imageHeight;
34980
+ return Promise.resolve(createImageThumbnail(file)).then(function (_ref6) {
34981
+ var thumbnail = _ref6.thumbnail,
34982
+ imageWidth = _ref6.imageWidth,
34983
+ imageHeight = _ref6.imageHeight;
34990
34984
  metas.imageHeight = imageHeight;
34991
34985
  metas.imageWidth = imageWidth;
34992
34986
  metas.thumbnail = thumbnail;
34993
34987
  });
34994
34988
  }
34995
34989
  }();
34996
- return _temp && _temp.then ? _temp.then(_temp2) : _temp2(_temp);
34990
+ return _temp3 && _temp3.then ? _temp3.then(_temp4) : _temp4(_temp3);
34997
34991
  } else {
34998
- var _temp4 = function _temp4() {
34992
+ var _temp6 = function _temp6() {
34999
34993
  setAttachments(function (prevState) {
35000
34994
  return [].concat(prevState, [{
35001
34995
  data: file,
@@ -35012,24 +35006,24 @@ var SendMessageInput = function SendMessageInput(_ref3) {
35012
35006
  });
35013
35007
  };
35014
35008
  var _metas = {};
35015
- var _temp3 = function () {
35009
+ var _temp5 = function () {
35016
35010
  if (dataFromDb) {
35017
35011
  _metas = dataFromDb.metadata;
35018
35012
  } else {
35019
- return Promise.resolve(createImageThumbnail(file, undefined, 50, 50)).then(function (_ref5) {
35020
- var thumbnail = _ref5.thumbnail;
35013
+ return Promise.resolve(createImageThumbnail(file, undefined, 50, 50)).then(function (_ref7) {
35014
+ var thumbnail = _ref7.thumbnail;
35021
35015
  _metas.thumbnail = thumbnail;
35022
35016
  });
35023
35017
  }
35024
35018
  }();
35025
- return _temp3 && _temp3.then ? _temp3.then(_temp4) : _temp4(_temp3);
35019
+ return _temp5 && _temp5.then ? _temp5.then(_temp6) : _temp6(_temp5);
35026
35020
  }
35027
35021
  }();
35028
- if (_temp5 && _temp5.then) return _temp5.then(function () {});
35022
+ if (_temp7 && _temp7.then) return _temp7.then(function () {});
35029
35023
  } else {
35030
- var _temp11 = function () {
35024
+ var _temp14 = function () {
35031
35025
  if (fileType === 'video') {
35032
- var _temp7 = function _temp7() {
35026
+ var _temp9 = function _temp9() {
35033
35027
  setAttachments(function (prevState) {
35034
35028
  return [].concat(prevState, [{
35035
35029
  data: file,
@@ -35044,14 +35038,14 @@ var SendMessageInput = function SendMessageInput(_ref3) {
35044
35038
  });
35045
35039
  };
35046
35040
  var metas = {};
35047
- var _temp6 = function () {
35041
+ var _temp8 = function () {
35048
35042
  if (dataFromDb) {
35049
35043
  metas = dataFromDb.metadata;
35050
35044
  } else {
35051
- return Promise.resolve(getFrame(URL.createObjectURL(file), 0)).then(function (_ref6) {
35052
- var thumb = _ref6.thumb,
35053
- width = _ref6.width,
35054
- height = _ref6.height;
35045
+ return Promise.resolve(getFrame(URL.createObjectURL(file), 0)).then(function (_ref8) {
35046
+ var thumb = _ref8.thumb,
35047
+ width = _ref8.width,
35048
+ height = _ref8.height;
35055
35049
  metas.tmb = thumb;
35056
35050
  metas.width = width;
35057
35051
  metas.height = height;
@@ -35059,7 +35053,7 @@ var SendMessageInput = function SendMessageInput(_ref3) {
35059
35053
  });
35060
35054
  }
35061
35055
  }();
35062
- return _temp6 && _temp6.then ? _temp6.then(_temp7) : _temp7(_temp6);
35056
+ return _temp8 && _temp8.then ? _temp8.then(_temp9) : _temp9(_temp8);
35063
35057
  } else {
35064
35058
  setAttachments(function (prevState) {
35065
35059
  return [].concat(prevState, [{
@@ -35074,23 +35068,23 @@ var SendMessageInput = function SendMessageInput(_ref3) {
35074
35068
  });
35075
35069
  }
35076
35070
  }();
35077
- if (_temp11 && _temp11.then) return _temp11.then(function () {});
35071
+ if (_temp14 && _temp14.then) return _temp14.then(function () {});
35078
35072
  }
35079
35073
  }();
35080
- if (_temp9 && _temp9.then) return _temp9.then(function () {});
35074
+ if (_temp1 && _temp1.then) return _temp1.then(function () {});
35081
35075
  }
35082
35076
  }();
35083
- if (_temp0 && _temp0.then) return _temp0.then(function () {});
35077
+ if (_temp10 && _temp10.then) return _temp10.then(function () {});
35084
35078
  }
35085
35079
  var dataFromDb;
35086
- var _temp1 = _catch(function () {
35080
+ var _temp11 = _catch(function () {
35087
35081
  return Promise.resolve(_getDataFromDB(DB_NAMES.FILES_STORAGE, DB_STORE_NAMES.ATTACHMENTS, checksumHash, 'checksum')).then(function (_getDataFromDB) {
35088
35082
  dataFromDb = _getDataFromDB;
35089
35083
  });
35090
35084
  }, function (e) {
35091
35085
  log.error('error in get data from db . . . . ', e);
35092
35086
  });
35093
- return _temp1 && _temp1.then ? _temp1.then(_temp10) : _temp10(_temp1);
35087
+ return _temp11 && _temp11.then ? _temp11.then(_temp12) : _temp12(_temp11);
35094
35088
  });
35095
35089
  } catch (e) {
35096
35090
  return Promise.reject(e);
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sceyt-chat-react-uikit",
3
- "version": "1.6.8-beta.16",
3
+ "version": "1.6.8-beta.17",
4
4
  "description": "Interactive React UI Components for Sceyt Chat.",
5
5
  "author": "Sceyt",
6
6
  "license": "MIT",