JPDB Show Pitch In Review Question

6/12/2024, 6:06:28 PM

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

You will need to install an extension such as Tampermonkey to install this script.

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

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

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

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

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

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

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

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

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

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

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

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

// ==UserScript==
// @name        JPDB Show Pitch In Review Question
// @namespace   JPDB_Show_Pitch_In_Review_Question
// @match       https://jpdb.io/review*
// @grant       none
// @version     0.01
// @author      Flipp Fuzz
// @description 6/12/2024, 6:06:28 PM
// @run-at      document-idle
// @license MIT
// ==/UserScript==

(function() {
  'use strict';
  // Handling of answer is copied from https://greatest.deepsurf.us/en/scripts/459772-jpdb-auto-reveal-answer-sentence/code
  // -こう- implemented the switch from question to answer without really navigating
  // by simply replacing the content and location.href on clicking the "show answer" button
  window.onload = observeUrlChange(addPitchToQuestion);

  // this handles refreshing the page while on the answer screen
  addPitchToQuestion();
})();

function observeUrlChange(onChange) {
  let oldHref = document.location.href;
  const body = document.querySelector("body");
  const observer = new MutationObserver(mutations => {
    mutations.forEach(() => {
      if (oldHref !== document.location.href) {
        oldHref = document.location.href;
        onChange();
      }
    });
  });
  observer.observe(body, { childList: true, subtree: true });
}

function addPitchToQuestion() {
  if(new URL(location.href).searchParams.get('c')) {
    let pitchSearchResults = document.querySelectorAll('body > div.container.bugfix > div > div.review-reveal > div.result.vocabulary > div > div.subsection-pitch-accent > div > div > div > div');
    let insertAfterElement = document.querySelector('body > div.container.bugfix > div > div.review-reveal > div.answer-box > div.plain > a');

    if(!pitchSearchResults || pitchSearchResults.length == 0 || !insertAfterElement) {
      console.log(`pitchSearchResults: ${pitchSearchResults}`);
      console.log(`insertAfterElement: ${insertAfterElement}`);
      return;
    }

    // Create a div to add our new pitches into
    let containerDiv = document.createElement("div");
    containerDiv.setAttribute('class', 'answer-pitch-container');
    containerDiv.style.fontSize = "50%";
    containerDiv.style.paddingLeft = "5px";
    insertAfterElement.insertAdjacentElement('afterend', containerDiv);

    pitchSearchResults.forEach(pitch => {
        containerDiv.appendChild(pitch.cloneNode(true));
    });
  }
}