add sounds w/ howler

src/Mine/SeekerBundle/Resources/public/js/mine-seeker/grid/grid-control.js

@@ -6,6 +6,12 @@ class GridControl extends React.Component {
     constructor(props) {
         super(props);
 
+        var click = new Howl({src: ['/sound/click.mp3']}),
+            bomb = new Howl({src: ['/sound/bomb.mp3']}),
+            mine = new Howl({src: ['/sound/mine.mp3']}),
+            warning = new Howl({src: ['/sound/warning.mp3']}),
+            won = new Howl({src: ['/sound/won.mp3']});
+
         this.state = {
             env: props.env,
             webPlayer: null,
@@ -14,6 +20,13 @@ class GridControl extends React.Component {
             bombFieldCache: [],
             foundUserMineCache: 0,
             playBomb: false,
+            sound: {
+                click: click,
+                bomb: bomb,
+                mine: mine,
+                warning: warning,
+                won: won
+            },
             lastClicked: {
                 red: null,
                 blue: null
@@ -186,6 +199,8 @@ class GridControl extends React.Component {
 
             /** if you found mine */
             if (currentObject === 'm') {
+                this.state.sound.mine.play();
+
                 this.state.foundUserMineCache++;
 
                 if (!justOnFirstIteration) {
@@ -198,6 +213,8 @@ class GridControl extends React.Component {
                     currentImage: gridFieldControl.state.icons.root + gridFieldControl.state.icons.flag[activePlayer]
                 });
             } else {
+                this.state.sound.click.play();
+
                 if (!justOnFirstIteration) {
                     /** set __ACTIVE__ player in the UserControl !!!! */
                     userControl.setState({
@@ -251,6 +268,8 @@ class GridControl extends React.Component {
 
         /** Field selected w/ BOMB */
         if (this.refs.userControl.state.bombSelected) {
+            this.state.sound.bomb.play();
+
             var radius = this.getBombRadius(coords[0], coords[1]);
 
             for (var i = 0, j = radius.length; i < j; i++) {