widgets: soundboard widget to interface

src/bot/widgets/soundboard.ts

@@ -0,0 +1,30 @@
+import * as glob from 'glob';
+
+import Widget from './_interface';
+
+class SoundBoard extends Widget {
+  [x: string]: any; // TODO: remove after interface ported to TS
+
+  constructor() {
+    super({});
+    this.addWidget('soundboard', 'widget-title-soundboard', 'fas fa-music');
+  }
+
+  public sockets() {
+    this.socket.on('connection', (socket) => {
+      socket.on('getSoundBoardSounds', (cb) => {
+        glob('public/dist/soundboard/*.mp3', (err, files) => {
+          if (err) { return cb([]); }
+
+          const sounds: string[] = [];
+          for (const file of files) {
+            sounds.push(file.split('/').pop().replace('.mp3', ''));
+          }
+          cb(sounds);
+        });
+      });
+    });
+  }
+}
+
+module.exports = new SoundBoard();

src/panel/widgets/components/soundboard.vue

@@ -60,12 +60,13 @@ import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
 library.add(faMusic, faVolumeUp, faVolumeDown, faVolumeOff)
 
 export default {
-  props: ['socket', 'commons'],
+  props: ['commons'],
   components: {
     'font-awesome-icon': FontAwesomeIcon
   },
   data: function () {
     return {
+      socket: io('/widgets/soundboard', { query: "token=" + this.token }),
       volume: 50,
       audio: null,
       sounds: []
@@ -88,9 +89,7 @@ export default {
     }
   },
   created: function () {
-    this.socket.emit('getSoundBoardSounds')
-    this.socket.off('soundBoardSounds').on('soundBoardSounds', sounds => this.sounds = sounds)
-
+    this.socket.emit('getSoundBoardSounds', (sounds) => this.sounds = sounds)
     if (localStorage.getItem('/widget/soundboard/volume')) this.volume = JSON.parse(localStorage.getItem('/widget/soundboard/volume'))
   },
   methods: {