Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 3 additions & 2 deletions guides/mrz-scanner-customization.md
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@ permalink: /guides/mrz-scanner-customization.html

# Customizing the MRZ Scanner JavaScript Edition

>**Prerequisite**
>[!NOTE]
>
>Before going into the ways that you can customize the MRZ Scanner, please read the [MRZ Scanner JavaScript Edition User Guide]({{ site.guides }}mrz-scanner.html).

Expand Down Expand Up @@ -43,6 +43,7 @@ Next, we go over the different ways that these properties can be used to customi

### Setting Available MRTD formats

> [!TIP]
> Prerequisite: [Introduction to MRZ Formats]({{ site.introduction }}index.html#supported-mrz-formats)

The MRZ Scanner reads all three MRZ formats, but it can optionally restrict the MRZ format that it reads. For example, you may want to configure MRZ scanner to only read **TD1** and passport (**TD3**) document types, while **ignoring TD2** documents. Here is a quick snippet based on the Hello World code (from the [User Guide]({{ site.guides }}mrz-scanner.html)) that sets the specific MRZ formats to read using the `mrzFormatType1` property:
Expand Down Expand Up @@ -93,7 +94,7 @@ const mrzScanner = new Dynamsoft.MRZScanner({

2. **`enableMultiFrameCrossFilter`** (default value `false`) - enable the multi-frame result cross filter to improve read accuracy at the cost of a slight increase to MRZ read time.

> **Important Note**
> [!NOTE]
>
> Not every UI element of the MRZScannerView can be controlled by the MRZScannerViewConfig. Namely, the **torch/flash button** will always show up in the **MRZScannerView**.

Expand Down
18 changes: 10 additions & 8 deletions guides/mrz-scanner.md
Original file line number Diff line number Diff line change
Expand Up @@ -13,15 +13,17 @@ permalink: /guides/mrz-scanner.html

This user guide will walk you through a Hello World sample web application that scans MRZ documents using the MRZ Scanner JavaScript Edition SDK. We recommend using this sample as a reference when creating your own application.

**Important**: Please visit the [Introduction]({{ site.introduction }}index.md) page to learn about the MRZ document formats, the architecture of the MRZ Scanner with respect to other Dynamsoft products, and the system requirements of the MRZ Scanner JavaScript Edition.
> [!TIP]
> Please visit the [Introduction]({{ site.introduction }}index.html) page to learn about the MRZ document formats, the architecture of the MRZ Scanner with respect to other Dynamsoft products, and the system requirements of the MRZ Scanner JavaScript Edition.

## License

### Trial License

When getting started with MRZ Scanner, we recommend getting your own 30-day trial license through the [customer portal](https://www.dynamsoft.com/customer/license/trialLicense/?product=mrz&utm_source=guide&package=js). The trial license can be renewed via the same customer portal twice, each time for another 15 days, giving you a total of 60 days to develop your own application using the solution. Please contact the [Dynamsoft Support Team](https://www.dynamsoft.com/company/contact/) if you need more time for a full evaluation.

> Note: The **MRZ Scanner** license contains a license for the **Dynamsoft Label Recognizer**, **Dynamsoft Code Parser**, and the **Dynamsoft Camera Enhancer** since the MRZ Scanner builds on top of those three products.
> [!NOTE]
> The **MRZ Scanner** license contains a license for the **Dynamsoft Label Recognizer**, **Dynamsoft Code Parser**, and the **Dynamsoft Camera Enhancer** since the MRZ Scanner builds on top of those three products.

### Full License

Expand Down Expand Up @@ -60,9 +62,8 @@ When using a framework such as **React**, **Vue** or **Angular**, we recommend a
yarn add dynamsoft-mrz-scanner@2.0.0 -E
```

**Important Note:**

When using a package manager like **npm** or **yarn**, you likely need to specify the location of the engine files as a link to a CDN. Please see the [`MRZScannerConfig` API]({{ site.api }}mrz-scanner.html#mrzscannerconfig) for a code snippet on how to set the `engineResourcePaths`.
> [!WARNING]
> When using a package manager like **npm** or **yarn**, you likely need to specify the location of the engine files as a link to a CDN. Please see the [MRZScannerConfig API]({{ site.api }}mrz-scanner.html#mrzscannerconfig) for a code snippet on how to set the *engineResourcePaths*.

Below is the complete Hello World sample page that uses the precompiled script served via a CDN.

Expand Down Expand Up @@ -93,7 +94,7 @@ Below is the complete Hello World sample page that uses the precompiled script s
</html>
```

>Note:
> [!NOTE]
>
> This code is identical to the Hello World file mentioned in *Build from Source*, except for the script source.
>
Expand Down Expand Up @@ -167,7 +168,7 @@ Let's now go through the code of the Hello World sample to understand how the co
</html>
```

The first step in setting up the HTML in the Hello World project is to include the SDK. (We discussed the two available methods to include the SDK resources in the earlier section [Quick Start](#quick-start---including-the-sdk-and-creating-hello-world) section) In this example, we include the precompiled MRZ Scanner SDK script via CDN in the header:
The first step in setting up the HTML in the Hello World project is to include the SDK. (We discussed the two available methods to include the SDK resources in the earlier section [Quick Start](#quick-start---hello-world) section) In this example, we include the precompiled MRZ Scanner SDK script via CDN in the header:

MRZ Scanner comes with a **Ready-to-Use UI**. When the MRZ Scanner launches, it creates a container which it populates with the **Ready-to-Use UI**.

Expand Down Expand Up @@ -236,7 +237,8 @@ Here is a quick breakdown of the constituent UI elements of the result view:

4. **Done Button**: This button closes the scanner and destroys the **`MRZScanner`** instance, and returns the result object containing the MRZ scan. At that point, the application goes back to the landing page. You can additionally dictate further actions upon the button click, such as allowing the user to perform some extra actions with the MRZ result, navigating to another page, passing the result object for further processing, and more.

>Note: In the Hello World sample, no action is taken once the Done button is clicked. The scanner closes and the user is met with an empty page. In order to open the scanner again, the user must refresh the page. You may choose to implement a more user-friendly behavior in a production environment, such as presenting the user with an option to re-open the MRZ Scanner upon closing it.
> [!NOTE]
> In the Hello World sample, no action is taken once the Done button is clicked. The scanner closes and the user is met with an empty page. In order to open the scanner again, the user must refresh the page. You may choose to implement a more user-friendly behavior in a production environment, such as presenting the user with an option to re-open the MRZ Scanner upon closing it.

## Next Steps

Expand Down