How to implement file viewer in WebClient using Office Web Viewer

How to implement file viewer in WebClient using Office Web Viewer

Reference

IMPORTANT:
The file (Excel spreadsheet, Word document, and PowerPoint presentation) need to be accessible via the internet without using any port number.
  1. Create a url field and set the control name of the field to fileURL.


  2. Create a button to trigger the file viewer event. Set the control name of the button to ViewFile:MainArea:template=FileViewer:default


    FileViewer.ctrl will be attached in this article and it should be placed in your custom template Java project.
  3. Call an API that contains the following code:
    // Generate a random number from 1 to 90
    // Create a directory in the web context based on the generated random number
    // Copy the file from your source directory to the newly created directory
    // Create the url to access the new file
    import java.io.File;
    import java.io.FileInputStream;
    import java.io.FileOutputStream;
    import java.io.IOException;
    import java.io.FileNotFoundException;

    import java.net.URLEncoder;

    import java.nio.channels.FileChannel;
    {
        int random = (int)(Math.random() * 90 + 1);
        com.adcaustin.webclient.IWebApp webApp = (com.adcaustin.webclient.IWebApp)(Object) fnc.getApp();
        javax.servlet.http.HttpServletRequest req = (javax.servlet.http.HttpServletRequest) webApp.getFromUserStorage("javax.servlet.http.HttpServletRequest");
        String path = req.getSession().getServletContext().getRealPath("/");
        java.io.File destPath = new java.io.File(path + random);
        java.io.File destFile = new java.io.File(path + random + "\\" + &(2:));
        destPath.mkdir();
        String fileName = &(2:).toString();
        String srcUrl = &(1:) + "\\" + fileName;
        java.io.File srcFile = new java.io.File(srcUrl);
        FileChannel source = null;
        FileChannel destination = null;

        try {
            /**
             * getChannel() returns unique FileChannel object associated a file
             * output stream.
             */
            source = new FileInputStream(srcFile).getChannel();
            destination = new FileOutputStream(destFile).getChannel();
            if (destination != null && source != null) {
                destination.transferFrom(source, 0, source.size());
                String webPath = "http://www.mywebsite.com" + req.getContextPath() + "/" +                random + "/" + fileName; 
                &(3:).fromString(URLEncoder.encode(webPath, "UTF-8"));
            }
        } catch (FileNotFoundException e) {
            e.printStackTrace();
        } catch (IOException e) {
            e.printStackTrace();
        } finally {
            if (source != null) {
                try {
                    source.close();
                } catch (IOException e) {
                    e.printStackTrace();
                }
            }
            if (destination != null) {
                try {
                    destination.close();
                } catch (IOException e) {
                    e.printStackTrace();
                }
            }
        }
    }

    Parameters:
    &(1:): FilePath (this field will contain the path where the documents are located)
    &(2:): FileName (
    this field will contain the name of the document to open)
    &(3:): FileURL (
    this field will contain the URL processed by the source code)


  4. Do a put to set the value of the URL.

  5. Optional: you can create a new API to delete the folders and files that are older than certain number of days.
  6. Test your function.





    • Related Articles

    • Web Embedded File

      This control template will allow you to display files within your WebClient page. Primarily this is used to display images dynamically on your page. 1) Copy WebEmbeddedFile.ctrl into your Custom Templates folder so that it can be referenced by ...
    • Web Controls

      What Are the Different Types of Controls? Include files (*.inc)   are evaluated within the referencing template and can be useful for repeated blocks of code. They can have parameters, such as :nc (do not evaluate comments) or :parameterName=pValue ...
    • Incident Reporter for Web

      Video Walkthrough Pattern Functions All functions will be under "Patterns.Web". GoogleMap This pattern is a simple UIBasicShell.  It displays a single field: GoogleMap for GoogleMap.  This field has a Control Name of ...
    • CM WebClient File Upload Setup

      File Upload This guide will show you how to upload files to your Web Server from your WebClient application. 1. Import the attached zip Java Project into your Eclipse Workspace. 2. Right click your Java Project, and select Properties. Under “Java ...
    • TrafficCam for Web

      Watch the Walkthrough We are going to develop a web application with CA Plex and CM First's WebClient templates. The application will allow us to access a network of real-time traffic cameras around the State of Maryland, view their live video feeds, ...