MediaWiki:Gadget-ReferenceDrawer.js

Not: Yayımladıktan sonra değişiklikleri görmeniz için tarayıcınızın önbelleğini temizlemeniz gerekebilir.

• Firefox / Safari: Shift tuşuna basılıyken Yeniden Yükle'ye tıklayın ya da Ctrl-F5 ya da Ctrl-R tıklayın (Mac için ⌘-R)
• Google Chrome: Ctrl-Shift-R'ye basın. (Mac için ⌘-Shift-R)
• Edge: Ctrl basılıyken Yenile'ye tıklayın ya da Ctrl-F5'e basın.

const $drawer = $('<div>')
	.addClass('reference-drawer')
	.append($('<div>')
	.addClass('reference-drawer__title')
		.append($('<span>')
			.addClass('reference-drawer__title__text')
			.text(mw.msg('cite-reference-previews-reference')))
		.append($('<button>')
			.addClass([
				'cdx-button',
				'cdx-button--size-large',
				'cdx-button--weight-quiet',
				'cdx-button--icon-only',
			])
			.append($('<span>')
				.addClass([
					'vector-icon',
					'mw-ui-icon-wikimedia-close',
				]))
			.append($('<span>')
				.text('close'))))
	.append($('<div>')
		.addClass('reference-drawer__content'))
	.appendTo(document.body);

const $drawerOverlay = $('<div>')
	.addClass('reference-drawer-overlay')
	.appendTo(document.body);

const $drawerContent = $drawer.find('.reference-drawer__content');

function closeDrawer() {
	$drawer.removeClass('shown');
	$drawerOverlay.removeClass('shown');
}
$drawer.find('button').click(closeDrawer);
$drawerOverlay.click(closeDrawer);

$('sup.reference a').click(event => {
	// (hover: hover) matches on Chrome Mobile
	if (matchMedia('(pointer: fine)').matches) {
		return;
	}
	event.preventDefault();
	const $reference = $(event.currentTarget);
	const refId = $reference.attr('href');
	if (!refId.startsWith('#')) {
		return;
	}
	const escapedRefId = $.escapeSelector(refId.slice(1));
	$drawerContent
		.empty()
		.append($('<sup>')
			.text($reference.text()))
		.append(' ')
		.append($(`#${escapedRefId} .reference-text`).clone());
	$drawer.addClass('shown');
	$drawerOverlay.addClass('shown');
});