From 9b445f84556bd1521970740fd42aeb86fe821c31 Mon Sep 17 00:00:00 2001
From: JC Brand
Date: Fri, 19 Apr 2013 21:03:26 +0200
Subject: [PATCH 1/5] Small tweaks to tests to provide better visual feedback
---
spec/MainSpec.js | 33 +++++++++++++++++++++++----------
1 file changed, 23 insertions(+), 10 deletions(-)
diff --git a/spec/MainSpec.js b/spec/MainSpec.js
index b3681bdb6..841423de2 100644
--- a/spec/MainSpec.js
+++ b/spec/MainSpec.js
@@ -57,17 +57,25 @@
this.onConnected(mock_connection);
this.animate = false; // don't use animations
+ // Variable declarations for specs
+ var open_controlbox;
+
describe("The Control Box", $.proxy(function () {
it("is not shown by default", $.proxy(function () {
expect(this.rosterview.$el.is(':visible')).toEqual(false);
}, xmppchat));
- it("can be opened by clicking a DOM element with class 'toggle-online-users'", $.proxy(function () {
+ open_controlbox = $.proxy(function () {
+ // This spec will only pass if the controlbox is not currently
+ // open yet.
+ expect($("div#controlbox").is(':visible')).toBe(false);
spyOn(this, 'toggleControlBox').andCallThrough();
$('.toggle-online-users').click();
expect(this.toggleControlBox).toHaveBeenCalled();
- }, xmppchat));
-
+ expect($("div#controlbox").is(':visible')).toBe(true);
+ }, xmppchat);
+ it("can be opened by clicking a DOM element with class 'toggle-online-users'", open_controlbox);
+
describe("The Status Widget", $.proxy(function () {
it("can be used to set the current user's chat status", $.proxy(function () {
var view = this.xmppstatusview;
@@ -98,14 +106,16 @@
spyOn(view, 'setStatusMessage').andCallThrough();
spyOn(view, 'renderStatusChangeForm').andCallThrough();
view.delegateEvents(); // We need to rebind all events otherwise our spy won't be called
- runs(function () {
- view.$el.find('a.change-xmpp-status-message').click();
- expect(view.renderStatusChangeForm).toHaveBeenCalled();
- });
- waits(250);
- runs(function () {
- var msg = 'I am happy';
+ view.$el.find('a.change-xmpp-status-message').click();
+ expect(view.renderStatusChangeForm).toHaveBeenCalled();
+ // The async testing here is used only to provide time for
+ // visual feedback
+ var msg = 'I am happy';
+ runs (function () {
view.$el.find('form input.custom-xmpp-status').val(msg);
+ });
+ waits(500);
+ runs (function () {
view.$el.find('form#set-custom-xmpp-status').submit();
expect(view.setStatusMessage).toHaveBeenCalled();
expect(view.$el.find('a.choose-xmpp-status').hasClass('online')).toBe(true);
@@ -450,6 +460,9 @@
// in localStorage either.
newchatboxes.onConnected();
expect(newchatboxes.length).toEqual(0);
+
+ // Lets open the controlbox again, purely for visual feedback
+ open_controlbox();
}, xmppchat));
describe("A Chat Message", $.proxy(function () {
From a306e1a7164949376e5961970da0661de70fcea6 Mon Sep 17 00:00:00 2001
From: JC Brand
Date: Fri, 19 Apr 2013 22:10:52 +0200
Subject: [PATCH 2/5] Clear the chatroom input when form was submitted
---
converse.js | 18 ++++++++++--------
1 file changed, 10 insertions(+), 8 deletions(-)
diff --git a/converse.js b/converse.js
index 6490ac0d3..cc5aa215e 100644
--- a/converse.js
+++ b/converse.js
@@ -710,11 +710,13 @@
createChatRoom: function (ev) {
ev.preventDefault();
- var name, jid;
+ var name, jid, input;
if (ev.type === 'click') {
jid = $(ev.target).attr('data-room-jid');
} else {
- name = $(ev.target).find('input.new-chatroom-name').val().trim().toLowerCase();
+ input = this.$el.find('input.new-chatroom-name');
+ name = input.val().trim().toLowerCase();
+ input.val(''); // Clear the input
if (name) {
jid = Strophe.escapeNode(name) + '@' + xmppchat.muc_domain;
} else {
@@ -882,11 +884,11 @@
initialize: function () {
xmppchat.connection.muc.join(
- this.model.get('jid'),
- this.model.get('nick'),
- $.proxy(this.onChatRoomMessage, this),
- $.proxy(this.onChatRoomPresence, this),
- $.proxy(this.onChatRoomRoster, this));
+ this.model.get('jid'),
+ this.model.get('nick'),
+ $.proxy(this.onChatRoomMessage, this),
+ $.proxy(this.onChatRoomPresence, this),
+ $.proxy(this.onChatRoomRoster, this));
this.model.messages.on('add', this.showMessage, this);
@@ -983,7 +985,7 @@
},
onChatRoomRoster: function (roster, room) {
- // underscore size is needed because roster is on object
+ // underscore size is needed because roster is an object
var controlboxview = xmppchat.chatboxesview.views.controlbox,
roster_size = _.size(roster),
$participant_list = this.$el.find('.participant-list'),
From fdd369edddad654ea45c0e4ee5a65883a2fbf6d7 Mon Sep 17 00:00:00 2001
From: JC Brand
Date: Fri, 19 Apr 2013 22:11:25 +0200
Subject: [PATCH 3/5] Make the heading clickable (returns to home)
---
index.html | 2 +-
stylesheets/stylesheet.css | 4 ++++
tests.html | 2 +-
3 files changed, 6 insertions(+), 2 deletions(-)
diff --git a/index.html b/index.html
index f42b7c4b9..afb5e7b05 100644
--- a/index.html
+++ b/index.html
@@ -16,7 +16,7 @@
View on GitHub
- Converse.js
+
Browser-based Instant Messaging with Strophe.js and Backbone.js
diff --git a/stylesheets/stylesheet.css b/stylesheets/stylesheet.css
index d00fb4529..e07313966 100644
--- a/stylesheets/stylesheet.css
+++ b/stylesheets/stylesheet.css
@@ -124,6 +124,10 @@ a {
-ms-transition: text-shadow 0.5s ease;
}
+h1 a {
+ color: white;
+}
+
#main_content a:hover {
color: #0069ba;
text-shadow: #5390c8 0px 0px 2px;
diff --git a/tests.html b/tests.html
index 6584eadb1..355632e1c 100644
--- a/tests.html
+++ b/tests.html
@@ -16,7 +16,7 @@
From 286b716300262aef3061065ba1c75f62077aef99 Mon Sep 17 00:00:00 2001
From: JC Brand
Date: Fri, 19 Apr 2013 22:11:40 +0200
Subject: [PATCH 4/5] Add initial chatroom tests.
---
spec/MainSpec.js | 76 +++++++++++++++++++++++++++++++++++++++++++-----
1 file changed, 68 insertions(+), 8 deletions(-)
diff --git a/spec/MainSpec.js b/spec/MainSpec.js
index 841423de2..515aa5423 100644
--- a/spec/MainSpec.js
+++ b/spec/MainSpec.js
@@ -24,7 +24,8 @@
this.bare_jid = 'dummy@localhost';
mock_connection = {
'muc': {
- 'listRooms': function () {}
+ 'listRooms': function () {},
+ 'join': function () {}
},
'jid': this.bare_jid,
'addHandler': function (handler, ns, name, type, id, from, options) {
@@ -82,18 +83,19 @@
spyOn(view, 'toggleOptions').andCallThrough();
spyOn(view, 'setStatus').andCallThrough();
view.delegateEvents(); // We need to rebind all events otherwise our spy won't be called
-
- view.$el.find('a.choose-xmpp-status').click();
- expect(view.toggleOptions).toHaveBeenCalled();
- expect(view.$el.find('a.choose-xmpp-status').hasClass('online')).toBe(false);
-
+ runs(function () {
+ view.$el.find('a.choose-xmpp-status').click();
+ expect(view.toggleOptions).toHaveBeenCalled();
+ expect(view.$el.find('a.choose-xmpp-status').hasClass('online')).toBe(false);
+ });
+ waits(250);
runs(function () {
spyOn(view, 'updateStatusUI').andCallThrough();
view.initialize(); // Rebind events for spy
view.$el.find('.dropdown dd ul li a').first().click();
expect(view.setStatus).toHaveBeenCalled();
});
- waits(100);
+ waits(250);
runs($.proxy(function () {
expect(view.updateStatusUI).toHaveBeenCalled();
expect(view.$el.find('a.choose-xmpp-status').hasClass('online')).toBe(true);
@@ -114,7 +116,7 @@
runs (function () {
view.$el.find('form input.custom-xmpp-status').val(msg);
});
- waits(500);
+ waits(250);
runs (function () {
view.$el.find('form#set-custom-xmpp-status').submit();
expect(view.setStatusMessage).toHaveBeenCalled();
@@ -530,5 +532,63 @@
}, xmppchat));
}, xmppchat));
+ describe("The Controlbox Tabs", $.proxy(function () {
+ it("consist of two tabs, 'Contacts' and 'ChatRooms', of which 'Contacts' is by default visible", $.proxy(function () {
+ var cbview = this.chatboxesview.views.controlbox;
+ var $panels = cbview.$el.find('#controlbox-panes');
+ expect($panels.children().length).toBe(2);
+ expect($panels.children().first().attr('id')).toBe('users');
+ expect($panels.children().first().is(':visible')).toBe(true);
+ expect($panels.children().last().attr('id')).toBe('chatrooms');
+ expect($panels.children().last().is(':visible')).toBe(false);
+ }, xmppchat));
+
+ describe("The Chatrooms Panel", $.proxy(function () {
+
+ it("is opened by clicking the 'Chatrooms' tab", $.proxy(function () {
+ var cbview = this.chatboxesview.views.controlbox;
+ var $tabs = cbview.$el.find('#controlbox-tabs');
+ var $panels = cbview.$el.find('#controlbox-panes');
+ var $contacts = $panels.children().first();
+ var $chatrooms = $panels.children().last();
+ spyOn(cbview, 'switchTab').andCallThrough();
+ cbview.delegateEvents(); // We need to rebind all events otherwise our spy won't be called
+ runs(function () {
+ $tabs.find('li').last().find('a').click(); // Clicks the chatrooms tab
+ });
+ waits(250);
+ runs(function () {
+ expect($contacts.is(':visible')).toBe(false);
+ expect($chatrooms.is(':visible')).toBe(true);
+ expect(cbview.switchTab).toHaveBeenCalled();
+ });
+ }, xmppchat));
+
+ it("contains a form through which a new chatroom can be created", $.proxy(function () {
+ var roomspanel = this.chatboxesview.views.controlbox.roomspanel;
+ var $input = roomspanel.$el.find('input.new-chatroom-name');
+ expect($input.length).toBe(1);
+ expect($('.chatroom').length).toBe(0); // There shouldn't be any chatrooms open currently
+ spyOn(roomspanel, 'createChatRoom').andCallThrough();
+ roomspanel.delegateEvents(); // We need to rebind all events otherwise our spy won't be called
+ runs(function () {
+ $input.val('Lounge');
+ });
+ waits('250');
+ runs(function () {
+ roomspanel.$el.find('form').submit();
+ expect(roomspanel.createChatRoom).toHaveBeenCalled();
+ });
+ waits('250');
+ runs($.proxy(function () {
+ expect($('.chatroom').length).toBe(1); // There should now be an open chatroom
+ }, xmppchat));
+ }, xmppchat));
+
+
+ }, xmppchat));
+ }, xmppchat));
+
+
}, xmppchat));
}));
From 76676dc31d4f3ccf542592a6138af8f606be97c2 Mon Sep 17 00:00:00 2001
From: JC Brand
Date: Fri, 19 Apr 2013 22:20:59 +0200
Subject: [PATCH 5/5] Flatten header. Update text on index.html
---
index.html | 5 ++---
stylesheets/stylesheet.css | 4 ----
2 files changed, 2 insertions(+), 7 deletions(-)
diff --git a/index.html b/index.html
index afb5e7b05..40e510bc5 100644
--- a/index.html
+++ b/index.html
@@ -111,15 +111,14 @@
Licence
Converse.js is released under both the MIT
- and GPL licenses.
+ and GPL licenses.
diff --git a/stylesheets/stylesheet.css b/stylesheets/stylesheet.css
index e07313966..b1be82a9b 100644
--- a/stylesheets/stylesheet.css
+++ b/stylesheets/stylesheet.css
@@ -304,10 +304,6 @@ Full-Width Styles
background: linear-gradient(top, #373737, #212121);
}
-#header_wrap .inner {
- padding: 50px 10px 30px 10px;
-}
-
#project_title {
margin: 0;
color: #fff;