conversejs · lyabs243 · Dec 20, 2018 · Dec 24, 2018 · Dec 24, 2018 · Dec 28, 2018
diff --git a/source/images/add-contact.png b/source/images/add-contact.png
diff --git a/source/images/add-group.png b/source/images/add-group.png
diff --git a/source/images/filter-contact-name.png b/source/images/filter-contact-name.png
diff --git a/source/images/filter-contact-status.png b/source/images/filter-contact-status.png
diff --git a/source/images/homepage.jpg b/source/images/homepage.jpg
diff --git a/source/images/homepage.png b/source/images/homepage.png
diff --git a/source/images/pending-contact.jpg b/source/images/pending-contact.jpg
diff --git a/source/images/pending-contact.png b/source/images/pending-contact.png
diff --git a/source/images/register-form.jpg b/source/images/register-form.jpg
diff --git a/source/images/register-form.png b/source/images/register-form.png
diff --git a/source/images/register-panel.jpg b/source/images/register-panel.jpg
diff --git a/source/images/register-panel.png b/source/images/register-panel.png
diff --git a/source/images/remove-contact.png b/source/images/remove-contact.png
diff --git a/source/images/remove_contact.png b/source/images/remove_contact.png
diff --git a/source/images/ungrouped-contact.png b/source/images/ungrouped-contact.png
diff --git a/source/index.rst b/source/index.rst
@@ -10,7 +10,7 @@ The Converse.js User Manual
 
    <br/>
 
-.. figure:: images/homepage.jpg
+.. figure:: images/homepage.png
    :align: right
    :alt: The converse.js website
 
@@ -34,7 +34,7 @@ converse.js chat client.
 Registering a new chat account
 ==============================
 
-.. figure:: images/register-panel.jpg
+.. figure:: images/register-panel.png
    :align: left
    :alt: The registration panel of the converse.js control box.
 
@@ -73,7 +73,7 @@ name and click the **Fetch registration form** button.
 
 |br|
 
-.. figure:: images/register-form.jpg
+.. figure:: images/register-form.png
    :align: left
    :alt: The registration form for an XMPP account at conversejs.org
 
@@ -143,7 +143,26 @@ Technically, when you add someone as a contact, you're doing two things. Firstly
 you are adding the contact to your *roster* (think of it as an address book) and secondly
 you are asking to be notified whenever that person comes online.
 
-.. figure:: images/pending-contact.jpg
+|br|
+
+.. figure:: images/add-group.png
+   :align: left
+   :alt: Add a groupchat in converse.js
+
+   The form for adding a new group
+
+
+Add a groupchat
+================
+
+To join a group, click the **Add a group** link in the **GroupChats** tab. This will
+slide open a new dialog in which you can type the GroupChat adress of the group you'd
+like to add.
+
+Once you've typed the GroupChat adress  and clicked **Join**, you will see
+the name of the GroupChat you added in your GroupChat list.
+
+.. figure:: images/pending-contact.png
    :align: left
    :alt: A pending contact
 
@@ -184,3 +203,35 @@ To remove a contact, hover your mouse over their name and then click on the
 trash icon. You will be prompted to confirm, and if you do, the contact will no
 longer be visible in your roster.
 
+.. figure:: images/filter-contact-name.png
+   :align: left
+   :alt: Filtering a contact by name
+
+Filtering a contact
+===================
+
+There are different ways to filter contacts :
+
+.. figure:: images/filter-contact-name.png
+   :align: left
+   :alt: Filtering a contact by name
+
+   Filtering a contact by name
+
+Filtering a contact by name
+===========================
+
+To filter contacts by name, simply click on the first icon in the contact group and enter
+the contact's name in the'filter' text box and the list of your contacts will be filtered
+according to the data you have entered.
+
+.. figure:: images/filter-contact-status.png
+   :align: left
+   :alt: Filtering a contact by status
+
+   Filtering a contact by status
+
+Filtering a contact by status
+===========================
+
+To filter contacts by status, simply click on the last icon in the contact group and select in the list the relevant status and the list of your contacts will be filtered according to the status you have chosen.