@lls/lls-audio 0.0.59 → 0.0.61

package/{recorder/AsyncLoader.js → stories/visualizer.js}

@@ -10,75 +10,68 @@ var _react = require('react');
 
 var _react2 = _interopRequireDefault(_react);
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+var _player = require('../player');
 
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+var _player2 = _interopRequireDefault(_player);
 
-function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+var _recorder = require('../recorder');
 
-function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+var _recorder2 = _interopRequireDefault(_recorder);
+
+var _Visualizer = require('../recorder/Visualizer');
 
-var loadedScripts = [];
+var _Visualizer2 = _interopRequireDefault(_Visualizer);
 
-var getCssEl = function getCssEl(_ref) {
-  var href = _ref.href;
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-  var link = document.createElement('link');
-  link.rel = 'stylesheet';
-  link.type = 'text/css';
-  link.href = href;
-  link.media = 'all';
-  return link;
-};
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 
-var getScriptEl = function getScriptEl(_ref2) {
-  var src = _ref2.src,
-      onload = _ref2.onload,
-      onError = _ref2.onError;
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
 
-  var script = document.createElement('script');
-  script.type = 'text/javascript';
-  script.src = src;
-  script.async = false;
-  script.onload = onload;
-  script.onerror = onError;
-  return script;
-};
+var VisualizerExample = function (_Component) {
+  _inherits(VisualizerExample, _Component);
 
-var AsyncLoader = function (_Component) {
-  _inherits(AsyncLoader, _Component);
+  function VisualizerExample(props) {
+    _classCallCheck(this, VisualizerExample);
 
-  function AsyncLoader() {
-    _classCallCheck(this, AsyncLoader);
+    var _this = _possibleConstructorReturn(this, (VisualizerExample.__proto__ || Object.getPrototypeOf(VisualizerExample)).call(this, props));
 
-    return _possibleConstructorReturn(this, (AsyncLoader.__proto__ || Object.getPrototypeOf(AsyncLoader)).apply(this, arguments));
+    _this.state = {
+      volume: 0
+    };
+    _this.setVolume = _this.setVolume.bind(_this);
+    return _this;
   }
 
-  _createClass(AsyncLoader, [{
-    key: 'componentDidMount',
-    value: function componentDidMount() {
-      var _props = this.props,
-          src = _props.src,
-          href = _props.href,
-          _props$onLoad = _props.onLoad,
-          onLoad = _props$onLoad === undefined ? function () {} : _props$onLoad,
-          _props$onError = _props.onError,
-          onError = _props$onError === undefined ? function () {} : _props$onError;
-
-      if (src && !loadedScripts.includes(href || src)) {
-        var el = href ? getCssEl({ href: href }) : getScriptEl({ src: src, onLoad: onLoad, onError: onError });
-        document.body.appendChild(el);
-        loadedScripts.push(href || src);
-      }
+  _createClass(VisualizerExample, [{
+    key: 'setVolume',
+    value: function setVolume(volume) {
+      this.setState({
+        volume: volume
+      });
     }
   }, {
     key: 'render',
     value: function render() {
-      return _react2.default.createElement('noscript', null);
+      var volume = this.state.volume;
+
+      return _react2.default.createElement(
+        'div',
+        null,
+        _react2.default.createElement(_recorder2.default, {
+          onVolumeChange: this.setVolume,
+          onError: function onError(err) {
+            return console.log('error', err);
+          }
+        }),
+        _react2.default.createElement(_Visualizer2.default, { volume: volume })
+      );
     }
   }]);
 
-  return AsyncLoader;
+  return VisualizerExample;
 }(_react.Component);
 
-exports.default = AsyncLoader;
+exports.default = VisualizerExample;

package/stories/wordDetector.js

@@ -0,0 +1,97 @@
+'use strict';
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+var _react = require('react');
+
+var _react2 = _interopRequireDefault(_react);
+
+var _player = require('../player');
+
+var _player2 = _interopRequireDefault(_player);
+
+var _wordDetector = require('../wordDetector');
+
+var _wordDetector2 = _interopRequireDefault(_wordDetector);
+
+var _Visualizer = require('../recorder/Visualizer');
+
+var _Visualizer2 = _interopRequireDefault(_Visualizer);
+
+var _recorder = require('../recorder');
+
+var _recorder2 = _interopRequireDefault(_recorder);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+var onError = function onError(e) {
+  return console.log("onError", e);
+};
+var onSuccess = function onSuccess(res, attempts) {
+  return console.log({ res: res, attempts: attempts });
+};
+var onFailure = function onFailure(res, attempts) {
+  return console.log({ res: res, attempts: attempts });
+};
+
+var WordDetectorExample = function (_Component) {
+  _inherits(WordDetectorExample, _Component);
+
+  function WordDetectorExample(props) {
+    _classCallCheck(this, WordDetectorExample);
+
+    var _this = _possibleConstructorReturn(this, (WordDetectorExample.__proto__ || Object.getPrototypeOf(WordDetectorExample)).call(this, props));
+
+    _this.state = {
+      volume: 0
+    };
+    _this.setVolume = _this.setVolume.bind(_this);
+    return _this;
+  }
+
+  _createClass(WordDetectorExample, [{
+    key: 'setVolume',
+    value: function setVolume(volume) {
+      this.setState({
+        volume: volume
+      });
+    }
+  }, {
+    key: 'render',
+    value: function render() {
+      var volume = this.state.volume;
+
+      return _react2.default.createElement(
+        'div',
+        null,
+        _react2.default.createElement(
+          'div',
+          null,
+          'Say "Hello"'
+        ),
+        _react2.default.createElement(_wordDetector2.default, {
+          word: 'hello',
+          onVolumeChange: this.setVolume,
+          onError: onError,
+          onSuccess: onSuccess,
+          onFailure: onFailure
+        }),
+        _react2.default.createElement(_Visualizer2.default, { volume: volume })
+      );
+    }
+  }]);
+
+  return WordDetectorExample;
+}(_react.Component);
+
+exports.default = WordDetectorExample;

package/utils/audio.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.audioBufferToWav = exports.convertBlobToaudioBuffer = exports.appendBuffer = exports.convertAudioBufferToWaveform = exports.getWaveform = undefined;
+exports.getWaveform = undefined;
 
 var _audioContext = require('./audioContext');
 
@@ -47,166 +47,51 @@ var getWaveform = exports.getWaveform = function getWaveform(url) {
   });
 };
 
-var convertAudioBufferToWaveform = exports.convertAudioBufferToWaveform = function convertAudioBufferToWaveform(audioBuffer) {
+/*
+export const convertAudioBufferToWaveform = (audioBuffer) => {
   // All this code (except the last line) is stolen/inspired from https://github.com/bbc/waveform-data.js/blob/master/lib/builders/audiodecoder.js
-  var scale = 512;
-  var scaleAdjuster = 127;
-  var dataLength = Math.floor(audioBuffer.length / scale);
-  var offset = 20;
-  var dataObject = new DataView(new ArrayBuffer(offset + dataLength * 2));
-  var leftChannel = void 0,
-      rightChannel = void 0;
-  var minValue = Infinity,
-      max_value = -Infinity,
-      scale_counter = scale;
-  var bufferLength = audioBuffer.length;
-
-  dataObject.setInt32(0, 1, true); //version
-  dataObject.setUint32(4, 1, true); //is 8 bit
-  dataObject.setInt32(8, audioBuffer.sampleRate, true); //sample rate
-  dataObject.setInt32(12, scale, true); //scale
-  dataObject.setInt32(16, dataLength, true); //length
+  const scale = 512
+  const scaleAdjuster = 127
+  const dataLength = Math.floor(audioBuffer.length / scale)
+  let offset = 20
+  const dataObject = new DataView(new ArrayBuffer(offset + dataLength * 2))
+  let leftChannel, rightChannel
+  let minValue = Infinity, max_value = -Infinity, scale_counter = scale;
+  const bufferLength = audioBuffer.length
+
+  dataObject.setInt32(0, 1, true);   //version
+  dataObject.setUint32(4, 1, true);   //is 8 bit
+  dataObject.setInt32(8, audioBuffer.sampleRate, true);   //sample rate
+  dataObject.setInt32(12, scale, true);   //scale
+  dataObject.setInt32(16, dataLength, true);   //length
 
   leftChannel = audioBuffer.getChannelData(0);
   rightChannel = audioBuffer.getChannelData(1);
 
-  for (var i = 0; i < bufferLength; i++) {
-    var sample = (leftChannel[i] + rightChannel[i]) / 2 * scaleAdjuster;
+  for (let i = 0; i < bufferLength; i++){
+    const sample = (leftChannel[i] + rightChannel[i]) / 2 * scaleAdjuster;
 
-    if (sample < minValue) {
+    if (sample < minValue){
       minValue = sample;
       if (minValue < -128) {
         minValue = -128;
       }
     }
 
-    if (sample > max_value) {
+    if (sample > max_value){
       max_value = sample;
       if (max_value > 127) {
         max_value = 127;
       }
     }
 
-    if (--scale_counter === 0) {
+    if (--scale_counter === 0){
       dataObject.setInt8(offset++, Math.floor(minValue));
       dataObject.setInt8(offset++, Math.floor(max_value));
-      minValue = Infinity;max_value = -Infinity;scale_counter = scale;
+      minValue = Infinity; max_value = -Infinity; scale_counter = scale;
     }
   }
 
-  return _waveformData2.default.create(dataObject.buffer);
-};
-
-var appendBuffer = exports.appendBuffer = function appendBuffer(buffer1, buffer2) {
-  if (!buffer1) return buffer2;
-  if (!buffer2) return buffer1;
-  var numberOfChannels = Math.min(buffer1.numberOfChannels, buffer2.numberOfChannels);
-  var tmp = audioContext.createBuffer(numberOfChannels, buffer1.length + buffer2.length, buffer1.sampleRate);
-  for (var i = 0; i < numberOfChannels; i++) {
-    var channel = tmp.getChannelData(i);
-    channel.set(buffer1.getChannelData(i), 0);
-    channel.set(buffer2.getChannelData(i), buffer1.length);
-  }
-  return tmp;
-};
-
-var convertBlobToaudioBuffer = exports.convertBlobToaudioBuffer = function convertBlobToaudioBuffer(blob, cb) {
-  var fileReader = new FileReader();
-  fileReader.onload = function (_ref) {
-    var result = _ref.target.result;
-
-    audioContext.decodeAudioData(result, function (buf) {
-      cb(buf);
-    });
-  };
-  fileReader.readAsArrayBuffer(blob);
-};
-
-var audioBufferToWav = exports.audioBufferToWav = function audioBufferToWav(buffer, opt) {
-  opt = opt || {};
-
-  var numChannels = buffer.numberOfChannels;
-  var sampleRate = buffer.sampleRate;
-  var format = opt.float32 ? 3 : 1;
-  var bitDepth = format === 3 ? 32 : 16;
-
-  var result = numChannels === 2 ? interleave(buffer.getChannelData(0), buffer.getChannelData(1)) : buffer.getChannelData(0);
-
-  return encodeWAV(result, format, sampleRate, numChannels, bitDepth);
-};
-
-var encodeWAV = function encodeWAV(samples, format, sampleRate, numChannels, bitDepth) {
-  var bytesPerSample = bitDepth / 8;
-  var blockAlign = numChannels * bytesPerSample;
-
-  var buffer = new ArrayBuffer(44 + samples.length * bytesPerSample);
-  var view = new DataView(buffer);
-
-  /* RIFF identifier */
-  writeString(view, 0, 'RIFF');
-  /* RIFF chunk length */
-  view.setUint32(4, 36 + samples.length * bytesPerSample, true);
-  /* RIFF type */
-  writeString(view, 8, 'WAVE');
-  /* format chunk identifier */
-  writeString(view, 12, 'fmt ');
-  /* format chunk length */
-  view.setUint32(16, 16, true);
-  /* sample format (raw) */
-  view.setUint16(20, format, true);
-  /* channel count */
-  view.setUint16(22, numChannels, true);
-  /* sample rate */
-  view.setUint32(24, sampleRate, true);
-  /* byte rate (sample rate * block align) */
-  view.setUint32(28, sampleRate * blockAlign, true);
-  /* block align (channel count * bytes per sample) */
-  view.setUint16(32, blockAlign, true);
-  /* bits per sample */
-  view.setUint16(34, bitDepth, true);
-  /* data chunk identifier */
-  writeString(view, 36, 'data');
-  /* data chunk length */
-  view.setUint32(40, samples.length * bytesPerSample, true);
-  if (format === 1) {
-    // Raw PCM
-    floatTo16BitPCM(view, 44, samples);
-  } else {
-    writeFloat32(view, 44, samples);
-  }
-  return buffer;
-};
-
-var interleave = function interleave(inputL, inputR) {
-  var length = inputL.length + inputR.length;
-  var result = new Float32Array(length);
-
-  var index = 0;
-  var inputIndex = 0;
-
-  while (index < length) {
-    result[index++] = inputL[inputIndex];
-    result[index++] = inputR[inputIndex];
-    inputIndex++;
-  }
-  return result;
-};
-
-var writeFloat32 = function writeFloat32(output, offset, input) {
-  for (var i = 0; i < input.length; i++, offset += 4) {
-    output.setFloat32(offset, input[i], true);
-  }
-};
-
-var floatTo16BitPCM = function floatTo16BitPCM(output, offset, input) {
-  for (var i = 0; i < input.length; i++, offset += 2) {
-    var s = Math.max(-1, Math.min(1, input[i]));
-    output.setInt16(offset, s < 0 ? s * 0x8000 : s * 0x7FFF, true);
-  }
-};
-
-var writeString = function writeString(view, offset, string) {
-  for (var i = 0; i < string.length; i++) {
-    view.setUint8(offset + i, string.charCodeAt(i));
-  }
-};
+  return WaveformData.create(dataObject.buffer)
+}
+*/

package/utils/mediaDevices.js

@@ -0,0 +1,33 @@
+'use strict';
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+var shimMediaDevices = exports.shimMediaDevices = function shimMediaDevices() {
+  // Older browsers might not implement mediaDevices at all, so we set an empty object first
+  if (window.navigator.mediaDevices === undefined) {
+    window.navigator.mediaDevices = {};
+  }
+
+  // Some browsers partially implement mediaDevices. We can't just assign an object
+  // with getUserMedia as it would overwrite existing properties.
+  // Here, we will just add the getUserMedia property if it's missing.
+  if (window.navigator.mediaDevices.getUserMedia === undefined) {
+    window.navigator.mediaDevices.getUserMedia = function (constraints) {
+
+      // First get ahold of the legacy getUserMedia, if present
+      var getUserMedia = window.navigator.webkitGetUserMedia || window.navigator.mozGetUserMedia;
+
+      // Some browsers just don't implement it - return a rejected promise with an error
+      // to keep a consistent interface
+      if (!getUserMedia) {
+        return Promise.reject(new Error('getUserMedia is not implemented in this browser'));
+      }
+
+      // Otherwise, wrap the call to the old navigator.getUserMedia with a Promise
+      return new Promise(function (resolve, reject) {
+        getUserMedia.call(navigator, constraints, resolve, reject);
+      });
+    };
+  }
+};

package/wordDetector/index.js

@@ -0,0 +1,139 @@
+'use strict';
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+
+var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }();
+
+var _react = require('react');
+
+var _react2 = _interopRequireDefault(_react);
+
+var _recorder = require('../recorder');
+
+var _recorder2 = _interopRequireDefault(_recorder);
+
+var _similarity = require('similarity');
+
+var _similarity2 = _interopRequireDefault(_similarity);
+
+var _fileSaver = require('file-saver');
+
+var _fileSaver2 = _interopRequireDefault(_fileSaver);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; }
+
+var API_URL = 'http://localhost:3004/speechtotext';
+var SIMILARITY_THRESHOLD = 0.8;
+
+var debug = function debug(wav) {
+  _fileSaver2.default.saveAs(wav, 'test.wav');
+};
+
+var sendFileToSpeechToTextApi = function sendFileToSpeechToTextApi(wav) {
+  return new Promise(function (resolve, reject) {
+    var xhr = new XMLHttpRequest();
+    xhr.open('POST', API_URL, true);
+
+    xhr.onreadystatechange = function () {
+      if (xhr.readyState == 4 && xhr.status == 200) {
+        console.log('Speech to text: ', xhr.responseText);
+        resolve(xhr.responseText);
+      }
+    };
+    xhr.onerror = function () {
+      reject();
+    };
+    xhr.setRequestHeader('Content-Type', 'audio/wav');
+    xhr.send(wav);
+  });
+};
+
+var defaultCompare = function defaultCompare() {
+  var a = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
+  var b = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : '';
+  return (0, _similarity2.default)(a.toLowerCase().trim(), b.toLowerCase().trim()) > SIMILARITY_THRESHOLD;
+};
+
+var WordDetector = function (_Component) {
+  _inherits(WordDetector, _Component);
+
+  function WordDetector(props) {
+    _classCallCheck(this, WordDetector);
+
+    var _this = _possibleConstructorReturn(this, (WordDetector.__proto__ || Object.getPrototypeOf(WordDetector)).call(this, props));
+
+    _this.state = {
+      attempts: 0
+    };
+    _this.onError = _this.onError.bind(_this);
+    _this.onResult = _this.onResult.bind(_this);
+    _this.onRecordComplete = _this.onRecordComplete.bind(_this);
+    return _this;
+  }
+
+  _createClass(WordDetector, [{
+    key: 'onRecordComplete',
+    value: function onRecordComplete(wav) {
+      var _this2 = this;
+
+      //debug(wav)
+
+      sendFileToSpeechToTextApi(wav).then(function (res) {
+        _this2.onResult(res);
+      }).catch(function (e) {
+        _this2.onError(e);
+      });
+    }
+  }, {
+    key: 'onError',
+    value: function onError(e) {
+      var _props$onError = this.props.onError,
+          onError = _props$onError === undefined ? function () {} : _props$onError;
+
+      onError(e);
+    }
+  }, {
+    key: 'onResult',
+    value: function onResult() {
+      var res = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : '';
+      var attempts = this.state.attempts;
+      var _props = this.props,
+          word = _props.word,
+          _props$onSuccess = _props.onSuccess,
+          onSuccess = _props$onSuccess === undefined ? function () {} : _props$onSuccess,
+          _props$onFailure = _props.onFailure,
+          onFailure = _props$onFailure === undefined ? function () {} : _props$onFailure,
+          _props$compare = _props.compare,
+          compare = _props$compare === undefined ? defaultCompare : _props$compare;
+
+      var incrementedAttempts = attempts + 1;
+      var success = compare(word, res);
+      this.setState({
+        attempts: success ? 0 : incrementedAttempts
+      }, function () {
+        var cb = success ? onSuccess : onFailure;
+        cb(res, incrementedAttempts);
+      });
+    }
+  }, {
+    key: 'render',
+    value: function render() {
+      var _props$onVolumeChange = this.props.onVolumeChange,
+          onVolumeChange = _props$onVolumeChange === undefined ? function () {} : _props$onVolumeChange;
+
+      return _react2.default.createElement(_recorder2.default, { onError: this.onError, onVolumeChange: onVolumeChange, onRecordComplete: this.onRecordComplete });
+    }
+  }]);
+
+  return WordDetector;
+}(_react.Component);
+
+exports.default = WordDetector;