Knowledge Base :: How to use Dynamic Web TWAIN Plug-in and ActiveX on the same page?

Search the Knowledgebase

Browse by Category

Knowledgebase Home > Dynamic Web TWAIN > Develop with Dynamic Web TWAIN > Customize Your Scan

How to use Dynamic Web TWAIN Plug-in and ActiveX on the same page?

If you want your web application to be able to run in both IE and Firefox, you need to implement both Plug-in and ActiveX editions of Dynamic Web TWAIN on the same page. To achieve this, you can follow the steps below:

1. Add both controls in the page:

The Plug-in control:
<div style = "border:0px; height: 490px; width:510px; display:none" id="DIVFF">
     <embed id="DynamicWebTwainFF"
                TYPE="Application/DynamicWebTwain-Plugin"

                style="text-align:center;height: 480px; width: 500px"
                PLUGINSPAGE="DynamicWebTwain.xpi">
       </embed>
</div>

The ActiveX Control:
<div style = "text-align:center;border:0px; height:490px; width:510px; display:block" id="DIVIE">
       <object classid="clsid:FFC6F181-A5CF-4ec4-A441-093D7134FBF2" id="DynamicWebTwainIE" style="text-align:center;height: 480px; width: 500px"
                 codebase = "DynamicWebTWAIN.cab#version=6,1">
                    <param name="_cx" value="847" />
                    <param name="_cy" value="847" />
                    <param name="JpgQuality" value="80" />
                    <param name="Manufacturer" value="Dynamsoft Corporation" />
                    <param name="ProductFamily" value="Dynamic Web TWAIN" />
                    <param name="ProductName" value="Dynamic Web TWAIN" />
                    <param name="VersionInfo" value="Dynamic Web TWAIN 6.1" />
                    <param name="TransferMode" value="0" />
                    <param name="BorderStyle" value="0" />
                    <param name="HTTPPort" value="80" />
                    <param name="IfDisableSourceAfterAcquire" value="0" />
                    <param name="IfTiffMultiPage" value="0" />
                    <param name="IfThrowException" value="0" />
                    <param name="MaxImagesInBuffer" value="1" />
                    <param name="TIFFCompressionType" value="0" />
         </object>
</div>

Note: Change the classid to "E7DA7F8D-27AB-4EE9-8FC0-3FEC9ECFE758" if you are using the full version of Dynamic Web TWAIN ActiveX.

2. Call the right object according to the browser type in JavaScript:

        var Sys = {};
        var ua = navigator.userAgent.toLowerCase();
        var objScan;
        var objDIVIE;
        var objDIVFF;
        window.onload = initiate;
        function initiate() {
            objDIVIE = document.getElementById("DIVIE");
            objDIVFF = document.getElementById("DIVFF");
            if(ua.match(/firefox\/([\d.]+)/)||ua.match(/chrome\/([\d.]+)/)||ua.match(/opera.([\d.]+)/)||ua.match(/version\/([\d.]+).*safari/)){
                objDIVIE.style.display = "none";
                objDIVFF.style.display = "block";
                objScan = document.getElementById("DynamicWebTwainFF");
            }
            else if(ua.indexOf("msie") != -1){
                objDIVIE.style.display = "block";
                objDIVFF.style.display = "none";
                objScan = document.getElementById("DynamicWebTwainIE");
            }
           }

3. Since the parameter objScan in step 2 represents the Plug-in control in Firefox and the ActiveX control in IE, you can use the same code for both browsers.

For example, you can use the following code to scan images in both IE and Firefox.

        function btnScan_onclick() {
            objScan.SelectSource();
            objScan.OpenSource();
            objScan.IfShowUI = false;
            objScan.MaxImagesInBuffer = 100;
            objScan.SetViewMode(3,3);
            objScan.XferCount = -1;
            objScan.AcquireImage();
        }

Attached is a simple sample on how to use ActiveX & Plug-in on the same page.