log_coverage.user.js

// ==UserScript==
// @name        Logarithmic Coverage
// @namespace   Violentmonkey Scripts
// @match       https://jpdb.io/learn
// @match       https://jpdb.io/deck-list
// @grant       none
// @version     1.2
// @author      hmry
// @description 5/19/2022, 5:29:17 PM
// ==/UserScript==

const log101 = Math.log(101);

function log(x) {
    if (isNaN(x))
        return 0;
    
    const linearWidth = parseInt(x);
    return 100 * (log101 - Math.log(100 - linearWidth + 1)) / log101;    
}

for (const deckBody of document.querySelectorAll('.deck-body div')) {
    if (deckBody.childNodes[0]?.nodeValue !== 'Coverage')
        continue;
  
    const barContainer = deckBody.parentElement.nextElementSibling;
    
    const knownSegment = barContainer.querySelector('div[style*="background: var(--progress-bar-in-progress)"]'),
          learnSegment = barContainer.querySelector('div[style*="background: var(--progress-bar-foreground)"]'),
          targetCoverage = barContainer.querySelector('div[style*="background-color: var(--progress-bar-target-coverage)"]'),
          tooltips = barContainer.querySelectorAll('.tooltip');
    
    const knownWidth = log(parseInt(knownSegment?.style?.width)),
          learnWidth = log(parseInt(learnSegment?.style?.width)),
          targetLeft = log(parseInt(targetCoverage?.style?.left));
    
  
    if (knownSegment) knownSegment.style.width = `${knownWidth}%`;
    if (learnSegment) learnSegment.style.width = `${learnWidth}%`;
    if (targetCoverage) targetCoverage.style.left = `${targetLeft}%`;
    if (tooltips[0]) tooltips[0].style.width = `${knownWidth}%`;
    if (tooltips[1]) tooltips[1].style.width = `${learnWidth - knownWidth}%`;
    if (tooltips[2]) tooltips[2].style.width = `${100 - learnWidth}%`;
}