export default { install (Vue) { //Takes a HTML string then parses it and replaces appropriate //links with the relevant expansion //Returns a callback with the 'expanded' HTML string Vue.prototype.$linkExpander = function (HTML, cb) { let parsed = document.createElement('div'); parsed.innerHTML = HTML; let expandPatterns = { 'wikipedia': { hostnameRegExp: /[a-z]+\.wikipedia\.org/, pathnameRegExp: /\/wiki\/.+/, getURL (link) { let page = link.pathname.split('/').slice(-1)[0]; let countryVersion = link.hostname.split('.')[0]; return `https://${countryVersion}.wikipedia.org/api/rest_v1/page/summary/${page}?redirect=true`; }, getContent (link, data) { let content = data.extract.slice(0, 500).trim(); return { title: data.titles.display, URL: data.content_urls.desktop.page, content: content.length > 500 ? content + '...' : content } } }, 'github': { hostnameRegExp: /github\.com/, pathnameRegExp: /\/.+\/.+/, getURL (link) { return 'https://api.github.com/repos' + link.pathname; }, getContent (link, data) { return { title: data.full_name, URL: data.html_url, content: data.description } } } }; let links = Array .from(parsed.querySelectorAll('p a[href]')) .filter(a => { return ( a.parentNode.parentNode === parsed && a.parentNode.childNodes.length === 1 && a.innerHTML === a.href ) }); let expandableLinks = {}; links.forEach(link => { for(let expandName in expandPatterns) { let expand = expandPatterns[expandName]; if( expand.hostnameRegExp.test(link.hostname) && expand.pathnameRegExp.test(link.pathname) ) { if(!expandableLinks[expandName]) { expandableLinks[expandName] = []; } expandableLinks[expandName].push(link); break; } } }); for(let expandName in expandableLinks) { let expandPattern = expandPatterns[expandName]; expandableLinks[expandName].forEach(link => { let URL = expandPattern.getURL(link); Vue.axios .get(URL) .then(res => { let content = expandPattern.getContent(link, res.data); let h = document.createElement.bind(document); let div = h('div'); let h2 = h('h2'); let a = h('a'); let span = h('span'); let textNode = document.createTextNode(content.content); a.textContent = content.title; a.href = content.URL; a.setAttribute('target', '_blank'); a.setAttribute('rel', 'noopener noreferrer'); span.textContent = 'from ' + link.hostname; h2.appendChild(a); h2.appendChild(span); div.appendChild(h2) div.appendChild(textNode) div.classList.add('expanded_link'); link.parentNode.replaceChild(div, link); completedAPICall(); }) .catch(completedAPICall); }); } let completed = 0; let completedAPICall = () => { completed++; if(completed === links.length) { cb(parsed.innerHTML); } } } } }