A short guide for setting up TV PiP notifications (with PiPup)

Hi there!
Below is a short guide for setting up PIP notifications on your Android TV / Google TV (and others, as long as base OS is android and you can install additional apps).

Sources I used:

Important information:

I will be using this fork of PiPup (as original is no longer maintained): https://github.com/desertblade/PiPup

So, the tutorial:

Installing PiPup

  1. Download ADB drivers (Platform-Tools) for the device you’re using from here. On windows you just unzip the file, open terminal there and everything should work. People using linux - you know what to do.
  2. Enable ADB and connect to the TV: follow this, it’s way better than what I can write.
  3. Download Pipup from here (app-debug.apk file). Put it in the directory with ADB drivers
  4. In the terminal you have open run: adb sideload app-debug.apk (you must already be connected to TV, so don’t forget adb connect <IP> from the last step)
  5. Grant needed permission with: adb shell appops set nl.rogro82.pipup SYSTEM_ALERT_WINDOW allow
  6. Open the app on your TV, you can close it pretty much immediately, it just needs to run in the background

Testing connection

  1. In the ADB directory create post.json with following contents:
{
	    "duration": 30,
	    "position": 0,
	    "title": "Your awesome title",
	    "titleColor": "#0066cc",
	    "titleSize": 20,
	    "message": "What ever you want to say... do it here...",
	    "messageColor": "#000000",
	    "messageSize": 14,
	    "backgroundColor": "#ffffff",
	    "media": { 
	        "image": {
	            "uri": "https://mir-s3-cdn-cf.behance.net/project_modules/max_1200/cfcc3137009463.5731d08bd66a1.png", 
	            "width": 480
	        }
	    }
	}
  1. run curl -d "@post.json" -H "Content-Type: application/json" -X POST http://<IP>:7979/notify. Don’t forget to change the IP! Correct one is shown in the PiPup app on the TV.

You should see a popup on the TV, great!

Configuring Home Assistant

  1. Add this to your configuration.yaml: rest_command: !include rest_commands.yaml
  2. In HA’s config directory create rest_commands.yaml with following contents:
pipup_text_on_tv:
  # Use Pipup to display image notifications on Android TV devices.
  url: http://{{ ip }}:{{ port | default(7979) }}/notify
  content_type: 'application/json'
  verify_ssl: false
  method: 'post'
  timeout: 20
  payload: >
    {
      "duration": {{ duration | default(20) }},
      "position": {{ position | default(0) }},
      "title": "{{ title | default('') }}",
      "titleColor": "{{ titleColor | default('#50BFF2') }}",
      "titleSize": {{ titleSize | default(12) }},
      "message": "{{ message }}",
      "messageColor": "{{ messageColor | default('#fbf5f5') }}",
      "messageSize": {{ messageSize | default(14) }},
      "backgroundColor": "{{ backgroundColor | default('#0f0e0e') }}"
    }

pipup_image_on_tv:
  # Use Pipup to display image notifications on Android TV devices.
  url: http://{{ ip }}:{{ port | default(7979) }}/notify
  content_type: 'application/json'
  verify_ssl: false
  method: 'post'
  timeout: 20
  payload: >
    {
      "duration": {{ duration | default(20) }},
      "position": {{ position | default(0) }},
      "title": "{{ title | default('') }}",
      "titleColor": "{{ titleColor | default('#50BFF2') }}",
      "titleSize": {{ titleSize | default(12) }},
      "message": "{{ message }}",
      "messageColor": "{{ messageColor | default('#fbf5f5') }}",
      "messageSize": {{ messageSize | default(14) }},
      "backgroundColor": "{{ backgroundColor | default('#0f0e0e') }}",
      "media": { 
        "image": {
          "uri": "{{ url }}",
          "width": {{ width | default(640) }}
        }
      }
    }

pipup_url_on_tv:
  # Use with Webrtc camera as described here:
  # https://github.com/AlexxIT/WebRTC/wiki/Cast-or-share-camera-stream#html-page
  url: http://{{ ip }}:{{ port | default(7979) }}/notify
  content_type: 'application/json'
  verify_ssl: false
  method: 'post'
  timeout: 20
  payload: >
    {
      "duration": {{ duration | default(20) }},
      "position": {{ position | default(0) }},
      "title": "{{ title | default('') }}",
      "titleColor": "{{ titleColor | default('#50BFF2') }}",
      "titleSize": {{ titleSize | default(12) }},
      "message": "{{ message }}",
      "messageColor": "{{ messageColor | default('#fbf5f5') }}",
      "messageSize": {{ messageSize | default(14) }},
      "backgroundColor": "{{ backgroundColor | default('#0f0e0e') }}",
      "media": { 
        "web": {
          "uri": "{{ url }}", 
          "width": {{ width | default(640) }},
          "height": {{ height | default(480) }}
        }
      }
    }
  1. Save everything and restart Home Assistant

Testing

