☰

Pinboard - Specific Tag Emboldener

Makes tags which match specific criteria stand out better in Pinboard.

当前为 2021-02-23 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name Pinboard - Specific Tag Emboldener
  3. // @description Makes tags which match specific criteria stand out better in Pinboard.
  4. // @include http://pinboard.in/*
  5. // @include http://www.pinboard.in/*
  6. // @include https://pinboard.in/*
  7. // @include https://www.pinboard.in/*
  8. // @grant GM_addStyle
  9. // @author original script by murklins, updated by mkp
  10. // @version 0.0.1.20210223015129
  11. // @namespace https://greasyfork.org/users/396532
  12. // ==/UserScript==
  13.  
  14. var main_node = document.getElementById("pinboard");
  15. if (main_node) {
  16.   // get all the bookmarks
  17.   var tagAnchors = document.evaluate("//div[contains(@class, 'bookmark')]/div[@class = 'display']/a[@class = 'tag']", 
  18.                                   main_node, 
  19.                                   null,
  20.                                   XPathResult.ORDERED_NODE_SNAPSHOT_TYPE,
  21.                                   null);
  22.  
  23.   for (var i = 0; i < tagAnchors.snapshotLength; i++) {     
  24. // assign tags to specific tag classes based on the tag's composition 
  25. // note: script as written parses the tags looking for the keyword(s) anywhere within the text of the tag
  26.     var tagA = tagAnchors.snapshotItem(i);   
  27.     if (tagA.innerHTML.indexOf("relationship") != -1) {
  28.       tagA.className = tagA.className + " gm_relationship_tag";
  29.     }else if (tagA.innerHTML.indexOf("fandom") != -1) {
  30.       tagA.className = tagA.className + " gm_fandom_tag";
  31.     }else if (tagA.innerHTML.indexOf("warning") != -1) {
  32.       tagA.className = tagA.className + " gm_warning_tag";
  33.     }
  34.   }
  35. }
  36. // format tags based on their assigned tag class
  37. // you can change font color, font style, and/or even highlight the tag with a specific color
  38. GM_addStyle(
  39.   "a.gm_relationship_tag { font-weight: bold}" +
  40.   "a.gm_fandom_tag { color: #1d085f; font-weight: bold; }" +
  41.   "a.gm_warning_tag { color: #a3031e;}"
  42. );
  43.  
  44.  
  45. /* /////////////////////////////////////
  46.  
  47. // the following is the same code for parsing tags in a more template-like format
  48.  
  49.     var tagA = tagAnchors.snapshotItem(i);   
  50.     if (tagA.innerHTML.indexOf("KEYWORD") != -1) {
  51.       tagA.className = tagA.className + " gm_KEYWORD_tag";
  52.     }
  53.   }
  54. }
  55.  
  56.  
  57.  
  58. // to create more than one tag class / use more than one keyword, use 'else if'
  59.  
  60.     var tagA = tagAnchors.snapshotItem(i);   
  61.     if (tagA.innerHTML.indexOf("KEYWORD1") != -1) {
  62.       tagA.className = tagA.className + " gm_KEYWORD1_tag";
  63. 	}else if (tagA.innerHTML.indexOf("KEYWORD2") != -1) {
  64.       tagA.className = tagA.className + " gm_KEYWORD2_tag";  
  65.     }
  66.   }
  67. }
  68.  
  69.  
  70. // the following is the same code for formatting tags in a more template-like format
  71.  
  72. //// bold text for a given tag class
  73.  
  74. GM_addStyle(
  75.   "a.gm_KEYWORD_tag { font-weight: bold;}" 
  76.  
  77.  
  78. //// change text color for a given tag class  
  79.  
  80. GM_addStyle(
  81.   "a.gm_KEYWORD_tag { color:#800;}"   
  82.   
  83. //// highlight text of a given tag class with a specific color
  84. /////// you can use hex codes or css-supported color names
  85.  
  86. GM_addStyle(
  87.   "a.gm_KEYWORD_tag { background-color: blue;}"   
  88.   
  89. */  
  90.   
  91.   
  92.   
  93.   
  94.   
  95.