I've converted a sample PDF file to HTML5 using Oracle's OutSide In Web View Export using the AjaxChunked method, but I cannot get the file to render correctly using the supplied JavaScript API. The file is rendered correctly is browsed to directly.
For example, the incorrect rendering through the JavaScript API:
And how the file looks if browsed to directly:
The source code for the correct rendering is this:
And here is the index.html I've written using the Web View Export JavaScript API:
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!--<link rel="stylesheet" type="text/css" href="oit.css">-->
<script src="oit.js"></script>
<title>Oracle Web View Export Test</title>
</head>
<body>
<div id="container"></div>
<script type="text/javascript">
$(document).ready(function(){
console.log("Document ready");
var viewContainer = document.getElementById("container");
OIT.view.attach(viewContainer);
OIT.view.load("adobe-acrobat.html");
});
OIT.document.addEventListener("load", function (evt) {
console.log("Just loaded: " + evt.detail.url);
});
And here is the code that converts the document (C#):
try
{
OutsideIn.OutsideIn.InstallLocation = new DirectoryInfo(Environment.CurrentDirectory + "\\Resources");
}
catch (Exception uhoh)
{
Console.WriteLine(uhoh.Message);
}
Exporter exporter = OutsideIn.OutsideIn.NewLocalExporter();
try
{
exporter.SetPerformExtendedFI(false);
exporter.SetFontReferenceMethod(Options.FontReferenceMethodValue.ReferenceExported);
/* The FONTDIRECTORY option must be set. */
List<DirectoryInfo> FontDirectories = new List<DirectoryInfo>();
DirectoryInfo SystemFontsDirectory = new DirectoryInfo(Environment.GetFolderPath(Environment.SpecialFolder.Fonts));
FontDirectories.Add(SystemFontsDirectory);
exporter.SetFontDirectories(FontDirectories);
exporter.SetWebViewStructure(Options.WebViewStructureValue.AjaxStreamed);
//exporter.SetPerformExtendedFI(true);
exporter.SetSourceFile(file);
exporter.SetDestinationFile(newoutputPath + "\\" + Path.GetFileNameWithoutExtension(file) + ".html");
exporter.SetDestinationFormat(FileFormat.FI_HTML5);
}
catch (Exception fail)
{
Console.WriteLine("Fail: " + fail.Message);
Console.ReadLine();
}
Console.WriteLine("Exporting: " + file);
exporter.Export();
I've looked high and low for some idea on what is causing the problem, but I can't seem to find anything. The documentation provided by Oracle isn't great, so I'm at a loss. There is a post on the Oracle support forums from over two years ago with this exact problem, but no solution is provided.
Any ideas or suggestions would be greatly appreciated.
Just in case someone stumbles across this and is having the same issue, it turns out that for whatever reason, the OIT.view.load() method doesn't correctly load the CSS for the page (oit.css), so you have to manually put that into the HTML file you're calling the view.load() from.
In addition to this, the top level DIV created for the document has a height of zero. No idea why, so we fixed this using OIT.view.height(document.height), or alternatively whatever height you want it to be. This seems to have solved the problems, and the document is displayed correctly in the browser.