To merge

.gitignore

@@ -3,5 +3,4 @@ node_modules/
 .parcel-cache/
 dist/
 package-lock.json
-
 .env

authenticator.js

@@ -0,0 +1,68 @@
+let isAuthenticated = false;
+
+function logout() {
+  // remove access token from session storage
+  sessionStorage.removeItem("GCP_access_token");
+  // remove access token from gapi client
+  gapi.client.setToken(null);
+  // disable browse button
+  $("#browse_btn").hide();
+  // if logged out successfully, hide logout button && show authentication button
+  $(".toolbar [id='logout_btn']").hide();
+  $(".toolbar [id='auth_btn']").show();
+}
+
+function onAuthenticated() {
+  // set access token in gapi client for future requests
+  gapi.client.setToken({ access_token: getTokenFromSessionStorage() });
+  const accessToken = getTokenFromSessionStorage();
+  if (accessToken) {
+    isAuthenticated = true;
+    // alert("Authenticated with Google Drive successfully!");
+    // enable browse button
+    enableBrowseButton(accessToken);
+    // if authenticated successfully, hide authentication button && show logout button
+    $(".toolbar [id='auth_btn']").hide();
+    $(".toolbar [id='logout_btn']").show();
+  }
+}
+
+function authenticate() {
+  window.open("https://mra9407.pythonanywhere.com/authorize", "_self", "popup");
+  // // callbackafter access token is retrieved
+  // tokenClient.callback = async (resp) => {
+  //   if (resp.error !== undefined) {
+  //     throw resp;
+  //   }
+  //   setTokenInSessionStorage(gapi.client.getToken().access_token);
+  //   onAuthenticated();
+  // };
+  // // need to add a check for when the token expires
+  // if (gapi.client.getToken() === null) {
+  //   // Prompt the user to select a Google Account and ask for consent to share their data
+  //   // when establishing a new session.
+  //   tokenClient.requestAccessToken({ prompt: "consent" });
+  // }
+}
+
+function setTokenInSessionStorage(token) {
+  sessionStorage.setItem("GCP_access_token", token);
+}
+
+function getTokenFromSessionStorage() {
+  return sessionStorage.getItem("GCP_access_token");
+}
+
+// retrieve access token from session storage when page is loaded
+window.onload = function () {
+  const urlParams = new URLSearchParams(window.location.search);
+
+  const sessionToken = urlParams.get('token');
+  if (sessionToken) {
+    setTokenInSessionStorage(sessionToken);
+  }
+
+  if (getTokenFromSessionStorage()) {
+    onAuthenticated();
+  }
+};

configFileHandler.js

