Merge branch 'webcomponent-embedded'
This commit is contained in:
commit
08a76d8a6b
@ -13,12 +13,18 @@ though they should be private._
|
||||
### New features
|
||||
- XEP-0382 Spoiler Messages (currently only for private chats)
|
||||
- Listen for new room bookmarks pushed from the user's PEP service.
|
||||
- Simplified the [embedded](https://conversejs.org/demo/embedded.html) usecase.
|
||||
- No need to manually blacklist or whitelist any plugins.
|
||||
- Relies on the [view_mode](https://conversejs.org/docs/html/configurations.html#view-mode) being set to `'embedded'`.
|
||||
|
||||
### API changes
|
||||
- New API method `_converse.disco.getIdentity` to check whether a JID has a given identity.
|
||||
|
||||
### New configuration settings
|
||||
### Configuration settings
|
||||
- `auto_reconnect` is now set to `true` by default.
|
||||
- New configuration setting [allow_public_bookmarks](https://conversejs.org/docs/html/configurations.html#allow-public-bookmarks)
|
||||
- New configuration setting [root](https://conversejs.org/docs/html/configurations.html#root)
|
||||
- The [view_mode](https://conversejs.org/docs/html/configurations.html#view-mode) setting now has a new possible value: `embedded`
|
||||
|
||||
|
||||
## 3.3.2 (2018-01-29)
|
||||
|
7
Makefile
7
Makefile
@ -9,7 +9,7 @@ CHROMIUM ?= ./node_modules/.bin/run-headless-chromium
|
||||
CLEANCSS ?= ./node_modules/clean-css-cli/bin/cleancss --skip-rebase
|
||||
ESLINT ?= ./node_modules/.bin/eslint
|
||||
HTTPSERVE ?= ./node_modules/.bin/http-server
|
||||
HTTPSERVE_PORT ?= 8000
|
||||
HTTPSERVE_PORT ?= 8000
|
||||
PAPER =
|
||||
PO2JSON ?= ./node_modules/.bin/po2json
|
||||
RJS ?= ./node_modules/.bin/r.js
|
||||
@ -131,7 +131,7 @@ dev: stamp-bundler stamp-npm
|
||||
## Builds
|
||||
|
||||
.PHONY: css
|
||||
css: sass/*.scss css/converse.css css/converse.min.css css/mobile.min.css css/theme.min.css css/converse-muc-embedded.min.css css/inverse.css css/inverse.min.css
|
||||
css: sass/*.scss css/converse.css css/converse.min.css css/mobile.min.css css/theme.min.css css/converse-muc-embedded.min.css css/inverse.css css/inverse.min.css css/fonts.css
|
||||
|
||||
css/inverse.css:: dev sass sass/*
|
||||
$(SASS) -I $(BOURBON_TEMPLATES) sass/inverse/inverse.scss css/inverse.css
|
||||
@ -157,6 +157,9 @@ css/theme.min.css:: stamp-npm css/theme.css
|
||||
css/mobile.min.css:: stamp-npm sass/*
|
||||
$(CLEANCSS) css/mobile.css > css/mobile.min.css
|
||||
|
||||
css/fonts.css:: dev sass/*
|
||||
$(SASS) -I $(BOURBON_TEMPLATES) sass/only-fonts.scss css/fonts.css
|
||||
|
||||
.PHONY: watch
|
||||
watch: dev
|
||||
$(SASS) --watch -I ./node_modules/bourbon/app/assets/stylesheets/ sass/converse/converse.scss:css/converse.css sass/_muc_embedded.scss:css/converse-muc-embedded.css sass/inverse/inverse.scss:css/inverse.css
|
||||
|
@ -3,7 +3,7 @@
|
||||
https://coolors.co/app/264653-2a9d8f-e9c46a-f4a261-e76f51
|
||||
http://paletton.com/#uid=70a0u0kkNs+b4JOgryLpxqpsbkI
|
||||
*/
|
||||
#converse-embedded-chat {
|
||||
#conversejs.converse-embedded {
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box;
|
||||
@ -11,56 +11,56 @@
|
||||
right: auto;
|
||||
position: relative;
|
||||
width: 100%; }
|
||||
#converse-embedded-chat *, #converse-embedded-chat *:before, #converse-embedded-chat *:after {
|
||||
#conversejs.converse-embedded *, #conversejs.converse-embedded *:before, #conversejs.converse-embedded *:after {
|
||||
-webkit-box-sizing: border-box;
|
||||
-moz-box-sizing: border-box;
|
||||
box-sizing: border-box; }
|
||||
#converse-embedded-chat form.pure-form.converse-centered-form {
|
||||
#conversejs.converse-embedded form.pure-form.converse-centered-form {
|
||||
position: absolute;
|
||||
top: 30%;
|
||||
transform: translateY(-50%); }
|
||||
#converse-embedded-chat .chatroom {
|
||||
#conversejs.converse-embedded .chatroom {
|
||||
width: auto; }
|
||||
#converse-embedded-chat .flyout {
|
||||
#conversejs.converse-embedded .flyout {
|
||||
bottom: auto;
|
||||
display: block;
|
||||
position: relative; }
|
||||
#converse-embedded-chat .chatbox {
|
||||
#conversejs.converse-embedded .chatbox {
|
||||
float: none; }
|
||||
#converse-embedded-chat .chatbox .box-flyout {
|
||||
#conversejs.converse-embedded .chatbox .box-flyout {
|
||||
box-shadow: none; }
|
||||
#converse-embedded-chat .chatbox .chat-title {
|
||||
#conversejs.converse-embedded .chatbox .chat-title {
|
||||
padding: 0.3em;
|
||||
font-size: 120%; }
|
||||
#converse-embedded-chat .chatbox-btn {
|
||||
#conversejs.converse-embedded .chatbox-btn {
|
||||
display: none; }
|
||||
#converse-embedded-chat .chatroom .box-flyout {
|
||||
#conversejs.converse-embedded .chatroom .box-flyout {
|
||||
min-width: auto;
|
||||
width: 100%;
|
||||
height: 55vh; }
|
||||
#converse-embedded-chat .chatroom .box-flyout .chat-body {
|
||||
#conversejs.converse-embedded .chatroom .box-flyout .chat-body {
|
||||
height: -webkit-calc(100% - 55px);
|
||||
height: calc(100% - 55px); }
|
||||
#converse-embedded-chat .chatroom .box-flyout .occupants-heading {
|
||||
#conversejs.converse-embedded .chatroom .box-flyout .occupants-heading {
|
||||
font-size: 120%; }
|
||||
#converse-embedded-chat .chatroom .box-flyout .chat-content {
|
||||
#conversejs.converse-embedded .chatroom .box-flyout .chat-content {
|
||||
height: calc(100% - 97px); }
|
||||
#converse-embedded-chat .chatroom .box-flyout .chat-content .chat-message {
|
||||
#conversejs.converse-embedded .chatroom .box-flyout .chat-content .chat-message {
|
||||
margin: 0.5em;
|
||||
font-size: 120%; }
|
||||
#converse-embedded-chat .chatroom .box-flyout .sendXMPPMessage .chat-textarea {
|
||||
#conversejs.converse-embedded .chatroom .box-flyout .sendXMPPMessage .chat-textarea {
|
||||
padding: 0.5em;
|
||||
font-size: 110%; }
|
||||
#converse-embedded-chat .chatroom .box-flyout .chatroom-body .chatroom-form-container {
|
||||
#conversejs.converse-embedded .chatroom .box-flyout .chatroom-body .chatroom-form-container {
|
||||
font-size: 180%;
|
||||
float: left;
|
||||
height: 100%;
|
||||
position: relative; }
|
||||
#converse-embedded-chat .chatroom .box-flyout .chatroom-body .chatroom-form-container input {
|
||||
#conversejs.converse-embedded .chatroom .box-flyout .chatroom-body .chatroom-form-container input {
|
||||
font-size: 60%; }
|
||||
#converse-embedded-chat .chatroom .box-flyout .occupants .occupant-list {
|
||||
#conversejs.converse-embedded .chatroom .box-flyout .occupants .occupant-list {
|
||||
padding-left: 0.3em; }
|
||||
#converse-embedded-chat .chatroom .box-flyout .occupants .occupant-list li.occupant {
|
||||
#conversejs.converse-embedded .chatroom .box-flyout .occupants .occupant-list li.occupant {
|
||||
font-size: 120%; }
|
||||
|
||||
/*# sourceMappingURL=converse-muc-embedded.css.map */
|
||||
|
292
css/fonts.css
Normal file
292
css/fonts.css
Normal file
@ -0,0 +1,292 @@
|
||||
/*
|
||||
Color scheme helpers:
|
||||
https://coolors.co/app/264653-2a9d8f-e9c46a-f4a261-e76f51
|
||||
http://paletton.com/#uid=70a0u0kkNs+b4JOgryLpxqpsbkI
|
||||
*/
|
||||
@font-face {
|
||||
font-family: 'Converse-js';
|
||||
src: url("../fonticons/fonts/icomoon.eot?wvi0ht");
|
||||
src: url("../fonticons/fonts/icomoon.eot?wvi0ht#iefix") format("embedded-opentype"), url("../fonticons/fonts/icomoon.ttf?wvi0ht") format("truetype"), url("../fonticons/fonts/icomoon.woff?wvi0ht") format("woff"), url("../fonticons/fonts/icomoon.svg?wvi0ht#icomoon") format("svg");
|
||||
font-weight: normal;
|
||||
font-style: normal; }
|
||||
.icon-conversejs {
|
||||
padding-right: 0.2em;
|
||||
font-family: 'Converse-js';
|
||||
speak: none;
|
||||
font-style: normal;
|
||||
font-weight: normal;
|
||||
font-variant: normal;
|
||||
text-transform: none;
|
||||
line-height: 1;
|
||||
/* Better Font Rendering =========== */
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale; }
|
||||
|
||||
.icon-conversejs:before {
|
||||
content: "\e600"; }
|
||||
|
||||
#converse-embedded-chat .icon-address-book:before,
|
||||
#conversejs .icon-address-book:before {
|
||||
content: "\270f"; }
|
||||
#converse-embedded-chat .icon-attachment:before,
|
||||
#conversejs .icon-attachment:before {
|
||||
content: "\e032"; }
|
||||
#converse-embedded-chat .icon-away:before,
|
||||
#conversejs .icon-away:before {
|
||||
content: "\25fb"; }
|
||||
#converse-embedded-chat .icon-blocked:before,
|
||||
#conversejs .icon-blocked:before {
|
||||
content: "\2718"; }
|
||||
#converse-embedded-chat .icon-bold:before,
|
||||
#conversejs .icon-bold:before {
|
||||
content: "\e04d"; }
|
||||
#converse-embedded-chat .icon-bubbles2:before,
|
||||
#conversejs .icon-bubbles2:before {
|
||||
content: "\e016"; }
|
||||
#converse-embedded-chat .icon-bubbles3:before,
|
||||
#conversejs .icon-bubbles3:before {
|
||||
content: "\e017"; }
|
||||
#converse-embedded-chat .icon-bubbles:before,
|
||||
#conversejs .icon-bubbles:before {
|
||||
content: "\e015"; }
|
||||
#converse-embedded-chat .icon-busy:before,
|
||||
#conversejs .icon-busy:before {
|
||||
content: "\e004"; }
|
||||
#converse-embedded-chat .icon-dnd:before,
|
||||
#conversejs .icon-dnd:before {
|
||||
content: "\e004"; }
|
||||
#converse-embedded-chat .icon-cancel-circle:before,
|
||||
#conversejs .icon-cancel-circle:before {
|
||||
content: "\e058"; }
|
||||
#converse-embedded-chat .icon-checkmark:before,
|
||||
#conversejs .icon-checkmark:before {
|
||||
content: "\2713"; }
|
||||
#converse-embedded-chat .icon-close:before,
|
||||
#conversejs .icon-close:before {
|
||||
content: "\2715"; }
|
||||
#converse-embedded-chat .icon-closed:before,
|
||||
#conversejs .icon-closed:before {
|
||||
content: "\25ba"; }
|
||||
#converse-embedded-chat .icon-cog:before,
|
||||
#conversejs .icon-cog:before {
|
||||
content: "\e02f"; }
|
||||
#converse-embedded-chat .icon-cogs:before,
|
||||
#conversejs .icon-cogs:before {
|
||||
content: "\e022"; }
|
||||
#converse-embedded-chat .icon-conversejs:before,
|
||||
#conversejs .icon-conversejs:before {
|
||||
content: "\e600"; }
|
||||
#converse-embedded-chat .icon-database:before,
|
||||
#conversejs .icon-database:before {
|
||||
content: "\f1c0"; }
|
||||
#converse-embedded-chat .icon-envelope:before,
|
||||
#conversejs .icon-envelope:before {
|
||||
content: "\f003"; }
|
||||
#converse-embedded-chat .icon-exit:before,
|
||||
#conversejs .icon-exit:before {
|
||||
content: "\e601"; }
|
||||
#converse-embedded-chat .icon-eye-blocked:before,
|
||||
#conversejs .icon-eye-blocked:before {
|
||||
content: "\e031"; }
|
||||
#converse-embedded-chat .icon-eye:before,
|
||||
#conversejs .icon-eye:before {
|
||||
content: "\e030"; }
|
||||
#converse-embedded-chat .icon-github:before,
|
||||
#conversejs .icon-github:before {
|
||||
content: "\eab0"; }
|
||||
#converse-embedded-chat .icon-globe:before,
|
||||
#conversejs .icon-globe:before {
|
||||
content: "\f0ac"; }
|
||||
#converse-embedded-chat .icon-google2:before,
|
||||
#conversejs .icon-google2:before {
|
||||
content: "\ea89"; }
|
||||
#converse-embedded-chat .icon-group:before,
|
||||
#conversejs .icon-group:before {
|
||||
content: "\f0c0"; }
|
||||
#converse-embedded-chat .icon-happy:before,
|
||||
#conversejs .icon-happy:before {
|
||||
content: "\263b"; }
|
||||
#converse-embedded-chat .icon-heart2:before,
|
||||
#conversejs .icon-heart2:before {
|
||||
content: "\f004"; }
|
||||
#converse-embedded-chat .icon-heart:before,
|
||||
#conversejs .icon-heart:before {
|
||||
content: "\2764"; }
|
||||
#converse-embedded-chat .icon-heart_empty:before,
|
||||
#conversejs .icon-heart_empty:before {
|
||||
content: "\f08a"; }
|
||||
#converse-embedded-chat .icon-hide-users:before,
|
||||
#conversejs .icon-hide-users:before {
|
||||
content: "\e01c"; }
|
||||
#converse-embedded-chat .icon-home:before,
|
||||
#conversejs .icon-home:before {
|
||||
content: "\e000"; }
|
||||
#converse-embedded-chat .icon-idcard-dark:before,
|
||||
#conversejs .icon-idcard-dark:before {
|
||||
content: "\f2c2"; }
|
||||
#converse-embedded-chat .icon-idcard:before,
|
||||
#conversejs .icon-idcard:before {
|
||||
content: "\f2c3"; }
|
||||
#converse-embedded-chat .icon-image:before,
|
||||
#conversejs .icon-image:before {
|
||||
content: "\2b14"; }
|
||||
#converse-embedded-chat .icon-info:before,
|
||||
#conversejs .icon-info:before {
|
||||
content: "\2360"; }
|
||||
#converse-embedded-chat .icon-italic:before,
|
||||
#conversejs .icon-italic:before {
|
||||
content: "\e04f"; }
|
||||
#converse-embedded-chat .icon-key:before,
|
||||
#conversejs .icon-key:before {
|
||||
content: "\e028"; }
|
||||
#converse-embedded-chat .icon-legal:before,
|
||||
#conversejs .icon-legal:before {
|
||||
content: "\f0e3"; }
|
||||
#converse-embedded-chat .icon-lock-2:before,
|
||||
#conversejs .icon-lock-2:before {
|
||||
content: "\e027"; }
|
||||
#converse-embedded-chat .icon-minus:before,
|
||||
#conversejs .icon-minus:before {
|
||||
content: "\e05a"; }
|
||||
#converse-embedded-chat .icon-music:before,
|
||||
#conversejs .icon-music:before {
|
||||
content: "\266b"; }
|
||||
#converse-embedded-chat .icon-newtab:before,
|
||||
#conversejs .icon-newtab:before {
|
||||
content: "\e053"; }
|
||||
#converse-embedded-chat .icon-notebook:before,
|
||||
#conversejs .icon-notebook:before {
|
||||
content: "\2710"; }
|
||||
#converse-embedded-chat .icon-notification:before,
|
||||
#conversejs .icon-notification:before {
|
||||
content: "\e01f"; }
|
||||
#converse-embedded-chat .icon-offline:before,
|
||||
#conversejs .icon-offline:before {
|
||||
content: "\e002"; }
|
||||
#converse-embedded-chat .icon-logout:before,
|
||||
#conversejs .icon-logout:before {
|
||||
content: "\e002"; }
|
||||
#converse-embedded-chat .icon-online:before,
|
||||
#conversejs .icon-online:before {
|
||||
content: "\25fc"; }
|
||||
#converse-embedded-chat .icon-opened:before,
|
||||
#conversejs .icon-opened:before {
|
||||
content: "\25bc"; }
|
||||
#converse-embedded-chat .icon-pencil:before,
|
||||
#conversejs .icon-pencil:before {
|
||||
content: "\270e"; }
|
||||
#converse-embedded-chat .icon-phone-hang-up:before,
|
||||
#conversejs .icon-phone-hang-up:before {
|
||||
content: "\260e"; }
|
||||
#converse-embedded-chat .icon-phone:before,
|
||||
#conversejs .icon-phone:before {
|
||||
content: "\260f"; }
|
||||
#converse-embedded-chat .icon-plus:before,
|
||||
#conversejs .icon-plus:before {
|
||||
content: "\271a"; }
|
||||
#converse-embedded-chat .icon-pushpin:before,
|
||||
#conversejs .icon-pushpin:before {
|
||||
content: "\e012"; }
|
||||
#converse-embedded-chat .icon-quotes-left:before,
|
||||
#conversejs .icon-quotes-left:before {
|
||||
content: "\e01d"; }
|
||||
#converse-embedded-chat .icon-reddit:before,
|
||||
#conversejs .icon-reddit:before {
|
||||
content: "\eac6"; }
|
||||
#converse-embedded-chat .icon-remove:before,
|
||||
#conversejs .icon-remove:before {
|
||||
content: "\e02d"; }
|
||||
#converse-embedded-chat .icon-room-info:before,
|
||||
#conversejs .icon-room-info:before {
|
||||
content: "\e059"; }
|
||||
#converse-embedded-chat .icon-save:before,
|
||||
#conversejs .icon-save:before {
|
||||
content: "\f0c7"; }
|
||||
#converse-embedded-chat .icon-search:before,
|
||||
#conversejs .icon-search:before {
|
||||
content: "\e021"; }
|
||||
#converse-embedded-chat .icon-show-users:before,
|
||||
#conversejs .icon-show-users:before {
|
||||
content: "\e01e"; }
|
||||
#converse-embedded-chat .icon-smiley:before,
|
||||
#conversejs .icon-smiley:before {
|
||||
content: "\263a"; }
|
||||
#converse-embedded-chat .icon-snowflake:before,
|
||||
#conversejs .icon-snowflake:before {
|
||||
content: "\f2dc"; }
|
||||
#converse-embedded-chat .icon-spell-check:before,
|
||||
#conversejs .icon-spell-check:before {
|
||||
content: "\e045"; }
|
||||
#converse-embedded-chat .icon-spinner:before,
|
||||
#conversejs .icon-spinner:before {
|
||||
content: "\231b"; }
|
||||
#converse-embedded-chat .icon-star:before,
|
||||
#conversejs .icon-star:before {
|
||||
content: "\f005"; }
|
||||
#converse-embedded-chat .icon-star_empty:before,
|
||||
#conversejs .icon-star_empty:before {
|
||||
content: "\f006"; }
|
||||
#converse-embedded-chat .icon-strikethrough:before,
|
||||
#conversejs .icon-strikethrough:before {
|
||||
content: "\e050"; }
|
||||
#converse-embedded-chat .icon-twitter:before,
|
||||
#conversejs .icon-twitter:before {
|
||||
content: "\ea96"; }
|
||||
#converse-embedded-chat .icon-underline:before,
|
||||
#conversejs .icon-underline:before {
|
||||
content: "\e04e"; }
|
||||
#converse-embedded-chat .icon-unlocked:before,
|
||||
#conversejs .icon-unlocked:before {
|
||||
content: "\e025"; }
|
||||
#converse-embedded-chat .icon-user:before,
|
||||
#conversejs .icon-user:before {
|
||||
content: "\e01a"; }
|
||||
#converse-embedded-chat .icon-users:before,
|
||||
#conversejs .icon-users:before {
|
||||
content: "\e01b"; }
|
||||
#converse-embedded-chat .icon-warning:before,
|
||||
#conversejs .icon-warning:before {
|
||||
content: "\26a0"; }
|
||||
#converse-embedded-chat .icon-wrench:before,
|
||||
#conversejs .icon-wrench:before {
|
||||
content: "\e024"; }
|
||||
#converse-embedded-chat .icon-xa:before,
|
||||
#conversejs .icon-xa:before {
|
||||
content: "\e602"; }
|
||||
#converse-embedded-chat .icon-zoomin:before,
|
||||
#conversejs .icon-zoomin:before {
|
||||
content: "\e02b"; }
|
||||
#converse-embedded-chat .icon-zoomout:before,
|
||||
#conversejs .icon-zoomout:before {
|
||||
content: "\e02a"; }
|
||||
#converse-embedded-chat [data-icon]:before,
|
||||
#conversejs [data-icon]:before {
|
||||
content: attr(data-icon);
|
||||
font-family: 'Converse-js';
|
||||
font-variant: normal;
|
||||
font-weight: normal;
|
||||
line-height: 1;
|
||||
speak: none;
|
||||
text-transform: none;
|
||||
/* Better Font Rendering =========== */
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale; }
|
||||
#converse-embedded-chat [class^="icon-"]:before, #converse-embedded-chat [class*=" icon-"]:before,
|
||||
#conversejs [class^="icon-"]:before,
|
||||
#conversejs [class*=" icon-"]:before {
|
||||
background-position: 14px 14px;
|
||||
background-image: none;
|
||||
font-family: 'Converse-js';
|
||||
font-style: normal;
|
||||
font-variant: normal;
|
||||
font-weight: normal;
|
||||
width: auto;
|
||||
height: auto;
|
||||
line-height: 1;
|
||||
speak: none;
|
||||
text-transform: none;
|
||||
/* Better Font Rendering =========== */
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale; }
|
||||
|
||||
/*# sourceMappingURL=fonts.css.map */
|
@ -40,7 +40,7 @@
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-8 col-md-offset-2">
|
||||
<h1 class="brand-heading"><i class="icon-conversejs"></i>Converse.js</h1>
|
||||
<h1 class="brand-heading"><i class="icon-conversejs"></i>Converse</h1>
|
||||
<p class="intro-text">Anonymous login demo</p>
|
||||
</div>
|
||||
</div>
|
||||
|
@ -41,7 +41,7 @@
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-8 col-md-offset-2">
|
||||
<h1 class="brand-heading brand-heading-embedded"><a style="color: white;" href="/"><i class="icon-conversejs"></i>Converse.js</a></h1>
|
||||
<h1 class="brand-heading brand-heading-embedded"><a style="color: white;" href="/"><i class="icon-conversejs"></i>Converse</a></h1>
|
||||
<p class="intro-text">Embedded MUC chat demo</p>
|
||||
|
||||
<div id="converse-embedded-chat"></div>
|
||||
@ -54,44 +54,18 @@
|
||||
|
||||
<script>
|
||||
converse.initialize({
|
||||
allow_logout: false, // No point in logging out when we have auto_login as true.
|
||||
allow_muc_invitations: false, // Doesn't make sense to allow because only
|
||||
// roster contacts can be invited
|
||||
allow_contact_requests: false, // Contacts from other servers cannot,
|
||||
// be added and anonymous users don't
|
||||
// know one another's JIDs, so disabling.
|
||||
auto_reconnect: true,
|
||||
authentication: 'anonymous',
|
||||
auto_login: true,
|
||||
auto_join_rooms: [
|
||||
'anonymous@conference.nomnom.im',
|
||||
],
|
||||
// Whitelist non-core plugins that we need
|
||||
whitelisted_plugins: ['converse-muc-embedded'],
|
||||
// Blacklist plugins which aren't included in the build file,
|
||||
// so that other code cannot register their own plugins under
|
||||
// those names.
|
||||
blacklisted_plugins: [
|
||||
"converse-bookmarks",
|
||||
"converse-controlbox",
|
||||
"converse-dragresize",
|
||||
"converse-headline",
|
||||
"converse-minimize",
|
||||
"converse-otr",
|
||||
"converse-register",
|
||||
"converse-vcard",
|
||||
],
|
||||
bosh_service_url: 'https://conversejs.org/http-bind/', // Please use this connection manager only for testing purposes
|
||||
jid: 'nomnom.im', // XMPP server which allows anonymous login (doesn't
|
||||
// allow chatting with other XMPP servers).
|
||||
notify_all_room_messages: [
|
||||
'anonymous@conference.nomnom.im',
|
||||
],
|
||||
bosh_service_url: 'https://conversejs.org/http-bind/', // Please use this connection manager only for testing purposes
|
||||
jid: 'nomnom.im', // XMPP server which allows anonymous login (doesn't
|
||||
// allow chatting with other XMPP servers).
|
||||
keepalive: true,
|
||||
hide_muc_server: true, // Federation is disabled, so no use in
|
||||
// showing the MUC server.
|
||||
play_sounds: true,
|
||||
strict_plugin_dependencies: false
|
||||
view_mode: 'embedded',
|
||||
});
|
||||
</script>
|
||||
</html>
|
||||
|
@ -67,7 +67,7 @@
|
||||
|
||||
<section class="intro" class="container">
|
||||
<div class="row">
|
||||
<h1 class="brand-heading"><i class="icon-conversejs"></i> Converse.js</h1>
|
||||
<h1 class="brand-heading"><i class="icon-conversejs"></i> Converse</h1>
|
||||
<div class="col-md-8 col-md-offset-2">
|
||||
<p class="intro-text">Demos:</p>
|
||||
<p class="intro-text">
|
||||
|
@ -59,7 +59,7 @@
|
||||
<div class="container">
|
||||
<div class="row">
|
||||
<div class="col-md-8 col-md-offset-2">
|
||||
<h1 class="brand-heading"><i class="icon-conversejs"></i>Converse.js</h1>
|
||||
<h1 class="brand-heading"><i class="icon-conversejs"></i>Converse</h1>
|
||||
<p class="intro-text">An example page where external dependencies are loaded seperately and not within the converse.js bundle.</p>
|
||||
<p class="intro-text">Look at the page source for details.</p>
|
||||
<p class="intro-text">For this page to work, you'll need to
|
||||
|
53390
dist/converse-muc-embedded.js
vendored
Normal file
53390
dist/converse-muc-embedded.js
vendored
Normal file
File diff suppressed because one or more lines are too long
@ -1091,6 +1091,35 @@ providers_link
|
||||
The hyperlink on the registration form which points to a directory of public
|
||||
XMPP servers.
|
||||
|
||||
root
|
||||
----
|
||||
|
||||
* Default: ``window.document``
|
||||
|
||||
When using converse.js inside a web component's shadow DOM, you will need to set this settings'
|
||||
value to the shadow-root of the shadow DOM.
|
||||
|
||||
For example:
|
||||
|
||||
.. code-block:: javascript
|
||||
|
||||
class CustomChatComponent extends HTMLElement {
|
||||
constructor() {
|
||||
super();
|
||||
const shadowRoot = this.attachShadow({mode: "open"});
|
||||
this.initConverse(shadowRoot);
|
||||
}
|
||||
|
||||
initConverse(shadowRoot) {
|
||||
window.addEventListener("converse-loaded", function(event) {
|
||||
converse.initialize({
|
||||
root: shadowRoot,
|
||||
// Other settings go here...
|
||||
});
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
roster_groups
|
||||
-------------
|
||||
@ -1388,20 +1417,21 @@ view_mode
|
||||
---------
|
||||
|
||||
* Default: ``overlayed``
|
||||
* Allowed values: ``overlayed``, ``fullscreen``, ``mobile``
|
||||
* Allowed values: ``overlayed``, ``fullscreen``, ``mobile``, ``embedded``
|
||||
|
||||
The ``view_mode`` setting configures converse.js's mode and resulting behavior.
|
||||
|
||||
Before the introduction of this setting (in version 3.3.0), there were there
|
||||
different builds, each for the diffent modes.
|
||||
different builds, each for the different modes.
|
||||
|
||||
These were:
|
||||
|
||||
* ``converse.js`` for the ``overlayed`` mode
|
||||
* ``converse-mobile.js`` for the ``mobile`` mode
|
||||
* ``converse-muc-embedded.js`` for embedding a single MUC room into the page.
|
||||
* ``converse.js`` for the ``overlayed`` mode
|
||||
* ``inverse.js`` for the ``fullscreen`` mode
|
||||
|
||||
Besides having three different builds, certain plugins had to be whitelisted
|
||||
Besides having different builds, certain plugins had to be whitelisted
|
||||
and blacklisted for the different modes.
|
||||
|
||||
``converse-singleton`` had to be whitelisted for the ``mobile`` and ``fullscreen``
|
||||
@ -1411,11 +1441,25 @@ modes, additionally ``converse-inverse`` had to be whitelisted for the
|
||||
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.
|
||||
When using ``converse-muc-embedded.js`` various plugins also had to manually be
|
||||
blacklisted.
|
||||
|
||||
Furthermore, it's no longer necessary to whitelist or blacklist any plugins.
|
||||
Since version 3.3.0 it's no longer necessary to blacklist any plugins (except
|
||||
for ``converse-muc-embedded.js``, which is from version 3.3.3).
|
||||
|
||||
Blacklisting now happens automatically.
|
||||
|
||||
Since version 3.3.0, the ``inverse.js`` and ``converse-mobile.js`` builds no
|
||||
longer exist. Instead the standard ``converse.js`` build is used, together with
|
||||
the appropriate ``view_mode`` value.
|
||||
|
||||
The ``converse-muc-embedded.js`` build is still kept, because it's smaller than
|
||||
``converse.js`` due to unused code being removed. It doesn't however contain
|
||||
any new code, so the full ``converse.js`` build could be used instead, as long
|
||||
as ``view_mode`` is set to ``embedded``.
|
||||
|
||||
Furthermore, it's no longer necessary to whitelist or blacklist any plugins
|
||||
when switching view modes.
|
||||
|
||||
.. note::
|
||||
Although the ``view_mode`` setting has removed the need for different
|
||||
|
@ -1,6 +1,6 @@
|
||||
@import "bourbon";
|
||||
@import "converse/variables";
|
||||
#converse-embedded-chat {
|
||||
#conversejs.converse-embedded {
|
||||
|
||||
@include box-sizing(border-box);
|
||||
*, *:before, *:after {
|
||||
|
3
sass/only-fonts.scss
Normal file
3
sass/only-fonts.scss
Normal file
@ -0,0 +1,3 @@
|
||||
@import "bourbon";
|
||||
@import "converse/variables";
|
||||
@import "fonts";
|
@ -478,7 +478,7 @@
|
||||
insertIntoControlBox () {
|
||||
const controlboxview = _converse.chatboxviews.get('controlbox');
|
||||
if (!_.isUndefined(controlboxview) &&
|
||||
!document.body.contains(this.el)) {
|
||||
!_converse.root.contains(this.el)) {
|
||||
const container = controlboxview.el.querySelector('#chatrooms');
|
||||
if (!_.isNull(container)) {
|
||||
container.insertBefore(this.el, container.firstChild);
|
||||
|
@ -418,12 +418,17 @@
|
||||
* If the #conversejs element doesn't exist, create it.
|
||||
*/
|
||||
if (!this.el) {
|
||||
let el = document.querySelector('#conversejs');
|
||||
let el = _converse.root.querySelector('#conversejs');
|
||||
if (_.isNull(el)) {
|
||||
el = document.createElement('div');
|
||||
el.setAttribute('id', 'conversejs');
|
||||
// Converse.js expects a <body> tag to be present.
|
||||
document.querySelector('body').appendChild(el);
|
||||
const body = _converse.root.querySelector('body');
|
||||
if (body) {
|
||||
body.appendChild(el);
|
||||
} else {
|
||||
// Perhaps inside a web component?
|
||||
_converse.root.appendChild(el);
|
||||
}
|
||||
}
|
||||
el.innerHTML = '';
|
||||
this.setElement(el, false);
|
||||
|
@ -74,15 +74,16 @@
|
||||
// New functions which don't exist yet can also be added.
|
||||
//
|
||||
registerGlobalEventHandlers: function () {
|
||||
const { _converse } = this.__super__;
|
||||
this.__super__.registerGlobalEventHandlers();
|
||||
document.addEventListener(
|
||||
_converse.root.addEventListener(
|
||||
'click', function (ev) {
|
||||
if (_.includes(ev.target.classList, 'toggle-toolbar-menu') ||
|
||||
_.includes(ev.target.classList, 'insert-emoji')) {
|
||||
return;
|
||||
}
|
||||
u.slideInAllElements(
|
||||
document.querySelectorAll('.toolbar-menu')
|
||||
_converse.root.querySelectorAll('.toolbar-menu')
|
||||
)
|
||||
}
|
||||
);
|
||||
@ -430,7 +431,7 @@
|
||||
* as well as src/converse-muc.js (if those plugins are
|
||||
* enabled).
|
||||
*/
|
||||
const container = document.querySelector('#conversejs');
|
||||
const container = _converse.root.querySelector('#conversejs');
|
||||
if (this.el.parentNode !== container) {
|
||||
container.insertBefore(this.el, container.firstChild);
|
||||
}
|
||||
@ -1024,7 +1025,7 @@
|
||||
}
|
||||
}
|
||||
const elements = _.difference(
|
||||
document.querySelectorAll('.toolbar-menu'),
|
||||
_converse.root.querySelectorAll('.toolbar-menu'),
|
||||
[this.emoji_picker_view.el]
|
||||
);
|
||||
u.slideInAllElements(elements)
|
||||
|
@ -426,8 +426,8 @@
|
||||
const tab = ev.target,
|
||||
sibling_li = tab.parentNode.nextElementSibling || tab.parentNode.previousElementSibling,
|
||||
sibling = sibling_li.firstChild,
|
||||
sibling_panel = document.querySelector(sibling.getAttribute('href')),
|
||||
tab_panel = document.querySelector(tab.getAttribute('href'));
|
||||
sibling_panel = _converse.root.querySelector(sibling.getAttribute('href')),
|
||||
tab_panel = _converse.root.querySelector(tab.getAttribute('href'));
|
||||
|
||||
u.hideElement(sibling_panel);
|
||||
u.removeClass('current', sibling);
|
||||
@ -656,7 +656,7 @@
|
||||
xhr.onload = function () {
|
||||
if (xhr.status >= 200 && xhr.status < 400) {
|
||||
const data = JSON.parse(xhr.responseText),
|
||||
ul = document.querySelector('.search-xmpp ul');
|
||||
ul = _converse.root.querySelector('.search-xmpp ul');
|
||||
u.removeElement(ul.querySelector('li.found-user'));
|
||||
u.removeElement(ul.querySelector('li.chat-info'));
|
||||
if (!data.length) {
|
||||
@ -769,7 +769,7 @@
|
||||
|
||||
onClick (e) {
|
||||
e.preventDefault();
|
||||
if (u.isVisible(document.querySelector("#controlbox"))) {
|
||||
if (u.isVisible(_converse.root.querySelector("#controlbox"))) {
|
||||
const controlbox = _converse.chatboxes.get('controlbox');
|
||||
if (_converse.connection.connected) {
|
||||
controlbox.save({closed: true});
|
||||
|
@ -4,7 +4,7 @@
|
||||
// Copyright (c) 2012-2017, Jan-Carel Brand <jc@opkode.com>
|
||||
// Licensed under the Mozilla Public License (MPLv2)
|
||||
//
|
||||
/*global Backbone, define, window, document, JSON */
|
||||
/*global Backbone, define, window, JSON */
|
||||
(function (root, factory) {
|
||||
define(["sizzle",
|
||||
"es6-promise",
|
||||
@ -79,6 +79,7 @@
|
||||
'converse-mam',
|
||||
'converse-minimize',
|
||||
'converse-muc',
|
||||
'converse-muc-embedded',
|
||||
'converse-notification',
|
||||
'converse-otr',
|
||||
'converse-ping',
|
||||
@ -87,8 +88,8 @@
|
||||
'converse-roomslist',
|
||||
'converse-rosterview',
|
||||
'converse-singleton',
|
||||
'converse-vcard',
|
||||
'converse-spoilers'
|
||||
'converse-spoilers',
|
||||
'converse-vcard'
|
||||
];
|
||||
|
||||
// Make converse pluggable
|
||||
@ -288,7 +289,7 @@
|
||||
authentication: 'login', // Available values are "login", "prebind", "anonymous" and "external".
|
||||
auto_away: 0, // Seconds after which user status is set to 'away'
|
||||
auto_login: false, // Currently only used in connection with anonymous login
|
||||
auto_reconnect: false,
|
||||
auto_reconnect: true,
|
||||
auto_subscribe: false,
|
||||
auto_xa: 0, // Seconds after which user status is set to 'xa'
|
||||
blacklisted_plugins: [],
|
||||
@ -318,6 +319,7 @@
|
||||
priority: 0,
|
||||
registration_domain: '',
|
||||
rid: undefined,
|
||||
root: window.document,
|
||||
roster_groups: true,
|
||||
show_only_online_users: false,
|
||||
show_send_button: false,
|
||||
@ -591,19 +593,25 @@
|
||||
this.incrementMsgCounter = function () {
|
||||
this.msg_counter += 1;
|
||||
const unreadMsgCount = this.msg_counter;
|
||||
if (document.title.search(/^Messages \(\d+\) /) === -1) {
|
||||
document.title = `Messages (${unreadMsgCount}) ${document.title}`;
|
||||
let title = document.title;
|
||||
if (_.isNil(title)) {
|
||||
return;
|
||||
}
|
||||
if (title.search(/^Messages \(\d+\) /) === -1) {
|
||||
title = `Messages (${unreadMsgCount}) ${title}`;
|
||||
} else {
|
||||
document.title = document.title.replace(
|
||||
/^Messages \(\d+\) /, `Messages (${unreadMsgCount}) `
|
||||
);
|
||||
title = title.replace(/^Messages \(\d+\) /, `Messages (${unreadMsgCount})`);
|
||||
}
|
||||
};
|
||||
|
||||
this.clearMsgCounter = function () {
|
||||
this.msg_counter = 0;
|
||||
if (document.title.search(/^Messages \(\d+\) /) !== -1) {
|
||||
document.title = document.title.replace(/^Messages \(\d+\) /, "");
|
||||
let title = document.title;
|
||||
if (_.isNil(title)) {
|
||||
return;
|
||||
}
|
||||
if (title.search(/^Messages \(\d+\) /) !== -1) {
|
||||
title = title.replace(/^Messages \(\d+\) /, "");
|
||||
}
|
||||
};
|
||||
|
||||
@ -1795,6 +1803,21 @@
|
||||
const whitelist = _converse.core_plugins.concat(
|
||||
_converse.whitelisted_plugins);
|
||||
|
||||
if (_converse.view_mode === 'embedded') {
|
||||
_.forEach([ // eslint-disable-line lodash/prefer-map
|
||||
"converse-bookmarks",
|
||||
"converse-controlbox",
|
||||
"converse-dragresize",
|
||||
"converse-headline",
|
||||
"converse-minimize",
|
||||
"converse-otr",
|
||||
"converse-register",
|
||||
"converse-vcard",
|
||||
], (name) => {
|
||||
_converse.blacklisted_plugins.push(name)
|
||||
});
|
||||
}
|
||||
|
||||
_converse.pluggable.initializePlugins({
|
||||
'updateSettings' () {
|
||||
_converse.log(
|
||||
@ -1839,13 +1862,10 @@
|
||||
i18n.fetchTranslations(
|
||||
_converse.locale,
|
||||
_converse.locales,
|
||||
_.template(_converse.locales_url)({'locale': _converse.locale})
|
||||
).then(() => {
|
||||
finishInitialization();
|
||||
}).catch((reason) => {
|
||||
finishInitialization();
|
||||
_converse.log(reason, Strophe.LogLevel.ERROR);
|
||||
});
|
||||
_.template(_converse.locales_url)({'locale': _converse.locale}))
|
||||
.catch(_.partial(_converse.log, _, Strophe.LogLevel.FATAL))
|
||||
.then(finishInitialization)
|
||||
.catch(_.partial(_converse.log, _, Strophe.LogLevel.FATAL));
|
||||
}
|
||||
return init_promise;
|
||||
};
|
||||
@ -1996,7 +2016,7 @@
|
||||
};
|
||||
|
||||
// The public API
|
||||
return {
|
||||
window.converse = {
|
||||
'initialize' (settings, callback) {
|
||||
return _converse.initialize(settings, callback);
|
||||
},
|
||||
@ -2028,4 +2048,6 @@
|
||||
'utils': utils
|
||||
}
|
||||
};
|
||||
window.dispatchEvent(new Event('converse-loaded'));
|
||||
return window.converse;
|
||||
}));
|
||||
|
@ -7,7 +7,7 @@
|
||||
|
||||
/* This is a Converse.js plugin which add support for XEP-0030: Service Discovery */
|
||||
|
||||
/*global Backbone, define, window, document */
|
||||
/*global Backbone, define, window */
|
||||
(function (root, factory) {
|
||||
define(["converse-core", "sizzle", "strophe.disco"], factory);
|
||||
}(this, function (converse, sizzle) {
|
||||
|
@ -4,7 +4,7 @@
|
||||
// Copyright (c) 2012-2017, Jan-Carel Brand <jc@opkode.com>
|
||||
// Licensed under the Mozilla Public License (MPLv2)
|
||||
//
|
||||
/*global define, window */
|
||||
/*global define, window, document */
|
||||
|
||||
(function (root, factory) {
|
||||
define(["converse-core",
|
||||
|
@ -21,7 +21,7 @@
|
||||
converse.plugins.add('converse-fullscreen', {
|
||||
|
||||
enabled (_converse) {
|
||||
return _.includes(['mobile', 'fullscreen'], _converse.view_mode);
|
||||
return _.includes(['mobile', 'fullscreen', 'embedded'], _converse.view_mode);
|
||||
},
|
||||
|
||||
overrides: {
|
||||
@ -37,7 +37,8 @@
|
||||
},
|
||||
|
||||
insertBrandHeading () {
|
||||
const el = document.getElementById('converse-login-panel');
|
||||
const { _converse } = this.__super__;
|
||||
const el = _converse.root.getElementById('converse-login-panel');
|
||||
el.parentNode.insertAdjacentHTML(
|
||||
'afterbegin',
|
||||
this.createBrandHeadingHTML()
|
||||
|
@ -4,7 +4,7 @@
|
||||
// Copyright (c) 2012-2017, Jan-Carel Brand <jc@opkode.com>
|
||||
// Licensed under the Mozilla Public License (MPLv2)
|
||||
//
|
||||
/*global define, window */
|
||||
/*global define, window, document */
|
||||
|
||||
(function (root, factory) {
|
||||
define(["converse-core",
|
||||
|
@ -11,6 +11,11 @@
|
||||
const { Backbone, _ } = converse.env;
|
||||
|
||||
converse.plugins.add('converse-muc-embedded', {
|
||||
|
||||
enabled (_converse) {
|
||||
return _converse.view_mode === 'embedded';
|
||||
},
|
||||
|
||||
overrides: {
|
||||
// Overrides mentioned here will be picked up by converse.js's
|
||||
// plugin architecture they will replace existing methods on the
|
||||
@ -37,14 +42,10 @@
|
||||
}
|
||||
},
|
||||
|
||||
ChatRoomView: {
|
||||
insertIntoDOM () {
|
||||
if (!document.body.contains(this.el)) {
|
||||
const container = document.querySelector('#converse-embedded-chat');
|
||||
container.innerHTML = '';
|
||||
container.appendChild(this.el);
|
||||
}
|
||||
return this;
|
||||
ChatBoxViews: {
|
||||
initialize () {
|
||||
this.__super__.initialize.apply(this, arguments);
|
||||
this.el.classList.add('converse-embedded');
|
||||
}
|
||||
}
|
||||
},
|
||||
@ -53,6 +54,13 @@
|
||||
/* The initialize function gets called as soon as the plugin is
|
||||
* loaded by converse.js's plugin machinery.
|
||||
*/
|
||||
this._converse.api.settings.update({
|
||||
'allow_logout': false, // No point in logging out when we have auto_login as true.
|
||||
'allow_muc_invitations': false, // Doesn't make sense to allow because only
|
||||
// roster contacts can be invited
|
||||
'hide_muc_server': true, // Federation is disabled, so no use in
|
||||
// showing the MUC server.
|
||||
});
|
||||
const { _converse } = this;
|
||||
if (!_.isArray(_converse.auto_join_rooms)) {
|
||||
throw new Error("converse-muc-embedded: auto_join_rooms must be an Array");
|
||||
|
@ -71,7 +71,7 @@
|
||||
};
|
||||
|
||||
_converse.isMessageToHiddenChat = function (message) {
|
||||
if (_.includes(['mobile', 'fullscreen'], _converse.view_mode)) {
|
||||
if (_.includes(['mobile', 'fullscreen', 'embedded'], _converse.view_mode)) {
|
||||
const jid = Strophe.getBareJidFromJid(message.getAttribute('from'));
|
||||
const model = _converse.chatboxes.get(jid);
|
||||
if (!_.isNil(model)) {
|
||||
|
@ -403,9 +403,10 @@
|
||||
|
||||
toggleOTRMenu (ev) {
|
||||
ev.stopPropagation();
|
||||
const { _converse } = this.__super__;
|
||||
const menu = this.el.querySelector('.toggle-otr ul');
|
||||
const elements = _.difference(
|
||||
document.querySelectorAll('.toolbar-menu'),
|
||||
_converse.root.querySelectorAll('.toolbar-menu'),
|
||||
[menu]
|
||||
);
|
||||
utils.slideInAllElements(elements).then(
|
||||
|
@ -79,7 +79,7 @@
|
||||
toggleOptions (ev) {
|
||||
ev.preventDefault();
|
||||
utils.slideInAllElements(
|
||||
document.querySelectorAll('#conversejs .contact-form-container')
|
||||
_converse.root.querySelectorAll('#conversejs .contact-form-container')
|
||||
);
|
||||
utils.slideToggleElement(this.el.querySelector("#target dd ul"));
|
||||
},
|
||||
|
@ -176,7 +176,7 @@
|
||||
insertIntoControlBox () {
|
||||
const controlboxview = _converse.chatboxviews.get('controlbox');
|
||||
if (!_.isUndefined(controlboxview) &&
|
||||
!document.body.contains(this.el)) {
|
||||
!_converse.root.contains(this.el)) {
|
||||
const container = controlboxview.el.querySelector('#chatrooms');
|
||||
if (!_.isNull(container)) {
|
||||
container.insertBefore(this.el, container.firstChild);
|
||||
|
@ -4,7 +4,7 @@
|
||||
// Copyright (c) 2012-2017, JC Brand <jc@opkode.com>
|
||||
// Licensed under the Mozilla Public License (MPLv2)
|
||||
//
|
||||
/*global Backbone, define, window, document, JSON */
|
||||
/*global Backbone, define, window, JSON */
|
||||
|
||||
/* converse-singleton
|
||||
* ******************
|
||||
@ -40,7 +40,7 @@
|
||||
dependencies: ['converse-muc', 'converse-controlbox', 'converse-rosterview'],
|
||||
|
||||
enabled (_converse) {
|
||||
return _.includes(['mobile', 'fullscreen'], _converse.view_mode);
|
||||
return _.includes(['mobile', 'fullscreen', 'embedded'], _converse.view_mode);
|
||||
},
|
||||
|
||||
overrides: {
|
||||
|
Loading…
Reference in New Issue
Block a user