Skip to content

Commit a8cf3cf

Browse files
committed
Update readme
1 parent a756abd commit a8cf3cf

File tree

1 file changed

+22
-6
lines changed

1 file changed

+22
-6
lines changed

README.md

Lines changed: 22 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -163,27 +163,30 @@ See [example](https://github.com/cybex-dev/twilio_voice/blob/master/example/andr
163163

164164
### Web Setup:
165165

166-
There are 2 important files for Twilio incoming/missed call notifications to work:
166+
There are 4 important files for Twilio incoming/missed call notifications to work:
167167

168+
- `twilio.min.js` is the twilio javascript SDK, it is used to handle the incoming calls.
168169
- `notifications.js` is the main file, it handles the notifications and the service worker.
170+
- `load-sw.js` is responsible for (re)loading the twilio service worker.
169171
- `twilio-sw.js` is the service worker, it is used to handle the incoming calls.
170172

171173
Also, the twilio javascript SDK itself, `twilio.min.js` is needed.
172174

173175
To ensure proper/as intended setup:
174176

175-
1. Get all 3 files (`notifications.js`, `twilio.min.js` and `twilio-sw.js`) from `example/web` folder
176-
2. Copy all 3 into your own project,
177-
3. (optional) Review & change the `notifications.js`, `twilio-sw.js) files to match your needs.
177+
1. Locate 4 files (`twilio.min.js`, `load-sw.js`, `notifications.js` and `twilio-sw.js`) from `example/web` folder
178+
2. Copy all 4 files into your own project,
179+
3. (optional) Review & change the `notifications.js`, `twilio-sw.js` files to match your needs.
178180

179181
Finally, add the following code to your `index.html` file, **at the end of body tag**:
180182

181183
```html
182184
<body>
183185
<!--twilio native js library-->
184186
<script type="text/javascript" src="./twilio.min.js"></script>
185-
<!--twilio native js library-->
186-
<script type="text/javascript" src="./notifications.js"></script>
187+
188+
<!--load twilio service worker-->
189+
<script type="text/javascript" src="./load-sw.js"></script>
187190

188191
<script>
189192
if ('serviceWorker' in navigator) {
@@ -206,6 +209,19 @@ Notice should be given to using `firebase-messaging-sw.js` in addition to `twili
206209
_If you need to debug the service worker, open up Chrome Devtools, go to Application tab, and select Service Workers from the left menu. There you can see the service workers and their status.
207210
To review service worker `notificationclick`, `notificationclose`, `message`, etc events - do this using Chrome Devtools (Sources tab, left panel below 'site code' the service workers are listed)_
208211

212+
##### Web Notifications
213+
214+
2 types of notifications are shown:
215+
- Incoming call notifications with 2 buttons: `Answer` and `Reject`,
216+
- Missed call notifications with 1 button: `Call back`.
217+
218+
Notifications are presented as **alerts**. These notifications may not always been shown, check:
219+
- if the browser supports notifications,
220+
- if the user has granted permissions to show notifications,
221+
- if the notifications display method / notifications is enabled by the system (e.g. macOS notifications are disabled, or Windows notifications are disabled, etc).
222+
- if there are already notifications shown (https://stackoverflow.com/a/36383155/4628115)
223+
- if system is in 'Do Not Disturb' or 'Focus' mode.
224+
209225
### MacOS Setup:
210226

211227
The plugin is essentially a [WKWebView](https://developer.apple.com/documentation/webkit/wkwebview)

0 commit comments

Comments
 (0)