Spaces:
Running
Running
File size: 2,728 Bytes
f2bee8a |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 |
import React from 'react';
import PropTypes from 'prop-types';
import bindAll from 'lodash.bindall';
import AudioTrimmerComponent from '../components/audio-trimmer/audio-trimmer.jsx';
import DragRecognizer from '../lib/drag-recognizer';
const MIN_LENGTH = 0.01; // Used to stop sounds being trimmed smaller than 1%
class AudioTrimmer extends React.Component {
constructor (props) {
super(props);
bindAll(this, [
'handleTrimStartMouseDown',
'handleTrimEndMouseDown',
'handleTrimStartMouseMove',
'handleTrimEndMouseMove',
'storeRef'
]);
this.trimStartDragRecognizer = new DragRecognizer({
onDrag: this.handleTrimStartMouseMove,
touchDragAngle: 90,
distanceThreshold: 0
});
this.trimEndDragRecognizer = new DragRecognizer({
onDrag: this.handleTrimEndMouseMove,
touchDragAngle: 90,
distanceThreshold: 0
});
}
handleTrimStartMouseMove (currentOffset, initialOffset) {
const dx = (currentOffset.x - initialOffset.x) / this.containerSize;
const newTrim = Math.max(0, Math.min(this.props.trimEnd - MIN_LENGTH, this.initialTrim + dx));
this.props.onSetTrimStart(newTrim);
}
handleTrimEndMouseMove (currentOffset, initialOffset) {
const dx = (currentOffset.x - initialOffset.x) / this.containerSize;
const newTrim = Math.min(1, Math.max(this.props.trimStart + MIN_LENGTH, this.initialTrim + dx));
this.props.onSetTrimEnd(newTrim);
}
handleTrimStartMouseDown (e) {
this.containerSize = this.containerElement.getBoundingClientRect().width;
this.trimStartDragRecognizer.start(e);
this.initialTrim = this.props.trimStart;
}
handleTrimEndMouseDown (e) {
this.containerSize = this.containerElement.getBoundingClientRect().width;
this.trimEndDragRecognizer.start(e);
this.initialTrim = this.props.trimEnd;
}
storeRef (el) {
this.containerElement = el;
}
render () {
return (
<AudioTrimmerComponent
containerRef={this.storeRef}
playhead={this.props.playhead}
trimEnd={this.props.trimEnd}
trimStart={this.props.trimStart}
onTrimEndMouseDown={this.handleTrimEndMouseDown}
onTrimStartMouseDown={this.handleTrimStartMouseDown}
/>
);
}
}
AudioTrimmer.propTypes = {
onSetTrimEnd: PropTypes.func,
onSetTrimStart: PropTypes.func,
playhead: PropTypes.number,
trimEnd: PropTypes.number,
trimStart: PropTypes.number
};
export default AudioTrimmer;
|