Fix spinner so that it also renders properly in Plone

This commit is contained in:
JC Brand 2013-05-21 13:37:47 +02:00
parent f763757879
commit 5cb2a473f3
2 changed files with 28 additions and 7 deletions

View File

@ -7,6 +7,20 @@
padding-right: 22px; padding-right: 22px;
} }
span.spinner {
background: url(images/spinner.gif) no-repeat center;
width: 22px;
height: 22px;
padding: 0 2px 0 2px;
display: block;
}
span.spinner.hor_centered {
left: 40%;
position: absolute;
}
img.spinner { img.spinner {
width: auto; width: auto;
border: none; border: none;
@ -16,6 +30,7 @@ img.spinner {
margin: 0; margin: 0;
padding: 0 5px 0 5px; padding: 0 5px 0 5px;
} }
img.centered { img.centered {
position: absolute; position: absolute;
top: 30%; top: 30%;
@ -526,6 +541,11 @@ dd.available-chatroom,
font-weight: normal; font-weight: normal;
} }
li.room-info {
display: block;
margin-left: 5px;
}
p.room-info { p.room-info {
margin: 0; margin: 0;
padding: 0; padding: 0;

View File

@ -792,17 +792,17 @@
}))[0]); }))[0]);
} }
$available_chatrooms.append(fragment); $available_chatrooms.append(fragment);
$('input#show-rooms').show().siblings('img.spinner').remove(); $('input#show-rooms').show().siblings('span.spinner').remove();
} else { } else {
$available_chatrooms.html('<dt>No rooms on '+this.muc_domain+'</dt>'); $available_chatrooms.html('<dt>No rooms on '+this.muc_domain+'</dt>');
$('input#show-rooms').show().siblings('img.spinner').remove(); $('input#show-rooms').show().siblings('span.spinner').remove();
} }
return true; return true;
}, this), }, this),
$.proxy(function (iq) { // Failure $.proxy(function (iq) { // Failure
var $available_chatrooms = this.$el.find('#available-chatrooms'); var $available_chatrooms = this.$el.find('#available-chatrooms');
$available_chatrooms.html('<dt>No rooms on '+this.muc_domain+'</dt>'); $available_chatrooms.html('<dt>No rooms on '+this.muc_domain+'</dt>');
$('input#show-rooms').show().siblings('img.spinner').remove(); $('input#show-rooms').show().siblings('span.spinner').remove();
}, this)); }, this));
}, },
@ -817,7 +817,7 @@
this.$el.find('input.new-chatroom-name').removeClass('error'); this.$el.find('input.new-chatroom-name').removeClass('error');
$server.removeClass('error'); $server.removeClass('error');
$available_chatrooms.empty(); $available_chatrooms.empty();
$('input#show-rooms').hide().after('<img class="spinner" style="width: auto" src="images/spinner.gif"/>'); $('input#show-rooms').hide().after('<span class="spinner"/>');
this.muc_domain = server; this.muc_domain = server;
this.updateRoomsList(); this.updateRoomsList();
}, },
@ -829,14 +829,15 @@
if ($div.length) { if ($div.length) {
$div.remove(); $div.remove();
} else { } else {
$dd.append('<img class="spinner" src="images/spinner.gif"/>'); $dd.find('span.spinner').remove();
$dd.append('<span class="spinner hor_centered"/>');
converse.connection.disco.info( converse.connection.disco.info(
$(target).attr('data-room-jid'), $(target).attr('data-room-jid'),
null, null,
$.proxy(function (stanza) { $.proxy(function (stanza) {
var $stanza = $(stanza); var $stanza = $(stanza);
// All MUC features found here: http://xmpp.org/registrar/disco-features.html // All MUC features found here: http://xmpp.org/registrar/disco-features.html
$dd.find('img.spinner').replaceWith( $dd.find('span.spinner').replaceWith(
this.room_description_template({ this.room_description_template({
'desc': $stanza.find('field[var="muc#roominfo_description"] value').text(), 'desc': $stanza.find('field[var="muc#roominfo_description"] value').text(),
'occ': $stanza.find('field[var="muc#roominfo_occupants"] value').text(), 'occ': $stanza.find('field[var="muc#roominfo_occupants"] value').text(),
@ -846,7 +847,7 @@
'nonanonymous': $stanza.find('feature[var="muc_nonanonymous"]').length, 'nonanonymous': $stanza.find('feature[var="muc_nonanonymous"]').length,
'open': $stanza.find('feature[var="muc_open"]').length, 'open': $stanza.find('feature[var="muc_open"]').length,
'passwordprotected': $stanza.find('feature[var="muc_passwordprotected"]').length, 'passwordprotected': $stanza.find('feature[var="muc_passwordprotected"]').length,
'persistent': stanza.find('feature[var="muc_persistent"]').length, 'persistent': $stanza.find('feature[var="muc_persistent"]').length,
'publicroom': $stanza.find('feature[var="muc_public"]').length, 'publicroom': $stanza.find('feature[var="muc_public"]').length,
'semianonymous': $stanza.find('feature[var="muc_semianonymous"]').length, 'semianonymous': $stanza.find('feature[var="muc_semianonymous"]').length,
'temporary': $stanza.find('feature[var="muc_temporary"]').length, 'temporary': $stanza.find('feature[var="muc_temporary"]').length,