From 4a6dec1da66e5bcbbc50aa632a137003be5f4d5f Mon Sep 17 00:00:00 2001
From: liamcottle <liam@liamcottle.com>
Date: Tue, 21 May 2024 17:33:27 +1200
Subject: [PATCH] add calling ui when button pressed

---
 public/call.html | 7 +++++--
 1 file changed, 5 insertions(+), 2 deletions(-)

diff --git a/public/call.html b/public/call.html
index 8372da2..41054d2 100644
--- a/public/call.html
+++ b/public/call.html
@@ -153,8 +153,11 @@
                     <div class="flex-1">
                         <input v-model="destinationHash" type="text" placeholder="Enter Destination Hash" class="bg-gray-50 border border-gray-300 text-gray-900 text-sm rounded-lg focus:ring-blue-500 focus:border-blue-500 block w-full p-2">
                     </div>
-                    <button @click="initiateCall(destinationHash)" type="button" class="my-auto inline-flex items-center gap-x-1 rounded-md bg-green-500 p-2 text-sm font-semibold text-white shadow-sm hover:bg-green-400 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-green-500">
-                        <span>Initiate Call</span>
+                    <button @click="initiateCall(destinationHash)" :disabled="isInitiatingCall" type="button" :class="[ isInitiatingCall ? 'bg-gray-400 focus-visible:outline-gray-500' : 'bg-green-500 hover:bg-green-400 focus-visible:outline-green-500' ]" class="my-auto inline-flex items-center gap-x-1 rounded-md p-2 text-sm font-semibold text-white shadow-sm focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2">
+                        <span v-if="isInitiatingCall">
+                            <span>Calling...</span>
+                        </span>
+                        <span v-else>Initiate Call</span>
                     </button>
                 </div>
                 <div class="flex p-1">