import React from 'react';
import PropTypes from 'prop-types';
import msgpack5 from 'msgpack5';


/*
config = {
    peakDetector: 'simple',
    peakDetectorConfig: {'threshold': 3000},
    
    deviceUrl: 'http://smartswim',
    peaksPerLap: 30,
    forceAverage
}
*/

class DeviceHttpDataSource extends React.Component {

    constructor(props) {
        super(props);
        this.data = [];
        this.dataUrl = new URL("/api/session/data", this.props.deviceUrl);

        // msgpack setup
        this.msgpack = msgpack5();
        this.msgpack.registerDecoder(205, function (byteArr) {
            const buffer = byteArr.buffer.slice(byteArr.byteOffset, byteArr.byteLength + byteArr.byteOffset);
            return new Int16Array(buffer);
        });

        this.fetchDataHttp = this.fetchDataHttp.bind(this);
    }

    async fetchDataHttp() {
        this.dataUrl.searchParams.set("startIdx", this.data.length);
        const response = await fetch(this.dataUrl);
        const arrayBuffer = await response.arrayBuffer();
        const decoded = this.msgpack.decode(arrayBuffer);
        const typedValueArr = decoded['values'];
        console.log("new data inside fetch", typedValueArr);
        const newDataStart = this.data.length;
        for (let i = 0; i < typedValueArr.length; ++i) {
            this.data.push(typedValueArr[i]);
        }
        this.props.onNewData(this.data, newDataStart);
    }

    componentDidMount() {
        this.timer = setInterval(this.fetchDataHttp, this.props.pollInterval);
    }

    componentWillUnmount() {
        clearInterval(this.timer);
        this.timer = null;
    }

    render() {
        return "";
    }
}


DeviceHttpDataSource.propTypes = {
    deviceUrl: PropTypes.string.isRequired,
    onNewData: PropTypes.func.isRequired,
    pollInterval: PropTypes.number // poll interval in ms
};

DeviceHttpDataSource.defaultProps = {
    pollInterval: 20000
};

export default DeviceHttpDataSource;