Liferay Document Viewer Plugin Portlet

Objective: 

Create Plug-in portlet  to view documents

Liferay already have documents preview in documents and media portlet by using that we can view documents

Document preview concept is uses Apache PDF Box by default from this we can see the PDF document.

For this we need not to do any configuration so that it will automatically view the PDF documents.

For better quality views life ray have provide future to configure Image Magick tool so that we can view documents with very good quality.

If we not configure Image Magick tool for life ray then it will show following message in the console  when we try to preview documents in liferay.

Liferay is not configured to use ImageMagick for generating Document Library previews and will default to PDFBox. For better quality previews, install ImageMagick and enable

If we use Image Magic tool then document is converted into images. Means each page is converted into one image.

This can be handle by liferay libraries the main class is PDFProcessorImpl.java it will take care the all the things

Download LiferayDocViewr  portlet from following location

You can find source and war file

https://sourceforge.net/projects/meeralferay/files/DocumentViewerPortlet/

Note: 

Portlet developed in Liferay 6.1GA2 EE version

If you want deploy in CE version you just do changes in liferay-plugin-package.properties

Liferay 6.1 EE version

name=LiferayDocViewr module-group-id=liferay-ee module-incremental-version=1 tags= short-description= change-log= page-url=http://www.liferay.com author=Liferay, Inc. licenses=EE liferay-versions=6.1.20

Liferay 6.1 CE version

name = LiferayDocViewr module-group-id=liferay module-incremental-version=1 tags= short-description= change-log= page-url=http://www.liferay.com author=Liferay, Inc. licenses=LGPL liferay-versions=6.1.1

Procedure for deploy portlet:

You can use war file and directly place in your portal deploy folder and test or you can also use source to deploy portlet.

Once portlet is deployed successfully you can see the portlet in sample category name as

Liferay Doc Viewer.

Login as Admin and add some sample documents using Document Media Portlet in liferay

Note:

Before use this portlet read entire article and then test the portlet

Now our target id create plug-in portlet for to view documents

1. Configure Image Magic tool
2. Configure Open Office and Start Open Office Service.
3. Develop portlet to view documents

Configure Image Magic tool

Download Image Magick Tool from Following Location

http://www.imagemagick.org/script/binary-releases.php#windows

Install image magic in your system, follow the installation steps and choose your image magick installation directory

Generally it is in program Files, this path we will use in liferay Image magick configuration

Now login as Admin in liferay and go control panel

Go to portal server section and click on Server Administration menu form the tab choose External Service from that enable image magick tool and configure Image Magick installation path

The following is screen for Image Magick configuration in liferay.

Now Document Viewer uses Images Magick service to generate images from document then we can see view good quality

If any quality problem then go through following URL from liferay wiki

https://www.liferay.com/community/wiki/-/wiki/Main/Preview+Generation

Configure Open Office and Start Open Office Service

From document viewer can support by default PDF view. If we want see MS office documents and open office documents we need to configure open office and we need to start open office service.

The concept something like first documents will be converted into PDF and then PDF documents will be converted into images based on pages the document contains.each page converted into one image.

Go through following link configure open office and start open office service

http://www.liferaysavvy.com/2013/11/liferay-document-conversion-portlet.html

Develop portlet to view documents

Liferay have already provides document preview in Document Library Portlet.

They have created AUI JavaScript to make view template.

This AUI script will take preview URL and Number of pages count as options.

The page preview URL something like Follows

http://localhost:8080/documents/groupID/folderID/fileName/file-UUID/?version=vresionValue&&previewFileIndex=pageNumber

The following is Example URL

http://localhost:8080/documents/10180/0/Aui+Auti+Fields+in+liferay.docx/171e4bf0-8b7a-413b-b42d-a03cc803455d?version=1.0&previewFileIndex=2

Each time when the request have  /document URL pattern the request will be handled by WebServerServlet.java  servlet this will start PDFProcessor and do further actions like convert PDF to images or documents to PDF and then images.

The following is important java classes

PDFProcessorUtil.java and PDFProcessorImpl.java

Internally it uses many implementation classes from portal

Note:

If document is more then it will take time to generate images

If document is ms office or open office first it should convert into PDF and then images so It will take time to complete this process.

The following is code for document viewer template

