Common: leave action

app/Http/Controllers/GuestController.php

@@ -9,7 +9,6 @@ class GuestController extends Controller
 {
 
     public function meeting(Request $request, $meetingID, $participantID) {
-        $guest = true;
         return view('meeting', [
             'meetingID' => $meetingID,
             'participantID'=> $participantID,

app/Http/Controllers/ProController.php

@@ -26,10 +26,10 @@ class ProController extends Controller
         return view('pro.show', compact('pro'));
     }
 
-    public function meeting(Request $request, $meetingID) {
+    public function meeting(Request $request, $meetingID, $participantID) {
         return view('meeting', [
             'meetingID' => $meetingID,
-            'participantID'=> null,
+            'participantID'=> $participantID,
             'guest' => false
         ]);
     }

resources/views/layouts/pro.blade.php

@@ -126,7 +126,10 @@
                     message = JSON.parse(message.body);
                     console.log(message.meetingUid);
 
-                    $('#incomingCallModal').data('meetingUid', message.meetingUid).modal('show');
+                    $('#incomingCallModal')
+                        .data('meetingUid', message.meetingUid)
+                        .data('meetingParticipantUid', message.meetingParticipantUid)
+                        .modal('show');
 
                 });
 
@@ -141,8 +144,10 @@
         connect();
 
         function joinCall() {
-            var meetingUid = $('#incomingCallModal').data('meetingUid');
-            window.location.href = '/pro/meeting/' + meetingUid;
+            var modal = $('#incomingCallModal');
+            window.location.href = '/pro/meeting/' +
+                modal.data('meetingUid') + '/' +
+                modal.data('meetingParticipantUid');
         }
 
         function disconnect() {

resources/views/meeting.blade.php

@@ -29,9 +29,10 @@
                 </div>
             </div>
             <div class="main-view" style="width: 800px; min-height: 600px;">
-                <div class="p-4 w-100 h-100 d-flex align-items-stretch justify-content-stretch flex-column">
-                    <img :src="activeParticipant.image" class="d-block mw-100 mh-100 mx-auto">
+                <div class="p-4 w-100 h-100 d-flex align-items-stretch justify-content-end flex-column">
                     <p class="font-weight-bold text-center text-white mt-2">Feed from @{{ activeParticipant.name }}</p>
+                    <button class="btn btn-sm btn-danger px-4 align-self-end mx-auto font-weight-bold"
+                            v-on:click="leaveCall()">Leave</button>
                 </div>
             </div>
             <div class="tp-bar">
@@ -67,7 +68,7 @@
             delimiters: ['@{{', '}}'],
             data: {
                 meetingID: '<?= $meetingID ?>',
-                @if($guest) participantID: '<?= $participantID ?>', @endif
+                participantID: '<?= $participantID ?>',
                 socket: null,
                 stompClient: null,
                 time: 0,
@@ -76,6 +77,7 @@
                 guest: <?= $guest ? 'true' : 'false' ?>,
                 activeType: false,
                 activeParticipant: false,
+                exitURL: '<?= $guest ? '/' : '/pro/dashboard' ?>',
                 allPastels: [
                     '#89cff0',
                     '#99c5c4',
@@ -221,6 +223,14 @@
 
                     // TODO: init pro stream
                 },
+                leaveCall: function() {
+                    this.stompClient.send("/app/meeting-participant-leave-meeting", {},
+                        JSON.stringify({
+                            meetingParticipantUid: this.participantID
+                        })
+                    );
+                    window.location.href = this.exitURL;
+                }
             },
             mounted: function() {
 

routes/web.php

@@ -36,7 +36,7 @@ Route::middleware('ensureValidSession')->group(function(){
     Route::get("/pros/create", 'ProController@create')->name('pro-create');
     Route::get("/pros/show/{uid}", 'ProController@show')->name('pro-show');
 
-    Route::get('/pro/meeting/{meetingID}', 'ProController@meeting');
+    Route::get('/pro/meeting/{meetingID}/{participantID}', 'ProController@meeting');
 
     Route::get('/pro/logout', 'AppSessionController@processProLogOut')->name('pro-logout');
 });