diff --git a/package-lock.json b/package-lock.json index 68921b2..96f5929 100644 --- a/package-lock.json +++ b/package-lock.json @@ -6398,6 +6398,11 @@ "is-plain-obj": "1.1.0" } }, + "soundcloud-audio": { + "version": "1.3.1", + "resolved": "https://registry.npmjs.org/soundcloud-audio/-/soundcloud-audio-1.3.1.tgz", + "integrity": "sha512-7VMyxAR3vQreRcK/RH+oM19hUr6obwxeiL42/nR5L3u2NXp82RvEdfJc5lq/mq0C3zA+gi6jcHkUIu8lFYwLIg==" + }, "source-map": { "version": "0.5.7", "resolved": "https://registry.npmjs.org/source-map/-/source-map-0.5.7.tgz", diff --git a/package.json b/package.json index 3903f39..d44bba7 100644 --- a/package.json +++ b/package.json @@ -18,6 +18,7 @@ "react": "^16.4.1", "react-dom": "^16.4.1", "react-render-html": "^0.6.0", + "soundcloud-audio": "^1.3.1", "vex-js": "^4.1.0" }, "devDependencies": { diff --git a/src/app/SearchField.js b/src/app/SearchField.js index 00cab8b..260eab0 100644 --- a/src/app/SearchField.js +++ b/src/app/SearchField.js @@ -2,6 +2,7 @@ import React, { Component } from 'react'; import axios from 'axios'; import PawnedListItem from './PawnedListItem'; import './SearchField.css'; +import SoundCloudAudio from 'soundcloud-audio'; export default class SearchField extends Component { @@ -20,6 +21,8 @@ export default class SearchField extends Component { this.checkIsPawned = this.checkIsPawned.bind(this); this.breachItems = []; this.displayMessage; + this.musicPlayer = new SoundCloudAudio('1b0ff6d5c4606e7fdf5d744be591b5a4'); + console.log(SoundCloudAudio); } render() { @@ -36,7 +39,7 @@ export default class SearchField extends Component {
-
{this.breachItems} -
+
); } + componentDidMount() { + this.musicPlayer.stop(); // fallback + if (!this.musicPlayer.playing) { + this.musicPlayer.resolve('https://soundcloud.com/djangodjango/first-light', (playlist) => { + + console.log(playlist); + + this.musicPlayer.play(); + + this.musicPlayer.on('ended', () => { + this.musicPlayer.play(); + + }); + }); + } + } + onFocus(e) { if (e.target.classList.contains('pulse')) { e.target.classList.remove('pulse');