|
|
var httpGet = require('./httpGet') var ImageLoader = require('./ImageLoader') const displayBlock = require('./displayBlock') var showTimer
function showImage (image, dom) { var a = document.createElement('a') a.target = '_blank' a.href = image.id
let img = document.createElement('img') img.src = image.id a.appendChild(img)
dom.appendChild(a)
return img }
function showWikimediaImage (image, options, dom) { let img = document.createElement('img')
if (!options.size) { options.size = 800 }
httpGet( 'https://commons.wikimedia.org/wiki/File:' + encodeURIComponent(image.id), { forceServerLoad: true }, function (err, result) { if (err || !result) { return }
let m = result.body.match(/<a href="([^"]+\/)([0-9]+)(px-[^"\/]+)" class="mw-thumbnail-link"/) if (m) { let src = m[1] + options.size + m[3] let srcset = m[1] + options.size + m[3] + ' 1x, ' + m[1] + Math.ceil(options.size * 1.5) + m[3] + ' 1.5x, ' + m[1] + Math.ceil(options.size * 2) + m[3] + ' 2x'
let a = document.createElement('a') a.target = '_blank' a.href = 'https://commons.wikimedia.org/wiki/File:' + encodeURIComponent(image.id)
img.src = src img.srcset = srcset a.appendChild(img)
dom.appendChild(a) } } )
return img }
// feature: { id: 'File:xxx.jpg', type: 'wikimedia|url', url: 'https://...' }
function show (img, options, div) { div.innerHTML = ''
switch (img.type) { case 'wikimedia': return showWikimediaImage(img, options, div) break case 'url': return showImage(img, div) break default: } }
register_hook('show-details', function (data, category, dom, callback) { displayImages(data, category, dom, callback, 'details') })
register_hook('show-popup', function (data, category, dom, callback) { displayImages(data, category, dom, callback, 'popup') })
function displayImages(data, category, dom, callback, displayId) { var div = document.createElement('div') div.className = 'images' var imageWrapper var nextImageWrapper = document.createElement('div') let options
if (showTimer) { window.clearInterval(showTimer) }
var currentLoader = new ImageLoader(data)
data.detailsImageCounter = {}
currentLoader.next({ counter: data.detailsImageCounter, wrap: true }, function (err, data) { if (!data) { return callback(err) }
const block = displayBlock({ dom, content: div, title: displayId === 'popup' ? null : lang('images'), order: displayId === 'popup' ? -1 : 2 }) block.classList.add('empty')
imageWrapper = document.createElement('div') imageWrapper.className = 'imageWrapper' div.appendChild(imageWrapper)
options = { size: Math.max(imageWrapper.offsetWidth, imageWrapper.offsetHeight) }
let img = show(data, options, imageWrapper) if (img) { img.onload = () => { block.classList.remove('empty') dom.classList.add('hasImage') } }
if (displayId === 'details') { showTimer = window.setInterval(showNext, 5000) loadNext() } })
function loadNext () { currentLoader.next({ counter: data.detailsImageCounter, wrap: true }, function (err, data) { if (err) { return console.log("Can't load next image", err) }
show(data, options, nextImageWrapper) }) }
function showNext () { // when nothing was loaded, skip showing
if (nextImageWrapper.firstChild) { while (imageWrapper.firstChild) { imageWrapper.removeChild(imageWrapper.firstChild) }
while (nextImageWrapper.firstChild) { imageWrapper.appendChild(nextImageWrapper.firstChild) } }
loadNext() } }
register_hook('hide-details', function () { if (showTimer) { window.clearInterval(showTimer) } })
|