Search code examples
glossary

Online glossary - simple (free) approach

I am sitting on a CSV file containing around 3000 terms and definitions relating to a medical speciality. I'd like to provide the info online, in the form of a glossary.

It needs to have the following features:

  • Display all terms as a list, with the definitions being presented when the term is clicked on.
  • The ability to search for a given term - the search should return not only terms that match the name, but also definitions that contain the search term.
  • The ability to link from one definition to another, i.e. if a definition contains another term word, I want the user to be able to click the word and be linked to the definition for that word. I have already prepared links in my CSV file by bounding all linkable words in definitions with [square brackets].
  • Free to create. I intend on making this an open resource so don't want to have to pay for the privilege.
  • This is a medical dictionary, and not a Wiki. Only I should be able to edit it.
  • Definitions are short and sweet - there are no pictures, and definitions rarely exceed 20 words.

A few years ago, this question was asked on SO. I've also come across this, but all the terms have to be input individually (rather than just being able to import a CSV file). I wonder if there are any new developments people are aware of, or something that might suits my needs a little better..?

I could do this from scratch, but it would be nice if there was already some open code which I could use. Failing that, a few pointers to get me started would be welcome. I'm willing to learn and use any language to implement this if I can't get a solution off-the-shelf.

Solution

  • Personally I would hand code some JavaScript that takes in the csv data and transforms it into jQuery Mobile enhanced HTML. What I mean by that is producing a regular <ul>-list and let jQM transform it into a filterable list view like this. The list view items themselves could be collapsibles, so you can achieve the "click to show description" behaviour.

    The links are slightly more tricky; you could attach (during the csv parsing process) a simple click handler that opens the desired description. Alternatively you could replace the filter field with the link text, though that can produce multiple results.

    jQuery Mobile has the advantage that it should work very nicely on mobile devices too. However, if you for some reason don't like it but think rolling out your own client-side JavaScript solution could be a good option, jQuery UI also has useful widgets, e.g. autocomplete and accordion.

    EDIT: Here's a quick demo of parsing csv data and producing a pretty filterable list out of it using jQM in about 15 lines of code: http://jsfiddle.net/gssMm/

    EDIT2: A revised version of the demo with 3003 items to give you an idea of the performance: http://jsfiddle.net/gssMm/1/