sense-react-timeline-editor 1.0.18 → 1.0.20

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 (5) hide show
  1. package/dist/components/edit_area/edit_area.d.ts +14 -4
  2. package/dist/components/edit_area/edit_row.d.ts +8 -2
  3. package/dist/index.esm.js +56 -12
  4. package/dist/index.js +56 -12
  5. package/package.json +1 -1
package/dist/components/edit_area/edit_area.d.ts CHANGED
@@ -16,15 +16,20 @@ export declare type EditAreaProps = CommonProp & {
16
16
  onScroll: (params: OnScrollParams) => void;
17
17
  /** 设置编辑器数据 */
18
18
  setEditorData: (params: TimelineRow[]) => void;
19
- /** 设置scroll left */
19
+ /** 设置 scroll left */
20
20
  deltaScrollLeft: (scrollLeft: number) => void;
21
+ /** 设置光标位置 */
22
+ setCursor: (param: {
23
+ left?: number;
24
+ time?: number;
25
+ }) => void;
21
26
  /** 是否可以上传 */
22
27
  canUpload?: boolean;
23
28
  /** 自定义上传请求 */
24
29
  customRequest?: UploadProps['customRequest'];
25
30
  /** 允许拖拽创建新轨道 */
26
31
  allowCreateTrack?: boolean;
27
- /** time-editor-container的ref引用 */
32
+ /** time-editor-container 的 ref 引用 */
28
33
  containerRef?: React.MutableRefObject<HTMLDivElement>;
29
34
  engineRef?: React.MutableRefObject<ITimelineEngine>;
30
35
  /** 最小高度 */
@@ -45,15 +50,20 @@ export declare const EditArea: React.MemoExoticComponent<React.ForwardRefExoticC
45
50
  onScroll: (params: OnScrollParams) => void;
46
51
  /** 设置编辑器数据 */
47
52
  setEditorData: (params: TimelineRow[]) => void;
48
- /** 设置scroll left */
53
+ /** 设置 scroll left */
49
54
  deltaScrollLeft: (scrollLeft: number) => void;
55
+ /** 设置光标位置 */
56
+ setCursor: (param: {
57
+ left?: number;
58
+ time?: number;
59
+ }) => void;
50
60
  /** 是否可以上传 */
51
61
  canUpload?: boolean;
52
62
  /** 自定义上传请求 */
53
63
  customRequest?: UploadProps['customRequest'];
54
64
  /** 允许拖拽创建新轨道 */
55
65
  allowCreateTrack?: boolean;
56
- /** time-editor-container的ref引用 */
66
+ /** time-editor-container 的 ref 引用 */
57
67
  containerRef?: React.MutableRefObject<HTMLDivElement>;
58
68
  engineRef?: React.MutableRefObject<ITimelineEngine>;
59
69
  /** 最小高度 */
package/dist/components/edit_area/edit_row.d.ts CHANGED
@@ -11,7 +11,7 @@ export declare type EditRowProps = CommonProp & {
11
11
  setEditorData: (params: TimelineRow[]) => void;
12
12
  /** 距离左侧滚动距离 */
13
13
  scrollLeft: number;
14
- /** 设置scroll left */
14
+ /** 设置 scroll left */
15
15
  deltaScrollLeft: (scrollLeft: number) => void;
16
16
  /** 允许拖拽创建新轨道 */
17
17
  allowCreateTrack?: boolean;
@@ -20,9 +20,15 @@ export declare type EditRowProps = CommonProp & {
20
20
  position: 'before' | 'after';
21
21
  rowIndex: number;
22
22
  } | null) => void;
23
- /** time-editor-container的ref引用 */
23
+ /** time-editor-container 的 ref 引用 */
24
24
  containerRef?: React.MutableRefObject<HTMLDivElement>;
25
25
  /** 选中的 action IDs */
26
26
  selectedActionIds?: string[];
27
+ /** 设置光标位置 */
28
+ setCursor?: (param: {
29
+ left?: number;
30
+ time?: number;
31
+ }) => void;
32
+ uploadBgMusic?: (file: File[]) => void;
27
33
  };
28
34
  export declare const EditRow: FC<EditRowProps>;
