From 24595197a5538cfbe48f5388bdd3afc3bc48c96f Mon Sep 17 00:00:00 2001
From: ztyyLV <97287824+ztyyLV@users.noreply.github.com>
Date: Fri, 3 Mar 2023 16:25:42 +0800
Subject: [PATCH] refactor
---
faq/change-dynamsoft-service-certificate.md | 2 +-
info/api/WebTwain_Viewer.md | 297 +++++++++++---------
2 files changed, 161 insertions(+), 138 deletions(-)
diff --git a/faq/change-dynamsoft-service-certificate.md b/faq/change-dynamsoft-service-certificate.md
index 61a13050..29a9d950 100644
--- a/faq/change-dynamsoft-service-certificate.md
+++ b/faq/change-dynamsoft-service-certificate.md
@@ -22,4 +22,4 @@ To replace the default certificate, the steps are:
- Replace the old keys in `C:\Windows\SysWOW64\Dynamsoft\DynamsoftServicex64_17\cert`
- Restart the service
-NOTE: For v17.2 or higher versions, you can use the new API UpdateCert to automatically update the client side certificate.
+
diff --git a/info/api/WebTwain_Viewer.md b/info/api/WebTwain_Viewer.md
index fdba6b9b..3e169aa7 100644
--- a/info/api/WebTwain_Viewer.md
+++ b/info/api/WebTwain_Viewer.md
@@ -2069,16 +2069,16 @@ The default value is null. You can specify the border by CSS. Read more on the [
## pageMargin
+Return or set the margin between images.
+
**Syntax**
```typescript
-/**
- * Return or set the margin between images.
- */
pageMargin: number | string;
```
**Availability**
+
@@ -2101,30 +2101,30 @@ pageMargin: number | string;
+**Usage Notes**
+
+The page margin is only effective when the view mode is not -1 \* -1 (in other words, [ `singlePageMode` ](#singlepagemode) is `false` ).
+
**Example**
```javascript
DWObject.Viewer.pageMargin = 10;
```
-**Usage Notes**
-
-The page margin is only effective when the view mode is not -1 \* -1 (in other words, [ `singlePageMode` ](#singlepagemode) is `false` ).
-
---
## selectedAreaBorderColor
+Set the border color of the selected area. Also applies to the selection box on the video opened by the method `showVideo`.
+
**Syntax**
```typescript
-/**
- * Set the border color of the selected area. Also applies to the selection box on the video opened by the method `showVideo`.
- */
selectedAreaBorderColor: string;
```
**Availability**
+
@@ -2147,30 +2147,30 @@ selectedAreaBorderColor: string;
+**Usage notes**
+
+The default value is "rgba(0, 0, 0, 1)".
+
**Example**
```javascript
DWObject.Viewer.selectedAreaBorderColor = "rgba(0, 0, 0, 1)";
```
-**Usage notes**
-
-The default value is "rgba(0, 0, 0, 1)".
-
---
## selectedPageBackground
+Set the selected page background color of the Thumbnail viewer.
+
**Syntax**
```typescript
-/**
- * Set the selected page background color of the Thumbnail viewer.
- */
selectedPageBackground: string;
```
**Availability**
+
@@ -2193,30 +2193,30 @@ selectedPageBackground: string;
+**Usage notes**
+
+The default value is "rgb(199, 222, 252)". You can specify the backgournd by CSS which may be a single color or even an image. Read more on the [background shorthand CSS](https://developer.mozilla.org/en-US/docs/Web/CSS/background).
+
**Example**
```javascript
DWObject.Viewer.selectedPageBackground = "rgb(255, 0, 0)";
```
-**Usage notes**
-
-The default value is "rgb(199, 222, 252)". You can specify the backgournd by CSS which may be a single color or even an image. Read more on the [background shorthand CSS](https://developer.mozilla.org/en-US/docs/Web/CSS/background).
-
---
## selectedPageBorder
+Return or set the border style for selected page(s).
+
**Syntax**
```typescript
-/**
- * Return or set the border style for selected page(s).
- */
selectedPageBorder: string;
```
**Availability**
+
@@ -2239,32 +2239,32 @@ selectedPageBorder: string;
-**Example**
-
-```javascript
-DWObject.Viewer.selectedPageBorder = "3px solid rgb(125,162,206)";
-```
-
**Usage Notes**
This API is only effective when the view mode is not -1 \* -1 (in other words, [ `singlePageMode` ](#singlepagemode) is `false` ).
The default value is "1px solid rgb(125, 162, 206)". Now you can specify the border by CSS. Read more on the [border shorthand CSS](https://developer.mozilla.org/en-US/docs/Web/CSS/border).
+**Example**
+
+```javascript
+DWObject.Viewer.selectedPageBorder = "3px solid rgb(125,162,206)";
+```
+
---
## selectionRectAspectRatio
+Specify an aspect ratio to be used when selecting an rectangular area on a page.
+
**Syntax**
```typescript
-/**
- * Specify an aspect ratio to be used when selecting an rectangular area on a page.
- */
selectionRectAspectRatio: number | string;
```
**Availability**
+
@@ -2287,30 +2287,30 @@ selectionRectAspectRatio: number | string;
+**Usage Notes**
+
+This API is only effective when drawing manually (it won't work if the selection is done with the API [`setSelectedAreas()`](#setselectedareas)).
+
**Example**
```javascript
DWObject.Viewer.selectionRectAspectRatio = 0.5;
```
-**Usage Notes**
-
-This API is only effective when drawing manually (it won't work if the selection is done with the API [`setSelectedAreas()`](#setselectedareas)).
-
---
## singlePageMode
+Set whether to use single page mode.
+
**Syntax**
```typescript
-/**
- * Set whether to use single page mode.
- */
singlePageMode: boolean;
```
**Availability**
+
@@ -2333,6 +2333,10 @@ singlePageMode: boolean;
+**Usage notes**
+
+The default value is `false`. If the thumbnail viewer is not shown, setting `singlePageMode` to `true` is equivalent to setting the view mode to -1 by -1. But if the thumbnail viewer is shown, `singlePageMode` will be changed to `true` automatically.
+
**Example**
```javascript
@@ -2347,24 +2351,20 @@ objThumbnailViewer.show();
DWObject.Viewer.singlePageMode = true;
```
-**Usage notes**
-
-The default value is `false`. If the thumbnail viewer is not shown, setting `singlePageMode` to `true` is equivalent to setting the view mode to -1 by -1. But if the thumbnail viewer is shown, `singlePageMode` will be changed to `true` automatically.
-
---
## width
+Return or set the width of the viewer.
+
**Syntax**
```typescript
-/**
- * Return or set the width of the viewer.
- */
width: number | string;
```
**Availability**
+
@@ -2387,6 +2387,12 @@ width: number | string;
+**Usage Notes**
+
+If a number is assigned, it means that number of pixels (px). If a string is assigned, it is either a fixed size like "500px" or a dynamic size like "50%" which follows standard CSS rules.
+
+When reading the property, the value is always in pixels no matter what value was set to it.
+
**Example**
```javascript
@@ -2395,26 +2401,20 @@ DWObject.Viewer.width = "270px";
DWObject.Viewer.width = "100%";
```
-**Usage Notes**
-
-If a number is assigned, it means that number of pixels (px). If a string is assigned, it is either a fixed size like "500px" or a dynamic size like "50%" which follows standard CSS rules.
-
-When reading the property, the value is always in pixels no matter what value was set to it.
-
---
## zoom
+Return or set the zoom factor, and then the current page will be enlarged or reduced.
+
**Syntax**
```typescript
-/**
- * Return or set the zoom factor, and then the current page will be enlarged or reduced.
- */
zoom: number;
```
**Availability**
+
@@ -2437,30 +2437,30 @@ zoom: number;
+**Usage Notes**
+
+The zoom factor is only effective when the view mode is -1 \* -1. Allowed values is from 0.02 to 65.
+
**Example**
```javascript
DWObject.Viewer.zoom = 2.0;
```
-**Usage Notes**
-
-The zoom factor is only effective when the view mode is -1 \* -1. Allowed values is from 0.02 to 65.
-
---
## autoChangeIndex
+Set whether to make sure the first image in the viewer is always selected when scrolling through multiple images. The default value is false.
+
**Syntax**
```typescript
-/**
- * Set whether to make sure the first image in the viewer is always selected when scrolling through multiple images. The default value is false.
- */
autoChangeIndex: boolean;
```
**Availability**
+
@@ -2483,27 +2483,25 @@ autoChangeIndex: boolean;
+**Usage Notes**
+
+When set to true, the index in the upper left corner of the viewer will be selected when scrolling.
+
**Example**
```javascript
DWObject.Viewer.autoChangeIndex = true;
```
-**Usage Notes**
-
-When set to true, the index in the upper left corner of the viewer will be selected when scrolling.
-
---
## updateCheckboxStyle
+Update checkbox style
+
**Syntax**
```typescript
-/**
- * Update checkbox style
- * @argument checkboxSettings Settings for checkboxex.
- */
updateCheckboxStyle(checkboxSettings?: CheckboxSettings): void;
interface CheckboxSettings {
@@ -2527,7 +2525,12 @@ interface CheckboxSettings {
```
+**Parameters**
+
+`checkboxSettings`: Settings for checkboxex.
+
**Availability**
+
@@ -2554,13 +2557,11 @@ interface CheckboxSettings {
## updatePageNumberStyle
+Update page number style
+
**Syntax**
```typescript
-/**
- * Update page number style
- * @argument pageNumberSettings Settings for page numbers.
- */
updatePageNumberStyle(pageNumberSettings?: PageNumberSettings): void;
interface pageNumberSettings {
@@ -2582,10 +2583,14 @@ interface pageNumberSettings {
translateX?: number | string; //default: "", number unit: px, string value: "10px"/"10%", relative to itself
translateY?: number | string //default: "", number unit: px, string value: "10px"/"10%", relative to itself
}
-
```
+**Parameters**
+
+`pageNumberSettings`: Settings for page numbers.
+
**Availability**
+
@@ -2612,16 +2617,16 @@ interface pageNumberSettings {
## selectionMode
+Return or set the selection mode used.
+
**Syntax**
```typescript
-/**
- * Return or set the selection mode used.
- */
selectionMode: Dynamsoft.DWT.EnumDWT_SelectionMode | number;
```
**Availability**
+
@@ -2644,6 +2649,10 @@ selectionMode: Dynamsoft.DWT.EnumDWT_SelectionMode | number;
+**Usage notes**
+
+The default value is 0 (Single). Even if checkbox is used, only one image can be selected if the selection mode is set to 0 (Single).
+
**Example**
```javascript
@@ -2655,10 +2664,6 @@ DWObject.Viewer.updateCheckboxStyle({
DWObject.Viewer.selectionMode = Dynamsoft.DWT.EnumDWT_SelectionMode.Multiple; // Multiple Selection
```
-**Usage notes**
-
-The default value is 0 (Single). Even if checkbox is used, only one image can be selected if the selection mode is set to 0 (Single).
-
---
@@ -2666,19 +2671,14 @@ The default value is 0 (Single). Even if checkbox is used, only one image can be
### On
+Built-in callbacks that are triggered for a certain mouse event or keyboard event on a page.
+
**Syntax**
```typescript
-/**
- * Built-in callbacks that are triggered for a certain mouse event or keyboard event on a page.
- * @param eventName Specify the event. Value: click, contextmenu, dblclick, mousemove, mousedown, mouseup, mouseout, mouseover, keydown, keyup.
- * @param callback Specify the callback.
- * @argument dwtEvent The viewer-specific event object.
- * @argument domEvent The original mouse event object.
- */
on(
eventName: string,
- callback: (event: ViewerEvent | KeyboardEvent, domEvent: MouseEvent) => void
+ callback: (dwtEvent: ViewerEvent | KeyboardEvent, domEvent: MouseEvent) => void
): void;
interface ViewerEvent{
@@ -2695,6 +2695,43 @@ interface ViewerEvent{
};
```
+**Parameters**
+
+`eventName`: Specify the event. Value: click, contextmenu, dblclick, mousemove, mousedown, mouseup, mouseout, mouseover, keydown, keyup.
+
+`callback`: Specify the callback.
+- `dwtEvent`: The viewer-specific event object.
+- `domEvent`: The original mouse event object.
+
+**Availability**
+
+
+
+
+
+| ActiveX |
+H5(Windows) |
+H5(macOS/TWAIN) |
+H5(macOS/ICA) |
+H5(Linux) |
+
+
+
+| v16.2+ (partially supported) |
+v16.2+ |
+v16.2+ |
+v16.2+ |
+v16.2+ |
+
+
+
+
+
+**Usage notes**
+
+The events `mouseout`, `mouseover`, `keydown` and `keyup` are only triggered on desktop browsers.
+The events `click`, `dbclick`, `mousemove`, `pageAreaSelected`, and `pageAreaUnselected` are supported in ActiveX.
+
**Example**
```javascript
@@ -2739,46 +2776,15 @@ DWObject.Viewer.on("keyup", function (keyboardEvent) {
});
```
-**Availability**
-
-
-
-
-| ActiveX |
-H5(Windows) |
-H5(macOS/TWAIN) |
-H5(macOS/ICA) |
-H5(Linux) |
-
-
-
-| v16.2+ (partially supported) |
-v16.2+ |
-v16.2+ |
-v16.2+ |
-v16.2+ |
-
-
-
-
-
-**Usage notes**
-
-The events `mouseout`, `mouseover`, `keydown` and `keyup` are only triggered on desktop browsers.
-The events `click`, `dbclick`, `mousemove`, `pageAreaSelected`, and `pageAreaUnselected` are supported in ActiveX.
-
---
### pageAreaSelected
+This event is triggered when user selects an area (draws a rectangle) or move a selected area on the current page.
+
**Syntax**
```typescript
-/**
- * This event is triggered when user selects an area (draws a rectangle) or move a selected area on the current page.
- * @argument index The index of the current page.
- * @argument rect Some attribute values of the selected area.
- */
on('pageAreaSelected',
(index: number, rect: rect)=> void
): void;
@@ -2797,7 +2803,14 @@ interface rect{
};
```
+**Parameters**
+
+`index`: The index of the current page.
+
+`rect`: Some attribute values of the selected area.
+
**Availability**
+
@@ -2834,19 +2847,22 @@ DWObject.Viewer.off("pageAreaSelected");
### pageAreaUnselected
+This event is triggered when selected area(s) get cleared (when the user clicks outside of the drawn rectangle).
+
**Syntax**
```typescript
-/**
- * This event is triggered when selected area(s) get cleared (when the user clicks outside of the drawn rectangle).
- * @argument index The index of the current page.
- */
on('pageAreaUnselected',
(index: number) => void
): void;
```
+**Parameters**
+
+`index`: The index of the current page.
+
**Availability**
+
@@ -2887,19 +2903,22 @@ DWObject.Viewer.off("pageAreaUnselected");
### pageRendered
+This event is triggered when a page is rendered.
+
**Syntax**
```typescript
-/**
- * This event is triggered when a page is rendered.
- * @argument index The index of the current page.
- */
on('pageRendered',
(index: number) => void
): void;
```
+**Parameters**
+
+`index`: The index of the current page.
+
**Availability**
+
@@ -2935,20 +2954,24 @@ DWObject.Viewer.render(); //It will trigger the pageRendered event
### resize
+This event is triggered when width & height of the viewer has been changed.
+
**Syntax**
```typescript
-/**
- * This event is triggered when width & height of the viewer has been changed.
- * @argument width The new width of the viewer.
- * @argument height The new height of the viewer.
- */
on('resize',
(width: number, height: number) => void
): void;
```
+**Parameters**
+
+`width`: The new width of the viewer.
+
+`height`: The new height of the viewer.
+
**Availability**
+