미디어위키:Common.js: 두 판 사이의 차이

편집 요약 없음
편집 요약 없음
태그: 수동 되돌리기
 
(같은 사용자의 중간 판 35개는 보이지 않습니다)
2번째 줄: 2번째 줄:
     $('body').prepend('<div class="WW-bg" style="position:fixed;top:0px;left:0px;width:100%;height:100vh;"></div>');
     $('body').prepend('<div class="WW-bg" style="position:fixed;top:0px;left:0px;width:100%;height:100vh;"></div>');
});
});
// 편집 버튼들 붙이기
$(function() {
    var header = $('.liberty-content-header');
    var content = $('.liberty-content');
    header.prependTo(content);
});
// 시간 계산 함수
function timeAgo(timestamp) {
    var now = new Date();
    var date = new Date(timestamp);
    var diff = Math.floor((now - date) / 1000);
    if (diff < 60) return diff + '초 전';
    if (diff < 3600) return Math.floor(diff / 60) + '분 전';
    if (diff < 86400) return Math.floor(diff / 3600) + '시간 전';
    return Math.floor(diff / 86400) + '일 전';
}


// 오른쪽 사이드바
// 오른쪽 사이드바
7번째 줄: 26번째 줄:
     var username = mw.config.get('wgUserName');
     var username = mw.config.get('wgUserName');
     var isLoggedIn = username !== null;
     var isLoggedIn = username !== null;
      
     var avatarSrc = $('.profile-img').attr('src') || '/index.php?title=특수:Redirect/file/pfp-default.png';
     var sidebar = '<div id="clbi-right-sidebar">' +
 
     var userBox;
    if (isLoggedIn) {
        userBox =
            '<div class="clbi-right-box">' +
            '<div style="display:flex;flex-direction:column;align-items:center;padding:14px 14px 10px;background:linear-gradient(to bottom, #171114 0%, #0a0909 100%);">' +
            '<img src="' + avatarSrc + '" style="width:64px;height:64px;border-radius:5px;object-fit:cover;border:2px solid #854369;margin-bottom:8px;">' +
            '<a href="/index.php/사용자:' + username + '" style="font-size:13px;font-weight:700;color:#E2E2E2 !important;text-decoration:none !important;">' + username + '</a>' +
            '</div>' +
            '<div class="clbi-right-content" style="border-top:1px solid #2a2a2a;padding:8px;">' +
            '<a href="/index.php/특수:기여/' + username + '" class="clbi-user-btn">기여</a>' +
            '<a href="/index.php/사용자_토론:' + username + '" class="clbi-user-btn">토론</a>' +
            '<a href="/index.php/특수:주시문서목록" class="clbi-user-btn">주시문서 목록</a>' +
            '<a href="/index.php/특수:환경설정" class="clbi-user-btn">환경 설정</a>' +
            '<a href="/index.php?title=특수:로그아웃&returnto=대문" class="clbi-user-btn clbi-user-btn-logout">로그아웃</a>' +
            '</div></div>';
    } else {
        userBox =
            '<div class="clbi-right-box">' +
            '<div style="display:flex;flex-direction:column;align-items:center;padding:14px 14px 10px;background:linear-gradient(to bottom, #171114 0%, #0a0909 100%);">' +
            '<img src="/index.php?title=특수:Redirect/file/pfp-default.png" style="width:64px;height:64px;border-radius:5px;object-fit:cover;border:2px solid #854369;margin-bottom:8px;">' +
            '<span style="font-size:13px;font-weight:700;color:#E2E2E2;">Guest</span>' +
            '</div>' +
            '<div class="clbi-right-content" style="border-top:1px solid #2a2a2a;padding:8px;">' +
            '<a href="/index.php?title=특수:로그인&returnto=대문" class="clbi-user-btn">로그인</a>' +
            '</div></div>';
    }
 
    var recentBox =
         '<div class="clbi-right-box">' +
         '<div class="clbi-right-box">' +
         '<div class="clbi-right-title">👤 ' + (isLoggedIn ? username : '로그인') + '</div>' +
         '<div class="clbi-right-title"><span class="clbi-icon" style="--icon:var(--ic-ui-006)"></span> <a href="/index.php/특수:최근바뀜" style="color:#E2E2E2 !important;text-decoration:none !important;">최근 변경</a></div>' +
        '<div class="clbi-right-content">' +
        '<div class="clbi-right-content" id="clbi-recent-list">불러오는 중...</div>' +
        (isLoggedIn ?
         '</div>';
            '<a href="/index.php/특수:내_사용자_문서">내 문서</a><br>' +
 
            '<a href="/index.php/특수:환경_설정">환경설정</a><br>' +
    var sidebar =
            '<a href="/index.php?title=특수:사용자_로그아웃&returnto=대문">로그아웃</a>' :
        userBox +
            '<a href="/index.php?title=특수:로그인&returnto=대문">로그인</a>') +
         '</div></div>' +
         '<div class="clbi-right-box">' +
         '<div class="clbi-right-box">' +
         '<div class="clbi-right-title">🔍 검색</div>' +
         '<div class="clbi-right-title"><span class="clbi-icon" style="--icon:var(--ic-ui-005)"></span> <a href="/index.php/특수:검색" style="color:#E2E2E2 !important;text-decoration:none !important;">검색</a></div>' +
         '<div class="clbi-right-content">' +
         '<div class="clbi-right-content">' +
         '<input id="clbi-search-input" type="text" placeholder="검색...">' +
         '<input id="clbi-search-input" type="text" placeholder="검색...">' +
         '<button id="clbi-search-btn">GO</button>' +
         '<button id="clbi-search-btn">GO</button>' +
         '</div></div>' +
         '</div></div>' +
        recentBox +
         '<div class="clbi-right-box">' +
         '<div class="clbi-right-box">' +
         '<div class="clbi-right-title">📋 최근 변경</div>' +
         '<div class="clbi-right-title"><span class="clbi-icon" style="--icon:var(--ic-ui-007)"></span> 가이드</div>' +
        '<div class="clbi-right-content">' +
        '<a href="/index.php/특수:최근_바뀜">최근 바뀜 보기</a>' +
        '</div></div>' +
        '<div class="clbi-right-box">' +
        '<div class="clbi-right-title">📖 가이드</div>' +
         '<div class="clbi-right-content">' +
         '<div class="clbi-right-content">' +
         '<a href="/index.php/CLBI_Wiki/KR_시작하기_(CLBI)">시작하기</a>' +
         '<a href="/index.php/CLBI_Wiki/KR_시작하기_(CLBI)">시작하기</a>' +
         '</div></div>' +
         '</div></div>';
        '</div>';
 
   
    var wrapper = '<div id="clbi-right-sidebar">' + sidebar + '</div>';
     $('.content-wrapper').append(sidebar);
     $('.content-wrapper').append(wrapper);
   
 
     $('#clbi-search-btn').click(function() {
     $('#clbi-search-btn').click(function() {
         var query = $('#clbi-search-input').val();
         var query = $('#clbi-search-input').val();
         if(query) window.location.href = '/index.php?search=' + encodeURIComponent(query);
         if (query) window.location.href = '/index.php?search=' + encodeURIComponent(query);
     });
     });
     $('#clbi-search-input').keypress(function(e) {
     $('#clbi-search-input').keypress(function(e) {
         if(e.which == 13) $('#clbi-search-btn').click();
         if (e.which == 13) $('#clbi-search-btn').click();
    });
 
    $.getJSON('/api.php?action=query&list=recentchanges&rclimit=5&rcprop=title|timestamp&format=json', function(data) {
        var items = data.query.recentchanges;
        var html = '';
        $.each(items, function(i, item) {
            var label = timeAgo(item.timestamp);
            html +=
                '<div class="clbi-recent-item">' +
                '<div class="clbi-recent-title-wrap">' +
                '<a href="/index.php/' + encodeURIComponent(item.title) + '" class="clbi-recent-title">' + item.title + '</a>' +
                '</div>' +
                '<span class="clbi-recent-time">' + label + '</span>' +
                '</div>';
        });
        $('#clbi-recent-list').html(html);
 
        $('#clbi-recent-list .clbi-recent-item').each(function() {
            var wrap = $(this).find('.clbi-recent-title-wrap');
            var title = $(this).find('.clbi-recent-title');
            var wrapW = wrap.width();
            var titleW = title[0].scrollWidth;
            if (titleW > wrapW + 20) {
                var duration = titleW / 40;
                title.css({
                    'animation': 'clbi-scroll ' + duration + 's linear infinite',
                    '--scroll-dist': '-' + (titleW - wrapW + 8) + 'px'
                });
            }
        });
    }).fail(function() {
        $('#clbi-recent-list').html('불러오기 실패');
     });
     });
});
});
49번째 줄: 122번째 줄:
// 왼쪽 사이드바
// 왼쪽 사이드바
$(function() {
$(function() {
    var imgBase = '/index.php/특수:문서_검색?target=파일:';
    var ic1 = '/wiki/images/' + mw.config.get('wgServer') + '/파일:ic-ui-001.svg';
     var leftSidebar = '<div id="clbi-left-sidebar">' +
     var leftSidebar = '<div id="clbi-left-sidebar">' +
        // 언어
         '<div class="clbi-left-box">' +
         '<div class="clbi-left-box">' +
         '<div class="clbi-left-title"><img src="/index.php?title=특수:Redirect/file/ic-ui-001.svg&width=18"> 언어</div>' +
         '<div class="clbi-left-title"><span class="clbi-icon" style="--icon:var(--ic-ui-001)"></span> 언어</div>' +
         '<div class="clbi-left-content clbi-lang-box">' +
         '<div class="clbi-left-content clbi-lang-box">' +
         '<div class="clbi-lang-current">한국어</div>' +
         '<div class="clbi-lang-current">한국어</div>' +
         '<div class="clbi-lang-link"><a href="/index.php/대문/EN">English</a></div>' +
         '<div class="clbi-lang-link"><a href="/index.php/대문/EN">English</a></div>' +
         '</div></div>' +
         '</div></div>' +
        // 카테고리
         '<div class="clbi-left-box">' +
         '<div class="clbi-left-box">' +
         '<div class="clbi-left-title"><img src="/index.php?title=특수:Redirect/file/ic-ui-002.svg&width=18"> 카테고리</div>' +
         '<div class="clbi-left-title"><span class="clbi-icon" style="--icon:var(--ic-ui-002)"></span> 카테고리</div>' +
         '<div class="clbi-left-content clbi-cat-box">' +
         '<div class="clbi-left-content clbi-cat-box">' +
         '<div class="clbi-cat-btn"><a href="/index.php/대문"><div class="clbi-cat-text"><span class="clbi-cat-label">메인 메뉴</span><span class="clbi-cat-sub">MAIN MENU</span></div></a><div class="clbi-cat-arrow">▶</div></div>' +
         '<div class="clbi-cat-btn"><a href="/index.php/대문"><div class="clbi-cat-text"><span class="clbi-cat-label">메인 메뉴</span><span class="clbi-cat-sub">MAIN MENU</span></div></a><div class="clbi-cat-arrow">▶</div></div>' +
71번째 줄: 139번째 줄:
         '<div class="clbi-cat-btn"><a href="/index.php/CLBI_Wiki/KR_인물"><div class="clbi-cat-text"><span class="clbi-cat-label">인물</span><span class="clbi-cat-sub">KEY PERSONNEL</span></div></a><div class="clbi-cat-arrow">▶</div></div>' +
         '<div class="clbi-cat-btn"><a href="/index.php/CLBI_Wiki/KR_인물"><div class="clbi-cat-text"><span class="clbi-cat-label">인물</span><span class="clbi-cat-sub">KEY PERSONNEL</span></div></a><div class="clbi-cat-arrow">▶</div></div>' +
         '</div></div>' +
         '</div></div>' +
        // 링크
         '<div class="clbi-left-box">' +
         '<div class="clbi-left-box">' +
         '<div class="clbi-left-title"><img src="/index.php?title=특수:Redirect/file/ic-ui-003.svg&width=18"> 링크</div>' +
         '<div class="clbi-left-title"><span class="clbi-icon" style="--icon:var(--ic-ui-003)"></span> 링크</div>' +
         '<div class="clbi-left-content clbi-link-box">' +
         '<div class="clbi-left-content clbi-link-box">' +
         '<ul>' +
         '<ul>' +
83번째 줄: 150번째 줄:
         '</div>';
         '</div>';


     $('body').prepend(leftSidebar);
     $('.content-wrapper').prepend(leftSidebar);
});
 
// 펼접 토글
$(function() {
    $(document).on('click', '.toggleBtn', function() {
        var targetId = $(this).data('target');
        var target = $('#' + targetId);
        var scrollY = window.scrollY;
 
        if (target.hasClass('folding-open')) {
            target.css('max-height', target[0].scrollHeight + 'px');
            target[0].offsetHeight;
            target.css('max-height', '0px');
            target.removeClass('folding-open');
        } else {
            target.css('max-height', '0px');
            target[0].offsetHeight;
            target.css('max-height', target[0].scrollHeight + 'px');
            target.addClass('folding-open');
        }
 
        window.scrollTo(0, scrollY);
    });
});
});

