Friday, 7 June 2013

Knocking out a web based PDF viewer

Friday, 7 June 2013 13:04
Last month, I spent some time learning KnockoutJS. I then used it to build a simple ASP.NET project which allows you to view PDF documents in the browser without requiring any pdf browser plugin. Overall, it was a good learning experience.
For HTML5 compliant browsers, I used Mozilla’s pdf.js library; and for the older browsers, I used the SWFTools utilities to convert the PDF file to Flash, and then send back the Flash viewer to the client. Knockout provides the data and command bindings at the UI layer for the document grid to bring up the viewer as each document in the grid is clicked. On the backend, I used an ASP.NET Web Api controller which receives Ajax requests from the client JavaScript to send the document hitlist, or the document viewer.
Here are some of the screenshots for the app. I may post the source code to GitHub sometime in the future, after some tidying and beautifying.

Document Hit List:

Document Hit-List with HTML5 viewer:

Flash-based viewer:


Post a Comment

Toggle Footer