text: var authentication_token = null;
  
  function addPending(albumName) {
      function makeElement(name) {
          return $('<li>' + name + ' (<a href="javascript:void(0)">edit</a>)</li>');
      }
      var element = makeElement(albumName);
      $(element).find('a').click(function() {
          var input =
                  $('<input type="text" value="'+albumName+'" autofocus="true">');
          setTimeout(function() {
              var position = input[0].value.length;
              input[0].setSelectionRange(position, position);
          }, 0);
          $(input).keypress(function(e) {
              if (e.which == 13) {
                  $(input).replaceWith($('<i>renaming...</i>'));
                  renamePending(albumName, input[0].value);
              }
          });
          $(this).replaceWith(input);
      });
      $('#pending-container').append(element);
  }
  
  function addPermanentAlbum(albumName) {
      function makeElement(name) {
          return $('<li>' + name + '</li>');
      }
      $('#album-container').append(makeElement(albumName));
  }
  
  function fetchAlbums() {
      $.ajax({
          url: "/api/albums",
          headers: {'X-Token': authentication_token},
          success: function(data) {
              $('#pending-error').empty();
              $('#pending-container').empty();
              $('#album-container').empty();
              console.log('Got albums:');
              console.log(data);
              data.forEach(function (album) {
                  if (album.pending) {
                      addPending(album.name, album.pending);
                  } else {
                      addPermanentAlbum(album.name);
                  }
                  console.log('Added album ' + album.name);
              });
          },
          error: function(unused, unusedStatus, error) {
              $('#pending-container').empty();
              $('#pending-error').html(
                  '<p><b>Error</b> fetching pending albums: ' + error);
          }
      });
  }
  
  function showError(error) {
      $('#generic-error').html(
          '<p>' + error + '</p>');
  }
  
  function renamePending(oldName, newName) {
      var request = {
          from: { name: oldName, pending: true },
          to: { name: newName, pending: false }
      };
      $.ajax({
          url: '/api/rename',
          headers: {'X-Token': authentication_token},
          type: 'POST',
          contentType: 'application/json',
          data: JSON.stringify(request),
          success: function(data) {
              if ('Left' in data) {
                  showError('Error renaming ' + oldName + ' to ' + newName + ': ' +
                            data.Left);
              }
              fetchAlbums();
          }
      });
  }
  
  function onSignIn(googleUser) {
      // Useful data for your client-side scripts:
      var profile = googleUser.getBasicProfile();
      console.log("ID: " + profile.getId()); // Don't send this directly to your server!
      console.log("Name: " + profile.getName());
      console.log("Image URL: " + profile.getImageUrl());
      console.log("Email: " + profile.getEmail());
      authentication_token = googleUser.getAuthResponse().id_token;
      // The ID token you need to pass to your backend:
      var id_token = googleUser.getAuthResponse().id_token;
      console.log("ID Token: " + id_token);
      $('.g-signin2').remove();
      fetchAlbums();
  };
  