You should now be able to navigate to Developer Tools, Services. Chose rest_command.pipup_text_on_tv, enable YAML mode and paste the following:

service: rest_command.pipup_text_on_tv
data:
  ip: <IP>
  title: PiPup
  message: Notifications are working!

You should see a popup appear on the TV

Customization

Below are the things you can change quite in the service data:

  • ip
  • port
  • duration
  • position
  • title
  • titleColor
  • titleSize
  • message
  • messageColor
  • backgroundColor
  • url
  • width
  • height

an explanation of most of them can be found here

13 Likes

Thank you,. works great!!

How to use with image and URL exemple please

The docs, read the docs GitHub - desertblade/PiPup: Enhanced notifications for Android TV

I’m using it to show a snapshot of my doorbell:

service: camera.snapshot
data:
  filename: /config/www/tmp/image.png
target:
  entity_id: camera.cameraname
service: rest_command.pipup_image_on_tv
data:
  ip: x.x.x.x
  title: Home Assistant
  message: Doorbell pressed!
  url: <external_url>/local/tmp/image.png

Hi,

works fine for me.
Also the tutorial is really nice and works perfectly fine.

I am not getting the image shown, this should be the snapshot, done some seconds before.

I use the following path to access the picture for sending it via telegram, so i am sure it should be accessible

/media/Medien/aufnahmen/eingang/eingang_newest_briefkasten.jpg

Any Idea why it is not showing ?

Thanks in advance

Unsure if that should work, but you could use the frigate API endpoints like the blueprint does

The TV needs to be able to access the image. So the URL needs to be accessible on your LAN, not just in HA. /media doesn’t exist on your network. See my example for a valid path you could use to store the snapshot and show it.

Notifications to Telegram are probably pushed with the image attached locally within HA.

Oh, i see.
Thanks.

I just installed the go2rtc as docker on my server, this works now perfectly fine.
Still no image, but the stream is so fast that is does the same trick, just for 10 seconds.

Thank you very much

Thank you for posting this, works great on my NVIDIA Shield.

One note, on my Sony Bravia Google TV I had to use adb install instead of adb sideload.

2 Likes

Can you please post the syntax for go2rtc stream for a camera. I have reolink doorbell. I installed the docker for it as well.

I was able to get the image using external URL.

service: camera.snapshot
data:
  filename: /config/www/reolink_doorbell.png
target:
  entity_id:
    - camera.reolink_doorbell_sub

   service: rest_command.pipup_image_on_tv
data:
  ip: x.x.x.x
  title: Front Door Alert!
  message: Person at Frontdoor
  url: https://externalurl.duckdns.org/local/reolink_doorbell.png

You can find this on the go2rtc dashboard. Click links next to the stream you want to use and you will see a list of possible URLs to use. Typically the first generic stream.html or the stream.html for WebRTC will work.

Screenshots below for reference:
go2rtc_dashboard

Can anyone post a screenshot of what this looks like on Android TV when the camera feed pops up? Such as for a doorbell notification?

I really want to see if it’s worth the trouble of configuring on my ShieldTV. I also have any AppleTV and the camera integration there is great.

Also, any good solutions for AndroidTV to browse all camera feeds at once on a grid and select between them? Anything that runs in the background that can be instantly called up from a button on the remote instead of exiting app and going to open another app from the launcher?

I’d like to do the same, I’m able to generate the snapshot but when I try to send the image on the TV doesn’t show nothing, just a black rectangle.

service: rest_command.pipup_image_on_tv
data:
url: http://192.168.1.89:8123/local/tmp/image.png

Do I need to set something else?

When you open that URL on your local network, can you see the image on any other device?

This is what it looks like for me:

pipup_home_assistant

I’m not away of any more sophisticated solutions that would allow you to browser between feeds in a popup.

I only noticed this thread recently, and have just updated my original post with instructions to use the desertblade fork, as instructed here. Thanks for the info.

I also noticed that I added code to my automation at some point to start PiPup if necessary by sending an ADB command. Details instructions are now at the bottom of my original post.

Thanks, this way it works a lot faster than before. And the video also works, just need to pause the TV first, so the video actually loads. Somehow the Sony Google TV doesn’t play the video in the pop-up if anything else is playing on the TV.

Sadly, it differs per app how it responds, protected media won’t allow it at all. Need to be back on Home Screen for it to show the video. So for example Disney+, Netfix and HBO Max won’t load the video on top of the player.

Popping up an image with frame.jpeg does work well on all apps and loads instantly.

So I’ve now set it up that it first sends the ‘HOME’ command and then pushes the URL with video and that seems to work every time.

Hi is it possible to make an sound notification together with the alert?

Is it possible that you can’t install apps via sideload on the Google Chromecast HD with Android 12? I tried it via ADB and got an error message. I then tried to transfer the file and install it with a file manager, but then I get the error message that apps from unknown sources are not allowed to be installed. Can’t change this anywhere in the settings. It has been mentioned in various forums that the request for authorization comes directly in the app when installing the app, but such a message does not appear here