Skip to content

C
converse.js
Commit 4e077aac authored by JC Brand's avatar JC Brand
Browse files
Options

Start moving code from the plugin to converse-chatview

parent 400bdf77
Hide whitespace changes
Inline Side-by-side
Showing with 85 additions and 119 deletions
src/converse-chatboxes.js
View file @ 4e077aac
......@@ -128,6 +128,9 @@
* that contains the message stanza, if it was
* contained, otherwise it's the message stanza itself.
*/
const { _converse } = this.__super__,
{ __ } = _converse;
delay = delay || message.querySelector('delay');
const type = message.getAttribute('type'),
body = this.getMessageBody(message);
......@@ -155,7 +158,8 @@
sender = 'them';
fullname = this.get('fullname') || from;
}
return {
const spoiler = message.querySelector(`spoiler[xmlns="${Strophe.NS.SPOILER}"]`);
const attrs = {
'type': type,
'chat_state': chat_state,
'delayed': delayed,
......@@ -163,8 +167,13 @@
'message': body || undefined,
'msgid': message.getAttribute('id'),
'sender': sender,
'time': time
'time': time,
'is_spoiler': !_.isNull(spoiler)
};
if (spoiler) {
attrs.spoiler_hint = spoiler.textContent.length > 0 ? spoiler.textContent : __('Spoiler');
}
return attrs;
},
createMessage (message, delay, original_stanza) {
......
src/converse-chatview.js
View file @ 4e077aac
......@@ -22,6 +22,7 @@
"tpl!message",
"tpl!new_day",
"tpl!spinner",
"tpl!spoiler_button",
"tpl!toolbar"
], factory);
}(this, function (
......@@ -39,6 +40,7 @@
tpl_message,
tpl_new_day,
tpl_spinner,
tpl_spoiler_button,
tpl_toolbar
) {
"use strict";
......@@ -268,13 +270,15 @@
events: {
'click .close-chatbox-button': 'close',
'keypress .chat-textarea': 'keyPressed',
'click .new-msgs-indicator': 'viewUnreadMessages',
'click .send-button': 'onFormSubmitted',
'click .toggle-smiley': 'toggleEmojiMenu',
'click .toggle-smiley ul.emoji-picker li': 'insertEmoji',
'click .toggle-clear': 'clearMessages',
'click .toggle-call': 'toggleCall',
'click .new-msgs-indicator': 'viewUnreadMessages'
'click .toggle-clear': 'clearMessages',
'click .toggle-smiley ul.emoji-picker li': 'insertEmoji',
'click .toggle-smiley': 'toggleEmojiMenu',
'click .toggle-spoiler-display': 'toggleSpoilerMessage',
'click .toggle-spoiler-edit': 'toggleEditSpoilerMessage',
'keypress .chat-textarea': 'keyPressed'
},
initialize () {
......@@ -709,13 +713,24 @@
},
createMessageStanza (message) {
return $msg({
from: _converse.connection.jid,
to: this.model.get('jid'),
type: 'chat',
id: message.get('msgid')
const stanza = $msg({
'from': _converse.connection.jid,
'to': this.model.get('jid'),
'type': 'chat',
'id': message.get('msgid')
}).c('body').t(message.get('message')).up()
.c(_converse.ACTIVE, {'xmlns': Strophe.NS.CHATSTATES}).up();
.c(_converse.ACTIVE, {'xmlns': Strophe.NS.CHATSTATES}).up();
if (this.model.get('sending_spoiler')) {
const has_hint = this.el.querySelector('.chat-textarea-hint').value.length > 0;
if (has_hint) {
const hint = document.querySelector('.chat-textarea-hint').value;
stanza.c('spoiler', {'xmlns': Strophe.NS.SPOILER }, hint);
} else {
stanza.c('spoiler', {'xmlns': Strophe.NS.SPOILER });
}
}
return stanza;
},
sendMessage (message) {
......@@ -780,13 +795,20 @@
/* Overridable method which returns the attributes to be
* passed to Backbone.Message's constructor.
*/
const fullname = _converse.xmppstatus.get('fullname');
return {
'fullname': _.isEmpty(fullname) ? _converse.bare_jid : fullname,
'sender': 'me',
'time': moment().format(),
'message': emojione.shortnameToUnicode(text)
const fullname = _converse.xmppstatus.get('fullname'),
is_spoiler = this.model.get('sending_spoiler'),
attrs = {
'fullname': _.isEmpty(fullname) ? _converse.bare_jid : fullname,
'sender': 'me',
'time': moment().format(),
'message': emojione.shortnameToUnicode(text),
'is_spoiler': is_spoiler
};
if (is_spoiler) {
const spoiler = this.el.querySelector('.chat-textarea-hint')
attrs.spoiler_hint = spoiler.textContent.length > 0 ? spoiler.textContent : __('Spoiler');
}
return attrs;
},
sendChatState () {
......@@ -960,6 +982,7 @@
getToolbarOptions (options) {
return _.extend(options || {}, {
'allow_spoiler_messages': _converse.allow_spoiler_messages,
'label_clear': __('Clear all messages'),
'label_insert_smiley': __('Insert a smiley'),
'label_start_call': __('Start a call'),
......@@ -979,7 +1002,6 @@
this.getToolbarOptions(options || {})
);
this.el.querySelector('.chat-toolbar').innerHTML = toolbar(options);
return this;
},
......@@ -991,6 +1013,26 @@
}
},
toggleEditSpoilerMessage () {
const { _converse } = this.__super__,
{ __ } = _converse,
text_area = this.el.querySelector('.chat-textarea'),
spoiler_button = this.el.querySelector('.toggle-spoiler-edit');
let spoiler_title;
if (this.model.get('sending_spoiler')) {
this.model.set('sending_spoiler', false);
spoiler_title = __('Click to write your message as a spoiler');
} else {
this.model.set('sending_spoiler', true);
spoiler_title = __('Click to write as a normal (non-spoiler) message');
}
spoiler_button.outerHTML = tpl_spoiler_button(_.extend(
this.model.toJSON(), {'title': spoiler_title})
)
this.renderMessageForm();
},
focus () {
const textarea_el = this.el.querySelector('.chat-textarea');
if (!_.isNull(textarea_el)) {
......
src/converse-spoilers.js
View file @ 4e077aac
(function (root, factory) {
define([
"converse-core",
"tpl!spoiler_button",
"converse-chatview"
], factory);
}(this, function (converse, tpl_spoiler_button) {
}(this, function (converse) {
const { _, Strophe } = converse.env;
const u = converse.env.utils;
......@@ -38,42 +37,6 @@
'ChatBoxView': {
'events': {
'click .toggle-spoiler-edit': 'toggleEditSpoilerMessage',
'click .toggle-spoiler-display': 'toggleSpoilerMessage'
},
addSpoilerToolbarButton () {
const toolbar_el = this.el.querySelector('.chat-toolbar');
if (!_.isNull(toolbar_el)) {
toolbar_el.insertAdjacentHTML(
'beforeend',
tpl_spoiler_button(_.extend(
this.model.toJSON(), {
'title': this.__super__._converse.__('Click here to write a message as a spoiler')
}))
);
}
},
renderToolbar (toolbar, options) {
const result = this.__super__.renderToolbar.apply(this, arguments);
this.addSpoilerToolbarButton();
return result;
},
getOutgoingMessageAttributes (text) {
const { __ } = this.__super__._converse,
attrs = this.__super__.getOutgoingMessageAttributes.apply(this, arguments);
if (this.model.get('sending_spoiler')) {
const spoiler = this.el.querySelector('.chat-textarea-hint')
attrs.is_spoiler = true;
attrs.spoiler_hint = spoiler.textContent.length > 0 ? spoiler.textContent : __('Spoiler');
}
return attrs;
},
toggleSpoilerMessage (event) {
const { _converse } = this.__super__,
{ __ } = _converse;
......@@ -106,44 +69,6 @@
}
},
toggleEditSpoilerMessage () {
const { _converse } = this.__super__,
{ __ } = _converse,
text_area = this.el.querySelector('.chat-textarea'),
spoiler_button = this.el.querySelector('.toggle-spoiler-edit');
let spoiler_title;
if (this.model.get('sending_spoiler')) {
this.model.set('sending_spoiler', false);
spoiler_title = __('Click to write your message as a spoiler');
} else {
this.model.set('sending_spoiler', true);
spoiler_title = __('Click to write as a normal (non-spoiler) message');
}
spoiler_button.outerHTML = tpl_spoiler_button(_.extend(
this.model.toJSON(), {'title': spoiler_title})
)
this.renderMessageForm();
},
addSpoilerElement (stanza) {
if (this.model.get('sending_spoiler')) {
const has_hint = this.el.querySelector('.chat-textarea-hint').value.length > 0;
if (has_hint) {
const hint = document.querySelector('.chat-textarea-hint').value;
stanza.c('spoiler', {'xmlns': Strophe.NS.SPOILER }, hint);
} else {
stanza.c('spoiler', {'xmlns': Strophe.NS.SPOILER });
}
}
},
createMessageStanza () {
const stanza = this.__super__.createMessageStanza.apply(this, arguments);
this.addSpoilerElement(stanza);
return stanza;
},
'renderMessage': function (attrs) {
/* Renders a chat message based on the passed in attributes.
*
......@@ -154,12 +79,8 @@
* The DOM element representing the message.
*/
const { _converse } = this.__super__,
{ __ } = _converse;
console.log('These are the attrs and the msg object\n');
console.log(attrs);
const msg = this.__super__.renderMessage.apply(this, arguments);
console.log(msg);
{ __ } = _converse,
msg = this.__super__.renderMessage.apply(this, arguments);
// Spoiler logic
// The value of the "spoiler" attribute, corresponds to the spoiler's hint.
......@@ -208,20 +129,6 @@
}
return msg;
}
},
'ChatBox': {
getMessageAttributes (message, delay, original_stanza) {
const attrs = this.__super__.getMessageAttributes.apply(this, arguments);
const spoiler = message.querySelector(`spoiler[xmlns="${Strophe.NS.SPOILER}"]`)
if (spoiler) {
const { __ } = this.__super__._converse;
attrs.is_spoiler = true;
attrs.spoiler_hint = spoiler.textContent.length > 0 ? spoiler.textContent : __('Spoiler');
}
return attrs;
}
}
}
});
......
src/templates/toolbar.html
View file @ 4e077aac
{[ if (o.use_emoji) { ]}
<li class="toggle-toolbar-menu toggle-smiley icon-happy" title="{{{o.label_insert_smiley}}}">
<ul class="emoji-picker"></ul>
</li>
<li class="toggle-toolbar-menu toggle-smiley icon-happy" title="{{{o.label_insert_smiley}}}">
<ul class="emoji-picker"></ul>
</li>
{[ } ]}
{[ if (o.allow_spoiler_messages) { ]}
<li class="toggle-spoiler-edit">
<a class="
{[ if (o.sending_spoiler) { ]} icon-eye-blocked {[ } ]}
{[ if (!o.sending_spoiler) { ]} icon-eye {[ } ]}"
title="{{ o.title }}"></a>
</li>
{[ } ]}
{[ if (o.show_call_button) { ]}
<li class="toggle-call"><a class="icon-phone" title="{{{o.label_start_call}}}"></a></li>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment
GitLab Nexedi Edition | About GitLab | About Nexedi | 沪ICP备2021021310号-2 | 沪ICP备2021021310号-7