# HG changeset patch # User Emmanuel Gil Peyrot # Date 1545491948 -3600 # Node ID aedf80eefc1991a439315ce2e72298c48319c7f9 # Parent e47b9bd55192ea9fc7bebf5ae781cf4d9f6863bc Also use a spinner on avatar get/set. diff --git a/avatar.js b/avatar.js --- a/avatar.js +++ b/avatar.js @@ -10,12 +10,15 @@ function initAvatar(connection) { const avatar_upload = document.getElementById('avatar-upload'); const avatar_change = document.getElementById('avatar-change'); const avatar_access = document.getElementById('avatar-access'); + const spinner_img = document.getElementById('avatar-spinner'); + const access_model_spinner_img = document.getElementById('access-model-avatar-spinner'); avatar_img.src = DEFAULT_AVATAR; const iq = $iq({type: 'get'}) .c('pubsub', {xmlns: 'http://jabber.org/protocol/pubsub'}) .c('items', {node: 'urn:xmpp:avatar:metadata'}); connection.sendIQ(iq, onAvatarMetadata, onAvatarRetrievalError.bind(null, 'PubSub metadata query failed.')); + spinner_img.hidden = false; function onAvatarMetadata(result_iq) { @@ -64,12 +67,14 @@ function initAvatar(connection) { }; */ avatar_img.src = url; + spinner_img.hidden = true; } function onAvatarRetrievalError(string) { console.log('Failed to retrieve avatar, an empty one is displayed instead: ' + string); avatar_img.src = DEFAULT_AVATAR; + spinner_img.hidden = true; } avatar_upload.addEventListener('click', function (evt) { @@ -90,6 +95,11 @@ function initAvatar(connection) { height: avatar_img.naturalHeight, }); connection.sendIQ(metadata_iq, onAvatarMetadataUpload, onAvatarUploadError); + spinner_img.hidden = false; + }); + + function onAvatarMetadataUpload(iq) + { const data_iq = $iq({type: 'set'}) .c('pubsub', {xmlns: 'http://jabber.org/protocol/pubsub'}) .c('publish', {node: 'urn:xmpp:avatar:data'}) @@ -97,11 +107,6 @@ function initAvatar(connection) { .c('data', {xmlns: 'urn:xmpp:avatar:data'}) .t(avatar_data.data); connection.sendIQ(data_iq, onAvatarDataUpload, onAvatarUploadError); - }); - - function onAvatarMetadataUpload(iq) - { - console.log("onAvatarMetadataUpload", iq); } function onAvatarDataUpload(iq) @@ -109,11 +114,13 @@ function initAvatar(connection) { console.log('Avatar successfully uploaded!', iq); avatar_change.disabled = true; avatar_size.innerHTML = ''; + spinner_img.hidden = true; } function onAvatarUploadError(iq) { console.log("onAvatarUploadError", iq); + spinner_img.hidden = true; } avatar_file.addEventListener('change', function (evt) { @@ -173,15 +180,18 @@ function initAvatar(connection) { avatar_access.addEventListener('change', function (evt) { const iq = configurePEPField('urn:xmpp:avatar:metadata', 'pubsub#access_model', evt.target.value); connection.sendIQ(iq, onAvatarConfigured, onAvatarConfigureError.bind(null, 'PubSub configuration failed.')); + access_model_spinner_img.hidden = false; }); function onAvatarConfigured(result_iq) { console.log('Successfully set avatar access model.') + access_model_spinner_img.hidden = true; } function onAvatarConfigureError(string) { console.log('Failed to configure avatar node: ' + string); + access_model_spinner_img.hidden = true; } } diff --git a/index.xhtml b/index.xhtml --- a/index.xhtml +++ b/index.xhtml @@ -58,14 +58,14 @@

Avatar

-
+


+

Contact list

diff --git a/nickname.js b/nickname.js --- a/nickname.js +++ b/nickname.js @@ -8,6 +8,7 @@ function initNickname(connection) { .c('pubsub', {xmlns: 'http://jabber.org/protocol/pubsub'}) .c('items', {node: 'http://jabber.org/protocol/nick'}); connection.sendIQ(iq, onNickname, onNicknameRetrievalError.bind(null, 'PubSub query failed.')); + spinner_img.hidden = false; function onNickname(result_iq) {