MediaWiki:Gadget-GlossaryGraph.js
Note: After publishing, you may have to bypass your browser's cache to see the changes.
- Firefox / Safari: Hold Shift while clicking Reload, or press either Ctrl-F5 or Ctrl-R (⌘-R on a Mac)
- Google Chrome: Press Ctrl-Shift-R (⌘-Shift-R on a Mac)
- Edge: Hold Ctrl while clicking Refresh, or press Ctrl-F5.
$(function() {
'use strict';
mw.loader.using(['ext.gadget.d3', 'mediawiki.api'], function() {
$('.glossary-graph').each(function() {
var $container = $(this);
var pageTitle = $container.data('page-title');
if (!pageTitle) {
$container.text('Error: No page title');
console.error('No page title found for container');
return;
}
var term = pageTitle.split(':').pop().toLowerCase();
new mw.Api().get({
action: 'askargs',
conditions: 'Category:Glossary Entries',
printouts: 'Glossary-Term|Glossary-Definition',
parameters: 'limit=50',
format: 'json',
formatversion: 2
}).done(function(data) {
console.log('SMW API response:', JSON.stringify(data, null, 2));
var results = data.query.results || {};
var links = [];
for (var page in results) {
if (results.hasOwnProperty(page) && page !== pageTitle) {
var definitions = results[page].printouts['Glossary-Definition'] || [];
if (definitions.length > 0 && definitions.some(function(def) {
return def.toLowerCase().indexOf(term) !== -1;
})) {
links.push({ title: page });
}
}
}
if (links.length === 0) {
$container.text('No connections found.');
console.log('No connections found for term:', term);
return;
}
var nodes = [{ id: pageTitle }];
var edges = [];
links.forEach(function(link) {
nodes.push({ id: link.title });
edges.push({ source: pageTitle, target: link.title });
});
$container.empty();
var width = 400, height = 300;
var svg = d3.select($container[0])
.append('svg')
.attr('width', width)
.attr('height', height)
.style('background-color', '#000000');
var simulation = d3.forceSimulation(nodes)
.force('link', d3.forceLink(edges).id(d => d.id).distance(100))
.force('charge', d3.forceManyBody().strength(-200))
.force('center', d3.forceCenter(width / 2, height / 2));
var link = svg.append('g')
.selectAll('line')
.data(edges)
.enter().append('line')
.attr('stroke', '#00FF00')
.attr('stroke-width', 2);
var node = svg.append('g')
.selectAll('g')
.data(nodes)
.enter().append('g')
.call(d3.drag()
.on('start', function(event, d) {
if (!event.active) simulation.alphaTarget(0.3).restart();
d.fx = d.x;
d.fy = d.y;
})
.on('drag', function(event, d) {
d.fx = event.x;
d.fy = event.y;
})
.on('end', function(event, d) {
if (!event.active) simulation.alphaTarget(0);
d.fx = null;
d.fy = null;
}));
node.append('circle')
.attr('r', 10)
.attr('fill', '#00CC00');
node.append('text')
.attr('dx', 12)
.attr('dy', '.35em')
.text(d => d.id.split(':').pop()) // Show short term name (e.g., "Dictum")
.style('fill', '#00FF00')
.style('font-family', 'IBMPlexMono, "Courier New", monospace')
.style('font-size', '12px');
node.append('title').text(d => d.id);
simulation.on('tick', function() {
link.attr('x1', d => d.source.x)
.attr('y1', d => d.source.y)
.attr('x2', d => d.target.x)
.attr('y2', d => d.target.y);
node.attr('transform', d => `translate(${d.x},${d.y})`);
});
}).fail(function(jqXHR, textStatus, errorThrown) {
$container.text('Error: API request failed');
console.error('SMW API error details:', {
status: textStatus,
error: errorThrown,
responseText: jqXHR.responseText,
statusCode: jqXHR.status,
url: 'https://www.ooda.wiki/api.php?action=askargs&conditions=Category:Glossary%20Entries&printouts=Glossary-Term|Glossary-Definition¶meters=limit=50&format=json&formatversion=2'
});
});
});
});
});