Jump to content

User:Novem Linguae/Scripts/UserHighlighterSimple.js

From Wikipedia, the free encyclopedia
This is an old revision of this page, as edited by Novem Linguae (talk | contribs) at 23:26, 3 August 2023 (debug). The present address (URL) is a permanent link to this revision, which may differ significantly from the current revision.
Note: After saving, you have to bypass your browser's cache to see the changes. Google Chrome, Firefox, Microsoft Edge and Safari: Hold down the ⇧ Shift key and click the Reload toolbar button. For details and instructions about other browsers, see Wikipedia:Bypass your cache.
// <nowiki>

class UserHighlighterSimple {
	/** @type {JQuery} */
	$link;

	/** @type {string} */
	user;

	/** @type {Object} */
	wmf;

	/** @type {Object} */
	stewards;

	/** @type {Object} */
	arbcom;

	/** @type {Object} */
	bureaucrats;

	/** @type {Object} */
	admins;

	/** @type {Object} */
	formeradmins;

	/** @type {Object} */
	newPageReviewers;

	/** @type {Object} */
	tenThousandEdits;

	/** @type {Object} */
	extendedConfirmed;

	/** @type {mw.Title} */
	mwtitle;

	/** @type {boolean} */
	hasAdvancedPermissions;

	/** @type {string} */
	url;

	async execute() {
		await this.getUsernames();
		this.setHighlightColors();
		let that = this;
		$('#article a, #bodyContent a, #mw_contentholder a').each(function(index, element) {
			// TODO: maybe remove this try catch. it displays that.$link.prop('href') to the console which is nice, but it hides the stack trace so I can't see what line the error occurred on
			try {
				that.$link = $(element);
				if ( ! that.linksToAUser() ) {
					return;
				}
				that.user = that.getUserName();
				that.hasAdvancedPermissions = false;
				that.addClassesAndHoverTextToLinkIfNeeded();
				// If the user has any advanced perms, they are likely to have a signature, so be aggressive about overriding the background and foreground color. That way there's no risk their signature is unreadable due to background color and foreground color being too similar. Don't do this for users without advanced perms... being able to see a redlinked username is useful.
				if ( that.hasAdvancedPermissions ) {
					that.$link.addClass(that.$link.attr('class') + ' UHS-override-signature-colors');
				}
			} catch (e) {
				console.error('UserHighlighterSimple link parsing error:', e.message, that.$link.prop('href'));
			}
		});
	}

	addCSS(htmlClass, cssDeclaration) {
		// .plainlinks is for Wikipedia Signpost articles
		// To support additional custom signature edge cases, add to the selectors here.
		mw.util.addCSS(`
			.plainlinks .${htmlClass}.external,
			.${htmlClass},
			.${htmlClass} b,
			.${htmlClass} big,
			.${htmlClass} font,
			.${htmlClass} span {
				${cssDeclaration}
			}
		`);
	}

	async getWikitextFromCache(title) {
		var api = new mw.ForeignApi('https://en.wikipedia.org/w/api.php');
		var wikitext = '';
		await api.get( {
			action: 'query',
			prop: 'revisions',
			titles: title,
			rvslots: '*',
			rvprop: 'content',
			formatversion: '2',
			uselang: 'content', // needed for caching
			smaxage: '86400', // cache for 1 day
			maxage: '86400' // cache for 1 day
		} ).then( function ( data ) {
			wikitext = data.query.pages[0].revisions[0].slots.main.content;
		} );
		return wikitext;
	}

	setHighlightColors() {
		// Highest specificity goes on bottom. So if you want an admin+steward to be highlighted steward, place the steward CSS below the admin CSS in this section.
		this.addCSS('UHS-override-signature-colors', `
			color: #0645ad !important;
			background-color: transparent !important;
			background: unset !important;
		`);
		mw.util.addCSS(`.UHS-no-permissions { border: 1px solid black !important; }`);
		this.addCSS('UHS-500edits-bot-trustedIP', `background-color: lightgray !important;`);
		this.addCSS('UHS-10000edits', `background-color: #9c9 !important;`);
		this.addCSS('UHS-new-page-reviewer', `background-color: #99f !important;`);
		this.addCSS('UHS-former-administrator', `background-color: #D3AC8B !important;`);
		this.addCSS('UHS-administrator', `background-color: #9ff !important;`);
		this.addCSS('UHS-bureaucrat', `background-color: orange !important; color: #0645ad !important;`);
		this.addCSS('UHS-arbitration-committee', `background-color: #FF3F3F !important; color: white !important;`);
		this.addCSS('UHS-steward', `background-color: #00FF00 !important;`);
		this.addCSS('UHS-wmf', `background-color: hotpink !important; color: #0645ad !important;`);
	}

