* Integrates soundcloud

* adds music

Signed-off-by: Indrajith K L <mac91112@gmail.com>

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",

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": {

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 {
             <div className="searchWrapper">
                 <div className="search">
                     <div className="title">
-                        <label class="hover-field glitch-text" data-text="isPawned">
+                        <label className="hover-field glitch-text" data-text="isPawned">
                             isPawned
                         <span>Check wheather your email address is Pawned anywhere</span>
                         </label>
@@ -50,11 +53,28 @@ export default class SearchField extends Component {
                 </div>
                 <div className="searchResults">
                     {this.breachItems}
-                </div>
+                </div> 
             </div>
         );
     }
 
+    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');