JanitorAI Token Filter

Filters character cards on JanitorAI by token count

当前为 2025-04-09 提交的版本,查看 最新版本

  1. // ==UserScript==
  2. // @name JanitorAI Token Filter
  3. // @namespace http://tampermonkey.net/
  4. // @version 0.21
  5. // @description Filters character cards on JanitorAI by token count
  6. // @author Fefnik
  7. // @match https://janitorai.com/*
  8. // @grant none
  9. // ==/UserScript==
  10.  
  11. (function() {
  12. 'use strict';
  13.  
  14. let MIN_TOKENS = 500;
  15. let sliderElement = null;
  16.  
  17. function parseTokens(tokenText) {
  18. try {
  19. let cleanText = tokenText.replace(/<!--[\s\S]*?-->/g, '').replace('tokens', '').trim();
  20. if (cleanText.includes('k')) {
  21. return parseFloat(cleanText.replace('k', '')) * 1000;
  22. }
  23. return parseInt(cleanText, 10) || 0;
  24. } catch (error) {
  25. return 0;
  26. }
  27. }
  28.  
  29. function filterCards() {
  30. // Selector for main page cards
  31. const mainPageCards = document.querySelectorAll('.chakra-stack.css-1s5evre');
  32. mainPageCards.forEach(card => {
  33. const tokenElement = card.querySelector('.chakra-text.css-jccmq6');
  34. if (!tokenElement) return;
  35.  
  36. const tokenCount = parseTokens(tokenElement.textContent);
  37. const parentContainer = card.closest('.css-1sxhvxh');
  38. if (parentContainer) {
  39. parentContainer.style.display = tokenCount < MIN_TOKENS ? 'none' : '';
  40. }
  41. });
  42.  
  43. // Selector for search page cards
  44. const searchPageCards = document.querySelectorAll('.chakra-stack.css-1s5evre, .css-1s5evre');
  45. searchPageCards.forEach(card => {
  46. const tokenElement = card.querySelector('.chakra-text.css-jccmq6, .css-jccmq6');
  47. if (!tokenElement) return;
  48.  
  49. const tokenCount = parseTokens(tokenElement.textContent);
  50. const parentContainer = card.closest('.css-1sxhvxh, .css-1dbw1r8');
  51. if (parentContainer) {
  52. parentContainer.style.display = tokenCount < MIN_TOKENS ? 'none' : '';
  53. }
  54. });
  55. }
  56.  
  57. function createOrUpdateSlider() {
  58. if (!sliderElement) {
  59. const sliderContainer = document.createElement('div');
  60. sliderContainer.id = 'token-filter-container';
  61. sliderContainer.style.position = 'fixed';
  62. sliderContainer.style.top = '50px';
  63. sliderContainer.style.left = '0px';
  64. sliderContainer.style.zIndex = '99999';
  65. sliderContainer.style.display = 'flex';
  66. sliderContainer.style.flexDirection = 'column';
  67. sliderContainer.style.alignItems = 'center';
  68. sliderContainer.style.height = '150px';
  69. sliderContainer.style.width = '50px';
  70.  
  71. const sliderWrapper = document.createElement('div');
  72. sliderWrapper.style.width = '100px';
  73. sliderWrapper.style.height = '10px';
  74. sliderWrapper.style.transform = 'rotate(-90deg)';
  75. sliderWrapper.style.transformOrigin = 'center center';
  76. sliderWrapper.style.marginTop = '10px';
  77.  
  78. sliderElement = document.createElement('input');
  79. sliderElement.type = 'range';
  80. sliderElement.id = 'token-filter-slider';
  81. sliderElement.min = '0';
  82. sliderElement.max = '6000';
  83. sliderElement.step = '100';
  84. sliderElement.value = MIN_TOKENS;
  85. sliderElement.style.width = '100%';
  86. sliderElement.style.height = '20px';
  87. sliderElement.style.backgroundColor = '#4a4a4a';
  88. sliderElement.style.cursor = 'pointer';
  89. sliderElement.style.appearance = 'none';
  90. sliderElement.style.outline = 'none';
  91. sliderElement.style.borderRadius = '5px';
  92.  
  93. const style = document.createElement('style');
  94. style.textContent = `
  95. #token-filter-slider::-webkit-slider-thumb {
  96. -webkit-appearance: none;
  97. appearance: none;
  98. width: 20px;
  99. height: 20px;
  100. background: #ffffff;
  101. cursor: pointer;
  102. border-radius: 50%;
  103. border: 2px solid #000;
  104. }
  105. #token-filter-slider::-moz-range-thumb {
  106. width: 20px;
  107. height: 20px;
  108. background: #ffffff;
  109. cursor: pointer;
  110. border-radius: 50%;
  111. border: 2px solid #000;
  112. }
  113. `;
  114. document.head.appendChild(style);
  115.  
  116. const label = document.createElement('span');
  117. label.id = 'token-filter-label';
  118. label.style.color = '#fff';
  119. label.style.fontSize = '12px';
  120. label.style.textAlign = 'center';
  121. label.style.marginTop = '50px';
  122. label.textContent = `${MIN_TOKENS} tokens`;
  123.  
  124. sliderElement.addEventListener('input', (e) => {
  125. MIN_TOKENS = parseInt(e.target.value);
  126. label.textContent = `${MIN_TOKENS} tokens`;
  127. filterCards();
  128. });
  129.  
  130. sliderWrapper.appendChild(sliderElement);
  131. sliderContainer.appendChild(sliderWrapper);
  132. sliderContainer.appendChild(label);
  133.  
  134. const appendSlider = () => {
  135. if (document.body) {
  136. document.body.appendChild(sliderContainer);
  137. } else {
  138. setTimeout(appendSlider, 500);
  139. }
  140. };
  141. appendSlider();
  142. }
  143.  
  144. const container = document.getElementById('token-filter-container');
  145. if (container) {
  146. // Show slider on both main page (/) and search page (/search)
  147. const isVisible = window.location.pathname === '/' || window.location.pathname === '/search';
  148. container.style.display = isVisible ? 'flex' : 'none';
  149. }
  150. }
  151.  
  152. function initialize() {
  153. createOrUpdateSlider();
  154. if (window.location.pathname === '/' || window.location.pathname === '/search') {
  155. filterCards();
  156. }
  157. }
  158.  
  159. const tryInitialize = () => {
  160. if (document.body) {
  161. initialize();
  162.  
  163. let lastPath = window.location.pathname;
  164. const checkPath = () => {
  165. if (lastPath !== window.location.pathname) {
  166. lastPath = window.location.pathname;
  167. createOrUpdateSlider();
  168. if (lastPath === '/' || lastPath === '/search') {
  169. filterCards();
  170. }
  171. }
  172. };
  173.  
  174. setInterval(checkPath, 500);
  175.  
  176. const observer = new MutationObserver(() => {
  177. if (window.location.pathname === '/' || window.location.pathname === '/search') {
  178. setTimeout(filterCards, 500);
  179. }
  180. });
  181. observer.observe(document.body, { childList: true, subtree: true });
  182. } else {
  183. setTimeout(tryInitialize, 1000);
  184. }
  185. };
  186.  
  187. tryInitialize();
  188. })();