I’ve started working on something which I had thought of ever I’ve put a openHAB (3) tablet on the wall:
a SIP client integration.
Mainly for my SIP based door intercom, to be able to see who is there, answer and open the door without the need to switch to another app on the tablet.
Actually, I thought this is highly complex. But it turned out to be relatively easy and is already fairly working. Here is what I did and how it works:
I created a new “SIP client widget”, which lazy loads the JavaScript SIP client library jssip. The widget can be configured as usual and allows setting the required SIP credentials.
To use it, you simply put it on the main page that is usually shown on your tablet. Currently it shows a door icon and a dot indicating the SIP status (red=disconnected, orange=connected but unregistered, green=registered).
When a call comes in, a (fullscreen) popup is opened showing an image - which is meant to be a “live” mjpeg image from the front door - and the tablet rings. After accepting the “call” you can send a DTMF sequence to open the door lock.
See some screenshots below.
no SIP video yet (I’m currently using a mjpeg stream from my front door camera to see the video upfront (couldn’t get early media to work))
Framework7 keeps previous pages loaded in background which keeps the SIP client active
Thoughts:
only works when the page with the SIP widget is shown and with the tablet being awake, but I think this is ok for many/most tablet installations
requires a webrtc capable PBX, e.g. asterisk (popular german FritzBox alone won’t do). Setup is not very complicated, but requires HTTPS to be set up
since it requires JS it needs to be shipped with OH (TMK)
with multiple tablets this could also be used as intercom. Though, in order to use different registrations for each device, the credentials need to be stored somehow in local browser storage
for this (and others) SIP video could also be added
Great to see someone playing with this. Check out this github request here as it should be possible and it may be what you have already have working, to use a widget to side load a webRTC connection to play a RTSP stream.
There are webrtc javascript players for both RTSP and also HLS streams. Should be simple if you know how to side load the javascript players that people embed into websites.
I noticed if you use oh-webframe instead of oh-image to show camera’s mjpeg stream then the connection closes if you set url to "". When using oh-image the connection stays open even the src is set to "".
Maybe this helps a little bit.
I am no developer and started looking for an intercom solution. If you finished that widget that would be fantastic!
So, I extended and finished the first version of this SIP widget.
Changes:
It can now be used as intercom (i.e. outgoing calls).
I think I found a neat way to solve this: To set the individual credentials for a device you just long-touch the widget on that device and it will open a configuration popup, whose values will be saved to local browser storage (I (ab)used the WidgetConfigPopup for this). Since F7 doesn’t cover this for long mouse presses, the same popup will be shown when you click the widget in edit mode.
The local config also allows you to individually define call destinations for up to 4 (quick) dial buttons
I was able to fix this by using F7’s pageBeforeOut event, instead of Vue’s lifecycle hooks.
Outstanding:
video support
“announcement” mode: make announcement to another or all stations (technically an auto-answer on the announcement clients). Could be used to speak to other rooms or floors, e.g. to announce “lunch is ready!”
I think it’s ready in its first version, so I’ll open a pull request soon.
Thank you for taking this up! By now I didn’t quite find the time to test and finish it properly. Perhaps I can at least find some time to have a look at your improvements.
your work here made it much easier for me to get a starting point.
My PR includes a much more general SIP Client component and card widget, that is just for phoning with one number and no intercom functionality between multiple openHAB clients.
I already got @digitaldan at the PR for some testing, but would be great if you could also review.
I am currently try to build the latest version of openhab/openhab-webui to do some further development (with blockly).
However when I run “npm start” on the clean checkout (even on main and not my branch) and then call http://localhost:8080/it throws an error related to jssips as follows:
I am hesitant to run npm update because @ysc told me once to be very careful with it (it will not run through anyway because of some mismatch in echarts…
Note, I am running the frontend against the backend which is on version openHAB 3.4.0.M1
Does anyone know why I get this error and how I can fix this to start development?
Hi Stefan,
Just a guess: Perhaps you just forgot to run ‘npm install’ for your node_modules to reflect the changed package.json (and thereby get the jssip module installed)?
You might have mixed up something:
When you run npm install (without any arguments), all modules will get installed as recorded in the package-lock.json file. This is required whenever the modules change and is safe to run. It’s actually THE mechanism to ensure everybody has the very same module tree installed.
It’s much different from npm update [<package>], which either updates the provided package including(!) its dependencies if required, or all packages. After this your modules will have different versions and your setup might become broken.
How to setup Asterisk for WebRTC and how to troubleshoot the connection? Installed and enabled WebRTC in Asterisk, enabled WebRTC in browser, both Openhab and Asterisk tell me that calls not supported in browser.
Hi guys,
First of all, many thanks to everyone involved for this great extension!
I just have one request, could someone redesign the widget ?
It’s not nice to have to drag the widget big enough to see something when the video is activated
It would be better to keep the widget simple and small (only the status symbol of the handset), only after answering the call should a popup pop up with the actual video, with the option to end the call or open the door via dtmf.
I’ve already opened an issue that clarifies the design issue