Skip to content

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

More working on trimming chats. (still very buggy) 

More flesh on the view and superview for trimmed chats.
Add event handlers.
Renamed some methods to make them shorter, more consistent.
parent 2d237f9e
Hide whitespace changes
Inline Side-by-side
Showing with 75 additions and 50 deletions
converse.js
View file @ ad51e1c0
......@@ -668,14 +668,16 @@
*/
var attrs;
// Handle both `"key", value` and `{key: value}` -style arguments.
if (key == null || typeof key === 'object') {
if (key === null || typeof key === 'object') {
attrs = key;
options = val;
} else {
(attrs = {})[key] = val;
}
if (typeof attrs === 'object' && attrs.trimmed) {
delete attrs.trimmed;
if (typeof attrs === 'object' && attrs !== null) {
if (attrs.trimmed) {
delete attrs.trimmed;
}
}
Backbone.Model.prototype.save.call(this, attrs, options);
},
......@@ -881,7 +883,7 @@
is_chatroom: false, // This is not a multi-user chatroom
events: {
'click .close-chatbox-button': 'closeChat',
'click .close-chatbox-button': 'close',
'click .toggle-chatbox-button': 'toggleChatBox',
'keypress textarea.chat-textarea': 'keyPressed',
'click .toggle-smiley': 'toggleEmoticonMenu',
......@@ -1303,6 +1305,9 @@
if (_.has(item.changed, 'otr_status')) {
this.renderToolbar().informOTRChange();
}
if (_.has(item.changed, 'trimmed')) {
this.trim();
}
// TODO check for changed fullname as well
},
......@@ -1310,7 +1315,7 @@
this.$el.find('p.user-custom-message').text(msg).attr('title', msg);
},
closeChat: function () {
close: function () {
if (converse.connection) {
this.model.destroy();
} else {
......@@ -1319,12 +1324,8 @@
return this;
},
trimChat: function () {
// TODO: Instead of closing the chat, we should add it to
// div#offscreen-chatboxes
this.model.set('trimmed', true);
this.$el.hide(); // Hide it immediately to avoid flashes on the screen
this.closeChat();
trim: function () {
this.$el.hide();
},
saveToggleState: function () {
......@@ -1786,7 +1787,7 @@
}
}
if (!nick) { return; }
chatroom = converse.chatboxviews.showChatBox({
chatroom = converse.chatboxviews.showChat({
'id': jid,
'jid': jid,
'name': Strophe.unescapeNode(Strophe.getNodeFromJid(jid)),
......@@ -1805,7 +1806,7 @@
className: 'chatbox',
id: 'controlbox',
events: {
'click a.close-chatbox-button': 'closeChat',
'click a.close-chatbox-button': 'close',
'click ul#controlbox-tabs li a': 'switchTab',
'mousedown .dragresize-tm': 'onDragResizeStart'
},
......@@ -1909,7 +1910,7 @@
tagName: 'div',
className: 'chatroom',
events: {
'click .close-chatbox-button': 'closeChat',
'click .close-chatbox-button': 'close',
'click .toggle-chatbox-button': 'toggleChatBox',
'click .configure-chatroom-button': 'configureChatRoom',
'click .toggle-smiley': 'toggleEmoticonMenu',
......@@ -2406,7 +2407,7 @@
this.ChatBoxes = Backbone.Collection.extend({
model: converse.ChatBox,
comparator : 'time_opened',
comparator: 'time_opened',
registerMessageHandler: function () {
converse.connection.addHandler(
......@@ -2525,7 +2526,7 @@
view.model = item;
view.initialize();
}
this.trimOpenChats(view);
this.trimChats(view);
}, this);
},
......@@ -2549,13 +2550,14 @@
}
},
trimOpenChats: function (view) {
trimChats: function (view) {
/* This method is called before a new chat box will be opened.
*
* Check whether there is enough space in the page to show
* another chat box. Otherwise, close the oldest chat box.
*/
var toggle_width = 0,
trimmed_chats_width,
boxes_width = view.$el.outerWidth(true),
controlbox = this.get('controlbox');
if (!controlbox || !controlbox.$el.is(':visible')) {
......@@ -2570,13 +2572,24 @@
if (this.model.length <= 1) {
return;
}
if ((boxes_width + toggle_width) > this.$el.width()) {
// trim oldest view (which is not controlbox)
this.get(this.model.at(1).get('id')).trimChat();
trimmed_chats_width = this.trimmed_chatboxes_view.$('.box-flyout').outerWidth(true) || 0;
if ((trimmed_chats_width + boxes_width + toggle_width) > this.$el.width()) {
this.getOldestNonTrimmedChat().set('trimmed', true);
}
},
showChatBox: function (attrs) {
getOldestNonTrimmedChat: function () {
// Get oldest view (which is not controlbox)
var i = 0;
var model = this.model.at(i);
while (model.get('id') === 'controlbox' || model.get('trimmed') === true) {
i++;
model = this.model.at(i);
}
return model;
},
showChat: function (attrs) {
var chatbox = this.model.get(attrs.jid);
if (chatbox) {
chatbox.trigger('show');
......@@ -2592,22 +2605,32 @@
});
this.TrimmedChatBoxView = Backbone.View.extend({
tagName: 'div',
className: 'chat-head',
events: {
'click .close-chatbox-button': 'close',
'click .restore-chat': 'restore'
},
render: function () {
return this.$el;
return this.$el.addClass('chat-head-chatbox').html(
converse.templates.trimmed_chat(this.model.toJSON()));
},
_ensureElement: function() {
/* Override method from backbone.js
* Make sure that the el and $el attributes point to a DOM snippet
* from src/templates/trimmed_chat.html
*/
if (!this.el) {
var $el = $(converse.templates.trimmed_chat());
this.setElement($el, false);
} else {
this.setElement(_.result(this, 'el'), false);
}
close: function (ev) {
ev.preventDefault();
this.$el.remove();
this.model.destroy();
return this;
},
restore: function (ev) {
ev.preventDefault();
this.model.set('trimmed', false);
this.$el.remove();
return this;
}
});
this.TrimmedChatBoxesView = Backbone.View.extend({
......@@ -2628,7 +2651,7 @@
var view;
if (item.get('trimmed')) {
view = new converse.TrimmedChatBoxView({model: item});
this.$el.append(view.render());
this.$('.box-flyout').append(view.render());
views[item.get('id')] = view;
} else {
this.remove(item.get('id'));
......@@ -2684,7 +2707,7 @@
openChat: function (ev) {
ev.preventDefault();
return converse.chatboxviews.showChatBox({
return converse.chatboxviews.showChat({
'id': this.model.get('jid'),
'jid': this.model.get('jid'),
'fullname': this.model.get('fullname'),
......
spec/chatbox.js
View file @ ad51e1c0
......@@ -104,8 +104,8 @@
var chatbox = utils.openChatBoxes(1)[0],
controlview = this.chatboxviews.get('controlbox'), // The controlbox is currently open
chatview = this.chatboxviews.get(chatbox.get('jid'));
spyOn(chatview, 'closeChat').andCallThrough();
spyOn(controlview, 'closeChat').andCallThrough();
spyOn(chatview, 'close').andCallThrough();
spyOn(controlview, 'close').andCallThrough();
spyOn(converse, 'emit');
// We need to rebind all events otherwise our spy won't be called
......@@ -117,14 +117,14 @@
});
waits(250);
runs(function () {
expect(controlview.closeChat).toHaveBeenCalled();
expect(controlview.close).toHaveBeenCalled();
expect(converse.emit).toHaveBeenCalledWith('onChatBoxClosed', jasmine.any(Object));
expect(converse.emit.callCount, 1);
chatview.$el.find('.close-chatbox-button').click();
});
waits(250);
runs(function () {
expect(chatview.closeChat).toHaveBeenCalled();
expect(chatview.close).toHaveBeenCalled();
expect(converse.emit).toHaveBeenCalledWith('onChatBoxClosed', jasmine.any(Object));
expect(converse.emit.callCount, 2);
});
......@@ -303,7 +303,7 @@
$toolbar = view.$el.find('ul.chat-toolbar');
callButton = $toolbar.find('.toggle-call');
expect(callButton.length).toBe(0);
view.closeChat();
view.close();
// Now check that it's shown if enabled and that it emits
// onCallButtonClicked
converse.visible_toolbar_buttons.call = true; // enable the button
......@@ -328,7 +328,7 @@
$toolbar = view.$el.find('ul.chat-toolbar');
clearButton = $toolbar.find('.toggle-clear');
expect(clearButton.length).toBe(0);
view.closeChat();
view.close();
// Now check that it's shown if enabled and that it calls
// clearMessages
converse.visible_toolbar_buttons.clear = true; // enable the button
......
spec/chatroom.js
View file @ ad51e1c0
......@@ -174,7 +174,7 @@
it("can be closed again by clicking a DOM element with class 'close-chatbox-button'", $.proxy(function () {
var view = this.chatboxviews.get('lounge@muc.localhost'), chatroom = view.model, $el;
spyOn(view, 'closeChat').andCallThrough();
spyOn(view, 'close').andCallThrough();
spyOn(converse, 'emit');
spyOn(converse.connection.muc, 'leave');
view.delegateEvents(); // We need to rebind all events otherwise our spy won't be called
......@@ -183,7 +183,7 @@
});
waits(250);
runs(function () {
expect(view.closeChat).toHaveBeenCalled();
expect(view.close).toHaveBeenCalled();
expect(this.connection.muc.leave).toHaveBeenCalled();
expect(this.emit).toHaveBeenCalledWith('onChatBoxClosed', jasmine.any(Object));
}.bind(converse));
......@@ -204,7 +204,7 @@
afterEach($.proxy(function () {
var view = this.chatboxviews.get('problematic@muc.localhost');
view.closeChat();
view.close();
}, converse));
it("will show an error message if the room requires a password", $.proxy(function () {
......
src/templates/trimmed_chat.html
View file @ ad51e1c0
<div class="chat-head">
<a class="close-chatbox-button icon-close"></a>
<div class="chat-title">JC Brand</div>
<a class="close-chatbox-button icon-close"></a>
<div class="chat-title">
<a href="#" class="restore-chat">
{{ fullname }}
</a>
</div>
tests/utils.js
View file @ ad51e1c0
......@@ -13,7 +13,7 @@
var i, chatbox;
for (i=converse.chatboxes.models.length-1; i>-1; i--) {
chatbox = converse.chatboxes.models[i];
converse.chatboxviews.get(chatbox.get('id')).closeChat();
converse.chatboxviews.get(chatbox.get('id')).close();
}
return this;
};
......@@ -22,10 +22,10 @@
var i, chatbox, num_chatboxes = converse.chatboxes.models.length;
for (i=num_chatboxes-1; i>-1; i--) {
chatbox = converse.chatboxes.models[i];
converse.chatboxviews.get(chatbox.get('id')).closeChat();
converse.chatboxviews.get(chatbox.get('id')).close();
converse.chatboxviews.get(chatbox.get('id')).$el.remove();
}
converse.chatboxviews.get('controlbox').closeChat();
converse.chatboxviews.get('controlbox').close();
converse.chatboxviews.get('controlbox').$el.remove();
return this;
};
......
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