Jump to content
Guides for the Forum Read more... ×
Poradniki na Forum Read more... ×
Sankotronic

[TUTORIAL] Popup notifications and custom images

Recommended Posts

Popup notifications and custom images

 

Here is short tutorial how to change default icons on popup notifications using icons added to our HC gateways. As you all know popup notifications can be very useful since they can be found in Fibaro application Notifications inbox as shown on the following picture:

 

Please login or register to see this attachment.

Unfortunately popup messages does not give any sound when received but they stay in that inbox waiting for us to see them. Positive side of this type of notifications is that they can contain exact time when they where sent by some process and have long and informative message with title, subtitle, icon and different frame color depending on type of the notification. Here is basic code that is used to send popup notifications that will be shown on all mobile devices that are included into the HC system:

Please login or register to see this code.

Notice that in above code we can define type of the popup notification and it is set to "Info" that gives popup message blue frame we can define also next types of popup notification:

  • Info         - blue color frame
  • Success - green color frame
  • Warning - yellow color frame
  • Critical   - red color frame

If you run above code and only change type you will get following popup notifications:

Please login or register to see this attachment.

Please login or register to see this attachment.

Please login or register to see this attachment.

Please login or register to see this attachment.

 

On above pictures you can see that default icons change depending on type of the notification, but they are not really good enough and in most cases we like to have more informative icon like that nice red flashing light for burglar alarm for example:

Please login or register to see this attachment.

On above picture you can also see that only one button is defined and that sceneId is equal to 0 what means that no scene will be triggered when button is pressed. It is possible to have more than one button and also it is possible to set so that scene with defined ID is triggered if button is pressed. See code bellow:

Please login or register to see this code.

Running above code will result in following popup notification:

Please login or register to see this attachment.

WOW, from above picture and code you can see that this popup notification not only have custom image but also have two buttons giving us possibility to make choice to either disarm alarm by pressing button Disarm which will then trigger scene with ID 177 or just close notification by pressing Cancel button.

 

And now finally how to get URL path to custom icons that are already loaded to HC2 so that they can be shown on popup messages? It is quite simple. Just right click on icon anywhere on the web GUI and then on open menu select following option depending on browser you use:

 

On Safari:

Please login or register to see this attachment.

 

On Chrome:

Please login or register to see this attachment.

 

On Firefox:

Please login or register to see this attachment.

 

And paste that URL to your LUA code. TADA! Thats it!

Enjoy your popup notifications with your icons!! :-) 

 

NOTE: Above solution with copying image address works only when mobile devices are connected locally on your home network! If you are away from home then you will not see your custom icons on popup notifications!

 

So what to do to get custom icons on popup messages always no matter are you connected to HC locally or remotely?

 

Well, answer is simple, you need to put your icons on some server so that they can be downloaded by mobile application. Usually FTP server will be sufficient but what if you don't have any such space on internet and you don't want to open it?

 

Here is solution No. 1

 

DROPBOX

Arrange your custom icons in Dropbox folder. Now right click on icon and on popup menu select option "Copy Dropbox Link". This is same for all OS's, macOS and Windows. Now you can paste this link in your code and it will look like this:

Please login or register to see this code.

Since we need this icon to download to our app to be shown you need to change dl=0 to dl=1 so final link will look like this:

Please login or register to see this code.

When app needs to download icon first time there could be some short delay before icon is shown on popup notification. Each next occurrence will be instant because icons will be kept by the Fibaro app until it is closed on mobile device. At least I get that impression after using this feature for one day.

 

Enjoy coding! :-) 

 

 

 

Edited by Sankotronic
  • Like 1
  • Thanks 1

Share this post


Link to post
Share on other sites

@Sankotronic

 

Thanks for creating and sharing.

I have hardly used any popups and this is partially because I didn't know how they operate and what the possibilities were.

Your tutorial above demonstrates in very simple terms how to achieve this

 

-f

 

Edited by AutoFrank

Share this post


