|
|
@@ -114,89 +114,146 @@
|
|
|
</ul>
|
|
|
</dd>
|
|
|
</dl>
|
|
|
- <dl id="converse-roster" style="display: block;">
|
|
|
- <dt id="xmpp-contacts" style="display: block;">My contacts</dt>
|
|
|
- <dd class="online current-xmpp-contact">
|
|
|
- <a class="open-chat" title="Click to chat with this contact" href="#">
|
|
|
- <span class="icon-online" title="This contact is online"></span>
|
|
|
- John Smit</a>
|
|
|
- <a class="remove-xmpp-contact icon-remove" title="Click to remove this contact" href="#"></a>
|
|
|
- </dd>
|
|
|
- <dd class="away current-xmpp-contact">
|
|
|
- <a class="open-chat" title="Click to chat with this contact" href="#">
|
|
|
- <span class="icon-away" title="this contact is away"></span>
|
|
|
- Francois Pienaar</a>
|
|
|
- <a class="remove-xmpp-contact icon-remove" title="Click to remove this contact" href="#"></a>
|
|
|
- </dd>
|
|
|
- <dd class="dnd current-xmpp-contact">
|
|
|
- <a class="open-chat" title="Click to chat with this contact" href="#">
|
|
|
- <span class="icon-dnd" title="This contact is busy"></span>
|
|
|
- Gary Teichmann</a>
|
|
|
- <a class="remove-xmpp-contact icon-remove" title="Click to remove this contact" href="#"></a>
|
|
|
- </dd>
|
|
|
- <dd class="offline current-xmpp-contact">
|
|
|
- <a class="open-chat" title="Click to chat with this contact" href="#">
|
|
|
- <span class="icon-offline" title="This contact is offline"></span>
|
|
|
- Corné Krige</a>
|
|
|
- <a class="remove-xmpp-contact icon-remove" title="Click to remove this contact" href="#"></a>
|
|
|
- </dd>
|
|
|
+ <div id="converse-roster">
|
|
|
+ <input class="roster-filter" placeholder="Type to filter">
|
|
|
+ <select class="filter-type">
|
|
|
+ <option value="contacts">Contacts</option>
|
|
|
+ <option value="groups">Groups</option>
|
|
|
+ </select>
|
|
|
+ <dl class="roster-contacts" style="display: block;">
|
|
|
+ <dt class="roster-group" style="display: block;">
|
|
|
+ <a href="#" data-group="Colleagues" class="group-toggle icon-opened" title="Click to hide these contacts">Colleagues</a>
|
|
|
+ </dt>
|
|
|
+ <dd class="online current-xmpp-contact">
|
|
|
+ <a class="open-chat" title="Click to chat with this contact" href="#">
|
|
|
+ <span class="icon-online" title="This contact is online"></span>
|
|
|
+ Victor Matfield
|
|
|
+ </a>
|
|
|
+ <a class="remove-xmpp-contact icon-remove" title="Click to remove this contact" href="#"></a>
|
|
|
+ </dd>
|
|
|
+ <dd class="away current-xmpp-contact">
|
|
|
+ <a class="open-chat" title="Click to chat with this contact" href="#">
|
|
|
+ <span class="icon-away" title="this contact is away"></span>
|
|
|
+ William Winterbottom
|
|
|
+ </a>
|
|
|
+ <a class="remove-xmpp-contact icon-remove" title="Click to remove this contact" href="#"></a>
|
|
|
+ </dd>
|
|
|
+ <dd class="dnd current-xmpp-contact">
|
|
|
+ <a class="open-chat" title="Click to chat with this contact" href="#">
|
|
|
+ <span class="icon-dnd" title="This contact is busy"></span>
|
|
|
+ Gary Teichmann
|
|
|
+ </a>
|
|
|
+ <a class="remove-xmpp-contact icon-remove" title="Click to remove this contact" href="#"></a>
|
|
|
+ </dd>
|
|
|
|
|
|
- <dt id="xmpp-contact-requests" style="display: block;">Contact requests</dt>
|
|
|
- <dd class="offline requesting-xmpp-contact">
|
|
|
- <span>Bob Skinstad</span>
|
|
|
- <span class="request-actions">
|
|
|
- <a class="accept-xmpp-request icon-checkmark" title="Click here to accept this contact's request" href="#"></a>
|
|
|
- <a class="decline-xmpp-request icon-close" title="Click here to decline this contact's request" href="#"></a>
|
|
|
- </span>
|
|
|
- </dd>
|
|
|
- <dd class="offline requesting-xmpp-contact">
|
|
|
- <span>André Vos</span>
|
|
|
- <span class="request-actions">
|
|
|
- <a class="accept-xmpp-request icon-checkmark" title="Click here to accept this contact's request" href="#"></a>
|
|
|
- <a class="decline-xmpp-request icon-close" title="Click here to decline this contact's request" href="#"></a>
|
|
|
- </span>
|
|
|
- </dd>
|
|
|
+ <dt class="roster-group" style="display: block;">
|
|
|
+ <a href="#" data-group="Family" class="group-toggle icon-opened" title="Click to hide these contacts">Family</a>
|
|
|
+ </dt>
|
|
|
+ <dd class="away current-xmpp-contact">
|
|
|
+ <a class="open-chat" title="Click to chat with this contact" href="#">
|
|
|
+ <span class="icon-away" title="this contact is away"></span>
|
|
|
+ Allan Donald
|
|
|
+ </a>
|
|
|
+ <a class="remove-xmpp-contact icon-remove" title="Click to remove this contact" href="#"></a>
|
|
|
+ </dd>
|
|
|
+ <dd class="offline current-xmpp-contact">
|
|
|
+ <a class="open-chat" title="Click to chat with this contact" href="#">
|
|
|
+ <span class="icon-offline" title="This contact is offline"></span>
|
|
|
+ Corné Krige
|
|
|
+ </a>
|
|
|
+ <a class="remove-xmpp-contact icon-remove" title="Click to remove this contact" href="#"></a>
|
|
|
+ </dd>
|
|
|
|
|
|
- <dt id="pending-xmpp-contacts" style="display: block;">Pending contacts</dt>
|
|
|
- <dd class="offline pending-xmpp-contact"><span>Rassie Erasmus</span>
|
|
|
- <a class="remove-xmpp-contact icon-remove" title="Click to remove this contact" href="#"></a>
|
|
|
- </dd>
|
|
|
- <dd class="offline pending-xmpp-contact"><span>Victor Matfield</span>
|
|
|
- <a class="remove-xmpp-contact icon-remove" title="Click to remove this contact" href="#"></a>
|
|
|
- </dd>
|
|
|
- </dl>
|
|
|
- </div>
|
|
|
- <div id="chatrooms" style="display: none;">
|
|
|
- <form class="add-chatroom" action="" method="post">
|
|
|
- <input type="text" name="chatroom" class="new-chatroom-name" placeholder="Room name">
|
|
|
- <input type="text" name="nick" class="new-chatroom-nick" placeholder="Nickname">
|
|
|
- <input type="text" name="server" class="new-chatroom-server" placeholder="Server">
|
|
|
- <input type="submit" name="join" value="Join">
|
|
|
- <input type="button" name="show" id="show-rooms" value="Show rooms" style="display: inline-block;">
|
|
|
- </form>
|
|
|
- <dl id="available-chatrooms">
|
|
|
- <dt>Rooms on conference.opkode.im</dt>
|
|
|
- <dd class="available-chatroom">
|
|
|
- <a class="open-room"
|
|
|
- data-room-jid="converse.js@conference.opkode.im"
|
|
|
- title="Click to open this room" href="#">Special chatroom with a long name (2)</a>
|
|
|
- <a class="room-info icon-room-info"
|
|
|
- data-room-jid="converse.js@conference.opkode.im"
|
|
|
- title="Show more information on this room" href="#"> </a>
|
|
|
- <div class="room-info">
|
|
|
- <p class="room-info"><strong>Description:</strong></p>
|
|
|
- <p class="room-info"><strong>Occupants:</strong> 2</p>
|
|
|
- <p class="room-info"><strong>Features:</strong> </p>
|
|
|
- <ul>
|
|
|
- <li class="room-info">Moderated</li><li class="room-info">Open room</li>
|
|
|
- <li class="room-info">Permanent room</li><li class="room-info">Public</li>
|
|
|
- <li class="room-info">Semi-anonymous</li>
|
|
|
- <li class="room-info">Requires authentication <span class="icon-lock"></span></li>
|
|
|
- <p></p>
|
|
|
- </ul>
|
|
|
- </div>
|
|
|
- </dd>
|
|
|
- </dl>
|
|
|
+ <dt class="roster-group" style="display: block;">
|
|
|
+ <a href="#" data-group="Friends" class="group-toggle icon-opened" title="Click to hide these contacts">Friends</a>
|
|
|
+ </dt>
|
|
|
+ <dd class="online current-xmpp-contact">
|
|
|
+ <a class="open-chat" title="Click to chat with this contact" href="#">
|
|
|
+ <span class="icon-online" title="This contact is online"></span>
|
|
|
+ John Smit
|
|
|
+ </a>
|
|
|
+ <a class="remove-xmpp-contact icon-remove" title="Click to remove this contact" href="#"></a>
|
|
|
+ </dd>
|
|
|
+ <dd class="online current-xmpp-contact">
|
|
|
+ <a class="open-chat" title="Click to chat with this contact" href="#">
|
|
|
+ <span class="icon-online" title="This contact is online"></span>
|
|
|
+ Bakkies Botha
|
|
|
+ </a>
|
|
|
+ <a class="remove-xmpp-contact icon-remove" title="Click to remove this contact" href="#"></a>
|
|
|
+ </dd>
|
|
|
+
|
|
|
+ <dt class="roster-group" style="display: block;">
|
|
|
+ <a href="#" class="group-toggle icon-opened" title="Click to hide these contacts">Ungrouped</a>
|
|
|
+ </dt>
|
|
|
+ <dd class="online current-xmpp-contact">
|
|
|
+ <a class="open-chat" title="Click to chat with this contact" href="#">
|
|
|
+ <span class="icon-online" title="This contact is online"></span>
|
|
|
+ James Small
|
|
|
+ </a>
|
|
|
+ <a class="remove-xmpp-contact icon-remove" title="Click to remove this contact" href="#"></a>
|
|
|
+ </dd>
|
|
|
+
|
|
|
+ <dt id="xmpp-contact-requests" style="display: block;">
|
|
|
+ <a href="#" class="group-toggle icon-opened" title="Click to hide these contacts">Contact Requests</a>
|
|
|
+ </dt>
|
|
|
+ <dd class="offline requesting-xmpp-contact">
|
|
|
+ <span class="req-contact-name">Bob Skinstad</span>
|
|
|
+ <span class="request-actions">
|
|
|
+ <a class="accept-xmpp-request icon-checkmark" title="Click here to accept this contact's request" href="#"></a>
|
|
|
+ <a class="decline-xmpp-request icon-close" title="Click here to decline this contact's request" href="#"></a>
|
|
|
+ </span>
|
|
|
+ </dd>
|
|
|
+ <dd class="offline requesting-xmpp-contact">
|
|
|
+ <span class="req-contact-name">André Vos</span>
|
|
|
+ <span class="request-actions">
|
|
|
+ <a class="accept-xmpp-request icon-checkmark" title="Click here to accept this contact's request" href="#"></a>
|
|
|
+ <a class="decline-xmpp-request icon-close" title="Click here to decline this contact's request" href="#"></a>
|
|
|
+ </span>
|
|
|
+ </dd>
|
|
|
+
|
|
|
+ <dt id="pending-xmpp-contacts" style="display: block;">
|
|
|
+ <a href="#" class="group-toggle icon-opened" title="Click to hide these contacts">Pending Contacts</a>
|
|
|
+ </dt>
|
|
|
+ <dd class="offline pending-xmpp-contact"><span class="pending-contact-name">Rassie Erasmus</span>
|
|
|
+ <a class="remove-xmpp-contact icon-remove" title="Click to remove this contact" href="#"></a>
|
|
|
+ </dd>
|
|
|
+ <dd class="offline pending-xmpp-contact"><span class="pending-contact-name">Victor Matfield</span>
|
|
|
+ <a class="remove-xmpp-contact icon-remove" title="Click to remove this contact" href="#"></a>
|
|
|
+ </dd>
|
|
|
+ </dl>
|
|
|
+ </div>
|
|
|
+ <div id="chatrooms" style="display: none;">
|
|
|
+ <form class="add-chatroom" action="" method="post">
|
|
|
+ <input type="text" name="chatroom" class="new-chatroom-name" placeholder="Room name">
|
|
|
+ <input type="text" name="nick" class="new-chatroom-nick" placeholder="Nickname">
|
|
|
+ <input type="text" name="server" class="new-chatroom-server" placeholder="Server">
|
|
|
+ <input type="submit" name="join" value="Join">
|
|
|
+ <input type="button" name="show" id="show-rooms" value="Show rooms" style="display: inline-block;">
|
|
|
+ </form>
|
|
|
+ <dl id="available-chatrooms">
|
|
|
+ <dt>Rooms on conference.opkode.im</dt>
|
|
|
+ <dd class="available-chatroom">
|
|
|
+ <a class="open-room"
|
|
|
+ data-room-jid="converse.js@conference.opkode.im"
|
|
|
+ title="Click to open this room" href="#">Special chatroom with a long name (2)</a>
|
|
|
+ <a class="room-info icon-room-info"
|
|
|
+ data-room-jid="converse.js@conference.opkode.im"
|
|
|
+ title="Show more information on this room" href="#"> </a>
|
|
|
+ <div class="room-info">
|
|
|
+ <p class="room-info"><strong>Description:</strong></p>
|
|
|
+ <p class="room-info"><strong>Occupants:</strong> 2</p>
|
|
|
+ <p class="room-info"><strong>Features:</strong> </p>
|
|
|
+ <ul>
|
|
|
+ <li class="room-info">Moderated</li><li class="room-info">Open room</li>
|
|
|
+ <li class="room-info">Permanent room</li><li class="room-info">Public</li>
|
|
|
+ <li class="room-info">Semi-anonymous</li>
|
|
|
+ <li class="room-info">Requires authentication <span class="icon-lock"></span></li>
|
|
|
+ <p></p>
|
|
|
+ </ul>
|
|
|
+ </div>
|
|
|
+ </dd>
|
|
|
+ </dl>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
</div>
|
JC Brand