Merge remote-tracking branch 'origin/master'

CHANGES.md

@@ -17,6 +17,10 @@
   and private chats with a URL fragment such as `#converse/chat?jid=user@domain`
 - #828 Add routing for the `#converse/login` and `#converse/register` URL
   fragments, which will render the registration and login forms respectively.
+- New configuration setting [view_mode](https://conversejs.org/docs/html/configurations.html#view-mode)
+  This removes the need for separate `inverse.js` and `converse-mobile.js`
+  builds. Instead the `converse.js` build is now used with `view_mode` set to
+  `fullscreen` and `mobile` respectively.
 
 ### UX/UI changes
 - Use CSS3 fade transitions to render various elements.

Makefile

@@ -160,10 +160,6 @@ BUILDS = dist/converse.js \
 		 dist/converse.min.js \
 		 dist/converse-esnext.js \
 		 dist/converse-esnext.min.js \
-		 dist/inverse.js \
-		 dist/inverse.min.js \
-		 dist/converse-mobile.js \
-		 dist/converse-mobile.min.js \
 		 dist/converse-muc-embedded.js \
 		 dist/converse-muc-embedded.min.js \
 		 dist/converse-no-jquery.js \
@@ -179,10 +175,6 @@ dist/converse-esnext.js: src node_modules *.js
 	$(RJS) -o src/build-esnext.js include=converse out=dist/converse-esnext.js optimize=none 
 dist/converse-esnext.min.js: src node_modules *.js
 	$(RJS) -o src/build-esnext.js include=converse out=dist/converse-esnext.min.js
-dist/inverse.js: transpile src node_modules *.js
-	$(RJS) -o src/build-inverse.js include=inverse out=dist/inverse.js optimize=none 
-dist/inverse.min.js: transpile src node_modules *.js
-	$(RJS) -o src/build-inverse.js include=inverse out=dist/inverse.min.js
 dist/converse-no-jquery.js: transpile src node_modules *.js
 	$(RJS) -o src/build.js include=converse wrap.endFile=end-no-jquery.frag exclude=jquery exclude=jquery.noconflict out=dist/converse-no-jquery.js optimize=none 
 dist/converse-no-jquery.min.js: transpile src node_modules *.js transpile
@@ -191,10 +183,6 @@ dist/converse-no-dependencies.js: transpile src node_modules *.js
 	$(RJS) -o src/build-no-dependencies.js optimize=none out=dist/converse-no-dependencies.js
 dist/converse-no-dependencies.min.js: transpile src node_modules *.js
 	$(RJS) -o src/build-no-dependencies.js out=dist/converse-no-dependencies.min.js
-dist/converse-mobile.js: transpile src node_modules *.js
-	$(RJS) -o src/build.js paths.converse=src/converse-mobile include=converse out=dist/converse-mobile.js optimize=none 
-dist/converse-mobile.min.js: transpile src node_modules *.js
-	$(RJS) -o src/build.js paths.converse=src/converse-mobile include=converse out=dist/converse-mobile.min.js
 dist/converse-muc-embedded.js: transpile src node_modules *.js
 	$(RJS) -o src/build.js paths.converse=src/converse-embedded include=converse out=dist/converse-muc-embedded.js optimize=none 
 dist/converse-muc-embedded.min.js: transpile src node_modules *.js

docs/source/configuration.rst

@@ -339,6 +339,60 @@ For example::
 
     `[{'jid': 'room@example.org', 'nick': 'WizardKing69' }]`
 
+
+blacklisted_plugins
+-------------------
+
+* Default: ``[]`` (``['converse-minimize', 'converse-dragresize']`` for inVerse)
+
+A list of plugin names that are blacklisted and will therefore not be
+initialized once ``converse.initialize`` is called, even if the same plugin is
+whitelisted.
+
+From Converse.js 3.0 onwards most of the API is available only to plugins and
+all plugins need to be whitelisted first.
+
+The usecase for blacklisting is generally to disable removed core plugins
+(which are automatically whitelisted) to prevent other (potentially malicious)
+plugins from registering themselves under those names.
+
+The core, and by default whitelisted, plugins are::
+
+    converse-bookmarks
+    converse-chatview
+    converse-controlbox
+    converse-core
+    converse-dragresize
+    converse-headline
+    converse-mam
+    converse-minimize
+    converse-muc
+    converse-notification
+    converse-otr
+    converse-ping
+    converse-register
+    converse-rosterview
+    converse-vcard
+
+An example from `the embedded room demo <https://conversejs.org/demo/embedded.html>`_
+
+.. code-block:: javascript
+
+    require(['converse-core', 'converse-muc-embedded'], function (converse) {
+        converse.initialize({
+            // other settings removed for brevity
+            blacklisted_plugins: [
+                'converse-controlbox',
+                'converse-dragresize',
+                'converse-minimize',
+                'converse-vcard'
+            ],
+        });
+    });
+
+
+
+
 .. _`bosh-service-url`:
 
 bosh_service_url
@@ -1296,55 +1350,51 @@ support.
 .. note::
     Converse.js does not yet support "keepalive" with websockets.
 
-blacklisted_plugins
--------------------
 
-* Default: ``[]`` (``['converse-minimize', 'converse-dragresize']`` for inVerse)
+view_mode
+---------
 
-A list of plugin names that are blacklisted and will therefore not be
-initialized once ``converse.initialize`` is called, even if the same plugin is
-whitelisted.
+* Default: ``overlayed``
+* Allowed values: ``overlayed``, ``fullscreen``, ``mobile``
 
-From Converse.js 3.0 onwards most of the API is available only to plugins and
-all plugins need to be whitelisted first.
+The ``view_mode`` setting configures converse.js's mode and resulting behavior.
 
-The usecase for blacklisting is generally to disable removed core plugins
-(which are automatically whitelisted) to prevent other (potentially malicious)
-plugins from registering themselves under those names.
+Before the introduction of this setting (in version 3.3.0), there were there
+different builds, each for the diffent modes.
 
-The core, and by default whitelisted, plugins are::
+These were:
 
-    converse-bookmarks
-    converse-chatview
-    converse-controlbox
-    converse-core
-    converse-dragresize
-    converse-headline
-    converse-mam
-    converse-minimize
-    converse-muc
-    converse-notification
-    converse-otr
-    converse-ping
-    converse-register
-    converse-rosterview
-    converse-vcard
+* ``converse.js`` for the ``overlayed`` mode
+* ``converse-mobile.js`` for the ``mobile`` mode
+* ``inverse.js`` for the ``fullscreen`` mode
 
-An example from `the embedded room demo <https://conversejs.org/demo/embedded.html>`_
+Besides having three different builds, certain plugins had to be whitelisted
+and blacklisted for the different modes.
 
-.. code-block:: javascript
+``converse-singleton`` had to be whitelisted for the ``mobile`` and ``fullscreen``
+modes, additionally ``converse-inverse`` had to be whitelisted for the
+``fullscreen`` mode.
 
-    require(['converse-core', 'converse-muc-embedded'], function (converse) {
-        converse.initialize({
-            // other settings removed for brevity
-            blacklisted_plugins: [
-                'converse-controlbox',
-                'converse-dragresize',
-                'converse-minimize',
-                'converse-vcard'
-            ],
-        });
-    });
+For both those modes the ``converse-minimize`` and ``converse-dragresize``
+plugins had to be blacklisted.
+
+Since version 3.3.0, the last two builds no longer exist, and instead the
+standard ``converse.js`` build is used, together with the appropraite
+``view_mode`` value.
+
+Furthermore, it's no longer necessary to whitelist or blacklist any plugins.
+
+.. note::
+    Although the ``view_mode`` setting has removed the need for different
+    JavaScript builds, you'll still need to use different CSS files depending
+    on the view mode.
+
+    * For ``overlayed`` this is ``./css/converse.css``
+    * For ``fullscreen`` you need ``./css/inverse.css``
+    * For ``mobile`` you need to use both ``./css/converse.css`` and ``./css/mobile.css``
+
+    Hopefully in a future release the CSS files will be combined and you'll
+    only need ``converse.css``
 
 
 .. _`whitelisted_plugins`:

inverse.html

@@ -5,10 +5,10 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
     <title>inVerse</title>
     <link rel="shortcut icon" type="image/ico" href="css/images/favicon.ico"/>
-    <link type="text/css" rel="stylesheet" media="screen" href="https://cdn.conversejs.org/3.2.1/css/inverse.min.css" />
+    <link type="text/css" rel="stylesheet" media="screen" href="css/inverse.min.css" />
     <script type="text/javascript" src="inverse-analytics.js"></script>
     <noscript><p><img src="//stats.opkode.com/piwik.php?idsite=5" style="border:0;" alt="" /></p></noscript>
-    <script src="https://cdn.conversejs.org/3.2.1/dist/inverse.min.js"></script>
+    <script src="dist/converse.js"></script>
 </head>
 <body>
     <div class="content">
@@ -20,11 +20,10 @@
     converse.initialize({
         authentication: 'login',
         auto_away: 300,
-        blacklisted_plugins: ['converse-minimize', 'converse-dragresize'],
-        whitelisted_plugins: ['converse-inverse', 'converse-singleton'],
         auto_reconnect: true,
         bosh_service_url: 'https://conversejs.org/http-bind/', // Please use this connection manager only for testing purposes
         message_archiving: 'always',
+        view_mode: 'fullscreen'
     });
 </script>
 </body>

mobile.html

@@ -125,13 +125,8 @@
 <script>
     converse.initialize({
         bosh_service_url: 'https://conversejs.org/http-bind/', // Please use this connection manager only for testing purposes
-        message_carbons: true,
-        // Whitelist non-core plugins that we need
-        whitelisted_plugins: ['converse-singleton'],
-        // Blacklist plugins which aren't being used for mobile, so that
-        // other code cannot register their own plugins under those names.
-        blacklisted_plugins: ['converse-minimize', 'converse-dragresize'],
         show_controlbox_by_default: false,
+        view_mode: 'mobile'
     });
 </script>
 </html>

spec/notification.js

@@ -21,6 +21,7 @@
                         test_utils.createContacts(_converse, 'current');
                         spyOn(_converse, 'showMessageNotification');
                         spyOn(_converse, 'areDesktopNotificationsEnabled').and.returnValue(true);
+                        spyOn(_converse, 'isMessageToHiddenChat').and.returnValue(true);
                         
                         var message = 'This message will show a desktop notification';
                         var sender_jid = mock.cur_names[0].replace(/ /g,'.').toLowerCase() + '@localhost',
@@ -82,6 +83,7 @@
                             function (done, _converse) {
 
                         spyOn(_converse, 'showMessageNotification').and.callThrough();
+                        spyOn(_converse, 'isMessageToHiddenChat').and.returnValue(true);
                         spyOn(_converse, 'areDesktopNotificationsEnabled').and.returnValue(true);
                         var stanza = $msg({
                                 'type': 'headline',

src/config.js

@@ -54,7 +54,6 @@ require.config({
 
         // Converse
         "converse":                 "src/converse",
-        "inverse":                  "src/inverse",
 
         "converse-bookmarks":       "src/converse-bookmarks",
         "converse-chatboxes":       "src/converse-chatboxes",
@@ -64,7 +63,7 @@ require.config({
         "converse-disco":           "src/converse-disco",
         "converse-dragresize":      "src/converse-dragresize",
         "converse-headline":        "src/converse-headline",
-        "converse-inverse":         "src/converse-inverse",
+        "converse-fullscreen":      "src/converse-fullscreen",
         "converse-mam":             "src/converse-mam",
         "converse-minimize":        "src/converse-minimize",
         "converse-muc":             "src/converse-muc",

src/converse-core.js

@@ -70,6 +70,7 @@
         'converse-core',
         'converse-disco',
         'converse-dragresize',
+        'converse-fullscreen',
         'converse-headline',
         'converse-mam',
         'converse-minimize',
@@ -80,6 +81,7 @@
         'converse-register',
         'converse-roomslist',
         'converse-rosterview',
+        'converse-singleton',
         'converse-vcard'
     ];
 
@@ -325,6 +327,7 @@
             storage: 'session',
             strict_plugin_dependencies: false,
             synchronize_availability: true,
+            view_mode: 'overlayed', // Choices are 'overlayed', 'fullscreen', 'mobile'
             websocket_url: undefined,
             whitelisted_plugins: [],
             xhr_custom_status: false,

src/converse-dragresize.js

@@ -44,6 +44,10 @@
          */
         optional_dependencies: ["converse-headline"],
 
+        enabled (_converse) {
+            return _converse.view_mode == 'overlayed';
+        },
+
         overrides: {
             // Overrides mentioned here will be picked up by converse.js's
             // plugin architecture they will replace existing methods on the
@@ -53,7 +57,7 @@
 
             registerGlobalEventHandlers () {
                 const that = this;
-                
+
                 $(document).on('mousemove', function (ev) {
                     if (!that.resizing || !that.allow_dragresize) { return true; }
                     ev.preventDefault();

src/converse-inverse.js → src/converse-fullscreen.js

@@ -18,18 +18,11 @@
     "use strict";
     const { Strophe, _ } = converse.env;
 
-     function isMessageToHiddenChat (_converse, message) {
-        const jid = Strophe.getBareJidFromJid(message.getAttribute('from'));
-        const model = _converse.chatboxes.get(jid);
-        if (!_.isNil(model)) {
-            return model.get('hidden');
-        }
-        // Not having a chat box is assume to be practically the same
-        // as it being hidden.
-        return true;
-    }
+    converse.plugins.add('converse-fullscreen', {
 
-    converse.plugins.add('converse-inverse', {
+        enabled (_converse) {
+            return _.includes(['mobile', 'fullscreen'], _converse.view_mode);
+        },
 
         overrides: {
             // overrides mentioned here will be picked up by converse.js's
@@ -38,18 +31,6 @@
             //
             // new functions which don't exist yet can also be added.
 
-            areDesktopNotificationsEnabled () {
-                // Call with "ignore_hidden" as true, so that it doesn't check
-                // if the windowState is hidden.
-                return this.__super__.areDesktopNotificationsEnabled.call(this, true);
-            },
-
-            shouldNotifyOfMessage (message) {
-                const { _converse } = this.__super__;
-                const result = this.__super__.shouldNotifyOfMessage.apply(this, arguments);
-                return result && isMessageToHiddenChat(_converse, message);
-            },
-
             ControlBoxView: {
                  createBrandHeadingHTML() {
                     return tpl_brand_heading();
@@ -83,7 +64,7 @@
                 chatview_avatar_width: 44,
                 hide_open_bookmarks: true,
                 show_controlbox_by_default: true,
-                sticky_controlbox: true,
+                sticky_controlbox: true
             });
         }
     });

src/converse-minimize.js

@@ -42,6 +42,10 @@
          */
         optional_dependencies: ["converse-controlbox", "converse-muc"],
 
+        enabled (_converse) {
+            return _converse.view_mode == 'overlayed';
+        },
+
         overrides: {
             // Overrides mentioned here will be picked up by converse.js's
             // plugin architecture they will replace existing methods on the

src/converse-notification.js

@@ -70,6 +70,18 @@
                 return true;
             };
 
+            _converse.isMessageToHiddenChat = function (message) {
+                if (_.includes(['mobile', 'fullscreen'], _converse.view_mode)) {
+                    const jid = Strophe.getBareJidFromJid(message.getAttribute('from'));
+                    const model = _converse.chatboxes.get(jid);
+                    if (!_.isNil(model)) {
+                        return model.get('hidden') || _converse.windowState === 'hidden';
+                    }
+                    return true;
+                }
+                return _converse.windowState === 'hidden';
+            }
+
             _converse.shouldNotifyOfMessage = function (message) {
                 /* Is this a message worthy of notification?
                  */
@@ -83,11 +95,13 @@
                     return _converse.shouldNotifyOfGroupMessage(message);
                 } else if (utils.isHeadlineMessage(message)) {
                     // We want to show notifications for headline messages.
-                    return true;
+                    return _converse.isMessageToHiddenChat(message);
                 }
                 const is_me = Strophe.getBareJidFromJid(
                         message.getAttribute('from')) === _converse.bare_jid;
-                return !_converse.isOnlyChatStateNotification(message) && !is_me;
+                return !_converse.isOnlyChatStateNotification(message) &&
+                    !is_me &&
+                    _converse.isMessageToHiddenChat(message);
             };
 
             _converse.playSoundNotification = function () {
@@ -108,15 +122,10 @@
                 }
             };
 
-            _converse.areDesktopNotificationsEnabled = function (ignore_hidden) {
-                const enabled = _converse.supports_html5_notification &&
+            _converse.areDesktopNotificationsEnabled = function () {
+                return _converse.supports_html5_notification &&
                     _converse.show_desktop_notifications &&
                     Notification.permission === "granted";
-                if (ignore_hidden) {
-                    return enabled;
-                } else {
-                    return enabled && _converse.windowState === 'hidden';
-                }
             };
 
             _converse.showMessageNotification = function (message) {

src/converse-singleton.js

@@ -7,13 +7,15 @@
 /*global Backbone, define, window, document, JSON */
 
 /* converse-singleton
-/* ******************
+ * ******************
  *
- * A non-core plugin which ensures that only one chat, private or group, is
+ * A plugin which ensures that only one chat (private or groupchat) is
  * visible at any one time. All other ongoing chats are hidden and kept in the
  * background.
  *
- * This plugin makes sense in mobile or fullscreen chat environments.
+ * This plugin makes sense in mobile or fullscreen chat environments (as
+ * configured by the `view_mode` setting).
+ *
  */
 (function (root, factory) {
     define(
@@ -37,6 +39,10 @@
         // NB: These plugins need to have already been loaded via require.js.
         optional_dependencies: ['converse-muc', 'converse-controlbox', 'converse-rosterview'],
 
+        enabled (_converse) {
+            return _.includes(['mobile', 'fullscreen'], _converse.view_mode);
+        },
+
         overrides: {
             // overrides mentioned here will be picked up by converse.js's
             // plugin architecture they will replace existing methods on the
@@ -67,7 +73,7 @@
                     return result;
                 }
             },
- 
+
             ChatBoxViews: {
                 showChat (attrs, force) {
                     /* We only have one chat visible at any one

src/converse.js

@@ -25,6 +25,7 @@ if (typeof define !== 'undefined') {
         "converse-minimize",    // Allows chat boxes to be minimized
         "converse-dragresize",  // Allows chat boxes to be resized by dragging them
         "converse-headline",    // Support for headline messages
+        "converse-fullscreen",
         /* END: Removable components */
     ], function (converse) {
         return converse;