	async getUsernames() {
		let dataString = await this.getWikitextFromCache('User:NovemBot/userlist.js');
		let dataJSON = JSON.parse(dataString);

		this.wmf = {
			...dataJSON['founder'],
			...dataJSON['boardOfTrustees'],
			...dataJSON['staff'],
			// WMF is hard-coded a bit further down. The script detects those strings in the username. This is safe to do because the WMF string is blacklisted from names, so has to be specially created.
			// ...dataJSON['sysadmin'],
			// ...dataJSON['global-interface-editor'],
			// ...dataJSON['wmf-supportsafety'],
			// ...dataJSON['mediawikiPlusTwo'],
			// ...dataJSON['global-sysop'],
		};
		this.stewards = dataJSON['steward'];
		this.arbcom = dataJSON['arbcom'];
		this.bureaucrats = dataJSON['bureaucrat'];
		this.admins = dataJSON['sysop'];
		this.formeradmins = dataJSON['formeradmin'];
		this.newPageReviewers = dataJSON['patroller'];
		this.tenThousandEdits = dataJSON['10k'];
		this.extendedConfirmed = {
			...dataJSON['extendedconfirmed'],
			...dataJSON['bot'],
			...dataJSON['productiveIPs'],
		};
	}

	hasHREF(url) {
		return Boolean(url);
	}

	isAnchor(url) {
		return url.charAt(0) === '#';
	}

	isHTTPorHTTPS(url) {
		return url.startsWith("http://", 0) ||
			url.startsWith("https://", 0) ||
			url.startsWith("/", 0);
	}

	/**
	  * Figure out the wikipedia article title of the link
	  * @param {string} url
	  * @param {mw.Uri} urlHelper
	  * @return {String}
	  */
	getTitle(url, urlHelper) {
		// for links in the format /w/index.php?title=Blah
		let titleParameterOfURL = mw.util.getParamValue('title', url);
		if ( titleParameterOfURL ) {
			return titleParameterOfURL;
		}

		// for links in the format /wiki/PageName. Slice off the /wiki/ (first 6 characters)
		if ( urlHelper.path.startsWith('/wiki/') ) {
			return decodeURIComponent(urlHelper.path.slice(6));
		}

		return '';
	}

	notInSpecialUserOrUserTalkNamespace() {
		let namespace = this.mwtitle.getNamespaceId();
		let notInSpecialUserOrUserTalkNamespace = $.inArray(namespace, [-1, 2, 3]) === -1;
		return notInSpecialUserOrUserTalkNamespace;
	}

	linksToAUser() {
		this.url = this.$link.attr('href');
		if ( this.url.includes('Machlax') ) {
			debugger;
		}
		
		if ( ! this.hasHREF(this.url) || this.isAnchor(this.url) || ! this.isHTTPorHTTPS(this.url) ) {
			return false;
		}

		this.url = this.addDomainIfMissing(this.url);

		// mw.Uri(url) throws an error if it can't find a URI. So need to detect it ourselves before that code is reached.
		// TODO: grok and review this code. what's a URI exactly? Google suggests it has multiple definitions... is that the correct term here? what are examples of URLs that cause mw.Uri to freak out? can we fix these instead of returning false?
		if ( ! this.isSafeForUrlHelper(this.url) ) {
			return false;
		}
		var urlHelper = new mw.Uri(this.url);
		
		// Skip links with query strings
		// Example: The pagination links, diff links, and revision links on the Special:Contributions page
		// Those all have "query strings" such as "&oldid=1003511328"
		// Exception: Users without a user page (red link) need to be highlighted
		// Exception: The uncommon case of a missing user talk page should also be highlighted (renamed users)
		let isRedLinkUserPage = this.url.includes('/w/index.php?title=User') && this.url.includes('&action=edit');
		let urlHasParameters = ! $.isEmptyObject(urlHelper.query);
		if ( ! urlHasParameters && ! isRedLinkUserPage ) {
			return false;
		}
		
		/*
		Going to try commenting this out. This should allow usernames from other wikis to be highlighted.
		Possible collateral damage: may try to highlight links from outside of Wikimedia.
		// TODO: when I figure it out, need to document what edge case this fixes
		let server = mw.config.get('wgServer'); // //en.wikipedia.org
		server = server.slice(2); // en.wikipedia.org
		let host = uri.host; // en.wikipedia.org
		if ( host !== server ) {
			return false;
		}
		*/

		let title = this.getTitle(this.url, urlHelper);
		this.mwtitle = new mw.Title(title);
		
		if ( this.notInSpecialUserOrUserTalkNamespace() ) {
			return false;
		}

		return true;
	}

