☰

Copy HTML to Anki

Copy specific parts of HTML text and send them to Anki, converting relative URLs to absolute URLs. Trigger with Ctrl+Shift+Y or via Tampermonkey menu.

当前为 2024-11-07 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name         Copy HTML to Anki
  3. // @namespace    http://tampermonkey.net/
  4. // @version      4.80
  5. // @description  Copy specific parts of HTML text and send them to Anki, converting relative URLs to absolute URLs. Trigger with Ctrl+Shift+Y or via Tampermonkey menu.
  6. // @author       nabe
  7. // @match        *://*/*
  8. // @grant        GM_xmlhttpRequest
  9. // @grant        GM_registerMenuCommand
  10. // @connect      localhost
  11. // @run-at       document-end
  12. // @license MIT
  13. // ==/UserScript==
  14.  
  15. (function() {
  16.     'use strict';
  17.  
  18.     function copyHtmlToAnki(generateRandomID = false) {
  19.         // Function to convert relative URLs to absolute URLs
  20.         function makeAbsolute(url) {
  21.             return new URL(url, document.baseURI).href;
  22.         }
  23.  
  24.  
  25.         // Function to generate a random string of numbers
  26.         function generateRandomString(length) {
  27.             let result = '';
  28.             const characters = '0123456789';
  29.             for (let i = 0; i < length; i++) {
  30.                 result += characters.charAt(Math.floor(Math.random() * characters.length));
  31.             }
  32.             return result;
  33.         }
  34.  
  35.         // Clone the document to manipulate it
  36.         let docClone = document.documentElement.cloneNode(true);
  37.  
  38.         // Convert all relative URLs to absolute URLs
  39.         let elements = docClone.querySelectorAll('[src], [href]');
  40.         elements.forEach(function(element) {
  41.             if (element.hasAttribute('src')) {
  42.                 element.setAttribute('src', makeAbsolute(element.getAttribute('src')));
  43.             }
  44.             if (element.hasAttribute('href')) {
  45.                 element.setAttribute('href', makeAbsolute(element.getAttribute('href')));
  46.             }
  47.         });
  48.  
  49.         // Extract the text content of specific parts needed
  50.         let frontElement = docClone.querySelector('.container.card');
  51.         let frontField = frontElement ? frontElement.innerHTML : '';
  52.         let frontFieldText = frontElement ? frontElement.textContent.trim() : '';
  53.         console.log("Front Field:", frontField);
  54.         
  55.         // Capture image URLs specifically within elements with class "group img"
  56.         let imageUrls = Array.from(frontElement.querySelectorAll('.group.img img'))
  57.             .map(img => img.getAttribute('src'))
  58.             .filter(src => src && !src.includes('.svg') && src !== 'Front Image');
  59.  
  60.         console.log("Image URLs:", imageUrls);
  61.  
  62.         //Capture content from .photo-question
  63.         let photoQuestionElement = docClone.querySelector('.solution.container .photo-question');
  64.         let photoQuestion = photoQuestionElement ? photoQuestionElement.outerHTML : '';
  65.         console.log("Photo Question HTML:", photoQuestion);
  66.  
  67.         let questionField = docClone.querySelector('form.question h3')?.innerText.trim() || '';
  68.         console.log("Question Field:", questionField);
  69.  
  70.         let optionField = Array.from(docClone.querySelectorAll('.options .option'))
  71.                              .map(option => option.innerText.trim())
  72.                              .filter(text => text)
  73.                              .map(text => `<li>${text}</lis>`)
  74.                              .join('') || '';
  75.         console.log("Option Field:", optionField);
  76.  
  77.         let backField = Array.from(docClone.querySelectorAll('.options .option.correct'))
  78.                                .map(option => option.innerText.trim())
  79.                                .filter(text => text)
  80.                                .map(text => `<li>${text}</li>`)
  81.                                .join('') || '';
  82.         console.log("Answer Field:", backField);
  83.  
  84.         //let extraField = docClone.querySelector('.results.container.collected .feedback-container .text')?.innerText.trim() || '';
  85.         //console.log("Additional Info Field:", extraField);
  86.         let extraElement = docClone.querySelector('.results.container.collected .feedback-container .text');
  87.         let extraField = extraElement ? extraElement.innerHTML : '';
  88.         let extraFieldText = docClone.querySelector('.results.container.collected .feedback-container .text')?.innerText.trim() || '';
  89.         console.log("Additional Info Field:", extraField);
  90.  
  91.         let webpageURL = window.location.href;
  92.         console.log("Tag:", webpageURL);
  93.         
  94.         // Generate uniqueID
  95.         let uniqueID = generateRandomID ? generateRandomString(10) : questionField.concat(backField).concat(extraField).concat(photoQuestion);
  96.  
  97.  
  98.         // Create the note fields
  99.         let noteFields = {
  100.             "Front": frontField.concat("<br>").concat(photoQuestion),
  101.             "Question": questionField,
  102.             "Options": '<div class="psol">'.concat(optionField).concat("</div>"),
  103.             "Back": '<div class="psol">'.concat(backField).concat("</div>"),
  104.             "Feedback": extraFieldText,
  105.             "Extra": extraField,
  106.             "Link": "<a href=".concat(webpageURL).concat(">Link To Card</a>"),
  107.             "UniqueID": uniqueID,
  108.             "Front Image": imageUrls.join('<br>')
  109.         };
  110.  
  111.         console.log("Note fields to be sent to Anki:", noteFields);
  112.  
  113.         GM_xmlhttpRequest({
  114.             method: "POST",
  115.             url: "http://localhost:8765",
  116.             data: JSON.stringify({
  117.                 "action": "addNote",
  118.                 "version": 6,
  119.                 "params": {
  120.                     "note": {
  121.                         "deckName": "Default",
  122.                         "modelName": "uofcCard",
  123.                         "fields": noteFields,
  124.                         "tags": [webpageURL]
  125.                     }
  126.                 }
  127.             }),
  128.             headers: {
  129.                 "Content-Type": "application/json"
  130.             },
  131.             onload: function(response) {
  132.                 console.log("Response from AnkiConnect:", response);
  133.                 if (response.status === 200) {
  134.                     console.log("Note fields sent to Anki successfully!");
  135.                 } else {
  136.                     console.error("Failed to send note fields to Anki.");
  137.                 }
  138.             }
  139.         });
  140.     }
  141.  
  142.     // Add event listener for the keyboard shortcut (Ctrl+Shift+Y)
  143.     document.addEventListener('keydown', function(event) {
  144.         if (event.ctrlKey && event.shiftKey && event.code === 'KeyY') {
  145.             copyHtmlToAnki();
  146.         }
  147.     });
  148.  
  149.     // Register the menu command to Tampermonkey menu
  150.     GM_registerMenuCommand("Copy HTML to Anki", function() { copyHtmlToAnki(false); });
  151.     GM_registerMenuCommand("Copy HTML to Anki with Random ID", function() { copyHtmlToAnki(true); });
  152. })();