Interactive publications lists with JavaScript + Bibtex
JavaScript HTML TeX Other
Switch branches/tags
Nothing to show
Latest commit af7c52f Mar 5, 2017 @vkaravir Update built files
Permalink
Failed to load latest commit information.
build Update built files Mar 5, 2017
lib Re-implemented bar chart, removed protovis, colors indicate type of p… Apr 20, 2013
src Remove use of deprecated .size() Mar 5, 2017
tools Added a makefile Aug 8, 2011
Jakefile
Makefile Re-implemented bar chart, removed protovis, colors indicate type of p… Apr 20, 2013
README.md Add option to pass options to datatables (fixes #16) Sep 24, 2016
bib-publication-list.css Multiple pub tables can be on one page (see #6) May 28, 2013
example.bib Ordered the entries in the example by year. Mar 30, 2011
example.html Fix the example to use newer jQuery Sep 24, 2016

README.md

bib-publication-list to automatically generate an interactive HTML publication list from a BibTeX file

Getting Started

First, load the required JavaScript files:

<script src="jquery.min.js"></script>
<script src="bib-list-min.js"></script>

Include the CSS:

<link rel="stylesheet" href="bib-publication-list.css" type="text/css" />

All you need to do is to include the BibTeX into an HTML page and tell the script to turn it into a sortable and searchable table. For example:

<table id="pubTable" class="display"></table>
<pre id="bibtex">@article{Karavirta:JVLCTaxonomy,
   title = {A comprehensive taxonomy of algorithm animation languages},
   journal = {Journal of Visual Languages \& Computing},
   volume = {20},
   number = {1},
   pages = {1--22},
   year = {2010},
   issn = {1045-926X},
   doi = {DOI: 10.1016/j.jvlc.2009.09.001},
   author = {Ville Karavirta and Ari Korhonen and Lauri Malmi and Thomas Naps}
}
</pre>

Finally, the bib-publication-list needs to know the input data element and the output table. So, one line of JavaScript:

bibtexify("#bibtex", "pubTable");

Alternatively, the bibtex can be loaded from a file. Personally I prefer including it in the HTML, though. This way, browsers without JavaScript enabled get at least to see the bibtex instead of a blank page. This causes an ugly-looking flash of unstyled content, though.

bibtexify("example-biblist.bib", "pubTable");

The result looks like my publication list at: http://villekaravirta.com/publications/.

If you want to fix the flash of unstyled content, you can hide the #bibtex element and make it visible when JavaScript is disabled. To do that, add

#bibtex { display: none; }

to your CSS and

<noscript><style>#bibtex { display: block; }</style></noscript>

to your HTML.

Configuration Options

The bibtexify function accepts an optional third parameter for configuration options. These options include:

visualizationA boolean to control addition of the visualization. Defaults to true.
tweetTwitter username to add Tweet links to bib items with a url field.
sortingControl the default sorting of the list. Defaults to `[[0, "desc"], [1, "desc"]]`. See (https://legacy.datatables.net/api#fnSort) for details on formatting.
datatablePass options to the datatable library used to create the table of publications. See (https://legacy.datatables.net/api) for available options.
defaultYearEntries without a year will use this as year. Defaults to "To Appear".

Building from source

There is a Jakefile for building the combined and minified versions with Jake and a Makefile for building with make.

Credits

This code uses some great libraries: jQuery, DataTables, and JavaScript BibTeX Parser.