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

편집 요약 없음
태그: 되돌려진 기여
편집 요약 없음
태그: 수동 되돌리기 되돌려진 기여
8번째 줄: 8번째 줄:
limit = $( '#live-recent-list' )[ 0 ].childElementCount;
limit = $( '#live-recent-list' )[ 0 ].childElementCount;


function timeFormat( timestamp ) {
function formatTimeAgo(time) {
var now = new Date();
var now = new Date();
var time = new Date( timestamp );
var diff = now.getTime() - time.getTime();
var diffInSeconds = Math.floor((now - time) / 1000);
var seconds = Math.floor(diff / 1000);
var diffInMinutes = Math.floor(diffInSeconds / 60);
var minutes = Math.floor(seconds / 60);
var diffInHours = Math.floor(diffInMinutes / 60);
var hours = Math.floor(minutes / 60);
var diffInDays = Math.floor(diffInHours / 24);
var days = Math.floor(hours / 24);
var weeks = Math.floor(days / 7);
var months = Math.floor(days / 30);
var years = Math.floor(days / 365);
if (diffInSeconds < 60) {
if (years > 0) {
return diffInSeconds + '초 ';
return years + "년 ";
} else if (diffInMinutes < 60) {
} else if (months > 0) {
return diffInMinutes + '분 ';
return months + "개월 전";
} else if (diffInHours < 24) {
} else if (weeks > 0) {
return diffInHours + '시간 전';
return weeks + "주 전";
} else if (days > 0) {
return days + "일 ";
} else if (hours > 0) {
return hours + "시간 전";
} else if (minutes > 0) {
return minutes + "분 전";
} else {
} else {
return diffInDays + '일 ';
return seconds + "초 ";
}
}
}
}
 
function refreshLiveRecent() {
function refreshLiveRecent() {
var getParameter;
var getParameter;
51번째 줄: 60번째 줄:
var recentChanges, html, time, line, text;
var recentChanges, html, time, line, text;
recentChanges = data.query.recentchanges;
recentChanges = data.query.recentchanges;
 
html = recentChanges.map( function ( item ) {
function cutTitle(title, maxLength) {
time = new Date( item.timestamp );
let length = 0;
line = '<li class="flex justify-between"><a class="recent-item w-full flex items-center" href="' + mw.util.getUrl( item.title ) + '" title="' + item.title + '"><span class="flex-1 text-ellipsis text-nowrap overflow-hidden">';
let cutOffIndex = title.length;
text = '';
if ( item.type === 'new' ) {
for (let i = 0; i < title.length; i++) {
line = line.replace('<span class="flex-1 text-ellipsis text-nowrap overflow-hidden">','<div class="flex justify-center items-center mr-1 w-3 h-3 bg-red-500 rounded-2xl text-[0.5rem] text-white font-black">N</div><span class="flex-1 text-ellipsis text-nowrap overflow-hidden">');
// 영어 알파벳과 숫자, 공백을 1로 카운트, 그 외를 2로 카운트
}
length += title.charCodeAt(i) > 127 ? 2 : 1;
text += item.title;
if ( text.length > 9999 ) {
if (length > maxLength) {
text = text.substr( 0, 9999 );
cutOffIndex = i;
text += '...';
break;
}
}
}
line += text;
// 필요한 경우 "..."을 추가
line += '</span><time class="ml-4 recent-item-timestamp">' + formatTimeAgo(time) + '</time></a></li>';
return title.length > cutOffIndex ? title.slice(0, cutOffIndex) + "..." : title;
}
// 이후, 이 함수를 사용해 제목을 처리
html = recentChanges.map(function (item) {
time = new Date(item.timestamp);
// cutTitle 함수를 사용해 제목 처리
var title = cutTitle(item.title, 30);
// 제목과 시간을 <div>로 감싸 각각 block 요소로 만들어 줄바꿈 효과를 줍니다.
line = '<li>';
line += '<a class="recent-item" href="' + mw.util.getUrl(item.title) + '" title="' + item.title + '">';
line += '<div class="item-title">' + title + '</div>'; // 수정된 제목을 사용
line += '<div class="item-time">' + timeFormat(time) + '</div>'; // 시간을 위한 <div>
line += '</a>';
line += '</li>';
return line;
return line;
}).join('\n');
} ).join( '\n' );
$( '#live-recent-list' ).html( html );
$( '#live-recent-list' ).html( html );
} )
} )

