Greasy Fork

실검챈 -> 나무위키 링크 추가

실검챈 본문 글에 타이틀에 나무위키 링크가 자동으로 달리도록 변경했어요.

혼자 쓰는 기능이었는데 업뎃 할때마다 덮어씌워져서 그냥 정식버전 반영됐으면 해서 요청드립니다

1. @match에 https://arca.live/b/* 추가
2. 아카쪽 접속중일 때 /b/namutohow 채널인지 검사해서 타이틀 만지작 거리는 로직 추가
3. /b/xxx 들어갔을 때 이왜실 체크 로직 돌지 않도록 예외 처리
4. 버전은 따로 안건드려놨어요
5. 모바일은 테스트를 못해봤어요

// ==UserScript==
// @name         Namu Hot Now
// @name:ko      나무위키 실검 알려주는 스크립트
// @namespace    https://arca.live/b/namuhotnow
// @version      0.7.7.1
// @description  이게 왜 실검?
// @author       KEMOMIMI
// @match        https://namu.wiki/*
// @match        https://arca.live/
// @match        https://arca.live/b/*
// @match        https://arca.live/e/*
// @match        https://arca.live/u/*
// @match        https://arca.live/settings/*
// @connect      arca.live
// @icon         https://www.google.com/s2/favicons?sz=64&domain=namu.wiki
// @grant        GM_xmlhttpRequest
// @downloadURL https://update.greasyfork.org/scripts/486316/Namu%20Hot%20Now.user.js
// @updateURL https://update.greasyfork.org/scripts/486316/Namu%20Hot%20Now.meta.js
// ==/UserScript==

function findLinkByPartialMatch(pairs, searchString) {
    for (var i = 0; i < pairs.length; i++) {
        if (pairs[i].text.toLowerCase().trim() === searchString.toLowerCase().trim()) {
            return pairs[i].link;
        }
    }
    return null;
}

function getSpansContent() {
    var spansContent = [];
    var spans = Array.from(document.querySelectorAll('#app ul>li>a>span')).slice(0, 10);
    spans.forEach(function(span) {
        spansContent.push(span.textContent);
    });
    return spansContent.join('').trim();
}

var linkElements = [];
var pairs = [];
var previousSpansContent = "";
var storedElements = [];

function removeLinkElements() {
    for (var i = 0; i < linkElements.length; i++) {
        var linkElement = linkElements[i];
        linkElement.parentNode.removeChild(linkElement);
    }
    linkElements = [];
}

