Kevin's Worklog

Documenting the Daily Stream

OpenSeadragon as a WebJar

WebJars is a packaging of static resources so that they are available to JVM-based containers and Web frameworks. For instance, with a Servlet 3 container, you only need to add a WebJars-packaged version of a library, like Bootstrap, to your classpath and the static files contained within will be available from your Web application.

For instance, add the following to a Maven pom.xml file and a Jetty server running from within the build will be able to provide access to the Bootstrap files.


Your HTML only needs to contain the following reference:

<link rel='stylesheet' href='webjars/bootstrap/3.2.0/css/bootstrap.min.css'>

This works outside of the Maven context as well. Drop a WebJar into your Tomcat 7’s WEB-INF/lib directory and the static files contained within are accessible at the WebJars path. WebJars also work with the Play Framework, Grails, Ring (Clojure), and others.

In addition to being packaged within a jar file, these static files are also made available from jsDelivr, a free Content Delivery Network (CDN). For instance, see:


Once I learned about the WebJars project, I immediately liked it (and wondered if there was anything that I’d like to access that wasn’t already available in the WebJars format). Since I dabble with a fork of adore-djatoka, I thought it would make sense to publish the OpenSeadragon JavaScript library as a WebJar. So, I created a project to do just that: WebJars-OpenSeadragon.

It’s been accepted and published through the WebJars site. So, OpenSeadragon 1.1.1 is now also available from jsDelivr:


and from the following path, if the WebJars-OpenSeadragon jar is installed in your servlet container’s classpath:


To include WebJars-OpenSeadragon in a Maven-based project, you just need to include the following as a dependency in your pom.xml file.


My project contains a test subproject that uses WebJars-OpenSeadragon (if you’d like an example of using a WebJar from the Maven context). It also includes an HTML example of how to configure OpenSeadragon when using WebJars-OpenSeadragon:

<div id="contentDiv" class="openseadragonDiv"></div>
<script type="text/javascript">
    var viewer = OpenSeadragon({
        id: "contentDiv",
        prefixUrl: "/webjars/openseadragon/1.1.1/images/",
        tileSources: "testpattern.dzi",
        showNavigator: true

It’s that easy. My next step is to upgrade my djatoka fork to reference the OpenSeadragon WebJar (rather than provide it’s own repackaged version of OpenSeadragon). Thanks to the WebJars (and OpenSeadragon) folks for providing access to such fine tools!