Handle element placeholder

peertube-plugin-hello-world/assets/style1.css

@@ -1,3 +1,8 @@
 .header-right  {
   background-color: black;
 }
+
+.hello-world-h4 {
+  width: 150px;
+  color: white;
+}

peertube-plugin-hello-world/client/video-watch-client-plugin.js

@@ -54,6 +54,15 @@ function register ({ registerHook, peertubeHelpers }) {
   })
 
   peertubeHelpers.notifier.info('you are on the watch page', 'useless', 1000)
+
+  // Insert element next to the player
+  {
+    const elem = document.createElement('div')
+    elem.className = 'hello-world-h4'
+    elem.innerHTML = '<h4>Hello everybody! This is an element next to the player</h4>'
+
+    document.getElementById('plugin-placeholder-player-next').appendChild(elem)
+  }
 }
 
 export {

peertube-plugin-hello-world/package.json

@@ -3,7 +3,7 @@
   "version": "0.0.18",
   "description": "Hello world PeerTube plugin example",
   "engine": {
-    "peertube": ">=2.2.0"
+    "peertube": ">=3.2.0"
   },
   "keywords": [
     "peertube",