Link to Wikipedia article pages in pure JavaScript

While watching, I came across this blog post about using the Wikipedia API from JavaScript to associate one search term with it. At the end of the blog post, the author mentions possible extensions, including:

A plugin that automatically associates terms with Wikipedia articles.

This works great for a bill for a project requirement I'm working on, but unfortunately I lack programming skills to extend the source code . I would like to have a clean JavaScript snippet that I can add to a webpage that links all the terms on this webpage that has an article on the internal wiki for this wiki.

I know this may require a lot, but the code looks something like this, and I’m ready to add generosity if someone does the rest of the work for this virtual loan ..;) I also suspect that this may be useful for several others, because I saw similar requests, but has no working implementation (which includes only the JavaScript library / snippet (and therefore portable)).

Here is a sample source code, I hope someone can add to this or tell me what I will need to add if I implemented it myself (in this case I will share the code if I manage to put something together )

<script type="text/javascript"><!--
var spellcheck = function (data) {
    var found = false; var url=''; var text = data [0];
    if (text != document.getElementById ('spellcheckinput').value)
        return;
    for (i=0; i<data [1].length; i++) {
        if (text.toLowerCase () == data [1] [i].toLowerCase ()) {
            found = true;
            url ='http://en.wikipedia.org/wiki/' + text;
            document.getElementById ('spellcheckresult').innerHTML = '<b style="color:green">Correct</b> - <a target="_top" href="' + url + '">link</a>';
        }
    }
    if (! found)
        document.getElementById ('spellcheckresult').innerHTML = '<b style="color:red">Incorrect</b>';
};

var getjs = function (value) {
    if (! value)
        return;
    url = 'http://en.wikipedia.org/w/api.php?action=opensearch&search='+value+'&format=json&callback=spellcheck';
    document.getElementById ('spellcheckresult').innerHTML = 'Checking ...';
    var elem = document.createElement ('script');
    elem.setAttribute ('src', url);
    elem.setAttribute ('type','text/javascript');
    document.getElementsByTagName ('head') [0].appendChild (elem);
};--></script>
<form action="#" method="get" onsubmit="return false"> 
<p>Enter a word - <input id="spellcheckinput" onkeyup="getjs (this.value);" type="text"> <span id="spellcheckresult"></span></p></form>

Update
As noted in the comments, both the time it would take to connect all the words, and how to process several names covering the articles were also my problems.

I think that starting with one-word articles, a large percentage of use cases will already be covered, perhaps some performance benefits are obtained by skipping the 500 most common words in English, but I'm still not sure how possible this approach will be ..

At the same time, all this will be on the client side, and some delay in relation to links is quite acceptable.

, /, , , .


2

"Pointy" , , api.php?action=query&list=allpages.
: , , , , , .

- , , , , .

+5
1

, - :

HTML/Text:

<div id="theText">Testing the auto link system here...</div>

.

dictionary.js . , php , . - ( window.termsRE). , termlinker.js.

, RegExp, , terms , \\ []\.?*+|(){}^&

// dictionary.js - define some terms
var terms = ['testing', 'auto link'];
window.termsRE = new RegExp("\\b("+terms.join("|")+")\\b",'gi');

termlinker.js - . <script>. , dictionary.js.

// termlinker.js - add some tags
var element = document.getElementById("theText");

element.innerHTML = element.innerHTML.replace(termsRE, function(term) {
  return "<a href='http://en.wikipedia.org/wiki/"+escape(term)+"'>"+term+"</a>";
}); 

. , HTML-, .

( jsbin)


API

" " , API jsbin preview

// Utility Function
RegExp.escape = function(text) {
  if (!arguments.callee.sRE) {
    var specials = [
      '/', '.', '*', '+', '?', '|',
      '(', ')', '[', ']', '{', '}', '\\'
    ];
    arguments.callee.sRE = new RegExp(
      '(\\' + specials.join('|\\') + ')', 'g'
    );
  }
  return text.replace(arguments.callee.sRE, '\\$1');
};

// JSONP Callback for receiving the API
function receiveAPI(data) {
  var terms = [];
  if (!data || !data['query'] || !data['query']['allpages']) return false;  
  var pages = data.query.allpages
  for (var x in pages) {
    terms.push(RegExp.escape(pages[x].title));
  }
  window.termsRE = new RegExp("\\b("+terms.reverse().join("|")+")\\b",'gi');
  linkterms();
}  

function linkterms() {
  var element = document.getElementById("theText");

  element.innerHTML = element.innerHTML.replace(termsRE, function(term) {
    return "<a href='http://en.wikipedia.org/wiki/"+escape(term)+"'>"+term+"</a>";
  });
}


// the apfrom=testing can be removed, it is only there so that
// we can get some useful terms near "testing" to work with.
// we are limited to 500 terms for the purpose of this demo:
url = 'http://en.wikipedia.org/w/api.php?action=query&list=allpages&aplimit=500&format=json&callback=receiveAPI' + '&apfrom=testing';
var elem = document.createElement('script');
elem.setAttribute('src', url);
elem.setAttribute('type','text/javascript');
document.getElementsByTagName('head')[0].appendChild (elem);
+5

All Articles