@arcblock/terminal 2.10.0 → 2.10.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.
- package/lib/Player.js +56 -56
- package/package.json +4 -4
- package/src/Player.js +54 -54
package/lib/Player.js
CHANGED
|
@@ -138,6 +138,62 @@ function Player(props) {
|
|
|
138
138
|
});
|
|
139
139
|
}
|
|
140
140
|
};
|
|
141
|
+
const doJump = time => {
|
|
142
|
+
terminal.current.reset();
|
|
143
|
+
const toFrameIndex = (0, _util.findFrameAt)(frames, time);
|
|
144
|
+
for (let i = 0; i < toFrameIndex; i++) {
|
|
145
|
+
renderFrame(i);
|
|
146
|
+
}
|
|
147
|
+
};
|
|
148
|
+
const onJump = e => {
|
|
149
|
+
if (!progress.current || !terminal.current || !state.isStarted) {
|
|
150
|
+
return false;
|
|
151
|
+
}
|
|
152
|
+
const length = progress.current.getBoundingClientRect().width;
|
|
153
|
+
const position = e.nativeEvent.offsetX;
|
|
154
|
+
// console.log('onJump', { length, position, e });
|
|
155
|
+
|
|
156
|
+
const currentTime = Math.floor(totalDuration * position / length);
|
|
157
|
+
dispatch({
|
|
158
|
+
type: 'jump',
|
|
159
|
+
payload: {
|
|
160
|
+
currentTime
|
|
161
|
+
}
|
|
162
|
+
});
|
|
163
|
+
doJump(currentTime);
|
|
164
|
+
emitEvent('onJump');
|
|
165
|
+
return false;
|
|
166
|
+
};
|
|
167
|
+
const onStart = () => {
|
|
168
|
+
if (state.isStarted === false) {
|
|
169
|
+
dispatch({
|
|
170
|
+
type: 'start'
|
|
171
|
+
});
|
|
172
|
+
terminal.current.reset();
|
|
173
|
+
}
|
|
174
|
+
dispatch({
|
|
175
|
+
type: 'play'
|
|
176
|
+
});
|
|
177
|
+
emitEvent('onStart');
|
|
178
|
+
return false;
|
|
179
|
+
};
|
|
180
|
+
const onPause = () => {
|
|
181
|
+
dispatch({
|
|
182
|
+
type: 'pause'
|
|
183
|
+
});
|
|
184
|
+
emitEvent('onPause');
|
|
185
|
+
return false;
|
|
186
|
+
};
|
|
187
|
+
const onPlay = () => {
|
|
188
|
+
if (state.currentFrame === frames.length - 1 && state.currentTime === totalDuration) {
|
|
189
|
+
dispatch({
|
|
190
|
+
type: 'reset'
|
|
191
|
+
});
|
|
192
|
+
terminal.current.reset();
|
|
193
|
+
}
|
|
194
|
+
emitEvent('onPlay');
|
|
195
|
+
return onStart();
|
|
196
|
+
};
|
|
141
197
|
|
|
142
198
|
// Render thumbnailTime
|
|
143
199
|
(0, _react.useEffect)(() => {
|
|
@@ -239,62 +295,6 @@ function Player(props) {
|
|
|
239
295
|
options.frameBox.style.padding = '10px';
|
|
240
296
|
options.frameBox.style.paddingBottom = '40px';
|
|
241
297
|
}
|
|
242
|
-
const doJump = time => {
|
|
243
|
-
terminal.current.reset();
|
|
244
|
-
const toFrameIndex = (0, _util.findFrameAt)(frames, time);
|
|
245
|
-
for (let i = 0; i < toFrameIndex; i++) {
|
|
246
|
-
renderFrame(i);
|
|
247
|
-
}
|
|
248
|
-
};
|
|
249
|
-
const onJump = e => {
|
|
250
|
-
if (!progress.current || !terminal.current || !state.isStarted) {
|
|
251
|
-
return false;
|
|
252
|
-
}
|
|
253
|
-
const length = progress.current.getBoundingClientRect().width;
|
|
254
|
-
const position = e.nativeEvent.offsetX;
|
|
255
|
-
// console.log('onJump', { length, position, e });
|
|
256
|
-
|
|
257
|
-
const currentTime = Math.floor(totalDuration * position / length);
|
|
258
|
-
dispatch({
|
|
259
|
-
type: 'jump',
|
|
260
|
-
payload: {
|
|
261
|
-
currentTime
|
|
262
|
-
}
|
|
263
|
-
});
|
|
264
|
-
doJump(currentTime);
|
|
265
|
-
emitEvent('onJump');
|
|
266
|
-
return false;
|
|
267
|
-
};
|
|
268
|
-
const onStart = () => {
|
|
269
|
-
if (state.isStarted === false) {
|
|
270
|
-
dispatch({
|
|
271
|
-
type: 'start'
|
|
272
|
-
});
|
|
273
|
-
terminal.current.reset();
|
|
274
|
-
}
|
|
275
|
-
dispatch({
|
|
276
|
-
type: 'play'
|
|
277
|
-
});
|
|
278
|
-
emitEvent('onStart');
|
|
279
|
-
return false;
|
|
280
|
-
};
|
|
281
|
-
const onPause = () => {
|
|
282
|
-
dispatch({
|
|
283
|
-
type: 'pause'
|
|
284
|
-
});
|
|
285
|
-
emitEvent('onPause');
|
|
286
|
-
return false;
|
|
287
|
-
};
|
|
288
|
-
const onPlay = () => {
|
|
289
|
-
if (state.currentFrame === frames.length - 1 && state.currentTime === totalDuration) {
|
|
290
|
-
dispatch({
|
|
291
|
-
type: 'reset'
|
|
292
|
-
});
|
|
293
|
-
terminal.current.reset();
|
|
294
|
-
}
|
|
295
|
-
emitEvent('onPlay');
|
|
296
|
-
return onStart();
|
|
297
|
-
};
|
|
298
298
|
return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
|
|
299
299
|
className: (0, _util.getPlayerClass)(options, state),
|
|
300
300
|
ref: container,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@arcblock/terminal",
|
|
3
|
-
"version": "2.10.
|
|
3
|
+
"version": "2.10.2",
|
|
4
4
|
"description": "A react wrapper for xterm allowing you to easily render a terminal in the browser",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"react",
|
|
@@ -46,10 +46,10 @@
|
|
|
46
46
|
"peerDependencies": {
|
|
47
47
|
"react": ">=18.2.0"
|
|
48
48
|
},
|
|
49
|
-
"gitHead": "
|
|
49
|
+
"gitHead": "01c29cd905a2baf029d7be25d41c79a261ebd959",
|
|
50
50
|
"dependencies": {
|
|
51
|
-
"@arcblock/react-hooks": "^2.10.
|
|
52
|
-
"@arcblock/ux": "^2.10.
|
|
51
|
+
"@arcblock/react-hooks": "^2.10.2",
|
|
52
|
+
"@arcblock/ux": "^2.10.2",
|
|
53
53
|
"@emotion/react": "^11.10.4",
|
|
54
54
|
"@emotion/styled": "^11.10.4",
|
|
55
55
|
"ahooks": "^3.7.10",
|
package/src/Player.js
CHANGED
|
@@ -140,6 +140,60 @@ export default function Player(props) {
|
|
|
140
140
|
}
|
|
141
141
|
};
|
|
142
142
|
|
|
143
|
+
const doJump = (time) => {
|
|
144
|
+
terminal.current.reset();
|
|
145
|
+
|
|
146
|
+
const toFrameIndex = findFrameAt(frames, time);
|
|
147
|
+
for (let i = 0; i < toFrameIndex; i++) {
|
|
148
|
+
renderFrame(i);
|
|
149
|
+
}
|
|
150
|
+
};
|
|
151
|
+
|
|
152
|
+
const onJump = (e) => {
|
|
153
|
+
if (!progress.current || !terminal.current || !state.isStarted) {
|
|
154
|
+
return false;
|
|
155
|
+
}
|
|
156
|
+
|
|
157
|
+
const length = progress.current.getBoundingClientRect().width;
|
|
158
|
+
const position = e.nativeEvent.offsetX;
|
|
159
|
+
// console.log('onJump', { length, position, e });
|
|
160
|
+
|
|
161
|
+
const currentTime = Math.floor((totalDuration * position) / length);
|
|
162
|
+
dispatch({ type: 'jump', payload: { currentTime } });
|
|
163
|
+
doJump(currentTime);
|
|
164
|
+
emitEvent('onJump');
|
|
165
|
+
|
|
166
|
+
return false;
|
|
167
|
+
};
|
|
168
|
+
|
|
169
|
+
const onStart = () => {
|
|
170
|
+
if (state.isStarted === false) {
|
|
171
|
+
dispatch({ type: 'start' });
|
|
172
|
+
terminal.current.reset();
|
|
173
|
+
}
|
|
174
|
+
|
|
175
|
+
dispatch({ type: 'play' });
|
|
176
|
+
emitEvent('onStart');
|
|
177
|
+
|
|
178
|
+
return false;
|
|
179
|
+
};
|
|
180
|
+
|
|
181
|
+
const onPause = () => {
|
|
182
|
+
dispatch({ type: 'pause' });
|
|
183
|
+
emitEvent('onPause');
|
|
184
|
+
return false;
|
|
185
|
+
};
|
|
186
|
+
|
|
187
|
+
const onPlay = () => {
|
|
188
|
+
if (state.currentFrame === frames.length - 1 && state.currentTime === totalDuration) {
|
|
189
|
+
dispatch({ type: 'reset' });
|
|
190
|
+
terminal.current.reset();
|
|
191
|
+
}
|
|
192
|
+
|
|
193
|
+
emitEvent('onPlay');
|
|
194
|
+
return onStart();
|
|
195
|
+
};
|
|
196
|
+
|
|
143
197
|
// Render thumbnailTime
|
|
144
198
|
useEffect(() => {
|
|
145
199
|
if (!terminal.current) {
|
|
@@ -235,60 +289,6 @@ export default function Player(props) {
|
|
|
235
289
|
options.frameBox.style.paddingBottom = '40px';
|
|
236
290
|
}
|
|
237
291
|
|
|
238
|
-
const doJump = (time) => {
|
|
239
|
-
terminal.current.reset();
|
|
240
|
-
|
|
241
|
-
const toFrameIndex = findFrameAt(frames, time);
|
|
242
|
-
for (let i = 0; i < toFrameIndex; i++) {
|
|
243
|
-
renderFrame(i);
|
|
244
|
-
}
|
|
245
|
-
};
|
|
246
|
-
|
|
247
|
-
const onJump = (e) => {
|
|
248
|
-
if (!progress.current || !terminal.current || !state.isStarted) {
|
|
249
|
-
return false;
|
|
250
|
-
}
|
|
251
|
-
|
|
252
|
-
const length = progress.current.getBoundingClientRect().width;
|
|
253
|
-
const position = e.nativeEvent.offsetX;
|
|
254
|
-
// console.log('onJump', { length, position, e });
|
|
255
|
-
|
|
256
|
-
const currentTime = Math.floor((totalDuration * position) / length);
|
|
257
|
-
dispatch({ type: 'jump', payload: { currentTime } });
|
|
258
|
-
doJump(currentTime);
|
|
259
|
-
emitEvent('onJump');
|
|
260
|
-
|
|
261
|
-
return false;
|
|
262
|
-
};
|
|
263
|
-
|
|
264
|
-
const onStart = () => {
|
|
265
|
-
if (state.isStarted === false) {
|
|
266
|
-
dispatch({ type: 'start' });
|
|
267
|
-
terminal.current.reset();
|
|
268
|
-
}
|
|
269
|
-
|
|
270
|
-
dispatch({ type: 'play' });
|
|
271
|
-
emitEvent('onStart');
|
|
272
|
-
|
|
273
|
-
return false;
|
|
274
|
-
};
|
|
275
|
-
|
|
276
|
-
const onPause = () => {
|
|
277
|
-
dispatch({ type: 'pause' });
|
|
278
|
-
emitEvent('onPause');
|
|
279
|
-
return false;
|
|
280
|
-
};
|
|
281
|
-
|
|
282
|
-
const onPlay = () => {
|
|
283
|
-
if (state.currentFrame === frames.length - 1 && state.currentTime === totalDuration) {
|
|
284
|
-
dispatch({ type: 'reset' });
|
|
285
|
-
terminal.current.reset();
|
|
286
|
-
}
|
|
287
|
-
|
|
288
|
-
emitEvent('onPlay');
|
|
289
|
-
return onStart();
|
|
290
|
-
};
|
|
291
|
-
|
|
292
292
|
return (
|
|
293
293
|
<div className={getPlayerClass(options, state)} ref={container}>
|
|
294
294
|
<div className="cover" onClick={onStart} />
|