|
|
| Line 1: |
Line 1: |
| (function ($, mw) {
| |
|
| |
|
| function formatRelativeTime(timestamp) {
| |
| var then = new Date(timestamp).getTime();
| |
| var now = Date.now();
| |
| var diffSeconds = Math.round((now - then) / 1000);
| |
| var abs = Math.abs(diffSeconds);
| |
|
| |
| var value;
| |
| var short;
| |
|
| |
| if (abs < 60) {
| |
| short = 's';
| |
| value = diffSeconds;
| |
| } else if (abs < 3600) {
| |
| short = 'm';
| |
| value = Math.round(diffSeconds / 60);
| |
| } else if (abs < 86400) {
| |
| short = 'h';
| |
| value = Math.round(diffSeconds / 3600);
| |
| } else {
| |
| short = 'd';
| |
| value = Math.round(diffSeconds / 86400);
| |
| }
| |
|
| |
| var n = Math.abs(value);
| |
| return diffSeconds < 0 ? 'in ' + n + short : n + short + ' ago';
| |
| }
| |
|
| |
| function getDiffUrl(item) {
| |
| if (item.revid) {
| |
| return mw.util.getUrl('Special:Diff/' + item.revid);
| |
| }
| |
| return mw.util.getUrl('Special:RecentChanges');
| |
| }
| |
|
| |
| function renderWidget($root, items) {
| |
| $root.children().remove();
| |
|
| |
| items.forEach(function (item, index) {
| |
| var id = 'n-change' + (index + 1);
| |
| var userName = item.user || 'Unknown';
| |
| var timeText = formatRelativeTime(item.timestamp);
| |
| var diffUrl = getDiffUrl(item);
| |
|
| |
| var $li = $('<li class="mw-list-item recent-changes-item"></li>')
| |
| .attr('id', id);
| |
|
| |
| var $titleLink = $('<a class="recent-changes-title"></a>')
| |
| .attr('href', mw.util.getUrl(item.title))
| |
| .attr('title', item.title)
| |
| .append($('<span></span>').text(item.title));
| |
|
| |
| var $userLink;
| |
| if (item.user) {
| |
| $userLink = $('<a class="recent-changes-user"></a>')
| |
| .attr('href', mw.util.getUrl('Special:Contributions/' + item.user))
| |
| .text(userName);
| |
| } else {
| |
| $userLink = $('<span class="recent-changes-user"></span>').text(userName);
| |
| }
| |
|
| |
| var $timeLink = $('<a class="recent-changes-time"></a>')
| |
| .attr('href', diffUrl)
| |
| .attr('title', 'View diff for ' + item.title)
| |
| .text(timeText);
| |
|
| |
| var $meta = $('<div class="recent-changes-meta"></div>')
| |
| .append($timeLink)
| |
| .append(document.createTextNode(' · '))
| |
| .append($userLink);
| |
|
| |
| $li.append($titleLink).append($meta);
| |
| $root.append($li);
| |
| });
| |
|
| |
| var $moreLi = $('<li class="mw-list-item recent-changes-item"></li>')
| |
| .attr('id', 'n-change-more');
| |
|
| |
| var $moreLink = $('<a class="recent-changes-title"></a>')
| |
| .attr('href', mw.util.getUrl('Special:RecentChanges'))
| |
| .append($('<span></span>').text('Show more...'));
| |
|
| |
| $moreLi.append($moreLink);
| |
| $root.append($moreLi);
| |
| }
| |
|
| |
| function loadRecentEdits($root) {
| |
| var limit = parseInt($root.data('limit'), 10) || 5;
| |
|
| |
| return new mw.Api().get({
| |
| action: 'query',
| |
| list: 'recentchanges',
| |
| rcprop: 'title|timestamp|user|ids|flags',
| |
| rctype: 'edit|new',
| |
| rcnamespace: 0,
| |
| rclimit: limit
| |
| }).then(function (data) {
| |
| var items = [];
| |
|
| |
| if (data && data.query && data.query.recentchanges) {
| |
| items = data.query.recentchanges;
| |
| }
| |
|
| |
| renderWidget($root, items);
| |
| });
| |
| }
| |
|
| |
| function initWidget($root) {
| |
| var refreshMs = parseInt($root.data('refresh'), 10) || 300000;
| |
|
| |
| function refresh() {
| |
| loadRecentEdits($root);
| |
| }
| |
|
| |
| refresh();
| |
| window.setInterval(refresh, refreshMs);
| |
| }
| |
|
| |
| function getExistingPortletList() {
| |
| var $portlet = $('#p-Recent_Changes, #p-RecentChanges').first();
| |
| if (!$portlet.length) {
| |
| return $();
| |
| }
| |
|
| |
| var $list = $portlet.find('.vector-menu-content-list').first();
| |
|
| |
| if (!$list.length) {
| |
| $list = $('<ul class="vector-menu-content-list recent-changes-list"></ul>')
| |
| .attr('data-limit', '4')
| |
| .attr('data-refresh', '300000');
| |
|
| |
| var $content = $portlet.find('.vector-menu-content').first();
| |
| if ($content.length) {
| |
| $content.append($list);
| |
| } else {
| |
| $portlet.append($list);
| |
| }
| |
| } else {
| |
| $list.addClass('recent-changes-list');
| |
|
| |
| if (!$list.data('limit')) {
| |
| $list.attr('data-limit', '4');
| |
| }
| |
| if (!$list.data('refresh')) {
| |
| $list.attr('data-refresh', '300000');
| |
| }
| |
| }
| |
|
| |
| return $list;
| |
| }
| |
|
| |
| $(function () {
| |
| var $widget = getExistingPortletList();
| |
| if ($widget.length) {
| |
| initWidget($widget);
| |
| }
| |
| });
| |
|
| |
| }(jQuery, mediaWiki));
| |
|
| |
|
|
| |
|