Link to post
Share on other sites
  • Topic Author
  • Hi @AutoFrank,

     

    Popup notifications are nice tool and it is pity that they don't have any sound when received. That is the biggest disadvantage but which have workaround. With popup I use push notifications because they have sound alert. Push notifications on the other hand biggest disadvantage is that they are deleted when app is open so they can't be rewieved.

     

    Anyway when popup and push are used together then they are powerful notification system. I have Apple watch on which I receive push notification and if it is something important then I grab my iPhone, open app and I can see on popup what happened and when! So in most cases this duo is nice way to know what is happening at home.

     

    Since popup notifications can be deleted only by superuser or admin, when I'm logged on application with my user account I can check them but not delete and I found this as advantage. This way at the end of the day I can check all events again to find issues. When I'm done I take my iPad on which I use superuser account and remove them from inbox.

     

    I only wish that Fibaro team add button Delete so that they can be removed all at once instead of clicking on OK button for each of them. I should actually put that sentence in Crowd's Ideas :) 

     

     

    Share this post


    Link to post
    Share on other sites

    @Sankotronic

    When i run your code i dont get "popContTitle" on my notifikation, see picture below

    I got samsung s5 

    HC:2 with latest beta

    Could it be because i take my icon from VD instead of scenes? 

     

    EDIT: Found out whts wrong some spelling misstake in your code ;)

    Please login or register to see this code.

    Please login or register to see this code.

    Please login or register to see this attachment.

    Edited by sonnyboy

    Share this post


    Link to post
    Share on other sites
  • Topic Author
  • 31 minutes ago, sonnyboy said:

     

    @Sankotronic

    When i run your code i dont get "popContTitle" on my notifikation, see picture below

    I got samsung s5 

    HC:2 with latest beta

    Could it be because i take my icon from VD instead of scenes? 

     

    EDIT: Found out whts wrong some spelling misstake in your code ;)

     

     

    Hi @sonnyboy,

     

    Thanks! I corrected typo.  I rushed and didn't test code after writing it. Usually I always test code I post but have some difficult times at the moment. Sorry :oops:

    Share this post


    Link to post
    Share on other sites

    any chance you can show us how to add a picture from a camera in the Notification? or if its even possible

    Share this post


    Link to post
    Share on other sites
    1 minute ago, amurray85 said:

    any chance you can show us how to add a picture from a camera in the Notification? or if its even possible

     

    If you post photo  in icons page  someone might photo shop it for you, They change it to certin size, cartoon it  and give it a  transperant background

    Share this post


    Link to post
    Share on other sites
    7 minutes ago, amurray85 said:

    any chance you can show us how to add a picture from a camera in the Notification? or if its even possible

     

    @amurray85

    Are you talking about a custom image for the top left or actually display an image captured from a camera in the notification itself (on the fly so to speak)

    Share this post


    Link to post
    Share on other sites
    1 minute ago, Jamie mccrostie said:

     

    If you post photo  in icons page  someone might photo shop it for you, They change it to certin size, cartoon it  and give it a  transperant background

    Hey Jamie,

    I meant if its a security breach - send a photo from a security camera in the alert

    Share this post


    Link to post
    Share on other sites
    Just now, amurray85 said:

    Hey Jamie,

    I meant if its a security breach - send a photo from a security camera in the alert

    Oh see what you mean

    1 minute ago, amurray85 said:

    Hey Jamie,

    I meant if its a security breach - send a photo from a security camera in the alert

     

    Ive readabout that somewhere ill have a think

    Share this post


    Link to post
    Share on other sites
    6 minutes ago, amurray85 said:

    thanks ... the call is something like fibaro:call(179, "sendPhotoToUser", "2")

     

    It would email it prob

    Share this post


    Link to post
    Share on other sites
    5 minutes ago, amurray85 said:

    yeah it does

    Please login or register to see this attachment.

    Edited by Jamie mccrostie

    Share this post


    Link to post
    Share on other sites

    @Sankotronic, does this popup scene works for regular Fibaro user (not superuser) too. I found out, but it was long ago, that this is not worked for regular user (e.g. user child).

    Edited by jakub.jezek

    Share this post


    Link to post
    Share on other sites
  • Topic Author
  • 18 minutes ago, jakub.jezek said:

    @Sankotronic, does this popup scene works for regular Fibaro user (not superuser) too. I found out, but it was long ago, that this is not worked for regular user (e.g. user child).

     

    It is showing on all devices connected to HC. On last version of app all users can delete them while in older versions only superuser was able to delete them, but all users receive them.

    Share this post


    Link to post
    Share on other sites
    Just now, Sankotronic said:

     

    It is showing on all devices connected to HC. On last version of app all users can delete them while in older versions only superuser was able to delete them, but all users receive them.

     

    Thanks for an info. I know it did not worked for regular user till Interactive push notification feature appeared.

    Share this post


    Link to post
    Share on other sites

    Create an account or sign in to comment

    You need to be a member in order to leave a comment

    Create an account

    Sign up for a new account in our community. It's easy!

    Register a new account

    Sign in

    Already have an account? Sign in here.

    Sign In Now

    ×