MediaWiki:Common.js: Difference between revisions
Jump to navigation
Jump to search
mNo edit summary |
mNo edit summary |
||
| Line 1: | Line 1: | ||
( function () { | ( function () { | ||
'use strict'; | 'use strict'; | ||
var DEFAULTS = { | var DEFAULTS = { | ||
minBytes: 3000, | minBytes: 3000, | ||
dailyStable: true, | |||
blurbChars: 200 | |||
}; | }; | ||
function init() { | function init() { | ||
var panels = document.querySelectorAll( '.lhc-article' ); | var panels = document.querySelectorAll( '.lhc-article' ); | ||
| Line 19: | Line 18: | ||
} ); | } ); | ||
} | } | ||
function start( api, panel ) { | function start( api, panel ) { | ||
var category = panel.getAttribute( 'data-category' ); | |||
if ( category ) { | |||
return pickRandom( api, panel, category ).catch( function () { | |||
} ); | |||
} | |||
var page = resolvePage( panel ); | var page = resolvePage( panel ); | ||
if ( page ) { | if ( page ) { | ||
return loadArticle( api, panel, page ).catch( function () { | return loadArticle( api, panel, page ).catch( function () {} ); | ||
} | } | ||
} | } | ||
function resolvePage( panel ) { | function resolvePage( panel ) { | ||
var explicit = panel.getAttribute( 'data-page' ); | var explicit = panel.getAttribute( 'data-page' ); | ||
| Line 50: | Line 47: | ||
return title; | return title; | ||
} | } | ||
function pickRandom( api, panel, category ) { | function pickRandom( api, panel, category ) { | ||
var minBytes = parseInt( panel.getAttribute( 'data-min-bytes' ), 10 ); | var minBytes = parseInt( panel.getAttribute( 'data-min-bytes' ), 10 ); | ||
| Line 56: | Line 53: | ||
minBytes = DEFAULTS.minBytes; | minBytes = DEFAULTS.minBytes; | ||
} | } | ||
return api.get( { | return api.get( { | ||
action: 'query', | action: 'query', | ||
| Line 68: | Line 65: | ||
} ).then( function ( data ) { | } ).then( function ( data ) { | ||
var pages = ( data.query && data.query.pages ) || []; | var pages = ( data.query && data.query.pages ) || []; | ||
var candidates = pages.filter( function ( p ) { | var candidates = pages.filter( function ( p ) { | ||
return p.length >= minBytes; | return p.length >= minBytes; | ||
} ).sort( function ( a, b ) { | } ).sort( function ( a, b ) { | ||
return a.title.localeCompare( b.title ); | return a.title.localeCompare( b.title ); | ||
} ); | } ); | ||
if ( !candidates.length ) { | if ( !candidates.length ) { | ||
mw.log.warn( '[lhc-article] no candidates in ' + category ); | mw.log.warn( '[lhc-article] no candidates in ' + category + | ||
' (' + pages.length + ' pages, min ' + minBytes + ' bytes)' ); | |||
return; | return; | ||
} | } | ||
return loadArticle( | return loadArticle( | ||
api, panel, candidates[ pickIndex( candidates.length ) ].title | api, panel, candidates[ pickIndex( candidates.length ) ].title | ||
| Line 86: | Line 83: | ||
} ); | } ); | ||
} | } | ||
function pickIndex( n ) { | function pickIndex( n ) { | ||
if ( !DEFAULTS.dailyStable ) { | if ( !DEFAULTS.dailyStable ) { | ||
| Line 100: | Line 97: | ||
return h % n; | return h % n; | ||
} | } | ||
function loadArticle( api, panel, title ) { | function loadArticle( api, panel, title ) { | ||
return api.get( { | return api.get( { | ||
| Line 116: | Line 113: | ||
var doc = new DOMParser().parseFromString( html, 'text/html' ); | var doc = new DOMParser().parseFromString( html, 'text/html' ); | ||
render( panel, { | render( panel, { | ||
title: data.parse.title || title, | title: data.parse.title || title, | ||
image: extractImage( doc ), | image: extractImage( doc ), | ||
| Line 123: | Line 119: | ||
} ); | } ); | ||
} | } | ||
function extractImage( doc ) { | function extractImage( doc ) { | ||
var img = doc.querySelector( | var img = doc.querySelector( | ||
'.infobox img, .infobox-image img, table.infobox img' | '.infobox img, .infobox-image img, table.infobox img' | ||
) || doc.querySelector( 'img' ); | ) || doc.querySelector( 'img' ); | ||
if ( !img ) { | if ( !img ) { | ||
return null; | return null; | ||
| Line 144: | Line 140: | ||
return src; | return src; | ||
} | } | ||
function extractBlurb( doc ) { | function extractBlurb( doc ) { | ||
var junk = doc.querySelectorAll( | var junk = doc.querySelectorAll( | ||
| Line 153: | Line 149: | ||
el.parentNode.removeChild( el ); | el.parentNode.removeChild( el ); | ||
} ); | } ); | ||
var paras = doc.querySelectorAll( 'p' ); | var paras = doc.querySelectorAll( 'p' ); | ||
for ( var i = 0; i < paras.length; i++ ) { | for ( var i = 0; i < paras.length; i++ ) { | ||
| Line 163: | Line 159: | ||
return null; | return null; | ||
} | } | ||
function truncate( text, max ) { | function truncate( text, max ) { | ||
if ( text.length <= max ) { | if ( text.length <= max ) { | ||
| Line 172: | Line 168: | ||
return ( space > 0 ? cut.slice( 0, space ) : cut ) + '…'; | return ( space > 0 ? cut.slice( 0, space ) : cut ) + '…'; | ||
} | } | ||
function render( panel, article ) { | function render( panel, article ) { | ||
var href = mw.util.getUrl( article.title ); | var href = mw.util.getUrl( article.title ); | ||
var wrap = document.createElement( 'div' ); | var wrap = document.createElement( 'div' ); | ||
wrap.className = 'lhc-ra'; | wrap.className = 'lhc-ra'; | ||
if ( article.image ) { | if ( article.image ) { | ||
var link = document.createElement( 'a' ); | var link = document.createElement( 'a' ); | ||
| Line 188: | Line 184: | ||
wrap.appendChild( link ); | wrap.appendChild( link ); | ||
} | } | ||
var heading = document.createElement( 'div' ); | var heading = document.createElement( 'div' ); | ||
heading.className = 'lhc-ra-title'; | heading.className = 'lhc-ra-title'; | ||
| Line 196: | Line 192: | ||
heading.appendChild( titleLink ); | heading.appendChild( titleLink ); | ||
wrap.appendChild( heading ); | wrap.appendChild( heading ); | ||
if ( article.blurb ) { | if ( article.blurb ) { | ||
var p = document.createElement( 'p' ); | var p = document.createElement( 'p' ); | ||
| Line 203: | Line 199: | ||
wrap.appendChild( p ); | wrap.appendChild( p ); | ||
} | } | ||
var more = document.createElement( 'a' ); | var more = document.createElement( 'a' ); | ||
more.href = href; | more.href = href; | ||
| Line 209: | Line 205: | ||
more.textContent = 'Read the full article →'; | more.textContent = 'Read the full article →'; | ||
wrap.appendChild( more ); | wrap.appendChild( more ); | ||
panel.textContent = ''; | panel.textContent = ''; | ||
panel.appendChild( wrap ); | panel.appendChild( wrap ); | ||
} | } | ||
mw.loader.using( [ 'mediawiki.api', 'mediawiki.util' ] ).then( function () { | mw.loader.using( [ 'mediawiki.api', 'mediawiki.util' ] ).then( function () { | ||
if ( document.readyState !== 'loading' ) { | if ( document.readyState !== 'loading' ) { | ||
| Line 221: | Line 217: | ||
} | } | ||
} ); | } ); | ||
}() ); | }() ); | ||
Revision as of 04:41, 14 August 2026
( function () {
'use strict';
var DEFAULTS = {
minBytes: 3000,
dailyStable: true,
blurbChars: 200
};
function init() {
var panels = document.querySelectorAll( '.lhc-article' );
if ( !panels.length ) {
return;
}
var api = new mw.Api();
Array.prototype.forEach.call( panels, function ( panel ) {
start( api, panel );
} );
}
function start( api, panel ) {
var category = panel.getAttribute( 'data-category' );
if ( category ) {
return pickRandom( api, panel, category ).catch( function () {
} );
}
var page = resolvePage( panel );
if ( page ) {
return loadArticle( api, panel, page ).catch( function () {} );
}
}
function resolvePage( panel ) {
var explicit = panel.getAttribute( 'data-page' );
if ( explicit ) {
return explicit;
}
var link = panel.querySelector( 'a[title]' );
if ( !link ) {
return null;
}
var title = link.getAttribute( 'title' );
if ( /\(page does not exist\)$/.test( title ) ) {
return null;
}
return title;
}
function pickRandom( api, panel, category ) {
var minBytes = parseInt( panel.getAttribute( 'data-min-bytes' ), 10 );
if ( isNaN( minBytes ) ) {
minBytes = DEFAULTS.minBytes;
}
return api.get( {
action: 'query',
generator: 'categorymembers',
gcmtitle: 'Category:' + category,
gcmnamespace: 0,
gcmtype: 'page',
gcmlimit: 'max',
prop: 'info',
formatversion: 2
} ).then( function ( data ) {
var pages = ( data.query && data.query.pages ) || [];
var candidates = pages.filter( function ( p ) {
return p.length >= minBytes;
} ).sort( function ( a, b ) {
return a.title.localeCompare( b.title );
} );
if ( !candidates.length ) {
mw.log.warn( '[lhc-article] no candidates in ' + category +
' (' + pages.length + ' pages, min ' + minBytes + ' bytes)' );
return;
}
return loadArticle(
api, panel, candidates[ pickIndex( candidates.length ) ].title
);
} );
}
function pickIndex( n ) {
if ( !DEFAULTS.dailyStable ) {
return Math.floor( Math.random() * n );
}
var d = new Date();
var key = d.getUTCFullYear() + '-' +
( d.getUTCMonth() + 1 ) + '-' + d.getUTCDate();
var h = 2166136261;
for ( var i = 0; i < key.length; i++ ) {
h = ( h ^ key.charCodeAt( i ) ) * 16777619 >>> 0;
}
return h % n;
}
function loadArticle( api, panel, title ) {
return api.get( {
action: 'parse',
page: title,
prop: 'text',
section: 0,
redirects: 1,
formatversion: 2
} ).then( function ( data ) {
var html = data.parse && data.parse.text;
if ( !html ) {
return;
}
var doc = new DOMParser().parseFromString( html, 'text/html' );
render( panel, {
title: data.parse.title || title,
image: extractImage( doc ),
blurb: extractBlurb( doc )
} );
} );
}
function extractImage( doc ) {
var img = doc.querySelector(
'.infobox img, .infobox-image img, table.infobox img'
) || doc.querySelector( 'img' );
if ( !img ) {
return null;
}
var src = img.getAttribute( 'src' );
if ( !src ) {
return null;
}
if ( src.indexOf( '//' ) === 0 ) {
return location.protocol + src;
}
if ( src.indexOf( '/' ) === 0 ) {
return location.origin + src;
}
return src;
}
function extractBlurb( doc ) {
var junk = doc.querySelectorAll(
'table, .infobox, .navbox, .hatnote, .thumb, ' +
'sup.reference, .mw-editsection, .noexcerpt, style'
);
Array.prototype.forEach.call( junk, function ( el ) {
el.parentNode.removeChild( el );
} );
var paras = doc.querySelectorAll( 'p' );
for ( var i = 0; i < paras.length; i++ ) {
var text = paras[ i ].textContent.replace( /\s+/g, ' ' ).trim();
if ( text.length > 40 ) {
return truncate( text, DEFAULTS.blurbChars );
}
}
return null;
}
function truncate( text, max ) {
if ( text.length <= max ) {
return text;
}
var cut = text.slice( 0, max );
var space = cut.lastIndexOf( ' ' );
return ( space > 0 ? cut.slice( 0, space ) : cut ) + '…';
}
function render( panel, article ) {
var href = mw.util.getUrl( article.title );
var wrap = document.createElement( 'div' );
wrap.className = 'lhc-ra';
if ( article.image ) {
var link = document.createElement( 'a' );
link.href = href;
var img = document.createElement( 'img' );
img.src = article.image;
img.alt = article.title;
link.appendChild( img );
wrap.appendChild( link );
}
var heading = document.createElement( 'div' );
heading.className = 'lhc-ra-title';
var titleLink = document.createElement( 'a' );
titleLink.href = href;
titleLink.textContent = article.title;
heading.appendChild( titleLink );
wrap.appendChild( heading );
if ( article.blurb ) {
var p = document.createElement( 'p' );
p.className = 'lhc-ra-blurb';
p.textContent = article.blurb;
wrap.appendChild( p );
}
var more = document.createElement( 'a' );
more.href = href;
more.className = 'lhc-ra-more';
more.textContent = 'Read the full article →';
wrap.appendChild( more );
panel.textContent = '';
panel.appendChild( wrap );
}
mw.loader.using( [ 'mediawiki.api', 'mediawiki.util' ] ).then( function () {
if ( document.readyState !== 'loading' ) {
init();
} else {
document.addEventListener( 'DOMContentLoaded', init );
}
} );
}() );