update to Document-Viewer-Javascript 2.0

Author: Ellie-dynamsoft

README.md

@@ -3,19 +3,53 @@
 ![version](https://img.shields.io/npm/v/dynamsoft-document-viewer.svg)
 ![downloads](https://img.shields.io/npm/dm/dynamsoft-document-viewersvg) 
 ![jsdelivr](https://img.shields.io/jsdelivr/npm/hm/dynamsoft-document-viewer.svg)
-![](https://img.shields.io/snyk/vulnerabilities/npm/dynamsoft-document-viewer.svg)
 
-[Dynamsoft Document Viewer (DDV)](https://www.dynamsoft.com/document-viewer/docs/introduction/index.html) is a versatile SDK designed to offer a range of viewers for configuring and executing various document processing workflows.
+[Dynamsoft Document Viewer (DDV)](https://www.dynamsoft.com/document-viewer/docs/introduction/index.html) is a browser-based JavaScript SDK designed for viewing and editing images and PDFs. It provides a wide range of functionalities, including PDF annotation, page manipulation, image quality enhancement, and document saving.
 
-Key features include:
+#### Security
+Dynamsoft Document Viewer is independently developed and does not rely on any external third-party open-source software. All processing, such as rendering and editing, is securely performed within the browser using a web assembly module. This architecture eliminates the need for a server-side backend, ensuring security compliance and scalability.
 
-- Data Management: Organize, retrieve, and manage documents and pages efficiently.
+####  Browser and Platform Compatibility
+Dynamsoft Document Viewer is designed to work seamlessly across different browsers and platforms. It is compatible with major browsers like Chrome, Firefox, Safari, and Edge, ensuring a consistent user experience. Additionally, it supports various operating systems, including Windows, macOS, Linux, iOS, and Android, allowing users to access documents from any device.
 
-- Viewer Types: Customize your document interaction with a variety of viewers.
+#### Supported File Types
+Users can open, edit, and save PDFs, as well as various image formats such as JPEG, PNG, BMP, TIFF, and GIF.
 
-Additionally, DDV enhances functionality by allowing integration with customized image filtering processes and document boundary detection processes. It is particularly recommended to use [Dynamsoft Document Normalizer](https://www.dynamsoft.com/document-normalizer/docs/web/programming/javascript/) for document detection.
+#### Annotation Types
+Dynamsoft Document Viewer supports a variety of annotation types to enhance document interaction and collaboration. Users can add, edit, and delete annotations such as:
 
-DDV enables the seamless creation of a document management web application tailored to your specific workflow, user interface, and style needs.
+- text
+- images
+- signature
+- shapes
+- stamps
+- freehand drawings
+
+#### Data Management Concepts
+Dynamsoft Document Viewer organizes data using two main concepts: “document” and “page.” A document can contain one or multiple pages, and each page must belong to a single document.
+
+Page: The smallest unit of data management, currently represented as an image. Each page has a unique pageUid.
+Document: A collection of pages, each with a unique docUid. Documents collectively make up the entire data set.
+Managing data, therefore, involves managing documents and pages.
+
+If you are using the default UI of DDV, data processing and management are handled internally.
+
+#### UI Customization
+The SDK offers extensive customization options, enabling developers to tailor the interface, toolbar, and annotation tools to meet specific application needs and branding requirements.
+
+#### Designed with Camera Capture in Mind
+Dynamsoft Document Viewer is designed for seamless integration with camera capture. It features five built-in viewer types, with the first three optimized for camera capture scenarios:
+- Edit Viewer: Provides image quality enhancement filters.
+
+- Capture Viewer: Includes built-in camera control for continuous capture.
+
+- Perspective Viewer: Equipped with document cropping features; for document detection, using Dynamsoft Document Normalizer is recommended.
+
+- Browse Viewer
+
+- Custom Viewer
+
+As part of the Mobile Web Capture solution, this viewer helps developers create efficient, accurate, and user-friendly workflows, from camera capture to document finalization.
 
 ## Table of Contents
 
@@ -50,7 +84,7 @@ Apart from the browsers, the operating systems may impose some limitations of th
 
 ## License Key
 
-[![](https://img.shields.io/badge/Get-30--day%20FREE%20Trial%20License-blue)](https://www.dynamsoft.com/customer/license/trialLicense/?product=ddv&utm_source=npm)
+[![](https://img.shields.io/badge/Get-30--day%20FREE%20Trial%20License-blue)](https://www.dynamsoft.com/customer/license/trialLicense/?product=mwc&utm_source=npm)
 
 ## Adding the dependency
 
@@ -70,8 +104,8 @@ Review the complete code:
     <meta http-equiv="X-UA-Compatible" content="IE=edge">
     <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
     <title>DDV - HelloWorld</title>
-    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/dynamsoft-document-viewer@1.1.0/dist/ddv.css">
-    <script src="https://cdn.jsdelivr.net/npm/dynamsoft-document-viewer@1.1.0/dist/ddv.js"></script>
+    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/dynamsoft-document-viewer@2.0.0/dist/ddv.css">
+    <script src="https://cdn.jsdelivr.net/npm/dynamsoft-document-viewer@2.0.0/dist/ddv.js"></script>
 </head>
 <style>
     html,body {
@@ -94,9 +128,9 @@ Review the complete code:
 <script type="module">
     (async () => {
         // Public trial license which is valid for 24 hours
-        // You can request a 30-day trial key from https://www.dynamsoft.com/customer/license/trialLicense/?product=ddv
+        // You can request a 30-day trial key from https://www.dynamsoft.com/customer/license/trialLicense/?product=mwc
         Dynamsoft.DDV.Core.license = "DLS2eyJvcmdhbml6YXRpb25JRCI6IjIwMDAwMSJ9";
-        Dynamsoft.DDV.Core.engineResourcePath = "https://cdn.jsdelivr.net/npm/dynamsoft-document-viewer@1.1.0/dist/engine";
+        Dynamsoft.DDV.Core.engineResourcePath = "https://cdn.jsdelivr.net/npm/dynamsoft-document-viewer@2.0.0/dist/engine";
         await Dynamsoft.DDV.Core.init();
         Dynamsoft.DDV.setProcessingHandler("imageFilter", new Dynamsoft.DDV.ImageFilter());
         const editViewer = new Dynamsoft.DDV.EditViewer({
@@ -118,10 +152,11 @@ Generally, the features of DDV can be divided to two parts as below.
 
 ### Data Management
 
-Data management is to manage the data which is imported into DDV. It is managed from the following two aspects:
+Data management is to manage the data which is imported into DDV. It is managed from the following three aspects:
 
 - Document Management: Document creation/deletion/merging, etc.
 - Page management: Pages in documents loading/saving/deleting/moving, etc.
+- Annotation management:  Adding/deleting/selecting/dragging/resizing/rotating annotations, etc. 
 
 ### Viewers