Add a nicer custom select box for choosing one's status

This commit is contained in:
JC Brand 2012-07-01 21:12:51 +02:00
parent 4b94968fd8
commit af5301d2e7
2 changed files with 45 additions and 3 deletions

View File

@ -203,13 +203,17 @@ var xmppchat = (function (jarnxmpp, $, console) {
});
};
ob.Presence.getOwnStatus = function () {
return xmppchat.Storage.get(xmppchat.username+'-xmpp-status');
};
ob.Presence.onlineCount = function () {
return xmppchat.ChatPartners.getTotal();
};
ob.Presence.sendPresence = function (type) {
if (type === undefined) {
type = xmppchat.Storage.get(xmppchat.username+'-xmpp-status') || 'online';
type = this.getOwnStatus() || 'online';
}
xmppchat.connection.send($pres({'type':type}));
};

View File

@ -530,11 +530,49 @@ $(document).ready(function () {
});
$('ul.tabs').tabs('div.panes > div');
$('select#select-xmpp-status').bind('change', function (ev) {
var select = $('select#select-xmpp-status'),
selected = select.find('option[selected]'),
chat_status = selected.val() || xmppchat.Presence.getOwnStatus() || 'online';
options = $('option', select);
// create <dl> and <dt> with selected value inside it
select.parent().append('<dl id="target" class="dropdown"></dl>');
$("#target").append('<dt id="fancy-xmpp-status-select"><a href="#" class="'+chat_status+'">I am '+chat_status +
'<span class="value">' + chat_status + '</span></a></dt>');
$("#target").append('<dd><ul></ul></dd>');
// iterate through all the <option> elements and create UL
options.each(function(){
$("#target dd ul").append('<li><a href="#" class="'+$(this).val()+'">' +
$(this).text() + '<span class="value">' +
$(this).val() + '</span></a></li>').hide();
});
select.remove();
$('#fancy-xmpp-status-select').click(function (ev) {
ev.preventDefault();
$(this).siblings('dd').find('ul').toggle('fast');
});
$(".dropdown dd ul li a").click(function() {
var jid = xmppchat.connection.jid,
value = ev.target.value;
value = $(this).find('span').text();
$(".dropdown dt a").html('I am ' + value);
$(".dropdown dt a").attr('class', value);
$(".dropdown dd ul").hide();
$("#source").val($(this).find("span.value").html());
xmppchat.Presence.sendPresence(value);
xmppchat.Storage.set(xmppchat.username+'-xmpp-status', value);
});
$('select#select-xmpp-status').bind('change', function (ev) {
var jid = xmppchat.connection.jid,
value = ev.target.value;
xmppchat.Presence.sendPresence(value);
xmppchat.Storage.set(xmppchat.username+'-xmpp-status', value);
});
});