Apple Developer Documentation - UI Cleanup

Make the Apple Developer Documentation more user friendly with links to each subsection

이 스크립트를 설치하려면 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         Apple Developer Documentation - UI Cleanup
// @namespace    https://www.raisen.dev/
// @version      0.1
// @description  Make the Apple Developer Documentation more user friendly with links to each subsection
// @author       Raisen
// @match        https://developer.apple.com/documentation/*
// @grant        none
// ==/UserScript==

(function() {
    'use strict';

var origPushState = history.pushState;

var numTriesChangeHeader = 0;
function changeHeader() {
    const retryOrLeave = () => {
        if(numTriesChangeHeader++ < 3) {
            return window.setTimeout(changeHeader, 1000);
        }
    }
    const currentItem = document.querySelector('.current.item');
    if(!currentItem) return retryOrLeave();

    currentItem.style.cursor = 'pointer';
    currentItem.addEventListener('click', e => {
        e.preventDefault();
        e.stopPropagation();
        window.scrollTo(0,0);
    });
    document.querySelector('main > div.topictitle').style.width = '80%';
    document.querySelector('main > div.row').style.width = '80%';
}

var numTriesRun = 0;
function run() {
    const retryOrLeave = () => {
        if(numTriesRun++ < 3) {
            return window.setTimeout(run, 1000);
        }
        console.warn('giving up');
    }
    const h3s = document.querySelectorAll('h3.title');
    if(!h3s) { return retryOrLeave(); }

    const summary = document.querySelector('.summary-section nav:last-child ul.summary-list');
    if(!summary) { return retryOrLeave(); }

    const li = summary.querySelector('li');
    if(!li) { return retryOrLeave(); }

    h3s.forEach((h3,ix) => {
        const li2 = li.cloneNode(true);
        li2.querySelector('span').textContent = h3.textContent;
        const _a = li2.querySelector('a')
        const a = _a.cloneNode(true);
        a.setAttribute('href', '#');
        a.addEventListener('click', e => {
            e.stopPropagation();
            e.preventDefault();
            h3.classList.add('header' + ix);
            window.scrollBy(h3.getBoundingClientRect().x, h3.getBoundingClientRect().y - 100);
            origPushState.apply(history, [{}, "", "#header" + ix]);
            return true;
        });
        _a.parentNode.replaceChild(a, _a);

        summary.appendChild(li2);
    });

    document.querySelectorAll('.summary-section nav:last-child ul.summary-list a').forEach(a => a.classList.remove('link'));
}
window.addEventListener('hashchange', () => {
    if(!window.location.hash) {
        window.scrollTo(0,0);
    }
    let matches = window.location.hash.match(/#header(\d*)/);
    if(matches && matches.length === 2) {
        let ix = matches[1];
        const h3 = document.querySelector('.header' + ix);
        window.scrollBy(h3.getBoundingClientRect().x, h3.getBoundingClientRect().y - 100);
    }
});
run();
changeHeader();

history.pushState = function(...args) {
    numTriesRun = 0;
    numTriesChangeHeader = 0;
    origPushState.apply(history, args);
    setTimeout(() => {
      run();
      changeHeader();
    }, 500);
}

})();