Sticky toolbar buttons
This sample shows how to make certain edit buttons sticky so that the operation can be repeated multiple times without clicking the button again.
app.js
index.html
styles.css
loading...window.onload = function() {
//DsPdfViewer.LicenseKey = "***key***";
const options = {
workerSrc: "/document-solutions/javascript-pdf-viewer/demos/product-bundles/build/dspdfviewer.worker.js",
supportApi: getSupportApiSettings()
};
const viewer = new DsPdfViewer("#viewer", options);
viewer.addDefaultPanels();
viewer.addAnnotationEditorPanel();
viewer.addFormEditorPanel();
viewer.layoutMode = 1;
viewer.toolbarLayout.annotationEditor = {
default: ['edit-select', '$split', 'edit-square', 'edit-circle', 'edit-line', 'edit-polyline', 'edit-polygon', 'edit-ink', '$split', 'redact', 'redact-apply', 'save', '$split', 'edit-undo', 'edit-redo'],
mobile: ['edit-select', '$split', 'edit-square', 'edit-circle', 'edit-line', 'edit-polyline', 'edit-polygon', 'edit-ink', '$split', 'redact', 'redact-apply', 'save', '$split', 'edit-undo', 'edit-redo'],
fullscreen: ['$fullscreen', '$split', 'edit-select', '$split', 'edit-square', 'edit-circle', 'edit-line', 'edit-polyline', 'edit-polygon', 'edit-ink', '$split', 'redact', 'redact-apply', 'save', '$split', 'edit-undo', 'edit-redo']
};
viewer.toolbarLayout.formEditor = {
default: ["edit-select-field", "$split", "edit-widget-tx-field", "edit-widget-tx-text-area", "edit-widget-btn-push", "edit-widget-btn-checkbox", "edit-widget-btn-radio", "save", "$split", "edit-undo", "edit-redo"],
mobile: ["edit-select-field", "$split", "edit-widget-tx-field", "edit-widget-tx-text-area", "edit-widget-btn-push", "edit-widget-btn-checkbox", "edit-widget-btn-radio", "save", "$split", "edit-undo", "edit-redo"],
fullscreen: ["$fullscreen", "edit-select-field", "$split", "edit-widget-tx-field", "edit-widget-tx-text-area", "edit-widget-btn-push", "edit-widget-btn-checkbox", "edit-widget-btn-radio", "save", "$split", "edit-undo", "edit-redo"]
};
// Set the sticky behavior for drawing annotations and form widgets:
viewer.toolbarLayout.stickyBehavior = ['edit-ink', 'edit-square', 'edit-circle', 'edit-line', 'edit-polyline', 'edit-polygon', "edit-redact",
"edit-widget-tx-field", "edit-widget-tx-text-area", "edit-widget-btn-push", "edit-widget-btn-checkbox", "edit-widget-btn-radio"];
viewer.applyToolbarLayout();
viewer.open("/document-solutions/javascript-pdf-viewer/demos/product-bundles/assets/pdf/viewer-edit-annotations.pdf");
}