☰

Greasy Fork is available in English.

AO3 Browsing Notes

Userscript for notes that appear next to works when you're browsing AO3

Od 07.03.2021.. Pogledajte najnovija verzija.

  1. // ==UserScript==
  2. // @name        AO3 Browsing Notes
  3. // @description Userscript for notes that appear next to works when you're browsing AO3
  4. // @include     *://archiveofourown.org/tags/*/works*
  5. // @include     *://archiveofourown.org/collections/*/works*
  6. // @include     *://archiveofourown.org/works?*
  7. // @include     *://archiveofourown.org/users/*/works*
  8. // @include     *://archiveofourown.org/works/search?*
  9. // @namespace   https://greasyfork.org/en/scripts/422830-ao3-browsing-notes
  10. // @version     0.2
  11. // @run-at      document-end
  12. // @grant       GM.getValue
  13. // @grant       GM.setValue
  14.  
  15. // ==/UserScript==
  16.  
  17.  
  18. 'use strict';
  19.  
  20. const createElem = (elemType, idName, workID, clsName, text = "") => {
  21.     const elem = document.createElement(elemType)
  22.     elem.setAttribute("work-id", workID)
  23.     elem.id = idName
  24.     elem.className = clsName
  25.     elem.textContent = text
  26.     return elem
  27. }
  28.  
  29.  
  30. const createAddBtn = workID => {
  31.     const addChangeNote = async () => {
  32.  
  33.         const displayDiv = document.querySelector(`#displayDiv${workID}`)
  34.         const noteTextarea = document.querySelector(`#noteTextarea${workID}`)
  35.         const addBtn = document.querySelector(`#addBtn${workID}`)
  36.         if(noteTextarea.style.display === "none"){
  37.             noteTextarea.style.display = "block"
  38.             displayDiv.style.display = "none"
  39.             noteTextarea.value = displayDiv.textContent
  40.             addBtn.textContent = "Save Note"
  41.         }else {
  42.             noteTextarea.style.display = "none"
  43.             displayDiv.style.display = "block"
  44.             displayDiv.textContent = noteTextarea.value
  45.             await GM.setValue(workID, noteTextarea.value)
  46.             addBtn.textContent = "Add/Edit Note"
  47.         }
  48.     }
  49.     const newBtn = createElem("button", `addBtn${workID}`, workID, "ao3-note-btn", "Add/Edit Note")
  50.     newBtn.addEventListener("click", addChangeNote)
  51.     return newBtn
  52. }
  53.  
  54. const createNoteTextarea = (workID, text) => {
  55.     const noteTextarea = createElem("textarea", `noteTextarea${workID}`, workID, "ao3-note-textarea", text)
  56.     noteTextarea.style.display = "none"
  57.     return noteTextarea
  58. }
  59.  
  60. const createButtonDiv = workID => {
  61.     const btnDiv = createElem("div", `btnDiv${workID}`, workID, "ao3-note-div ao3-note-btn-div", undefined)
  62.     btnDiv.appendChild(createAddBtn(workID))
  63.     return btnDiv
  64. }
  65.  
  66. const createTextDisplayDiv = (workID, text) => {
  67.     return createElem("div", `displayDiv${workID}`, workID, "ao3-note-div ao3-note-display-div", text)
  68. }
  69.  
  70. const createOuterDiv = (workID, text) => {
  71.     const outerDiv = createElem("div", `outerDiv${workID}`, workID, "ao3-note-div ao3-note-outer-div", undefined)
  72.     outerDiv.style.backgroundColor = "#ECECEC"
  73.     outerDiv.style.border = "thin solid #000000"
  74.     outerDiv.appendChild(createButtonDiv(workID))
  75.     outerDiv.appendChild(createTextDisplayDiv(workID, text))
  76.     outerDiv.appendChild(createNoteTextarea(workID, text))
  77.     return outerDiv
  78. }
  79.  
  80. const createFullDisplay = async () => {
  81.     const worksList = document.querySelectorAll("li.work.blurb.group")
  82.     for(let work of worksList){
  83.         const summary = work.querySelector("blockquote.userstuff.summary")
  84.         const workID = work.id
  85.         const storedText = await GM.getValue(workID, "")
  86.         summary.appendChild(createOuterDiv(workID, storedText))
  87.     }
  88. }
  89.  
  90. createFullDisplay()