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