Added a new button in `EnvelopeViewer.razor` for creating or modifying signatures, with dynamic styling and tooltips based on the signature state. Enhanced `OpenSignaturePopup` and `OnPopupShownAsync` methods to preload and display existing signatures in the popup and canvas.
Introduced new "success" button styles in `envelope-viewer.css` for better visual feedback. Added `loadExistingSignature` function in `receiver-signature.js` to render existing signatures on the canvas and updated the public API to expose this functionality.
Introduced `SignatureCacheService` and `ILogger<EnvelopeViewer>` to enable caching and logging functionality. Added logic to load cached signatures when available, bypassing the signature popup. Implemented asynchronous, fire-and-forget caching of captured signatures, with error handling to ignore cache failures. Updated signature handling to integrate with the caching mechanism, improving user experience and performance.
Introduced a new `SignatureCaptureDto` model to encapsulate
signature-related data and metadata, replacing the previous
`SignatureCapture` type in `EnvelopeViewer.razor`.
- Added `SignatureCaptureDto` in `SignatureCaptureDto.cs` with
properties for signature image, signer name, position, and place.
- Updated `_capturedSignature` to use `SignatureCaptureDto` for
consistency and maintainability.
- Refactored signature capture logic to initialize
`SignatureCaptureDto` using object initializer syntax.
- Improved code clarity with detailed XML documentation for
`SignatureCaptureDto`.
These changes enhance maintainability, readability, and ensure
a centralized model for signature-related data.
Added a reset button to the PDF toolbar in `EnvelopeViewer.razor`
to allow users to reset all signatures and state. The button is
conditionally displayed when there are signed signatures
(`_signedSignatures > 0`).
Implemented the `RestartSigning` method to reload the page and
reset all signatures by navigating to the current URI with
`forceLoad: true`.
Introduced new styles in `envelope-viewer.css` for the reset
button, including hover effects, background gradients, border
colors, and transitions for a polished user experience.
Updated the reset button to include an SVG icon with hover
effects for better visual feedback and consistency with the
application's design.
Updated `EnvelopeViewer.razor` to use versioned URLs for CSS and JS files via the new `AppVersionService`, enabling cache busting.
Introduced `AppVersionService` to generate versioned URLs based on the application version retrieved from assembly metadata.
Registered `AppVersionService` as a singleton in `Program.cs` for dependency injection.
Reduced delay in `OnZoomChanged` to improve responsiveness when rendering signature buttons. Added calls to `RenderSignatureButtonsAsync` in zoom-related methods to ensure signature overlays update dynamically.
Refactored `pdf-viewer.js` to introduce `appliedSignatureElements` for better management of applied signatures. Added `scaleAppliedSignature` and `updateAppliedSignaturePositions` methods to dynamically scale and position applied signatures based on zoom level and page.
Enhanced signature button rendering by scaling dimensions (width, height, font size, icon size) proportionally with zoom. Added attributes to store base values for applied signature containers to facilitate scaling.
Improved handling of applied signatures to ensure proper scaling, positioning, and visibility during zoom and page navigation. These changes enhance user experience and maintain consistency across zoom levels.
The `<div class="envelope-action-bar__inner">` layout was updated to use a column-based structure for better alignment and spacing. Title and sender details now include additional information such as the sender's full name, email, and the envelope's added date.
Badges for receiver name, signature count, access code, and 2FA were visually refined with smaller padding, font sizes, and resized SVG icons. A new section was added to display public and private messages with distinct styles and icons.
The logout button's placement was adjusted to fit the new layout. Minor spacing, padding, and alignment adjustments were made throughout the component for a cleaner and more consistent design.
Updated the `EnvelopeViewer` component to improve the user interface and functionality:
- Added `EnvelopeReceiverService` injection to fetch receiver data.
- Redesigned `envelope-action-bar` for better alignment and responsiveness.
- Displayed dynamic document title and compact badges for receiver info, sender name, signature count, and security features (e.g., access code, 2FA).
- Refactored logout button styling and `envelope-content` layout.
- Introduced `_envelopeReceiver` field and updated `SignatureService.GetAsync` to fetch receiver data.
- Added debugging logs for loaded signatures.
- Added fields for managing signature navigation state.
Updated `MaxThumbnailWidth` to 400 in `EnvelopeViewer.razor`.
Added an authentication check using `AuthService.CheckEnvelopeAccessAsync`
to ensure users have access to the envelope. Redirects unauthorized
users to a login page with the `EnvelopeKey` in the URL. The check
is performed before fetching the document via `DocumentService`.
Added dependency injection for `AuthService` to enable authentication-related operations. Introduced a logout button in the UI, conditionally displayed when `EnvelopeKey` is valid, with a spinner and SVG icon for better UX.
Implemented the `LogoutAsync` method to handle the logout process, ensuring no concurrent logouts and redirecting the user to the login page. Added `_isLoggingOut` to manage logout state. Updated `OnInitializedAsync` for better error handling when `EnvelopeKey` is missing.
Added functionality to display the current signature index in the
signature counter UI in `EnvelopeViewer.razor`, including a new
state variable `_currentSignatureIndex` to track the currently
viewed signature. Updated the logic to fetch and set this value
from the `SignatureNavState` object provided by the JavaScript
runtime.
Modified `pdf-viewer.js` to calculate the current signature index
based on the last viewed signature ID (`_lastViewedSignatureId`)
and return it as part of the `SignatureNavState`. This replaces
the previously hardcoded `signed` value.
These changes improve the user experience by providing a clear
indication of the currently viewed signature in the navigation UI.
Updated the `disabled` attribute logic in `EnvelopeViewer.razor`
to ensure navigation buttons are always active when signatures
exist. Modified `pdf-viewer.js` to enable infinite looping for
signature navigation, allowing users to cycle between the first
and last signatures seamlessly. Adjusted `canGoPrev` and
`canGoNext` properties to depend on the total number of
signatures, ensuring navigation is always enabled when
signatures are present.
Enhanced signature navigation and rendering logic in `pdf-viewer.js`:
- Added `_renderLock` to prevent concurrent page renders.
- Refactored `renderPage` and `queueRenderPage` for stability.
- Updated `goToNextSignature` to support cross-page navigation.
- Filtered out applied signatures during rendering and navigation.
- Improved handling of applied signatures visibility per page.
Updated `EnvelopeViewer.razor`:
- Added `OnPageChangedBySignatureNav` to handle page changes triggered by signature navigation.
Improved code readability, added comments, and removed outdated logic to ensure smooth transitions and better user experience.
This commit introduces a signature navigation feature in the PDF viewer:
- Removed zoom preset buttons to make space for the new toolbar.
- Added "Previous" and "Next" buttons for navigating signatures.
- Displayed a signature counter with signed/total signatures and a badge for unsigned signatures or completion status.
- Introduced state variables (`_totalSignatures`, `_signedSignatures`, `_unsignedSignatures`) to track signature progress.
- Implemented methods for navigating signatures (`GoToPreviousSignature`, `GoToNextSignature`, `UpdateSignatureCounterAsync`).
- Enhanced JavaScript with `getSignatureNavState`, `goToNextSignature`, and `goToPreviousSignature` for navigation logic.
- Updated CSS for the toolbar and signature navigation, including responsive adjustments and hover effects.
- Improved error handling during signature counter updates.
- Updated `RenderSignatureButtonsAsync` to refresh the signature counter after rendering.
These changes improve the user experience by enabling efficient navigation and tracking of signatures in the PDF viewer.
Refactored `OnSignatureButtonClick` in `EnvelopeViewer.razor`:
- Converted to async and added null-check for `_capturedSignature`.
- Integrated `pdfViewer.applySignature` to apply signatures to PDFs.
Added `applySignature` method to `pdf-viewer.js`:
- Handles rendering of signatures with image, metadata, and styling.
- Follows German standards for signature formatting.
- Includes error handling for missing elements.
Introduced `escapeHtml` helper in `pdf-viewer.js` to prevent XSS.
Updated `MaxThumbnailWidth` in `EnvelopeViewer.razor` to 400.
Enhanced logging for better debugging during signature application.
Introduced a `DxPopup` for signature creation in `EnvelopeViewer.razor`, supporting three input methods: drawing, text, and image upload.
- Added `receiver-signature.js` for signature handling via JavaScript interop.
- Implemented tab-based UI for switching between signature methods.
- Added validation for required fields (e.g., full name, place).
- Enhanced text signature customization with font selection and dynamic rendering.
- Introduced state management for signature input and popup visibility.
- Added methods for initializing, clearing, and saving signatures.
- Styled the popup for a user-friendly experience and added error messages.
- Configured the popup to open automatically on page load or button click.
This feature improves the user experience by providing a flexible and intuitive way to create signatures.
Introduced functionality to render interactive signature buttons on the PDF viewer. Added support for fetching and displaying signature data (`SignatureDto`) dynamically based on the current page.
- Added `@using` directives in `EnvelopeViewer.razor` for required namespaces.
- Introduced `_signatures` field to store signature data.
- Updated `OnInitializedAsync` to fetch and process signatures.
- Implemented `RenderSignatureButtonsAsync` to dynamically render buttons.
- Added `[JSInvokable]` method `OnSignatureButtonClick` for button events.
- Updated CSS to style `pdf-signature-layer` and `signature-button`.
- Enhanced `pdf-viewer.js` with methods to render and clear buttons.
- Ensured buttons respond to zoom and page navigation changes.
- Added error handling and logging for signature rendering.
These changes improve user interaction by enabling signing functionality directly on the PDF viewer.
Replaced AnnotationDto and AnnotationService with SignatureDto
and SignatureService for handling signature data. Marked
AnnotationDto and AnnotationService as obsolete.
Added the SignatureDto class to represent signature data and
introduced the SignatureService class to fetch signature data
from the API. Updated EnvelopeViewer.razor to use
SignatureService, replacing AnnotationService, and added a
debug log for retrieved signatures.
Performed general refactoring to align with the new signature
data model and functionality.
Integrated PDF.js to enable text selection and copy-paste functionality in the PDF viewer. Updated `EnvelopeViewer.razor` to include the necessary scripts and styles, and modified the HTML structure to add a text layer container.
Enhanced `envelope-viewer.css` with styles for the text layer and optimized canvas rendering. Added a `renderTextLayer` method in `pdf-viewer.js` to extract and render text content from PDF pages. Updated the rendering process to overlay the text layer on the canvas.
Added a `ZoomStepPercentage` property to `PdfViewerOptions` to allow configurable zoom step increments (1-50, default 5%). Updated `EnvelopeViewer.razor` to use this property for the zoom slider step. Modified `pdf-viewer.js` to apply the zoom step percentage for mouse wheel zoom, `zoomIn`, and `zoomOut` methods.
Included `ZoomStepPercentage` in `appsettings.json` and `setQualityOptions` for dynamic updates. Reduced `ZoomTransitionDuration` in `appsettings.json` from 900ms to 150ms for faster zoom transitions. These changes ensure consistent and customizable zoom behavior across the application.
Introduced `PdfViewerOptions` class to centralize PDF viewer
settings such as scaling, HiDPI support, zoom transitions,
and rendering delays. Bound these options to `appsettings.json`
for dynamic configuration.
Injected `PdfViewerOptions` into `EnvelopeViewer.razor` and
updated `OnInitializedAsync` to pass settings to JavaScript.
Replaced hardcoded values in `pdf-viewer.js` with configurable
options, improving maintainability and flexibility.
Enhanced rendering logic to respect HiDPI settings, maximum
DPR, and smooth zoom transitions. Improved thumbnail rendering
with configurable delays to optimize performance.
Refactor the `ToggleThumbnails` method to be asynchronous (`async Task`) to support asynchronous operations. Add logic to re-render thumbnails when toggled on, including forcing a UI update, waiting for DOM rendering, and invoking `RenderThumbnailsAsync`. These changes improve the user experience by ensuring thumbnails are properly updated when displayed.
Introduced a resizable splitter for the PDF thumbnail sidebar, allowing users to dynamically adjust its width. Added `_thumbnailWidth` property with min/max constraints and implemented mouse event handlers (`OnSplitterMouseDown`, `OnSplitterMouseMove`, `OnSplitterMouseUp`) to manage resizing.
Integrated JavaScript interop to attach/detach resize event listeners and save user preferences to `localStorage`. Updated `pdf-viewer.js` to handle resizing state and cleanup. Styled the splitter in `envelope-viewer.css` with hover/active states and ensured smooth interaction.
Persisted thumbnail width across sessions and added error handling for `localStorage`. Enhanced user experience with intuitive resizing and improved UI flexibility.
Removed the header section of the PDF thumbnail sidebar, including the title and close button, to streamline the UI. Updated Razor logic to control sidebar visibility directly, eliminating the need for `.pdf-thumbnails--visible`. Deleted associated CSS styles for the removed elements. Retained scrolling and padding styles for the thumbnail content.
Refactor the PDF thumbnail sidebar to use Razor logic for dynamic visibility control, removing reliance on CSS-based toggling. Updated the `pdf-thumbnails` layout to use `relative` positioning and improved its integration with the viewer structure. Introduced a new `pdf-canvas-wrapper` for better styling, scrolling, and alignment of the main PDF canvas.
Enhanced responsiveness by adjusting `pdf-thumbnails`, `pdf-thumbnails__content`, and `pdf-toolbar` styles for smaller screens. Deprecated the `pdf-thumbnails--visible` class and removed redundant CSS properties to simplify the codebase. Updated the `pdf-frame` layout to use a column-based flexbox for better alignment.
These changes improve maintainability, responsiveness, and the overall user experience of the `EnvelopeViewer` component.
Added delays in `EnvelopeViewer.razor` to ensure the DOM is ready and to render thumbnails sequentially, preventing browser overload and keeping the UI responsive. Enhanced error handling in `RenderThumbnailsAsync` with detailed debug logs.
In `pdf-viewer.js`, introduced a retry mechanism to wait for canvas elements to appear in the DOM and added detailed error logging for missing canvases or PDF document issues. Replaced generic comments with specific error messages to improve debugging.
These changes enhance the robustness, reliability, and user experience of the PDF viewer.
Introduced a PDF thumbnail sidebar in `EnvelopeViewer.razor` to enhance navigation between pages. Added a toggle button to show/hide the sidebar and implemented dynamic thumbnail rendering for all pages.
Updated `envelope-viewer.css` with styles for the sidebar, including hover/active states, transitions, and mobile responsiveness.
Enhanced `pdf-viewer.js` with a `renderThumbnail` method to render page previews on canvas elements. Added error handling for non-critical thumbnail rendering issues.
Improved user experience by providing an intuitive way to preview and navigate PDF pages.
Updated the zoom slider in `EnvelopeViewer.razor` to allow finer adjustments by changing the step size from 25 to 1. Modified `pdf-viewer.js` to enable smoother zooming with 1% increments for `zoomIn` and `zoomOut` methods. Capped zoom levels between 0.5 and 3.0. Enhanced mouse wheel zoom behavior to adjust zoom in 1% steps and notify the .NET side of changes via `OnZoomChanged`. Ensured pages are re-rendered after each zoom adjustment.
The PDF toolbar in `EnvelopeViewer.razor` has been redesigned to improve usability and functionality. Key changes include:
- Added buttons for page navigation, zooming, and preset zoom levels.
- Introduced a zoom slider and page input field for direct control.
- Added "Fit to Width" and "Set Zoom to 100%" features.
- Updated `ZoomIn` and `ZoomOut` methods with boundary checks.
- Added new methods: `SetZoom`, `OnZoomSliderChanged`, `OnPageInputChanged`, and `FitToWidth`.
Styling updates in `envelope-viewer.css` include a modernized toolbar design with rounded corners, shadows, and responsive layouts for smaller screens.
`pdf-viewer.js` was updated with `setScale` and `fitToWidth` methods to support the new functionality. These changes enhance the interactivity, flexibility, and user experience of the PDF viewer.
Added `DotNetObjectReference` in `EnvelopeViewer.razor` to enable Blazor-JS communication. Updated `OnAfterRenderAsync` to pass the reference to `pdfViewer.initialize`. Introduced `[JSInvokable]` method `OnZoomChanged` to handle zoom updates from JavaScript.
Enhanced `DisposeAsync` to clean up resources, including disposing of the `.NET reference` and invoking a JavaScript `dispose` method.
In `pdf-viewer.js`, modified `initialize` to accept a `.NET reference` and added `attachWheelEvent` to handle zooming via mouse wheel with `Ctrl`/`Meta` key. Updated `dispose` to clean up event listeners and reset the `.NET reference`. Added `getScale` to retrieve the current zoom scale.
Improved resource cleanup and event handling to prevent memory leaks and ensure stability.
Moved inline styles from `EnvelopeViewer.razor` to a new external
CSS file `envelope-viewer.css` for better maintainability and
separation of concerns. Added external JavaScript dependencies
(`pdf.js` and `pdf-viewer.js`) to enable PDF rendering.
Fixed encoding issues in error messages and improved the layout
structure with responsive design rules. Enhanced readability and
usability by organizing styles and ensuring proper localization
support.
Simplified the component by removing unnecessary debug output
and redundant comments. Removed the `OnAfterRenderAsync`
method, which previously handled PDF viewer initialization
and related JavaScript calls. This suggests the initialization
logic has been moved elsewhere or is no longer required in
this component.
Introduced a new Blazor component `EnvelopeViewer.razor` to display PDF documents with a user-friendly interface. The component supports dynamic routing via `/envelope/{EnvelopeKey}` and integrates the `pdf.js` library for efficient PDF rendering in the browser.
Key features include:
- Zoom and navigation controls (Next/Previous page, Zoom In/Out).
- Loading spinner, error handling, and fallback UI for robustness.
- Responsive design with modern styling using CSS.
- JavaScript interop via `pdf-viewer.js` for managing PDF rendering, scaling, and navigation.
Added lifecycle methods (`OnInitializedAsync`, `OnAfterRenderAsync`) for dynamic loading and rendering. Ensured asynchronous operations for smooth user interactions. Included a `DisposeAsync` method for cleanup.