From ef09bce5235ed921989074bb7c0a71540975f4a9 Mon Sep 17 00:00:00 2001
From: Michal Orlik <sogehige@gmail.com>
Date: Tue, 13 Nov 2018 15:37:41 +0100
Subject: [PATCH] widgets: fix ytplayer plyr player

Fixes #1563

There may be some [Vue warn], this is originating from VuePlyr
and not implementation of widget
---
 package.json                              |  2 +-
 src/panel/widgets/components/ytplayer.vue | 11 ++++++++---
 2 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/package.json b/package.json
index d1ffda85985..ed4458cedb5 100644
--- a/package.json
+++ b/package.json
@@ -56,7 +56,7 @@
     "url-join": "4.0.0",
     "velocity-animate": "1.5.2",
     "vue": "2.5.17",
-    "vue-plyr": "5.0.1",
+    "vue-plyr": "5.0.4",
     "winston": "3.1.0",
     "winwheel": "1.0.1",
     "xregexp": "4.2.0",
diff --git a/src/panel/widgets/components/ytplayer.vue b/src/panel/widgets/components/ytplayer.vue
index b21219f850d..803e59a8b83 100644
--- a/src/panel/widgets/components/ytplayer.vue
+++ b/src/panel/widgets/components/ytplayer.vue
@@ -61,11 +61,13 @@ import { faMusic, faList, faPlay, faPause, faForward } from '@fortawesome/free-s
 import { FontAwesomeIcon } from '@fortawesome/vue-fontawesome'
 
 
-import 'vue-plyr'
-import 'vue-plyr/dist/vue-plyr.css'
+import Vue from 'vue'
+import VuePlyr from 'vue-plyr'
 
 library.add(faMusic, faList, faPlay, faPause, faForward)
 
+Vue.use(VuePlyr)
+
 export default {
   props: ['token', 'commons'],
   components: {
@@ -101,7 +103,6 @@ export default {
         this.initialized = true
         setInterval(() => {
           if (this.autoplay && !this.player.playing && !this.player.loading && !this.waitingForNext) {
-            console.log(this.player)
             this.next()
           }
         }, 1000)
@@ -120,6 +121,9 @@ export default {
     },
     play: function () {
       this.autoplay = true
+      console.log(this.$refs)
+      console.log('play')
+      console.log(this.player)
       this.player.play()
     }
   },
@@ -144,6 +148,7 @@ export default {
       this.player.once('ready', event => {
         if (item.startTime) this.player.currentTime = item.startTime
         if (this.autoplay) {
+      console.log(this.player)
           this.player.play()
         }
         this.player.volume = item.volume / 100