Skip to content

C
converse.js
Commit 9d1c6236 authored by JC Brand's avatar JC Brand
Browse files
Options

Move the xmpp status (e.g. profile) view into separate plugin

parent d3953878
Hide whitespace changes
Inline Side-by-side
Showing with 158 additions and 127 deletions
src/config.js
View file @ 9d1c6236
......@@ -72,6 +72,7 @@ require.config({
"converse-notification": "src/converse-notification",
"converse-otr": "src/converse-otr",
"converse-ping": "src/converse-ping",
"converse-profile": "src/converse-profile",
"converse-register": "src/converse-register",
"converse-roomslist": "src/converse-roomslist",
"converse-rosterview": "src/converse-rosterview",
......
src/converse-controlbox.js
View file @ 9d1c6236
......@@ -10,44 +10,33 @@
define(["jquery.noconflict",
"converse-core",
"lodash.fp",
"virtual-dom",
"vdom-parser",
"tpl!add_contact_dropdown",
"tpl!add_contact_form",
"tpl!converse_brand_heading",
"tpl!change_status_message",
"tpl!chat_status",
"tpl!choose_status",
"tpl!contacts_panel",
"tpl!contacts_tab",
"tpl!controlbox",
"tpl!controlbox_toggle",
"tpl!login_panel",
"tpl!search_contact",
"tpl!status_option",
"tpl!spinner",
"converse-chatview",
"converse-rosterview"
"converse-rosterview",
"converse-profile"
], factory);
}(this, function (
$,
converse,
fp,
vdom,
vdom_parser,
tpl_add_contact_dropdown,
tpl_add_contact_form,
tpl_brand_heading,
tpl_change_status_message,
tpl_chat_status,
tpl_choose_status,
tpl_contacts_panel,
tpl_contacts_tab,
tpl_controlbox,
tpl_controlbox_toggle,
tpl_login_panel,
tpl_search_contact,
tpl_status_option,
tpl_spinner
) {
"use strict";
......@@ -552,120 +541,6 @@
});
_converse.XMPPStatusView = Backbone.View.extend({
el: "form#set-xmpp-status",
events: {
"click a.choose-xmpp-status": "toggleOptions",
"click #fancy-xmpp-status-select a.change-xmpp-status-message": "renderStatusChangeForm",
"submit": "setStatusMessage",
"click .dropdown dd ul li a": "setStatus"
},
initialize () {
this.model.on("change:status", this.updateStatusUI, this);
this.model.on("change:status_message", this.updateStatusUI, this);
this.model.on("update-status-ui", this.updateStatusUI, this);
},
render () {
// Replace the default dropdown with something nicer
const $select = this.$el.find('select#select-xmpp-status');
const chat_status = this.model.get('status') || 'offline';
const options = $('option', $select);
const options_list = [];
this.$el.html(tpl_choose_status());
this.$el.find('#fancy-xmpp-status-select')
.html(tpl_chat_status({
'status_message': this.model.get('status_message') || __("I am %1$s", this.getPrettyStatus(chat_status)),
'chat_status': chat_status,
'desc_custom_status': __('Click here to write a custom status message'),
'desc_change_status': __('Click to change your chat status')
}));
// iterate through all the <option> elements and add option values
options.each(function () {
options_list.push(tpl_status_option({
'value': $(this).val(),
'text': this.text
}));
});
const $options_target = this.$el.find("#target dd ul").hide();
$options_target.append(options_list.join(''));
$select.remove();
return this;
},
toggleOptions (ev) {
ev.preventDefault();
utils.slideInAllElements(
document.querySelectorAll('#conversejs .contact-form-container')
);
$(ev.target).parent().parent().siblings('dd').find('ul').toggle('fast');
},
renderStatusChangeForm (ev) {
ev.preventDefault();
const status_message = _converse.xmppstatus.get('status_message') || '';
const input = tpl_change_status_message({
'status_message': status_message,
'label_custom_status': __('Custom status'),
'label_save': __('Save')
});
const $xmppstatus = this.$el.find('.xmpp-status');
$xmppstatus.parent().addClass('no-border');
$xmppstatus.replaceWith(input);
this.$el.find('.custom-xmpp-status').focus().focus();
},
setStatusMessage (ev) {
ev.preventDefault();
this.model.setStatusMessage($(ev.target).find('input').val());
},
setStatus (ev) {
ev.preventDefault();
const $el = $(ev.currentTarget),
value = $el.attr('data-value');
if (value === 'logout') {
this.$el.find(".dropdown dd ul").hide();
_converse.logOut();
} else {
this.model.setStatus(value);
this.$el.find(".dropdown dd ul").hide();
}
},
getPrettyStatus (stat) {
if (stat === 'chat') {
return __('online');
} else if (stat === 'dnd') {
return __('busy');
} else if (stat === 'xa') {
return __('away for long');
} else if (stat === 'away') {
return __('away');
} else if (stat === 'offline') {
return __('offline');
} else {
return __(stat) || __('online');
}
},
updateStatusUI (model) {
const stat = model.get('status');
// For translators: the %1$s part gets replaced with the status
// Example, I am online
const status_message = model.get('status_message') || __("I am %1$s", this.getPrettyStatus(stat));
this.$el.find('#fancy-xmpp-status-select').removeClass('no-border').html(
tpl_chat_status({
'chat_status': stat,
'status_message': status_message,
'desc_custom_status': __('Click here to write a custom status message'),
'desc_change_status': __('Click to change your chat status')
}));
}
});
_converse.ContactsPanel = Backbone.View.extend({
tagName: 'div',
className: 'controlbox-pane',
......
src/converse-core.js
View file @ 9d1c6236
......@@ -78,6 +78,7 @@
'converse-notification',
'converse-otr',
'converse-ping',
'converse-profile',
'converse-register',
'converse-roomslist',
'converse-rosterview',
......
src/converse-profile.js 0 → 100644
View file @ 9d1c6236
// Converse.js (A browser based XMPP chat client)
// http://conversejs.org
//
// Copyright (c) 2012-2017, Jan-Carel Brand <jc@opkode.com>
// Licensed under the Mozilla Public License (MPLv2)
//
/*global define */
(function (root, factory) {
define(["jquery.noconflict",
"converse-core",
"tpl!change_status_message",
"tpl!chat_status",
"tpl!choose_status",
"tpl!status_option",
"converse-vcard"
], factory);
}(this, function (
$,
converse,
tpl_change_status_message,
tpl_chat_status,
tpl_choose_status,
tpl_status_option
) {
"use strict";
const { Strophe, Backbone, Promise, utils, _, moment } = converse.env;
converse.plugins.add('converse-profile', {
initialize () {
/* The initialize function gets called as soon as the plugin is
* loaded by converse.js's plugin machinery.
*/
const { _converse } = this,
{ __ } = _converse;
_converse.XMPPStatusView = Backbone.View.extend({
el: "form#set-xmpp-status",
events: {
"click a.choose-xmpp-status": "toggleOptions",
"click #fancy-xmpp-status-select a.change-xmpp-status-message": "renderStatusChangeForm",
"submit": "setStatusMessage",
"click .dropdown dd ul li a": "setStatus"
},
initialize () {
this.model.on("change:status", this.updateStatusUI, this);
this.model.on("change:status_message", this.updateStatusUI, this);
this.model.on("update-status-ui", this.updateStatusUI, this);
},
render () {
// Replace the default dropdown with something nicer
const $select = this.$el.find('select#select-xmpp-status');
const chat_status = this.model.get('status') || 'offline';
const options = $('option', $select);
const options_list = [];
this.$el.html(tpl_choose_status());
this.$el.find('#fancy-xmpp-status-select')
.html(tpl_chat_status({
'status_message': this.model.get('status_message') || __("I am %1$s", this.getPrettyStatus(chat_status)),
'chat_status': chat_status,
'desc_custom_status': __('Click here to write a custom status message'),
'desc_change_status': __('Click to change your chat status')
}));
// iterate through all the <option> elements and add option values
options.each(function () {
options_list.push(tpl_status_option({
'value': $(this).val(),
'text': this.text
}));
});
const $options_target = this.$el.find("#target dd ul").hide();
$options_target.append(options_list.join(''));
$select.remove();
return this;
},
toggleOptions (ev) {
ev.preventDefault();
utils.slideInAllElements(
document.querySelectorAll('#conversejs .contact-form-container')
);
$(ev.target).parent().parent().siblings('dd').find('ul').toggle('fast');
},
renderStatusChangeForm (ev) {
ev.preventDefault();
const status_message = _converse.xmppstatus.get('status_message') || '';
const input = tpl_change_status_message({
'status_message': status_message,
'label_custom_status': __('Custom status'),
'label_save': __('Save')
});
const $xmppstatus = this.$el.find('.xmpp-status');
$xmppstatus.parent().addClass('no-border');
$xmppstatus.replaceWith(input);
this.$el.find('.custom-xmpp-status').focus().focus();
},
setStatusMessage (ev) {
ev.preventDefault();
this.model.setStatusMessage($(ev.target).find('input').val());
},
setStatus (ev) {
ev.preventDefault();
const $el = $(ev.currentTarget),
value = $el.attr('data-value');
if (value === 'logout') {
this.$el.find(".dropdown dd ul").hide();
_converse.logOut();
} else {
this.model.setStatus(value);
this.$el.find(".dropdown dd ul").hide();
}
},
getPrettyStatus (stat) {
if (stat === 'chat') {
return __('online');
} else if (stat === 'dnd') {
return __('busy');
} else if (stat === 'xa') {
return __('away for long');
} else if (stat === 'away') {
return __('away');
} else if (stat === 'offline') {
return __('offline');
} else {
return __(stat) || __('online');
}
},
updateStatusUI (model) {
const stat = model.get('status');
// For translators: the %1$s part gets replaced with the status
// Example, I am online
const status_message = model.get('status_message') || __("I am %1$s", this.getPrettyStatus(stat));
this.$el.find('#fancy-xmpp-status-select').removeClass('no-border').html(
tpl_chat_status({
'chat_status': stat,
'status_message': status_message,
'desc_custom_status': __('Click here to write a custom status message'),
'desc_change_status': __('Click to change your chat status')
}));
}
});
}
});
}));
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