User:TheMcr/common.js - Revision history

TheMcr at 15:59, 5 April 2025

2025-04-05T15:59:31Z

@@ Line 1: / Line 1: @@
-(function () {
+document.addEventListener("DOMContentLoaded", function () {
-    // Create the tooltip element
+     const table = document.querySelector('.wikitable');
-     // Function to show the tooltip
+     // Apply fade-in effect
-     function showTooltip(event, content) {
+     table.style.opacity = 0;
-        tooltip.innerHTML = content;
+    table.style.transition = "opacity 2s";
-        tooltip.style.left = `${event.pageX + 15}px`;
+    setTimeout(function() {
-        tooltip.style.top = `${event.pageY + 15}px`;
+         table.style.opacity = 1;
-         tooltip.style.display = 'block';
+     }, 10);
-     // Function to hide the tooltip
+     // Hover effect for each row
-     function hideTooltip() {
+     const rows = table.querySelectorAll('tr');
-        tooltip.style.display = 'none';
+     rows.forEach(row => {
+         row.addEventListener('mouseenter', function() {
+             row.style.transform = "scale(1.05)";
-    // Function to fetch preview of the page
+            row.style.transition = "transform 0.3s ease, background-color 0.3s ease";
-    function fetchPreview(title, event) {
+            row.style.backgroundColor = "#f0f0f0";
-         const url = mw.util.wikiScript('api');
+        });
-    // Initialize previews for specific elements in the page
+         row.addEventListener('mouseleave', function() {
-    function initPreviews() {
+             row.style.transform = "scale(1)";
-        const body = document.body;
+            row.style.backgroundColor = ""; // reset background color
          });
      });
 });

TheMcr at 15:34, 5 April 2025

2025-04-05T15:34:42Z

← Older revision		Revision as of 15:34, 5 April 2025
Line 1:		Line 1:
	(function () {		(function () {
			// Create the tooltip element
	const tooltip = document.createElement('div');		const tooltip = document.createElement('div');
	tooltip.style.position = 'absolute';		tooltip.style.position = 'absolute';
Line 13:		Line 14:
	document.body.appendChild(tooltip);		document.body.appendChild(tooltip);

			// Function to show the tooltip
	function showTooltip(event, content) {		function showTooltip(event, content) {
	tooltip.innerHTML = content;		tooltip.innerHTML = content;
Line 20:		Line 22:
	}		}

			// Function to hide the tooltip
	function hideTooltip() {		function hideTooltip() {
	tooltip.style.display = 'none';		tooltip.style.display = 'none';
	}		}

			// Function to fetch preview of the page
	function fetchPreview(title, event) {		function fetchPreview(title, event) {
	~~$.getJSON(~~		const url = mw.util.wikiScript('api');
	mw.util.wikiScript('api'), {		const params = {
	action: 'query',		action: 'query',
	prop: 'extracts\|pageimages',		prop: 'extracts\|pageimages',
	exintro: true,		exintro: true,
	explaintext: true,		explaintext: true,
	titles: title,		titles: title,
	format: 'json',		format: 'json',
	pithumbsize: 120		pithumbsize: 120
	}		};
	~~).done(function (data) {~~
	~~const page = data.query.pages[Object.keys(data.query.pages)[0]];~~
	~~if (page.missing) return~~;

	let content = `<strong>${page.title}</strong><br>`;		// Perform the API request
	if (page.thumbnail && page.thumbnail.source) {		fetch(`${url}?${new URLSearchParams(params)}`)
	content += `<img src="${page.thumbnail.source}" style="float:left; margin-right:10px;" />`;		.then(response => response.json())
	}		.then(data => {
	content += `<div>${page.extract \|\| 'No summary available.'}</div>`;		const page = data.query.pages[Object.keys(data.query.pages)[0]];
	showTooltip(event, content);		if (page.missing) return;
	});
			let content = `<strong>${page.title}</strong><br>`;
			if (page.thumbnail && page.thumbnail.source) {
			content += `<img src="${page.thumbnail.source}" style="float:left; margin-right:10px;" />`;
			}
			content += `<div>${page.extract \|\| 'No summary available.'}</div>`;
			showTooltip(event, content);
			});
	}		}

			// Initialize previews for specific elements in the page
	function initPreviews() {		function initPreviews() {
	~~$('#bodyContent a').each(function () {~~		const body = document.body;
	const ~~$link~~ = ~~$(this)~~;		const links = body.querySelectorAll('body a');
	const ~~href~~ = ~~$link~~.~~attr~~('~~href~~');

			links.forEach(link => {
			const href = link.getAttribute('href');
	if (!href \|\| !href.startsWith('/boobs/') \|\| href.includes(':')) return;		if (!href \|\| !href.startsWith('/boobs/') \|\| href.includes(':')) return;

Line 59:		Line 69:
	let hoverTimer;		let hoverTimer;

	$link.~~hover~~(		// Event listeners for hover and mousemove
	function (e) {		link.addEventListener('mouseenter', function (e) {
	hoverTimer = setTimeout(() => fetchPreview(title, e), 300);		hoverTimer = setTimeout(() => fetchPreview(title, e), 300);
	},		});
	function () {
	clearTimeout(hoverTimer);		link.addEventListener('mouseleave', function () {
	hideTooltip();		clearTimeout(hoverTimer);
	}		hideTooltip();
	).mousemove(function (e) {		});

			link.addEventListener('mousemove', function (e) {
	tooltip.style.left = `${e.pageX + 15}px`;		tooltip.style.left = `${e.pageX + 15}px`;
	tooltip.style.top = `${e.pageY + 15}px`;		tooltip.style.top = `${e.pageY + 15}px`;
Line 74:		Line 86:
	}		}

	$(initPreviews);		// Initialize the tooltip previews when the page content is loaded
			document.addEventListener('DOMContentLoaded', initPreviews);
	})();		})();

TheMcr at 15:20, 5 April 2025

2025-04-05T15:20:13Z

← Older revision		Revision as of 15:20, 5 April 2025
Line 37:		Line 37:
	).done(function (data) {		).done(function (data) {
	const page = data.query.pages[Object.keys(data.query.pages)[0]];		const page = data.query.pages[Object.keys(data.query.pages)[0]];
			if (page.missing) return;

	let content = `<strong>${page.title}</strong><br>`;		let content = `<strong>${page.title}</strong><br>`;
	if (page.thumbnail && page.thumbnail.source) {		if (page.thumbnail && page.thumbnail.source) {
Line 51:		Line 53:
	const href = $link.attr('href');		const href = $link.attr('href');

	if (!href \|\| href.~~indexOf~~('/boobs/') ~~!== 0~~ \|\| href.~~indexOf~~(':') ~~!== -1~~) return;		if (!href \|\| !href.startsWith('/boobs/') \|\| href.includes(':')) return;

	const title = decodeURIComponent(href.replace(/^\/boobs\//, '')).replace(/_/g, ' ');		const title = decodeURIComponent(href.replace(/^\/boobs\//, '')).replace(/_/g, ' ');

			let hoverTimer;

	$link.hover(		$link.hover(
	function (e) {		function (e) {
	fetchPreview(title, e);		hoverTimer = setTimeout(() => fetchPreview(title, e), 300);
	},		},
	function () {		function () {
			clearTimeout(hoverTimer);
	hideTooltip();		hideTooltip();
	}		}
Line 71:		Line 76:
	$(initPreviews);		$(initPreviews);
	})();		})();

	~~mw.loader.load('/wiki/MediaWiki:Gadget-PagePreview.js&action=raw&ctype=text/javascript');~~

TheMcr at 15:16, 5 April 2025

2025-04-05T15:16:45Z

← Older revision		Revision as of 15:16, 5 April 2025
Line 51:		Line 51:
	const href = $link.attr('href');		const href = $link.attr('href');

	if (!href \|\| href.indexOf('/boobs/') !== 0 \|\| href.indexOf(':') !== -1) return; ~~// skip special pages~~		if (!href \|\| href.indexOf('/boobs/') !== 0 \|\| href.indexOf(':') !== -1) return;

	const title = decodeURIComponent(href.replace(/^\/boobs\//, '')).replace(/_/g, ' ');		const title = decodeURIComponent(href.replace(/^\/boobs\//, '')).replace(/_/g, ' ');

TheMcr at 15:12, 5 April 2025

2025-04-05T15:12:51Z

← Older revision		Revision as of 15:12, 5 April 2025
Line 71:		Line 71:
	$(initPreviews);		$(initPreviews);
	})();		})();

			mw.loader.load('/wiki/MediaWiki:Gadget-PagePreview.js&action=raw&ctype=text/javascript');

TheMcr at 15:07, 5 April 2025

2025-04-05T15:07:24Z

← Older revision		Revision as of 15:07, 5 April 2025
Line 51:		Line 51:
	const href = $link.attr('href');		const href = $link.attr('href');

	if (!href \|\| href.indexOf('/~~wiki~~/') !== 0 \|\| href.indexOf(':') !== -1) return; // skip special pages		if (!href \|\| href.indexOf('/boobs/') !== 0 \|\| href.indexOf(':') !== -1) return; // skip special pages

	const title = decodeURIComponent(href.replace(/^\/~~wiki~~\//, '')).replace(/_/g, ' ');		const title = decodeURIComponent(href.replace(/^\/boobs\//, '')).replace(/_/g, ' ');

	$link.hover(		$link.hover(

TheMcr at 15:05, 5 April 2025

2025-04-05T15:05:55Z

@@ Line 1: / Line 1: @@
-const tooltip = document.createElement('div');
+    function showTooltip(event, content) {
-tooltip.className = 'tooltip';
+        tooltip.innerHTML = content;
-tooltip.style.display = 'none';
+        tooltip.style.left = `${event.pageX + 15}px`;
-tooltip.style.width = '300px';
+        tooltip.style.top = `${event.pageY + 15}px`;
-tooltip.style.z-index = '1000';
+        tooltip.style.display = 'block';
-document.body.appendChild(tooltip);
-document.querySelectorAll('a').forEach(link => {
+    function hideTooltip() {
-  link.addEventListener('mouseenter', async (e) => {
+        tooltip.style.display = 'none';
-    const url = new URL(link.href);
-     tooltip.style.display = 'block';
+     function fetchPreview(title, event) {
-    tooltip.innerHTML = 'Loading...';
+        $.getJSON(
-     const response = await fetch(`https://www.boobpedia.com/${title}`);
+     function initPreviews() {
-    const data = await response.json();
+        $('#bodyContent a').each(function () {
-    tooltip.innerHTML = `
+            if (!href || href.indexOf('/wiki/') !== 0 || href.indexOf(':') !== -1) return; // skip special pages
-    const rect = link.getBoundingClientRect();
+            const title = decodeURIComponent(href.replace(/^\/wiki\//, '')).replace(/_/g, ' ');
-  link.addEventListener('mouseleave', () => {
+            $link.hover(
-    tooltip.style.display = 'none';
+                function (e) {
-  });
+                    fetchPreview(title, e);
-});
+                },

TheMcr at 14:53, 5 April 2025

2025-04-05T14:53:34Z

← Older revision		Revision as of 14:53, 5 April 2025
Line 1:		Line 1:

	~~const tooltip = document.createElement('div');~~
	~~tooltip.className = 'tooltip';~~
	~~tooltip.style.display = 'none';~~
	~~tooltip.style.width = '300px';~~
	~~tooltip.style.z-index = '1000';~~
	~~document.body.appendChild(tooltip);~~

	~~document.querySelectorAll('a').forEach(link => {~~
	~~link.addEventListener('mouseenter', async (e) => {~~
	~~const url = new URL(link.href);~~
	~~const title = decodeURIComponent(url.pathname.split('/').pop());~~

	~~tooltip.style.display = 'block';~~
	~~tooltip.innerHTML = 'Loading...';~~

	~~const response = await fetch(`https://www.boobpedia.com/${title}`);~~
	~~const data = await response.json();~~

	~~tooltip.innerHTML = `~~
	~~<strong>${data.title}</strong><br>~~
	~~${data.thumbnail ? `<img src="${data.thumbnail.source}" alt="${data.title}">` : ''}~~
	~~<p>${data.extract}</p>~~
	`;

	~~const rect = link.getBoundingClientRect();~~
	~~tooltip.style.left = `${rect.right + 10 + window.scrollX}px`;~~
	~~tooltip.style.top = `${rect.top + window.scrollY}px`;~~
	~~});~~

	~~link.addEventListener('mouseleave', () => {~~
	~~tooltip.style.display = 'none';~~
	~~});~~
	~~});~~
	~~<script>~~
	const tooltip = document.createElement('div');		const tooltip = document.createElement('div');
	tooltip.className = 'tooltip';		tooltip.className = 'tooltip';

TheMcr at 14:52, 5 April 2025

2025-04-05T14:52:25Z

← Older revision		Revision as of 14:52, 5 April 2025
Line 1:		Line 1:
	~~<script>~~
	const tooltip = document.createElement('div');		const tooltip = document.createElement('div');
	tooltip.className = 'tooltip';		tooltip.className = 'tooltip';
Line 67:		Line 67:
	});		});
	});		});
	~~</script>~~

TheMcr at 14:46, 5 April 2025

2025-04-05T14:46:06Z

@@ Line 1: / Line 1: @@
-document.addEventListener('DOMContentLoaded', function () {
+<script>
-    // Handle images
+const tooltip = document.createElement('div');
-    var images = document.querySelectorAll('img'); // Select all images on the page
+tooltip.className = 'tooltip';
-   images.forEach(function (image) {
+document.querySelectorAll('a').forEach(link => {
-    // On mouse enter (hover)
+  link.addEventListener('mouseenter', async (e) => {
-    image.addEventListener('mouseenter', function () {
+    const url = new URL(link.href);
-        image.style.transition = 'transform 0.3s ease, box-shadow 0.3s ease';  // Smooth transition for scaling and shadow
+    const title = decodeURIComponent(url.pathname.split('/').pop());
-     // On mouse leave (hover out)
+     tooltip.style.display = 'block';
-    image.addEventListener('mouseleave', function () {
+    tooltip.innerHTML = 'Loading...';
 });
 });