미디어위키:Common.js

참고: 설정을 저장한 후에 바뀐 점을 확인하기 위해서는 브라우저의 캐시를 새로 고쳐야 합니다.

• 파이어폭스 / 사파리: Shift 키를 누르면서 새로 고침을 클릭하거나, Ctrl-F5 또는 Ctrl-R을 입력 (Mac에서는 ⌘-R)
• 구글 크롬: Ctrl-Shift-R키를 입력 (Mac에서는 ⌘-Shift-R)
• 인터넷 익스플로러: Ctrl 키를 누르면서 새로 고침을 클릭하거나, Ctrl-F5를 입력.
• 오페라: 메뉴 → 설정(맥의 경우 오페라 → 환경 설정)으로 이동한 다음 개인 정보 보호 및 보안 → 검색 데이터 지우기 → 캐시한 영상 및 파일을 누름.

/* 이 자바스크립트 설정은 모든 문서, 모든 사용자에게 적용됩니다. */
mw.hook('wikipage.content').add(function ($content) {
    // 보기 화면에서만 동작
    if (mw.config.get('wgAction') !== 'view') {
        return;
    }

    var input = document.getElementById('myInput');
    if (!input) {
        return;
    }

    var tbody = document.querySelector('.divTable .tbody');
    if (!tbody) {
        return;
    }

    var rows = tbody.getElementsByClassName('row');
    if (!rows.length) {
        return;
    }

    // 1) 행 텍스트를 미리 대문자로 캐시
    var rowData = [];
    for (var i = 0; i < rows.length; i++) {
        var rowText = rows[i].textContent || rows[i].innerText || '';
        rowData.push({
            row: rows[i],
            textUpper: rowText.toUpperCase()
        });
    }

    // 2) 실제 필터 함수
    function filterEpisodes() {
        var text = input.textContent || input.innerText || '';
        var filter = text.trim().toUpperCase();

        // 검색어가 없으면 전부 보이기
        if (!filter) {
            for (var i = 0; i < rowData.length; i++) {
                rowData[i].row.style.display = '';
            }
            return;
        }

        for (var j = 0; j < rowData.length; j++) {
            if (rowData[j].textUpper.indexOf(filter) > -1) {
                rowData[j].row.style.display = '';
            } else {
                rowData[j].row.style.display = 'none';
            }
        }
    }

    // 3) 디바운스 헬퍼 (delay ms 동안 입력 멈췄을 때만 실행)
    function debounce(fn, delay) {
        var timer = null;
        return function () {
            var context = this;
            var args = arguments;
            if (timer) {
                clearTimeout(timer);
            }
            timer = setTimeout(function () {
                fn.apply(context, args);
            }, delay);
        };
    }

    var debouncedFilter = debounce(filterEpisodes, 200); // 0.2초

    // contenteditable div에서 input 이벤트만 사용해도 충분
    input.addEventListener('input', debouncedFilter);
});