Notion Word Count

Display a simple word counter in Notion

이 스크립트를 설치하려면 Tampermonkey, Greasemonkey 또는 Violentmonkey와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 Tampermonkey와 같은 확장 프로그램을 설치해야 합니다.

이 스크립트를 설치하려면 Tampermonkey 또는 Violentmonkey와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 Tampermonkey 또는 Userscripts와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 Tampermonkey와 같은 확장 프로그램이 필요합니다.

이 스크립트를 설치하려면 유저 스크립트 관리자 확장 프로그램이 필요합니다.

(이미 유저 스크립트 관리자가 설치되어 있습니다. 설치를 진행합니다!)

이 스타일을 설치하려면 Stylus와 같은 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 Stylus와 같은 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 Stylus와 같은 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 유저 스타일 관리자 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 유저 스타일 관리자 확장 프로그램이 필요합니다.

이 스타일을 설치하려면 유저 스타일 관리자 확장 프로그램이 필요합니다.

(이미 유저 스타일 관리자가 설치되어 있습니다. 설치를 진행합니다!)

// ==UserScript==
// @name         Notion Word Count
// @namespace    elddc
// @version      1.4
// @description  Display a simple word counter in Notion
// @author       Elddc
// @match        https://www.notion.so/*
// @icon         https://www.notion.so/front-static/favicon.ico
// @grant        none
// ==/UserScript==

//styling: modify as desired
const styles = document.createElement('style');
styles.innerHTML = `
.word-count {
  z-index: 500;
  position: absolute;
  bottom: 5px;
  right: 16px;
  font: 16px ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, "Apple Color Emoji", Arial, sans-serif, "Segoe UI Emoji", "Segoe UI Symbol";
}
.notion-help-button {
  bottom: 30px !important;
}
`;
document.head.appendChild(styles);

//create + insert word count element
const wordCount = document.createElement('span');
wordCount.classList.add('word-count');
document.body.appendChild(wordCount);

//fill word count element
function updateWordCount () {
    try {
        let count = document.querySelector('.notion-page-content').innerText.match(/[^\s]+/g).length;
        wordCount.innerText = `${count} word${count === 1 ? '' : 's'}`;
    } catch (err) {
        console.log('No content detected. Are you on a database page?'); //some pages do not have .notion-page-content
        wordCount.innerText = '';
    }
}

// updates word count 250ms after last key press or click
const debouncedUpdateWordCount = debounce(updateWordCount, 250);
window.addEventListener('keyup', debouncedUpdateWordCount);
window.addEventListener('click', debouncedUpdateWordCount);
setTimeout(updateWordCount, 250); //initial word count

//update word count after navigation between pages
var pushState = history.pushState;
history.pushState = function () {
    pushState.apply(history, arguments);
    setTimeout(updateWordCount, 250);
};


//helper function
//minified from https://github.com/component/debounce
function debounce(l,n,u){var e,i,t,o,f;if(null==n)n=100;function a(){var r=Date.now()-o;if(r<n&&r>=0){e=setTimeout(a,n-r)}else{e=null;if(!u){f=l.apply(t,i);t=i=null}}}var r=function(){t=this;i=arguments;o=Date.now();var r=u&&!e;if(!e)e=setTimeout(a,n);if(r){f=l.apply(t,i);t=i=null}return f};r.clear=function(){if(e){clearTimeout(e);e=null}};r.flush=function(){if(e){f=l.apply(t,i);t=i=null;clearTimeout(e);e=null}};return r}