Skip to content

C
converse.js
Commit 71f4cdb9 authored by JC Brand's avatar JC Brand
Browse files
Options

Initial work towards decoupling contact adding 

New conf variable in converse.js to indicate how contacts are added (either via
XHR or directly).
parent 76676dc3
Hide whitespace changes
Inline Side-by-side
Showing with 85 additions and 48 deletions
converse.css
View file @ 71f4cdb9
......@@ -234,7 +234,7 @@ a.subscribe-to-user {
font-weight: bold;
}
dl.add-xmpp-contact {
dl.add-converse-contact {
margin: 0 0 0 0.5em;
padding-top: 3px;
z-index: 21;
......@@ -246,7 +246,7 @@ dt#xmpp-contact-search {
}
.fancy-dropdown a.choose-xmpp-status,
.fancy-dropdown a.add-xmpp-contact {
.fancy-dropdown a.toggle-xmpp-contact-form {
text-shadow: 0 1px 0 rgba(250, 250, 250, 1);
padding-left: 1.5em;
width: 140px;
......@@ -283,7 +283,7 @@ form.search-xmpp-contact {
}
form.search-xmpp-contact input {
width: 9em;
width: 8em;
}
.oc-chat-head {
......@@ -596,20 +596,14 @@ form.sendXMPPMessage {
height: 54px;
}
form#set-custom-xmpp-status {
#set-custom-xmpp-status {
float: left;
padding: 0;
background: none;
}
#set-custom-xmpp-status button {
padding: 1px 2px 1px 1px;
}
input.custom-xmpp-status {
width: 138px;
}
/* status dropdown styles */
dl.dropdown {
margin-right: 0.5em;
......@@ -622,6 +616,10 @@ div.xmpp-status {
padding: 3px;
}
input.custom-xmpp-status {
height: 18px;
}
.fancy-dropdown {
border:1px solid #ddd;
height: 22px;
......
converse.js
View file @ 71f4cdb9
......@@ -573,9 +573,10 @@
className: 'oc-chat-content',
id: 'users',
events: {
'click a.add-xmpp-contact': 'toggleContactForm',
'click a.toggle-xmpp-contact-form': 'toggleContactForm',
'submit form.add-xmpp-contact': 'addContactFromForm',
'submit form.search-xmpp-contact': 'searchContacts',
'click a.subscribe-to-user': 'subscribeToContact'
'click a.subscribe-to-user': 'addContactFromList'
},
tab_template: _.template('<li><a class="s current" href="#users">Contacts</a></li>'),
......@@ -590,23 +591,38 @@
'</select>'+
'</span>'+
'</form>'+
'<dl class="add-xmpp-contact dropdown">' +
'<dl class="add-converse-contact dropdown">' +
'<dt id="xmpp-contact-search" class="fancy-dropdown">' +
'<a class="add-xmpp-contact" href="#" title="Click to search for new users to add as chat contacts">Add a contact</a>' +
'<a class="toggle-xmpp-contact-form" href="#" title="Click to add new chat contacts">Add a contact</a>' +
'</dt>' +
'<dd class="search-xmpp" style="display:none"><ul>' +
'</ul></dd>' +
'</dl>'
),
add_contact_template: _.template(
'<form class="add-xmpp-contact">' +
'<input type="text" name="identifier" class="username" placeholder="Contact name"/>' +
'<button type="submit">Add</button>' +
'</form>'),
search_contact_template: _.template(
'<form class="search-xmpp-contact">' +
'<input type="text" name="identifier" class="username" placeholder="Contact name"/>' +
'<button type="submit">Search</button>' +
'<ul id="found-users"></ul>' +
'</form>' +
'</ul></dd>' +
'</dl>'
),
'</form>'),
render: function () {
var markup;
this.$parent.find('#controlbox-tabs').append(this.tab_template());
this.$parent.find('#controlbox-panes').append(this.$el.html(this.template()));
if (xmppchat.xhr_user_search) {
markup = this.search_contact_template();
} else {
markup = this.add_contact_template();
}
this.$el.find('#xmpp-contact-search').siblings('.search-xmpp').append(markup);
return this;
},
......@@ -618,34 +634,44 @@
searchContacts: function (ev) {
ev.preventDefault();
$.getJSON(portal_url + "/search-users?q=" + $(ev.target).find('input.username').val(), function (data) {
var $results_el = $('#found-users');
$(data).each(function (idx, obj) {
if ($results_el.children().length) {
$results_el.empty();
}
$results_el.append(
$('<li></li>')
.attr('id', 'found-users-'+obj.id)
.append(
$('<a class="subscribe-to-user" href="#" title="Click to add as a chat contact"></a>')
.attr('data-recipient', Strophe.escapeNode(obj.id)+'@'+xmppchat.domain)
.text(obj.fullname)
)
);
});
});
},
var $results_el = $('#found-users');
$(data).each(function (idx, obj) {
if ($results_el.children().length) {
$results_el.empty();
}
$results_el.append(
$('<li></li>')
.attr('id', 'found-users-'+obj.id)
.append(
$('<a class="subscribe-to-user" href="#" title="Click to add as a chat contact"></a>')
.attr('data-recipient', Strophe.escapeNode(obj.id)+'@'+xmppchat.domain)
.text(obj.fullname)
)
);
});
});
},
addContactFromForm: function (ev) {
ev.preventDefault();
this.addContact($(ev.target).find('input').val());
$('.search-xmpp').hide();
},
subscribeToContact: function (ev) {
addContactFromList: function (ev) {
ev.preventDefault();
var $target = $(ev.target),
jid = $target.attr('data-recipient'),
name = $target.text();
xmppchat.connection.roster.add(jid, name, [], function (iq) {
xmppchat.connection.roster.subscribe(jid, null, xmppchat.fullname);
});
this.addContact(jid, name);
$target.parent().remove();
$('.search-xmpp').hide();
},
addContact: function (jid, name) {
xmppchat.connection.roster.add(jid, name, [], function (iq) {
xmppchat.connection.roster.subscribe(jid, null, xmppchat.fullname);
});
}
});
......@@ -1910,11 +1936,12 @@
$('.conn-feedback').text(message);
}
xmppchat.initialize = function () {
var chatdata = $('div#collective-xmpp-chat-data');
this.fullname = chatdata.attr('fullname');
this.prebind = chatdata.attr('prebind');
this.auto_subscribe = chatdata.attr('auto_subscribe') === "True" || false;
xmppchat.initialize = function (data) {
this.prebind = data.attr('prebind');
this.fullname = data.attr('fullname');
this.xhr_user_search = data.attr('xhr_user_search');
this.auto_subscribe = data.attr('auto_subscribe') === "True" || false;
this.chatboxes = new this.ChatBoxes();
this.chatboxesview = new this.ChatBoxesView({model: this.chatboxes});
$('a.toggle-online-users').bind(
......@@ -1978,7 +2005,9 @@
// Event handlers
// --------------
$(document).ready($.proxy(function () {
this.initialize();
// TODO: This code is Plone specific and needs to be factored out
var data = $('div#collective-xmpp-chat-data');
this.initialize(data);
$(document).bind('jarnxmpp.connecting', $.proxy(function (ev, conn) {
this.giveFeedback('Connecting to chat...');
}, this));
......
spec/MainSpec.js
View file @ 71f4cdb9
......@@ -400,8 +400,20 @@
}, xmppchat));
}, xmppchat));
describe("A Chatbox", $.proxy(function () {
describe("The 'Add Contact' widget", $.proxy(function () {
it("opens up an add form when you click on it", $.proxy(function () {
var panel = this.chatboxesview.views.controlbox.contactspanel;
spyOn(panel, 'toggleContactForm').andCallThrough();
panel.delegateEvents(); // We need to rebind all events otherwise our spy won't be called
panel.$el.find('a.toggle-xmpp-contact-form').click();
expect(panel.toggleContactForm).toHaveBeenCalled();
// XXX: Awaiting more tests, close it again for now...
panel.$el.find('a.toggle-xmpp-contact-form').click();
}, xmppchat));
}, xmppchat));
describe("A Chatbox", $.proxy(function () {
it("is created when you click on a roster item", $.proxy(function () {
var i, $el, click, jid, view;
// showControlBox was called earlier, so the controlbox is
......@@ -585,10 +597,8 @@
}, xmppchat));
}, xmppchat));
}, xmppchat));
}, xmppchat));
}, xmppchat));
}));
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