@chayns/react-audio-editor/lib/components/editor/cutterControl/CutterControl.js

Tool to edit audio tracks.

'use strict';

Object.defineProperty(exports, "__esModule", {
    value: true
});

var _getPrototypeOf = require('babel-runtime/core-js/object/get-prototype-of');

var _getPrototypeOf2 = _interopRequireDefault(_getPrototypeOf);

var _classCallCheck2 = require('babel-runtime/helpers/classCallCheck');

var _classCallCheck3 = _interopRequireDefault(_classCallCheck2);

var _createClass2 = require('babel-runtime/helpers/createClass');

var _createClass3 = _interopRequireDefault(_createClass2);

var _possibleConstructorReturn2 = require('babel-runtime/helpers/possibleConstructorReturn');

var _possibleConstructorReturn3 = _interopRequireDefault(_possibleConstructorReturn2);

var _inherits2 = require('babel-runtime/helpers/inherits');

var _inherits3 = _interopRequireDefault(_inherits2);

var _extends2 = require('babel-runtime/helpers/extends');

var _extends3 = _interopRequireDefault(_extends2);

var _class, _temp;

exports.default = withContext;

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _propTypes = require('prop-types');

var _propTypes2 = _interopRequireDefault(_propTypes);

require('./CutterControl.css');

var _Slider = require('chayns-components/lib/react-chayns-slider/component/Slider');

var _Slider2 = _interopRequireDefault(_Slider);

var _TrackContext = require('../../../context/TrackContext');

var _TrackContext2 = _interopRequireDefault(_TrackContext);

var _Track = require('../../../utils/Track');

var _Track2 = _interopRequireDefault(_Track);

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

/** HOC to get the track instance */
function withContext(props) {
    return _react2.default.createElement(
        _TrackContext2.default.Consumer,
        null,
        function (context) {
            return _react2.default.createElement(CutterControl, (0, _extends3.default)({ track: context }, props));
        }
    );
}

var CutterControl = (_temp = _class = function (_PureComponent) {
    (0, _inherits3.default)(CutterControl, _PureComponent);

    function CutterControl(props) {
        (0, _classCallCheck3.default)(this, CutterControl);

        var _this = (0, _possibleConstructorReturn3.default)(this, (CutterControl.__proto__ || (0, _getPrototypeOf2.default)(CutterControl)).call(this, props));

        _this.sliderOnChange = function (startValue, endValue) {
            var track = _this.props.track;

            _this.setState({ start: startValue, end: endValue }); // set cut position locally
            track.cut(startValue, endValue); // set cut position in track instance
        };

        _this.state = { start: 0, end: 100 };
        _this.rgba = chayns.env.site.colorMode === 1 ? 'rgba(0,0,0,0.8)' : 'rgba(255,255,255,0.8)';
        return _this;
    }

    (0, _createClass3.default)(CutterControl, [{
        key: 'render',
        value: function render() {
            var _state = this.state,
                start = _state.start,
                end = _state.end;

            return _react2.default.createElement(
                'div',
                { className: 'cutter-control' },
                _react2.default.createElement('div', { className: 'cutter-control__borders' }),
                _react2.default.createElement('div', {
                    className: 'cutter-control__background',
                    style: { background: 'linear-gradient(90deg, ' + this.rgba + ' ' + start + '%, transparent ' + start + '%, transparent ' + end + '%, ' + this.rgba + ' ' + end + '%)' }
                }),
                _react2.default.createElement(_Slider2.default, {
                    interval: true,
                    className: 'cutter-control__slider',
                    min: 0,
                    max: 100,
                    defaultStartValue: 0,
                    defaultEndValue: 100,
                    minInterval: 5,
                    onChange: this.sliderOnChange
                })
            );
        }
    }]);
    return CutterControl;
}(_react.PureComponent), _class.propTypes = {
    track: _propTypes2.default.instanceOf(_Track2.default).isRequired
}, _class.defaultProps = {}, _temp);
module.exports = exports.default;