@@ -23,15 +23,15 @@ function retrieveConfigFiles() {
   return new Promise((resolve, reject) => {
     let fileObjects = [];
     let rsp;
-    sendRequest(
-      "GET",
-      "https://api.github.com/repos/CAMeL-Lab/palmyra/contents/palmyraSampleFiles/config"
-    )
+    axios
+      .get(
+        "https://api.github.com/repos/CAMeL-Lab/palmyra/contents/palmyraSampleFiles/config"
+      )
       .then(async (rsp) => {
-        let files = JSON.parse(rsp);
+        let files = rsp.data;
         for (let file of files) {
-          rsp = await sendRequest("GET", file.download_url);
-          let fileObject = new File([rsp], file.name, { type: "text/plain" });
+          rsp = await axios.get(file.download_url);
+          let fileObject = new File([JSON.stringify(rsp.data)], file.name, { type: "text/plain" });
           fileObjects.push(fileObject);
         }
         resolve(fileObjects);
@@ -227,7 +227,6 @@ var parseConfig = function (content) {
 
         lexicalFeats.append(titleParagraph);
         lexicalFeats.appendChild(lexDiv);
-        console.log();
       }
     }
 
@@ -319,4 +318,4 @@ var readConfigFile = async function () {
 };
 
 window.populateConfigFileSelector = populateConfigFileSelector;
-window.readConfigFile = readConfigFile;
+window.readConfigFile = readConfigFile;

gapiLoader.js

@@ -0,0 +1,149 @@
+let gapiClientInited = false;
+let gapiPickerInited = false;
+let gisInited = false;
+// set this to the right server origin when pushed to Github
+const SERVER_ORIGIN = "https://mra9407.pythonanywhere.com";
+let tokenClient;
+let pickedFile;
+let fileId;
+
+/**
+ * Callback after api script is loaded.
+ */
+function gapiLoaded(libraryName, callback) {
+  gapi.load(libraryName, callback);
+}
+
+/**
+ * Callback after Google Identity Services are loaded.
+ */
+// function gisLoaded() {
+//   axios
+//     .get(`${SERVER_ORIGIN}/gis_credentials`)
+//     .then((rsp) => {
+//       let credentials = rsp.data;
+//       tokenClient = google.accounts.oauth2.initTokenClient({
+//         client_id: credentials.client_id,
+//         scope: credentials.scope,
+//         callback: "", // defined later
+//       });
+//       gisInited = true;
+//       maybeEnableAuthButton();
+//     })
+//     .catch((err) => {
+//       console.log(err);
+//     });
+// }
+
+/**
+ * Callback after the API client is loaded.
+ */
+// function initializeGapiClient() {
+//   axios
+//     .get(`${SERVER_ORIGIN}/gapi_credentials`)
+//     .then((rsp) => {
+//       let credentials = rsp.data;
+//       gapi.client
+//         .init({
+//           apiKey: credentials.apiKey,
+//           discoveryDocs: credentials.discoveryDocs,
+//         })
+//         .then(() => {
+//           gapiClientInited = true;
+//           maybeEnableAuthButton();
+//         })
+//         .catch((err) => {
+//           console.log(err);
+//         });
+//     })
+//     .catch((err) => {
+//       console.log(err);
+//     });
+// }
+
+function initializeGapiPicker() {
+  gapiPickerInited = true;
+}
+
+function showPicker(accessToken, callback) {
+  // axios
+  //   .get(`${SERVER_ORIGIN}/gapi_credentials`)
+  //   .then((rsp) => {
+  //     let credentials = rsp.data;
+  let view = new google.picker.DocsView(google.picker.ViewId.DOCS);
+  view.setMimeTypes("text/plain");
+  view.setMode(google.picker.DocsViewMode.LIST);
+  let picker = new google.picker.PickerBuilder()
+    .addView(view)
+    .setOAuthToken(accessToken)
+    // .setDeveloperKey(credentials.apiKey)
+    .setCallback(callback)
+    .build();
+  picker.setVisible(true);
+    // })
+    // .catch((err) => {
+    //   console.log(err);
+    // });
+}
+
+function pickerCallback(data) {
+  // if the user picked a file
+  // need to check if the file is a conllu file
+  if (data[google.picker.Response.ACTION] == google.picker.Action.PICKED) {
+    let doc = data[google.picker.Response.DOCUMENTS][0];
+    let fileNameParts = doc.name.split(".");
+    if (
+      fileNameParts[fileNameParts.length - 1] !== "conllu" &&
+      fileNameParts[fileNameParts.length - 1] !== "conllx"
+    ) {
+      alert(
+        "File does not end with the .conllu/conllx extension, please upload a ConllU/X file."
+      );
+      return;
+    }
+    // need to add extension for conllx files as well
+    let url =
+      "https://www.googleapis.com/drive/v3/files/" + doc.id + "?alt=media";
+    axios
+      .get(url, {
+        headers: {
+          Authorization: "Bearer " + getTokenFromSessionStorage(),
+        },
+      })
+      .then((rsp) => {
+        // show name of picked file
+        // set global pickedFile variable
+        document.getElementById("picked_filename").innerHTML = doc.name;
+        pickedFile = new File([rsp.data], doc.name, { type: doc.mimeType });
+        fileId = doc.id;
+      })
+      .catch((err) => {
+        console.log(err);
+        alert("Failed to retrieve file!");
+      });
+  }
+}
+
+function enableBrowseButton(accessToken) {
+  let browseBtn = document.getElementById("browse_btn");
+  browseBtn.style.display = "inline-block";
+  browseBtn.onclick = () => {
+    showPicker(accessToken, pickerCallback);
+    // showPicker(gapi.client.getToken().access_token, pickerCallback);
+  };
+}
+
+/**
+ * Enables user interaction after all libraries are loaded.
+ */
+function maybeEnableAuthButton() {
+  if (gapiClientInited && gapiPickerInited && gisInited && !isAuthenticated) {
+    $(".toolbar [id='auth_btn']").show();
+  }
+}
+
+function maybeEnableSaveRemoteButton() {
+  if (gapiClientInited && gisInited) {
+    $("#save_remote").show();
+  }
+}