Media Previews is dead, long live Media Viewers

[wabson]

A while ago I wrote about the newly-extensible Document Preview component in Alfresco Share and how you can use it to customize the out-of-the-box viewers and add your own custom implementations.



I mentioned at the end of that post that there were some new examples of custom viewers coming in Share Extras and I'm excited that we're now ready to release them on the site.



Peter Löfgren had the great idea of using the pdf.js project to perform direct rendering of document content in the web browser using HTML5. I'd already started work on some simpler examples of custom viewers, and on refining the Flash audio/video players that Share Extras previously provided for Alfresco 3.3/3.4.



The result is what we're calling the Media Viewers add-on. This bundles up a total of six viewer implementations designed to show different ways of implementing custom document views, both with and without Flash.

• PdfJs displays documents, presentations and any other file capable of being  transformed to PDF in-line in the web browser using the excellent pdf.js viewer, which uses the power of HTML5 to remove Share's Flash dependency for  document viewing.
  
  
  
  The viewer supports a number of features not directly supported by the Flash document previewer, such as a sidebar with thumbnail, outline and search views,  bookmarking of individual pages of a document, and will remember the page  number and zoom level of previous documents that you have viewed.
  
  
  
  



• FLVPlayer and MP3Player display compatible audio and video files respectively, within the web-browser using the  open source FLV Player and MP3 Player media players by neolao. Based on the  content's MIME type, the updated component automatically chooses the appropriate  previewer to use.
  
  
  
  While similar to the Flash players provided by Share out-of-the-box, these  implementations allow advanced customization of the player via configuration and if FFmpeg is installed, will fire up a transformation to allow viewing  of non-H264/FLV video and non-MP3 audio. The user is informed when conversion is in progress and the screen automatically updates when the content can be viewed.



• Embed uses an in-line iFrame to embed the content itself directly inside the web page. It is suitable for use with content types that can be viewed  directly within the web browser such as plain text and PDF, with the Chrome or Acrobat plugins installed. Again, this can be used to avoid the use of  the Flash previewer for some clients.



• Prettify allows formatted code, mark-up and other supported text formats to be displayed in directly in the document and uses the google-code-prettify project to provide an in-line browser-based view with syntax highlighting.
  
  
  
  



• WebODF is an EXPERIMENTAL viewer which uses the AGPL-licensed WebODF project to display ODF content directly in the web browser.
  
  
  
  WebODF cannot be distributed with the add-in itself, so in order to use it you must also download the latest JAR file from the supporting share-webodf project and install it in the same way as the main media-viewers JAR file.

What's most exciting is that we're building on top of some great projects such as google-code-prettify, WebODF and pdf.js, that are evolving at a fast pace and changing the way that documents are viewed in a browser environment.



There is plenty more information including download links on the main Media Viewers project page on Share Extras. Please try it out, let us know what you think and help us to improve this collection.