change load location

change volume slider showing

src/lib/PdfShare.vue

@@ -1,13 +1,11 @@
 <template>
-    <div>
+    <div style="position: absolute;right: 0;bottom:0">
         <v-file-input ref="file" id="myfile" accept="pdf" label="Please select a file"></v-file-input>
         <v-btn @click="loadFile">load file</v-btn>
-        <canvas id="mypdfview"></canvas>
+        <canvas style="zoom:0.3" id="mypdfview"></canvas>
         <v-btn @click="prevPage">Prev</v-btn>
         <span v-if="pdf && !loading">{{pdf.numPages}}</span>
         <v-btn @click="nextPage">Next</v-btn>
-        <video class="rounded centered" id="pdfvid" width="100%" height="100%" autoplay
-               playsinline muted="muted"/>
     </div>
 </template>
 
@@ -60,9 +58,9 @@ export default {
 
                 var renderTask = page.render(renderContext);
                 renderTask.promise.then( () => {
-                    if (this.loading) {
+                    if (!this.pluginHandle) {
                         this.loading = false
-                        document.getElementById('pdfvid').srcObject = document.getElementById('mypdfview').captureStream(60)
+                        // document.getElementById('pdfvid').srcObject = document.getElementById('mypdfview').captureStream(60)
 
                         this.janusInit.attach(
                             {

src/lib/RemoteFeed.vue

@@ -1,14 +1,15 @@
 <template>
-    <div class="vid_main">
+    <div class="vid_main" @mouseleave="showaction = false"    @mouseover="showaction = true"
+    >
         <video ref="feed_video" width="100%" height="100%" autoplay playsinline/>
         <div class="info">{{ bitrate }}</div>
         <div class="infoSlow">Slow Connection</div>
-        <div class="actions">
+        <div class="actions"  v-show="showaction">
             <v-slider
                     v-model="volume"
                     :min="0"
                     :max="100"
-                    light
+                    dark
             ></v-slider>
         </div>
     </div>
@@ -30,6 +31,7 @@
             bitrateTimer: null,
             muted: false,
             bitrate: 0,
+            showaction: false,
             volume: 100
         }),
         watch: {

src/lib/VueJanus.vue

@@ -2,7 +2,8 @@
     <v-container>
         <v-btn @click="deviceSelectDialog = true">change</v-btn>
         <v-btn @click="screenShare">share a screen</v-btn>
-        <PdfShare :username="username"  :opaque-id="opaqueId" :room="room" :janus-init="janusInit" ></PdfShare>
+        <v-btn @click="sharePdf=true">share a pdf</v-btn>
+        <PdfShare v-if="sharePdf" :username="username"  :opaque-id="opaqueId" :room="room" :janus-init="janusInit" ></PdfShare>
 
         <v-dialog
                 v-model="mozillaAlert"
@@ -122,6 +123,7 @@
                 selectedAudio: null,
                 started: false,
                 mozillaAlert: false,
+                sharePdf: false,
                 janusScreenShareHandle: null,
                 chromeAlert: false,
                 videoDevices: [],
@@ -141,6 +143,7 @@
                 error: function (error) {
                     this.$janus.error(error);
                 },
+                webrtcState: this.webrtcState,
                 destroyed: function () {
                     window.location.reload();
                 }
@@ -148,6 +151,10 @@
 
         },
         methods: {
+            webrtcState (on) {
+                this.pluginHandle.send({"message": { "request": "configure", "bitrate": 512*1000 }});
+                console.log(on, "webrt")
+            },
             janusPluginSuccessScreen (pluginHandle) {
                 this.janusScreenShareHandle = pluginHandle
                 this.$janus.log("Plugin attached! (" + this.pluginHandle.getPlugin() + ", id=" + this.pluginHandle.getId() + ")");
@@ -337,9 +344,6 @@
                         }
                     })
             },
-            webrtcState (on) {
-                this.$janus.log("Janus says our WebRTC PeerConnection is " + (on ? "up" : "down") + " now");
-            },
             mediaState (medium, on) {
                 this.$janus.log("Janus " + (on ? "started" : "stopped") + " receiving our " + medium);
             },