Merge branch 4.x

doc/js_tutorials/js_assets/js_houghcircles_HoughCirclesP.html

@@ -47,7 +47,7 @@ let color = new cv.Scalar(255, 0, 0);
 cv.cvtColor(src, src, cv.COLOR_RGBA2GRAY, 0);
 // You can try more different parameters
 cv.HoughCircles(src, circles, cv.HOUGH_GRADIENT,
-                1, 45, 75, 40, 0, 0);
+                1, 45, 175, 40, 0, 0);
 // draw circles
 for (let i = 0; i < circles.cols; ++i) {
     let x = circles.data32F[i * 3];

doc/js_tutorials/js_assets/js_setup_usage.html

@@ -36,7 +36,8 @@ inputElement.addEventListener('change', (e) => {
     imgElement.src = URL.createObjectURL(e.target.files[0]);
 }, false);
 
-imgElement.onload = function() {
+imgElement.onload = async function() {
+    cv = (cv instanceof Promise) ? await cv : cv;
     let mat = cv.imread(imgElement);
     cv.imshow('canvasOutput', mat);
     mat.delete();

doc/js_tutorials/js_imgproc/js_watershed/js_watershed.markdown

@@ -17,7 +17,7 @@ nearby, water from different valleys, obviously with different colors will start
 that, you build barriers in the locations where water merges. You continue the work of filling water
 and building barriers until all the peaks are under water. Then the barriers you created gives you
 the segmentation result. This is the "philosophy" behind the watershed. You can visit the [CMM
-webpage on watershed](http://cmm.ensmp.fr/~beucher/wtshed.html) to understand it with the help of
+webpage on watershed](https://people.cmm.minesparis.psl.eu/users/beucher/wtshed.html) to understand it with the help of
 some animations.
 
 But this approach gives you oversegmented result due to noise or any other irregularities in the

doc/js_tutorials/js_setup/js_setup/js_setup.markdown

@@ -73,6 +73,10 @@ Building OpenCV.js from Source
 ---------------------------------------
 
 -#  To build `opencv.js`, execute python script `<opencv_src_dir>/platforms/js/build_js.py <build_dir>`.
+    The build script builds WebAssembly version by default(`--build_wasm` switch is kept by back-compatibility reason).
+    By default everything is bundled into one JavaScript file by `base64` encoding the WebAssembly code. For production
+    builds you can add `--disable_single_file` which will reduce total size by writing the WebAssembly code
+    to a dedicated `.wasm` file which the generated JavaScript file will automatically load.
 
     For example, to build in `build_js` directory:
     @code{.bash}
@@ -82,16 +86,6 @@ Building OpenCV.js from Source
     @note
     It requires `python` and `cmake` installed in your development environment.
 
--#  The build script builds asm.js version by default. To build WebAssembly version, append `--build_wasm` switch.
-    By default everything is bundled into one JavaScript file by `base64` encoding the WebAssembly code. For production
-    builds you can add `--disable_single_file` which will reduce total size by writing the WebAssembly code
-    to a dedicated `.wasm` file which the generated JavaScript file will automatically load.
-
-    For example, to build wasm version in `build_wasm` directory:
-    @code{.bash}
-    emcmake python ./opencv/platforms/js/build_js.py build_wasm --build_wasm
-    @endcode
-
 -#  [Optional] To build the OpenCV.js loader, append `--build_loader`.
 
     For example:

doc/js_tutorials/js_setup/js_usage/js_usage.markdown

@@ -63,13 +63,16 @@ Example for asynchronous loading
 ### Use OpenCV.js
 
 Once `opencv.js` is ready, you can access OpenCV objects and functions through `cv` object.
+The promise-typed `cv` object should be unwrap with `await` operator.
+See https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/await .
 
 For example, you can create a cv.Mat from an image by cv.imread.
 
 @note Because image loading is asynchronous, you need to put cv.Mat creation inside the `onload` callback.
 
 @code{.js}
-imgElement.onload = function() {
+imgElement.onload = await function() {
+  cv = (cv instanceof Promise) ? await cv : cv;
   let mat = cv.imread(imgElement);
 }
 @endcode
@@ -116,7 +119,8 @@ inputElement.addEventListener('change', (e) => {
   imgElement.src = URL.createObjectURL(e.target.files[0]);
 }, false);
 
-imgElement.onload = function() {
+imgElement.onload = async function() {
+  cv = (cv instanceof Promise) ? await cv : cv;
   let mat = cv.imread(imgElement);
   cv.imshow('canvasOutput', mat);
   mat.delete();