.NET

PDF Viewer Using FlexPaper

About FlexPaper

Flexpaper is an open-source web-based document viewer.
Link : Devaldi

It provides an efficient and fancy way to view a PDF.
The complete version of the code is available at [ Zine Servertrial ].
It must be configured as well as all the standalone exe's used must be downloaded.

Minimizing the Code

I minimized and deleted all the files except what I needed for viewing the PDF.

Tools Used

  1. Flexpaper Asset Files (Images for toolbar and the UI).
  2. Pdf2json.exe (Converting pdf config to a JSON string).
  3. Mudraw.exe (Converting pdf page to Image).
  4. Pdftk.exe (Splitting the PDF).

I removed the Configuration Files from the original source and added a class called PDFProcess.cs to do the required process of viewing the PDF.

The website Structure



The Startup File [simple_document.aspx]

  1. <%@ Page Language="C#" AutoEventWireup="true" CodeFile="simple_document.aspx.cs"   
  2. Inherits="simple_document" %>  
  3. <!doctype html><html><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><meta name="viewport" content="initial-scale=1,user-scalable=0,maximum-scale=1,width=device-width" /><style type="text/css" media="screen">   
  4. html, body { height:100%; }   
  5. body { margin:0; padding:0; overflow:auto; }   
  6. #flashContent { display:none; }   
  7. </style><link rel="stylesheet" type="text/css" href="css/flexpaper.css?r53556" /><script type="text/javascript" src="js/jquery.min.js?r53556"></script><script type="text/javascript" src="js/jquery.extensions.min.js?r53556"></script><script type="text/javascript" src="js/flexpaper.js?r53556"></script><script type="text/javascript" src="js/flexpaper_handlers.js?r53556"></script></head><body><div id="documentViewer" class="flexpaper_viewer" style="position:absolute;;width:100%;height:100%;background-color:#222222;;"></div><script type="text/javascript">   
  8. $('#documentViewer').FlexPaperViewer(   
  9. {   
  10. config:   
  11. {   
  12. IMGFiles: "<% =IMGFilesPath %>",   
  13. JSONFile: "<% =JSONFilePath %>",   
  14. PDFFile: "<% =PDFFilePath %>",   
  15. Scale: 0.6,   
  16. ZoomTransition: 'easeOut',   
  17. ZoomTime: 0.4,   
  18. ZoomInterval: 0.1,   
  19. FitPageOnLoad: true,   
  20. FitWidthOnLoad: false,   
  21. AutoAdjustPrintSize: true,   
  22. PrintPaperAsBitmap: false,   
  23. AutoDetectLinks: false,   
  24. FullScreenAsMaxWindow: true,   
  25. ProgressiveLoading: false,   
  26. MinZoomSize: 0.3,   
  27. MaxZoomSize: 5,   
  28. SearchMatchAll: true,   
  29. InitViewMode: 'Portrait',   
  30. RenderingOrder: 'html5,html5',   
  31. StartAtPage: 1,   
  32. MixedMode: true,   
  33. EnableWebGL: false,   
  34. PublicationTitle: '',   
  35. ViewModeToolsVisible: true,   
  36. ZoomToolsVisible: true,   
  37. NavToolsVisible: true,   
  38. CursorToolsVisible: true,   
  39. SearchToolsVisible: true,   
  40. UIConfig: 'UIConfig.xml?r53556',   
  41. WMode: 'transparent',   
  42. key: '#V2ZzfWBFX1pcQRhwB0lFXlVeYw',   
  43. localeChain: 'en_US'   
  44. }   
  45. }   
  46. );   
  47. var url = window.location.href.toString(); if (location.length == 0) { url = document.URL.toString(); } if (url.indexOf("file:") >= 0) { jQuery('#documentViewer').html("<div style='position:relative;background-color:#ffffff;width:420px;font-family:Verdana;font-size:10pt;left:22%;top:20%;padding: 10px 10px 10px 10px;border-style:solid;border-width:5px;'><img src='data:image/gif;base64,R0lGODlhEAAPAMQPAPS+GvXAIfrjnP/89vnZePrhlvS9F//+/PrfjfS/HfrgkPS+GP/9+YJiACAYAP////O3AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAEAAA8ALAAAAAAQAA8AAAVQ4COOD0GQKElA0JmSg7EsxvCOCMsi9xPrkNpNwXI0WIoXA1A8QgCMVEFn1BVQS6rzGR1NtcCriJEAVnWJrgDI1gkehwD7rAsc1u28QJ5vB0IAOw%3D%3D'><b>You are trying to use FlexPaper from a local directory.</b><br/><br/> Use the 'View in browser' button in the Desktop Publisher publish & preview dialog window to preview your publication or copy the contents of your publication directory to a web server and access this html file through a http:// url.</div>"); } </script></body></html>   