<%@page import="com.liferay.portlet.documentlibrary.util.DLUtil"%> <%@page import="com.liferay.portlet.documentlibrary.util.PDFProcessorUtil"%> <%@page import="com.liferay.portal.kernel.repository.model.FileVersion"%> <%@page import="com.liferay.portal.kernel.repository.model.FileEntry"%> <%@page import="com.liferay.portlet.documentlibrary.service.DLAppLocalServiceUtil"%> <%@page import="com.liferay.portlet.documentlibrary.service.DLAppHelperLocalServiceUtil"%> <%@ include file="init.jsp"%> <% long fileEntryId=ParamUtil.getLong(renderRequest,"fileEntryId"); FileEntry fileEntry=DLAppLocalServiceUtil.getFileEntry(fileEntryId); FileVersion fileVersion=fileEntry.getFileVersion(); boolean hasPDFImages = PDFProcessorUtil.hasImages(fileVersion); int previewFileCount = 0; String previewFileURL = null; String[] previewFileURLs = null; String videoThumbnailURL = null; String previewQueryString = null; if (hasPDFImages) {             previewFileCount = PDFProcessorUtil.getPreviewFileCount(fileVersion);             previewQueryString = "&previewFileIndex=";             previewFileURL = DLUtil.getPreviewURL(fileEntry, fileVersion, themeDisplay, previewQueryString);             %>             <div class="lfr-preview-file" id="<portlet:namespace />previewFile">             <div class="lfr-preview-file-content"                         id="<portlet:namespace />previewFileContent">                         <div class="lfr-preview-file-image-current-column">                                     <div class="lfr-preview-file-image-container">                                                 <img class="lfr-preview-file-image-current"                                                             id="<portlet:namespace />previewFileImage"                                                             src="<%= previewFileURL + "1" %>" />                                     </div>                                     <span class="lfr-preview-file-actions aui-helper-hidden"                                                 id="<portlet:namespace />previewFileActions"> <span                                                 class="lfr-preview-file-toolbar"                                                 id="<portlet:namespace />previewToolbar"></span> <span                                                 class="lfr-preview-file-info"> <span                                                             class="lfr-preview-file-index"                                                             id="<portlet:namespace />previewFileIndex">1</span> of <span                                                             class="lfr-preview-file-count"><%= previewFileCount %></span>                                     </span>                                     </span>                         </div>                         <div class="lfr-preview-file-images"                                     id="<portlet:namespace />previewImagesContent">                                     <div class="lfr-preview-file-images-content"></div>                         </div>             </div> </div> <aui:script use="aui-base,liferay-preview"> new Liferay.Preview(                                     {             actionContent: '#<portlet:namespace />previewFileActions',             baseImageURL: '<%= previewFileURL %>',             boundingBox: '#<portlet:namespace />previewFile',     contentBox: '#<portlet:namespace />previewFileContent',             currentPreviewImage: '#<portlet:namespace />previewFileImage',             imageListContent: '#<portlet:namespace />previewImagesContent',             maxIndex: <%= previewFileCount %>,     previewFileIndexNode: '#<portlet:namespace />previewFileIndex',             toolbar: '#<portlet:namespace />previewToolbar'             }).render(); </aui:script> <%}else{%> <h2>Unable to view document</h2> <%}%>

Liferay.Preview needs options baseImageURL and maxIndex means total page count.

Note:

We can also use Jquery Page Flip to make better view

http://www.jqueryrain.com/2012/12/best-jquery-page-flip-book-effect-with-examples/

Tip to generate images

<% for(int i=1;i<= previewFileCount;i++){%> <img   id="<portlet:namespace />previewFileImage" src="<%= previewFileURL + "1" %>" /> <%}%>

Important Points

• Liferay have provide document view by default by using PDF box
• To get better quality view we need to configure Image Magick tool to liferay .
• To view only PDF documents then we need not to configure open office.
• To View documents we need to configure open office and we need to start open office service
• In document view each page converted into one image by PDF processor.
• If documents are Open office or MS office then first it will be converted into PDF and then it will be converted into images based on number of pages document contains
• Liferay provide AUI java script template to view documents we can also use JQuery Page Flip to make better view.
• The following are portlet screen shots

Screen 1:

Screen 2:

Reference Links

https://www.liferay.com/community/wiki/-/wiki/Main/Preview+Generation

https://www.liferay.com/web/alexander.chow/blog/-/blogs/7341017

Author

Meera Prince

www.liferaysavvy.com

Read More

Liferay Document Conversion Portlet

Objective:

Convert document from one format to other format.

Liferay have inbuilt support to convert various document from one format to other formats with the help of Open Office service.

Download LiferayDocConverter  portlet from following location

You can find source and war file

https://sourceforge.net/projects/meeralferay/files/LiferayDocumentConversionPortlet/

Note: 

Portlet developed in Liferay 6.1GA2 EE version

If you want deploy in CE version you just do changes in liferay-plugin-package.properties

Liferay 6.1 EE version

name=LiferayDocConverter module-group-id=liferay-ee module-incremental-version=1 tags= short-description= change-log= page-url=http://www.liferay.com author=Liferay, Inc. licenses=EE portal-dependency-jars=\     jstl-api.jar,\     jstl-impl.jar portal-dependency-tlds=c.tld liferay-versions=6.1.20

Liferay 6.1 CE version

name = LiferayDocConverter module-group-id=liferay module-incremental-version=1 tags= short-description= change-log= page-url=http://www.liferay.com author=Liferay, Inc. licenses=LGPL portal-dependency-jars=\     jstl-api.jar,\     jstl-impl.jar portal-dependency-tlds=c.tld liferay-versions=6.1.1

Procedure for deploy portlet:

You can use war file and directly place in your portal deploy folder and test or you can also use source to deploy portlet.

