「MediaWiki:Common.js」の版間の差分

2021年2月28日 (日) 21:23時点における版

/* ここにあるすべてのJavaScriptは、すべてのページ読み込みですべての利用者に対して読み込まれます */
var tooltip

function updatePosition(e) {
	var obj = $(e.currentTarget)
	var offset = obj.offset()
	var y = offset.top + obj.outerHeight()
	var maxY = $(window).scrollTop() + $(window).height() - $('#tooltip').outerHeight()
	if (y > maxY) {
		y = offset.top - obj.outerHeight()
	}
	tooltip
		.css('left', Math.min(
			$(window).width() - tooltip.outerWidth(),
			Math.round(offset.left - 0.5 * (tooltip.outerWidth() - obj.outerWidth()))))
		.css('top', y)
}

function unescapeHtml(html) {
	return html
		.replace(/"/g, '"')
		.replace(/&/g, '&')
}

function showTooltip(e) {
	var escaped = $(this).attr('data-tooltip')
	var html = unescapeHtml(escaped)
	tooltip
		.css('display', 'block')
		.html(html)
	updatePosition(e)
	$(this).mousemove(updatePosition)
}

function hideTooltip(e) {
	tooltip.css('display', '')
	$(this).off('mousemove')
}

function updateWidth(classname) {
	var targetSelector = 'tr:first th:nth-child(2), tr:first td:nth-child(2)'
	
	// Reset the max width of each column in each table.
	$("." + classname).each(function(index, elem) {
		$(elem).find(targetSelector).first().width('')
	});
	
	// Find the max width of each column across all tables.
	var col_width = 0
	$("." + classname).each(function(index, elem) {
		col_width = Math.max(
			col_width,
			Math.ceil($(elem).find(targetSelector).first().width()))
	});
	
	// Set each column in each table to the max width of that column across all tables.
	$("." + classname).each(function(index, elem) {
		$(elem).find(targetSelector).first().width(col_width)
	});
}

function observeRowStickyStuckState() {
	if (typeof IntersectionObserver === 'function') {
		var stuckClassname = 'row-sticky--stuck'
		new IntersectionObserver(function(entries, observer) {
			var entry = entries[0]
			if (!entry.isIntersecting) {
				entry.target.classList.add(stuckClassname)
			} else {
				entry.target.classList.remove(stuckClassname)
			}
		}, { threshold: [1] }).observe(document.querySelector('.row-sticky'))
	}
}


var targetClassname = 'damagetable'
$(window).resize(updateWidth.bind(null, targetClassname));
$(function(){
	tooltip = $("<div>", { id: 'tooltip' }).appendTo('body');
	$('[data-tooltip]')
		.mouseenter(showTooltip)
		.mouseleave(hideTooltip);
	updateWidth(targetClassname);
	observeRowStickyStuckState();
});