function checkMobileHotkeword(){
    var chk = setInterval(function() {
        var svgTags = Array.from(document.querySelector('a[title="아무 문서로 이동"]').parentElement.querySelectorAll('svg'));
        if (svgTags.length<5) {
            var whyHotElements = document.querySelectorAll('.whyHot');
            whyHotElements.forEach(function(element) {

                element.remove();
            });
            const elementsWithParentClass = document.querySelectorAll('.namuHotParentClass');
            elementsWithParentClass.forEach(parentElement => {
                const childAElement = parentElement.querySelector('a');
                if (childAElement) {
                    parentElement.parentNode.insertBefore(childAElement, parentElement.nextSibling);
                    parentElement.remove();
                }
            });
        }else if (svgTags.length>=5){
            const elementsWithParentClass = document.querySelectorAll('.namuHotParentClass');
            let count = 0;
            elementsWithParentClass.forEach(parentElement => {
                const childAnchorElements = parentElement.querySelectorAll('a');
                childAnchorElements.forEach(anchorElement => {
                    if (anchorElement.getAttribute('href') === '#') {
                        count++;
                    }
                });
            });

            if (count == 0) {
                const elementsWithParentClass = document.querySelectorAll('.namuHotParentClass');
                elementsWithParentClass.forEach(function(element) {
                    element.remove();
                });
            }
            if (elementsWithParentClass.length == 0) {
                clearInterval(chk);
                refreshLink(2);
            }
        }
    }, 100);


}
function refreshLink(type) {
    GM_xmlhttpRequest({
        method: 'GET',
        url: 'https://arca.live/b/namuhotnow',
        onload: function(response) {
            const htmlData = response.responseText;
            const parser = new DOMParser();
            const doc = parser.parseFromString(htmlData, 'text/html');
            var elements = doc.querySelectorAll('.article-list .list-table a:not(.notice)');
            storedElements = Array.from(elements);
            elements.forEach(function(element) {
                var link = element.getAttribute('href');
                var titleElement = element.querySelector('.title');
                var text = titleElement ? titleElement.innerText.trim() : '';
                pairs.push({text: text, link: link});
                if (text.includes(')')) {
                    var tempArray = text.split(')').map(function(item) {
                        return item.trim();
                    });
                    tempArray.forEach(function(subText) {
                        var subArray = subText.split(',').map(function(item) {
                            return item.trim();
                        });

                        subArray.forEach(function(finalText) {
                            pairs.push({ text: finalText, link: link });
                        });
                    });
                }
                if (text.includes(',')) {
                    var textArray = text.split(',').map(function(item) {
                        return item.trim();
                    });

                    textArray.forEach(function(subText) {
                        pairs.push({ text: subText, link: link });
                    });
                }
                if (text.includes(' ')) {
                    textArray = text.split(' ').map(function(item) {
                        return item.trim();
                    });

                    textArray.forEach(function(subText) {
                        pairs.push({ text: subText, link: link });
                    });
                }
                if (text.includes('(')) {
                    var removeParenthesis = text.replace(/\s*\([^)]*\)$/, '');
                    pairs.push({ text: removeParenthesis.trim(), link: link });
                }
            });
            GM_xmlhttpRequest({
                method: 'GET',
                url: 'https://arca.live/b/namuhotnow?p=2',
                onload: function(response) {
                    const htmlData = response.responseText;
                    const parser = new DOMParser();
                    const doc = parser.parseFromString(htmlData, 'text/html');
                    var elements = doc.querySelectorAll('.article-list .list-table a:not(.notice)');
                    storedElements = Array.from(elements);
                    elements.forEach(function(element) {
                        var link = element.getAttribute('href');
                        var titleElement = element.querySelector('.title');
                        var text = titleElement ? titleElement.innerText.trim() : '';
                        pairs.push({text: text, link: link});
                        if (text.includes(')')) {
                            var tempArray = text.split(')').map(function(item) {
                                return item.trim();
                            });
                            tempArray.forEach(function(subText) {
                                var subArray = subText.split(',').map(function(item) {
                                    return item.trim();
                                });

                                subArray.forEach(function(finalText) {
                                    pairs.push({ text: finalText, link: link });
                                });
                            });
                        }
                        if (text.includes(',')) {
                            var textArray = text.split(',').map(function(item) {
                                return item.trim();
                            });

                            textArray.forEach(function(subText) {
                                pairs.push({ text: subText, link: link });
                            });
                        }
                        if (text.includes(' ')) {
                            textArray = text.split(' ').map(function(item) {
                                return item.trim();
                            });

                            textArray.forEach(function(subText) {
                                pairs.push({ text: subText, link: link });
                            });
                        }
                        if (text.includes('(')) {
                            var removeParenthesis = text.replace(/\s*\([^)]*\)$/, '');
                            pairs.push({ text: removeParenthesis.trim(), link: link });
                        }
                    });
                    if(type == 0){
                        var realtimeList = Array.from(document.querySelectorAll('#app ul>li>a>span')).slice(0, 10);
                        realtimeList.forEach(function(titleElement) {
                            var resultLink = findLinkByPartialMatch(pairs, titleElement.innerText.trim());
                            if (resultLink != null){
                                var linkElement = document.createElement('a');
                                linkElement.href = 'https://arca.live' + resultLink;
                                linkElement.textContent = '이왜실?';
                                linkElement.display = 'flex'
                                linkElement.width = '40%'
                                linkElement.target="_blank"
                                const parentLiTag = titleElement ? titleElement.parentElement.parentElement : null;
                                parentLiTag.querySelector('a').style.width = "60%";
                                parentLiTag.appendChild(linkElement);
                                linkElements.push(linkElement);
                            }
                        });
                    }else if(type == 1){
                        var firstLinkList = document.querySelector('aside .link-list');
                        var arcalinkElements = firstLinkList.querySelectorAll('a');
                        var titleArray = [];
                        arcalinkElements.forEach(function(aLinkElement) {

                            var resultLink = findLinkByPartialMatch(pairs, aLinkElement.getAttribute('title'));

                            if(resultLink != null){
                                aLinkElement.style.paddingRight = "1em";
                                var newSpanHTML = `

이왜실?
${aLinkElement.getAttribute('title')}

`;
                                aLinkElement.insertAdjacentHTML('beforebegin', newSpanHTML);
                                aLinkElement.remove()

                            }
                        });
                    }else if(type == 2){
                        var namuHotParentClass = document.querySelectorAll('.namuHotParentClass');
                        if (!namuHotParentClass[0]) {
                            const aTags = Array.from(document.querySelector('a[title="아무 문서로 이동"]').parentElement.querySelectorAll('a'));
                            const mobileList = aTags.length > 10 ? aTags.slice(-10) : aTags;
                            mobileList.forEach(function(element) {
                                var resultLink = findLinkByPartialMatch(pairs, element.innerText.trim());
                                var newParent = document.createElement('span');
                                newParent.classList.add('namuHotParentClass');

                                if (resultLink != null){

                                    var linkElement = document.createElement('a');
                                    linkElement.href = 'https://arca.live' + resultLink;
                                    linkElement.textContent = '이왜실?';
                                    linkElement.width = '20px'
                                    linkElement.target="_blank"
                                    linkElement.classList.add('whyHot');
                                    element.style.width = "70%";

                                    var beforePseudoElement = window.getComputedStyle(element, ':before');
                                    element.parentNode.insertBefore(newParent, element);
                                    newParent.appendChild(element);
                                    newParent.appendChild(linkElement);
                                    newParent.style.display = 'flex';
                                    linkElements.push(linkElement);
                                }else{
                                    element.parentNode.insertBefore(newParent, element);
                                    newParent.appendChild(element);
                                    element.style.width = "100%";
                                    newParent.style.display = 'flex';
                                }
                            });
                            checkMobileHotkeword();
                        }
                    }
                }
            });
        }
    });
}


