По умолчанию веб редактор PDF документа использует следующие "стандартные" UI-диалоги:

• WebUiDocumentPasswordDialogJS - диалоговое окно, которое позволяет установить пароль документа. Диалоговое окно появляется при загрузке защищенного документа.
• WebUiUploadImageFromUrlDialogJS - UI-диалог, позволяющий ввести URL-адрес файла изображения/документа для открытия в веб просмотрщике документов. Диалог появляется при нажатии кнопки "Открыть файл с URL-адреса".
• WebPrintImagesDialogJS - диалоговое окно, которое позволяет печатать изображения, отображаемые в веб просмотрщике изображений. Диалоговое окно появляется при нажатии кнопки "Print images" (Печать изображений).
• WebImageViewerSettingsDialogJS - диалоговое окно, которое позволяет просматривать и редактировать настройки просмотрщика изображений. Диалоговое окно появляется при нажатии кнопки "Image viewer settings" (Настройки просмотрщика изображений).
• WebThumbnailViewerSettingsDialogJS - диалоговое окно, которое позволяет просматривать и редактировать настройки просмотрщика миниатюр. Диалоговое окно появляется при нажатии кнопки "Thumbnail viewer settings" (Настройки просмотрщика миниатюр).
• WebImageSelectionDialogJS - диалоговое окно, которое позволяет выбрать изображения, отображаемые в веб просмотрщике изображений. Диалоговое окно появляется при нажатии кнопки "Mark full pages for redaction" (Пометить весь контент страниц для редактирования).
• WebPdfRedactionMarkAppearanceDialogJS - диалоговое окно, которое позволяет просматривать и редактировать внешний вид PDF метки редактирования документа. Диалоговое окно появляется при нажатии кнопки "PDF redaction mark appearance" (Внешний вид PDF метки редактирования).
• WebUiPdfRedactionMarkSettingsDialogJS - UI-диалог, позволяющий просматривать и редактировать настройки метки редактирования PDF. Диалог появляется при нажатии кнопки "Внешний вид метки редактирования PDF".
• WebUiPdfImageResourceDialogJS - UI-диалог, позволяющий просматривать информацию о ресурсе изображения PDF. Диалог появляется при нажатии кнопки "Показать изображение содержимого" на боковой панели "Извлечь изображения".
• WebUiPdfAConversionAndValidationDialogJS - UI-диалог, позволяющий преобразовать PDF документ в формат PDF/A или проверить PDF документ на соответствие формату PDF/A. Диалог появляется при нажатии кнопки "Преобразование и проверка PDF/A".
• WebPdfDocumentCompressorDialogJS - UI-диалог, позволяющий сжать PDF документ. Диалог появляется при нажатии кнопки "Сжатие PDF".

1. Стандартные диалоговые окна на базе Bootstrap

Готовые к использованию "стандартные" UI-диалоги, основанные на Bootstrap, хранятся в файле Vintasoft.Imaging.Pdf.Dialogs.Bootstrap.js.
Если в веб редакторе PDF документа необходимо использовать "стандартные" UI-диалоги Bootstrap, веб-приложение должно иметь:

• ссылку на CSS-файл стилей Bootstrap, например:
  
  • HTML

  <link rel="stylesheet" type="text/css" href="~/lib/bootstrap/dist/css/bootstrap.css">
  

• ссылки на библиотеки jQuery и Bootstrap, например:
  
  • HTML

  <script src="~/lib/jquery/dist/jquery.min.js" type="text/javascript"></script>
  <script src="/lib/bootstrap/dist/js/bootstrap.bundle.min.js" type="text/javascript"></script>
  

• ссылку на файлы Vintasoft.Imaging.js, Vintasoft.Imaging.css, Vintasoft.Imaging.Pdf.js, Vintasoft.Imaging.Pdf.css, Vintasoft.Imaging.Dialogs.Bootstrap.js и Vintasoft.Imaging.Pdf.Dialogs.Bootstrap.js, например:
  
  • HTML

  <link rel="stylesheet" type="text/css" href="~/js/Vintasoft.Imaging.css">
  <link rel="stylesheet" type="text/css" href="~/js/Vintasoft.Imaging.Pdf.css">
  <script src="~/js/Vintasoft.Shared.js" type="text/javascript"></script>
  <script src="~/js/Vintasoft.Imaging.js" type="text/javascript"></script>
  <script src="~/js/Vintasoft.Imaging.Pdf.js" type="text/javascript"></script>
  <script src="~/js/Vintasoft.Imaging.Dialogs.Bootstrap.js" type="text/javascript"></script>
  <script src="~/js/Vintasoft.Imaging.Pdf.Dialogs.Bootstrap.js" type="text/javascript"></script>
  

