Chapril/xmpp.chapril.org-conversejs
Chapril/xmpp.chapril.org-conversejs
25
0
Fork 0
Code Issues Pull Requests Projects Releases Activity

More work on combining the inverse/converse builds

Browse Source 
- Use `enabled` method for plugins
- Rename `converse-inverse.js` to `converse-fullscreen.js` and make it a
  core plugin.
- We're no longer making separate mobile and inverse builds

No longer a need to whitelist/blacklist plugins for inverse to work.
This commit is contained in:
JC Brand 2017-11-02 15:30:24 +01:00
parent 754ad7a027
commit 007e608f32
16 changed files with 10195 additions and 152682 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
CHANGES.md
View File

@ -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.

12
Makefile
View File

@ -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

71739
dist/converse-mobile.js vendored
View File

File diff suppressed because one or more lines are too long

3301
dist/converse-no-dependencies.js vendored
View File

File diff suppressed because one or more lines are too long

15435
dist/converse.js vendored
View File

File diff suppressed because one or more lines are too long

72176
dist/inverse.js vendored
View File

File diff suppressed because one or more lines are too long

130
docs/source/configuration.rst
View File

@ -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`:

6
inverse.html
View File

@ -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,8 +20,6 @@
converse.initialize({
authentication: 'login',
auto_away: 300,
blacklisted_plugins: ['converse-minimize', 'converse-dragresize'],
whitelisted_plugins: ['converse-inverse'],
auto_reconnect: true,
bosh_service_url: 'https://conversejs.org/http-bind/', // Please use this connection manager only for testing purposes
message_archiving: 'always',

4
mobile.html
View File

@ -125,10 +125,6 @@
<script>
converse.initialize({
bosh_service_url: 'https://conversejs.org/http-bind/', // Please use this connection manager only for testing purposes
message_carbons: true,
// 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'
});

3
src/config.js
View File

@ -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",

1
src/converse-core.js
View File

@ -70,6 +70,7 @@
'converse-core',
'converse-disco',
'converse-dragresize',
'converse-fullscreen',
'converse-headline',
'converse-mam',
'converse-minimize',

6
src/converse-dragresize.js
View File

@ -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();

9
src/converse-inverse.js → src/converse-fullscreen.js
View File

@ -18,7 +18,11 @@
"use strict";
const { Strophe, _ } = converse.env;
converse.plugins.add('converse-inverse', {
converse.plugins.add('converse-fullscreen', {
enabled (_converse) {
return _.includes(['mobile', 'fullscreen'], _converse.view_mode);
},
overrides: {
// overrides mentioned here will be picked up by converse.js's
@ -60,8 +64,7 @@
chatview_avatar_width: 44,
hide_open_bookmarks: true,
show_controlbox_by_default: true,
sticky_controlbox: true,
view_mode: 'fullscreen'
sticky_controlbox: true
});
}
});

4
src/converse-minimize.js
View File

@ -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

46
src/converse-singleton.js
View File

@ -39,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
@ -50,11 +54,8 @@
createChatBox (jid, attrs) {
/* Make sure new chat boxes are hidden by default.
*/
if (_.includes(['mobile', 'fullscreen'],
this.__super__._converse.view_mode)) {
attrs = attrs || {};
attrs.hidden = true;
}
attrs = attrs || {};
attrs.hidden = true;
return this.__super__.createChatBox.call(this, jid, attrs);
}
},
@ -68,14 +69,11 @@
if (_.isUndefined(result)) {
return
}
if (_.includes(['mobile', 'fullscreen'],
this.__super__._converse.view_mode)) {
result.hidden = false;
}
result.hidden = false;
return result;
}
},
ChatBoxViews: {
showChat (attrs, force) {
/* We only have one chat visible at any one
@ -83,13 +81,11 @@
* chats are hidden.
*/
const { _converse } = this.__super__;
if (_.includes(['mobile', 'fullscreen'], _converse.view_mode)) {
const chatbox = this.getChatBox(attrs, true);
const hidden = _.isUndefined(attrs.hidden) ? chatbox.get('hidden') : attrs.hidden;
if ((force || !hidden) && _converse.connection.authenticated) {
_.each(_converse.chatboxviews.xget(chatbox.get('id')), hideChat);
chatbox.save({'hidden': false});
}
const chatbox = this.getChatBox(attrs, true);
const hidden = _.isUndefined(attrs.hidden) ? chatbox.get('hidden') : attrs.hidden;
if ((force || !hidden) && _converse.connection.authenticated) {
_.each(_converse.chatboxviews.xget(chatbox.get('id')), hideChat);
chatbox.save({'hidden': false});
}
return this.__super__.showChat.apply(this, arguments);
}
@ -101,13 +97,8 @@
* time. So before opening a chat, we make sure all other
* chats are hidden.
*/
const { _converse } = this.__super__;
if (_.includes(['mobile', 'fullscreen'], _converse.view_mode)) {
if (!this.model.get('hidden')) {
_.each(_converse.chatboxviews.xget(this.model.get('id')), hideChat);
return this.__super__._show.apply(this, arguments);
}
} else {
if (!this.model.get('hidden')) {
_.each(this.__super__._converse.chatboxviews.xget(this.model.get('id')), hideChat);
return this.__super__._show.apply(this, arguments);
}
}
@ -119,11 +110,8 @@
* time. So before opening a chat, we make sure all other
* chats are hidden.
*/
const { _converse } = this.__super__;
if (_.includes(['mobile', 'fullscreen'], _converse.view_mode)) {
_.each(this.__super__._converse.chatboxviews.xget('controlbox'), hideChat);
this.model.save({'hidden': false});
}
_.each(this.__super__._converse.chatboxviews.xget('controlbox'), hideChat);
this.model.save({'hidden': false});
return this.__super__.openChat.apply(this, arguments);
},
}

1
src/converse.js
View File

@ -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;