Wrox Programmer Forums
|
BOOK: Professional XMPP Programming with JavaScript and jQuery
This is the forum to discuss the Wrox book Professional XMPP Programming with JavaScript and jQuery by Jack Moffitt; ISBN: 978-0-470-54071-8
Welcome to the p2p.wrox.com Forums.

You are currently viewing the BOOK: Professional XMPP Programming with JavaScript and jQuery section of the Wrox Programmer to Programmer discussions. This is a community of software programmers and website developers including Wrox book authors and readers. New member registration was closed in 2019. New posts were shut off and the site was archived into this static format as of October 1, 2020. If you require technical support for a Wrox book please contact http://hub.wiley.com
 
Old September 16th, 2010, 11:50 AM
Registered User
 
Join Date: Sep 2010
Posts: 6
Thanks: 0
Thanked 0 Times in 0 Posts
Default Ch 6: Contacts always showing as offline

So far I'm to the point where Gab is supposed to display and update your contacts list and let you add new contacts. However, all contacts always show as offline.

It looks to me as though the contact is orginally created with the 'offline' class in the following code:
Code:
var contact = $("<li id='" + jid_id + "'>" +
                        "<div class='roster-contact offline'>" +
                        "<div class='roster-name'>" +
                        name +
                        "</div><div class='roster-jid'>" +
                        jid +
                        "</div></div></li>");
Then that class is never getting removed or changed, even though it should be.

Full gab.js:

Code:
var Gab = {
    connection: null,
    
    pending_subscriber: null,
    
    on_roster: function (iq) {
        $(iq).find('item').each(function () {
            var jid = $(this).attr('jid');
            var name = $(this).attr('name') || jid;

            // transform jid into an id
            var jid_id = Gab.jid_to_id(jid);

            var contact = $("<li id='" + jid_id + "'>" +
                        "<div class='roster-contact offline'>" +
                        "<div class='roster-name'>" +
                        name +
                        "</div><div class='roster-jid'>" +
                        jid +
                        "</div></div></li>");
            
            Gab.insert_contact(contact);
        });
        
        // set up presence handler and send initial presence
        Gab.connection.addHandler(Gab.on_presence, null, "presence");
        Gab.connection.send($pres());
    },
    
    on_presence: function (presence) {
        var ptype = $(presence).attr('type');
        var from = $(presence).attr('from');
        
        if (ptype === 'subscribe') {
            // populate pending_subscriber, the approve-jid span, and
            // open the dialog
            Gab.pending_subscriber = from;
            
            $('#approve-jid').text(Strophe.getBareJidFromJid(from));
            $('#approve_dialog').dialog('open');
        } else if (ptype !== 'error') {
            var contact = $('#roster-area li#' + Gab.jid_to_id(from) + '.roster-contact')
                            .removeClass("online")
                            .removeClass("away")
                            .removeClass("offline");
            if (ptype === 'unavailable') {
                contact.addClass("offline");
            } else {
                var show = $(presence).find("show").text();
                if (show === "" || show === "chat") {
                    contact.addClass("online");
                } else {
                    contact.addClass("away");
                }
            }
            var li = contact.parent();
            li.remove();
            Gab.insert_contact(li);
        }
        return true;
    },
    
    jid_to_id: function (jid) {
        return Strophe.getBareJidFromJid(jid)
        .replace("@", "-")
        .replace(".", "-");
    },
    
    presence_value: function (elem) {
        if (elem.hasClass('online')) {
            return 2;
        } else if (elem.hasClass('away')) {
            return 1;
        }
        return 0;
    },

    on_roster_changed: function (iq) {
        $(iq).find('item').each(function () {
            var sub = $(this).attr('subscription');
            var jid = $(this).attr('jid');
            var name = $(this).attr('name') || jid;
            var jid_id = Gab.jid_to_id(jid);
            if (sub === 'remove') {
                // contact is being removed
                $('#' + jid_id).remove();
            } else {
                // contact is being added or modified
                var contact_html = "<li id='" + jid_id + "'>" +
                "<div class='" +
                ($('#' + jid_id).attr('class') || "roster-contact offline") +
                "'>" +
                "<div class=’roster-name’>" +
                name +
                "</div><div class=’roster-jid’>" +
                jid +
                "</div></div></li>";
                if ($('#' + jid_id).length > 0) {
                    $('#' + jid_id).replaceWith(contact_html);
                } else {
                    Gab.insert_contact(contact_html);
                }
            }
        });
        return true;
    },

    insert_contact: function (elem) {
        var jid = elem.find('.roster-jid').text();
        var pres = Gab.presence_value(elem.find('.roster-contact'));
        var contacts = $('#roster-area li');
        if (contacts.length > 0) {
            var inserted = false;
            contacts.each(function () {
                var cmp_pres = Gab.presence_value($(this).find('.roster-contact'));
                var cmp_jid = $(this).find('.roster-jid').text();
                if (pres > cmp_pres) {
                    $(this).before(elem);
                    inserted = true;
                    return false;
                } else {
                    if (jid < cmp_jid) {
                        $(this).before(elem);
                        inserted = true;
                        return false;
                    }
                }
            });
            if (!inserted) {
                $('#roster-area ul').append(elem);
            }
        } else {
            $('#roster-area ul').append(elem);
        }
    }
};