2025년 2월 22일 (토) 06:47 판

$( function () {
	'use strict';
	var articleNamespaces, talkNamespaces, isArticleTab, limit;

	articleNamespaces = $( '.live-recent' ).attr( 'data-article-ns' );
	talkNamespaces = $( '.live-recent' ).attr( 'data-talk-ns' );
	isArticleTab = true;
	limit = $( '#live-recent-list' )[ 0 ].childElementCount;

	function formatTimeAgo(time) {
		var now = new Date();
		var diff = now.getTime() - time.getTime();
		var seconds = Math.floor(diff / 1000);
		var minutes = Math.floor(seconds / 60);
		var hours = Math.floor(minutes / 60);
		var days = Math.floor(hours / 24);
		var weeks = Math.floor(days / 7);
		var months = Math.floor(days / 30);
		var years = Math.floor(days / 365);
	
		if (years > 0) {
			return years + "년 전";
		} else if (months > 0) {
			return months + "개월 전";
		} else if (weeks > 0) {
			return weeks + "주 전";
		} else if (days > 0) {
			return days + "일 전";
		} else if (hours > 0) {
			return hours + "시간 전";
		} else if (minutes > 0) {
			return minutes + "분 전";
		} else {
			return seconds + "초 전";
		}
	}

	function refreshLiveRecent() {
		var getParameter;

		if ( !$( '#live-recent-list' ).length || $( '#live-recent-list' ).is( ':hidden' ) ) {
			return;
		}

		getParameter = {
			action: 'query',
			list: 'recentchanges',
			rcprop: 'title|timestamp',
			rcshow: '!bot|!redirect',
			rctype: 'edit|new',
			rclimit: limit,
			format: 'json',
			rcnamespace: isArticleTab ? articleNamespaces : talkNamespaces,
			rctoponly: true
		};

		mw.loader.using( 'mediawiki.api' ).then( function () {
			var api = new mw.Api();
			api.get( getParameter ).then( function ( data ) {
				var recentChanges, html, time, line, text;
				recentChanges = data.query.recentchanges;
				html = recentChanges.map( function ( item ) {
					time = new Date( item.timestamp );
					line = '<li class="flex justify-between"><a class="recent-item w-full flex items-center" href="' + mw.util.getUrl( item.title ) + '" title="' + item.title + '"><span class="flex-1 text-ellipsis text-nowrap overflow-hidden">';
					text = '';
					if ( item.type === 'new' ) {
						line = line.replace('<span class="flex-1 text-ellipsis text-nowrap overflow-hidden">','<div class="flex justify-center items-center mr-1 w-3 h-3 bg-red-500 rounded-2xl text-[0.5rem] text-white font-black">N</div><span class="flex-1 text-ellipsis text-nowrap overflow-hidden">');
					}
					text += item.title;
					if ( text.length > 9999 ) {	
						text = text.substr( 0, 9999 );
						text += '...';
					}
					line += text;
					line += '</span><time class="ml-4 recent-item-timestamp">' + formatTimeAgo(time) + '</time></a></li>';
					return line;
				} ).join( '\n' );
				$( '#live-recent-list' ).html( html );
			} )
			.catch( function () {} );
		});
	}

	$( '#liberty-recent-tab1' ).click( function () {
		$( this ).addClass( 'active' );
		$( '#liberty-recent-tab2' ).removeClass( 'active' );
		isArticleTab = true;
		refreshLiveRecent();
	} );

	$( '#liberty-recent-tab2' ).click( function () {
		$( this ).addClass( 'active' );
		$( '#liberty-recent-tab1' ).removeClass( 'active' );
		isArticleTab = false;
		refreshLiveRecent();
	} );

	setInterval( refreshLiveRecent, 5 * 60 * 1000 );
	refreshLiveRecent();
} );