Once portlet is deployed successfully you can see the portlet in sample category name as Doc Converter.

Note:

Please read full article before test this portlet.

Here also some limitations means some of the conversion may not possible any how mostly we can convert documents form one format to other format very easy.

Internally liferay using JOD converter to do this conversion process.JOD converter is java library have set of classes form which we can convert documents.

Liferay already implemented their own java classes with the help of JOD converter library so that we can use life ray classes to do this process.

Liferay provides one of the class called DocumentConversionUtil by using this we can convert documents from one format to other format.

The following are the sequence of steps we need to do.

1. Download open office and install in your machine
2. Start open office service
3. Configure open office in Liferay
4. Use DocumentConversionUtil to convert documents

Download open office and install in your machine

The following is direct down load link to download Open Office Apache_OpenOffice_4.0.1_Win32

http://jaist.dl.sourceforge.net/project/openofficeorg.mirror/4.0.1/binaries/en-US/Apache_OpenOffice_4.0.1_Win_x86_install_en-US.exe

The following is link for all platforms open office download

http://www.openoffice.org/download/other.html

Once you downloaded open office then install in your machine and follow the installation steps based on Operating System you have.

Note:

Please follow the installation process based on your OS

Start open office service

Windows:

One installation successfully done then we have to start open office service from command prompt.

In windows open command prompt and go to installation location of open office and then go to directory called program.

Go to the folder where it was installed (for example, C:\Program Files\OpenOffice.org\program) and start OpenOffice service with the following

Command:

soffice -headless -accept="socket,host=127.0.0.1,port=8100;urp;" -nofirststartwizard

Linux:

 Goto Openoffice installing path.From command prompt type this line

 "cd /usr/lib/openoffice/program"

Command:

sudo soffice "-accept=socket,host=localhost,port=8100;urp;StarOffice.ServiceManager" -nologo -headless –nofirststartwizard"

Go through following link for complete details

http://liferayui.blogspot.sg/2011/02/enable-openoffice-in-liferay.html

The following is screen shot to run open office service in Windows.

Configure Open Office in Liferay

Once service is stared then we need to configure open office in liferay from administration screen,

Login as admin and go control panel from that go to server administration which is in left side server section.

Now click on External Service and enable open office service

Note:

 Here open office service port by default is 8100

If you change the port number at time of open office installation, then you need to change in liferay configuration too.

The following is liferay open office configuration screen

Use DocumentConversionUtil to convert documents

Once we did all above then we can start convert documents.

So now we can use DocumentConversionUtil to convert documents

The following is method to convert document from one type to other type

public static File convert(                                     String id, InputStream inputStream, String sourceExtension,                                     String targetExtension)

The following is complete code to convert file and down load file

public class DocConverterAction extends MVCPortlet {             @Override             public void serveResource(                                     ResourceRequest resourceRequest, ResourceResponse  resourceResponse)                         throws IOException, PortletException {                          UploadPortletRequest uploadPortletRequest =PortalUtil.getUploadPortletRequest(resourceRequest);                         String destinationExtension=ParamUtil.getString(uploadPortletRequest,"destinationExtension");                          File sourceFile = uploadPortletRequest.getFile("sourceFile");                          String extension = "";                          String fileName=sourceFile.getName();                          int i =fileName.lastIndexOf('.');                          Timestamp stamp = new Timestamp(System.currentTimeMillis());                           Date date = new Date(stamp.getTime());                           System.out.println("=="+date);                          File destinationFile=null;                          if (i > 0) {                              extension = fileName.substring(i+1);                          }                          InputStream inputStream = new FileInputStream(sourceFile);                          HttpServletResponse httpResponse = PortalUtil.getHttpServletResponse(resourceResponse);                          HttpServletRequest httpRequest = PortalUtil.getHttpServletRequest(resourceRequest);                          try {                                      destinationFile=DocumentConversionUtil.convert(String.valueOf(stamp.getTime()), inputStream,extension,destinationExtension);                                      InputStream is = new BufferedInputStream(new FileInputStream(destinationFile));                                      ServletResponseUtil.sendFile(httpRequest,httpResponse ,destinationFile.getName(), is,getCotentType(destinationExtension));                         } catch (Exception e) {                                     if(e instanceof SystemException)                                     System.out.println("555555555555555555"+e.getMessage());                                     e.printStackTrace();                         }             } }

Possible conversions

Important points

• Liferay have in build support to convert document from one format other with help of Open office service.
• To enable open office service in liferay we have to install open office and start open office service then we need to configure in liferay.
• Once we configuration done then we can implement in plug-in portlet where ever you required,
• Once we configure this we can also download journal content with different formats and also in document media portlet you can see different conversion features.

Portlet screen

Reference links

https://www.liferay.com/community/wiki/-/wiki/Main/Document+Conversion+with+OpenOffice

http://www.kianworknotes.com/2012/12/how-to-integrate-liferay-with.html

http://www.artofsolving.com/opensource/jodconverter

Author

Meera Prince

Read More