Change "standard" UI-element in web PDF document editor

In This Topic

If you need to change the working logic of standard UI-element in web PDF document editor, you will have to implement a JavaScript code, which should override the standard UI-element in the factory of UI-elements.

Here is JavaScript code that shows how to create UI-button, which uses different "Pan" visual tool for touch devices and not touch devices:

JavaScript

/**
 Creates UI button for activating the visual tool, which allows to pan images in image viewer.
*/
function __createPanToolButton() {
    // if touch device is used
    if (__isTouchDevice()) {
        return new Vintasoft.Imaging.UI.UIElements.WebUiVisualToolButtonJS({
            cssClass: "vsdv-tools-panButton",
            title: "Document navigation, Text selection, Pan, Zoom",
            localizationId: "panToolButton"
        }, "DocumentNavigationTool,TextSelectionTool,PanTool,ZoomTool");
    }
    else {
        return new Vintasoft.Imaging.UI.UIElements.WebUiVisualToolButtonJS({
            cssClass: "vsdv-tools-panButton",
            title: "Document navigation, Text selection, Pan",
            localizationId: "panToolButton"
        }, "DocumentNavigationTool,TextSelectionTool,PanTool");
    }
}

/**
 Registers new UI button, which enables Annotation+Pan tool, instead of standard UI button, which enables only Pan tool.
*/
function __registerNewPanButton() {
    // register the "Pan" button in web UI elements factory
    Vintasoft.Imaging.UI.UIElements.WebUiElementsFactoryJS.registerElement("panToolButton", __createPanToolButton);
}

/**
 Returns a value indicating whether touch device is used.
*/
function __isTouchDevice() {
    return (navigator.maxTouchPoints > 0) || (navigator.msMaxTouchPoints > 0);
}

Send Feedback