Fixes #1058 Send inactive CSN when user switches tab

CHANGES.md

@@ -7,6 +7,7 @@
 - Don't show duplicate notification messages
 - New config setting [show_images_inline](https://conversejs.org/docs/html/configuration.html#show-images-inline)
 - #537 Render `xmpp:` URI as link
+- #1058 Send an inactive chat state notification when the user switches to another tab 
 - #1062 Collapse multiple join/leave messages into one
 - #1063 URLs in the topic / subject are not clickable
 - #1140 Add support for destroyed chatrooms

dist/converse.js

@@ -61157,7 +61157,11 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
 
       function onWindowStateChanged(data) {
         if (_converse.chatboxviews) {
-          _converse.chatboxviews.each(view => view.onWindowStateChanged(data.state));
+          _converse.chatboxviews.each(view => {
+            if (view.model.get('id') !== 'controlbox') {
+              view.onWindowStateChanged(data.state);
+            }
+          });
         }
       }
 
@@ -62382,8 +62386,21 @@ var __WEBPACK_AMD_DEFINE_FACTORY__, __WEBPACK_AMD_DEFINE_ARRAY__, __WEBPACK_AMD_
         },
 
         onWindowStateChanged(state) {
-          if (this.model.get('num_unread', 0) && !this.model.isHidden()) {
-            this.model.clearUnreadMsgCounter();
+          if (state === 'visible') {
+            if (!this.model.isHidden()) {
+              this.setChatState(_converse.ACTIVE);
+
+              if (this.model.get('num_unread', 0)) {
+                this.model.clearUnreadMsgCounter();
+              }
+            }
+          } else if (state === 'hidden') {
+            this.setChatState(_converse.INACTIVE, {
+              'silent': true
+            });
+            this.model.sendChatState();
+
+            _converse.connection.flush();
           }
         }
 

src/converse-chatview.js

@@ -91,7 +91,11 @@
 
             function onWindowStateChanged (data) {
                 if (_converse.chatboxviews) {
-                    _converse.chatboxviews.each(view => view.onWindowStateChanged(data.state));
+                    _converse.chatboxviews.each(view => {
+                        if (view.model.get('id') !== 'controlbox') {
+                            view.onWindowStateChanged(data.state);
+                        }
+                    });
                 }
             }
             _converse.api.listen.on('windowStateChanged', onWindowStateChanged);
@@ -1266,8 +1270,17 @@
                 },
 
                 onWindowStateChanged (state) {
-                    if (this.model.get('num_unread', 0) && !this.model.isHidden()) {
-                        this.model.clearUnreadMsgCounter();
+                    if (state === 'visible') {
+                        if (!this.model.isHidden()) {
+                            this.setChatState(_converse.ACTIVE);
+                            if (this.model.get('num_unread', 0)) {
+                                this.model.clearUnreadMsgCounter();
+                            }
+                        }
+                    } else if (state === 'hidden') {
+                        this.setChatState(_converse.INACTIVE, {'silent': true});
+                        this.model.sendChatState();
+                        _converse.connection.flush();
                     }
                 }
             });

src/converse-singleton.js

@@ -55,8 +55,8 @@
                     }
                     if (_converse.isSingleton()) {
                         const any_chats_visible = _converse.chatboxes
-                            .filter((cb) => cb.get('id') != 'controlbox')
-                            .filter((cb) => !cb.get('hidden')).length > 0;
+                            .filter(cb => cb.get('id') != 'controlbox')
+                            .filter(cb => !cb.get('hidden')).length > 0;
 
                         if (any_chats_visible) {
                             return !chatbox.get('hidden');