PDFTron自定义脚本应包含哪些内容？

Question

PDFTron可以选择提供一个自定义Javascript文件来修改查看器，但是我不确定该文件中应该包含什么内容，并且我在网络上找不到任何示例。

该网站有以下描述：

查看器选项-默认情况下，PWS Cloud文档加载在WebViewer的基本托管版本中。 您可以通过加载外部JavaScript配置文件来自定义查看器的外观，品牌和自定义功能。

当我提供此文件时， window.WebViewerUniversalInstance为null， document.getElementById（'DocumentViewer'）也返回一个null对象。

有人可以在这里指出正确的方向，我迷路了。

谢谢

Answer 1

此JavaScript文件在查看器的内部html页面（ReaderControl.html）的上下文中运行，允许您直接在查看器中修改内容，因此WebViewerUniversalInstance将为null（因为不在内部页面中）。 但是我用var ele = document.getElementById('DocumentViewer');了一个小的测试文件var ele = document.getElementById('DocumentViewer'); ele不是非null，所以我不太确定为什么这对您不起作用。

无论如何，您可以做一些事例。 对于自定义操作，您可能需要在“ viewerLoaded”或“ documentLoaded”事件中运行代码。 对于UI更改，您在两个事件中都不需要代码。

因此，例如，如果您想隐藏打印按钮，则可以将其放入文件中：

$('#printButton').hide();

对于修改与UI相关的事物，我建议右键单击“检查元素”以找到要修改的事物的ID /类。 或者，您可以下载WebViewer并查看ReaderControl.html。

这是在viewerLoaded事件中执行操作的示例：

$(document).on('viewerLoaded', function() {
    readerControl.docViewer.SetMargin(0);
});

这是在documentLoaded事件中执行操作的示例：

$(document).on('documentLoaded', function() {
    readerControl.setCurrentPageNumber(2);
    readerControl.rotateClockwise();
    readerControl.setZoomLevel(2);
});

您可以做很多事情，也可以在这里查看文档： http : //www.pdftron.com/webviewer/demo/lib/html5/doc/

您可能感兴趣的一些对象：

• readerControl：viewerLoaded之后可用
• DocumentViewer ：加载查看器后可用（readerControl.docViewer）
• Document ：在documentLoaded之后可用（docViewer.GetDocument（））

如果您还有其他问题，可以随时在WebViewer论坛上提问： https ://groups.google.com/forum/#!forum/pdfnet-webviewer

Answer 2

我不确定我是否完全理解您的问题，但是这是我对PDFViewer中的外部配置文件所做的操作，希望这会在一定程度上有所帮助：

<script type="text/javascript">
$(function () {
    var customData = { serviceUrl: 'services/PDFWebService.asmx', token: '<%=initialDoc.Value %>', isReadonly: '<%=IsReadonly?"yes":"no" %>' };
    var myWebViewer = new PDFTron.WebViewer({
        path: "Resources/js/PDFTron",
        mobileRedirect: false, // Disable redirect in mobile view.
        stream: true,
        config: 'Resources/js/PDFViewerConfig.js',
        documentType: "pdf",
        custom: JSON.stringify(customData),
        l: '<%=LicenseKey%>',
        initialDoc: customData.serviceUrl + '/GetFile?token=' + customData.token
    }, document.getElementById('viewer'));
});

我的PDFViewerConfig.js是：

(function () {

$(document).on('viewerLoaded', function () {
    customData = JSON.parse(window.ControlUtils.getCustomData());
    SetupCustomizations();
});

$(document).on('documentLoaded', function () {
    setDisabled("#btnSave");
    setDisabled("#btnReset");
    setDisabled("#btnPushUp");
});

$(document).on('pageChanged', function (event) {

    var currentPageNumber = readerControl.getCurrentPageNumber();
    var totalPages = readerControl.docViewer.getDocument().getPageCount();
    if (currentPageNumber == totalPages) {
        setDisabled("#btnPushDown");
        setEnabled("#btnPushUp");
    }
    else if (currentPageNumber == 1) {
        setDisabled("#btnPushUp");
        setEnabled("#btnPushDown");
    }
    else {
        setEnabled("#btnPushUp");
        setEnabled("#btnPushDown");
    }
});
})();

function SetupCustomizations() {

if (customData && customData.isReadonly != "yes") {
    var removeButton = $('<span aria-disabled="false" role="button" tabindex="0" class="glyphicons  remove" title="remove page"></span>');
    var saveButton = $('<span aria-disabled="true" role="button" tabindex="0" id="btnSave" class="glyphicons floppy_disk disabled" title="save changes"></span>');
    var resetButton = $('<span aria-disabled="true" role="button" tabindex="0" id="btnReset" class="glyphicons restart disabled" title="reset to original"></span>');

    var rotateRightButton = $('<span aria-disabled="false" role="button" tabindex="0" class="glyphicons share" title="rotate right"></span>');
    var rotateLeftButton = $('<span aria-disabled="false" role="button" tabindex="0" class="glyphicons unshare" title="rotate left"></span>');

    var pushDownButton = $('<span aria-disabled="false" role="button" tabindex="0" id="btnPushDown" class="glyphicons down_arrow" title="move current page down"></span>');
    var pushUpButton = $('<span aria-disabled="true" role="button" tabindex="0" id="btnPushUp" class="glyphicons up_arrow disabled" title="move current page up"></span>');


    removeButton.on('click', onRemove);
    removeButton.on('keydown', onRemove);

    saveButton.on('click', onSave);
    saveButton.on('keydown', onSave);

    resetButton.on('click', onReset);
    resetButton.on('keydown', onReset);

    rotateRightButton.on('click', onRotateRight);
    rotateRightButton.on('keydown', onRotateRight);

    rotateLeftButton.on('click', onRotateLeft);
    rotateLeftButton.on('keydown', onRotateLeft);

    pushDownButton.on('click', onPushDown);
    pushDownButton.on('keydown', onPushDown);

    pushUpButton.on('click', onPushUp);
    pushUpButton.on('keydown', onPushUp);

    var newButtonsPlaceholder = $("#downloadButton").parent();
    newButtonsPlaceholder.prepend(removeButton);
    newButtonsPlaceholder.prepend(rotateLeftButton);
    newButtonsPlaceholder.prepend(rotateRightButton);
    newButtonsPlaceholder.prepend(pushDownButton);
    newButtonsPlaceholder.prepend(pushUpButton);
    newButtonsPlaceholder.prepend(saveButton);
    newButtonsPlaceholder.prepend(resetButton);
}

//508
$("#ui-id-3").attr("tabindex", "0");
$("#prevPage").attr("tabindex", "0");
$("#nextPage").attr("tabindex", "0");
$("#printButton").attr("tabindex", "0");
$("#fullScreenButton").attr("tabindex", "0");
$("#downloadButton").attr("tabindex", "0");
$("#zoomIn").attr("tabindex", "0");
$("#zoomOut").attr("tabindex", "0");
$("#fitWidth").attr("tabindex", "0");
$("#fitPage").attr("tabindex", "0");

$("#prevPage").attr("role", "button");
$("#nextPage").attr("role", "button");
$("#printButton").attr("role", "button");
$("#fullScreenButton").attr("role", "button");

$("#zoomIn").attr("role", "button");
$("#zoomOut").attr("role", "button");
removeExtraButtons();
}