MediaWiki:Gadget-shareLinks.js

// 「記事」か「よみもの」のときだけ発火
if ( mw.config.get( 'wgNamespaceNumber' ) === 0 || mw.config.get( 'wgNamespaceNumber' ) === 106 ) {
	$(function (){
		const pageTitle = mw.config.get( 'wgTitle' );
		const FQDN = mw.config.get( 'wgServerName' );

		// 例： https://enpedia.rxy.jp/wiki/日本語
		const URL = ( 'https://'+FQDN+'/wiki/'+pageTitle ).replace( ' ', '%20' ); 

		const curidURL = 'https://'+FQDN+'/w/?curid='+mw.config.get( 'wgArticleId' );

		// see: https://github.com/twitter/twitter-text/blob/master/js/src/regexp/validHashtag.js
		const xHashTag = (
			(
				pageTitle.replace( /\uff5e/g, '\u301c' )
				.normalize( 'NFKC' )
				.match( new RegExp( /(?:\p{L}|\p{M}|\p{Nd}|[_\u200c\u200d\ua67e\u05be\u05f3\u05f4\uff5e\u301c\u309b\u309c\u30a0\u30fb\u3003\u0f0b\u0f0c\xb7])+/, 'giu' ) ) || []
			).join( '_' )
			.match( new RegExp( /.*(\p{L}|\p{M}).*/, 'giu' ) ) || []
		).join();

		function getSocialShareLinkElm( href, imgAlt, imgSrc, imgSrcSet ) {
			return $( '<div/>', { class: '_blank' } ).append(
				$( '<a/>', {
					href: href,
					rel: 'nofollow'
				} ).append(
					$( '<img/>', {
						alt: imgAlt,
						src: imgSrc,
						srcset: imgSrcSet,
						decoding: 'async',
						width:'30',
						height:'30'
					})
				)
			);
		}

		const $XBtn = getSocialShareLinkElm(
			'http://twitter.com/share?url=' + curidURL + '&text=' + encodeURIComponent(pageTitle) + ' - 謎の百科事典もどき「Enpedia」&hashtags=謎の百科事典もどき,エンペディア' + (xHashTag ? ',' + xHashTag : ''),
			'Twitter logo.jpg',
			'/w/images/thumb/b/bc/Twitter_logo.jpg/30px-Twitter_logo.jpg',
			'/w/images/thumb/b/bc/Twitter_logo.jpg/45px-Twitter_logo.jpg 1.5x, /w/images/thumb/b/bc/Twitter_logo.jpg/60px-Twitter_logo.jpg 2x'
		);
		const $FacebookBtn = getSocialShareLinkElm(
			'https://www.facebook.com/sharer/sharer.php?u=' + URL,
			'F icon.png',
			'/w/images/thumb/2/2c/F_icon.png/30px-F_icon.png',
			'/w/images/thumb/2/2c/F_icon.png/45px-F_icon.png 1.5x, /w/images/thumb/2/2c/F_icon.png/60px-F_icon.png 2x'
		);
		const $HatenaBtn = getSocialShareLinkElm(
			'https://b.hatena.ne.jp/add?mode=confirm&url=' + URL,
			'はてなブックマーク.png',
			'/w/images/thumb/1/19/%E3%81%AF%E3%81%A6%E3%81%AA%E3%83%96%E3%83%83%E3%82%AF%E3%83%9E%E3%83%BC%E3%82%AF.png/30px-%E3%81%AF%E3%81%A6%E3%81%AA%E3%83%96%E3%83%83%E3%82%AF%E3%83%9E%E3%83%BC%E3%82%AF.png',
			'/w/images/thumb/1/19/%E3%81%AF%E3%81%A6%E3%81%AA%E3%83%96%E3%83%83%E3%82%AF%E3%83%9E%E3%83%BC%E3%82%AF.png/45px-%E3%81%AF%E3%81%A6%E3%81%AA%E3%83%96%E3%83%83%E3%82%AF%E3%83%9E%E3%83%BC%E3%82%AF.png 1.5x, /w/images/thumb/1/19/%E3%81%AF%E3%81%A6%E3%81%AA%E3%83%96%E3%83%83%E3%82%AF%E3%83%9E%E3%83%BC%E3%82%AF.png/60px-%E3%81%AF%E3%81%A6%E3%81%AA%E3%83%96%E3%83%83%E3%82%AF%E3%83%9E%E3%83%BC%E3%82%AF.png 2x'
		);
		const $LineBtn = getSocialShareLinkElm(
			'https://lineit.line.me/share/ui?url=' + curidURL,
			'LINE logo.svg',
			'/w/images/thumb/4/41/LINE_logo.svg/30px-LINE_logo.svg.png',
			'/w/images/thumb/4/41/LINE_logo.svg/45px-LINE_logo.svg.png 1.5x, /w/images/thumb/4/41/LINE_logo.svg/60px-LINE_logo.svg.png 2x'
		);
		const $shareBtns = $( '<div/>', { style: 'margin-left:auto' } ).append(
			$( '<div/>', { style: 'display:flex; align-items:center; gap:5px' } ).append(
				$( '<div/>', { text: '記事をシェア：' } ),
				$XBtn,
				$FacebookBtn,
				$HatenaBtn,
				$LineBtn
			)
		);

		$('#siteSub').css({
		    'display': 'flex',
		    'flexWrap': 'wrap',
		    'alignItems': 'center',
		    'gap': '10px'
		}).append($shareBtns);
	});
}