package/dist/index.esm.js CHANGED
@@ -721,7 +721,7 @@ var TimelineEngine = /*#__PURE__*/function (_Emitter) {
721
721
  while (this._actionSortIds[this._next]) {
722
722
  var actionId = this._actionSortIds[this._next];
723
723
  var action = this._actionMap[actionId];
724
- if (!action.disable) {
724
+ if (!action.disable && !action.is_disabled) {
725
725
  // 判断动作开始时间是否到达
726
726
  if (action.start > time) break;
727
727
  // 动作可以执行开始
@@ -2918,7 +2918,10 @@ var EditRow = function EditRow(props) {
2918
2918
  allowCreateTrack = props.allowCreateTrack,
2919
2919
  containerRef = props.containerRef,
2920
2920
  _props$selectedAction = props.selectedActionIds,
2921
- selectedActionIds = _props$selectedAction === void 0 ? [] : _props$selectedAction;
2921
+ selectedActionIds = _props$selectedAction === void 0 ? [] : _props$selectedAction,
2922
+ setCursor = props.setCursor,
2923
+ hideCursor = props.hideCursor,
2924
+ uploadBgMusic = props.uploadBgMusic;
2922
2925
  var classNames = ['edit-row'];
2923
2926
  if (rowData === null || rowData === void 0 ? void 0 : rowData.selected) classNames.push('selected');
2924
2927
  var handleTime = function handleTime(e) {
@@ -2938,14 +2941,34 @@ var EditRow = function EditRow(props) {
2938
2941
  style: style,
2939
2942
  "data-row-id": rowData === null || rowData === void 0 ? void 0 : rowData.id,
2940
2943
  "data-y": "0",
2944
+ onDragOver: function onDragOver(e) {
2945
+ e.preventDefault();
2946
+ e.stopPropagation();
2947
+ },
2948
+ onDrop: function onDrop(e) {
2949
+ e.preventDefault();
2950
+ e.stopPropagation();
2951
+ if (rowData.canUpload) {
2952
+ var files = e.dataTransfer.files;
2953
+ uploadBgMusic === null || uploadBgMusic === void 0 ? void 0 : uploadBgMusic(Array.from(files));
2954
+ }
2955
+ },
2941
2956
  onClick: function onClick(e) {
2957
+ var _e$target;
2958
+ var action = (_e$target = e.target) === null || _e$target === void 0 ? void 0 : _e$target.closest('.timeline-editor-action');
2959
+ var time = handleTime(e);
2942
2960
  if (rowData && onClickRow) {
2943
- var time = handleTime(e);
2944
2961
  onClickRow(e, {
2945
2962
  row: rowData,
2946
2963
  time: time
2947
2964
  });
2948
2965
  }
2966
+ if (hideCursor) return;
2967
+ if (setCursor && !action) {
2968
+ setCursor({
2969
+ time: time
2970
+ });
2971
+ }
2949
2972
  },
2950
2973
  onDoubleClick: function onDoubleClick(e) {
2951
2974
  if (rowData && onDoubleClickRow) {
@@ -3707,6 +3730,7 @@ var EditAreaO = /*#__PURE__*/React.forwardRef(function (props, ref) {
3707
3730
  canUpload = _props$canUpload === void 0 ? false : _props$canUpload,
3708
3731
  customRequest = props.customRequest,
3709
3732
  setEditorData = props.setEditorData,
3733
+ setCursor = props.setCursor,
3710
3734
  _props$allowCreateTra = props.allowCreateTrack,
3711
3735
  allowCreateTrack = _props$allowCreateTra === void 0 ? true : _props$allowCreateTra,
3712
3736
  containerRef = props.containerRef,
@@ -3962,8 +3986,24 @@ var EditAreaO = /*#__PURE__*/React.forwardRef(function (props, ref) {
3962
3986
  key = _ref2.key,
3963
3987
  style = _ref2.style;
3964
3988
  var row = editorData[rowIndex]; // 行数据
3989
+ var uploadBgMusic = function uploadBgMusic(file) {
3990
+ var canUpload = onBeforeUpload === null || onBeforeUpload === void 0 ? void 0 : onBeforeUpload(file[0]);
3991
+ if (!canUpload) return;
3992
+ var onSuccess = handleUploadChange(row);
3993
+ customRequest === null || customRequest === void 0 ? void 0 : customRequest({
3994
+ file: file[0],
3995
+ onSuccess: onSuccess,
3996
+ method: 'POST',
3997
+ action: 'bgm',
3998
+ onError: function onError(err) {
3999
+ console.error('Upload error:', err);
4000
+ }
4001
+ });
4002
+ };
3965
4003
  var editRow = /*#__PURE__*/React.createElement(EditRow, _objectSpread2(_objectSpread2({}, props), {}, {
4004
+ uploadBgMusic: uploadBgMusic,
3966
4005
  style: _objectSpread2(_objectSpread2({}, style), {}, {
4006
+ zIndex: rowIndex + 10,
3967
4007
  backgroundPositionX: "0, ".concat(startLeft, "px"),
3968
4008
  backgroundSize: "".concat(startLeft, "px, ").concat(scaleWidth, "px")
3969
4009
  }),
@@ -3976,6 +4016,7 @@ var EditAreaO = /*#__PURE__*/React.forwardRef(function (props, ref) {
3976
4016
  setDropPreview: setDropPreview,
3977
4017
  containerRef: containerRef,
3978
4018
  selectedActionIds: selectedActionIds,
4019
+ setCursor: setCursor,
3979
4020
  onActionMoveStart: function onActionMoveStart(data) {
3980
4021
  handleInitDragLine(data);
3981
4022
  onDragStart({
@@ -4033,26 +4074,27 @@ var EditAreaO = /*#__PURE__*/React.forwardRef(function (props, ref) {
4033
4074
  }
4034
4075
  }));
4035
4076
  if (!!row && (canUpload || (row === null || row === void 0 ? void 0 : row.canUpload))) {
4036
- var _row$actions;
4037
- return /*#__PURE__*/React.createElement(Upload, {
4077
+ var _row$actions, _row$actions$, _row$actions2;
4078
+ var isDefaultMusic = ((_row$actions = row.actions) === null || _row$actions === void 0 ? void 0 : (_row$actions$ = _row$actions[0]) === null || _row$actions$ === void 0 ? void 0 : _row$actions$.id) === 'upload-bg-music';
4079
+ var tChildren = isDefaultMusic ? editRow : null;
4080
+ return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(Upload, {
4038
4081
  ref: uploadRef,
4039
4082
  key: key + 'upload',
4040
- style: _objectSpread2(_objectSpread2({
4083
+ style: _objectSpread2({
4041
4084
  width: '100%',
4042
- display: 'block'
4043
- }, style), {}, {
4044
- top: 0
4045
- }),
4085
+ display: 'block',
4086
+ position: 'relative'
4087
+ }, style),
4046
4088
  beforeUpload: onBeforeUpload,
4047
4089
  onChange: handleUploadChange(row),
4048
4090
  showUploadList: false,
4049
- openFileDialogOnClick: ((_row$actions = row.actions) === null || _row$actions === void 0 ? void 0 : _row$actions.filter(function (item) {
4091
+ openFileDialogOnClick: ((_row$actions2 = row.actions) === null || _row$actions2 === void 0 ? void 0 : _row$actions2.filter(function (item) {
4050
4092
  return item.effectId === 'effect2';
4051
4093
  }).length) > 0,
4052
4094
  customRequest: customRequest,
4053
4095
  onDrop: handleDrop,
4054
4096
  type: "drag"
4055
- }, editRow);
4097
+ }, tChildren), tChildren ? null : editRow);
4056
4098
  }
4057
4099
  return editRow;
4058
4100
  };
@@ -4533,6 +4575,7 @@ var Timeline = /*#__PURE__*/React.forwardRef(function (props, ref) {
4533
4575
  scrollLeft: scrollLeft,
4534
4576
  engineRef: engineRef,
4535
4577
  setEditorData: handleEditorDataChange,
4578
+ setCursor: handleSetCursor,
4536
4579
  deltaScrollLeft: autoScroll && handleDeltaScrollLeft,
4537
4580
  allowCreateTrack: allowCreateTrack,
4538
4581
  onMutiSelectChange: props === null || props === void 0 ? void 0 : props.onMutiSelectChange,
@@ -4585,6 +4628,7 @@ var Timeline = /*#__PURE__*/React.forwardRef(function (props, ref) {
4585
4628
  scrollTop: scrollTop,
4586
4629
  scrollLeft: scrollLeft,
4587
4630
  setEditorData: handleGroupDataChange,
4631
+ setCursor: handleSetCursor,
4588
4632
  deltaScrollLeft: autoScroll && handleDeltaScrollLeft,
4589
4633
  allowCreateTrack: allowCreateTrack,
4590
4634
  minHeight: index === 0 ? undefined : _totalHeight,
package/dist/index.js CHANGED
@@ -730,7 +730,7 @@ var TimelineEngine = /*#__PURE__*/function (_Emitter) {
730
730
  while (this._actionSortIds[this._next]) {
731
731
  var actionId = this._actionSortIds[this._next];
732
732
  var action = this._actionMap[actionId];
733
- if (!action.disable) {
733
+ if (!action.disable && !action.is_disabled) {
734
734
  // 判断动作开始时间是否到达
735
735
  if (action.start > time) break;
736
736
  // 动作可以执行开始
@@ -2927,7 +2927,10 @@ var EditRow = function EditRow(props) {
2927
2927
  allowCreateTrack = props.allowCreateTrack,
2928
2928
  containerRef = props.containerRef,
2929
2929
  _props$selectedAction = props.selectedActionIds,
2930
- selectedActionIds = _props$selectedAction === void 0 ? [] : _props$selectedAction;
2930
+ selectedActionIds = _props$selectedAction === void 0 ? [] : _props$selectedAction,
2931
+ setCursor = props.setCursor,
2932
+ hideCursor = props.hideCursor,
2933
+ uploadBgMusic = props.uploadBgMusic;
2931
2934
  var classNames = ['edit-row'];
2932
2935
  if (rowData === null || rowData === void 0 ? void 0 : rowData.selected) classNames.push('selected');
2933
2936
  var handleTime = function handleTime(e) {
@@ -2947,14 +2950,34 @@ var EditRow = function EditRow(props) {
2947
2950
  style: style,
2948
2951
  "data-row-id": rowData === null || rowData === void 0 ? void 0 : rowData.id,
2949
2952
  "data-y": "0",
2953
+ onDragOver: function onDragOver(e) {
2954
+ e.preventDefault();
2955
+ e.stopPropagation();
2956
+ },
2957
+ onDrop: function onDrop(e) {
2958
+ e.preventDefault();
2959
+ e.stopPropagation();
2960
+ if (rowData.canUpload) {
2961
+ var files = e.dataTransfer.files;
2962
+ uploadBgMusic === null || uploadBgMusic === void 0 ? void 0 : uploadBgMusic(Array.from(files));
2963
+ }
2964
+ },
2950
2965
  onClick: function onClick(e) {
2966
+ var _e$target;
2967
+ var action = (_e$target = e.target) === null || _e$target === void 0 ? void 0 : _e$target.closest('.timeline-editor-action');
2968
+ var time = handleTime(e);
2951
2969
  if (rowData && onClickRow) {
2952
- var time = handleTime(e);
2953
2970
  onClickRow(e, {
2954
2971
  row: rowData,
2955
2972
  time: time
2956
2973
  });
2957
2974
  }
2975
+ if (hideCursor) return;
2976
+ if (setCursor && !action) {
2977
+ setCursor({
2978
+ time: time
2979
+ });
2980
+ }
2958
2981
  },
2959
2982
  onDoubleClick: function onDoubleClick(e) {
2960
2983
  if (rowData && onDoubleClickRow) {
@@ -3716,6 +3739,7 @@ var EditAreaO = /*#__PURE__*/React__default['default'].forwardRef(function (prop
3716
3739
  canUpload = _props$canUpload === void 0 ? false : _props$canUpload,
3717
3740
  customRequest = props.customRequest,
3718
3741
  setEditorData = props.setEditorData,
3742
+ setCursor = props.setCursor,
3719
3743
  _props$allowCreateTra = props.allowCreateTrack,
3720
3744
  allowCreateTrack = _props$allowCreateTra === void 0 ? true : _props$allowCreateTra,
3721
3745
  containerRef = props.containerRef,
@@ -3971,8 +3995,24 @@ var EditAreaO = /*#__PURE__*/React__default['default'].forwardRef(function (prop
3971
3995
  key = _ref2.key,
3972
3996
  style = _ref2.style;
3973
3997
  var row = editorData[rowIndex]; // 行数据
3998
+ var uploadBgMusic = function uploadBgMusic(file) {
3999
+ var canUpload = onBeforeUpload === null || onBeforeUpload === void 0 ? void 0 : onBeforeUpload(file[0]);
4000
+ if (!canUpload) return;
4001
+ var onSuccess = handleUploadChange(row);
4002
+ customRequest === null || customRequest === void 0 ? void 0 : customRequest({
4003
+ file: file[0],
4004
+ onSuccess: onSuccess,
4005
+ method: 'POST',
4006
+ action: 'bgm',
4007
+ onError: function onError(err) {
4008
+ console.error('Upload error:', err);
4009
+ }
4010
+ });
4011
+ };
3974
4012
  var editRow = /*#__PURE__*/React__default['default'].createElement(EditRow, _objectSpread2(_objectSpread2({}, props), {}, {
4013
+ uploadBgMusic: uploadBgMusic,
3975
4014
  style: _objectSpread2(_objectSpread2({}, style), {}, {
4015
+ zIndex: rowIndex + 10,
3976
4016
  backgroundPositionX: "0, ".concat(startLeft, "px"),
3977
4017
  backgroundSize: "".concat(startLeft, "px, ").concat(scaleWidth, "px")
3978
4018
  }),
@@ -3985,6 +4025,7 @@ var EditAreaO = /*#__PURE__*/React__default['default'].forwardRef(function (prop
3985
4025
  setDropPreview: setDropPreview,
3986
4026
  containerRef: containerRef,
3987
4027
  selectedActionIds: selectedActionIds,
4028
+ setCursor: setCursor,
3988
4029
  onActionMoveStart: function onActionMoveStart(data) {
3989
4030
  handleInitDragLine(data);
3990
4031
  onDragStart({
@@ -4042,26 +4083,27 @@ var EditAreaO = /*#__PURE__*/React__default['default'].forwardRef(function (prop
4042
4083
  }
4043
4084
  }));
4044
4085
  if (!!row && (canUpload || (row === null || row === void 0 ? void 0 : row.canUpload))) {
4045
- var _row$actions;
4046
- return /*#__PURE__*/React__default['default'].createElement(es.Upload, {
4086
+ var _row$actions, _row$actions$, _row$actions2;
4087
+ var isDefaultMusic = ((_row$actions = row.actions) === null || _row$actions === void 0 ? void 0 : (_row$actions$ = _row$actions[0]) === null || _row$actions$ === void 0 ? void 0 : _row$actions$.id) === 'upload-bg-music';
4088
+ var tChildren = isDefaultMusic ? editRow : null;
4089
+ return /*#__PURE__*/React__default['default'].createElement(React__default['default'].Fragment, null, /*#__PURE__*/React__default['default'].createElement(es.Upload, {
4047
4090
  ref: uploadRef,
4048
4091
  key: key + 'upload',
4049
- style: _objectSpread2(_objectSpread2({
4092
+ style: _objectSpread2({
4050
4093
  width: '100%',
4051
- display: 'block'
4052
- }, style), {}, {
4053
- top: 0
4054
- }),
4094
+ display: 'block',
4095
+ position: 'relative'
4096
+ }, style),
4055
4097
  beforeUpload: onBeforeUpload,
4056
4098
  onChange: handleUploadChange(row),
4057
4099
  showUploadList: false,
4058
- openFileDialogOnClick: ((_row$actions = row.actions) === null || _row$actions === void 0 ? void 0 : _row$actions.filter(function (item) {
4100
+ openFileDialogOnClick: ((_row$actions2 = row.actions) === null || _row$actions2 === void 0 ? void 0 : _row$actions2.filter(function (item) {
4059
4101
  return item.effectId === 'effect2';
4060
4102
  }).length) > 0,
4061
4103
  customRequest: customRequest,
4062
4104
  onDrop: handleDrop,
4063
4105
  type: "drag"
4064
- }, editRow);
4106
+ }, tChildren), tChildren ? null : editRow);
4065
4107
  }
4066
4108
  return editRow;
4067
4109
  };
@@ -4542,6 +4584,7 @@ var Timeline = /*#__PURE__*/React__default['default'].forwardRef(function (props
4542
4584
  scrollLeft: scrollLeft,
4543
4585
  engineRef: engineRef,
4544
4586
  setEditorData: handleEditorDataChange,
4587
+ setCursor: handleSetCursor,
4545
4588
  deltaScrollLeft: autoScroll && handleDeltaScrollLeft,
4546
4589
  allowCreateTrack: allowCreateTrack,
4547
4590
  onMutiSelectChange: props === null || props === void 0 ? void 0 : props.onMutiSelectChange,
@@ -4594,6 +4637,7 @@ var Timeline = /*#__PURE__*/React__default['default'].forwardRef(function (props
4594
4637
  scrollTop: scrollTop,
4595
4638
  scrollLeft: scrollLeft,
4596
4639
  setEditorData: handleGroupDataChange,
4640
+ setCursor: handleSetCursor,
4597
4641
  deltaScrollLeft: autoScroll && handleDeltaScrollLeft,
4598
4642
  allowCreateTrack: allowCreateTrack,
4599
4643
  minHeight: index === 0 ? undefined : _totalHeight,
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sense-react-timeline-editor",
3
- "version": "1.0.18",
3
+ "version": "1.0.20",
4
4
  "author": "xzdarcy",
5
5
  "license": "MIT",
6
6
  "keywords": [