2026년 4월 17일 (금) 16:46 기준 최신판

$(function() {
    $('body').prepend('<div class="WW-bg" style="position:fixed;top:0px;left:0px;width:100%;height:100vh;"></div>');
});

// 편집 버튼들 붙이기
$(function() {
    var header = $('.liberty-content-header');
    var content = $('.liberty-content');
    header.prependTo(content);
});

// 시간 계산 함수
function timeAgo(timestamp) {
    var now = new Date();
    var date = new Date(timestamp);
    var diff = Math.floor((now - date) / 1000);

    if (diff < 60) return diff + '초 전';
    if (diff < 3600) return Math.floor(diff / 60) + '분 전';
    if (diff < 86400) return Math.floor(diff / 3600) + '시간 전';
    return Math.floor(diff / 86400) + '일 전';
}

// 오른쪽 사이드바
$(function() {
    var username = mw.config.get('wgUserName');
    var isLoggedIn = username !== null;
    var avatarSrc = $('.profile-img').attr('src') || '/index.php?title=특수:Redirect/file/pfp-default.png';

    var userBox;
    if (isLoggedIn) {
        userBox =
            '<div class="clbi-right-box">' +
            '<div style="display:flex;flex-direction:column;align-items:center;padding:14px 14px 10px;background:linear-gradient(to bottom, #171114 0%, #0a0909 100%);">' +
            '<img src="' + avatarSrc + '" style="width:64px;height:64px;border-radius:5px;object-fit:cover;border:2px solid #854369;margin-bottom:8px;">' +
            '<a href="/index.php/사용자:' + username + '" style="font-size:13px;font-weight:700;color:#E2E2E2 !important;text-decoration:none !important;">' + username + '</a>' +
            '</div>' +
            '<div class="clbi-right-content" style="border-top:1px solid #2a2a2a;padding:8px;">' +
            '<a href="/index.php/특수:기여/' + username + '" class="clbi-user-btn">기여</a>' +
            '<a href="/index.php/사용자_토론:' + username + '" class="clbi-user-btn">토론</a>' +
            '<a href="/index.php/특수:주시문서목록" class="clbi-user-btn">주시문서 목록</a>' +
            '<a href="/index.php/특수:환경설정" class="clbi-user-btn">환경 설정</a>' +
            '<a href="/index.php?title=특수:로그아웃&returnto=대문" class="clbi-user-btn clbi-user-btn-logout">로그아웃</a>' +
            '</div></div>';
    } else {
        userBox =
            '<div class="clbi-right-box">' +
            '<div style="display:flex;flex-direction:column;align-items:center;padding:14px 14px 10px;background:linear-gradient(to bottom, #171114 0%, #0a0909 100%);">' +
            '<img src="/index.php?title=특수:Redirect/file/pfp-default.png" style="width:64px;height:64px;border-radius:5px;object-fit:cover;border:2px solid #854369;margin-bottom:8px;">' +
            '<span style="font-size:13px;font-weight:700;color:#E2E2E2;">Guest</span>' +
            '</div>' +
            '<div class="clbi-right-content" style="border-top:1px solid #2a2a2a;padding:8px;">' +
            '<a href="/index.php?title=특수:로그인&returnto=대문" class="clbi-user-btn">로그인</a>' +
            '</div></div>';
    }

    var recentBox =
        '<div class="clbi-right-box">' +
        '<div class="clbi-right-title"><span class="clbi-icon" style="--icon:var(--ic-ui-006)"></span> <a href="/index.php/특수:최근바뀜" style="color:#E2E2E2 !important;text-decoration:none !important;">최근 변경</a></div>' +
        '<div class="clbi-right-content" id="clbi-recent-list">불러오는 중...</div>' +
        '</div>';

    var sidebar =
        userBox +
        '<div class="clbi-right-box">' +
        '<div class="clbi-right-title"><span class="clbi-icon" style="--icon:var(--ic-ui-005)"></span> <a href="/index.php/특수:검색" style="color:#E2E2E2 !important;text-decoration:none !important;">검색</a></div>' +
        '<div class="clbi-right-content">' +
        '<input id="clbi-search-input" type="text" placeholder="검색...">' +
        '<button id="clbi-search-btn">GO</button>' +
        '</div></div>' +
        recentBox +
        '<div class="clbi-right-box">' +
        '<div class="clbi-right-title"><span class="clbi-icon" style="--icon:var(--ic-ui-007)"></span> 가이드</div>' +
        '<div class="clbi-right-content">' +
        '<a href="/index.php/CLBI_Wiki/KR_시작하기_(CLBI)">시작하기</a>' +
        '</div></div>';

    var wrapper = '<div id="clbi-right-sidebar">' + sidebar + '</div>';
    $('.content-wrapper').append(wrapper);

    $('#clbi-search-btn').click(function() {
        var query = $('#clbi-search-input').val();
        if (query) window.location.href = '/index.php?search=' + encodeURIComponent(query);
    });
    $('#clbi-search-input').keypress(function(e) {
        if (e.which == 13) $('#clbi-search-btn').click();
    });

    $.getJSON('/api.php?action=query&list=recentchanges&rclimit=5&rcprop=title|timestamp&format=json', function(data) {
        var items = data.query.recentchanges;
        var html = '';
        $.each(items, function(i, item) {
            var label = timeAgo(item.timestamp);
            html +=
                '<div class="clbi-recent-item">' +
                '<div class="clbi-recent-title-wrap">' +
                '<a href="/index.php/' + encodeURIComponent(item.title) + '" class="clbi-recent-title">' + item.title + '</a>' +
                '</div>' +
                '<span class="clbi-recent-time">' + label + '</span>' +
                '</div>';
        });
        $('#clbi-recent-list').html(html);

        $('#clbi-recent-list .clbi-recent-item').each(function() {
            var wrap = $(this).find('.clbi-recent-title-wrap');
            var title = $(this).find('.clbi-recent-title');
            var wrapW = wrap.width();
            var titleW = title[0].scrollWidth;
            if (titleW > wrapW + 20) {
                var duration = titleW / 40;
                title.css({
                    'animation': 'clbi-scroll ' + duration + 's linear infinite',
                    '--scroll-dist': '-' + (titleW - wrapW + 8) + 'px'
                });
            }
        });
    }).fail(function() {
        $('#clbi-recent-list').html('불러오기 실패');
    });
});

