Initial Changes

modified webview window scale mode, background color, http allow, js allow

app/src/main/AndroidManifest.xml

@@ -22,6 +22,7 @@
             android:icon="@mipmap/ic_launcher"
             android:label="@string/app_name"
             android:supportsRtl="true"
+            android:usesCleartextTraffic="true"
             android:theme="@style/AppTheme">
         <receiver
                 android:name=".Receiver"

app/src/main/java/nl/rogro82/pipup/PiPupService.kt

@@ -117,7 +117,7 @@ class PiPupService : Service(), WebServer.Handler {
                 is FrameLayout -> overlay
                 else -> FrameLayout(this).apply {
 
-                    setPadding(20, 20, 20, 20)
+                    setPadding(0, 0, 0, 0)
 
                     val layoutFlags: Int = when {
                         Build.VERSION.SDK_INT >= Build.VERSION_CODES.O -> WindowManager.LayoutParams.TYPE_APPLICATION_OVERLAY

app/src/main/java/nl/rogro82/pipup/PopupView.kt

@@ -30,7 +30,7 @@ sealed class PopupView(context: Context, val popup: PopupProps) : LinearLayout(c
             minimumWidth = 240
         }
 
-        setPadding(20,20,20,20)
+        setPadding(0,0,0,0)
 
         val title = findViewById<TextView>(R.id.popup_title)
         val message = findViewById<TextView>(R.id.popup_message)
@@ -168,19 +168,27 @@ sealed class PopupView(context: Context, val popup: PopupProps) : LinearLayout(c
     }
 
     private class Web(context: Context, popup: PopupProps, val media: PopupProps.Media.Web): PopupView(context, popup) {
+        private lateinit var webView: WebView
         init { create() }
 
         override fun create() {
             super.create()
 
             val frame = findViewById<FrameLayout>(R.id.popup_frame)
-            val webView = WebView(context).apply {
+            webView = WebView(context).apply {
                 with(settings) {
                     loadWithOverviewMode = true
                     useWideViewPort = true
+                    javaScriptEnabled = true
+                    domStorageEnabled = true
+                    mediaPlaybackRequiresUserGesture = false
+                    //  allowContentAccess = true
                 }
                 loadUrl(media.uri)
             }
+            webView.setInitialScale(100)
+            webView.setBackgroundColor(Color.TRANSPARENT)
+
 
             val layoutParams = FrameLayout.LayoutParams(
                 media.width,
@@ -191,6 +199,12 @@ sealed class PopupView(context: Context, val popup: PopupProps) : LinearLayout(c
 
             frame.addView(webView, layoutParams)
         }
+
+        override fun destroy() {
+            try {
+                webView.destroy();
+            } catch(e: Throwable) {}
+        }
     }
 
     companion object {

app/src/main/res/layout/popup.xml

@@ -3,10 +3,10 @@
 
     <FrameLayout
             android:layout_width="match_parent"
-            android:layout_height="match_parent" android:id="@+id/popup_frame"
-            android:paddingBottom="3dp"
-            android:paddingTop="3dp">
-    </FrameLayout>
+            android:layout_height="match_parent"
+            android:id="@+id/popup_frame"
+            android:paddingBottom="0dp"
+            android:paddingTop="0dp"></FrameLayout>
     <TextView
             android:layout_width="match_parent"
             android:layout_height="wrap_content"

home_assistant.md

@@ -0,0 +1,140 @@
+# AndroidTV/FireTV Notifications From Frigate
+
+Here is how I setup FireTV notivications in Home Assistant automation to stream a camera feed from Frigate.
+
+
+### Background
+I first followed this [excellent write up from Sean](https://seanblanchfield.com/2022/03/realtime-pip-cameras-on-tv-with-home-assistant). The WebRTC stream was difficult to set up and was to slow to load on my FireTV (3 seconds).
+
+I started looking into using [Frigate's MJPEG Streams](https://docs.frigate.video/integrations/api/#get-apicamera_name), which required modifing the APK to allow non SSL sites. I then expanded this code base to support Javascript for those who want to still use WebRTC and better handling of closing of the WebView.
+
+# Install APK
+
+Install [ADB](https://www.xda-developers.com/install-adb-windows-macos-linux/#adbsetup) on your computer
+
+Enable Developer Options on your AndroidTV/[FireTV](https://www.xda-developers.com/how-to-access-developer-options-amazon-fire-tv/)
+
+Download the APK from the [release page](https://github.com/desertblade/PiPup/releases)
+
+In a Terminal run the following commands to install the APK:
+
+``` terminal
+./adb connect FIRETV_IP
+
+./adb install app-debug.apk
+
+./adb shell appops set nl.rogro82.pipup SYSTEM_ALERT_WINDOW allow
+```
+
+Windows users probably don't need the ./
+
+Fire up the App on the FireTV. If you want to test it there are good instrcutions in the write up above.
+
+# Home Assistant 
+
+## Rest Commands
+I am using the same ones in Sean's writeup. 
+
+In the configuration.yaml add this line in the bottom (obvs if you don't already have it)
+
+``` yaml
+rest_command: !include rest_commands.yaml
+```
+
+Then add the following to rest_commands.yaml
+``` yaml
+pipup_image_on_tv:
+  # Use Pipup to display image notifications on Android TV devices.
+  url: http://ANDROID_TV_IP_ADDRESS: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(10) }},
+      "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 PipUp to display web pages/videos
+  url: http://ANDROID_TV_IP_ADDRESS: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(10) }},
+      "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) }}
+        }
+      }
+    }
+```
+
+## Automation
+
+Using MJPEG streams from Frigate I found the fastest to load.
+
+Here is the automation I use. Change media_player.firetv_cube to your device and update the Frigate URL IPs and Cameras.
+
+``` yaml
+- alias: Doorbell Person Alerts
+  trigger:
+    platform: mqtt
+    topic: frigate/events
+  condition:
+    # Only if the FireTV is On
+    - "{{states('media_player.firetv_cube') != 'off'}}"
+    # To reduce duplicate alerts, only every 60 seconds
+    - '{{ (as_timestamp(now()) - as_timestamp(states.automation.doorbell_person_alerts.attributes.last_triggered, 0 ) | int > 60)}}'
+    #Only show for a person and on doorbell camera
+    - "{{ trigger.payload_json['after']['label'] == 'person' }}"
+    - "{{ trigger.payload_json['after']['camera'] == 'doorbell' }}"
+  action:
+  # Make sure PipUp is running
+    - service: androidtv.adb_command                         
+      data:                            
+        entity_id: media_player.firetv_cube                   
+        command: ps -ef | grep -v grep | grep pipup || am start nl.rogro82.pipup/.MainActivity
+  # This will exit the screensaver
+    - service: androidtv.adb_command
+      data:
+        entity_id: media_player.firetv_cube
+        command: input keyevent KEYCODE_WAKEUP
+    - service: rest_command.pipup_url_on_tv
+      data:
+        title: Front Door
+        message: Live Stream of Doorbell
+        width: 360
+        height: 200
+        url: 'http://192.168.X.XX:5000/api/doorbell'
+```
+
+Once Automation is saved and loaded you can manually trigger it from the Admin page in Home Assistant to test.

readme.md

@@ -2,10 +2,17 @@
 
 PiPup is an application that allows displaying user-defined custom notifications on Android TV.
 
+__This Fork adds Javascript support, Allows insecure connections (HTTP), and better closing of the webview, which should kill connections to the server.__
+
+[Home Assistant Automation using Frigate](home_assistant.md)
+
+APK can be found here: https://github.com/desertblade/PiPup/releases
+
 The most common use-case for this application is for sending notifications, from a home-automation solution, to your Android TV.
 
 ![](https://github.com/rogro82/PiPup/raw/master/graphics/screenshot-1.png)
 
+
 __Some example scenarios:__
 
 - Show a snapshot of your camera on your TV (eg on a motion trigger)
@@ -105,4 +112,4 @@ Form-fields:
 | 3     | BottomLeft  |
 | 4     | Center      |
 
-Color-properties are in `[AA]RRGGBB` where the alpha channel is optional e.g. #FFFFFF or #CCFFFFFF
+Color-properties are in `[AA]RRGGBB` where the alpha channel is optional e.g. #FFFFFF or #CCFFFFFF