Getting started

GroupDocs.Viewer Product Family
1

Hello,



I am looking to trial the Viewer for a proof of concept. I have a web page which downloads a document from an external web service, and I would like to offer a “preview” window in the web page. The only issue is, I really don’t know where to get started.



I have followed the installation process, and I have my IntelliJ IDE set up with a new mavern project that successfully imports the Viewer library and I am able to reference it within my main class, however I don’t know where to look/go from there.



The documentation seems either difficult to find or non-existent - I am wondering if someone can point me in the right direction.



I do not have tomcat installed - I am using a different local server - so I’m unsure how to make the examples work.



This will be a java applet embedded on a HTML (angularJS) application page.



Cheers,

Josh

2
Hello Josh,

Thank you for your inquiry.

At the moment our documentations for the GroupDocs.Viewer for Java is oriented only for next Java frameworks : Spring, Dropwizard, Servlet. But this library is standart .jar library that can be implemented in different java applications . I can propose you to investigate how to integrate our library to the php application here , that you can understand, what content should be added to the html page to show the Viewer widget. On the backend server side to get this content, you can call next methods: viewerHandler.getHeader() and viewerHandler.getViewerScript(viewerId, initialFilePath, locale) . All these methods you can find in our examples , please investigate them and if you will have more questions feel free to contact us.

---------

Best regards,
Evgen Efimov

http://groupdocs.com
Your Document Collaboration APIs
Follow us on LinkedIn, Twitter, Facebook and Google+

3

Hi Evgen,



Thanks for your reply.



The application I want to integrate the Viewer with is an AngularJS application rather than php. I don’t use php (never have) so I am finding it difficult to follow the example (and even get it up and running for that matter!). Do you have any pure JS/HTML examples you are able to share?



Basically what I want to do is be able to provide a document (base64 string downloaded from an external application server) to the viewer and embed the result on an HTML page. Any help you can provide to get a working example would be greatly appreciated.



I am developing this as a proof of concept, but if I can get a working example there could be a licence involved further down the line. It just looks a little complex for me at the moment.



Thanks

Josh

4

Hello,

Sorry for misunderstanding.

I just have proposed you, that you only investigate this article. I understand that you use Angular JS application, but at the moment we don’t have any example for this. But in your case the conception of using will be next:

  1. Run your Java application (or our example) on server side and get public URL of the application.
  2. Then add a static html code that is described in the article and paste the public URL in it.

Also you can use the iframe HTML tag with the public URL on the Java application to integrate the Viewer in your Angular JS application.

Regarding “base64 string downloaded from an external application server” – in this case, you will need to implement a custom InputDataHandler class. You can find an example of this implementation in our demo examples, or you can investigate this article.

If you have any difficulties in integration, please share your project example and we will help you.

Best regards,
Evgen Efimov

http://groupdocs.com
Your Document Collaboration APIs

Follow us on:

5

Hi again Evgen,



Here is the code I am using for AngularJS. The HTML code is the same but the php has been pulled here. I have installed the .NET version on my laptop from the URL



Install GroupDocs.Viewer for .NET | GroupDocs



and I am looking at integrating locally first as that is where I am running my web application (well, via a server running from my PC anyway).



angular.module(“app”).controller(“DocViewerAPIController”, function($scope){

$scope.groupdocs_url = “What do I put in here???”;

if ($scope.groupdocs_url){

$scope.width = “650”;

$scope.height = “500”;

$scope.handler = “Handler”;

$scope.content = “”;

$scope.path = “./Images/blue-marker.png”;





$scope.url = $scope.groupdocs_url + “document-viewer/GetScript” + $scope.handler + “?name=libs/jquery-ui-1.10.3.min.js”;

$scope.headers = get_headers($url, 1);



if (headers[0] == ‘HTTP/1.1 200 OK’) {



var localizedStrings = null;

var thumbsImageBase64Encoded = null;

$(‘#groupdocs’).groupdocsViewer({

localizedStrings: localizedStrings,

thumbsImageBase64Encoded: thumbsImageBase64Encoded,

instanceIdToken: null,

filePath: $scope.path,

quality: 100,

showThumbnails: true,

openThumbnails: true,

initialZoom: 100,

zoomToFitWidth: true,

onlyShrinkLargePages: false,

zoomToFitHeight: false,

width: 0,

height: 0,

backgroundColor: null,

showFolderBrowser: true,

showPrint: true,

showDownload: true,

showZoom: true,

showPaging: true,

showViewerStyleControl: true,

showSearch: true,

preloadPagesCount: null,

preloadPagesOnBrowserSide: false,

convertWordDocumentsCompletely: false,

viewerStyle: 1,

supportTextSelection: true,

usePdfPrinting: false,

toolbarButtonsBoxShadowStyle: null,

toolbarButtonsBoxShadowHoverStyle: null,

thumbnailsContainerBackgroundColor: null,

thumbnailsContainerBorderRightColor: null,

toolbarBorderBottomColor: null,

toolbarInputFieldBorderColor: null,

toolbarButtonBorderColor: null,

toolbarButtonBorderHoverColor: null,

thumbnailsContainerWidth: 0,

jqueryFileDownloadCookieName: ‘jqueryFileDownloadJSForGD’,

showDownloadErrorsInPopup: false,

showImageWidth: false,

showHeader: true,

minimumImageWidth: 0,

enableStandardErrorHandling: true,

useHtmlBasedEngine: false,

useHtmlThumbnails: false,

useImageBasedPrinting: true,

fileDisplayName: null,

downloadPdfFile: false,

searchForSeparateWords: false,

preventTouchEventsBubbling: false,

useInnerThumbnails: false,

watermarkText: null,

watermarkColor: null,

watermarkPosition: ‘Diagonal’,

watermarkWidth: 0,

printWithWatermark: false,

supportPageReordering: false,

searchHighlightColor: null,

currentSearchHighlightColor: null,

treatPhrasesInDoubleQuotesAsExactPhrases: false,

usePngImagesForHtmlBasedEngine: false,

showOnePageInRow: false,

loadAllPagesOnSearch: false,

useEmScaling: false,

ignoreDocumentAbsence: false,

supportPageRotation: false,

useRtl: false,

useAccentInsensitiveSearch: false,

useVirtualScrolling: false,

supportListOfContentControls: false,

supportListOfBookmarks: false,

locale: ‘en-US’,

embedImagesIntoHtmlForWordFiles: false

});

} else {

$scope.content = “Please change "Use Http Handlers" option in edit block form”;

}



} else {

$scope.content = “Please fill "URL of installed GroupDocs.Viewer .NET" field in edit block form”;

}

});



I am getting issues in the browser because I don’t know what to make the URL - Should it be to a particular file? (the .dll?) or to the top level folder?

6
Hello Josh,

Thank you for coming back.

If I understand you correcly your application based on the Angular Js (JavaSCript application) and it's not a Java Application with the AngularJs library, correrct? Also since you have mantioned the Java Viewer and now you have downloaded the .NET version - could you please clarify which one you need because I'm afraid we misunderstood each other.

As for the code - yes, it's correct and you should run one of our examples (which you have downloaded) and use it's URL in your code. For example our sample solution will run with such URL "http://localhost:2121/" then you should use it in such way:

$scope.groupdocs_url = "http://localhost:2121/";

Please clarify the platform on which your application built and which exactly GroupDocs.Viewer you need - Java or .NET

---------

Best regards,
Evgen Efimov

http://groupdocs.com
Your Document Collaboration APIs
Follow us on LinkedIn, Twitter, Facebook and Google+