function isPC() {
    if (/Android|iPhone/i.test(navigator.userAgent)) {
        return false;
    }
    if (window.innerWidth >= 1024) {
        return true;
    } else {
        return false;
    }
}


function appendStyle(){
    var style = document.createElement('style');
    var css = `
.namuHotParentClass:nth-of-type(1) > a:nth-child(1):before {
    content: "1." !important;
}
.namuHotParentClass:nth-of-type(2) > a:nth-child(1):before {
    content: "2." !important;
}
.namuHotParentClass:nth-of-type(3) > a:nth-child(1):before {
    content: "3." !important;
}
.namuHotParentClass:nth-of-type(4) > a:nth-child(1):before {
    content: "4." !important;
}
.namuHotParentClass:nth-of-type(5) > a:nth-child(1):before {
    content: "5." !important;
}
.namuHotParentClass:nth-of-type(6) > a:nth-child(1):before {
    content: "6." !important;
}
.namuHotParentClass:nth-of-type(7) > a:nth-child(1):before {
    content: "7." !important;
}
.namuHotParentClass:nth-of-type(8) > a:nth-child(1):before {
    content: "8." !important;
}
.namuHotParentClass:nth-of-type(9) > a:nth-child(1):before {
    content: "9." !important;
}
.namuHotParentClass:nth-of-type(10) > a:nth-child(1):before {
    content: "10." !important;
}
.whyHot {
    align-items: center;
    border: 1px solid transparent;
    border-radius: var(--nav-bar-child-radius-var);
    display: flex;
    padding: var(--search-box-suggest-item-gutter-y-var) var(--search-box-suggest-item-gutter-x-var);
    text-decoration: none;
    word-break: break-all;
}
`;
    style.appendChild(document.createTextNode(css));
    document.head.appendChild(style);
}

(function() {
    'use strict';
    if (window.location.href.includes('namu.wiki')) {
        if(isPC()){

            setInterval(function() {
                var content = getSpansContent();
                if (content.length > 0 && previousSpansContent !== getSpansContent()) {
                    previousSpansContent = getSpansContent();
                    removeLinkElements();
                    refreshLink(0);
                }
            }, 100);
        }else{
            var interNamuMobile = setInterval(function() {
                const aTags = Array.from(document.querySelector('a[title="아무 문서로 이동"]').parentElement.querySelectorAll('a'));
                if (aTags.length > 10) {
                    clearInterval(interNamuMobile);
                    appendStyle();
                    refreshLink(2);
                }
            }, 50);
        }
    }

    if (/arca.live\/b\/namuhotnow\/[0-9]+/.test(window.location.host + window.location.pathname)) {
        const titleElement = document.querySelector('.title-row > .title');
        const titleOriginalText = titleElement.lastChild.data.trim();

        titleElement.removeChild(titleElement.lastChild);
        titleElement.appendChild(document.createTextNode("\n"));
        titleOriginalText.split(', ').forEach((title, idx, array) => {
            var linkElement = document.createElement('a');
            linkElement.href = 'https://namu.wiki/w/' + title;
            linkElement.textContent = title;
            linkElement.target="_blank"
            titleElement.appendChild(linkElement);
            if (idx + 1 < array.length) {
                titleElement.appendChild(document.createTextNode(", "));
            }
        });
    } else if (window.location.href.includes('arca.live') && !window.location.pathname.startsWith("/b/")) {
        var intervalId = setInterval(function() {
            var firstLinkLista = document.querySelector('aside .link-list a');
            if (firstLinkLista && firstLinkLista.innerHTML !== " ") {
                clearInterval(intervalId);
                refreshLink(1);
            }
        }, 50);
    }
})();

LGTM 머지했습니다
var newSpanHTML 날리신부분은 아카라이브에서 메인화면 인기검색어 작동에 문제가 발생하여 제외했습니다.