Move listeners into their own class

assets/js/app.js

@@ -5,7 +5,6 @@ import "phoenix_html";
 
 import React from "react";
 import ReactDOM from "react-dom";
-import watch from "redux-watch";
 import { createStore } from "redux";
 
 import Channel from "./services/channel";
@@ -13,6 +12,7 @@ import Notifications from "./services/notifications";
 
 import chessBoardReducer from "./reducers/chess-board";
 import { setGameId } from "./store/actions";
+import Listeners from "./store/listeners";
 
 import ChessBoard from "./components/chess-board";
 import MoveList from "./components/move-list";
@@ -27,14 +27,8 @@ class App extends React.Component {
 
     store.dispatch(setGameId(gameId));
 
-    let w = watch(store.getState, "turn");
+    this.listeners = new Listeners(store);
-    store.subscribe(w((newVal, oldVal, objectPath) => {
+    this.listeners.setListeners(notifications);
-      const player = store.getState().player;
-
-      if (oldVal != null && newVal == player) {
-        notifications.notifyTurn(player);
-      }
-    }));
 
     this.channel = new Channel(store, gameId);
   }

assets/js/services/notifications.js

@@ -4,11 +4,15 @@ class Notifications {
   }
 
   notifyTurn(player) {
+    this.notify({
+      body: "Your opponent has moved.",
+      icon: `/images/king_${player}.svg`,
+    });
+  }
+
+  notify(options) {
     if (!document.hasFocus()) {
-      new Notification("Chess", {
+      new Notification("Chess", options);
-        body: "Your opponent has moved.",
-        icon: `/images/king_${player}.svg`
-      });
     }
   }
 }

assets/js/store/listeners.js

@@ -0,0 +1,27 @@
+import watch from "redux-watch";
+
+class Listeners {
+  constructor(store) {
+    this.store = store;
+  }
+
+  setListeners(notifications) {
+    this.notifications = notifications;
+
+    let watcher = watch(this.store.getState, "turn");
+
+    this.store.subscribe(
+      watcher(this.notifyTurn.bind(this))
+    );
+  }
+
+  notifyTurn(newVal, oldVal) {
+    const player = this.store.getState().player;
+
+    if (oldVal != null && newVal == player) {
+      this.notifications.notifyTurn(player);
+    }
+  }
+};
+
+export default Listeners;