Merge branch 'dynamsoft-docs:preview' into preview

Author: icfung828

.github/workflows/main.yml

@@ -50,10 +50,10 @@ jobs:
         run: |
           cd /home/ubuntu
           [ ! -d web-twain-docs-preview ] && git clone --depth 1 --branch preview https://github.com/dynamsoft-docs/web-twain-docs.git web-twain-docs-preview
-          [ ! -d Docs-Template-Repo-preview ] && git clone --depth 1 --branch preview https://github.com/dynamsoft-docs/Docs-Template-Repo.git Docs-Template-Repo-preview
+          [ ! -d Docs-Template-Repo-Preview ] && git clone --depth 1 --branch preview https://github.com/dynamsoft-docs/Docs-Template-Repo.git Docs-Template-Repo-Preview
           [ ! -d DWTDocPreview ] && mkdir -p DWTDocPreview
           cd web-twain-docs-preview && git pull && cd .. && cp -rfp ./web-twain-docs-preview/* ./DWTDocPreview/
-          cd Docs-Template-Repo-preview && git pull && cd .. && cp -rfp ./Docs-Template-Repo-preview/* ./DWTDocPreview/
+          cd Docs-Template-Repo-Preview && git pull && cd .. && cp -rfp ./Docs-Template-Repo-Preview/* ./DWTDocPreview/
           sed -i -e "1,3s/blob\/master$/blob\/preview/" \
           -e "1,3s/blob\/main$/blob\/preview/" /home/ubuntu/DWTDocPreview/_config.yml
           cd DWTDocPreview && bundle exec jekyll build --incremental

_config.yml

@@ -33,7 +33,36 @@ theme: jekyll-theme-cayman
 
 useVersionTreeV2: true
 
+webp:
+  enabled: true
+  # The quality of the webp conversion 0 to 100 (where 100 is least lossy)
+  quality: 75
+  # List of directories containing images to optimize, nested directories will only be checked if `nested` is true
+  # By default the generator will search for a folder called `/img` under the site root and process all jpg, png and tiff image files found there.
+  img_dir: ["/assets/img-icon", "/assets/imgs/"]
+  # Whether to search in nested directories or not
+  nested: true
+  # add ".gif" to the format list to generate webp for animated gifs as well
+  formats: [".jpeg", ".jpg", ".png", ".tiff"]
+  # File extensions for animated gif files 
+  gifs: [".gif"]
+  # Set to true to always regenerate existing webp files
+  regenerate: false
+  # Local path to the WebP utilities to use (relative or absolute)
+  # Omit or leave as nil to use the utilities shipped with the gem, override only to use your local install
+  # Eg : "/usr/local/bin/cwebp"
+  webp_path: nil
+  # List of files or directories to exclude
+  # e.g. custom or hand generated webp conversion files
+  exclude: []
+  # append '.webp' to filename after original extension rather than replacing it.
+  # Default transforms `image.png` to `image.webp`, while changing to true transforms `image.png` to `image.png.webp`
+  append_ext: false
+
+
+
 plugins:
   - jemoji
+  - jekyll-webp
 
 url: "https://www.dynamsoft.com" # sitemap root

_data/full_tree.yml

@@ -40,7 +40,9 @@ tree_list:
           - name: Barcode Recognition
             path: /indepth/features/barcode.html
           - name: PDF Handling
-            path: /indepth/features/pdf.html  
+            path: /indepth/features/pdf.html 
+          - name: Remote Scan
+            path: https://www.dynamsoft.com/remote-scan/docs/introduction/ 
   - name: Samples and Demos
     childList:
       - name: Use Web TWAIN in Angular
@@ -49,8 +51,10 @@ tree_list:
         path: /indepth/development/react.html
       - name: Use Web TWAIN in Vue
         path: /indepth/development/vue.html
+      - name: Use Web TWAIN in Vue 3
+        path: /indepth/development/vue3.html
       - name: Simple Demo
-        path: /getstarted/Helloworld.html
+        path: https://www.dynamsoft.com/web-twain/resources/code-gallery/
   - name: API Reference
     path: /info/api/
     childList:
@@ -60,8 +64,8 @@ tree_list:
         path: /info/api/Dynamsoft_Enum.html
       - name: Interfaces
         path: /info/api/Interfaces.html
-      - name: Device
-        path: /info/api/Device.html
+      #- name: Device
+      #  path: /info/api/Device.html
       - name: WebTwain_Scanner
         path: /info/api/WebTwain_Acquire.html
       - name: WebTwain_Buffer
@@ -76,8 +80,8 @@ tree_list:
         path: /info/api/WebTwain_Util.html
       - name: Addon_BarcodeReader
         path: /info/api/Addon_BarcodeReader.html
-      - name: Addon_Camera
-        path: /info/api/Addon_Camera.html
+      # - name: Addon_Camera
+      #   path: /info/api/Addon_Camera.html
       - name: Addon_PDF
         path: /info/api/Addon_PDF.html
       - name: Addon_Webcam

_includes/version-list.html

@@ -1,6 +1,8 @@
 <span class="fullVersionHistory">
   <ul class="fullVersionInfo">
-    <li onclick="changeVersion(this)">Latest Version</li>
+    <li onclick="changeVersion(this)">Latest Version (18.2)</li>
+    <li onclick="changeVersion(this)">Version 18.1</li>
+    <li onclick="changeVersion(this)">Version 18.0</li>
     <li onclick="changeVersion(this)">Version 17.3</li>
     <li onclick="changeVersion(this)">Version 17.2.1</li>
     <li onclick="changeVersion(this)">Version 17.1.1</li>

_layouts/default-layout.html

@@ -15,27 +15,27 @@
 </style>
 
 <body>
-    <div class="headWrapper">
+    <header class="headWrapper">
         {%- include page_header.html -%}
-    </div>
+    </header>
     {%- include dwtNav.html -%}
     <div class="sideBarIcon"><i class="fa fa-list" style="margin-right: 5px;"></i> Table of contents</div>
-    <div class="container" id="categoryMenuTree">
+    <main class="container" id="categoryMenuTree">
         <div class="row">
-            <div class="sideBar col-xs-12 col-md-3 hide-xs hide-sm">
+            <aside class="sideBar col-xs-12 col-md-3 hide-xs hide-sm">
                 <div id="sideBarCnt">
                     <div class="docSearchPart" style="margin-top: 30px;">
                         <input id="txtSearch" class="search" type="text">
                     </div>
-                    <div class="mainPage">
+                    <nav class="mainPage">
                         <ul id="fullTreeMenuListContainer" name="listLevel1">
                             {%- assign treeList = site.data.full_tree.tree_list -%}
                             {%- include liquid_generateFullTree.html treeList=treeList -%}
                         </ul>
-                    </div>
+                    </nav>
                 </div>
-            </div>
-            <div class="docContainer col-xs-12 col-md-9">
+            </aside>
+            <section class="docContainer col-xs-12 col-md-9">
                 <div id="docHead" class = "head row hide-xs hide-sm">
                     {%- include main-page-head.html -%}
                 </div>
@@ -62,9 +62,9 @@
                         <div class="lds-ring"><div></div><div></div><div></div><div></div></div>
                     </div>
                 </div>
-            </div>
+            </section>
         </div>
-    </div>
+    </main>
 
     <div class="history list" id="categoryMenuTree_history">
         <div class="container">
@@ -75,14 +75,14 @@
         </div>
     </div>
 
-    <div id="footerWrapper">
+    <footer id="footerWrapper">
         {%- include page_footer.html -%}
-    </div>
-
-    <script type="text/javascript">anchors.add();</script>
-    <script type="text/javascript">UrlReplace();</script>
+    </footer>
 
     <script type="text/javascript">
+        $(".currentVersion").text("latest version (18.2)");
+        anchors.add();
+        UrlReplace();
         FullTreeMenuList('{{page.needAutoGenerateSidebar}}', '{{page.needGenerateH3Content}}');
     </script>
 

about/hardware.md

@@ -12,11 +12,14 @@ permalink: /getstarted/hardware.html
 
 Dynamic Web TWAIN's main feature is interacting with imaging devices like scanners and cameras. In this section, we'll look at the supported devices.
 
-- [TWAIN Scanners](#twain-scanners)
-- [ICA Scanners](#ica-scanners)
-- [SANE Scanners](#sane-scanners)
-- [DirectShow Cameras](#directshow-cameras)
-- [MediaDevices Cameras](#mediadevices-cameras)
+- [Imaging Hardware](#imaging-hardware)
+  - [TWAIN Scanners](#twain-scanners)
+    - [Facts about TWAIN](#facts-about-twain)
+  - [ICA Scanners](#ica-scanners)
+    - [Facts about ICA](#facts-about-ica)
+  - [SANE Scanners](#sane-scanners)
+    - [Facts about SANE](#facts-about-sane)
+  - [DirectShow Cameras](#directshow-cameras)
 
 ## TWAIN Scanners
 
@@ -72,12 +75,4 @@ See more: <a href="{{site.faq}}how-to-test-if-your-device-is-SANE-compliant.html
 
 `DirectShow Cameras` refer to the cameras which can be accessed via the [Microsoft DirectShow architecture](https://docs.microsoft.com/en-us/windows/win32/directshow/introduction-to-directshow). These cameras are either built into desktops / laptops or connected via USB.
 
-See more: <a href="{{site.faq}}how-to-test-if-your-camera-is-DirectShow-compliant.html" target="_blank">Is my Camera DirectShow Compliant?</a>  
-
-## MediaDevices Cameras
-
-`MediaDevices Cameras` refers to the cameras accessible via the [MediaDevices interface](https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices). These cameras are either built into desktops/laptops/mobile devices, including phones and tablets, or connected via USB.
-
-> `DirectShow Cameras` and `MediaDevices Cameras` could refer to the same devices which can be accessed either way.
-
-See more:  <a href="{{site.faq}}how-to-test-if-your-camera-is-MediaDevices-compliant.html" target="_blank">Is my Camera MediaDevices Compliant?</a> 
+See more: <a href="{{site.faq}}how-to-test-if-your-camera-is-DirectShow-compliant.html" target="_blank">Is my Camera DirectShow Compliant?</a>  

about/index.md

@@ -70,6 +70,19 @@ To ensure your data is safe, Dynamic Web TWAIN offers advanced security features
 
 Learn more about [Dynamic Web TWAIN Security Features](https://www.dynamsoft.com/Products/Dynamic-Web-TWAIN-Security-Features.pdf)
 
+
+## Example Apps
+
+Check out our Angular, React and Vue sample project on GitHub:
+
+![](https://www.dynamsoft.com/web-twain/docs/assets/imgs/download.png) [Sample of dwt-angular-advanced](https://github.com/dynamsoft-dwt/dwt-angular-advanced)  
+![](https://www.dynamsoft.com/web-twain/docs/assets/imgs/download.png) [Sample of dwt-react-advanced](https://github.com/Dynamsoft/web-twain-react-advanced)  
+![](https://www.dynamsoft.com/web-twain/docs/assets/imgs/download.png) [Sample of dwt-vue-advanced](https://github.com/Dynamsoft/web-twain-vue-advanced)
+
+## Live Online Demo
+
+Click <a href="https://demo.dynamsoft.com/web-twain/" target="_blank">here</a> to go to online demo.
+
 ## Assumptions
 
 These docs are meant for developers who are already familiar with HTML, CSS, JavaScript, and some related ideas, tools, etc.

assets/js/setLatestVersion.js

@@ -1,4 +1,4 @@
-var versionNoteLatestVersion = "18.0"
+var versionNoteLatestVersion = "18.2"
 
 $(function() {
   $("#versionNoteLatestVersion").text(" (" + versionNoteLatestVersion + ")")

faq/HTTP-process-error.md

@@ -15,7 +15,7 @@ permalink: /faq/HTTP-process-error.html
 
 ### Symptom
 
-When attempting to upload images using any of the HTTPUploadThroughPost\*\*\* methods the upload fails and you receive this error.
+When attempting to upload images using any of the HTTPUpload\*\*\* methods the upload fails and you receive this error.
 
 ### Cause
 

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 <a href="{{site.info}}api/Dynamsoft_WebTwainEnv.html#updatecert" target="_blank">UpdateCert</a> to automatically update the client side certificate.
+<!-- NOTE: For v17.2 or higher versions, you can use the new API <a href="{{site.info}}api/Dynamsoft_WebTwainEnv.html#updatecert" target="_blank">UpdateCert</a> to automatically update the client side certificate. -->