Внешний вид диалоговых окон можно настроить с помощью CSS-стилей Bootstrap.

Ниже представлен снимок экрана стандартного диалогового окна "Password dialog" (Диалоговое окно ввода пароля), созданного на базе Bootstrap:

2. Стандартные диалоговые окна на базе jQuery UI

Готовые к использованию "стандартные" UI-диалоги, основанные на jQuery UI, хранятся в файле Vintasoft.Imaging.Pdf.Dialogs.jQueryUI.js.
Если в веб редакторе PDF документа необходимо использовать "стандартные" UI-диалоги jQueryUI, веб-приложение должно иметь:

• ссылку на CSS-файл стилей jQuery UI, например:
  
  • HTML

  <link rel="stylesheet" type="text/css" href="~/js/jquery-ui-css/jquery-ui.min.css">
  

• ссылки на библиотеки jQuery и jQuery UI, например:
  
  • HTML

  <script src="~/js/jquery-3.3.1.min.js" type="text/javascript"></script>
  <script src="~/js/jquery-ui.min.js" type="text/javascript"></script>
  

• ссылку на файлы Vintasoft.Imaging.js, Vintasoft.Imaging.css, Vintasoft.Imaging.Pdf.js, Vintasoft.Imaging.Pdf.css, Vintasoft.Imaging.Dialogs.jQueryUI.js и Vintasoft.Imaging.Pdf.Dialogs.jQueryUI.js, например:
  
  • HTML

  <link rel="stylesheet" type="text/css" href="~/js/Vintasoft.Imaging.css">
  <link rel="stylesheet" type="text/css" href="~/js/Vintasoft.Imaging.Pdf.css">
  <script src="~/js/Vintasoft.Shared.js" type="text/javascript"></script>
  <script src="~/js/Vintasoft.Imaging.js" type="text/javascript"></script>
  <script src="~/js/Vintasoft.Imaging.Pdf.js" type="text/javascript"></script>
  <script src="~/js/Vintasoft.Imaging.Dialogs.jQueryUI.js" type="text/javascript"></script>
  <script src="~/js/Vintasoft.Imaging.Pdf.Dialogs.jQueryUI.js" type="text/javascript"></script>
  

Внешний вид диалоговых окон можно настроить с помощью CSS-стилей jQuery UI.

Ниже представлен снимок экрана стандартного диалогового окна ввода пароля, созданного на базе jQuery UI:

3. Пользовательские стандартные диалоговые окна

Если готовые к использованию "стандартные" UI-диалоги Bootstrap и jQuery UI не подходят для вашего пользовательского интерфейса или задачи, можно использовать пользовательские "стандартные" UI-диалоги в веб редакторе PDF документа.

Если необходимо создать пользовательский диалог для другой библиотеки пользовательского интерфейса, рекомендуется создать диалог как обертку вокруг готовой к использованию UI-панели (WebUiDocumentPasswordPanelJS, WebUiUploadImageFromUrlDialogJS, WebUiPrintImagesSettingsPanelJS, WebUiImageViewerSettingsPanelJS, WebUiThumbnailViewerSettingsPanelJS, WebUiImageSelectionPanelJS, WebUiPdfRedactionMarkAppearancePanelJS, WebUiPdfRedactionMarkSettingsDialogJS, WebUiPdfImageResourceDialogJS, WebUiPdfAConversionAndValidationDialogJS, WebPdfDocumentCompressorDialogJS). В этом случае нет необходимости реализовывать логику, связанную с диалогом (например, печать изображений), поскольку панель уже содержит всю необходимую логику.

Можно также создать пользовательское диалоговое окно с нуля, но в этом случае необходимо реализовать как пользовательский интерфейс, так и логику работы диалогового окна.