	isSafeForUrlHelper(url) {
		let endsInSlash = url.endsWith('/');
		let numberOfSlashes = this.countInstances(url, '/');
		if ( numberOfSlashes === 3 && endsInSlash ) {
			return false;
		} else if ( numberOfSlashes === 2 ) {
			return false;
		}
		return true;
	}

	// Brandon Frohbieter, CC BY-SA 4.0, https://stackoverflow.com/a/4009771/3480193
	countInstances(string, word) {
		return string.split(word).length - 1;
	}

	/**
	 * mw.Uri(url) expects a complete URL. If we get something like /wiki/User:Test, convert it to https://en.wikipedia.org/wiki/User:Test. Without this, UserHighlighterSimple doesn't work on metawiki.
	 */
	addDomainIfMissing(url) {
		if ( url.startsWith('/') ) {
			url = window.location.origin + url;
		}
		return url;
	}

	/**
	 * @return {string}
	 */
	getUserName() {
		var user = this.mwtitle.getMain().replace(/_/g, ' ');
		if (this.mwtitle.getNamespaceId() === -1) {
			user = user.replace('Contributions/', ''); // For special page "Contributions/<username>"
			user = user.replace('Contribs/', ''); // The Contribs abbreviation too
		}
		return user;
	}

	checkForPermission(listOfUsernames, className, descriptionForHover) {
		if ( listOfUsernames[this.user] === 1 ) {
			this.addClassAndHoverText(className, descriptionForHover);
		}
	}

	addClassAndHoverText(className, descriptionForHover) {
		this.$link.addClass(className);

		let title = this.$link.attr("title");
		if ( ! title || title.startsWith("User:") ) {
			this.$link.attr("title", descriptionForHover);
		}

		this.hasAdvancedPermissions = true;
	}

	addClassesAndHoverTextToLinkIfNeeded() {
		// highlight anybody with "WMF" in their name, case insensitive. this should not generate false positives because "WMF" is on the username blacklist. see https://meta.wikimedia.org/wiki/Title_blacklist
		if ( this.user.match(/^[^/]*WMF/i) ) {
			this.addClassAndHoverText('UHS-wmf', 'Wikimedia Foundation (WMF)');
		}

		this.checkForPermission(this.stewards, 'UHS-steward', 'Steward');
		this.checkForPermission(this.wmf, 'UHS-wmf', 'Wikimedia Foundation (WMF)');
		this.checkForPermission(this.bureaucrats, 'UHS-bureaucrat', 'Bureaucrat');
		this.checkForPermission(this.arbcom, 'UHS-arbitration-committee', 'Arbitration Committee member');
		this.checkForPermission(this.admins, 'UHS-administrator', 'Admin');
		this.checkForPermission(this.formeradmins, 'UHS-former-administrator', 'Former Admin');
		this.checkForPermission(this.newPageReviewers, 'UHS-new-page-reviewer', 'New page reviewer');
		this.checkForPermission(this.tenThousandEdits, 'UHS-10000edits', 'More than 10,000 edits');
		this.checkForPermission(this.extendedConfirmed, 'UHS-500edits-bot-trustedIP', 'Extended confirmed');

		// Alright, they're not in our database. Are they a new user, or is this a URL to a non-userpage? Let's figure it out so we don't start putting boxes around things like "edit section" links.
		let isUser = false;
		if ( this.$link.hasClass('userlink') ) {
			isUser = true;
		} else if ( this.url.includes('/w/index.php?title=') ) {
			isUser = true;
		} else if ( this.url.includes('/wiki/') ) {
			isUser = true;
		}

		// If they have no perms, just draw a box around their username, to make it more visible.
		if ( ! this.hasAdvancedPermissions && isUser ) {
			this.$link.addClass( "UHS-no-permissions" );
			let title = this.$link.attr("title");
			if ( ! title || title.startsWith("User:")) {
				this.$link.attr("title", "Less than 500 edits");
			}
		}
	}
}

// TODO: race condition with xtools gadget. sometimes it fails to highlight the xtools gadget's username link
// TODO: hook for after visual editor edit is saved?
mw.hook('wikipage.content').add(async function() {
	await mw.loader.using(['mediawiki.util', 'mediawiki.Uri', 'mediawiki.Title'], async function() {
		let uhs = new UserHighlighterSimple();
		await uhs.execute();
	});
});

// </nowiki>