Code cleanup #1

app/Http/Controllers/PracticeManagementController.php

@@ -254,7 +254,7 @@ class PracticeManagementController extends Controller
     public function meet(Request $request, $uid = false) {
         $session = AppSession::where('session_key', $request->cookie('sessionKey'))->first();
         $client = !empty($uid) ? Client::where('uid', $uid)->first() : null;
-        return view('app.video.call-agora', compact('session', 'client'));
+        return view('app.video.call', compact('session', 'client'));
     }
 
     // ajax ep used by the video page

resources/views/app/video/call.blade.php

@@ -113,6 +113,7 @@
                 delimiters: ['@{{', '}}'],
                 data: {
 
+                    agoraClient: null,
                     appId: '{{ env('AGORA_APPID') }}',
                     channel: '{{ $client ? $client->uid : '' }}',
                     uid: '{{ $session->id + 1000000 }}',
@@ -178,51 +179,22 @@
                     },
                     hangUp: function () {
                         var self = this;
-                        if (this.otSession) {
-                            try {
-                                this.otSession.unpublish(this.publisher);
-                                this.otSession.disconnect();
-                            } catch (e) {
-                                console.log('Was already disconnected.');
+                        async function _leave() {
+                            if(self.agoraClient) {
+                                await self.agoraClient.leave();
+                                window.top.hideRHS();
+                                window.location.reload();
                             }
-                            this.otSession = false;
-                            this.otSessionId = '';
-                            this.started = false;
-                            this.startTime = false;
-                            this.videoActive = false;
-                             if(self.publisher){
-                                self.publisher.destroy();
-                             }
-                             window.top.hideRHS();
-                            // this.client = false;
                         }
+                        _leave();
                     },
                     initAgora: function () {
 
-                        /* fake video feed (temp) */
-                        const randomColour = () => {
-                            return Math.round(Math.random() * 255);
-                        };
-
-                        const canvas = document.createElement('canvas');
-                        canvas.width = 640;
-                        canvas.height = 480;
-                        const ctx = canvas.getContext('2d');
-                        var pos = 100;
-                        window.setInterval(function () {
-                            ctx.clearRect(0, 0, canvas.width, canvas.height);
-                            ctx.font = "20px Georgia";
-                            ctx.fillStyle = `rgb(220, 220, 220)`;
-                            ctx.fillText("Video feed from {{ $pro->name_display }}", 20, pos);
-                            pos += 5;
-                            if (pos > canvas.height) pos = 100;
-                        }, 1000);
-
                         let self = this;
 
                         async function _initAgora(){
 
-                            const client = AgoraRTC.createClient({mode:'rtc', codec:'h264'})
+                            self.agoraClient = AgoraRTC.createClient({mode:'rtc', codec:'h264'})
                             let camera, mic
                             try { mic = await AgoraRTC.createMicrophoneAudioTrack() } catch {
                                 console.log('ALIX: error in getting mic');
@@ -240,14 +212,12 @@
                             }
 
                             // Add myself to the page.
-                            // createUserEl(agora.uid)
-                            // addUserVideo(agora.uid, camera)
                             if(camera) {
                                 camera.play($('#self-view')[0]);
                             }
 
                             // events
-                            client.on('user-joined', user => {
+                            self.agoraClient.on('user-joined', user => {
 
                                 // add a div for remove view
                                 $('[data-stream="' + user.uid + '"]').remove();
@@ -270,7 +240,7 @@
                                 self.activateParty(user.uid);
                                 self.noOneElseInCall = false;
                             })
-                            client.on('user-left', user => {
+                            self.agoraClient.on('user-left', user => {
 
                                 if ($('.full-view[data-stream="' + user.uid + '"]').length) {
                                     var allThumbs = $('.thumbs [data-stream]:not([data-stream=""]):not(.disconnected-view):visible');
@@ -302,15 +272,15 @@
                                     self.noOneElseInCall = true;
                                 }
                             })
-                            client.on('user-published', async function(user, mediaType){
-                                await client.subscribe(user, mediaType)
+                            self.agoraClient.on('user-published', async function(user, mediaType){
+                                await self.agoraClient.subscribe(user, mediaType)
                                 mediaType === 'audio'
                                     ? user.audioTrack.play()
                                     : user.videoTrack.play($('[data-stream="' + user.uid + '"]')[0]);
                             })
 
-                            await client.join(self.appId, self.channel, self.selfToken, self.uid)
-                            await client.publish([mic, camera].filter(Boolean))
+                            await self.agoraClient.join(self.appId, self.channel, self.selfToken, self.uid)
+                            await self.agoraClient.publish([mic, camera].filter(Boolean))
 
                             // assume connected by this point, notify backend & show self video
                             if (mic || camera) {