Fix: reset 'upload avatar' button on error.

static/js/user.js

@@ -1,125 +1,131 @@
-function render_videos(results) {
-  if (results.length < 6)
-    $(window).unbind('scroll', load_more);
-
-  if (results.length == 0)
-    return;
-
-  $('#no_videos').hide();
-
-  for (var i = 0; i < results.length; i++) {
-    var result = results[i];
-    var html = '';
-    var tags = '';
-
-    for (var j = 0; j < result.tags_list.length; j++) {
-      tags += '<a class="tag is-light" href="/search?q=' + result.tags_list[j] + '">';
-      tags += result.tags_list[j];
-      tags += '</a>'
-    }
-
-    html += '<div class="column is-half">';
-    html += '<div class="card">';
-    html += '<div class="card-image">';
-    html += '<figure class="image is-16by9">';
-    html += '<a href="/watch/' + String(result.id) + '">';
-    html += '<img src="' + result.thumbnail + '">';
-    html += '</a>';
-    html += '</figure>';
-    html += '</div>';
-    html += '<div class="card-content">';
-    html += '<div class="content">';
-    html += '<div class="tags are-normal">' + tags + '</div>';
-    html += '</div>';
-    html += '<div class="media">';
-    html += '<div class="media-left">';
-    html += '<figure class="image is-48x48">';
-    html += '<a href="/user/' + result.uploader_id + '"><img id="avatar_' + String(result.id) + '" src="/static/avatars/default/default.128.png"></a>';
-    html += '</figure>';
-    html += '</div>';
-    html += '<div class="media-content">';
-    html += '<p class="title is-5"><a id="username_' + String(result.id) + '" href="/user/' + result.uploader_id + '">the void</a></p>';
-    html += '<p class="subtitle is-6"><i class="fas fa-heart"></i> ' + String(result.likes_count) + '</p>';
-    html += '</div>';
-    html += '</div>';
-    html += '</div>';
-    html += '</div>';
-    html += '</div>';
-
-    $('#user_videos').append(html);      
-
-    api('user', {user_id: result.uploader_id}, function (data, additional_data) {  
-      var video_id =  additional_data[0];
-
-      $('#avatar_' + String(video_id)).attr('src', data.avatar128);
-      $('#username_' + String(video_id)).text(data.username);
-    }, result.id);
-  }
-
-  if (results.length >= 6) {
-    window.offset += results.length;
-
-    $(window).bind('scroll', load_more);
-  }
-}
-
-function get_user_videos() {
-  api('videos', {user_id: window.user_id, offset: window.offset}, function (data) {
-    $('#videos_count').text(data.videos_count);
-
-    $('#videos_count_suffix').text(data.videos_count != 1? 's': '');
-    
-    render_videos(data.videos);
-  });
-}
-
-function load_more() {
-  if (!scrolled_down(100))
-    return;
-
-  get_user_videos();
-
-  $(window).unbind('scroll', load_more);
-}
-
-$(function () {
-  window.offset = 0;
-  $('#change_avatar').hide();
-
-  api_unchecked('user', {user_id: window.user_id}, function (data) {
-    if (data.error !== undefined) {
-      document.location.href = '/404';
-      
-      return; 
-    }
-
-    $('#avatar').attr('src', data.avatar128);
-    $('#username').text(data.username);
-    $('#signup_date').text(moment.unix(data.signup_ts).format('L'));
-    
-    get_user_videos();
-  });
-  
-  if (window.user_id == window.my_user_id) {
-    $('#change_avatar').show();
-    
-    $('#upload_avatar_button').click(function () {
-      $('#upload_avatar_button').addClass('is-loading');
-      $('#upload_avatar_button').prop('disabled', true);
-
-      var form = new FormData();
-      form.append('avatar', $('#avatar_input').prop('files')[0]);
-
-      api('upload/avatar', form, function (data) {
-        $('#upload_avatar_button').removeClass('is-loading');
-        $('#upload_avatar_button').prop('disabled', false);
-
-        popup('primary', 'Successfully updated your avatar!');
-
-        setTimeout(function () {
-          window.location.reload();
-        }, 1500);
-      });
-    });
-  } 
-});
+function render_videos(results) {
+  if (results.length < 6)
+    $(window).unbind('scroll', load_more);
+
+  if (results.length == 0)
+    return;
+
+  $('#no_videos').hide();
+
+  for (var i = 0; i < results.length; i++) {
+    var result = results[i];
+    var html = '';
+    var tags = '';
+
+    for (var j = 0; j < result.tags_list.length; j++) {
+      tags += '<a class="tag is-light" href="/search?q=' + result.tags_list[j] + '">';
+      tags += result.tags_list[j];
+      tags += '</a>'
+    }
+
+    html += '<div class="column is-half">';
+    html += '<div class="card">';
+    html += '<div class="card-image">';
+    html += '<figure class="image is-16by9">';
+    html += '<a href="/watch/' + String(result.id) + '">';
+    html += '<img src="' + result.thumbnail + '">';
+    html += '</a>';
+    html += '</figure>';
+    html += '</div>';
+    html += '<div class="card-content">';
+    html += '<div class="content">';
+    html += '<div class="tags are-normal">' + tags + '</div>';
+    html += '</div>';
+    html += '<div class="media">';
+    html += '<div class="media-left">';
+    html += '<figure class="image is-48x48">';
+    html += '<a href="/user/' + result.uploader_id + '"><img id="avatar_' + String(result.id) + '" src="/static/avatars/default/default.128.png"></a>';
+    html += '</figure>';
+    html += '</div>';
+    html += '<div class="media-content">';
+    html += '<p class="title is-5"><a id="username_' + String(result.id) + '" href="/user/' + result.uploader_id + '">the void</a></p>';
+    html += '<p class="subtitle is-6"><i class="fas fa-heart"></i> ' + String(result.likes_count) + '</p>';
+    html += '</div>';
+    html += '</div>';
+    html += '</div>';
+    html += '</div>';
+    html += '</div>';
+
+    $('#user_videos').append(html);      
+
+    api('user', {user_id: result.uploader_id}, function (data, additional_data) {  
+      var video_id =  additional_data[0];
+
+      $('#avatar_' + String(video_id)).attr('src', data.avatar128);
+      $('#username_' + String(video_id)).text(data.username);
+    }, result.id);
+  }
+
+  if (results.length >= 6) {
+    window.offset += results.length;
+
+    $(window).bind('scroll', load_more);
+  }
+}
+
+function get_user_videos() {
+  api('videos', {user_id: window.user_id, offset: window.offset}, function (data) {
+    $('#videos_count').text(data.videos_count);
+
+    $('#videos_count_suffix').text(data.videos_count != 1? 's': '');
+    
+    render_videos(data.videos);
+  });
+}
+
+function load_more() {
+  if (!scrolled_down(100))
+    return;
+
+  get_user_videos();
+
+  $(window).unbind('scroll', load_more);
+}
+
+$(function () {
+  window.offset = 0;
+  $('#change_avatar').hide();
+
+  api_unchecked('user', {user_id: window.user_id}, function (data) {
+    if (data.error !== undefined) {
+      document.location.href = '/404';
+      
+      return; 
+    }
+
+    $('#avatar').attr('src', data.avatar128);
+    $('#username').text(data.username);
+    $('#signup_date').text(moment.unix(data.signup_ts).format('L'));
+    
+    get_user_videos();
+  });
+  
+  if (window.user_id == window.my_user_id) {
+    $('#change_avatar').show();
+    
+    $('#upload_avatar_button').click(function () {
+      $('#upload_avatar_button').addClass('is-loading');
+      $('#upload_avatar_button').prop('disabled', true);
+
+      var form = new FormData();
+      form.append('avatar', $('#avatar_input').prop('files')[0]);
+
+      api_unchecked('upload/avatar', form, function (data) {
+        $('#upload_avatar_button').removeClass('is-loading');
+        $('#upload_avatar_button').prop('disabled', false);
+        
+        if (data.error !== undefined) {
+          popup('danger', 'Error: ' + data.error);
+          
+          return;
+        }
+        
+        popup('primary', 'Successfully updated your avatar!');
+
+        setTimeout(function () {
+          window.location.reload();
+        }, 1500);
+      });
+    });
+  } 
+});