Mercurial > xmpp-account-manager
comparison avatar.js @ 15:3eed9fe0bd7c
End spinners with either a green ✔ or a red ✘.
author | Emmanuel Gil Peyrot <linkmauve@linkmauve.fr> |
---|---|
date | Sat, 22 Dec 2018 18:38:27 +0100 |
parents | 8724e28ccbd7 |
children | cd35420457ac |
comparison
equal
deleted
inserted
replaced
14:962f64b156dd | 15:3eed9fe0bd7c |
---|---|
16 avatar_img.src = DEFAULT_AVATAR; | 16 avatar_img.src = DEFAULT_AVATAR; |
17 const iq = $iq({type: 'get'}) | 17 const iq = $iq({type: 'get'}) |
18 .c('pubsub', {xmlns: 'http://jabber.org/protocol/pubsub'}) | 18 .c('pubsub', {xmlns: 'http://jabber.org/protocol/pubsub'}) |
19 .c('items', {node: 'urn:xmpp:avatar:metadata'}); | 19 .c('items', {node: 'urn:xmpp:avatar:metadata'}); |
20 connection.sendIQ(iq, onAvatarMetadata, onAvatarRetrievalError.bind(null, 'PubSub metadata query failed.')); | 20 connection.sendIQ(iq, onAvatarMetadata, onAvatarRetrievalError.bind(null, 'PubSub metadata query failed.')); |
21 spinner_img.hidden = false; | 21 displaySpinner(spinner_img); |
22 | 22 |
23 function onAvatarMetadata(result_iq) | 23 function onAvatarMetadata(result_iq) |
24 { | 24 { |
25 const item = parseXPath(result_iq, './pubsub:pubsub/pubsub:items/pubsub:item'); | 25 const item = parseXPath(result_iq, './pubsub:pubsub/pubsub:items/pubsub:item'); |
26 if (item == null) | 26 if (item == null) |
65 return onAvatarRetrievalError('invalid width or height in image data.'); | 65 return onAvatarRetrievalError('invalid width or height in image data.'); |
66 avatar_img.onload = null; | 66 avatar_img.onload = null; |
67 }; | 67 }; |
68 */ | 68 */ |
69 avatar_img.src = url; | 69 avatar_img.src = url; |
70 spinner_img.hidden = true; | 70 hideSpinner(spinner_img); |
71 } | 71 } |
72 | 72 |
73 function onAvatarRetrievalError(string) | 73 function onAvatarRetrievalError(string) |
74 { | 74 { |
75 console.log('Failed to retrieve avatar, an empty one is displayed instead: ' + string); | 75 console.log('Failed to retrieve avatar, an empty one is displayed instead: ' + string); |
76 avatar_img.src = DEFAULT_AVATAR; | 76 avatar_img.src = DEFAULT_AVATAR; |
77 spinner_img.hidden = true; | 77 hideSpinner(spinner_img); |
78 } | 78 } |
79 | 79 |
80 avatar_upload.addEventListener('click', function (evt) { | 80 avatar_upload.addEventListener('click', function (evt) { |
81 avatar_file.click(); | 81 avatar_file.click(); |
82 }); | 82 }); |
93 bytes: avatar_data.bytes, | 93 bytes: avatar_data.bytes, |
94 width: avatar_img.naturalWidth, | 94 width: avatar_img.naturalWidth, |
95 height: avatar_img.naturalHeight, | 95 height: avatar_img.naturalHeight, |
96 }); | 96 }); |
97 connection.sendIQ(metadata_iq, onAvatarMetadataUpload, onAvatarUploadError); | 97 connection.sendIQ(metadata_iq, onAvatarMetadataUpload, onAvatarUploadError); |
98 spinner_img.hidden = false; | 98 displaySpinner(spinner_img); |
99 }); | 99 }); |
100 | 100 |
101 function onAvatarMetadataUpload(iq) | 101 function onAvatarMetadataUpload(iq) |
102 { | 102 { |
103 const data_iq = $iq({type: 'set'}) | 103 const data_iq = $iq({type: 'set'}) |
112 function onAvatarDataUpload(iq) | 112 function onAvatarDataUpload(iq) |
113 { | 113 { |
114 console.log('Avatar successfully uploaded!', iq); | 114 console.log('Avatar successfully uploaded!', iq); |
115 avatar_change.hidden = true; | 115 avatar_change.hidden = true; |
116 avatar_size.innerHTML = ''; | 116 avatar_size.innerHTML = ''; |
117 spinner_img.hidden = true; | 117 spinnerOk(spinner_img); |
118 } | 118 } |
119 | 119 |
120 function onAvatarUploadError(iq) | 120 function onAvatarUploadError(iq) |
121 { | 121 { |
122 console.log("onAvatarUploadError", iq); | 122 console.log("onAvatarUploadError", iq); |
123 spinner_img.hidden = true; | 123 spinnerError(spinner_img); |
124 } | 124 } |
125 | 125 |
126 avatar_file.addEventListener('change', function (evt) { | 126 avatar_file.addEventListener('change', function (evt) { |
127 const file = evt.target.files[0]; | 127 const file = evt.target.files[0]; |
128 avatar_data.type = file.type; | 128 avatar_data.type = file.type; |
178 } | 178 } |
179 | 179 |
180 avatar_access.addEventListener('change', function (evt) { | 180 avatar_access.addEventListener('change', function (evt) { |
181 const iq = configurePEPField('urn:xmpp:avatar:metadata', 'pubsub#access_model', evt.target.value); | 181 const iq = configurePEPField('urn:xmpp:avatar:metadata', 'pubsub#access_model', evt.target.value); |
182 connection.sendIQ(iq, onAvatarConfigured, onAvatarConfigureError.bind(null, 'PubSub configuration failed.')); | 182 connection.sendIQ(iq, onAvatarConfigured, onAvatarConfigureError.bind(null, 'PubSub configuration failed.')); |
183 access_model_spinner_img.hidden = false; | 183 displaySpinner(access_model_spinner_img); |
184 }); | 184 }); |
185 | 185 |
186 function onAvatarConfigured(result_iq) | 186 function onAvatarConfigured(result_iq) |
187 { | 187 { |
188 console.log('Successfully set avatar access model.') | 188 console.log('Successfully set avatar access model.') |
189 access_model_spinner_img.hidden = true; | 189 spinnerOk(access_model_spinner_img); |
190 } | 190 } |
191 | 191 |
192 function onAvatarConfigureError(string) | 192 function onAvatarConfigureError(string) |
193 { | 193 { |
194 console.log('Failed to configure avatar node: ' + string); | 194 console.log('Failed to configure avatar node: ' + string); |
195 access_model_spinner_img.hidden = true; | 195 spinnerError(access_model_spinner_img); |
196 } | 196 } |
197 } | 197 } |