Free Support Forum - groupdocs.com

Loading viewer dynamically with javascript


#1

I am trying to preload the viewer for performance reasons and then load a file in the viewer with javascript. We have to stream the files to the viewer. We are using 2.19 (.NET), not planning on going to 3.0 just yet. The viewer is loaded in an iFrame.


On the iFrame we have the following code to preload the viewer when the iFrame is loaded.
@Html.CreateViewerScriptLoadBlock().LoadJquery().LoadJqueryUi()
@(Html.ViewerClientCode()
.TargetElementSelector("#DV")
.ShowFolderBrowser(false)
.EnableRightClickMenu(true)
.UseHtmlBasedEngine(false)
.ShowViewerStyleControl(false)
.UseInnerThumbnails(true)
.PreloadPagesCount(1)
.ZoomToFitWidth()
)

In the iFrame page with the viewer I have a javascript function that I am trying to use to load the file in the viewer dynamically. The function calls the url @Url.Action(“GetDocument”, “DV”) which returns a filestream.

function LoadDocument(DocumentId) {
$.ajax({
type: “GET”,
url: ‘@Url.Action(“GetDocument”, “DV”)’,
data: “Id=” + DocumentId,
success: function (encFilePath) {
console.log(encFilePath);
var localizedStrings = null,
thumbsImageBase64Encoded = null;

$(’#DV’).groupdocsViewer({
filePath: encFilePath,
quality: 100,
showThumbnails: true,
openThumbnails: true,
initialZoom: 100,
zoomToFitWidth: true,
zoomToFitHeight: false,
width: 1000,
height: 650,
backgroundColor: ‘’,
showFolderBrowser: false,
showPrint: true,
showDownload: true,
showZoom: true,
showPaging: true,
showViewerStyleControl: true,
showSearch: true,
preloadPagesCount: 0,
viewerStyle: 1,
supportTextSelection: true,
usePdfPrinting: false,
localizedStrings: localizedStrings,
thumbsImageBase64Encoded: thumbsImageBase64Encoded,
toolbarButtonsBoxShadowStyle: ‘’,
toolbarButtonsBoxShadowHoverStyle: ‘’,
thumbnailsContainerBackgroundColor: ‘’,
thumbnailsContainerBorderRightColor: ‘’,
toolbarBorderBottomColor: ‘’,
toolbarInputFieldBorderColor: ‘’,
toolbarButtonBorderColor: ‘’,
toolbarButtonBorderHoverColor: ‘’,
thumbnailsContainerWidth: 0,
jqueryFileDownloadCookieName: ‘jqueryFileDownloadJSForGD’,
showDownloadErrorsInPopup: false,
showImageWidth: false,
showHeader: true,
minimumImageWidth: 0,
enableStandardErrorHandling: true,
useHtmlBasedEngine: false,
useImageBasedPrinting: true,
fileDisplayName: ‘’,
downloadPdfFile: false,
searchForSeparateWords: false,
preventTouchEventsBubbling: false,
useInnerThumbnails: true,
watermarkText: ‘’,
watermarkColor: ‘’,
supportPageReordering: false,
onlyShrinkLargePages: true,
searchHighlightColor: ‘’,
currentSearchHighlightColor: ‘’,
treatPhrasesInDoubleQuotesAsExactPhrases: false,
usePngImagesForHtmlBasedEngine: false,
showOnePageInRow: false,
loadAllPagesOnSearch: false,
useEmScaling: false
});
}
});
}

This javascript call seems to use a filepath and not a stream. Is there anyway to accomplish this with a stream? Thanks.

Robert

#2

Hi,


Thank you for the request. Unfortunately in case of using JavaScript and the Viewer 2.x only the filePath option is available.

Sorry for the inconvenience.

#3

Ok, I have started a demo project to see if I can do what I need using the 3.0.0 dll for .net. I am using the showcase code for the legacy viewer.


I am using the following code to load the viewer the first time and it works great. I had to modify it to work with streams but so far it is working. But only on the initial load. If I change the call the LoadDocument function a second time nothing happens…

Am I missing something? Is there another extension I can call? Thanks.

function LoadDocument(DocumentId){
$(’#viewerHtmlDiv’).groupdocsViewer({
filePath: DocumentId,
zoomToFitWidth: true,
showFolderBrowser: true,
showHeader: true,
showPaging: true,
showThumbnails: false,
useHtmlThumbnails: false,
//watermarkPosition: ‘Diagonal’,
//watermarkText: ‘Watermark for pdf’,
useHtmlBasedEngine: false,

showDownload: true,
downloadPdfFile: true,

showPrint: true,
usePdfPrinting: true
});
}

#4

Hi,


Thank you for coming back. To reload/change the document you should delete the Viewer DIV with the JavaScript and then create and add it again with another document.

Best regards.