[simple_document.aspx.cs]
  1. using System;  
  2. using System.Collections.Generic;  
  3. using System.IO;  
  4. using System.Linq;  
  5. using System.Web;  
  6. using System.Web.UI;  
  7. using System.Web.UI.WebControls;  
  8. public partial class simple_document: System.Web.UI.Page  
  9. {  
  10.     public string IMGFilesPath = "";  
  11.     public string JSONFilePath = "";  
  12.     public string PDFFilePath = "";  
  13.     protected void Page_Load(object sender, EventArgs e)  
  14.     {  
  15.         // Set the Docs Path where the processed files will be stored   
  16.         string uploadFolderAbsPath = Server.MapPath("~/docs/");  
  17.         string uploadFolderRelPath = ResolveUrl("~/docs/");  
  18.         // Set the PDF Source Path and filename   
  19.         string sourceFilePath = Server.MapPath("~/pdf/");  
  20.         string sourceFileName = "Paper.pdf";  
  21.         IMGFilesPath = uploadFolderRelPath + sourceFileName + "_{page}.png";  
  22.         JSONFilePath = uploadFolderRelPath + sourceFileName + ".js";  
  23.         PDFFilePath = uploadFolderRelPath + Path.GetFileNameWithoutExtension(sourceFileName) + "_[*,0].pdf";  
  24.         PDFProcess pdfProcess = new PDFProcess();  
  25.         //Convert PDF to Images   
  26.         pdfProcess.PDF2Image(uploadFolderAbsPath, sourceFilePath, sourceFileName);  
  27.         //Convert PDF to JSON   
  28.         pdfProcess.PDF2JSON(uploadFolderAbsPath, sourceFilePath, sourceFileName);  
  29.         // Split PDF Pages   
  30.         pdfProcess.SplitPDF(uploadFolderAbsPath, sourceFilePath, sourceFileName);  
  31.     }  
  32. }  
The main processing Class [PDFProcess.cs]
  1. using System;  
  2. using System.Collections.Generic;  
  3. using System.Linq;  
  4. using System.Web;  
  5. using System.IO;  
  6. /// <summary>   
  7. /// Summary description for PDF2Image   
  8. /// </summary>   
  9. public class PDFProcess  
  10. {  
  11.     public int PDF2Image(string uploadFolder, string sourceFilePath, string sourceFileName) {  
  12.         System.Diagnostics.Process proc = new System.Diagnostics.Process();  
  13.         proc.StartInfo.FileName = HttpContext.Current.Server.MapPath("~/bin/mudraw.exe");  
  14.         proc.StartInfo.UseShellExecute = false;  
  15.         proc.StartInfo.WindowStyle = System.Diagnostics.ProcessWindowStyle.Hidden;  
  16.         proc.StartInfo.CreateNoWindow = true;  
  17.         proc.StartInfo.Arguments = "-r100 -o " + "\"" + uploadFolder + sourceFileName + "_%d.png\" " + "\"" + sourceFilePath + sourceFileName + "\"";  
  18.         if (proc.Start())   
  19.         {  
  20.             proc.WaitForExit();  
  21.             proc.Close();  
  22.             return 1;  
  23.         } else return 2;  
  24.     }  
  25.     public int PDF2JSON(string uploadFolder, string sourceFilePath, string sourceFileName) {  
  26.         System.Diagnostics.Process proc = new System.Diagnostics.Process();  
  27.         proc.StartInfo.FileName = HttpContext.Current.Server.MapPath("~/bin/pdf2json.exe");  
  28.         proc.StartInfo.UseShellExecute = false;  
  29.         proc.StartInfo.WindowStyle = System.Diagnostics.ProcessWindowStyle.Hidden;  
  30.         proc.StartInfo.CreateNoWindow = true;  
  31.         proc.StartInfo.Arguments = "\"" + sourceFilePath + sourceFileName + "\" -enc UTF-8 -compress " + "\"" + uploadFolder + sourceFileName + ".js" + "\"";  
  32.         if (proc.Start())  
  33.         {  
  34.             proc.WaitForExit();  
  35.             proc.Close();  
  36.             return 1;  
  37.         } else return 2;  
  38.   
  39.     }  
  40.     public int SplitPDF(string uploadFolder, string sourceFilePath, string sourceFileName) {  
  41.         System.Diagnostics.Process proc = new System.Diagnostics.Process();  
  42.         proc.StartInfo.FileName = HttpContext.Current.Server.MapPath("~/bin/pdftk.exe");  
  43.         proc.StartInfo.UseShellExecute = false;  
  44.         proc.StartInfo.WindowStyle = System.Diagnostics.ProcessWindowStyle.Hidden;  
  45.         proc.StartInfo.CreateNoWindow = true;  
  46.         proc.StartInfo.Arguments = "\"" + sourceFilePath + sourceFileName + "\" burst output " + "\"" + uploadFolder + Path.GetFileNameWithoutExtension(sourceFileName) + "_%1d.pdf" + "\" compress";  
  47.         if (proc.Start())  
  48.         {  
  49.             proc.WaitForExit();  
  50.             proc.Close();  
  51.             return 1;  
  52.         } else return 2;  
  53.     }  
  54. }  
The output



Using the Source Code

Download the source code and open as a Web Site. Set the [simple_document.aspx] as the Startup File and run.

Up Next
    Ebook Download
    View all
    Learn
    View all
    Get Started

    You need to be a premium member to use this feature. To access it, you'll have to upgrade your membership.

    Become a sharper developer and jumpstart your career.

    Basic

    $0

    $

    . 00

    monthly

    For Basic members:

    • Standard Profile
    • Access learning courses
    • Access free e-books
    • 1x point
    Premium

    $20

    $

    . 00

    monthly

    For Premium members:

    • Earn 2x reward points
    • Premium profile with Verified check
    • Premium Avatar with status update
    • Learning courses
    • Unlimited Certifications and badges on profile
    • Unlimited Book downloads
    • Access to Premium content
    • Online Training
    • Unlimited PDF conversions and downloads
    • Professional Resume Writing
    • Interview Preparations Guide
    • 25 messages per month
    • 1 "Kodzu" avatar, basic
    Elite

    $45

    $

    . 00

    monthly

    For Elite members:

    • Bundle E-books
    • Access to all Learn Series
    • Unlimited Apply Jobs