☰

Notion 页面字数统计

统计当前页面的字数。

  1. // ==UserScript==
  2. // @name         Notion Page Words Counter
  3. // @name:zh-CN   Notion 页面字数统计
  4. // @namespace    https://notion.cx/
  5. // @version      0.1.0
  6. // @description  Count current page words.
  7. // @description:zh-cn 统计当前页面的字数。
  8. // @author       Ruter Lü
  9. // @match        https://www.notion.so/*
  10. // @grant        none
  11. // ==/UserScript==
  12.  
  13. (function() {
  14.     'use strict';
  15.  
  16.     /* Helper function to wait for the element ready */
  17.     const waitFor = (...selectors) => new Promise(resolve => {
  18.         const delay = 500;
  19.         const f = () => {
  20.             const elements = selectors.map(selector => document.querySelector(selector));
  21.             if (elements.every(element => element != null)) {
  22.                 resolve(elements);
  23.             } else {
  24.                 setTimeout(f, delay);
  25.             }
  26.         }
  27.         f();
  28.     });
  29.     /* Helper function to wait for the element ready */
  30.  
  31.     /* Word Count Function */
  32.     let pattern = /[a-zA-Z0-9_\u0392-\u03c9\u00c0-\u00ff\u0600-\u06ff\u0400-\u04ff]+|[\u4e00-\u9fff\u3400-\u4dbf\uf900-\ufaff\u3040-\u309f\uac00-\ud7af]+/g;
  33.  
  34.     function wordCount(str) {
  35.         let m = str.match(pattern);
  36.         let count = 0;
  37.         if (!m) {
  38.             return 0;
  39.         }
  40.         for (let i = 0; i < m.length; i++) {
  41.             if (m[i].charCodeAt(0) >= 0x4e00) {
  42.                 count += m[i].length;
  43.             } else {
  44.                 count += 1;
  45.             }
  46.         }
  47.         return count;
  48.     };
  49.     /* Word Count Function */
  50.  
  51.     /* Word Count Element */
  52.     const countCss = '-webkit-user-select: none; cursor: auto; position: absolute; display: flex; align-items: center; justify-content: center; bottom: 0px; right: 32px; height: 32px; font-size: 12px; z-index: 100; opacity: 1; background-position: initial initial; background-repeat: initial initial;';
  53.     const countEl = document.createElement('div');
  54.     countEl.setAttribute('class', 'notion-word-count');
  55.     countEl.style.cssText = countCss;
  56.     countEl.innerHTML = 'Word count: <span class="notion-word-counter">0</span>';
  57.     /* Word Count Element */
  58.  
  59.     /* Word Count Observer */
  60.     let isCounterSet = false;
  61.     let oldHref = '';
  62.     let callback = function(mutations) {
  63.         if (oldHref != document.location.href) {
  64.             oldHref = document.location.href;
  65.             const pageObserver = new MutationObserver(() => {
  66.                 const firstContent = document.querySelector('div.notion-page-content');
  67.                 // Whether if the word count element was set
  68.                 if (firstContent) {
  69.                     if (!isCounterSet) {
  70.                         isCounterSet = true;
  71.                         const helpBtn = document.querySelector('div.notion-help-button');
  72.                         helpBtn.after(countEl);
  73.                     }
  74.                     countEl.children[0].innerText = wordCount(firstContent.innerText);
  75.                 }
  76.             });
  77.             waitFor('div.notion-page-content').then(([el]) => {
  78.                 let pageContent = document.querySelector('div.notion-page-content');
  79.                 pageObserver.observe(pageContent, { childList: true, subtree: true, characterData: true });
  80.             });
  81.         }
  82.     };
  83.     const observer = new MutationObserver(callback);
  84.     // Start observe
  85.     waitFor('div.notion-page-content').then(([el]) => {
  86.         // let pageContent = document.querySelector('div.notion-page-content');
  87.         let notionApp = document.getElementById('notion-app');
  88.         const config = { childList: true, subtree: true };
  89.         observer.observe(notionApp, config);
  90.     });
  91.     /* Word Count Observer */
  92. })();