HPMOR Footnote

Footnote support

  1. // ==UserScript==
  2. // @name HPMOR Footnote
  3. // @namespace http://youmu.moe/
  4. // @version 0.3
  5. // @description Footnote support
  6. // @author Shuhao Tan
  7. // @match http://hpmor.lofter.com/post/*
  8. // @grant none
  9. // ==/UserScript==
  10.  
  11. (function() {
  12. 'use strict';
  13.  
  14. function findFootnotenodes(id) {
  15. var xpath_finder;
  16. var elems = [];
  17. var i;
  18. xpath_finder = document.evaluate('//p[contains(.,"[' + id + ']")]', document, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE);
  19. for(i = 0; i < xpath_finder.snapshotLength; i++) {
  20. elems.push(xpath_finder.snapshotItem(i));
  21. }
  22. xpath_finder = document.evaluate('//p[contains(.,"[' + id + ']")]', document, null, XPathResult.ORDERED_NODE_SNAPSHOT_TYPE);
  23. for(i = 0; i < xpath_finder.snapshotLength; i++) {
  24. elems.push(xpath_finder.snapshotItem(i));
  25. }
  26. return elems;
  27. }
  28.  
  29. function findFootnodeStart() {
  30. var elems;
  31. var i;
  32. elems = findFootnotenodes(1);
  33. if(elems.length === 0) {
  34. return null;
  35. }
  36. for(i = 0; i < elems.length; i++) {
  37. if(elems[i].textContent.match(/^\s*[\[[]1[]\]]/i)) {
  38. return elems[i];
  39. }
  40. }
  41. }
  42.  
  43. function isFootnote(elem) {
  44. return elem && elem.textContent.match(/^\s*[\[[]\d+[]\]]/i);
  45. }
  46.  
  47. function generateFootnote(elem) {
  48. var id = elem.textContent.match(/^\s*[\[[](\d+)[]\]]/i)[1];
  49. var pattern = "([\\[[]" + id + "[]\\]])";
  50. var regex = new RegExp(pattern, 'g');
  51. var elems = findFootnotenodes(id);
  52. var foottext = elem.textContent.replace('"', '&quot;').replace(/^\s*[\[[]\d+[]\]]/i, '');
  53. var i;
  54. elem.setAttribute('id', 'footnote_' + id);
  55. for(i = 0; i < elems.length; i++) {
  56. if(elems[i] != elem) {
  57. elems[i].innerHTML = elems[i].innerHTML.replace(regex, '<a footnote="' + foottext + '" class="body_footnote" href="#footnote_' + id + '">$1</a>');
  58. }
  59. }
  60. }
  61.  
  62. var elem = findFootnodeStart();
  63. if(!elem) {
  64. return;
  65. }
  66. while(isFootnote(elem)) {
  67. generateFootnote(elem);
  68. elem = elem.nextElementSibling;
  69. }
  70.  
  71. function addGlobalStyle(css) {
  72. var head, style;
  73. head = document.getElementsByTagName('head')[0];
  74. if (!head) { return; }
  75. style = document.createElement('style');
  76. style.type = 'text/css';
  77. style.innerHTML = css;
  78. head.appendChild(style);
  79. }
  80.  
  81. addGlobalStyle('a.body_footnote { width:auto; position:relative; }');
  82. addGlobalStyle('a.body_footnote::after {line-height: 1.3em; opacity: 0; transition: opacity linear 150ms; border-radius: 3px; background: #444; width: 300px; color: #ccc; content: attr(footnote);padding: 5px;left: -5px;top: 100%; margin-top: 7px; position: absolute;z-index: 1;pointer-events: none;word-wrap: break-word; }');
  83. addGlobalStyle('a.body_footnote:hover::after, a.body_footnote:hover::before {opacity: 1;}');
  84. addGlobalStyle('a.body_footnote::before {opacity: 0; transition: opacity linear 150ms;width: 0;height: 0;border: solid;border-color:#444 transparent;border-width:0 6px 6px 6px;left: 3px;margin-top: 1px; content: "";top: 100%;position: absolute;z-index: 1;pointer-events: none;');
  85. })();

QingJ © 2025

镜像随时可能失效,请加Q群300939539或关注我们的公众号极客氢云获取最新地址