Move the javascript code to a separate file.

author: Kjetil Orbekk <kjetil.orbekk@gmail.com> 2015-10-13 21:34:00 -0400
committer: Kjetil Orbekk <kjetil.orbekk@gmail.com> 2015-10-13 21:34:00 -0400
commit: 797a81e3789ab2b6748e60cf76d63d46bad616e2 (patch)
tree: 4fb47458f121e71e06caf815ec302314309aef8f
parent: c395ccd723b06d10c37a76a1eb9b13fb0183ad3c (diff)
2 files changed, 100 insertions, 101 deletions
diff --git a/web/index.html b/web/index.html
index 3655b59..89ca0dc 100644
--- a/web/index.html
+++ b/web/index.html
@@ -11,107 +11,7 @@
   <link href='https://fonts.googleapis.com/css?family=Noto+Sans' rel='stylesheet' type='text/css'>
   <link rel="stylesheet" href="style.css">
   <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
-  <script>
-    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();
-    };
-  </script>
+  <script type="text/javascript" src="/main.js"></script>
 </head>
 <body>
   <div class="g-signin2" data-onsuccess="onSignIn" data-theme="dark"></div>
diff --git a/web/main.js b/web/main.js
new file mode 100644
index 0000000..93c465e
--- /dev/null
+++ b/web/main.js
@@ -0,0 +1,99 @@
+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();
+};
author	Kjetil Orbekk <kjetil.orbekk@gmail.com>	2015-10-13 21:34:00 -0400
committer	Kjetil Orbekk <kjetil.orbekk@gmail.com>	2015-10-13 21:34:00 -0400
commit	797a81e3789ab2b6748e60cf76d63d46bad616e2 (patch)
tree	4fb47458f121e71e06caf815ec302314309aef8f
parent	c395ccd723b06d10c37a76a1eb9b13fb0183ad3c (diff)