MediaWiki:Gadget-abuseLogRC-core.js

/*  ======================	      AbuseLogRC	======================	Shows certain Special:AbuseLog entries at the top of Special:RecentChanges	for better vandalism detection. Use of this gadget requires the user right	to view private filters ("abusefilter-log-private").	Keep this in sync with [[rsw:MediaWiki:Gadget-abuseLogRC-core.js]].	Inspired by Suppa chuppa's original script at [[User:Suppa chuppa/abuselog.js]]	@author Iiii_I_I_I*/;(function ($, mw) {	let gadgetLoaded = false;	let entryDays = new Set();	let lastUpdate;	let intervalID;	let filters = '2|3|5|6|7|12|14|19|21|global-4';	// default config	if (getConfig('autoRefresh') === null) setConfig('autoRefresh', false);	if (getConfig('interval') === null) setConfig('interval', 30);	if (getConfig('entries') === null) setConfig('entries', 5);	function getConfig(key) {		return JSON.parse(localStorage.getItem('gadget-abuseLogRC-' + key));	}	function setConfig(key, value) {		localStorage.setItem('gadget-abuseLogRC-' + key, value);	}	function refreshData() {		$('.gadget-abuselog-list').addClass('loading'); // class is cleared when new list replaces old		entryDays.clear();		getData();	}	function toggleAutoRefresh(isToggledOn, refreshButton) {		if (isToggledOn) {			intervalID = setInterval(refreshData, getConfig('interval') * 1000);		} else {			clearInterval(intervalID);		}		// hide manual refresh button when autoRefresh is on, show when it's off		refreshButton.toggle(!isToggledOn);		// update cookie		setConfig('autoRefresh', isToggledOn);	}	function buildGadget([entries, users, pages]) {		lastUpdate = new Date();		// refreshed		if (gadgetLoaded) {			$('.gadget-abuselog-list').replaceWith(buildList(entries, users, pages));		}		// initial load		else {			let $container = $('<div class="gadget-abuselog"></div>');			$container.append(buildHeader(), buildList(entries, users, pages));			$('.mw-changeslist').before($container);			gadgetLoaded = true;			// change user tool link text if readableRC is on			mw.hook('ext.gadget.readableRC').add(function () {				$('.gadget-abuselog').addClass('match-gadget-rc');			});		}		mw.hook('ext.gadget.abuseLogRC').fire();	}	function buildHeader() {		let $header = $('<div class="gadget-abuselog-header"></div>');		let $left = $('<span class="gadget-abuselog-header-left"></span>');		let $right = buildSettings();		let $title = $('<h4>Abuse log</h4>');		let link = ' (' + buildLink('Special:AbuseLog', {exists: true, text: 'all'}) + ')';		$left.append($title, link);		$header.append($left, $right);		return $header;	}	function buildSettings() {		let $settings = $('<span class="gadget-abuselog-header-right"></span>');		let refreshButton = new OO.ui.ButtonWidget({			framed: false,			icon: 'reload',			flags: ['progressive'],			label: 'Refresh log',			invisibleLabel: true,			title: 'Refresh abuse log entries',			classes: ['gadget-abuselog-manual-refresh']		});		// hide when autoRefresh is on, show when it's off		refreshButton.toggle(!getConfig('autoRefresh'));		refreshButton.on('click', function (e) {			refreshButton.setDisabled(true); // disabled state cleared by hook below			refreshData();		});		// use RecentChanges' "View new changes" button as another way to refresh		$('.mw-rcfilters-ui-filterWrapperWidget-showNewChanges a').on('click', function (e) {			refreshData();		});		// POPUP TOP HALF: number of log entries to show		let entriesSelectWidget = new OO.ui.ButtonSelectWidget({			items: [				new OO.ui.ButtonOptionWidget({ data: '3', label: '3' }),				new OO.ui.ButtonOptionWidget({ data: '5', label: '5' }),				new OO.ui.ButtonOptionWidget({ data: '10', label: '10' }),				new OO.ui.ButtonOptionWidget({ data: '20', label: '20' }),				new OO.ui.ButtonOptionWidget({ data: '50', label: '50' })			]		});		let entriesFieldset = new OO.ui.FieldsetLayout({			label: 'Entries to show',			classes: ['gadget-abuselog-settings-entries'],			items: [entriesSelectWidget]		});		entriesSelectWidget.selectItemByData(getConfig('entries').toString())		entriesSelectWidget.on('choose', function (button, selected) {			setConfig('entries', button.data);			refreshData();		});		// if user changes # entries to a custom value in localStorage, insert new button at the start		if (entriesSelectWidget.findSelectedItem() === null) {			let value = getConfig('entries').toString();			let customButton = new OO.ui.ButtonOptionWidget({ data: value, label: value });			entriesSelectWidget.addItems(customButton, 0);			entriesSelectWidget.selectItem(customButton);		}		// POPUP BOTTOM HALF: refresh settings		let lastUpdatedLabel = new OO.ui.LabelWidget({			classes: ['gadget-abuselog-settings-last-updated']		});		let autoRefreshCheckbox = new OO.ui.CheckboxInputWidget({			selected: getConfig('autoRefresh')		});		let refreshFieldset = new OO.ui.FieldsetLayout({			label: 'Refresh',			classes: ['gadget-abuselog-settings-refresh'],			items: [				lastUpdatedLabel,				new OO.ui.FieldLayout(autoRefreshCheckbox, {					classes: ['gadget-abuselog-settings-auto-refresh'],					label: 'Auto-refresh log entries every ' + getConfig('interval') + ' seconds'				})			]		});		// initial load		toggleAutoRefresh(getConfig('autoRefresh'), refreshButton);		// when clicked		autoRefreshCheckbox.on('change', function (isSelected, indeterminate) {			toggleAutoRefresh(isSelected, refreshButton);		});		// POPUP MENU		let menuButton = new OO.ui.PopupButtonWidget({			icon: 'menu',			framed: false,			label: 'Abuse log settings',			invisibleLabel: true,			classes: ['gadget-abuselog-settings'],			popup: {				head: false, anchor: false, padded: true, autoFlip: false, align: 'backwards',				$content: $('<div>').append(					entriesFieldset.$element,					refreshFieldset.$element				)			}		});		// to do when settings popup is opened		menuButton.on('click', function () {			let time = new Intl.DateTimeFormat('en-GB', {hour: 'numeric', minute: 'numeric', timeZone: 'UTC'}).format(lastUpdate);			let day = new Intl.DateTimeFormat('en-GB', {day: 'numeric', month: 'long', year: 'numeric', timeZone: 'UTC'}).format(lastUpdate);			let diff = new Date() - lastUpdate;			let h = Math.floor(diff / 1000 / 60 / 60);			let m = Math.floor(diff / 1000 / 60) % 60;			let s = Math.floor(diff / 1000) % 60;			// if over one minute since last update, hide seconds unit;			// if under one hour since last update, hide hour unit			let hh = (h > 0) ? h + 'h ' : '';			let mm = m + 'm';			let ss = s + 's';			let ago = (h > 0 || m > 0) ? hh + mm : ss;			lastUpdatedLabel.setLabel(				new OO.ui.HtmlSnippet(`Last update: <strong class="last-update" title="${time}, ${day}">${ago} ago</strong>.`)			);		});		// to do on each gadget refresh		mw.hook('ext.gadget.abuseLogRC').add(function () {			refreshButton.setDisabled(false);		});		$settings.append(			refreshButton.$element,			menuButton.$element		);		return $settings;	}	function buildList(entries, users, pages) {		let $list = $('<div class="gadget-abuselog-list"></div>');		let pageArr = Object.values(pages);		for (let entry of entries) {			let user = users.find(user => user.name === entry.user);			let page = pageArr.find(page => page.title === entry.title);			let userPage = pageArr.find(page => page.title === `User:${user.name}`);			let talkPage = pageArr.find(page => page.title === `User talk:${user.name}`);			// prevent error; User:FeedbackBot redirects to RuneScape:Article feedback			if (user.name === 'FeedbackBot') {				userPage = pageArr.find(page => page.title === 'RuneScape:Article feedback');			}			let opts = {				isRegistered: Object.hasOwn(user, 'userid'),				isRedirect: page === undefined, // API response separates redirects from pages object				pageExists: page === undefined || Object.hasOwn(page, 'pageid'),				userPageExists: Object.hasOwn(userPage, 'pageid'),				talkPageExists: Object.hasOwn(talkPage, 'pageid')			};			$list.append(buildRow(entry, opts));		}		return $list;	}	function buildRow(entry, opts) {		// FIRST COLUMN: date and time		let entryDate = new Date(entry.timestamp);		let entryDay = new Intl.DateTimeFormat('en-GB', {day: '2-digit', month: 'short', timeZone: 'UTC'}).format(entryDate);		let entryTime = new Intl.DateTimeFormat('en-GB', {hour: 'numeric', minute: 'numeric', timeZone: 'UTC'}).format(entryDate);		let showHideDay = (entryDays.has(entryDay)) ? 'hide' : '';		let firstColumn =			'<span class="gadget-abuselog-col gadget-abuselog-col-1">' +				`<span class="${showHideDay}">${entryDay}</span> <span>${entryTime}</span>` +			'</span>';		entryDays.add(entryDay);		// SECOND COLUMN: page edited		let secondColumn =			'<span class="gadget-abuselog-col gadget-abuselog-col-2">' +				buildLink(entry.title, {exists: opts.pageExists, text: entry.title, isRedirect: opts.isRedirect}) +			'</span>';		// THIRD COLUMN: diff, details, and action taken		let diffLink = (entry.revid) ? buildLink(`Special:Diff/${entry.revid}`, {exists: true, text: 'diff'}) : 'diff';		let logLink = buildLink(`Special:AbuseLog/${entry.id}`, {exists: true, text: 'log'});		let results = [];		// some filters perform multiple actions on a single edit, eg. <https://oldschool.runescape.wiki/w/Special:AbuseLog/22296>		entry.result.split(',').forEach(result => {			results.push(				`<span class="gadget-abuselog-result gadget-abuselog-result-${result}">` +				`${mw.msg('abusefilter-action-' + result)}</span>`			);		});		let thirdColumn =			'<span class="gadget-abuselog-col gadget-abuselog-col-3">' +				`(${diffLink} | ${logLink}) <span class="gadget-abuselog-action">(${results.join(', ')})</span>` +			'</span>';		// FOURTH COLUMN: user details and filter triggered		let filterURL = `Special:AbuseFilter/${entry.filter_id}`;		if (entry.filter_id.includes('global')) {			filterURL = `meta:Special:AbuseFilter/${entry.filter_id.replace('global-', '')}`;		}		let filterLink = buildLink(filterURL, {exists: true, text: `Filter ${entry.filter_id}`});		let fourthColumn =			'<span class="gadget-abuselog-col gadget-abuselog-col-4">' +				buildUserLinks(entry.user, opts) +				`<span class="gadget-abuselog-filter gadget-abuselog-filter-${entry.filter_id}">` +					`(${filterLink}: ${entry.filter})` +				'</span> ' +			'</span>';		return '<div class="gadget-abuselog-row">' + firstColumn + secondColumn + thirdColumn + fourthColumn + '</div>';	}	function buildUserLinks(username, opts) {		let userLink;		let toolLinks;		// link text is added with CSS so it can be replaced when readableRC is loaded		let talkLink = `<span>${buildLink(`User talk:${username}`, {			exists: opts.talkPageExists,			text: '',			classes: 'mw-usertoollinks-talk'		})}</span>`;		let contribsLink = `<span>${buildLink(`Special:Contributions/${username}`, {			exists: true,			text: '',			classes: 'mw-usertoollinks-contribs'		})}</span>`;		let logLink = `<span>${buildLink(`Special:AbuseLog`, {			exists: true,			text: '',			classes: 'mw-usertoollinks-abuselog',			param: 'wpSearchUser',			value: username		})}</span>`;		let blockLink = `<span>${buildLink(`Special:Block/${username}`, {			exists: true,			text: '',			classes: 'mw-usertoollinks-block'		})}</span>`;		// user links vs. anon links		if (opts.isRegistered) {			userLink = `<span>${buildLink(`User:${username}`, {				exists: opts.userPageExists,				text: username,				classes: 'mw-userlink'			})}</span>`;			toolLinks = '<span class="mw-usertoollinks">(' + talkLink + contribsLink + logLink + blockLink + ')</span>';		} else {			userLink = `<span>${buildLink(`Special:Contributions/${username}`, {				exists: true,				text: username,				classes: 'mw-userlink mw-anonuserlink'			})}</span>`;			toolLinks = '<span class="mw-usertoollinks">(' + talkLink + logLink + blockLink + ')</span>';		}		return userLink + ' ' + toolLinks + ' ';	}	function buildLink(pagename, opts) {		let url = mw.util.getUrl(pagename);		if (opts.param) url = mw.util.getUrl(pagename, {[opts.param]: opts.value});		if (!opts.exists) url = mw.util.getUrl(pagename, {action: 'edit'});		if (opts.isRedirect) url = mw.util.getUrl(pagename, {redirect: 'no'});		let title = (opts.exists) ? pagename : pagename + ' (page does not exist)';		let redlink = (opts.exists) ? '' : 'new';		let classes = opts.classes || '';		let link = `<a href="${url}" title="${title}" class="${redlink} ${classes}">${opts.text}</a>`;		return link;	}	function getUsernames(abuselog) {		let usernames = new Set();		for (let entry of abuselog) {			usernames.add(entry.user);		}		return [...usernames];	}	function getPageTitles(abuselog) {		let pages = new Set();		let usernames = getUsernames(abuselog);		for (let entry of abuselog) {			pages.add(entry.title);		}		for (let username of usernames) {			pages.add('User:' + username);			pages.add('User talk:' + username);		}		return [...pages];	}	function setMessages(messages) {		for (let message of messages) {			mw.messages.set(message['name'], message['*']);		}	}	function buildError(result) {		let warning = new OO.ui.MessageWidget({			type: 'notice',			classes: ['gadget-abuselog-error'],			label: new OO.ui.HtmlSnippet('<strong>AbuseLogRC encountered an API error:</strong><br>' + result.error.info)		});		$('.mw-changeslist').before(warning.$element);	}	function getData() {		let api = new mw.Api();		// this api call gets:		// - abuselog entries for commonly triggered vandalism filters		// - mw messages for abusefilter results (tag, warn, disallow, etc.)		api.get({			list: 'abuselog',			afllimit: getConfig('entries'),			aflprop: 'ids|user|title|action|result|timestamp|revid|filter',			aflfilter: filters,			meta: 'allmessages',			amprefix: 'abusefilter-action-'		})		.then(function (results) {			let abuselogResult = results.query.abuselog;			let messagesResult = results.query.allmessages;			if (!gadgetLoaded) setMessages(messagesResult);			// this api call gets:			// - page info for target pages in abuselog			// - user info for users listed in abuselog			// - page info for those users' userpages and talk pages			return api.get({				list: 'users',				ususers: getUsernames(abuselogResult),				titles: getPageTitles(abuselogResult),				redirects: true			})			.then(				// success				function (results) {					let usersResult = results.query.users;					let pagesResult = results.query.pages;					return [abuselogResult, usersResult, pagesResult];				},				// fail				function (code, result) {					buildError(result);				}			);		})		.then(			// success			function (results) {				buildGadget(results);			},			// fail			function (code, result) {				buildError(result);			}		);	}	getData();}(jQuery, mediaWiki));