$(document).ready(function () {
    $('#login_dialog').dialog({
        autoOpen: true,
        draggable: false,
        modal: true,
        title: 'Connect to XMPP',
        buttons: {
            "Connect": function () {
                $(document).trigger('connect', {
                    jid: $('#jid').val(),
                    password: $('#password').val()
                });
                $('#password').val('');
                $(this).dialog('close');
            }
        }
    });
    
    $('#contact_dialog').dialog({
        autoOpen: false,
        draggable: false,
        modal: true,
        title: 'Add a Contact',
        buttons: {
            "Add": function () {
                $(document).trigger('contact_added', {
                    jid: $('#contact-jid').val(),
                    name: $('#contact-name').val()
                });
            $('#contact-jid').val('');
            $('#contact-name').val('');
            $(this).dialog('close');
            }
        }
    });
    
    $('#new-contact').click(function (ev) {
        $('#contact_dialog').dialog('open');
    });
    
    $('#approve_dialog').dialog({
        autoOpen: false,
        draggable: false,
        modal: true,
        title: 'Subscription Request',
        buttons: {
            "Deny": function () {
                Gab.connection.send($pres({
                    to: Gab.pending_subscriber,
                    "type": "unsubscribed"}));
                Gab.pending_subscriber = null;
                $(this).dialog('close');
                },
            "Approve": function () {
                Gab.connection.send($pres({
                    to: Gab.pending_subscriber,
                    "type": "subscribed"}));
                
                Gab.connection.send($pres({
                    to: Gab.pending_subscriber,
                    "type": "subscribe"}));
                
                Gab.pending_subscriber = null;
                $(this).dialog('close');
            }
        }
    });

});

$(document).bind('connect', function (ev, data) {
    var conn = new Strophe.Connection('http://bosh.metajack.im:5280/xmpp-httpbind');
    conn.connect(data.jid, data.password, function (status) {
        if (status === Strophe.Status.CONNECTED) {
            $(document).trigger('connected');
        } else if (status === Strophe.Status.DISCONNECTED) {
            $(document).trigger('disconnected');
        }
    });
    Gab.connection = conn;
});

$(document).bind('connected', function () {
    var iq = $iq({type: 'get'}).c('query', {xmlns: 'jabber:iq:roster'});
    Gab.connection.sendIQ(iq, Gab.on_roster);
    
    Gab.connection.addHandler(Gab.on_roster_changed, "jabber:iq:roster", "iq", "set");
});

$(document).bind('disconnected', function () {
    // nothing here yet
});

$(document).bind('contact_added', function (ev, data) {
    var iq = $iq({type: "set"}).c("query", {xmlns: "jabber:iq:roster"}).c("item", data);
    Gab.connection.sendIQ(iq);
    var subscribe = $pres({to: data.jid, "type": "subscribe"});
    Gab.connection.send(subscribe);
});
 
Old September 16th, 2010, 12:07 PM
Wrox Author
 
Join Date: Jan 2010
Posts: 178
Thanks: 0
Thanked 16 Times in 15 Posts
Default

The original contact list is created with all contacts having the CSS class of "offline". However, if you look in the on_presence() handler, you'll notice that it removes this class and adds "online" or "away" or "offline" depending on the incoming presence status.

If you send me a debug log (take care to remove authorization section so as not to leak your password), I can see what is happening and why that code is not triggering properly.

Also, please try the latest version of the code, which can always be found at Github: http://github.com/metajack/profxmpp

Let me know if this helps or not.
 
Old September 16th, 2010, 12:25 PM
Registered User
 
Join Date: Sep 2010
Posts: 6
Thanks: 0
Thanked 0 Times in 0 Posts
Default

Just figured out what was wrong. I was missing the space in ' .roster-contact', and didn't notice it until I used a comparison tool rather than just looking at the two files.





Similar Threads
Thread Thread Starter Forum Replies Last Post
CH. 17 - VSTO Add-in template not showing up in VS rruffino BOOK: Professional Microsoft Office SharePoint Designer 2007 ISBN: 978-0-470-28761-3 0 July 7th, 2010 03:19 PM
Outlook contacts to Access lryckman Access 1 January 22nd, 2008 08:11 AM
Update Outlook contacts from Access nosegewa Access 0 August 20th, 2006 04:15 PM
outlook contacts page davesav VB How-To 1 February 18th, 2006 07:57 PM
Outlook 2000 Contacts into Access MWiseman Access VBA 5 January 27th, 2005 02:32 PM





Powered by vBulletin®
Copyright ©2000 - 2020, Jelsoft Enterprises Ltd.
Copyright (c) 2020 John Wiley & Sons, Inc.