// 왼쪽 사이드바
$(function() {
    var leftSidebar = '<div id="clbi-left-sidebar">' +
        '<div class="clbi-left-box">' +
        '<div class="clbi-left-title"><span class="clbi-icon" style="--icon:var(--ic-ui-001)"></span> 언어</div>' +
        '<div class="clbi-left-content clbi-lang-box">' +
        '<div class="clbi-lang-current">한국어</div>' +
        '<div class="clbi-lang-link"><a href="/index.php/대문/EN">English</a></div>' +
        '</div></div>' +
        '<div class="clbi-left-box">' +
        '<div class="clbi-left-title"><span class="clbi-icon" style="--icon:var(--ic-ui-002)"></span> 카테고리</div>' +
        '<div class="clbi-left-content clbi-cat-box">' +
        '<div class="clbi-cat-btn"><a href="/index.php/대문"><div class="clbi-cat-text"><span class="clbi-cat-label">메인 메뉴</span><span class="clbi-cat-sub">MAIN MENU</span></div></a><div class="clbi-cat-arrow">▶</div></div>' +
        '<div class="clbi-cat-btn"><a href="/index.php/CLBI_Wiki/KR_국가_및_조합"><div class="clbi-cat-text"><span class="clbi-cat-label">국가 및 조합</span><span class="clbi-cat-sub">NATIONS & FACTIONS</span></div></a><div class="clbi-cat-arrow">▶</div></div>' +
        '<div class="clbi-cat-btn"><a href="/index.php/CLBI_Wiki/KR_기업_및_공동체"><div class="clbi-cat-text"><span class="clbi-cat-label">기업 및 공동체</span><span class="clbi-cat-sub">CORPORATIONS & COMMUNITIES</span></div></a><div class="clbi-cat-arrow">▶</div></div>' +
        '<div class="clbi-cat-btn"><a href="/index.php/CLBI_Wiki/KR_군_정치집단"><div class="clbi-cat-text"><span class="clbi-cat-label">군, 정치집단</span><span class="clbi-cat-sub">MILITARY & POLITICS</span></div></a><div class="clbi-cat-arrow">▶</div></div>' +
        '<div class="clbi-cat-btn"><a href="/index.php/CLBI_Wiki/KR_역사적_사건"><div class="clbi-cat-text"><span class="clbi-cat-label">역사적 사건</span><span class="clbi-cat-sub">HISTORICAL EVENTS</span></div></a><div class="clbi-cat-arrow">▶</div></div>' +
        '<div class="clbi-cat-btn"><a href="/index.php/CLBI_Wiki/KR_인물"><div class="clbi-cat-text"><span class="clbi-cat-label">인물</span><span class="clbi-cat-sub">KEY PERSONNEL</span></div></a><div class="clbi-cat-arrow">▶</div></div>' +
        '</div></div>' +
        '<div class="clbi-left-box">' +
        '<div class="clbi-left-title"><span class="clbi-icon" style="--icon:var(--ic-ui-003)"></span> 링크</div>' +
        '<div class="clbi-left-content clbi-link-box">' +
        '<ul>' +
        '<li><a href="https://discord.gg/ctaeJ9d3Q5" target="_blank">Discord</a></li>' +
        '<li><a href="https://www.youtube.com/@nxdsxn" target="_blank">YouTube</a></li>' +
        '<li><a href="https://x.com/nxd_sxn" target="_blank">X</a></li>' +
        '</ul>' +
        '</div></div>' +
        '</div>';

    $('.content-wrapper').prepend(leftSidebar);
});

// 펼접 토글
$(function() {
    $(document).on('click', '.toggleBtn', function() {
        var targetId = $(this).data('target');
        var target = $('#' + targetId);
        var scrollY = window.scrollY;

        if (target.hasClass('folding-open')) {
            target.css('max-height', target[0].scrollHeight + 'px');
            target[0].offsetHeight;
            target.css('max-height', '0px');
            target.removeClass('folding-open');
        } else {
            target.css('max-height', '0px');
            target[0].offsetHeight;
            target.css('max-height', target[0].scrollHeight + 'px');
            target.addClass('folding-open');
        }

        window.scrollTo(0, scrollY);
    });
});