Working example of popup auto closure

[flick116]

Can we have a documented example of how to setup the popup auto close function. I have tested using the following defined on TYPES.POPUP and it is not working:

                         action: function (item, entity) {
                         this.$scope.openPopup(item, entity);
                         setTimeout(function () {
                           this.$scope.closePopup();
                         }, '1000');},

The popup opens as expected and after the timeout of 1 second the following error is seen on the screen and in the browser console and the popup does not close:

Uncaught TypeError: Cannot read property 'closePopup' of undefined

[FaiekA]

Hi , Any assistance on this would be great, have been struggling with this for a while, to no avail. My tileboard is made up of popups and this will really assist.

                                            action: function (item, entity) {
                                               this.$scope.entityClick({}, item, entity); 
                                               setTimeout(function () {
                                                  this.$scope.closePopup();
                                               }, '5000');}

I tried this as well but no luck. An example would super. Thanks...

[FaiekA]

@flick116 Hi - I managed to get it work , I'm sure that this is probably not correct, but does work with a small issues it seems - whereby the popup would close unexpectedly if you go back within the 5 seconds.

{
  position: [0, 1],
  type: TYPES.POPUP,              
  id: {},
  icon: "mdi-home-group",
  title: "Home Scenes",
  customStyles: {
  "background-color": "#7dba81",},            
  height: 1,
  state: false,       
  popup: {
    tileSize: 100,
    items: [
{
    position: [0, 0],
    width: 2,
    title: "Guest Mode",
    classes: [CLASS_BIG],
    type: TYPES.INPUT_BOOLEAN,                  
    id: "input_boolean.guest_mode",
    icons: {
          on: "mdi-account-multiple-plus",
          off: "mdi-account-multiple-outline",
},
    customStyles: function (item, entity) {
    if (entity.state === "off") {
    return { backgroundColor: "#898c80" };
    } else {
    return { backgroundColor: "red" };
    }
},
    states: {
      on: "Guests",
      off: "No Guests",
    },  
    state: function (item, entity) {
    this.$scope.entityClick.bind(this); 
    setTimeout(this.$scope.closePopup.bind(this), 5000); },
},

        ],  

},
},

I requested help on the Q&A and hoping to get some help #758 Hope this helps in the interim.

[flick116]

That's great - I'll give that a test. Thanks for this

[Erelen-Laiquendi]

Solution:

action: function (item, entity) {
   this.$scope.openPopup(item, entity);
   this.$scope.popupTimeout = setTimeout(function () {
      this.$scope.closePopup();
   }.bind(this), 5 * 1000);
},

[FaiekA]

@Erelen-Laiquendi - Thanks a mill this works - flawlessly Finally - thanks again