Merge pull request #188 from vict0rsch/mdpi

manifest.json

@@ -1,6 +1,6 @@
 {
   "name": "Paper Memory",
-  "version": "0.6.0",
+  "version": "0.6.1",
   "manifest_version": 2,
   "description": "Automatically record papers and their codes from Arxiv, OpenReview & more! Organize your library with tags, links and quick notes.",
   "homepage_url": "https://papermemory.org",

src/background/background.js

@@ -90,25 +90,37 @@ const urlIsAKnownPdfSource = (url) => {
 const fetchOpenReviewNoteJSON = async (url) => {
     const id = url.match(/id=([\w-])+/)[0].replace("id=", "");
     const api = `https://api.openreview.net/notes?id=${id}`;
-    return fetch(api).then((response) => {
-        return response.json();
-    });
+    let response = await fetch(api);
+    let json = await response.json();
+    if (json["status"] === 404) {
+        warn("Note not found in api.openreview.net, trying api2.openreview.net...");
+        const api2 = `https://api2.openreview.net/notes?id=${id}`;
+        response = await fetch(api2);
+        json = await response.json();
+    }
+    return json;
 };
 
 const fetchOpenReviewForumJSON = async (url) => {
     const id = url.match(/id=([\w-])+/)[0].replace("id=", "");
     const api = `https://api.openreview.net/notes?forum=${id}`;
-    return fetch(api).then((response) => {
-        return response.json();
-    });
+    let response = await fetch(api);
+    let json = await response.json();
+    if (json["status"] === 404 || json["notes"].length === 0) {
+        warn("Forum not found in api.openreview.net, trying api2.openreview.net...");
+        const api2 = `https://api2.openreview.net/notes?forum=${id}`;
+        response = await fetch(api2);
+        json = await response.json();
+    }
+    return json;
 };
 
 const fetchGSData = async (paper) => {
     try {
         var resultsDom = await fetchDom(
             `https://scholar.google.com/scholar?q=${encodeURI(paper.title)}&hl=en`
         );
-        const result = queryAll(resultsDom, "#gs_res_ccl_mid h3.gs_rt")
+        const result = queryAll("#gs_res_ccl_mid h3.gs_rt", resultsDom)
             .map((h3, idx) => [
                 miniHash(h3.innerText.toLowerCase().replace("[pdf]", "")),
                 idx,
@@ -122,7 +134,7 @@ const fetchGSData = async (paper) => {
             const citeDom = await fetchDom(
                 `https://scholar.google.fr/scholar?q=info:${dataId}:scholar.google.com/&output=cite&scirp=0&hl=en`
             );
-            const bibURL = queryAll(citeDom, "a.gs_citi")
+            const bibURL = queryAll("a.gs_citi", citeDom)
                 .find((a) => a.innerText.toLowerCase() === "bibtex")
                 ?.getAttribute("href");
             if (bibURL) {

src/content_scripts/content_script.js

@@ -327,6 +327,12 @@ const svg = (name) => {
     }
 };
 
+/** Whether or not to ignore the current paper based on its `is` object
+ * and the dictionary of sources to ignore
+ * @param {object} is The `is` object of the current paper
+ * @param {object} ignoreSources The dictionary of sources to ignore
+ * @returns {boolean} Whether or not to ignore the current paper
+ * */
 const ignorePaper = (is, ignoreSources) => {
     const sources = Object.entries(ignoreSources)
         .filter(([name, ignore]) => ignore)
@@ -431,6 +437,7 @@ const contentScriptMain = async ({
  * Slides a div in then out, bottom right, with some text to give the user
  * a feedback on some action performed
  * @param {string} text the text to display in the slider div
+ * @returns {void}
  */
 const feedback = (text, paper = null) => {
     if (document.readyState === "loading") {
@@ -505,6 +512,11 @@ const feedback = (text, paper = null) => {
     });
 };
 
+/**
+ * Changes the width of the arxiv columns: left is smaller, right is bigger
+ * @param {string} newColWidth the new width of the left column
+ * @returns {void}
+ */
 const adjustArxivColWidth = (newColWidth = "33%") => {
     document
         .querySelector(".leftcolumn")
@@ -514,6 +526,10 @@ const adjustArxivColWidth = (newColWidth = "33%") => {
         ?.setAttribute("style", `width: ${newColWidth} !important`);
 };
 
+/** Adds a paper's venue html element to the arxiv page
+ * @param {object} paper The paper object
+ * @returns {void}
+ * */
 const displayPaperVenue = (paper) => {
     if (!paper.venue) {
         return;
@@ -529,6 +545,10 @@ const displayPaperVenue = (paper) => {
     findEl("pm-header-content")?.insertAdjacentHTML("afterbegin", venueDiv);
 };
 
+/** Adds a paper's code html element to the arxiv page
+ * @param {object} paper The paper object
+ * @returns {void}
+ * */
 const displayPaperCode = (paper) => {
     if (!paper.codeLink) {
         return;
@@ -542,6 +562,11 @@ const displayPaperCode = (paper) => {
     findEl("pm-extras")?.insertAdjacentHTML("afterbegin", code);
 };
 
+/**
+ * Adds the venue badge to HuggingFace paper pages
+ * @param {object} paper The paper object
+ * @param {string} url The current url
+ */
 const huggingfacePapers = (paper, url) => {
     if (!paper || !paper.venue) return;
     if (!url || !url.includes("huggingface.co/papers/")) return;
@@ -557,7 +582,6 @@ const huggingfacePapers = (paper, url) => {
     abstractH2 = [...document.querySelectorAll("h2")].find(
         (h) => h.innerText.trim() === "Abstract"
     );
-    console.log("abstractH2: ", abstractH2);
     if (!abstractH2) {
         log("Missing 'Abstract' h2 title on HuggingFace paper page.");
     }
@@ -568,6 +592,11 @@ const huggingfacePapers = (paper, url) => {
     }, 100);
 };
 
+/**
+ * Handle the ArXiv UI enhancements
+ * @param {object} checks The user's stored preferences regarding menu options
+ * @returns {void}
+ * */
 const arxiv = async (checks) => {
     const { checkMd, checkBib, checkDownload, checkStore } = checks;
 

src/options/options.html

@@ -21,7 +21,7 @@
 
     <div id="header">
         <div id="header-wrapper">
-            <h1>Paper Memory Options</h1>
+            <h1>PaperMemory Options</h1>
             <svg viewBox="0 0 24 24" class="pm-tabler-icon ml-3" id="header-icon">
                 <path stroke="none" d="M0 0h24v24H0z" fill="none" />
                 <polyline points="13 3 13 10 19 10 11 21 11 14 5 14 13 3" />

src/options/options.js

@@ -51,7 +51,7 @@ const setUpKeyboardListeners = () => {
 // -------------------------------
 
 const makeTOC = async () => {
-    const h1s = queryAll(document, "h2");
+    const h1s = queryAll("h2");
     let toc = [];
     for (const h of h1s) {
         const title = h.innerText;
@@ -67,7 +67,7 @@ const makeTOC = async () => {
 // ----------------------------------------
 
 const setupCodeBlocks = async () => {
-    let codes = queryAll(document, "code.trim-code");
+    let codes = queryAll("code.trim-code");
 
     for (const code of codes) {
         let lines = code.innerHTML.split("\n").filter((l) => l.trim() !== "");

src/popup/css/dark.css

@@ -1,7 +1,7 @@
 :root {
     --background: #222a35;
     --lighterBackground: #323942;
-    --ligthBackground: #4b535c;
+    --lightBackground: #4b535c;
     --codeBackground: #3c3c3f;
     --lightestBackground: #788089;
     --dimColor: #8d9cac;
@@ -198,15 +198,13 @@ button:not(.select2-selection__choice__remove):hover,
 .memory-note-div {
     color: var(--noteColor);
 }
-.memory-authors {
+.memory-authors,
+.memory-item-venue {
     color: var(--dimColor);
 }
 .memory-display-id {
     color: var(--dimColor);
 }
-.memory-visits {
-    color: var(--dimColor);
-}
 .memory-code-link {
     color: var(--aColor);
 }
@@ -222,6 +220,11 @@ button:not(.select2-selection__choice__remove):hover,
 .memory-item-feedback {
     color: var(--green);
 }
+#popup-title-tooltip,
+.title-tooltip {
+    box-shadow: 2px 2px 6px #252525;
+    background: var(--lightBackground);
+}
 
 /*
 -----------------------

src/popup/css/popup.css

@@ -475,7 +475,14 @@ code {
     color: rgba(54, 54, 54, 0.7);
 }
 
-.memory-authors {
+.memory-item-venue {
+    font-size: 0.9rem;
+    font-weight: 300 !important;
+    margin-bottom: 4px;
+}
+
+.memory-authors,
+.memory-item-venue {
     color: rgba(41, 41, 41, 1);
 }
 #popup-authors {
@@ -585,8 +592,7 @@ code {
     border-radius: var(--round);
     cursor: pointer;
 }
-.memory-display-id,
-.memory-visits {
+.memory-display-id {
     font-size: 0.7rem;
 }
 
@@ -627,6 +633,33 @@ code {
     bottom: -5px;
     left: -2px;
 }
+.memory-item-info {
+    display: inline-flex;
+    justify-content: center;
+    align-items: center;
+    position: relative;
+    margin-left: 4px;
+    width: 1rem;
+    height: 1rem;
+}
+#popup-title-tooltip,
+.title-tooltip {
+    position: absolute;
+    background: var(--lighterBackground);
+    left: 50%;
+    transform: translateX(-50%);
+    padding: 1rem;
+    border-radius: 4px;
+    box-shadow: 2px 2px 6px #bdbdbd;
+    font-weight: 300;
+    font-size: 0.8rem;
+    z-index: 999;
+    text-align: left;
+    width: max-content;
+}
+.expand-memory-authors {
+    cursor: pointer;
+}
 
 svg.favorite {
     stroke-width: 2px !important;
@@ -864,7 +897,7 @@ button.changed {
     padding: 6px 8px;
     border-radius: var(--round);
     border: 1px solid;
-    background: var(--ligthBackground) !important;
+    background: var(--lightBackground) !important;
     font-size: 0.8rem;
 }
 #manual-website-url {

src/popup/js/handlers.js

@@ -365,7 +365,7 @@ const handlePopupKeydown = (e) => {
     if (!global.state.memoryIsOpen) {
         if (key === "a") {
             // a opens the arxiv memory
-            const focused = queryAll(document, ":focus");
+            const focused = queryAll(":focus");
             if (focused.some((el) => ["INPUT", "TEXTAREA"].includes(el.tagName))) {
                 return;
             }
@@ -474,3 +474,29 @@ const handlePopupSaveEdits = (id) => {
 const handlePopupDeletePaper = (id) => () => {
     showConfirmDeleteModal(id);
 };
+
+const showTitleTooltip = (id, isPopup) => {
+    const div = isPopup ? findEl("popup-title-tooltip") : findEl(id, ".title-tooltip");
+    style(div, "display", "block");
+};
+const hideTitleTooltip = (id, isPopup) => {
+    const div = isPopup ? findEl("popup-title-tooltip") : findEl(id, ".title-tooltip");
+    style(div, "display", "none");
+};
+
+const getHandleTitleTooltip = (func, delay, isPopup) => {
+    console.log("delay: ", delay);
+    return (e) => {
+        const id = isPopup ? global.state.currentId : eventId(e);
+        let timerId = global.state.timerIdMap.get(e.target) ?? 0;
+        clearTimeout(timerId);
+        timerId = setTimeout(() => func(id, isPopup), delay);
+        global.state.timerIdMap.set(e.target, timerId);
+    };
+};
+
+const handleExpandAuthors = (e) => {
+    const id = eventId(e);
+    const authors = findEl(id, "memory-authors");
+    setHTML(authors, cutAuthors(global.state.papers[id].author, 100000));
+};

src/popup/js/memory.js

@@ -610,7 +610,7 @@ const updatePaperTags = (id, elementId) => {
             updateTagOptions(id);
             // update the displayed tags for this paper
             updatePaperTagsHTML(id);
-            const tagEls = queryAll(findEl(id, "tag-list"), ".memory-tag");
+            const tagEls = queryAll(".memory-tag", findEl(id, "tag-list"));
             for (const el of tagEls) {
                 addListener(el, "click", handleTagClick);
             }
@@ -724,6 +724,19 @@ const displayMemoryTable = (pagination = 0) => {
     addEventToClass(".memory-tag", "click", handleTagClick);
     // Monitor form changes
     setFormChangeListener(undefined, false);
+    // show / remove title tooltip
+    addEventToClass(
+        ".memory-title",
+        "mouseenter",
+        getHandleTitleTooltip(showTitleTooltip, 1500)
+    );
+    addEventToClass(
+        ".memory-title",
+        "mouseleave",
+        getHandleTitleTooltip(hideTitleTooltip, 500)
+    );
+    // expand authorlist on click
+    addEventToClass(".expand-memory-authors", "click", handleExpandAuthors);
 
     // Put cursor at the end of the textarea's text on focus
     // (default puts the cursor at the beginning of the text)

src/popup/js/popup.js

@@ -301,7 +301,11 @@ const popupMain = async (url, is, manualTrigger = false, tab = null) => {
         // -----------------------------
         // -----  Fill Paper Data  -----
         // -----------------------------
-        setTextId("popup-paper-title", paper.title.replaceAll("\n", ""));
+        setHTML(
+            "popup-paper-title",
+            paper.title.replaceAll("\n", "") +
+                '<div id="popup-title-tooltip" style="display: none;">'
+        );
         setTextId("popup-authors", cutAuthors(paper.author, 350).replace(/({|})/g, ""));
         if (paper.codeLink) {
             setTextId("popup-code-link", paper.codeLink.replace(/^https?:\/\//, ""));
@@ -318,6 +322,7 @@ const popupMain = async (url, is, manualTrigger = false, tab = null) => {
         log("Popup paper:", paper);
         setHTML("popup-memory-edit", getPopupEditFormHTML(paper));
         setHTML("popup-copy-icons", getPopupPaperIconsHTML(paper, url, is));
+        setHTML("popup-title-tooltip", getPaperinfoTitle(paper));
         findEl(`checkFavorite--${id}`).checked = paper.favorite;
         let extraDivWidth = 0;
         for (const p of [
@@ -343,6 +348,16 @@ const popupMain = async (url, is, manualTrigger = false, tab = null) => {
         });
         setFormChangeListener(id, true);
         addListener("popup-delete-paper", "click", handlePopupDeletePaper(id));
+        addListener(
+            "popup-paper-title",
+            "mouseenter",
+            getHandleTitleTooltip(showTitleTooltip, 1500, true)
+        );
+        addListener(
+            "popup-paper-title",
+            "mouseleave",
+            getHandleTitleTooltip(hideTitleTooltip, 500, true)
+        );
 
         // ------------------------
         // -----  SVG clicks  -----