updating path

Author: QasimWani

css/popup.css

@@ -30,5 +30,6 @@ body {
   font-family: sans-serif;
   border-top: solid black 1px;
   font-weight: 500;
+  padding-top: 2%;
   font-size: medium;
 }

popup.html

@@ -66,13 +66,13 @@ <h1 id="title">
           </p>
           <p class="ui small header">
             <span style="color: #5cb85c">Easy:</span>
-            <span id="p_solved_easy" style="color: #5cb85c">0 </span>
-            <span style="color: #f0ad4e">Medium:</span>
-            <span id="p_solved_medium" style="color: #f0ad4e"
+            <span id="p_solved_easy" style="color: #000000; opacity: 0.75;">0 </span>
+            <span style="color: #f0ad4e">&ensp; &ensp; Medium:</span>
+            <span id="p_solved_medium" style="color: #000000; opacity: 0.75;"
               >0
             </span>
-            <span style="color: #d9534f">Hard:</span>
-            <span id="p_solved_hard" style="color: #d9534f">0 </span>
+            <span style="color: #d9534f">&ensp; &ensp; Hard:</span>
+            <span id="p_solved_hard" style="color: #000000; opacity: 0.75;">0 </span>
           </p>
 
           <div class="ui small header">

popup.js

@@ -50,7 +50,7 @@ chrome.storage.sync.get('leethub_token', (data) => {
                   const leethubHook = data3.leethub_hook;
                   if (leethubHook) {
                     $('#repo_url').html(
-                      `<a target="blank" style="color: cadetblue !important" href="/${leethubHook}">Linked Repo</a>`,
+                      `<a target="blank" style="color: cadetblue !important; font-size:0.8em;" href="/${leethubHook}">${leethubHook}</a>`,
                     );
                   }
                 },

scripts/leetcode.js

@@ -20,6 +20,10 @@ const languages = {
   Oracle: '.sql',
 };
 
+/* Commit messages */
+const readmeMsg = 'Create README - LeetHub';
+const discussionMsg = 'Prepend discussion post - LeetHub';
+
 /* Difficulty of most recenty submitted question */
 let difficulty = '';
 
@@ -42,18 +46,16 @@ function findLanguage() {
 }
 
 /* Main function for uploading code to GitHub repo */
-const upload = (token, hook, code, directory, filename, sha) => {
+const upload = (token, hook, code, directory, filename, sha, msg) => {
   // To validate user, load user object from GitHub.
   const URL = `https://api.github.com/repos/${hook}/contents/${directory}/${filename}`;
 
   /* Define Payload */
   let data = {
-    message: `working commit - Created using LeetHub`,
+    message: msg,
     content: code,
+    sha,
   };
-  if (sha !== null) {
-    data.sha = sha; // get sha for files that already exist in the gh file system.
-  }
 
   data = JSON.stringify(data);
 
@@ -99,7 +101,57 @@ const upload = (token, hook, code, directory, filename, sha) => {
   xhr.send(data);
 };
 
-function uploadGit(code, problemName, filename) {
+/* Main function for updating code on GitHub Repo */
+/* Currently only used for prepending discussion posts to README */
+const update = (token, hook, addition, directory, msg, prepend) => {
+  const URL = `https://api.github.com/repos/${hook}/contents/${directory}/README.md`;
+
+  /* Read from existing file on GitHub */
+  const xhr = new XMLHttpRequest();
+  xhr.addEventListener('readystatechange', function () {
+    if (xhr.readyState === 4) {
+      if (xhr.status === 200 || xhr.status === 201) {
+        const response = JSON.parse(xhr.responseText);
+        const existingContent = decodeURIComponent(
+          escape(atob(response.content)),
+        );
+        let newContent = '';
+
+        /* Discussion posts prepended at top of README */
+        /* Future implementations may require appending to bottom of file */
+        if (prepend) {
+          newContent = btoa(
+            unescape(encodeURIComponent(addition + existingContent)),
+          );
+        }
+
+        /* Write file with new content to GitHub */
+        upload(
+          token,
+          hook,
+          newContent,
+          directory,
+          'README.md',
+          response.sha,
+          msg,
+        );
+      }
+    }
+  });
+  xhr.open('GET', URL, true);
+  xhr.setRequestHeader('Authorization', `token ${token}`);
+  xhr.setRequestHeader('Accept', 'application/vnd.github.v3+json');
+  xhr.send();
+};
+
+function uploadGit(
+  code,
+  problemName,
+  fileName,
+  msg,
+  action,
+  prepend = true,
+) {
   /* Get necessary payload data */
   chrome.storage.sync.get('leethub_token', (t) => {
     const token = t.leethub_token;
@@ -114,7 +166,7 @@ function uploadGit(code, problemName, filename) {
               /* Get SHA, if it exists */
 
               /* to get unique key */
-              const filePath = problemName + filename;
+              const filePath = problemName + fileName;
               chrome.storage.sync.get('stats', (s) => {
                 const { stats } = s;
                 let sha = null;
@@ -126,8 +178,29 @@ function uploadGit(code, problemName, filename) {
                 ) {
                   sha = stats.sha[filePath];
                 }
-                /* Upload to git. */
-                upload(token, hook, code, problemName, filename, sha);
+
+                if (action === 'upload') {
+                  /* Upload to git. */
+                  upload(
+                    token,
+                    hook,
+                    code,
+                    problemName,
+                    fileName,
+                    sha,
+                    msg,
+                  );
+                } else if (action === 'update') {
+                  /* Update on git */
+                  update(
+                    token,
+                    hook,
+                    code,
+                    problemName,
+                    msg,
+                    prepend,
+                  );
+                }
               });
             }
           });
@@ -168,9 +241,9 @@ function parseQuestion() {
   const qbody = questionElem[0].innerHTML;
 
   // Problem title.
-  let qtitle = document.getElementsByClassName('css-v3d350')[0];
+  let qtitle = document.getElementsByClassName('css-v3d350');
   if (checkElem(qtitle)) {
-    qtitle = qtitle.innerHTML;
+    qtitle = qtitle[0].innerHTML;
   } else {
     qtitle = 'unknown-problem';
   }
@@ -192,9 +265,64 @@ function parseQuestion() {
   return markdown;
 }
 
+/* Parser function for time/space stats */
+function parseStats() {
+  const probStats = document.getElementsByClassName('data__HC-i');
+  if (!checkElem(probStats)) {
+    return null;
+  }
+  const time = probStats[0].textContent;
+  const timePercentile = probStats[1].textContent;
+  const space = probStats[2].textContent;
+  const spacePercentile = probStats[3].textContent;
+
+  // Format commit message
+  return `Time: ${time} (${timePercentile}), Space: ${space} (${spacePercentile}) - LeetHub`;
+}
+
+document.addEventListener('click', (event) => {
+  const element = event.target;
+  const oldPath = window.location.pathname;
+
+  /* Act on Post button click */
+  /* Complex since "New" button shares many of the same properties as "Post button */
+  if (
+    element.classList.contains('icon__3Su4') ||
+    element.parentElement.classList.contains('icon__3Su4') ||
+    element.parentElement.classList.contains(
+      'btn-content-container__214G',
+    ) ||
+    element.parentElement.classList.contains('header-right__2UzF')
+  ) {
+    setTimeout(function () {
+      /* Only post if post button was clicked and url changed */
+      if (
+        oldPath !== window.location.pathname &&
+        oldPath ===
+          window.location.pathname.substring(0, oldPath.length) &&
+        !Number.isNaN(window.location.pathname.charAt(oldPath.length))
+      ) {
+        const date = new Date();
+        const currentDate = `${date.getDate()}/${date.getMonth()}/${date.getFullYear()} at ${date.getHours()}:${date.getMinutes()}`;
+        const addition = `[Discussion Post (created on ${currentDate})](${window.location})  \n`;
+        const problemName = window.location.pathname.split('/')[2]; // must be true.
+
+        uploadGit(
+          addition,
+          problemName,
+          'README.md',
+          discussionMsg,
+          'update',
+        );
+      }
+    }, 1000);
+  }
+});
+
 const loader = setInterval(() => {
   let code = null;
   let probStatement = null;
+  let probStats = null;
 
   const successTag = document.getElementsByClassName('success__3Ai7');
   if (
@@ -204,26 +332,47 @@ const loader = setInterval(() => {
   ) {
     code = parseCode();
     probStatement = parseQuestion();
+    probStats = parseStats();
   }
-  if (code !== null && probStatement !== null) {
+  if (code !== null && probStatement !== null && probStats !== null) {
     clearTimeout(loader);
     const problemName = window.location.pathname.split('/')[2]; // must be true.
     const language = findLanguage();
     if (language !== null) {
       uploadGit(
-        btoa(unescape(encodeURIComponent(code))),
+        btoa(unescape(encodeURIComponent(probStatement))),
         problemName,
-        problemName + language,
-      ); // Encode `code` to base64
+        'README.md',
+        readmeMsg,
+        'upload',
+      );
 
-      /* @TODO: Change this setTimeout to Promise */
-      setTimeout(function () {
-        uploadGit(
-          btoa(unescape(encodeURIComponent(probStatement))),
-          problemName,
-          'README.md',
-        );
-      }, 2000);
+      /* Only create README if not already created */
+      chrome.storage.sync.get('stats', (s) => {
+        const { stats } = s;
+        const filePath = problemName + problemName + language;
+        let sha = null;
+        if (
+          stats !== undefined &&
+          stats.sha !== undefined &&
+          stats.sha[filePath] !== undefined
+        ) {
+          sha = stats.sha[filePath];
+        }
+
+        if (sha === null) {
+          /* @TODO: Change this setTimeout to Promise */
+          setTimeout(function () {
+            uploadGit(
+              btoa(unescape(encodeURIComponent(code))),
+              problemName,
+              problemName + language,
+              probStats,
+              'upload',
+            ); // Encode `code` to base64
+          }, 2000);
+        }
+      });
     }
   }
-}, 1000);
+}, 1000);

welcome.html

@@ -104,11 +104,11 @@
           >
             <span style="color: #5cb85c">Easy:</span>
             <span id="p_solved_easy" style="color: #5cb85c">0 </span>
-            <span style="color: #f0ad4e">Medium:</span>
+            <span style="color: #f0ad4e">&ensp; &ensp; Medium:</span>
             <span id="p_solved_medium" style="color: #f0ad4e"
               >0
             </span>
-            <span style="color: #d9534f">Hard:</span>
+            <span style="color: #d9534f">&ensp; &ensp; Hard:</span>
             <span id="p_solved_hard" style="color: #d9534f">0 </span>
           </div>
         </div>